/* ════════════════════════════════════════════════════════════════════════════
   IMPLIED LENS — PREMIUM RESTRUCTURE LAYER
   Uses the site's REAL skin (gold ripple, --brand-gold, frosted panels) and
   restructures the REAL components into a clean, clutter-free premium layout.
   No new colors, no new background — just organization, spacing, depth, motion.
   ════════════════════════════════════════════════════════════════════════════ */

/* ── Shared premium tokens (depth + rhythm), reuse existing gold ─────────────── */
:root{
  --pr-1:0 1px 2px rgba(30,22,8,.06),0 6px 20px rgba(30,22,8,.06);
  --pr-2:0 2px 6px rgba(30,22,8,.08),0 16px 40px rgba(30,22,8,.1);
  --pr-hairline:linear-gradient(90deg,transparent,var(--brand-gold-line),transparent);
  --pr-gap:clamp(14px,1.6vw,20px);
}
html[data-theme="dark"]{
  --pr-1:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.34);
  --pr-2:0 4px 10px rgba(0,0,0,.46),0 20px 48px rgba(0,0,0,.5);
}

/* ── 1. Generous, centered content column with real rhythm ──────────────────── */
@media(min-width:961px){
  #view-tool .app-content-scroll{
    padding:clamp(20px,2.4vw,34px) clamp(20px,3vw,40px) 60px!important;
  }
  #view-tool #body-analyze,
  #view-tool .acc-body{
    max-width:1300px; margin-left:auto; margin-right:auto;
  }
  #view-tool #stock-result > *{ margin-bottom:var(--pr-gap)!important; }
  #view-tool #stock-result > *:last-child{ margin-bottom:0!important; }
}

/* ── 2. Price banner (result-header) — clean, premium, one strong line ───────── */
#view-tool .result-header{
  display:flex!important; align-items:flex-end; justify-content:space-between;
  gap:28px; flex-wrap:wrap;
  padding:clamp(18px,2vw,26px) clamp(20px,2.2vw,30px)!important;
  border-radius:18px!important;
  box-shadow:var(--pr-2)!important;
  position:relative; overflow:hidden;
}
#view-tool .result-header::before{
  content:""; position:absolute; top:0; left:20px; right:20px; height:1px;
  background:var(--pr-hairline); opacity:.85; pointer-events:none;
}
#view-tool .res-name{ font-size:clamp(1.5rem,2.4vw,2.1rem)!important; line-height:1!important; }
#view-tool .price-big{ font-size:clamp(2rem,3.2vw,2.8rem)!important; line-height:1!important; }
#view-tool .price-chg{
  display:inline-flex; align-items:center; gap:5px;
  padding:5px 11px; border-radius:9px; font-weight:600;
}

/* ── 3. Metrics grid — even, spacious tiles ─────────────────────────────────── */
#view-tool .metrics-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;
  gap:12px!important;
}
#view-tool .metrics-grid .metric-card,
#view-tool .metric-card{
  border-radius:14px!important;
  padding:15px 17px!important;
  box-shadow:var(--pr-1)!important;
  transition:transform .18s cubic-bezier(.2,.7,.3,1),border-color .18s,box-shadow .18s!important;
}
#view-tool .metric-card:hover{
  transform:translateY(-2px)!important;
  border-color:var(--brand-gold-line)!important;
  box-shadow:var(--pr-2)!important;
}

/* ── 4. Cards & panels — real depth, lift on hover, gold top-hairline ───────── */
#view-tool .chart-wrap,
#view-tool .panel-box,
#view-tool .sidebar-card,
#view-tool .il-trust-panel,
#view-tool .analyst-target-box,
#view-tool .analyst-rec-box,
#view-tool .dp-card{
  border-radius:16px!important;
  box-shadow:var(--pr-1)!important;
  transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .22s,border-color .2s!important;
  position:relative;
}
#view-tool .chart-wrap:hover,
#view-tool .panel-box:hover,
#view-tool .sidebar-card:hover{
  transform:translateY(-2px)!important;
  box-shadow:var(--pr-2)!important;
  border-color:var(--brand-gold-line)!important;
}
/* the main price chart gets the most presence */
#view-tool .dash-main > .chart-wrap:first-child{
  box-shadow:var(--pr-2)!important;
  border-radius:18px!important;
}

/* ── 5. Two-column dashboard — clean gutters ────────────────────────────────── */
@media(min-width:1100px){
  #view-tool .dash-layout{ gap:var(--pr-gap)!important; }
  #view-tool .dash-main{ display:flex; flex-direction:column; gap:var(--pr-gap); }
  #view-tool .dash-sidebar{ display:flex; flex-direction:column; gap:var(--pr-gap); }
}

/* ── 6. Control bars — grouped, tactile; one cohesive header ────────────────── */
#view-tool .app-chart-toolbar{
  border-radius:14px 14px 0 0!important;
  box-shadow:var(--pr-1)!important;
  gap:7px!important; padding:9px 12px!important;
}
#view-tool .app-tf-strip{
  border-radius:0 0 14px 14px!important; border-top:0!important;
  gap:4px!important; padding:7px 12px!important;
  margin-bottom:var(--pr-gap)!important;
}
#view-tool .mobile-sec-tabs{
  border-radius:14px!important; box-shadow:var(--pr-1)!important;
  gap:6px!important; padding:11px 14px!important;
  margin-bottom:var(--pr-gap)!important;
}
/* every pill: tactile hover, gold gradient active */
#view-tool .act-btn,#view-tool .tf-pill,#view-tool .tf-tog,#view-tool .mst-btn{
  border-radius:9px!important;
  transition:transform .14s,background .15s,color .15s,border-color .15s,box-shadow .15s!important;
}
#view-tool .act-btn:hover,#view-tool .tf-pill:hover,#view-tool .mst-btn:hover{ transform:translateY(-1px)!important; }
#view-tool .act-btn.on,#view-tool .act-btn.active,
#view-tool .tf-pill.on,#view-tool .tf-pill.active,
#view-tool .tf-tog.on,#view-tool .mst-btn.active{
  background:var(--gold-grad)!important; color:#1a1206!important;
  border-color:transparent!important;
  box-shadow:0 3px 12px var(--gold-tint2),0 1px 0 rgba(255,255,255,.28) inset!important;
}

/* ── 7. Cut the remaining clutter (decision-path, guidance, verbose labels) ──── */
#view-tool .il-tool-decision-wrap,
#view-tool .il-decision-path,
#view-tool .il-guidance,
#view-tool .il-research-trail{
  display:none!important;
}

/* ── 8. Chart-header + panel titles: quiet uppercase, gold mark ─────────────── */
#view-tool .chart-title,
#view-tool .panel-box-title{
  font-weight:700!important; letter-spacing:.02em!important;
}

/* ── 9. Tables — premium, rounded, elevated ─────────────────────────────────── */
#view-tool .fin-table,#view-tool .earn-table,#view-tool .inst-table,
#view-tool .cmp-table,#view-tool .scr-table{
  border-radius:14px!important; overflow:hidden; box-shadow:var(--pr-1)!important;
}

/* ── 10. Nav polish + reduced motion ────────────────────────────────────────── */
#main-nav .nav-tab{ transition:color .16s,background .16s!important; }
@media (prefers-reduced-motion: reduce){ *{ transition-duration:.01ms!important; } }

/* ── 11. Mobile: single column, comfortable spacing ─────────────────────────── */
@media(max-width:960px){
  #view-tool .dash-layout{ grid-template-columns:1fr!important; }
  #view-tool .result-header{ flex-direction:column; align-items:flex-start; gap:14px; }
  #view-tool .app-content-scroll{ padding:16px!important; }
  #view-tool .metrics-grid{ grid-template-columns:repeat(2,1fr)!important; }
}

/* ════════════════════════════════════════════════════════════════════════════
   HOME / LANDING / MARKET — same premium restructure, real components + skin
   ════════════════════════════════════════════════════════════════════════════ */

/* ── Landing hero: confident rhythm, premium buttons ────────────────────────── */
.il-landing-hero{ padding-top:clamp(48px,6vw,92px)!important; padding-bottom:clamp(40px,5vw,68px)!important; }
.il-landing h1{ letter-spacing:-.02em!important; }
.il-landing-kicker{ letter-spacing:.15em!important; font-weight:800!important; }

.il-landing-primary,.btn-primary,.btn-plan-gold{
  border-radius:999px!important; font-weight:700!important;
  box-shadow:var(--gold-glow),0 1px 0 rgba(255,255,255,.32) inset!important;
  transition:transform .16s cubic-bezier(.2,.7,.3,1),box-shadow .2s,filter .2s!important;
}
.il-landing-primary:hover,.btn-primary:hover,.btn-plan-gold:hover{
  transform:translateY(-2px)!important; filter:brightness(1.04) saturate(1.04)!important;
}
.il-landing-secondary{
  border-radius:999px!important; font-weight:600!important;
  transition:transform .16s,border-color .18s,background .18s!important;
}
.il-landing-secondary:hover{ transform:translateY(-1px)!important; border-color:var(--brand-gold-line)!important; }

