/* ── KaratIQ — Premium Jeweler Dashboard ─────────────────────────── */
:root {
  /* Fresh warm-neutral palette */
  --bg:       #F5F0E8;
  --bg2:      #EDE8DC;
  --card:     #FFFFFF;
  --card-s:   rgba(255,255,255,0.75);
  --border:   rgba(0,0,0,0.07);
  --border-s: rgba(0,0,0,0.12);
  --text:     #1A1410;
  --text2:    #5A5040;
  --muted:    #9A8F80;

  --gold:     #B8860B;
  --gold-l:   #D4AF37;
  --gold-bg:  rgba(184,134,11,0.08);
  --gold-bg2: rgba(212,175,55,0.15);

  --green:    #1A7A4A;
  --green-bg: rgba(26,122,74,0.1);
  --red:      #C0392B;
  --red-bg:   rgba(192,57,43,0.1);

  --radius:   18px;
  --radius-s: 10px;
  --shadow:   0 2px 16px rgba(0,0,0,0.07), 0 1px 3px rgba(0,0,0,0.05);
  --shadow-h: 0 8px 32px rgba(0,0,0,0.12);
  --font:     'Inter', sans-serif;
  --serif:    'Cormorant Garamond', serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--font);
  background:
    radial-gradient(1200px 520px at -10% -12%, rgba(14,165,233,.12), transparent 58%),
    radial-gradient(980px 420px at 108% -8%, rgba(212,175,55,.14), transparent 60%),
    linear-gradient(180deg, #f8f4ec 0%, #f3ede2 42%, #efe8dc 100%);
  color:var(--text);
  min-height:100vh;
  font-size:15px;
  -webkit-font-smoothing:antialiased;
}

/* ── NAVBAR ── */
.navbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:.85rem 2rem;
  background:rgba(255,255,255,0.9);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:100;
}

.logo{display:flex;align-items:center;gap:.75rem}
.logo-gem{display:flex;align-items:center}
.logo-text{display:flex;flex-direction:column;gap:0}
.logo-name{font-family:var(--serif);font-size:1.5rem;color:var(--text);line-height:1}
.logo-iq{color:var(--gold)}
.logo-sub{font-size:.62rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-top:.1rem}

.nav-status{display:flex;align-items:center;gap:.5rem}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--green);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.85)}}
.live-text{font-size:.72rem;font-weight:700;color:var(--green);letter-spacing:.06em}
.nav-ts{font-size:.72rem;color:var(--muted)}