/* ── Landing product preview: real depth ────────────────────────────────────── */
.il-landing-preview{
  border-radius:18px!important;
  box-shadow:var(--pr-2)!important;
}

/* ── Proof + guide + pricing cards: depth, lift, gold hairline ───────────────── */
.home-proof-card,.home-guide-model,.pricing-card,.hc{
  border-radius:14px!important;
  transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .22s,border-color .2s!important;
  position:relative;
}
.home-proof-card{ box-shadow:var(--pr-1)!important; }
.home-proof-card:hover,.pricing-card:hover{
  transform:translateY(-3px)!important; box-shadow:var(--pr-2)!important; border-color:var(--brand-gold-line)!important;
}
.home-proof-card::before,.pricing-card.featured::before{
  content:""; position:absolute; top:0; left:16px; right:16px; height:1px;
  background:var(--pr-hairline); opacity:.8; pointer-events:none;
}
.home-proof-card i{ transition:transform .2s; }
.home-proof-card:hover i{ transform:scale(1.08); }

/* ── Section rhythm on the landing bands ────────────────────────────────────── */
.il-workflow-visual,.il-landing-band,.il-landing-pricing,.home-guide-showcase,.home-proof{
  padding-top:clamp(44px,5vw,76px)!important; padding-bottom:clamp(44px,5vw,76px)!important;
}

/* ── Market dashboard cards: depth + gold hover ─────────────────────────────── */
#market-page .hc,#market-page .hg-market,#market-page .ht-card{
  transition:transform .18s cubic-bezier(.2,.7,.3,1),border-color .18s,background .18s!important;
}
#market-page .hc:hover,#market-page .ht-card:hover{
  transform:translateY(-2px)!important; border-color:var(--brand-gold-line)!important;
}
#market-page .hg-market{ box-shadow:var(--pr-2)!important; border-radius:16px!important; }

/* ── Market sidebar items — tactile ─────────────────────────────────────────── */
#market-page .hsb-item{ transition:background .14s,color .14s,transform .14s!important; }
#market-page .hsb-item:hover{ transform:translateX(2px); }

/* ── CTA strip button ───────────────────────────────────────────────────────── */
.cta-strip .btn-primary{ transform:none; }

/* ════════════════════════════════════════════════════════════════════════════
   EMPTY STATE (pre-ticker) — premium first impression
   ════════════════════════════════════════════════════════════════════════════ */
#view-tool .tool-welcome{
  padding:clamp(32px,5vw,56px) 1.5rem clamp(20px,2vw,28px)!important;
}
#view-tool .tw-title{
  font-size:clamp(1.9rem,3.4vw,2.6rem)!important; letter-spacing:-.025em!important;
}
#view-tool .tw-sub{ max-width:520px; margin:0 auto!important; }

/* Premium search bar in the empty state */
#view-tool .search-row{
  border-radius:14px!important;
  box-shadow:var(--pr-1)!important;
  transition:border-color .18s,box-shadow .18s!important;
}
#view-tool .search-row:focus-within{
  border-color:var(--brand-gold-line)!important;
  box-shadow:0 0 0 3px var(--gold-tint),var(--pr-1)!important;
}
#view-tool .search-row .btn-search{
  background:var(--gold-grad)!important; color:#1a1206!important;
  font-weight:700!important; transition:filter .16s!important;
}
#view-tool .search-row .btn-search:hover{ filter:brightness(1.05)!important; }

/* Featured "popular starting points" — elevated, tactile cards */
#view-tool #featured-grid{ border-radius:14px!important; box-shadow:var(--pr-1)!important; }
#view-tool .fstock-card{ transition:background .14s,transform .14s!important; }
#view-tool .fstock-card:hover{ transform:translateY(-1px); }
#view-tool .fg-label{ letter-spacing:.13em!important; }

/* ════════════════════════════════════════════════════════════════════════════
   FINAL: consistent focus rings for accessibility (real gold)
   ════════════════════════════════════════════════════════════════════════════ */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--brand-gold)!important; outline-offset:2px!important;
}


/* ════════════════════════════════════════════════════════════════════════════
   TOKEN REPAIR — define surface/line/elevation tokens that were orphaned when
   the tool-redesign layer was removed. Many rules reference these; without
   definitions they silently break (transparent panels, washed-out text).
   Defining them here (theme-aware) repairs readability site-wide at the source.
   ════════════════════════════════════════════════════════════════════════════ */
:root{
  --surface:#ffffff;
  --surface-2:#faf8f3;
  --surface-3:#f1eee7;
  --bg:#f5f2ea;
  --bg2:#efece4;
  --line:rgba(120,86,30,.14);
  --line-2:rgba(120,86,30,.22);
  --elev-1:0 1px 2px rgba(40,30,12,.05),0 4px 14px rgba(40,30,12,.06);
  --elev-2:0 2px 6px rgba(40,30,12,.07),0 16px 38px rgba(40,30,12,.1);
  --elev-3:0 6px 16px rgba(40,30,12,.09),0 26px 56px rgba(40,30,12,.12);
}
html[data-theme="dark"]{
  --surface:rgba(22,26,30,.92);
  --surface-2:rgba(26,30,35,.9);
  --surface-3:rgba(32,37,43,.92);
  --bg:#0b0d10;
  --bg2:#0f1216;
  --line:rgba(230,190,110,.16);
  --line-2:rgba(230,190,110,.26);
  --elev-1:0 1px 2px rgba(0,0,0,.4),0 6px 18px rgba(0,0,0,.32);
  --elev-2:0 3px 8px rgba(0,0,0,.44),0 18px 42px rgba(0,0,0,.48);
  --elev-3:0 6px 16px rgba(0,0,0,.5),0 26px 56px rgba(0,0,0,.55);
}

/* Ensure the ticker workspace shell + its inner rows read on the frosted surface */
#view-tool .il-tool-shell,
html[data-theme="dark"] #view-tool .il-tool-shell,
#view-tool .app-section .acc-body > .il-tool-shell{
  background:var(--surface)!important;
  -webkit-backdrop-filter:blur(20px) saturate(1.15)!important;
  backdrop-filter:blur(20px) saturate(1.15)!important;
}
/* the inner translucent gold-tint gradient rows: let the frosted shell show */
#view-tool .il-shell-top{ background:transparent!important; }
/* text/quick-buttons in the shell readable */
#view-tool .il-tool-shell button:not(.hh-search-btn):not(.il-shell-analyze){
  opacity:1!important; border-color:var(--brand-gold-line)!important;
}

/* ════════════════════════════════════════════════════════════════════════════
   READABILITY — theme-correct accent colors (no dark-theme colors in light)
   ════════════════════════════════════════════════════════════════════════════ */
/* Small gold kicker/label text: use the darker gold in light mode for contrast */
:root:not([data-theme="dark"]) #view-tool .il-shell-kicker,
:root:not([data-theme="dark"]) #view-tool [class*="kicker"],
:root:not([data-theme="dark"]) #view-tool .res-ticker-lbl,
:root:not([data-theme="dark"]) #view-tool .sec-label,
:root:not([data-theme="dark"]) #view-tool .fg-label,
:root:not([data-theme="dark"]) #view-tool .m-lbl{
  color:var(--brand-gold-strong)!important;
}
/* Positive/negative values: use the theme's own semantic color, never leak dark→light */
:root:not([data-theme="dark"]) #view-tool .up,
:root:not([data-theme="dark"]) #view-tool .pos,
:root:not([data-theme="dark"]) #view-tool [class*="positive"],
:root:not([data-theme="dark"]) #view-tool .risk-stat-val.up,
:root:not([data-theme="dark"]) #view-tool .price-chg.up{
  color:#1c6b4a!important;
}
:root:not([data-theme="dark"]) #view-tool .dn,
:root:not([data-theme="dark"]) #view-tool .neg,
:root:not([data-theme="dark"]) #view-tool [class*="negative"],
:root:not([data-theme="dark"]) #view-tool .price-chg.dn{
  color:#9e3f45!important;
}

/* ════════════════════════════════════════════════════════════════════════════
   HOME HERO — secondary button was dark-on-dark (invisible over the ripple).
   Give it a frosted surface + readable text in both themes.
   ════════════════════════════════════════════════════════════════════════════ */
.il-landing-secondary,
.il-landing-hero .il-landing-secondary,
.il-landing-actions .il-landing-secondary,
.il-landing-actions.centered .il-landing-secondary,
.il-landing-pricing .il-landing-secondary{
  background-color:rgba(255,253,248,.14)!important;
  background-image:none!important;
  border:1px solid rgba(255,244,214,.4)!important;
  color:#fff4dc!important;
  -webkit-backdrop-filter:blur(10px) saturate(1.1)!important;
  backdrop-filter:blur(10px) saturate(1.1)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.4)!important;
}
.il-landing-secondary:hover,
.il-landing-hero .il-landing-secondary:hover{
  background:rgba(255,253,248,.22)!important;
  border-color:rgba(255,244,214,.6)!important;
  color:#fff!important;
}
.il-landing-secondary i{ color:inherit!important; }
/* Light theme: readable dark text on a light frosted pill */
:root:not([data-theme="dark"]) .il-landing-secondary,
:root:not([data-theme="dark"]) .il-landing-actions .il-landing-secondary,
:root:not([data-theme="dark"]) .il-landing-actions.centered .il-landing-secondary{
  background-color:rgba(255,255,255,.6)!important;
  background-image:none!important;
  border:1px solid rgba(120,86,30,.3)!important;
  color:#3b2a12!important;
  text-shadow:none!important;
}
:root:not([data-theme="dark"]) .il-landing-secondary:hover{
  background:rgba(255,255,255,.75)!important;
  color:#241c0e!important;
}

/* ════════════════════════════════════════════════════════════════════════════
   UNIFIED FROSTED-PANEL SYSTEM — one set style sitewide
   Every panel = the same frosted glass. Guaranteed readable text. Even, generous
   spacing. Nothing cut off. Both themes. This is the authoritative panel style;
   it comes last so it wins.
   ════════════════════════════════════════════════════════════════════════════ */
:root{
  --fp-bg:rgba(255,255,255,.72);
  --fp-bg-strong:rgba(255,255,255,.85);
  --fp-border:rgba(120,86,30,.16);
  --fp-border-hi:rgba(120,86,30,.3);
  --fp-shadow:0 1px 2px rgba(40,28,8,.05),0 10px 30px rgba(40,28,8,.09);
  --fp-shadow-hi:0 3px 8px rgba(40,28,8,.08),0 20px 46px rgba(40,28,8,.13);
  --fp-text:#241c0e;         /* primary text on frost */
  --fp-text-2:rgba(58,48,28,.86);
  --fp-text-3:rgba(120,102,64,.8);
  --fp-radius:16px;
  --fp-blur:blur(22px) saturate(1.2);
}
html[data-theme="dark"]{
  --fp-bg:rgba(24,28,33,.72);
  --fp-bg-strong:rgba(28,33,39,.86);
  --fp-border:rgba(230,190,110,.16);
  --fp-border-hi:rgba(230,190,110,.32);
  --fp-shadow:0 1px 2px rgba(0,0,0,.4),0 12px 32px rgba(0,0,0,.4);
  --fp-shadow-hi:0 4px 10px rgba(0,0,0,.46),0 22px 50px rgba(0,0,0,.5);
  --fp-text:#f4efe4;
  --fp-text-2:rgba(238,231,214,.82);
  --fp-text-3:rgba(210,196,168,.66);
}

/* One frosted surface for EVERY panel, tool + home + market + education */
#view-tool .panel-box,
#view-tool .chart-wrap,
#view-tool .sidebar-card,
#view-tool .metric-card,
#view-tool .result-header,
#view-tool .il-tool-shell,
#view-tool .il-trust-panel,
#view-tool .analyst-target-box,
#view-tool .analyst-rec-box,
#view-tool .dp-card,
#view-tool .sa-card,
#view-tool .scr-filters,
#view-tool .il-research-shell,
#view-tool .il-research-panel,
#view-tool .edu-hero,
#view-tool .edu-path,
#view-tool .edu-lesson-panel,
#view-tool .fin-table,
#view-tool .earn-table,
#view-tool .inst-table,
#view-tool .cmp-table,
#view-tool .scr-table,
.hc,
.home-proof-card,
.home-guide-model,
.pricing-card,
#market-page .hg-market{
  background:var(--fp-bg)!important;
  border:1px solid var(--fp-border)!important;
  border-radius:var(--fp-radius)!important;
  box-shadow:var(--fp-shadow)!important;
  -webkit-backdrop-filter:var(--fp-blur)!important;
  backdrop-filter:var(--fp-blur)!important;
  color:var(--fp-text-2)!important;
  transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .22s,border-color .2s!important;
}
/* Hover lift + gold edge, consistent everywhere */
#view-tool .panel-box:hover,
#view-tool .chart-wrap:hover,
#view-tool .sidebar-card:hover,
.hc:hover,
.home-proof-card:hover,
.pricing-card:hover,
#market-page .hg-market:hover{
  transform:translateY(-2px)!important;
  box-shadow:var(--fp-shadow-hi)!important;
  border-color:var(--fp-border-hi)!important;
}

/* Guaranteed-readable text INSIDE every panel */
#view-tool .panel-box,#view-tool .panel-box *,
#view-tool .chart-wrap,#view-tool .chart-wrap *,
#view-tool .sidebar-card,#view-tool .sidebar-card *,
#view-tool .il-tool-shell,#view-tool .il-tool-shell *,
#view-tool .result-header,#view-tool .result-header *,
.hc,.hc *,
.home-proof-card,.home-proof-card *{
  /* only nudge generic body text; keep semantic (gold/green/red) intact below */
}
/* headings/values = strong text */
#view-tool .panel-box-title,#view-tool .chart-title,#view-tool .sidebar-card-title,
#view-tool .res-name,#view-tool .price-big,#view-tool .m-val,
.home-proof-card strong,.hc strong,.hc h2,.hc h3{
  color:var(--fp-text)!important;
}
/* labels/sublabels = muted but readable (never below ~3:1) */
#view-tool .m-lbl,#view-tool .res-exchange,#view-tool .price-time,
#view-tool .sb-group-label,.home-proof-card span,.hc .hc-sub{
  color:var(--fp-text-3)!important;
}
/* body copy inside panels */
#view-tool .panel-box p,#view-tool .sidebar-card p,.home-proof-card span,.hc p{
  color:var(--fp-text-2)!important;
}
/* gold kickers stay gold but theme-correct (strong in light, bright in dark) */
#view-tool [class*="kicker"],#view-tool .res-ticker-lbl,#view-tool .sec-label,#view-tool .fg-label{
  color:var(--brand-gold-strong)!important;
}
html[data-theme="dark"] #view-tool [class*="kicker"],
html[data-theme="dark"] #view-tool .res-ticker-lbl,
html[data-theme="dark"] #view-tool .sec-label,
html[data-theme="dark"] #view-tool .fg-label{ color:var(--brand-gold)!important; }

/* ── Even, generous spacing so nothing feels cramped, nothing cut off ───────── */
@media(min-width:961px){
  #view-tool .app-content-scroll{ padding:clamp(22px,2.4vw,36px)!important; }
  #view-tool #stock-result > *{ margin-bottom:clamp(16px,1.8vw,22px)!important; }
  #view-tool .dash-layout{ gap:clamp(16px,1.8vw,22px)!important; }
  #view-tool .panel-box,#view-tool .chart-wrap,#view-tool .sidebar-card{ padding:clamp(18px,2vw,24px)!important; }
}
/* prevent cut-off: allow wrap on tight rows */
#view-tool .result-header{ flex-wrap:wrap!important; overflow:visible!important; }
#view-tool .metric-card{ overflow:visible!important; }

/* Tables keep frosted header + readable cells (in-system) */
#view-tool .fin-table thead th,#view-tool .earn-table thead th,
#view-tool .inst-table thead th,#view-tool .cmp-table thead th,#view-tool .scr-table thead th{
  background:var(--fp-bg-strong)!important;
  color:var(--brand-gold-strong)!important;
}
html[data-theme="dark"] #view-tool .fin-table thead th,
html[data-theme="dark"] #view-tool .earn-table thead th,
html[data-theme="dark"] #view-tool .inst-table thead th,
html[data-theme="dark"] #view-tool .cmp-table thead th,
html[data-theme="dark"] #view-tool .scr-table thead th{ color:var(--brand-gold)!important; }
#view-tool .fin-table td,#view-tool .earn-table td,#view-tool .inst-table td,
#view-tool .cmp-table td,#view-tool .scr-table td{ color:var(--fp-text-2)!important; }
#view-tool .fin-table td:first-child,#view-tool .scr-table td:first-child{ color:var(--fp-text)!important; }

/* ════════════════════════════════════════════════════════════════════════════
   HOME PAGE — readable buttons everywhere, consistent frosted secondary style
   ════════════════════════════════════════════════════════════════════════════ */
/* "Open market dashboard" band button + any bare landing-band buttons */
.il-landing-band button,
.il-landing-band > button{
  background:rgba(255,253,248,.14)!important;
  border:1px solid rgba(255,244,214,.4)!important;
  color:#fff4dc!important;
  border-radius:999px!important;
  padding:12px 22px!important;
  font-weight:700!important;
  -webkit-backdrop-filter:blur(10px) saturate(1.1)!important;
  backdrop-filter:blur(10px) saturate(1.1)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.4)!important;
  transition:transform .16s,background .18s,border-color .18s!important;
}
.il-landing-band button:hover{
  transform:translateY(-1px)!important;
  background:rgba(255,253,248,.22)!important;
  border-color:rgba(255,244,214,.6)!important;
  color:#fff!important;
}
:root:not([data-theme="dark"]) .il-landing-band button{
  background:rgba(255,255,255,.6)!important;
  border:1px solid rgba(120,86,30,.3)!important;
  color:#3b2a12!important;
  text-shadow:none!important;
}
:root:not([data-theme="dark"]) .il-landing-band button:hover{
  background:rgba(255,255,255,.8)!important;
  color:#241c0e!important;
}
.il-landing-band button i{ color:inherit!important; }