.nav-right{display:flex;align-items:center;gap:.75rem}
.nav-view-switcher{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.nav-view-btn{
  padding:8px 14px;
  background:#f3f4f6;
  border:1px solid #e5e7eb;
  border-radius:6px;
  font-size:13px;
  font-weight:500;
  color:var(--text2);
  cursor:pointer;
  margin-right:8px;
  transition:all .2s;
}
.nav-view-btn:last-child{margin-right:0}
.nav-view-btn:hover{background:#e8edf3;border-color:#cbd5e1;color:var(--text)}
.nav-view-btn.active{background:#dbeafe;border-color:#0284c7;color:#0c4a6e;font-weight:600}
.nav-clock{font-size:.88rem;font-variant-numeric:tabular-nums;color:var(--text2)}
.btn-icon{
  background:var(--card);border:1px solid var(--border-s);border-radius:9px;
  padding:.45rem .5rem;cursor:pointer;display:flex;align-items:center;
  color:var(--text2);transition:all .2s;
}
.btn-icon:hover{background:var(--gold);border-color:var(--gold);color:#fff}
.btn-icon-i{width:16px;height:16px}
.btn-icon.spin .btn-icon-i{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── GRID ── */
.grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.25rem;
  padding:1.5rem 2rem 2rem;
  max-width:1440px;margin:0 auto;
  position:relative;
}
.grid > .card{min-height:0;align-self:start}
.span-2{grid-column:span 2}
.span-3{grid-column:span 3}
.row-2{grid-row:span 2}

/* ── CARDS ── */
.card{
  --card-glow-a: rgba(14,165,233,.10);
  --card-glow-b: rgba(212,175,55,.12);
  --card-tint-top: rgba(255,255,255,.95);
  --card-tint-bottom: rgba(248,250,252,.84);
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:linear-gradient(160deg, var(--card-tint-top), var(--card-tint-bottom));
  border:1px solid rgba(148,163,184,.22);
  border-radius:var(--radius);
  padding:1.4rem;
  box-shadow:0 12px 34px rgba(15,23,42,.08), 0 1px 0 rgba(255,255,255,.75) inset;
  backdrop-filter:blur(10px);
  display:flex;flex-direction:column;gap:1rem;
  transition:transform .25s, box-shadow .25s, border-color .25s;
}
.card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(520px 180px at -10% -18%, var(--card-glow-a), transparent 60%),
    radial-gradient(360px 160px at 110% -16%, var(--card-glow-b), transparent 62%);
  opacity:.95;
}
.card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(148,163,184,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,163,184,.06) 1px, transparent 1px);
  background-size:24px 24px;
  mask-image:radial-gradient(circle at 26% 12%, rgba(0,0,0,.72), rgba(0,0,0,.22) 58%, transparent 92%);
  opacity:.65;
}
.card > *{position:relative;z-index:1}
.card:hover{transform:translateY(-2px);box-shadow:0 20px 44px rgba(15,23,42,.13);border-color:rgba(14,165,233,.22)}

/* Labels */
.card-label{display:flex;align-items:center;gap:.5rem;font-size:.75rem;font-weight:700;color:#7c6d5e;text-transform:uppercase;letter-spacing:.09em}
.card-label i{width:15px;height:15px;color:var(--gold);filter:drop-shadow(0 1px 6px rgba(184,134,11,.25))}
.card-label-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem}

.prices-card{--card-glow-a: rgba(245,158,11,.12); --card-glow-b: rgba(212,175,55,.16);}
.prediction-card{--card-glow-a: rgba(16,185,129,.12); --card-glow-b: rgba(14,165,233,.10);}
.chart-card{--card-glow-a: rgba(59,130,246,.10); --card-glow-b: rgba(212,175,55,.10);}
.dealers-card{--card-glow-a: rgba(14,165,233,.10); --card-glow-b: rgba(16,185,129,.10);}
.news-card{--card-glow-a: rgba(245,158,11,.11); --card-glow-b: rgba(59,130,246,.09);}
.analysis-card{--card-glow-a: rgba(16,185,129,.11); --card-glow-b: rgba(212,175,55,.08);}
.diamonds-card{--card-glow-a: rgba(56,189,248,.10); --card-glow-b: rgba(168,85,247,.08);}
.catalog-card{--card-glow-a: rgba(251,191,36,.10); --card-glow-b: rgba(244,114,182,.08);}

/* ── PRICES CARD ── */
.prices-card{background:linear-gradient(145deg, rgba(255,255,255,.96), rgba(253,248,238,.9))}
.prices-row{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.price-main{display:flex;flex-direction:column;gap:.15rem}
.price-currency{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;display:flex;align-items:center;gap:.4rem}
.price-big{font-size:2.6rem;font-weight:800;color:var(--gold);line-height:1;letter-spacing:-.03em}
.price-mid{font-size:1.5rem;font-weight:700;color:var(--text)}
.price-sub{font-size:.78rem;color:var(--text2)}
.price-sub strong{color:var(--text)}
.price-sep{width:1px;height:50px;background:var(--border-s);flex-shrink:0}
.price-block{display:flex;flex-direction:column;gap:.15rem}

.price-source-tag{
  display:inline-block;background:var(--gold);color:#fff;
  font-size:.62rem;font-weight:700;letter-spacing:.08em;
  padding:.15rem .5rem;border-radius:5px;width:fit-content;margin-bottom:.2rem;
}
.src-badge{
  background:var(--gold-bg);color:var(--gold);
  font-size:.62rem;font-weight:600;padding:.1rem .4rem;border-radius:4px;
}

.change-block{display:flex;flex-direction:column;align-items:flex-end;gap:.2rem;margin-left:auto}
.change-badge{font-size:1.1rem;font-weight:800;padding:.3rem .8rem;border-radius:9px;background:var(--bg2)}
.change-badge.pos{background:var(--green-bg);color:var(--green)}
.change-badge.neg{background:var(--red-bg);color:var(--red)}
.change-label{font-size:.65rem;color:var(--muted)}

.price-source-note{
  font-size:.68rem;color:var(--muted);display:flex;align-items:center;gap:.3rem;
  padding-top:.5rem;border-top:1px solid var(--border);
}

/* ── PREDICTION ── */
.prediction-card{background:linear-gradient(145deg, rgba(255,255,255,.96), rgba(248,253,250,.9))}
.signal-wrap{display:flex;align-items:center;justify-content:space-between}
.signal{
  display:flex;align-items:center;gap:.6rem;
  padding:.7rem 1.1rem;border-radius:11px;font-weight:800;font-size:1rem;
  background:var(--bg2);color:var(--text2);
  flex:1;
}
.signal.buy{background:var(--green-bg);color:var(--green)}
.signal.sell{background:var(--red-bg);color:var(--red)}
.signal.watch{background:var(--gold-bg);color:var(--gold)}
.signal i{width:20px;height:20px}
.signal-est{font-size:1.3rem;font-weight:800;color:var(--text2);padding-left:1rem}
.signal-est.pos{color:var(--green)}
.signal-est.neg{color:var(--red)}

.signal-desc{font-size:.82rem;color:var(--text2);line-height:1.55}

.conf-row{display:flex;align-items:center;gap:.6rem}
.conf-label{font-size:.7rem;color:var(--muted);white-space:nowrap}
.conf-bar{flex:1;height:5px;border-radius:3px;background:var(--bg2)}
.conf-fill{height:100%;border-radius:3px;background:linear-gradient(90deg,var(--gold),var(--gold-l));transition:width .7s ease}
.conf-pct{font-size:.72rem;font-weight:700;color:var(--gold);min-width:32px}

.factors-wrap{border-top:1px solid var(--border);padding-top:.75rem}
.factors-title{font-size:.68rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;margin-bottom:.5rem}
.factors-list{display:flex;flex-direction:column;gap:.35rem}
.factor-row{display:flex;align-items:center;justify-content:space-between;font-size:.78rem}
.factor-name{display:flex;align-items:center;gap:.35rem;color:var(--text2)}
.factor-bull{color:var(--green)}
.factor-bear{color:var(--red)}
.factor-detail{font-weight:600;color:var(--text)}
.method-note{font-size:.65rem;color:var(--muted);font-style:italic;border-top:1px solid var(--border);padding-top:.6rem}

/* ── CALCULATOR ── */
.calc-card{background:linear-gradient(135deg,#fff 0%,#F8F5FF 100%)}
.calc-body{display:flex;flex-direction:column;gap:.8rem}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.field{display:flex;flex-direction:column;gap:.3rem}
.field label{font-size:.7rem;font-weight:500;color:var(--muted)}
.inp{
  background:var(--bg);border:1px solid var(--border-s);border-radius:9px;
  padding:.6rem .85rem;font-family:inherit;font-size:.92rem;color:var(--text);
  outline:none;transition:border-color .2s;width:100%;
}
.inp:focus{border-color:var(--gold)}

.calc-result-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.calc-result-item{
  background:var(--bg);border-radius:11px;padding:.8rem 1rem;
  border:1px solid var(--border);
}
.calc-result-item.primary{background:var(--gold-bg2);border-color:var(--gold)}
.calc-result-label{font-size:.68rem;color:var(--muted);margin-bottom:.2rem}
.calc-result-val{font-size:1.1rem;font-weight:800;color:var(--text)}
.calc-result-item.primary .calc-result-val{color:var(--gold)}
.source-line{font-size:.65rem;color:var(--muted);text-align:right}

/* ── CHART ── */
.chart-card{background:linear-gradient(145deg, rgba(255,255,255,.96), rgba(248,250,252,.9))}
.chart-area{flex:1;min-height:200px;position:relative}
.tab-group{display:flex;gap:.3rem}
.tab{
  padding:.22rem .65rem;border:1px solid var(--border-s);border-radius:6px;
  background:transparent;font-size:.75rem;font-family:inherit;cursor:pointer;color:var(--text2);
  transition:all .2s;
}
.tab.active{background:var(--gold);border-color:var(--gold);color:#fff;font-weight:600}

/* ── DEALERS ── */
.dealers-list{display:flex;flex-direction:column;gap:.6rem}
.dealer-item{
  display:grid;grid-template-columns:1fr auto;gap:.5rem .8rem;align-items:center;
  padding:.8rem .9rem;border-radius:11px;border:1px solid rgba(148,163,184,.18);
  background:linear-gradient(160deg, rgba(255,255,255,.86), rgba(248,250,252,.75));text-decoration:none;color:var(--text);
  box-shadow:0 6px 16px rgba(15,23,42,.05);
  transition:all .2s;
}
.dealer-item:hover{background:linear-gradient(160deg, rgba(255,251,235,.94), rgba(254,243,199,.74));border-color:rgba(212,175,55,.48);box-shadow:0 10px 24px rgba(180,132,11,.14)}
.dealer-name{font-size:.9rem;font-weight:600}
.dealer-addr{font-size:.7rem;color:var(--muted)}
.dealer-prices{display:flex;flex-direction:column;align-items:flex-end;gap:.15rem}
.dealer-buy{font-size:.75rem;color:var(--green);font-weight:600}
.dealer-sell{font-size:.75rem;color:var(--red);font-weight:600}
.dealer-spread{font-size:.65rem;color:var(--muted)}
.dealer-best{display:inline-block;background:var(--green-bg);color:var(--green);font-size:.62rem;font-weight:700;padding:.12rem .5rem;border-radius:5px;margin-top:.15rem}
.dealers-note{font-size:.66rem;color:var(--muted);font-style:italic}

.live-tag{display:inline-block;background:var(--green-bg);color:var(--green);font-size:.6rem;font-weight:700;padding:.1rem .4rem;border-radius:4px;margin-left:.3rem}
.est-tag{display:inline-block;background:var(--gold-bg);color:var(--gold);font-size:.6rem;font-weight:700;padding:.1rem .4rem;border-radius:4px;margin-left:.3rem}
.dealer-source{font-size:.66rem;color:var(--gold);margin-top:.15rem;text-decoration:underline;text-underline-offset:2px}
.dealer-ts{font-size:.64rem;color:var(--muted);margin-top:.1rem}
.dealer-note{font-size:.66rem;color:var(--muted);font-style:italic;padding:.1rem .9rem .4rem;margin-top:-.4rem}
.dealer-sell strong{color:var(--text)}


/* ── NEWS ── */
.news-card{height:100%;max-height:100%;min-height:0;overflow:hidden}
.news-list{
  display:flex;
  flex-direction:column;
  gap:.85rem;
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  max-height:none;
  padding-right:.2rem;
}
.news-item{display:flex;flex-direction:column;gap:.3rem;padding:.8rem .9rem;border:1px solid rgba(148,163,184,.14);border-radius:12px;background:linear-gradient(160deg, rgba(255,255,255,.78), rgba(248,250,252,.72));box-shadow:0 6px 18px rgba(15,23,42,.04)}
.news-item:last-child{border-bottom:none}
.news-title a{font-size:.9rem;font-weight:600;line-height:1.4;color:var(--text);text-decoration:none}
.news-title a:hover{color:var(--gold)}
.news-meta{display:flex;align-items:center;gap:.65rem;font-size:.68rem;color:var(--muted);flex-wrap:wrap}
.news-src{font-weight:700;color:var(--gold)}
.news-sent{font-weight:600}
.news-sent.pos{color:var(--green)}
.news-sent.neg{color:var(--red)}

/* ── AI ANALYSIS ── */
.analysis-card{background:linear-gradient(145deg, rgba(255,255,255,.96), rgba(248,253,249,.9))}
.analysis-body{display:flex;flex-direction:column;gap:.75rem}
.analysis-indicators{display:flex;flex-wrap:wrap;gap:.5rem}
.ind-pill{
  background:var(--bg2);border:1px solid var(--border-s);
  border-radius:6px;padding:.2rem .65rem;font-size:.75rem;font-weight:600;color:var(--text2);
}
.ind-pill.pos{background:var(--green-bg);color:var(--green);border-color:transparent}
.ind-pill.neg{background:var(--red-bg);color:var(--red);border-color:transparent}
.analysis-sentiment{
  font-size:.78rem;font-weight:700;color:var(--muted);
  padding:.35rem .85rem;border-radius:8px;background:var(--bg);width:fit-content;
}
.analysis-sentiment.pos{background:var(--green-bg);color:var(--green)}
.analysis-sentiment.neg{background:var(--red-bg);color:var(--red)}
.analysis-text{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.analysis-para{font-size:.85rem;line-height:1.65;color:var(--text2);margin:0}
.analysis-para strong{color:var(--text)}
.analysis-ts{font-size:.68rem;color:var(--muted)}
.analysis-para.headlines{
  grid-column:span 2;
  padding:.75rem;background:var(--gold-bg);border-radius:10px;
  font-size:.82rem;border-left:3px solid var(--gold);
}
@media(max-width:700px){.analysis-text{grid-template-columns:1fr}.analysis-para.headlines{grid-column:1}}

/* ── Brief and watchlist ── */
.news-brief-wrap{padding:12px;display:grid;gap:10px}
.news-brief-box{padding:10px;border-radius:12px;background:linear-gradient(160deg, rgba(255,255,255,.88), rgba(240,249,255,.8));border:1px solid rgba(148,163,184,.16);box-shadow:0 6px 18px rgba(15,23,42,.05);font-size:13px;line-height:1.55;color:#334155}
.macro-radar-list{display:grid;gap:6px}
.news-quality-title{font-size:11px;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.05em;margin-top:4px}
.news-source-quality{font-size:12px;color:#475569}

.watchlist-wrap{padding:14px;display:grid;gap:10px}
.watchlist-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.watch-input{padding:9px;border:1px solid rgba(148,163,184,.22);border-radius:10px;font-size:14px;background:rgba(255,255,255,.82);box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.watch-target-input{width:140px}
.watch-note-input{flex:1;min-width:200px}
.watch-add-btn{
  padding:10px 14px;
  background:linear-gradient(135deg,#0ea5e9,#0284c7);
  color:#fff;
  border:none;
  border-radius:6px;
  font-weight:600;
  cursor:pointer;
  font-size:14px;
}
.watch-msg{display:none;padding:8px 10px;border-radius:6px;font-size:12px}

.sim-scroll-wrap{overflow-x:auto;font-size:13px}
.section-pad-20{padding:20px}



.diamond-spec-note{
  font-size:.71rem;color:var(--muted);padding:.35rem .5rem .1rem;letter-spacing:.01em;
}
/* ── DIAMOND ── */
.diamonds-card{background:linear-gradient(145deg, rgba(255,255,255,.96), rgba(248,245,255,.9))}
.diamond-content{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.diamond-sources{display:flex;flex-direction:column;gap:.5rem}
.diamond-src-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:.7rem .9rem;border-radius:12px;border:1px solid rgba(148,163,184,.16);background:linear-gradient(160deg, rgba(255,255,255,.82), rgba(248,250,252,.74));box-shadow:0 6px 18px rgba(15,23,42,.05);
}
.diamond-src-row.avg{background:linear-gradient(160deg, rgba(255,251,235,.92), rgba(254,243,199,.8));border-color:rgba(212,175,55,.55)}
.diamond-src-name{font-size:.8rem;color:var(--text2)}
.diamond-src-usd{font-size:.78rem;color:var(--muted)}
.diamond-src-pln{font-size:.95rem;font-weight:700;color:var(--text)}
.diamond-src-row.avg .diamond-src-name{font-weight:700;color:var(--gold)}
.diamond-src-row.avg .diamond-src-pln{color:var(--gold)}
.diamond-ct-tabs{display:flex;gap:.3rem;flex-wrap:wrap}
.diamond-actions{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap}
.diamond-results-ts{font-size:.68rem;color:var(--muted);font-variant-numeric:tabular-nums}
.diamond-reload-btn{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  border:1px solid rgba(14,165,233,.35);
  border-radius:8px;
  background:linear-gradient(160deg, rgba(240,249,255,.95), rgba(224,242,254,.86));
  color:#0c4a6e;
  font-size:.75rem;
  font-weight:700;
  padding:.32rem .6rem;
  cursor:pointer;
  transition:all .2s ease;
}
.diamond-reload-btn:hover{background:linear-gradient(160deg, rgba(224,242,254,.98), rgba(186,230,253,.9));border-color:rgba(2,132,199,.55)}
.diamond-reload-btn:disabled{opacity:.65;cursor:not-allowed}
.diamond-reload-btn i{width:14px;height:14px}
.diamond-reload-btn.is-loading i{animation:spin 1s linear infinite}
.diamond-range-name{font-size:.8rem;color:var(--text2);min-width:180px;flex-shrink:0;padding-right:.5rem}
.diamond-range-cell{display:flex;flex-direction:column;gap:.15rem;min-width:130px}
.diamond-range-label{font-size:.72rem;color:var(--muted)}
.diamond-range-meta{font-style:italic}
.diamond-range-price-lo{font-size:.95rem;font-weight:700;color:#2a8a2a}
.diamond-range-price-link{color:inherit;text-decoration:underline;text-decoration-color:rgba(14,165,233,.35);font-weight:700}
.diamond-range-params{font-size:.72rem;color:var(--muted);font-style:italic;line-height:1.35;margin-top:1px}
.diamond-range-sep{width:1px;background:var(--border);margin:0 .75rem;align-self:stretch;flex-shrink:0}
.diamond-chart-label{font-size:.72rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;margin-bottom:.5rem}
.chart-sm-area{flex:1;position:relative;min-height:200px}

.diamond-index-box {
  display: flex;
  align-items: center;
  gap: .5rem;
  background: linear-gradient(160deg, rgba(255,251,235,.92), rgba(254,243,199,.82));
  padding: .3rem .75rem;
  border-radius: 999px;
  border: 1px solid rgba(212,175,55,.35);
  box-shadow: 0 6px 18px rgba(180,132,11,.12);
}
.idx-label {
  font-size: .65rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
}
.idx-val {
  font-size: 1rem;
  font-weight: 800;
  color: var(--gold);
}

/* ── RING CATALOG ── */
.ring-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:1rem;
}
.ring-card{
  border:1px solid rgba(148,163,184,.18);border-radius:15px;padding:1rem;
  background:linear-gradient(160deg, rgba(255,255,255,.84), rgba(248,250,252,.74));transition:all .25s;display:flex;flex-direction:column;gap:.6rem;
  box-shadow:0 8px 22px rgba(15,23,42,.05);
}
.ring-card:hover{border-color:rgba(212,175,55,.48);background:linear-gradient(160deg, rgba(255,251,235,.94), rgba(254,243,199,.78));box-shadow:0 18px 36px rgba(180,132,11,.14)}
.ring-card img{
  width:100%;height:120px;object-fit:contain;
  border-radius:9px;background:#fff;border:1px solid var(--border);
}
.ring-name{font-size:.88rem;font-weight:700;color:var(--text)}
.ring-total{font-size:1.1rem;font-weight:800;color:var(--gold)}
.ring-break{font-size:.7rem;color:var(--muted)}
.ring-specs{font-size:.68rem;color:var(--muted);font-style:italic}
.ring-sparkline{height:44px;position:relative}

/* ── Skeletons ── */
.skel{background:linear-gradient(90deg,#eee 0%,#f8f6f0 50%,#eee 100%);background-size:200% 100%;
      border-radius:9px;animation:shimmer 1.4s infinite}
.h44{height:44px;margin-bottom:.5rem}
.h60{height:60px;margin-bottom:.6rem}
.skel-ring{height:260px;border-radius:15px}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ── FOOTER ── */
.footer{text-align:center;padding:1.2rem;font-size:.7rem;color:var(--muted);border-top:1px solid var(--border)}

/* ── SCROLLBAR ── */
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border-s);border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:var(--muted)}

/* ── RESPONSIVE ── */
@media(max-width:1100px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .span-3{grid-column:span 2}
  .diamond-content{grid-template-columns:1fr}
}
@media(max-width:700px){
  .grid{grid-template-columns:1fr;padding:1rem}
  .span-2,.span-3,.row-2{grid-column:auto;grid-row:auto}
  .prices-row{flex-direction:column;align-items:flex-start;gap:1rem}
  .change-block{margin-left:0}
}

/* ── TOOLS PAGE POLISH ─────────────────────────────── */
#investor-page,
#tools-page{
  display:none;
  padding:0 2rem 2rem;
  background:
    radial-gradient(900px 300px at -4% -12%, rgba(14,165,233,.12), transparent 62%),
    radial-gradient(900px 300px at 104% -16%, rgba(212,175,55,.16), transparent 64%);
}

.investor-shell{max-width:1440px;margin:0 auto}
.investor-head{
  padding:2rem 0;
  border-bottom:1px solid var(--border);
  margin-bottom:2rem;
  position:sticky;
  top:60px;
  background:var(--bg);
  z-index:50;
}
.investor-title{font-size:2rem;font-weight:700;margin-bottom:.5rem;font-family:var(--serif);color:var(--text)}
.investor-subtitle{font-size:14px;color:var(--text2)}
.investor-grid{display:grid;grid-template-columns:1fr;gap:1.5rem}

.tools-shell{max-width:1240px;margin:0 auto}
.tools-head{
  padding:1.35rem 0 1.1rem;
  border-bottom:1px solid var(--border);
  margin-bottom:1.15rem;
  position:sticky;
  top:60px;
  background:var(--bg);
  z-index:50;
}
.tools-title{font-size:2rem;font-weight:700;margin-bottom:.5rem;font-family:var(--serif);color:var(--text)}
.tools-subtitle{font-size:14px;color:var(--text2)}
.tools-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1.2rem;
  align-items:start;
}

#tools-page .card{
  border-radius:16px;
  border:1px solid rgba(148,163,184,.22);
  box-shadow:0 14px 34px rgba(15,23,42,.1), inset 0 1px 0 rgba(255,255,255,.78);
  background:linear-gradient(160deg, rgba(255,255,255,.95), rgba(248,250,252,.86));
  height:auto;
}

#tools-page .card .card-label{
  font-size:.72rem;
  letter-spacing:.08em;
  margin-bottom:.2rem;
}

#tools-page input,
#tools-page select,
#tools-page textarea,
#tools-page button{
  font-family:var(--font);
}

#tools-page input,
#tools-page select,
#tools-page textarea{
  border:1px solid #d6dbe3 !important;
  border-radius:10px !important;
  background:#fff;
  transition:border-color .2s ease, box-shadow .2s ease;
}

#tools-page input:focus,
#tools-page select:focus,
#tools-page textarea:focus{
  outline:none;
  border-color:#0ea5e9 !important;
  box-shadow:0 0 0 3px rgba(14,165,233,.16);
}

#tools-page button{
  border-radius:10px !important;
  box-shadow:0 6px 16px rgba(15,23,42,.13);
  transition:transform .2s ease, filter .2s ease, box-shadow .2s ease;
}

#tools-page button:hover{
  transform:translateY(-1px);
  filter:brightness(1.03);
  box-shadow:0 10px 22px rgba(15,23,42,.18);
}

#tools-page table{
  border-collapse:separate !important;
  border-spacing:0;
}

#tools-page table thead tr{
  background:linear-gradient(180deg, #f8fafc, #f1f5f9) !important;
}

#tools-page table tbody tr:hover{
  background:rgba(14,165,233,.05);
}

#tools-page .tab{
  border-radius:999px;
  padding:.25rem .7rem;
}

#tools-page .tab.active{
  box-shadow:0 4px 12px rgba(184,134,11,.25);
}

@media(max-width:1200px){
  .tools-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:980px){
  .tools-grid{grid-template-columns:1fr !important}
}

@media(max-width:700px){
  #investor-page,
  #tools-page{padding:0 1rem 1.2rem !important}
  .tools-grid{
    grid-template-columns:1fr !important;
    gap:1rem !important;
  }
  .investor-head,
  .tools-head{top:56px}
}
/* ── AI Trading Simulation ──────────────────────────────── */
#sim-box{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(1200px 380px at -8% -40%, rgba(14,165,233,0.17), transparent 62%),
    radial-gradient(880px 280px at 112% -30%, rgba(212,175,55,0.22), transparent 58%),
    linear-gradient(145deg, rgba(255,255,255,.94), rgba(248,250,252,.9));
  border:1px solid rgba(148,163,184,.3);
  box-shadow:0 16px 42px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.8);
}