/* Empty-state "Start with a company" title was gold-on-gold washed out.
   Force strong readable text on the ripple in both themes. */
#view-tool .tw-title{
  color:#f4efe4!important;
  text-shadow:0 2px 12px rgba(0,0,0,.55)!important;
}
:root:not([data-theme="dark"]) #view-tool .tw-title{
  color:#241c0e!important;
  text-shadow:0 1px 3px rgba(255,255,255,.5)!important;
}
#view-tool .tw-sub{
  color:#f0e6cf!important; text-shadow:0 1px 6px rgba(0,0,0,.5)!important;
}
:root:not([data-theme="dark"]) #view-tool .tw-sub{
  color:#3b2a12!important; text-shadow:none!important;
}
/* Disclaimer / fine print on the ripple — readable */
#view-tool .il-tool-disclaimer,
#view-tool .tool-disclaimer,
#view-tool [class*="disclaimer"]{
  color:#e8dcc0!important; text-shadow:0 1px 4px rgba(0,0,0,.4)!important;
}
:root:not([data-theme="dark"]) #view-tool [class*="disclaimer"]{
  color:#4a3f28!important; text-shadow:none!important;
}

/* ── DEFINITIVE secondary-button fix: beat `html[data-theme] .il-landing
   .il-landing-secondary` (specificity 0,1,3,0). Match it, author last. ────── */
html[data-theme="dark"] .il-landing .il-landing-secondary,
html[data-theme="dark"] .il-landing-hero .il-landing-secondary,
html[data-theme="dark"] .il-landing-pricing .il-landing-secondary,
html[data-theme="dark"] .il-landing-band button{
  background-color:rgba(255,253,248,.15)!important;
  background-image:none!important;
  border:1px solid rgba(255,244,214,.42)!important;
  color:#fff4dc!important;
  text-shadow:0 1px 2px rgba(0,0,0,.45)!important;
}
:root:not([data-theme="dark"]) .il-landing .il-landing-secondary,
:root:not([data-theme="dark"]) .il-landing-hero .il-landing-secondary,
:root:not([data-theme="dark"]) .il-landing-pricing .il-landing-secondary,
:root:not([data-theme="dark"]) .il-landing-band button{
  background-color:rgba(255,255,255,.62)!important;
  background-image:none!important;
  border:1px solid rgba(120,86,30,.3)!important;
  color:#2e2210!important;
  text-shadow:none!important;
}

/* ════════════════════════════════════════════════════════════════════════════
   TRUST PANEL — source-attribution labels a touch stronger for readability
   ════════════════════════════════════════════════════════════════════════════ */
#view-tool .il-trust-field,
#view-tool .il-trust-field > span:first-child,
#view-tool .il-trust-label{
  color:var(--fp-text-3)!important;
}
html[data-theme="dark"] #view-tool .il-trust-field,
html[data-theme="dark"] #view-tool .il-trust-label{
  color:rgba(214,200,172,.72)!important;
}
:root:not([data-theme="dark"]) #view-tool .il-trust-field,
:root:not([data-theme="dark"]) #view-tool .il-trust-label{
  color:rgba(110,94,58,.82)!important;
}
/* trust chips stay legible (gold on their own dark chip is fine; ensure it) */
#view-tool .il-trust-chip{
  color:#f2d37a!important;
}
:root:not([data-theme="dark"]) #view-tool .il-trust-chip{
  color:#8a6418!important;
  background:rgba(255,251,240,.9)!important;
}

/* ════════════════════════════════════════════════════════════════════════════
   ANALYZE DENSITY — reclaim vertical space so the chart/data aren't squished.
   Compact the pre-chart panels; give the chart real height. Remove the
   scrapped dashboard/customizable-widget system remnants.
   ════════════════════════════════════════════════════════════════════════════ */

/* Kill any residual dashboard/widget controls (system removed) */
#il-dash-toggle,#il-dash-reset,.il-widget-bar,.il-drag-handle,.il-widget-min,
body.il-dashboard-on #body-analyze::before{ display:none!important; }
body.il-dashboard-on #body-analyze .panel-box,
body.il-dashboard-on #body-analyze .chart-wrap{ resize:none!important; }

@media(min-width:961px){
  /* Once a stock is LOADED, hide the redundant ticker-workspace search panel
     and the bulky trust/evidence panel — the price banner already shows the
     ticker + price, and search is available from the nav. This reclaims ~300px
     so the chart sits near the top instead of far below the fold.
     (.il-shell-preview gets .has-ticker when a stock is loaded.) */
  #view-tool #body-analyze:has(.il-shell-preview.has-ticker) .il-tool-shell{ display:none!important; }
  #view-tool #body-analyze:has(.il-shell-preview.has-ticker) .il-trust-panel{ display:none!important; }

  /* Result header (price banner): tighter */
  #view-tool .result-header{ padding:14px 20px!important; }

  /* Tighten the gaps between the stacked pre-chart blocks */
  #view-tool #stock-result > *{ margin-bottom:12px!important; }

  /* Give the price chart real, usable height */
  #view-tool #price-chart,
  #view-tool .chart-wrap .h240,
  #view-tool .chart-wrap canvas#price-chart{ height:420px!important; min-height:420px!important; }

  /* Control bars stay slim */
  #view-tool .app-chart-toolbar{ padding:7px 12px!important; }
  #view-tool .app-tf-strip{ padding:5px 12px!important; }
  #view-tool .mobile-sec-tabs{ padding:9px 14px!important; }
}

/* On smaller/standard laptop heights, don't force the chart absurdly tall */
@media(min-width:961px) and (max-height:760px){
  #view-tool #price-chart,
  #view-tool .chart-wrap canvas#price-chart{ height:360px!important; min-height:360px!important; }
}

/* Ensure metric tiles are never transparent (readable values on the ripple) */
#view-tool .metric-card,
html[data-theme="dark"] #view-tool .metric-card,
:root:not([data-theme="dark"]) #view-tool .metric-card{
  background-color:var(--fp-bg)!important;
  background-image:none!important;
}
#view-tool .metric-card .m-val,#view-tool .metric-card div{ color:var(--fp-text)!important; }
#view-tool .metric-card .m-lbl{ color:var(--fp-text-3)!important; }

/* ════════════════════════════════════════════════════════════════════════════
   BOTTOM STATS FOOTER — in-context quote strip, not a global footer.
   Show only on the Analyze section AND only after a ticker is loaded.
   (Was a pinned global bar showing dashes on Learn/Workspace/etc.)
   ════════════════════════════════════════════════════════════════════════════ */
#app-stats-footer{ display:none!important; }
/* show only when the analyze section is active and a stock is loaded */
#view-tool[data-active-section="analyze"]:has(.il-shell-preview.has-ticker) #app-stats-footer{
  display:flex!important;
}

/* ════════════════════════════════════════════════════════════════════════════
   CALMER SURFACES — tone the ripple down so it's a subtle luxe backdrop, not a
   loud photo behind data. Data (on frosted panels) becomes the visual priority.
   ════════════════════════════════════════════════════════════════════════════ */
/* Light: soft cream veil over the ripple — keeps warmth, kills the glare */
html body::before,
body::before{
  background-image:
    linear-gradient(180deg, rgba(245,241,232,.74), rgba(242,236,224,.8)),
    var(--gold-ripple-bg)!important;
  filter:saturate(.78) brightness(1.02)!important;
}
/* Dark: deeper veil so panels read as glass over a dim gold sheen */
html[data-theme="dark"] body::before{
  background-image:
    linear-gradient(180deg, rgba(10,11,13,.82), rgba(12,11,9,.87)),
    var(--gold-ripple-bg)!important;
  filter:saturate(.85) brightness(.9)!important;
}
/* subtle vignette to focus the center and calm bright fabric highlights */
body::after{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  box-shadow:inset 0 0 300px 80px rgba(30,20,6,.16);
}
html[data-theme="dark"] body::after{
  box-shadow:inset 0 0 320px 90px rgba(0,0,0,.4);
}

/* ════════════════════════════════════════════════════════════════════════════
   CONSISTENCY PASS — toolbar dedupe, badge visibility, disclaimers, panels
   ════════════════════════════════════════════════════════════════════════════ */

/* 1. The sticky chart toolbar already owns chart type, overlays, and ranges.
      Hide the duplicated pills inside the Price Chart card (state lives in the
      DOM, so toolbar toggles keep working). */
#view-tool #body-analyze .chart-header #ind-row,
#view-tool #body-analyze .chart-header .range-pills{ display:none!important; }

/* 2. Account PRO/TRIAL badge — readable in light mode (was pale gold on cream) */
:root:not([data-theme="dark"]) .nav-acct-badge{
  color:#6b4a15!important;
  background:rgba(185,138,61,.16)!important;
  border-color:rgba(118,82,29,.38)!important;
  text-shadow:none!important;
}

/* 3. Disclaimers / fine print — frosted chip instead of raw text on the ripple */
#view-tool .tool-disclaimer,
#view-tool [class*="disclaimer"]{
  display:block;
  max-width:980px;
  margin:14px auto 0!important;
  padding:9px 14px!important;
  border:1px solid var(--fp-border)!important;
  border-radius:10px!important;
  background:var(--fp-bg)!important;
  -webkit-backdrop-filter:var(--fp-blur)!important;
  backdrop-filter:var(--fp-blur)!important;
  color:var(--fp-text-2)!important;
  text-shadow:none!important;
  line-height:1.5!important;
}