#sim-box::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(148,163,184,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(148,163,184,.08) 1px, transparent 1px);
  background-size:24px 24px;
  mask-image:radial-gradient(circle at 40% 8%, rgba(0,0,0,.95), rgba(0,0,0,.45) 55%, transparent 92%);
}

.sim-summary-grid,
.sim-stats-grid,
.sim-intel-grid{
  position:relative;
  z-index:1;
}

.sim-summary-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:16px}
.sim-stats-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:16px}
.sim-intel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}

.sim-header-row{display:flex;justify-content:space-between;align-items:center}

#sim-decision{
  margin-bottom:16px;
  padding:12px 14px;
  border-left:4px solid #94a3b8 !important;
  font-size:13px;
  line-height:1.6;
}

.sim-tile-label-row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.sim-intel-meta{font-size:11px;color:#64748b;margin-top:6px;line-height:1.45}

.sim-chart-card-tall,
.sim-chart-card-mid{
  margin-bottom:16px;
  padding:10px 12px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.sim-chart-card-tall{height:180px}
.sim-chart-card-mid{height:170px}
.sim-chart-title{font-size:11px;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px}
.sim-chart-canvas-130{width:100%;height:130px;max-height:130px}
.sim-chart-canvas-120{width:100%;height:120px;max-height:120px}

.sim-tile{
  position:relative;
  isolation:isolate;
  border:1px solid rgba(226,232,240,.9);
  border-radius:14px;
  padding:13px 14px;
  text-align:center;
  background:linear-gradient(165deg, rgba(255,255,255,.92), rgba(248,250,252,.85));
  backdrop-filter:blur(8px);
  box-shadow:0 6px 16px rgba(15,23,42,.06);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  animation:sim-tile-rise .55s ease both;
}

.sim-tile::after{
  content:"";
  position:absolute;
  inset:auto 10px 0 10px;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(14,165,233,.05), rgba(14,165,233,.55), rgba(245,158,11,.45));
  opacity:.75;
}

.sim-tile:hover{
  transform:translateY(-2px) scale(1.01);
  border-color:rgba(14,165,233,.35);
  box-shadow:0 10px 24px rgba(2,132,199,.13);
}

.sim-tile-label{
  font-size:10px;
  font-weight:700;
  color:#64748b;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:5px;
}

.sim-tile-value{
  font-size:19px;
  font-weight:800;
  color:#0f172a;
  letter-spacing:-.01em;
  text-shadow:0 1px 0 rgba(255,255,255,.8);
}

.sim-tile.positive .sim-tile-value{color:#059669}
.sim-tile.negative .sim-tile-value{color:#dc2626}

#sim-learning-card{
  background:linear-gradient(155deg, rgba(14,165,233,.14), rgba(255,255,255,.88));
  border-color:rgba(14,165,233,.24);
}

#sim-learning-weights{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size:10.5px !important;
  color:#334155 !important;
}

#btn-sim-learning{
  padding:4px 8px;
  border:1px solid rgba(14,165,233,.3) !important;
  background:linear-gradient(140deg, #ffffff, #f0f9ff) !important;
  color:#0369a1 !important;
  font-weight:700;
  font-size:11px;
  border-radius:4px;
  cursor:pointer;
  transition:all .2s ease;
}

#btn-sim-learning:hover{
  background:linear-gradient(140deg, #0ea5e9, #0284c7) !important;
  color:#fff !important;
  border-color:#0284c7 !important;
}

.sim-decision-card{
  position:relative;
  z-index:1;
  border-radius:14px !important;
  border:1px solid rgba(148,163,184,.28) !important;
  background:linear-gradient(160deg, rgba(248,250,252,.95), rgba(241,245,249,.86)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 5px 14px rgba(15,23,42,.06);
}

.sim-chart-card{
  position:relative;
  z-index:1;
  border-radius:14px !important;
  border:1px solid rgba(148,163,184,.25) !important;
  background:linear-gradient(165deg, rgba(255,255,255,.94), rgba(248,250,252,.88)) !important;
  box-shadow:0 8px 20px rgba(15,23,42,.07);
}

.sim-chart-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(130deg, rgba(14,165,233,.13), transparent 28%, transparent 70%, rgba(245,158,11,.12));
  opacity:.5;
}

.sim-history-title{
  position:relative;
  z-index:1;
  color:#334155 !important;
  font-size:12px !important;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-bottom:8px;
}

#sim-trades{
  position:relative;
  z-index:1;
  border:1px solid rgba(226,232,240,.9);
  border-radius:12px;
  background:rgba(255,255,255,.88);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}