/* 4. Compare-ticker group sits flush with the other toolbar controls */
#view-tool .il-chart-workspace input{
  height:31px!important;
  border-color:var(--fp-border-hi)!important;
}

/* 5. Empty-state hints ("Search for a stock in the Analyze tab first.") —
      same frosted chip in every tab */
#view-tool .tab-nostock,
#view-tool [id$="-nostock"]{
  display:block;
  padding:22px 16px!important;
  border:1px dashed var(--fp-border-hi)!important;
  border-radius:12px!important;
  background:var(--fp-bg)!important;
  color:var(--fp-text-2)!important;
  text-align:center;
  font-size:.85rem!important;
}
#view-tool [id$="-nostock"][style*="display: none"],
#view-tool [id$="-nostock"][style*="display:none"]{ display:none!important; }

/* 6. Loading bars — consistent, quiet, centered */
#view-tool .loading-bar{
  padding:26px 0!important;
  color:var(--fp-text-3)!important;
  text-shadow:none!important;
}

/* ════════════════════════════════════════════════════════════════════════════
   DENSE PRO WORKSPACE — data-first density pass.
   Slimmer chrome, tighter rhythm, more panels per screen. Desktop only;
   mobile keeps its touch-friendly sizes.
   ════════════════════════════════════════════════════════════════════════════ */
@media(min-width:961px){

  /* ── Chrome: two slim control rows + compact section tabs ────────────────── */
  #view-tool .app-chart-toolbar{ padding:4px 10px!important; gap:5px!important; }
  #view-tool .app-tf-strip{ padding:3px 10px!important; gap:3px!important; margin-bottom:12px!important; }
  #view-tool .act-btn{ min-height:27px!important; padding:3px 10px!important; font-size:.7rem!important; }
  #view-tool .tf-pill,#view-tool .tf-tog{ min-height:24px!important; padding:2px 9px!important; font-size:.68rem!important; }
  #view-tool .il-chart-workspace input{ height:27px!important; }
  #view-tool .mobile-sec-tabs{ padding:5px 10px!important; gap:4px!important; margin-bottom:12px!important; }
  #view-tool .mst-btn{ padding:5px 12px!important; font-size:.73rem!important; border-radius:9px!important; }

  /* ── Content rhythm: tighter column, less dead space ─────────────────────── */
  #view-tool .app-content-scroll{ padding:14px 22px 44px!important; }
  #view-tool #stock-result > *{ margin-bottom:10px!important; }
  #view-tool .dash-layout{ gap:12px!important; }
  #view-tool .dash-main{ gap:12px!important; }
  #view-tool .dash-sidebar{ gap:12px!important; }
  #view-tool .g2{ gap:12px!important; margin-bottom:12px!important; }
  #view-tool .panel-box,#view-tool .chart-wrap,#view-tool .sidebar-card{ padding:13px 15px!important; border-radius:12px!important; }
  #view-tool .acc-body{ padding:1rem 1rem 1.4rem!important; }

  /* ── Price banner: one strong line, no bloat ─────────────────────────────── */
  #view-tool .result-header{ padding:10px 16px!important; border-radius:12px!important; gap:18px!important; }
  #view-tool .res-name{ font-size:1.35rem!important; }
  #view-tool .price-big{ font-size:1.9rem!important; }

  /* ── Stat chips: slim data strip, not a card wall ────────────────────────── */
  #view-tool .metrics-grid{ gap:8px!important; }
  #view-tool .metric-card{ padding:8px 12px!important; border-radius:10px!important; }
  #view-tool .m-lbl{ font-size:.61rem!important; margin-bottom:3px!important; }
  #view-tool .m-val{ font-size:.88rem!important; }
  #view-tool .m-sub{ font-size:.61rem!important; }

  /* ── Calm hover: no lift-off on every panel (denser = quieter) ───────────── */
  #view-tool .panel-box:hover,
  #view-tool .chart-wrap:hover,
  #view-tool .sidebar-card:hover,
  #view-tool .metric-card:hover{ transform:none!important; }

  /* ── Bottom quote strip: slim ────────────────────────────────────────────── */
  #app-stats-footer{ padding:1px 0!important; }
  #app-stats-footer .asf-lbl{ font-size:.5rem!important; }
  #app-stats-footer .asf-val{ font-size:.68rem!important; }

  /* ── Tables: pro density across every tab ────────────────────────────────── */
  #view-tool .fin-table th,#view-tool .earn-table th,#view-tool .inst-table th,
  #view-tool .cmp-table th{ padding:5px 10px!important; font-size:.62rem!important; }
  #view-tool .fin-table td,#view-tool .earn-table td,#view-tool .inst-table td,
  #view-tool .cmp-table td{ padding:5px 10px!important; font-size:.73rem!important; }
  #view-tool .scr-table th{ padding:5px 9px!important; font-size:.62rem!important; }
  #view-tool .scr-table td{ padding:5px 9px!important; font-size:.72rem!important; }

  /* ── Model inputs: compact form grid ─────────────────────────────────────── */
  #view-tool .fc-input,#view-tool .fc-select{ padding:7px 9px!important; font-size:.78rem!important; }
  #view-tool .fc-label{ font-size:.61rem!important; margin-bottom:3px!important; }
  #view-tool .btn-run{ padding:9px 16px!important; font-size:.8rem!important; }

  /* ── Empty state: invitation, not a billboard ────────────────────────────── */
  #view-tool .tool-welcome{ padding:22px 1rem 12px!important; }
  #view-tool .tw-title{ font-size:clamp(1.45rem,2.2vw,1.9rem)!important; }
  #view-tool .tw-sub{ font-size:.85rem!important; }

  /* ── Sidebar cards match main density ────────────────────────────────────── */
  #view-tool .dash-sidebar .panel-box-title{ font-size:.6rem!important; margin-bottom:.5rem!important; }
}

/* Wide screens: use the room — wider sidebar, taller primary chart */
@media(min-width:1500px){
  #view-tool .dash-layout{ grid-template-columns:1fr 340px!important; }
  #view-tool #body-analyze,#view-tool .acc-body{ max-width:1500px!important; }
}

/* ════════════════════════════════════════════════════════════════════════════
   REFINED WORKSPACE FRAME — one centered column, calm backdrop, instrument-
   cluster price header, crisp opaque cards. Fixes the "broad and empty" feel:
   bars and content share the same frame, the sidebar stays with you, and the
   ripple becomes a subtle texture instead of a photo behind the data.
   ════════════════════════════════════════════════════════════════════════════ */

/* 1. Calm the ripple inside the tool (texture, not wallpaper) */
#view-tool{ position:relative; isolation:isolate; }
#view-tool::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, rgba(247,243,233,.84), rgba(243,236,222,.9));
}
html[data-theme="dark"] #view-tool::before{
  background:linear-gradient(180deg, rgba(9,10,13,.88), rgba(10,11,14,.93));
}

/* 2. Crisp, near-opaque surfaces with hairline borders and quiet shadows */
#view-tool .panel-box,#view-tool .chart-wrap,#view-tool .sidebar-card,
#view-tool .result-header,#view-tool .scr-filters,
#view-tool .fin-table,#view-tool .earn-table,#view-tool .inst-table,
#view-tool .cmp-table,#view-tool .scr-table{
  background:rgba(255,255,255,.9)!important;
  box-shadow:0 1px 2px rgba(40,28,8,.05),0 6px 18px rgba(40,28,8,.05)!important;
  -webkit-backdrop-filter:blur(8px)!important;
  backdrop-filter:blur(8px)!important;
}
html[data-theme="dark"] #view-tool .panel-box,
html[data-theme="dark"] #view-tool .chart-wrap,
html[data-theme="dark"] #view-tool .sidebar-card,
html[data-theme="dark"] #view-tool .result-header,
html[data-theme="dark"] #view-tool .scr-filters,
html[data-theme="dark"] #view-tool .fin-table,
html[data-theme="dark"] #view-tool .earn-table,
html[data-theme="dark"] #view-tool .inst-table,
html[data-theme="dark"] #view-tool .cmp-table,
html[data-theme="dark"] #view-tool .scr-table{
  background:rgba(19,22,27,.9)!important;
  box-shadow:0 1px 2px rgba(0,0,0,.45),0 8px 22px rgba(0,0,0,.35)!important;
}

@media(min-width:961px){
  /* 3. One centered frame: control bars align with content */
  #view-tool .app-chart-toolbar,
  #view-tool .app-tf-strip,
  #view-tool .mobile-sec-tabs{ width:100%!important; max-width:1280px; margin-left:auto!important; margin-right:auto!important; }
  #view-tool #body-analyze,#view-tool .acc-body{ max-width:1280px!important; }
  #view-tool .app-content-scroll{ padding:14px 26px 54px!important; }

  /* 4. Right rail is filled with real content (analyst, risk, quick value,
        market context) and stays put — no sticky float following the scroll */
  #view-tool .acc-body{ overflow:visible!important; }
  #view-tool .dash-sidebar{ position:static; align-self:start; }

  /* 5. Price banner + stat strip = one instrument cluster */
  #view-tool .result-header{ margin-bottom:0!important; border-radius:12px 12px 0 0!important; border-bottom:0!important; }
  #view-tool .metrics-grid{
    display:grid!important; grid-template-columns:repeat(8,1fr)!important; gap:0!important;
    border:1px solid var(--fp-border)!important;
    border-radius:0 0 12px 12px!important; overflow:hidden!important;
    background:rgba(255,255,255,.9)!important;
    -webkit-backdrop-filter:blur(8px)!important; backdrop-filter:blur(8px)!important;
  }
  html[data-theme="dark"] #view-tool .metrics-grid{ background:rgba(19,22,27,.9)!important; }
  #view-tool .metric-card,
  html[data-theme="dark"] #view-tool .metric-card{
    border:0!important; border-left:1px solid var(--fp-border)!important;
    border-radius:0!important; background:transparent!important;
    background-color:transparent!important; box-shadow:none!important;
    padding:9px 12px!important;
  }
  #view-tool .metric-card:first-child,
  html[data-theme="dark"] #view-tool .metric-card:first-child{ border-left:0!important; }

  /* 6. Chart interaction hint only on hover (kills repeated caption noise) */
  #view-tool .chart-wrap::after{ opacity:0!important; transition:opacity .15s!important; }
  #view-tool .chart-wrap:hover::after{ opacity:1!important; }

  /* 7. Bottom quote strip sits inside the same frame */
  #app-stats-footer{ width:100%!important; max-width:1280px!important; margin:0 auto!important; border-radius:10px 10px 0 0!important; }
}
@media(min-width:961px) and (max-width:1279px){
  #view-tool .metrics-grid{ grid-template-columns:repeat(4,1fr)!important; }
  #view-tool .metric-card:nth-child(n+5),
  html[data-theme="dark"] #view-tool .metric-card:nth-child(n+5){ border-top:1px solid var(--fp-border)!important; }
  #view-tool .metric-card:nth-child(5),
  html[data-theme="dark"] #view-tool .metric-card:nth-child(5){ border-left:0!important; }
}
@media(min-width:1500px){
  #view-tool .dash-layout{ grid-template-columns:1fr 320px!important; }
}

/* ════════════════════════════════════════════════════════════════════════════
   PREMIUM CHROME v2 — single tab bar (chart controls dock into the chart card),
   neutral premium palette (gold is an accent, not a wash), quiet ghost buttons.
   ════════════════════════════════════════════════════════════════════════════ */

/* Neutral hairlines + calmer, near-solid backdrop (defined last = wins) */
:root{
  --fp-border:rgba(24,20,12,.1);
  --fp-border-hi:rgba(24,20,12,.2);
}
html[data-theme="dark"]{
  --fp-border:rgba(255,255,255,.08);
  --fp-border-hi:rgba(255,255,255,.17);
}
#view-tool::before{
  background:linear-gradient(180deg, rgba(246,244,240,.94), rgba(243,240,233,.97))!important;
}
html[data-theme="dark"] #view-tool::before{
  background:linear-gradient(180deg, rgba(10,11,13,.94), rgba(11,12,15,.97))!important;
}

@media(min-width:961px){
  /* ── Docked chart controls: plain rows inside the chart card ─────────────── */
  body.il-controls-docked #il-chart-dock{
    display:flex; flex-direction:column; gap:5px;
    margin:6px 0 10px; padding-bottom:2px;
    border-bottom:1px solid var(--fp-border);
  }
  body.il-controls-docked #view-tool #app-chart-toolbar,
  body.il-controls-docked #view-tool #app-tf-strip,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-chart-toolbar,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip{
    position:static!important; width:100%!important; max-width:none!important;
    height:auto!important; min-height:0!important;
    background:transparent!important; background-image:none!important;
    border:0!important; box-shadow:none!important; border-radius:0!important;
    -webkit-backdrop-filter:none!important; backdrop-filter:none!important;
    padding:0!important; margin:0!important; overflow:visible!important;
  }
  /* ghost buttons: no borders, quiet hover, gold only when active */
  body.il-controls-docked #view-tool #app-chart-toolbar .act-btn,
  body.il-controls-docked #view-tool #app-tf-strip .tf-pill,
  body.il-controls-docked #view-tool #app-tf-strip .tf-tog,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-chart-toolbar .act-btn,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-pill,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-tog{
    background:transparent!important; background-image:none!important;
    border-color:transparent!important; box-shadow:none!important;
    text-shadow:none!important;
  }
  body.il-controls-docked #view-tool #app-chart-toolbar .act-btn:hover,
  body.il-controls-docked #view-tool #app-tf-strip .tf-pill:hover,
  body.il-controls-docked #view-tool #app-tf-strip .tf-tog:hover,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-chart-toolbar .act-btn:hover,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-pill:hover,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-tog:hover{
    background:rgba(120,86,30,.1)!important; background-image:none!important;
    transform:none!important;
  }
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-chart-toolbar .act-btn:hover,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-pill:hover,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-tog:hover{
    background:rgba(230,190,110,.12)!important;
  }
  body.il-controls-docked #view-tool .il-chart-workspace input{
    background:transparent!important; border-color:var(--fp-border)!important;
  }
  /* dock sits on a solid slab so the chart grid pattern never bleeds through */
  body.il-controls-docked #view-tool #il-chart-dock{
    position:relative; z-index:1; background:rgba(255,255,255,.92);
  }
  html[data-theme="dark"] body.il-controls-docked #view-tool #il-chart-dock{
    background:rgba(19,22,27,.92);
  }
  /* active state survives the ghost pass: gold pill, dark text, both themes */
  body.il-controls-docked #view-tool #app-chart-toolbar .act-btn.on,
  body.il-controls-docked #view-tool #app-chart-toolbar .act-btn.active,
  body.il-controls-docked #view-tool #app-tf-strip .tf-pill.on,
  body.il-controls-docked #view-tool #app-tf-strip .tf-pill.active,
  body.il-controls-docked #view-tool #app-tf-strip .tf-tog.on,
  body.il-controls-docked #view-tool #app-tf-strip .tf-tog.active,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-chart-toolbar .act-btn.on,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-chart-toolbar .act-btn.active,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-pill.on,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-pill.active,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-tog.on,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-tog.active{
    background:var(--gold-grad)!important; color:#1a1206!important;
    border-color:transparent!important; box-shadow:none!important; text-shadow:none!important;
  }
  body.il-controls-docked #view-tool #app-chart-toolbar .act-btn.on *,
  body.il-controls-docked #view-tool #app-chart-toolbar .act-btn.active *,
  body.il-controls-docked #view-tool #app-tf-strip .tf-pill.on *,
  body.il-controls-docked #view-tool #app-tf-strip .tf-tog.on *,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-chart-toolbar .act-btn.on *,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-chart-toolbar .act-btn.active *,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-pill.on *,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip .tf-tog.on *{
    color:#1a1206!important; text-shadow:none!important;
  }

  /* ── The one remaining chrome row: quiet text tabs, gold active pill ─────── */
  :root:not([data-theme="dark"]) #view-tool .mobile-sec-tabs,
  html[data-theme="dark"] #view-tool .mobile-sec-tabs{
    background:transparent!important; background-image:none!important;
    border:0!important; box-shadow:none!important; border-radius:0!important;
    -webkit-backdrop-filter:none!important; backdrop-filter:none!important;
    padding:8px 0 6px!important; margin-bottom:8px!important;
    border-bottom:1px solid var(--fp-border)!important;
  }
  :root:not([data-theme="dark"]) #view-tool .mobile-sec-tabs .mst-btn,
  html[data-theme="dark"] #view-tool .mobile-sec-tabs .mst-btn{
    background:transparent!important; background-image:none!important;
    border-color:transparent!important; box-shadow:none!important;
    color:var(--fp-text-2)!important; text-shadow:none!important;
  }
  :root:not([data-theme="dark"]) #view-tool .mobile-sec-tabs .mst-btn:hover,
  html[data-theme="dark"] #view-tool .mobile-sec-tabs .mst-btn:hover{
    background:rgba(120,86,30,.09)!important; color:var(--fp-text)!important;
    transform:none!important;
  }
  html[data-theme="dark"] #view-tool .mobile-sec-tabs .mst-btn:hover{
    background:rgba(230,190,110,.12)!important;
  }
  :root:not([data-theme="dark"]) #view-tool .mobile-sec-tabs .mst-btn.active,
  html[data-theme="dark"] #view-tool .mobile-sec-tabs .mst-btn.active{
    background:var(--gold-grad)!important; color:#1a1206!important;
    border-color:transparent!important;
  }

  /* ── Action buttons: confident, not banner-wide ──────────────────────────── */
  #view-tool #body-analyze .panel-box .btn-run,
  #view-tool #body-dcf .btn-run,
  #view-tool #body-projection .btn-run{
    width:auto!important; min-width:240px; padding:10px 26px!important;
  }
}