#sim-trades table thead{
  background:linear-gradient(180deg, rgba(241,245,249,.95), rgba(248,250,252,.9));
}

#sim-trades table tbody tr:hover{
  background:rgba(14,165,233,.06);
}

.sim-meta-note{
  position:relative;
  z-index:1;
  margin-top:10px;
  font-size:11px;
  border:1px dashed rgba(148,163,184,.42);
  border-radius:10px;
  padding:9px 10px;
  background:rgba(248,250,252,.75);
  color:#64748b !important;
}

.sim-price-freshness{
  position:relative;
  z-index:1;
  margin-top:10px;
  padding:10px 12px;
  font-size:12px;
  line-height:1.45;
  background:#f0f9ff;
  color:#0c4a6e;
  border-left:4px solid #0ea5e9;
  border-radius:10px !important;
  box-shadow:0 4px 12px rgba(15,23,42,.05);
}

#sim-job-health{
  position:relative;
  z-index:1;
  margin-top:8px;
  padding:8px 10px;
  font-size:12px;
  background:#f8fafc;
  color:#64748b;
  border-left:4px solid #94a3b8;
  border-radius:10px !important;
  box-shadow:0 4px 12px rgba(15,23,42,.05);
}

#btn-sim-run{
  padding:6px 10px;
  color:#fff;
  border:none;
  font-size:12px;
  cursor:pointer;
  font-weight:600;
  border-radius:10px !important;
  background:linear-gradient(135deg, #059669, #0ea5a4) !important;
  box-shadow:0 5px 14px rgba(5,150,105,.35);
  transition:transform .2s ease, filter .2s ease;
}