/* ════════════════════════════════════════════════════════════════════════════
   PROGRESSIVE TABS + PROVENANCE NOTES
   ════════════════════════════════════════════════════════════════════════════ */
.il-more-tabs{ position:relative; display:inline-flex; }
.il-more-menu{
  position:absolute; top:calc(100% + 8px); right:0; z-index:70;
  display:none; flex-direction:column; gap:2px; min-width:180px; padding:6px;
  border:1px solid var(--fp-border); border-radius:12px;
  background:#fff; box-shadow:0 10px 34px rgba(30,22,8,.14);
}
html[data-theme="dark"] .il-more-menu{ background:#15181d; box-shadow:0 10px 34px rgba(0,0,0,.5); }
.il-more-tabs.open .il-more-menu{ display:flex; }
.il-more-menu .mst-btn{ width:100%; justify-content:flex-start; text-align:left; border-radius:8px!important; }
.il-more-btn i{ font-size:12px; transition:transform .15s; }
.il-more-tabs.open .il-more-btn i{ transform:rotate(180deg); }

.il-source-note{
  display:flex; align-items:center; gap:6px; margin-top:14px;
  color:var(--fp-text-3)!important; font:500 .66rem var(--sans);
}
.il-source-note i{ color:var(--brand-gold); font-size:12px; }
.il-source-note a{ color:var(--brand-gold-strong); text-decoration:underline; }
html[data-theme="dark"] .il-source-note a{ color:var(--brand-gold); }

/* ════════════════════════════════════════════════════════════════════════════
   CHART CONTROLS — one clean flowing row; no minimize chrome; static panels
   ════════════════════════════════════════════════════════════════════════════ */
/* kill any cached minimize buttons + panel resizing */
.il-panel-collapse{ display:none!important; }
#view-tool .panel-box,#view-tool .chart-wrap{ resize:none!important; }

@media(min-width:961px){
  /* merge the two docked control rows into one wrapping row with even gaps */
  body.il-controls-docked #il-chart-dock{
    flex-direction:row!important; flex-wrap:wrap!important; align-items:center!important;
    gap:3px 5px!important; row-gap:5px!important;
  }
  body.il-controls-docked #view-tool #app-chart-toolbar,
  body.il-controls-docked #view-tool #app-tf-strip,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-chart-toolbar,
  html[data-theme="dark"] body.il-controls-docked #view-tool #app-tf-strip{
    display:contents!important;
  }
  /* no floating right-aligned clusters — everything flows evenly */
  body.il-controls-docked #view-tool #app-chart-toolbar .act-right,
  body.il-controls-docked #view-tool #app-tf-strip .tf-right{
    display:contents!important;
  }
  /* the card header already has an expand button — hide the duplicate */
  body.il-controls-docked #view-tool #app-chart-toolbar .act-btn[onclick*="expandChart"]{ display:none!important; }
  /* consistent separator pips between control groups */
  body.il-controls-docked #view-tool .act-sep{
    width:1px; height:16px; margin:0 4px; background:var(--fp-border); flex:0 0 auto;
  }
}

/* ════════════════════════════════════════════════════════════════════════════
   PASSIVE INLINE CHARTS + FULL-CONTROL EXPANDED VIEW
   Inline charts are pure visuals: the page always scrolls, and no hover
   crosshair/tooltip boxes cover the data. All interaction — zoom, pan,
   tooltips, markup, chart type, overlays, ranges — lives in the expanded view.
   ════════════════════════════════════════════════════════════════════════════ */
#view-tool .chart-wrap canvas{ pointer-events:none!important; }
#view-tool .chart-wrap{ cursor:default; }

/* expanded-view control row: everything on one screen */
#il-cex-controls{
  display:flex; flex-wrap:wrap; align-items:center; gap:3px 4px;
  padding:7px 14px; border-bottom:1px solid var(--fp-border);
}
.il-cexc{
  display:inline-flex; align-items:center; gap:5px;
  min-height:26px; padding:2px 10px; border:1px solid transparent; border-radius:8px;
  background:transparent; color:var(--fp-text-2); font:600 .7rem var(--sans);
  cursor:pointer; transition:background .12s,color .12s;
}
.il-cexc:hover{ background:rgba(120,86,30,.1); color:var(--fp-text); }
html[data-theme="dark"] .il-cexc:hover{ background:rgba(230,190,110,.12); }
.il-cexc.on{ background:var(--gold-grad); color:#1a1206; }
.il-cexc i{ font-size:13px; }
.il-cexc-sep{ width:1px; height:16px; margin:0 5px; background:var(--fp-border); flex:0 0 auto; }

/* ════════════════════════════════════════════════════════════════════════════
   EXPANDED CHART — theme-correct modal + readable controls
   The modal was hardcoded dark; in light mode it now matches the theme, and
   inactive controls are readable in both.
   ════════════════════════════════════════════════════════════════════════════ */
:root:not([data-theme="dark"]) .cex-box{
  background:linear-gradient(180deg,#fdfcf9,#f5f2ea)!important;
  border:1px solid rgba(24,20,12,.14)!important;
  box-shadow:0 34px 92px rgba(40,28,8,.28)!important;
}
:root:not([data-theme="dark"]) .cex-header{
  background:rgba(255,255,255,.7)!important;
  border-bottom:1px solid rgba(24,20,12,.1)!important;
}
:root:not([data-theme="dark"]) .cex-toolbar{
  background:rgba(250,247,240,.85)!important;
  border-bottom:1px solid rgba(24,20,12,.1)!important;
}
:root:not([data-theme="dark"]) .cex-title{ color:#241c0e!important; }
:root:not([data-theme="dark"]) .cex-hint{ color:rgba(70,58,34,.6)!important; }
:root:not([data-theme="dark"]) .cex-btn{
  background:rgba(255,255,255,.8)!important; border-color:rgba(24,20,12,.16)!important; color:#3a2f18!important;
}
:root:not([data-theme="dark"]) .cex-tool{ color:rgba(60,49,26,.7)!important; }
:root:not([data-theme="dark"]) .cex-tool:hover{ background:rgba(120,86,30,.1)!important; color:#241c0e!important; }
:root:not([data-theme="dark"]) .cex-tool-label,
:root:not([data-theme="dark"]) .cex-save-state{ color:rgba(70,58,34,.55)!important; }
:root:not([data-theme="dark"]) .cex-color{ border-color:rgba(255,255,255,.9)!important; }
:root:not([data-theme="dark"]) #il-cex-controls{ border-bottom:1px solid rgba(24,20,12,.1)!important; }

/* control-row buttons: explicit per-theme colors (never invisible) */
:root:not([data-theme="dark"]) .il-cexc{ color:rgba(56,45,24,.78)!important; }
:root:not([data-theme="dark"]) .il-cexc:hover{ background:rgba(120,86,30,.12)!important; color:#241c0e!important; }
html[data-theme="dark"] .il-cexc{ color:rgba(235,229,215,.75)!important; }
html[data-theme="dark"] .il-cexc:hover{ background:rgba(255,255,255,.08)!important; color:#fff!important; }
.il-cexc.on{ background:var(--gold-grad)!important; color:#1a1206!important; }
:root:not([data-theme="dark"]) .il-cexc-sep{ background:rgba(24,20,12,.14)!important; }
html[data-theme="dark"] .il-cexc-sep{ background:rgba(255,255,255,.14)!important; }
/* markup icons in dark modal: brighter */
html[data-theme="dark"] .cex-tool{ color:rgba(235,229,215,.66)!important; }
html[data-theme="dark"] .cex-tool:hover{ color:#fff!important; }

/* ── Quick ticker search in the tab bar ─────────────────────────────────────── */
.il-quick-search{
  display:inline-flex; align-items:center; gap:6px;
  margin-left:auto; padding:0 10px; min-height:30px;
  border:1px solid var(--fp-border); border-radius:10px;
  background:rgba(255,255,255,.75);
}
html[data-theme="dark"] .il-quick-search{ background:rgba(22,26,31,.8); }
.il-quick-search i{ color:var(--brand-gold); font-size:13px; }
.il-quick-search input{
  width:110px; border:0; outline:none; background:transparent;
  color:var(--fp-text); font:700 .72rem var(--mono); text-transform:uppercase; letter-spacing:.04em;
}
.il-quick-search input::placeholder{ color:var(--fp-text-3); font-weight:600; text-transform:none; letter-spacing:0; }
.il-quick-search:focus-within{ border-color:var(--brand-gold)!important; box-shadow:0 0 0 3px var(--gold-tint); }
@media(max-width:960px){ .il-quick-search{ display:none; } }

/* ── Landing capabilities grid: the real product, deep-linked ─────────────── */
.il-capabilities{ max-width:1200px; margin:0 auto; padding:clamp(40px,5vw,70px) 24px; }
.il-cap-head{ text-align:center; max-width:640px; margin:0 auto 30px; }
.il-cap-head h2{ margin:.35em 0 .3em; font-family:var(--serif); font-size:clamp(1.5rem,2.6vw,2.1rem); color:#241c0e; }
html[data-theme="dark"] .il-cap-head h2{ color:#f0ead9; }
.il-cap-head p{ color:rgba(60,49,26,.75); font-size:.92rem; line-height:1.6; }
html[data-theme="dark"] .il-cap-head p{ color:rgba(230,224,210,.62); }
.il-cap-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
@media(max-width:900px){ .il-cap-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .il-cap-grid{ grid-template-columns:1fr; } }
.il-cap-card{
  display:block; padding:18px 18px 16px; text-decoration:none;
  background:rgba(255,255,255,.82); border:1px solid var(--fp-border); border-radius:14px;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  transition:transform .16s,border-color .16s,box-shadow .18s;
}
html[data-theme="dark"] .il-cap-card{ background:rgba(20,23,28,.85); }
.il-cap-card:hover{ transform:translateY(-2px); border-color:var(--brand-gold-line); box-shadow:0 12px 32px rgba(40,28,8,.12); }
.il-cap-card i{
  display:grid; place-items:center; width:36px; height:36px; margin-bottom:10px;
  border-radius:10px; background:var(--gold-tint); color:var(--brand-gold-strong); font-size:18px;
}
html[data-theme="dark"] .il-cap-card i{ color:var(--brand-gold); }
.il-cap-card strong{ display:block; margin-bottom:4px; color:#241c0e; font:600 .92rem var(--serif); }
html[data-theme="dark"] .il-cap-card strong{ color:#f0ead9; }
.il-cap-card span{ color:rgba(60,49,26,.72); font:.78rem/1.55 var(--sans); }
html[data-theme="dark"] .il-cap-card span{ color:rgba(230,224,210,.6); }

/* ── Plain-English read + Reverse DCF cards ─────────────────────────────────── */
.il-plain-list{ margin:6px 0 8px; padding-left:16px; }
.il-plain-list li{ margin-bottom:7px; color:var(--fp-text-2); font:.78rem/1.5 var(--sans); }
.il-plain-foot{ color:var(--fp-text-3); font:.62rem var(--sans); }
.il-rdcf-sub{ margin:4px 0 10px; color:var(--fp-text-2)!important; font:.78rem/1.55 var(--sans); }
.il-rdcf-note{ margin-top:10px; color:var(--fp-text-3); font:.75rem var(--sans); }
#il-reverse-dcf{ margin-top:14px; }

/* ════════════════════════════════════════════════════════════════════════════
   FINAL SCROLL GUARANTEE — highest-specificity, last-in-cascade. Inline chart
   areas never capture touch or trackpad gestures; the page always scrolls.
   ════════════════════════════════════════════════════════════════════════════ */
#view-tool .chart-wrap,
#view-tool .chart-wrap *,
#view-tool .panel-box canvas,
#market-page canvas,
.hg-market canvas{
  touch-action:pan-y!important;
  overscroll-behavior:auto!important;
}

/* ════════════════════════════════════════════════════════════════════════════
   LANDING DARK-MODE RESCUE + HERO OVERFLOW + EMPTY-STATE CLEANUP
   The lens layer hardcodes light-mode landing surfaces and near-black text in
   both themes, and the hero h1 overflowed after the font change.
   ════════════════════════════════════════════════════════════════════════════ */
/* hero headline: fluid, wrapping, never off-screen (both themes) */
.il-landing h1,
.il-landing-copy h1{
  font-size:clamp(1.9rem,4.4vw,3.3rem)!important;
  line-height:1.08!important;
  max-width:16ch;
  overflow-wrap:break-word!important;
  white-space:normal!important;
}
.il-landing-copy{ max-width:680px; }

/* dark landing: dark surfaces, light text — no more light-mode leakage */
html[data-theme="dark"] .il-landing{
  background:linear-gradient(180deg,rgba(10,11,13,.9),rgba(13,12,10,.94))!important;
}
html[data-theme="dark"] .il-landing h1{ color:#f2ecdc!important; text-shadow:0 2px 16px rgba(0,0,0,.5)!important; }
html[data-theme="dark"] .il-landing-copy p{ color:rgba(235,228,214,.72)!important; }
html[data-theme="dark"] .il-landing-kicker{ color:var(--brand-gold)!important; }
html[data-theme="dark"] .il-landing-social div,
html[data-theme="dark"] .il-landing-search,
html[data-theme="dark"] .il-landing-secondary,
html[data-theme="dark"] .il-landing-band,
html[data-theme="dark"] .il-landing-pricing{
  background:rgba(22,25,30,.85)!important;
  border-color:rgba(230,190,110,.18)!important;
}
html[data-theme="dark"] .il-landing-secondary{ color:#f2e9d4!important; }
html[data-theme="dark"] .il-landing-social strong,
html[data-theme="dark"] .il-landing-band h2,
html[data-theme="dark"] .il-landing-pricing h2,
html[data-theme="dark"] .il-workflow-copy h2{ color:#f0ead9!important; }
html[data-theme="dark"] .il-landing-social span,
html[data-theme="dark"] .il-landing-band p,
html[data-theme="dark"] .il-landing-pricing p,
html[data-theme="dark"] .il-workflow-copy p{ color:rgba(230,224,210,.62)!important; }
html[data-theme="dark"] .il-landing-search input{ color:#f0ead9!important; }
html[data-theme="dark"] .il-landing-proof span{ color:rgba(235,228,214,.72)!important; }
html[data-theme="dark"] .il-offer-card{
  background:rgba(22,25,30,.85)!important; border-color:rgba(230,190,110,.2)!important;
}
html[data-theme="dark"] .il-offer-card strong{ color:var(--brand-gold)!important; }
html[data-theme="dark"] .il-offer-card span{ color:rgba(230,224,210,.6)!important; }

/* logged-in empty state: no wall of "Unavailable" — the hero search leads */
@media(min-width:961px){
  #view-tool #body-analyze:not(:has(.il-shell-preview.has-ticker)) .il-tool-shell{ display:none!important; }
}

/* ── Valuation range bar ────────────────────────────────────────────────────── */
.il-range-bar{ margin:4px 0 16px; }
.il-rb-title{ font:700 .6rem var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--fp-text-3); margin-bottom:10px; }
.il-rb-track{ position:relative; height:8px; border-radius:6px; background:color-mix(in srgb,var(--fp-border) 60%,transparent); }
.il-rb-fill{ position:absolute; top:0; bottom:0; border-radius:6px; background:linear-gradient(90deg,#d96a70,#D9B35E,#46b184); opacity:.55; }
.il-rb-dot{ position:absolute; top:50%; width:13px; height:13px; border-radius:50%; transform:translate(-50%,-50%); border:2.5px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.3); }
html[data-theme="dark"] .il-rb-dot{ border-color:#14161b; }
.il-rb-dot.dn{ background:#d96a70; } .il-rb-dot.gold{ background:#D9B35E; } .il-rb-dot.up{ background:#46b184; }
.il-rb-cur{ position:absolute; top:-5px; bottom:-5px; width:2.5px; background:var(--fp-text); transform:translateX(-50%); border-radius:2px; }
.il-rb-labels{ display:flex; justify-content:space-between; margin-top:8px; font:700 .68rem var(--mono); }
.il-rb-labels .dn{ color:#c05a60; } .il-rb-labels .gold{ color:var(--brand-gold-strong); } .il-rb-labels .up{ color:#2e8f68; }
html[data-theme="dark"] .il-rb-labels .gold{ color:var(--brand-gold); }
.il-rb-cur-label{ margin-top:3px; font:600 .62rem var(--mono); color:var(--fp-text-3); text-align:center; }

/* ── Research coverage card ─────────────────────────────────────────────────── */
.il-cov-list{ display:grid; gap:4px; margin-bottom:10px; }
.il-cov-step{
  display:flex; align-items:center; gap:8px; width:100%; padding:7px 9px;
  border:1px solid transparent; border-radius:9px; background:transparent;
  color:var(--fp-text-2); font:600 .74rem var(--sans); cursor:pointer; text-align:left;
}
.il-cov-step:hover{ background:rgba(120,86,30,.08); }
html[data-theme="dark"] .il-cov-step:hover{ background:rgba(230,190,110,.1); }
.il-cov-step i{ font-size:15px; color:var(--fp-text-3); }
.il-cov-step.done i{ color:#2e9e6f; }
.il-cov-step span{ margin-left:auto; font:700 .6rem var(--mono); text-transform:uppercase; letter-spacing:.06em; color:var(--fp-text-3); }
.il-cov-step.done span{ color:#2e9e6f; }
.il-cov-src{ display:flex; flex-wrap:wrap; gap:6px 12px; padding-top:9px; border-top:1px solid var(--fp-border); }
.il-cov-src span{ display:inline-flex; align-items:center; gap:5px; color:var(--fp-text-3); font:600 .68rem var(--sans); }
.il-cov-src i{ color:var(--brand-gold); font-size:13px; }

/* ── No empty translucent panels, anywhere ──────────────────────────────────── */
#view-tool .panel-box:empty,
#view-tool .sidebar-card:empty,
#view-tool .dash-sidebar > div:empty,
#analyst-sidebar:empty,
#view-tool .chart-wrap:empty,
.il-landing div[class]:not([class*="btn"]):not([class*="icon"]):empty{ display:none!important; }