#btn-sim-run:hover{
  transform:translateY(-1px);
  filter:brightness(1.05);
}

@keyframes sim-tile-rise{
  from{opacity:0;transform:translateY(8px) scale(.98)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

.sim-summary-grid .sim-tile:nth-child(1),
.sim-stats-grid .sim-tile:nth-child(1),
.sim-intel-grid .sim-tile:nth-child(1){animation-delay:.03s}
.sim-summary-grid .sim-tile:nth-child(2),
.sim-stats-grid .sim-tile:nth-child(2),
.sim-intel-grid .sim-tile:nth-child(2){animation-delay:.07s}
.sim-summary-grid .sim-tile:nth-child(3),
.sim-stats-grid .sim-tile:nth-child(3),
.sim-intel-grid .sim-tile:nth-child(3){animation-delay:.11s}
.sim-summary-grid .sim-tile:nth-child(4),
.sim-stats-grid .sim-tile:nth-child(4){animation-delay:.15s}
.sim-summary-grid .sim-tile:nth-child(5),
.sim-stats-grid .sim-tile:nth-child(5){animation-delay:.19s}
.sim-stats-grid .sim-tile:nth-child(6){animation-delay:.23s}

@media(max-width:1200px){
  .sim-summary-grid{grid-template-columns:repeat(3,1fr)!important}
  .sim-stats-grid{grid-template-columns:repeat(3,1fr)!important}
  .sim-intel-grid{grid-template-columns:repeat(2,1fr)!important}
}

@media(max-width:700px){
  #sim-box{padding:1rem}
  .sim-summary-grid{grid-template-columns:repeat(2,1fr)!important}
  .sim-stats-grid{grid-template-columns:repeat(2,1fr)!important}
  .sim-intel-grid{grid-template-columns:1fr!important}
  .sim-chart-card{height:190px!important}
  .sim-tile-value{font-size:16px}
}