:root{
  /* Palette — the site's own navy + optic-yellow language (see DESIGN.md) */
  --navy:#0a1b31;--navy-2:#14395a;--navy-3:#101f2e;--navy-line:#243447;
  --ink:#16222e;--muted:#5b6b7a;--slate:#64748b;--slate-dark:#334155;--slate-mid:#475569;
  --mist:#94a3b8;--cloud:#cbd5e1;--line:#e2e8ee;--line-2:#e2e8f0;--line-3:#dde3e9;--grey-line:#d1d5db;
  --bg:#f7f8f9;--card:#fff;--white:#fff;--black:#000;--panel:#f8fafc;--hover:#f4f8ff;--hover-2:#eef4ff;--line-soft:#eef2f6;
  --accent:#0b6e4f;--accent2:#d8e31e;--link:#0b5cad;--eyebrow:#7fb3d5;--lede:#dbe7f3;
  --warn:#fff3cd;--warn-line:#e6c200;--warn-bg:#fff8e1;--warn-border:#f0d98c;
  --ok-bg:#dcfce7;--ok-ink:#166534;--ok-fill:#15803d;--ok-panel:#f0fdf4;--ok-line:#bbf7d0;
  --est-bg:#e0e7ff;--est-ink:#3730a3;--blue-bg:#dbeafe;--blue-ink:#1e40af;--cyan-ink:#0e7490;
  --amber-bg:#fef3c7;--amber-ink:#92400e;--amber-fill:#b45309;
  --bad-bg:#fee2e2;--bad-ink:#991b1b;--bad-line:#dc2626;--bad-panel:#fef2f2;
  --good-chip:#e8f3e8;--good-line:#b7d7b7;
  --overlay:rgba(10,27,49,.45);--shadow-dialog:0 24px 64px rgba(10,27,49,.35);
  /* Radii */
  --radius:14px;--radius-2xs:4px;--radius-xs:6px;--radius-sm:8px;--radius-md:10px;--radius-lg:12px;
  --radius-xl:16px;--radius-2xl:20px;--radius-pill:999px;--radius-round:50%;
  /* Spacing scale (token name = px value) */
  --space-1:1px;--space-2:2px;--space-3:3px;--space-4:4px;--space-5:5px;--space-6:6px;--space-7:7px;
  --space-8:8px;--space-9:9px;--space-10:10px;--space-11:11px;--space-12:12px;--space-13:13px;--space-14:14px;
  --space-16:16px;--space-18:18px;--space-20:20px;--space-22:22px;--space-24:24px;--space-26:26px;--space-28:28px;
  --space-32:32px;--space-36:36px;--space-40:40px;--space-44:44px;--space-48:48px;--space-56:56px;--space-58:58px;
  --space-64:64px;--space-72:72px;--space-76:76px;
  /* Type scale (token name = px value; fluid clamp() sizes stay literal by design) */
  --text-11:11px;--text-12:12px;--text-13:13px;--text-14:14px;--text-15:15px;--text-16:16px;--text-17:17px;
  --text-18:18px;--text-19:19px;--text-20:20px;--text-22:22px;--text-26:26px;--text-28:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}
a{color:var(--link)}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--black);color:var(--white);padding:var(--space-8) var(--space-12);z-index:100}
.skip-link:focus{left:var(--space-8);top:var(--space-8)}
.site-header{position:sticky;top:0;z-index:50;background:var(--navy);color:var(--white);box-shadow:0 2px 12px rgba(0,0,0,.2)}
.header-inner{max-width:1160px;margin:0 auto;padding:var(--space-12) var(--space-16);display:flex;align-items:center;gap:var(--space-16);flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:var(--space-10);color:var(--white);text-decoration:none}
.brand-logo{width:40px;height:40px;max-width:none;flex-shrink:0;display:block}
.footer-brand{display:flex;align-items:center;gap:var(--space-8)}
.footer-logo{width:28px;height:28px;max-width:none;flex-shrink:0;display:block}
.brand-text{display:flex;flex-direction:column;line-height:1.2}
.brand-text small{color:var(--cloud);font-size:var(--text-12)}
.main-nav{display:flex;gap:var(--space-14);margin-left:auto;flex-wrap:wrap}
.main-nav a{color:var(--line-2);text-decoration:none;font-size:var(--text-14);font-weight:600}
.main-nav a:hover{text-decoration:underline}
.nav-toggle{display:none;background:var(--white);color:var(--navy);border:0;border-radius:var(--radius-sm);padding:var(--space-8) var(--space-12);font-weight:700;cursor:pointer}
.ticker-strip{background:var(--navy-3);color:var(--line-2);overflow:hidden;border-bottom:1px solid var(--navy-line)}
.ticker-track{display:flex;gap:var(--space-32);white-space:nowrap;padding:var(--space-8) var(--space-16);width:max-content;animation:scroll 42s linear infinite}
.ticker-track span{font-size:var(--text-13)}
.ticker-track em{font-style:normal;color:var(--mist);margin-left:var(--space-6);font-size:var(--text-12)}
.ticker-note{margin:0;padding:0 var(--space-16) var(--space-8);font-size:var(--text-12);color:var(--mist);text-align:center}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.hero{background:linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 100%);color:var(--white);padding:var(--space-28) var(--space-16) var(--space-24)}
.hero-inner{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:1fr 1.05fr;gap:var(--space-28);align-items:start}
.hero-copy{min-width:0}
.eyebrow{letter-spacing:.14em;text-transform:uppercase;font-size:var(--text-12);font-weight:800;color:var(--eyebrow);margin:0 0 var(--space-8)}
.hero h1{font-size:clamp(30px,4.5vw,48px);line-height:1.08;margin:0 0 var(--space-8);max-width:640px}
.lede{font-size:var(--text-17);color:var(--lede);max-width:620px;margin:0 0 var(--space-8)}
.hero-chips{font-size:var(--text-13);font-weight:700;letter-spacing:.02em;color:var(--accent2);margin:0 0 var(--space-4)}
.hero-sleeve{font-size:var(--text-13);color:var(--cloud);margin:0 0 var(--space-10);max-width:620px}
.hero-summary{font-size:var(--text-14);color:var(--line-2);margin:0 0 var(--space-4)}
.hero-summary strong{font-size:var(--text-18);color:var(--white)}
/* Hero carousel — carousel sits beside hero copy in .hero-inner grid (desktop), stacked on mobile. */
.hero-inner > .carousel{min-width:0}
.carousel-viewport{overflow:hidden;border-radius:var(--radius-lg)}
.carousel-track{display:flex;transition:transform .45s ease;touch-action:pan-y}
.carousel-slide{flex:0 0 100%;min-width:0;margin:0}
.carousel-slide img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius-md);background:var(--navy)}
.carousel-slide figcaption{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-10) var(--space-4) var(--space-2)}
.carousel-slide figcaption strong{font-size:var(--text-16);color:var(--white)}
.carousel-slide figcaption span{font-size:var(--text-13);color:var(--cloud)}
.carousel-arrow{position:absolute;top:38%;width:44px;height:44px;border-radius:var(--radius-round);border:1px solid rgba(255,255,255,.35);background:rgba(10,27,49,.85);color:var(--white);font-size:var(--text-26);line-height:1;cursor:pointer;display:grid;place-items:center;z-index:2}
.carousel-arrow.prev{left:var(--space-18)}
.carousel-arrow.next{right:var(--space-18)}
.carousel-arrow:hover{background:var(--navy)}
.carousel-dots{display:flex;justify-content:center;gap:var(--space-10);margin:var(--space-10) 0 var(--space-4)}
.carousel-dot{width:10px;height:10px;border-radius:var(--radius-round);border:0;background:rgba(255,255,255,.4);cursor:pointer;padding:0;min-width:0;min-height:0}
.carousel-dot.is-active{background:var(--accent2);width:26px;border-radius:var(--radius-pill)}
.carousel-note{font-size:var(--text-12);color:var(--cloud);text-align:center;margin:var(--space-4) 0 0}
.carousel-note a{color:var(--white)}
.btn{display:inline-block;padding:var(--space-11) var(--space-18);border-radius:var(--radius-pill);text-decoration:none;font-weight:700;font-size:var(--text-14)}
.btn.primary{background:var(--accent2);color:var(--navy)}
.btn.secondary{background:var(--white);color:var(--navy)}
.btn.text{color:var(--white);text-decoration:underline;padding-left:var(--space-6)}
.hero-foot{font-size:var(--text-13);color:var(--cloud);max-width:760px}
.section{padding:var(--space-44) var(--space-16)}
.section.alt{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.container{max-width:1160px;margin:0 auto}
.section h2{font-size:clamp(26px,3.5vw,36px);line-height:1.15;margin:0 0 var(--space-10)}
.section-lede{color:var(--muted);max-width:820px;font-size:var(--text-16)}
.controls{display:flex;justify-content:space-between;gap:var(--space-16);flex-wrap:wrap;align-items:center;margin:var(--space-20) 0 var(--space-12)}
.filters{display:flex;gap:var(--space-8);flex-wrap:wrap}
.filter-btn{border:1px solid var(--line);background:var(--white);padding:var(--space-8) var(--space-14);border-radius:var(--radius-pill);cursor:pointer;font-weight:600}
.filter-btn.active{background:var(--navy);color:var(--white);border-color:var(--navy)}
.search-label{font-size:var(--text-13);color:var(--muted);display:flex;gap:var(--space-8);align-items:center}
.search-label input{padding:var(--space-9) var(--space-12);border:1px solid var(--line);border-radius:var(--radius-pill);min-width:260px}
.table-wrap{overflow-x:auto;background:var(--white);border:1px solid var(--line);border-radius:var(--radius)}
table{border-collapse:collapse;width:100%;min-width:860px}
th{text-align:left;padding:var(--space-12);border-bottom:2px solid var(--line);font-size:var(--text-13);text-transform:uppercase;letter-spacing:.04em}
td{padding:var(--space-12);border-bottom:1px solid var(--line);vertical-align:top;font-size:var(--text-14)}
.bucket{display:inline-block;font-size:var(--text-11);font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:var(--space-3) var(--space-7);border-radius:var(--radius-pill);margin-left:var(--space-6);white-space:nowrap}
.bucket.core{background:var(--blue-bg);color:var(--blue-ink)}
.bucket.enabler{background:var(--ok-bg);color:var(--ok-ink)}
.bucket.satellite{background:var(--amber-bg);color:var(--amber-ink)}
.pill{font-size:var(--text-11);font-weight:700;padding:var(--space-2) var(--space-7);border-radius:var(--radius-pill);white-space:nowrap}
.pill.confirmed{background:var(--ok-bg);color:var(--ok-ink)}
.pill.estimated{background:var(--est-bg);color:var(--est-ink)}
.pill.verify{background:var(--amber-bg);color:var(--amber-ink)}
.table-note{font-size:var(--text-13);color:var(--muted)}
.no-results{background:var(--warn);border:1px solid var(--warn-line);padding:var(--space-12);border-radius:var(--radius-md)}
.link-btn{background:none;border:0;color:var(--ink);text-decoration:underline;cursor:pointer;font:inherit;font-weight:700;padding:0}
.link-btn:focus-visible{outline:3px solid var(--link);outline-offset:2px}
.dir-row{cursor:pointer}
.dir-row:hover{background:var(--hover)}
.dir-table td:nth-child(3),.dir-table td:nth-child(4){text-align:left}
.dir-table th:nth-child(3),.dir-table th:nth-child(4){text-align:left}
.tab-item span{text-align:center;line-height:1.15}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-14);margin-top:var(--space-18)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-16);display:flex;flex-direction:column;gap:var(--space-8)}
.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-8)}
.card h3{margin:0}
.card-body{display:flex;flex-direction:column;gap:var(--space-8)}
.details{margin-top:var(--space-28);display:flex;flex-direction:column;gap:var(--space-16)}
.detail{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-20)}
.detail h3{margin:0 0 var(--space-8)}
.detail-thesis{font-size:var(--text-15)}
.bull-bear{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-16);margin:var(--space-12) 0}
.bull-bear h4{margin:0 0 var(--space-6)}
.detail-foot{font-size:var(--text-12);color:var(--muted);border-top:1px solid var(--line);padding-top:var(--space-10);margin-top:var(--space-12)}
.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-14);margin:var(--space-18) 0}
.method-grid>div{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-16)}
.rules{line-height:1.7}
.market-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-12);margin:var(--space-18) 0}
.market-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-16);display:flex;flex-direction:column;gap:var(--space-6)}
.market-card span{font-size:var(--text-14);color:var(--muted)}
.disclaimer{background:var(--warn-bg);border-top:2px solid var(--warn-line)}
.site-footer{background:var(--navy);color:var(--line-2);padding:var(--space-28) var(--space-16)}
.footer-inner{display:flex;flex-direction:column;gap:var(--space-10)}
.site-footer a{color:var(--white)}
.small{font-size:var(--text-12);color:var(--mist)}
@media(max-width:860px){
  .cards,.method-grid,.market-grid{grid-template-columns:1fr 1fr}
  .bull-bear{grid-template-columns:1fr}
  .nav-toggle{display:block;margin-left:auto}
  .main-nav{display:none;width:100%;flex-direction:column}
  .main-nav.open{display:flex}
  .search-label input{min-width:180px}
  .ticker-track{animation-duration:28s}
}
@media(max-width:560px){
  .cards,.method-grid,.market-grid{grid-template-columns:1fr}
  .controls{flex-direction:column;align-items:stretch}
  .header-inner{gap:var(--space-10)}
}
@media(prefers-reduced-motion:reduce){.ticker-track{animation:none}html{scroll-behavior:auto}}

/* ---- Dynamic v2: calculator, daily research, print ---- */
.calculator-section{background:var(--white);border-bottom:1px solid var(--line)}
.calculator-grid{display:grid;grid-template-columns:1fr;gap:var(--space-20);margin-top:var(--space-18);align-items:start}
.calc-controls,.calc-output{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-20)}
.calc-field{border:0;padding:0;margin:0 0 var(--space-18)}
.calc-field legend{padding:0;margin-bottom:var(--space-8)}
.calc-field label{font-size:var(--text-15)}
.amount-display{font-size:var(--text-22);font-weight:800;color:var(--navy);margin-left:var(--space-8)}
#amountInput{width:100%;padding:var(--space-10) var(--space-12);border:1px solid var(--line);border-radius:var(--radius-md);font-size:var(--text-18);font-weight:700;margin:var(--space-8) 0}
#amountSlider{width:100%;accent-color:var(--navy)}
.field-help{font-size:var(--text-13);color:var(--muted);margin:var(--space-6) 0 0}
.presets{display:flex;gap:var(--space-8);flex-wrap:wrap;margin-top:var(--space-10)}
.presets button,.calc-actions .btn{cursor:pointer}
.presets button{border:1px solid var(--line);background:var(--white);padding:var(--space-8) var(--space-14);border-radius:var(--radius-pill);font-weight:700}
.presets button:hover{border-color:var(--navy)}
.segmented{display:flex;gap:var(--space-8);flex-wrap:wrap}
.segmented button{border:1px solid var(--line);background:var(--white);padding:var(--space-9) var(--space-13);border-radius:var(--radius-pill);font-weight:600;cursor:pointer}
.segmented button.selected{background:var(--navy);color:var(--white);border-color:var(--navy)}
.segmented button:focus-visible,.presets button:focus-visible,.filter-btn:focus-visible{outline:3px solid var(--link);outline-offset:2px}
.risk-legend{font-size:var(--text-13);color:var(--muted);margin:var(--space-10) 0 0;padding-left:var(--space-18)}
.warning-banner{background:var(--warn);border:2px solid var(--warn-line);border-radius:var(--radius-md);padding:var(--space-12) var(--space-14);margin:var(--space-16) 0;font-size:var(--text-14)}
.calc-actions{display:flex;gap:var(--space-10);flex-wrap:wrap;margin-top:var(--space-4)}
.btn.ghost{background:var(--white);border:1px solid var(--line);color:var(--ink)}
.bucket-row{display:grid;grid-template-columns:96px 1fr auto;gap:var(--space-10);align-items:center;margin:var(--space-8) 0;font-size:var(--text-14)}
.bucket-track{height:16px;background:var(--line-2);border-radius:var(--radius-pill);overflow:hidden}
.bucket-fill{height:100%;border-radius:var(--radius-pill)}
.bucket-fill.core{background:var(--blue-ink)}.bucket-fill.enabler{background:var(--ok-fill)}.bucket-fill.satellite{background:var(--amber-fill)}.bucket-fill.cash{background:var(--slate)}
.bucket-val{font-weight:700;white-space:nowrap}
.risk-summary{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-14);margin:var(--space-14) 0}
.risk-summary-head{display:flex;justify-content:space-between;gap:var(--space-10);flex-wrap:wrap}
.risk-summary-note{font-size:var(--text-13);color:var(--muted)}
.changed-line,.tax-note{font-size:var(--text-13);color:var(--muted)}
.calc-disclaimer{font-size:var(--text-13);background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:var(--radius-md);padding:var(--space-10) var(--space-12)}
.dimmed{opacity:.55;filter:saturate(.7)}
/* Daily research */
.daily-research{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-20);margin:var(--space-18) 0}
.daily-head{display:flex;justify-content:space-between;gap:var(--space-12);flex-wrap:wrap;align-items:flex-start}
.daily-head h3{margin:0}
.daily-updated{font-size:var(--text-13);color:var(--muted);margin:var(--space-4) 0 0}
.daily-focus{line-height:1.7}
.thesis-checks{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-10)}
.thesis-check{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-12);font-size:var(--text-13)}
.thesis-check p{margin:var(--space-6) 0 0;color:var(--muted)}
.thesis-check.watch{border-color:var(--warn-line);background:var(--warn-bg)}
.thesis-check.break{border-color:var(--bad-line);background:var(--bad-panel)}
.how-daily{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-16) var(--space-20);margin:0 0 var(--space-18);font-size:var(--text-14)}
.how-daily h4{margin:0 0 var(--space-6)}
.daily-changelog{margin-top:var(--space-14)}
.daily-changelog summary{cursor:pointer;font-weight:700}
.update-entry{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-14);margin:var(--space-10) 0}
.earnings-watch{line-height:1.8}
/* Sticky first column on wide tables */
@media(min-width:861px){
  .portfolio-table th:first-child,.portfolio-table td:first-child{position:sticky;left:0;background:var(--white);z-index:1}
  .portfolio-table thead th:first-child{z-index:2}
}
.bucket.cash{background:var(--line-2);color:var(--slate-dark)}
.bucket.defensive{background:var(--est-bg);color:var(--est-ink)}
.bucket-fill.defensive{background:var(--est-ink)}
.bucket-fill.sleeve-broad{background:var(--blue-ink)}.bucket-fill.sleeve-value-intl{background:var(--cyan-ink)}.bucket-fill.sleeve-bonds-cash{background:var(--slate)}.bucket-fill.sleeve-dividends{background:var(--ok-fill)}.bucket-fill.sleeve-emerging-tech{background:var(--amber-fill)}
.bucket-name{font-weight:700;font-size:var(--text-13)}
.why-line{font-size:var(--text-15);background:var(--ok-panel);border:1px solid var(--ok-line);border-radius:var(--radius-md);padding:var(--space-12) var(--space-14);margin:var(--space-14) 0}
.why-line:empty{display:none}
.dir-btn{border-style:dashed}
@media(max-width:860px){
  .thesis-checks{grid-template-columns:1fr 1fr}
  .bucket-row{grid-template-columns:86px 1fr;grid-template-rows:auto auto}
  .bucket-val{grid-column:1/-1}
}
@media(max-width:560px){
  .thesis-checks{grid-template-columns:1fr}
  .segmented button{flex:1 1 40%}
  #amountInput{font-size:var(--text-16)}
}
@media print{
  .site-header,.ticker-strip,.hero,#research,#all-investments,#evidence,#why-us,#how-we-keep-score,#how-it-works,#how-we-research,#disclaimer,.site-footer,.calc-controls,.controls,.no-results,.hero-actions{display:none !important}
  body{background:var(--white)}
  .section{padding:var(--space-12) 0}
  .calculator-section,.section#plan{display:block !important}
  .calc-output{display:block !important;box-shadow:none;border:0}
  .table-wrap{overflow:visible}
  table{min-width:0}
  a{color:var(--black);text-decoration:none}
}

/* ================= Apple-level UX pass (2026-10-17) =================
   HIG: clarity / deference / depth. System fonts only, no external requests.
   8pt spacing scale. Type: hero 34/28, H2 24, body 17, caption 13. */

/* --- Type + spacing scale --- */
body{font-size:var(--text-17);line-height:1.55;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
*,*::before,*::after{-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font-family:inherit}
button{font-size:var(--text-16);min-height:44px;touch-action:manipulation;-webkit-touch-callout:none}
input,select,textarea{font-size:var(--text-16);touch-action:manipulation}
a{touch-action:manipulation}
button:active{transform:scale(.98);opacity:.9}
@media(prefers-reduced-motion:reduce){button:active{transform:none;opacity:1}}
.section{padding:var(--space-56) var(--space-16)}
.section h2{font-size:clamp(24px,3.2vw,28px)}
.hero h1{font-size:clamp(34px,6vw,44px);line-height:1.08}
.lede{font-size:var(--text-17)}
.section-lede{font-size:var(--text-17)}
.table-note,.field-help,.small{font-size:var(--text-13)}
.ticker-note{color:var(--cloud)}
.site-footer .small{color:var(--line-2)}

/* --- Universal focus ring (a11y) --- */
:focus-visible{outline:3px solid var(--link);outline-offset:2px;border-radius:var(--radius-xs)}

/* --- Buttons: one family, 44pt min, primary dominant --- */
.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:var(--space-12) var(--space-20);font-size:var(--text-16)}
.btn.primary{font-size:var(--text-17);padding:var(--space-14) var(--space-24);box-shadow:0 2px 8px rgba(0,0,0,.25)}
.btn.secondary,.btn.ghost{min-height:44px}
.btn.ghost{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-12) var(--space-18);border-radius:var(--radius-pill);font-weight:700;font-size:var(--text-16);cursor:pointer}

/* --- Cards: 16px radius, hairline + soft shadow --- */
.card,.detail,.method-grid>div,.market-card,.update-entry,.daily-research,.how-daily,.calc-controls,.calc-output,.thesis-check,.risk-summary{border-radius:var(--radius-xl);box-shadow:0 1px 3px rgba(10,27,49,.06)}
.card{padding:var(--space-20)}
.detail{padding:var(--space-24)}

/* --- Hero: one dominant primary CTA ---
   FIX 2026-10-17: .hero-actions previously had ONLY gap:12px with no
   display:flex, so the three links rendered as inline boxes — the pills
   wrapped awkwardly and "Read disclaimer" squeezed beside the 2nd button.
   Now a real flex row on desktop; disclaimer is forced onto its own row. */
.hero{padding:var(--space-24) var(--space-16) var(--space-20)}
.hero-actions{display:flex;flex-wrap:wrap;gap:var(--space-12);row-gap:var(--space-12);align-items:center;margin:var(--space-20) 0 0}
.hero-actions .btn{flex:0 0 auto;margin:0;box-sizing:border-box}
.hero-actions .btn.secondary,.hero-actions .btn.text{opacity:.92}
/* Disclaimer: NEVER inline beside a button — own line below, full width. */
.hero-actions .btn.text{flex:0 0 100%;width:100%;display:flex;justify-content:flex-start;align-items:center;padding-left:0;margin:var(--space-8) 0 0;min-height:44px}


/* --- Calculator controls: 44pt targets, grouped card --- */
.segmented button,.presets button,.filter-btn{min-height:44px;font-size:var(--text-15)}
#amountInput{min-height:48px}
.search-label input{min-height:44px;font-size:var(--text-16)}
.calc-field{margin:0 0 var(--space-24)}
.calc-controls,.calc-output{padding:var(--space-24)}

/* --- Plan table: scannable at all widths --- */
.table-scroll-hint{display:none;font-size:var(--text-13);color:var(--muted);margin:0 0 var(--space-8);text-align:right}
.portfolio-table th,.portfolio-table td{padding:var(--space-14) var(--space-12)}
.portfolio-table tbody tr:nth-child(even) td{background:var(--panel)}
.portfolio-table td:nth-child(3),.portfolio-table td:nth-child(4){text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.portfolio-table th:nth-child(3),.portfolio-table th:nth-child(4){text-align:right}
.portfolio-table thead th{position:sticky;top:0;background:var(--white);z-index:1}
.portfolio-table th:first-child,.portfolio-table td:first-child{position:sticky;left:0;background:var(--white);z-index:2;box-shadow:2px 0 0 var(--line)}
.portfolio-table thead th:first-child{z-index:3}
.portfolio-table tbody tr:nth-child(even) td:first-child{background:var(--panel)}
.bucket-row{grid-template-columns:120px 1fr auto}
.bucket-track{height:20px}

/* --- Ticker: pause on hover/focus --- */
.ticker-strip:hover .ticker-track,.ticker-strip:focus-within .ticker-track{animation-play-state:paused}

/* --- Mobile native-app shell: bottom tab bar ≤768px --- */
.tab-bar{display:none}
.more-sheet,.sheet-backdrop{display:none}
@media(max-width:768px){
  /* Top header: brand only — nav links live in bottom tabs now */
  .main-nav,.nav-toggle{display:none !important}
  .header-inner{flex-wrap:nowrap;gap:var(--space-8);padding:var(--space-10) var(--space-16)}
  .brand-text small{display:none}
  .brand{min-width:0}
  .brand-text{min-width:0;overflow:hidden}
  .brand-text strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--text-15)}
  .brand-logo{width:36px;height:36px}
  .site-header{position:sticky}

  /* Room for the fixed tab bar so nothing hides behind it */
  body{padding-bottom:calc(var(--space-76) + env(safe-area-inset-bottom, 0px))}
  main{padding-bottom:var(--space-8)}

  /* Bottom tab bar — iOS-style, frosted glass + hairline */
  .tab-bar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:90;
    background:rgba(255,255,255,.88);
    -webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);
    border-top:1px solid rgba(10,27,49,.12);
    padding:var(--space-6) var(--space-4) calc(var(--space-6) + env(safe-area-inset-bottom, 0px));
    box-shadow:0 -1px 8px rgba(10,27,49,.06);
  }
  .tab-item{
    flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);
    min-height:56px;min-width:0;padding:var(--space-4) var(--space-2);text-decoration:none;
    color:var(--muted);font-size:var(--text-11);font-weight:600;line-height:1.2;
    background:none;border:0;cursor:pointer;border-radius:var(--radius-md);
  }
  .tab-item svg{width:24px;height:24px;flex:none}
  .tab-item.is-active{color:var(--navy);font-weight:800}
  .tab-item.is-active svg{stroke-width:2.1}
  .tab-item:active{background:rgba(10,27,49,.06);transform:none;opacity:1}

  /* More sheet — native bottom sheet */
  .sheet-backdrop{display:block;position:fixed;inset:0;background:rgba(10,27,49,.45);z-index:94;opacity:0;pointer-events:none;transition:opacity .2s ease}
  .sheet-backdrop.is-open{opacity:1;pointer-events:auto}
  .more-sheet{
    display:block;position:fixed;left:0;right:0;bottom:0;z-index:95;
    background:var(--white);border-radius:var(--radius-2xl) var(--radius-2xl) 0 0;
    box-shadow:0 -8px 32px rgba(10,27,49,.25);
    padding:var(--space-8) var(--space-16) calc(var(--space-16) + env(safe-area-inset-bottom, 0px));
    transform:translateY(100%);transition:transform .2s ease;
  }
  .more-sheet.is-open{transform:translateY(0)}
  .sheet-handle{width:36px;height:5px;border-radius:var(--radius-pill);background:var(--grey-line);margin:var(--space-4) auto var(--space-8)}
  .sheet-head{display:flex;align-items:center;justify-content:space-between}
  .sheet-head h3{margin:0;font-size:var(--text-20)}
  .sheet-close{background:none;border:0;color:var(--link);font-weight:700;min-height:44px;padding:0 var(--space-4);cursor:pointer}
  .sheet-links{display:flex;flex-direction:column;margin-top:var(--space-8)}
  .sheet-links a{display:flex;align-items:center;min-height:52px;font-size:var(--text-17);font-weight:600;color:var(--ink);text-decoration:none;border-top:1px solid var(--line)}
  .sheet-links a:active{background:var(--bg)}
  .sheet-note{font-size:var(--text-13);color:var(--muted);margin:var(--space-8) 0 0}

  /* Section rhythm on phones */
  .section{padding:var(--space-40) var(--space-16)}
  .table-scroll-hint{display:block}
  .table-wrap{margin:0 -16px;border-radius:0;border-left:0;border-right:0}
  .table-wrap table{min-width:780px}
  .hero{padding:var(--space-20) var(--space-16) var(--space-16)}
  .hero-inner{grid-template-columns:1fr;gap:var(--space-12)}
  .carousel-slide figcaption{padding:var(--space-8) var(--space-4) 0}
  /* FIX 2026-10-17: clean vertical stack — full-width buttons, no overlap, no squeeze. */
  .hero-actions{flex-direction:column;gap:var(--space-12);row-gap:var(--space-12);width:100%;align-items:stretch}
  .hero-actions .btn{flex:0 0 auto;width:100%;box-sizing:border-box;text-align:center;justify-content:center;min-height:48px}
  .hero-actions .btn.primary,.hero-actions .btn.secondary{min-height:48px}
  .hero-actions .btn.text{flex:0 0 auto;width:100%;justify-content:center;text-align:center;margin-top:0;min-height:44px}
}

/* --- Reduced motion: everything still --- */
@media(prefers-reduced-motion:reduce){
  .ticker-track{animation:none}
  html{scroll-behavior:auto}
  .tab-bar,.more-sheet,.sheet-backdrop{transition:none}
  .carousel-track{transition:none}
  *{scroll-behavior:auto !important}
}

/* --- Print: tab bar + sheet never print --- */
@media print{
  .tab-bar,.more-sheet,.sheet-backdrop,.table-scroll-hint{display:none !important}
  body{padding-bottom:0}
}


/* --- Competitive gaps: comparison, transparency, detail dialog, watchlist --- */
.hero-free{font-size:var(--text-15);font-weight:700;color:var(--navy);background:var(--good-chip);border:1px solid var(--good-line);border-radius:var(--radius-pill);display:inline-block;padding:var(--space-6) var(--space-12);margin:var(--space-10) 0 0}
.compare-table td:first-child{font-weight:700;white-space:nowrap}
.score-grid>div h3 span{font-size:var(--text-28)}
.row-clickable{cursor:pointer}
.row-clickable:focus-visible{outline:3px solid var(--link);outline-offset:-3px}
.row-clickable:hover{background:var(--hover)}
.sec-dialog{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(640px,calc(100vw - 32px));max-height:min(80vh,720px);overflow-y:auto;background:var(--white);border:1px solid var(--grey-line);border-radius:var(--radius-xl);box-shadow:0 24px 64px rgba(10,27,49,.35);z-index:96;padding:var(--space-16) var(--space-20) var(--space-20)}
.sec-dialog[hidden],#secBackdrop[hidden]{display:none !important}
#secBackdrop{position:fixed;inset:0;background:rgba(10,27,49,.45);z-index:95}
.sec-dialog-body h4{margin:var(--space-14) 0 var(--space-6)}
.sec-dialog-body .bull-bear{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-16)}
@media(max-width:640px){.sec-dialog-body .bull-bear{grid-template-columns:1fr}}
@media print{.sec-dialog,#secBackdrop{display:none !important}}

/* --- First-time-user overhaul: activation placeholder + rebuild notice + how-it-works --- */
.plan-placeholder{background:var(--white);border:2px dashed var(--line);border-radius:var(--radius);padding:var(--space-28) var(--space-20);text-align:center;margin:var(--space-18) 0}
.plan-placeholder p{margin:var(--space-6) 0}
.plan-placeholder p:first-child{font-size:var(--text-19);font-weight:800}
.rebuild-notice{background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:var(--radius-md);padding:var(--space-12) var(--space-14);margin:var(--space-14) 0;font-size:var(--text-15)}
.build-btn{font-size:var(--text-18) !important;padding:var(--space-16) var(--space-28) !important}
.how-steps{line-height:1.8;font-size:var(--text-17);margin:var(--space-18) 0;padding-left:var(--space-24)}
.how-steps li{margin:var(--space-10) 0}

/* --- Hero carousel (3 slides) --- */
.carousel{position:relative}
.carousel-viewport{overflow:hidden;border-radius:var(--radius-xl)}
.carousel-track{display:flex;transition:transform .45s ease}
.carousel-slide{flex:0 0 100%;min-width:0;margin:0}
.carousel-slide img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.carousel-slide figcaption{display:flex;flex-wrap:wrap;gap:var(--space-4) var(--space-12);align-items:baseline;padding:var(--space-12) var(--space-4) 0;color:var(--white)}
.carousel-slide figcaption strong{font-size:var(--text-18);color:var(--white)}
.carousel-slide figcaption span{font-size:var(--text-15);color:var(--cloud)}
.carousel-arrow{position:absolute;top:38%;width:44px;height:44px;min-height:44px;border:0;border-radius:var(--radius-round);background:rgba(10,27,49,.75);color:var(--white);font-size:var(--text-28);line-height:1;cursor:pointer;z-index:1}
.carousel-prev{left:var(--space-8)}
.carousel-next{right:var(--space-8)}
.carousel-arrow:focus-visible{outline:3px solid var(--accent2);outline-offset:2px}
.carousel-dots{display:flex;justify-content:center;gap:var(--space-10);margin-top:var(--space-14)}
.carousel-dots button{width:12px;height:12px;min-height:12px;padding:0;border:0;border-radius:var(--radius-round);background:var(--slate-mid);cursor:pointer}
.carousel-dots button.active{background:var(--accent2)}
@media (prefers-reduced-motion: reduce){.carousel-track{transition:none}}
@media (max-width:560px){
  .carousel-arrow{top:30%}
  .carousel-slide figcaption{flex-direction:column;gap:var(--space-2)}
}

/* --- How we research list --- */
.research-list{list-style:none;margin:var(--space-20) 0 0;padding:0;max-width:760px}
.research-list li{padding:var(--space-10) 0;border-top:1px solid var(--line-2);font-size:var(--text-17)}
.research-list li:last-child{border-bottom:1px solid var(--line-2)}

/* ============================================================
   PREMIUM POLISH — original DWYM design (navy + optic-yellow).
   Patterns studied from public homepage structure only (hero,
   stats band, card grids, split layouts, whitespace). No text,
   headlines, logos, colors, images, or code copied from any site.
   CSS-only: no HTML/JS changes, no new user-visible copy.
   ============================================================ */

/* --- Type: larger hero, tighter tracking, clearer hierarchy --- */
.hero h1{font-size:clamp(40px,5.5vw,56px);line-height:1.04;letter-spacing:-.02em;margin:0 0 var(--space-12)}
.section h2{font-size:clamp(28px,3.6vw,34px);letter-spacing:-.01em;line-height:1.12}
.section{padding:var(--space-72) var(--space-16)}
.lede{font-size:var(--text-19);line-height:1.6}
.section-lede{font-size:var(--text-18);line-height:1.6}
.eyebrow{font-size:var(--text-13);letter-spacing:.16em}
.hero .eyebrow{display:inline-flex;align-items:center;gap:var(--space-8);background:rgba(216,227,30,.14);border:1px solid rgba(216,227,30,.45);border-radius:var(--radius-pill);padding:var(--space-6) var(--space-12);color:var(--accent2)}
.hero .eyebrow::before{content:"";width:8px;height:8px;border-radius:var(--radius-round);background:var(--accent2);flex:none}

/* --- Hero: subtle glow + depth, still navy --- */
.hero{background:
  radial-gradient(640px 320px at 82% 0%, rgba(216,227,30,.14), transparent 62%),
  radial-gradient(520px 260px at 8% 100%, rgba(127,179,213,.16), transparent 60%),
  linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 100%);
  padding:var(--space-40) var(--space-16) var(--space-32)}
.hero-inner{gap:var(--space-40);align-items:center}
.hero-foot{font-size:var(--text-14);line-height:1.6;margin-top:var(--space-16)}
.hero-actions{margin:var(--space-24) 0 0}

/* --- Header: yellow hairline accent --- */
.site-header{border-bottom:2px solid var(--accent2)}
.brand-text strong{font-size:var(--text-17);letter-spacing:-.01em}
.main-nav a{padding:var(--space-8) var(--space-4)}
.main-nav a:hover{color:var(--accent2);text-decoration:none}

/* --- Buttons: polished primary + secondary --- */
.btn{transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease,background .15s ease}
.btn.primary{background:var(--accent2);color:var(--navy);box-shadow:0 6px 16px rgba(216,227,30,.35),0 2px 4px rgba(0,0,0,.2)}
.btn.primary:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(216,227,30,.4),0 3px 6px rgba(0,0,0,.22)}
.btn.primary:active{transform:translateY(0) scale(.98);box-shadow:0 4px 10px rgba(216,227,30,.3)}
.btn.secondary{background:var(--white);color:var(--navy);border:2px solid var(--navy)}
.btn.secondary:hover{border-color:var(--navy);background:var(--bg);transform:translateY(-1px)}
.btn.ghost{border:2px solid var(--line);transition:transform .15s ease,border-color .15s ease,background .15s ease}
.btn.ghost:hover{border-color:var(--navy);background:var(--bg)}
.build-btn{box-shadow:0 8px 20px rgba(216,227,30,.4),0 2px 4px rgba(0,0,0,.2)}

/* --- Ticker: slightly more presence --- */
.ticker-track span{font-size:var(--text-13);letter-spacing:.02em}

/* --- Carousel: shadow, refined caption card, frosted arrows --- */
.carousel-viewport{border-radius:var(--radius-xl);box-shadow:0 16px 40px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.12)}
.carousel-slide figcaption{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-lg);padding:var(--space-14) var(--space-16);margin-top:var(--space-12)}
.carousel-slide figcaption strong{font-size:var(--text-19)}
.carousel-slide figcaption span{font-size:var(--text-15);line-height:1.5}
.carousel-arrow{background:rgba(255,255,255,.16);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.35);box-shadow:0 4px 12px rgba(0,0,0,.3);transition:background .15s ease,transform .15s ease}
.carousel-arrow:hover{background:rgba(216,227,30,.9);color:var(--navy);transform:scale(1.06)}
.carousel-dots button{transition:width .2s ease,background .2s ease}
.carousel-dots button.active{width:28px}

/* --- Calculator: deeper card, polished inputs --- */
.calc-controls{box-shadow:0 12px 32px rgba(10,27,49,.1);border:1px solid var(--line-3)}
.calc-field label{font-size:var(--text-16)}
#amountInput{border:2px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-12) var(--space-14);transition:border-color .15s ease,box-shadow .15s ease}
#amountInput:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(216,227,30,.45)}
#amountSlider{-webkit-appearance:none;appearance:none;height:8px;border-radius:var(--radius-pill);background:var(--line-2);outline:none}
#amountSlider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;border-radius:var(--radius-round);background:var(--navy);border:3px solid var(--white);box-shadow:0 2px 6px rgba(0,0,0,.3);cursor:pointer}
#amountSlider::-moz-range-thumb{width:24px;height:24px;border-radius:var(--radius-round);background:var(--navy);border:3px solid var(--white);box-shadow:0 2px 6px rgba(0,0,0,.3);cursor:pointer}
#amountSlider::-moz-range-track{height:8px;border-radius:var(--radius-pill);background:var(--line-2)}
.segmented button{transition:background .15s ease,color .15s ease,border-color .15s ease,transform .15s ease}
.segmented button:hover{border-color:var(--navy);transform:translateY(-1px)}
.segmented button.selected{box-shadow:0 4px 10px rgba(10,27,49,.25)}
.presets button{transition:border-color .15s ease,background .15s ease,transform .15s ease}
.presets button:hover{transform:translateY(-1px);background:var(--bg)}
.risk-legend li{margin:var(--space-4) 0}

/* --- Your Plan: research line as a stats-band --- */
#researchLine{background:var(--navy);color:var(--white);border-left:5px solid var(--accent2);border-radius:var(--radius-lg);padding:var(--space-16) var(--space-20);max-width:none;font-size:var(--text-17);font-weight:600;box-shadow:0 8px 20px rgba(10,27,49,.18)}
.plan-placeholder{border:2px dashed var(--cloud);background:var(--white);padding:var(--space-36) var(--space-24);border-radius:var(--radius-xl)}
.why-line{border-radius:var(--radius-lg);box-shadow:0 2px 8px rgba(22,101,52,.1)}
.bucket-track{box-shadow:inset 0 1px 2px rgba(0,0,0,.08)}
.risk-summary{border-left:5px solid var(--accent2);box-shadow:0 4px 14px rgba(10,27,49,.08)}
.calc-disclaimer{border-radius:var(--radius-lg)}

/* --- Plan table: navy header, refined rows --- */
.portfolio-table thead th{background:var(--navy);color:var(--white);border-bottom:0}
.portfolio-table thead th:first-child{background:var(--navy)}
.portfolio-table tbody tr{transition:background .15s ease}
.portfolio-table tbody tr:hover td{background:var(--hover-2)}
.portfolio-table tbody tr:nth-child(even):hover td{background:var(--hover-2)}
.portfolio-table td{border-bottom:1px solid var(--line-soft)}
.filter-btn{transition:background .15s ease,color .15s ease,border-color .15s ease,transform .15s ease}
.filter-btn:hover{border-color:var(--navy);transform:translateY(-1px)}
.filter-btn.active{box-shadow:0 4px 10px rgba(10,27,49,.25)}
.search-label input{border:2px solid var(--line);transition:border-color .15s ease,box-shadow .15s ease}
.search-label input:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(216,227,30,.45)}

/* --- How we research: premium card grid (no fake numbers) --- */
.research-list{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-16);max-width:none;margin:var(--space-28) 0 0}
.research-list li{border:1px solid var(--line-2);border-top:1px solid var(--line-2);border-radius:var(--radius-xl);background:var(--white);padding:var(--space-22) var(--space-22) var(--space-22) var(--space-56);position:relative;box-shadow:0 2px 8px rgba(10,27,49,.06);transition:transform .15s ease,box-shadow .15s ease;font-size:var(--text-17);line-height:1.6}
.research-list li:last-child{border-bottom:1px solid var(--line-2);grid-column:1/-1}
.research-list li::before{content:"";position:absolute;left:var(--space-22);top:var(--space-26);width:14px;height:14px;background:var(--accent2);border:2px solid var(--navy);border-radius:var(--radius-2xs);transform:rotate(45deg);flex:none}
.research-list li:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(10,27,49,.1)}
.research-list li strong{display:block;font-size:var(--text-18);margin-bottom:var(--space-4)}

/* --- How It Works: big yellow numerals --- */
.how-steps{counter-reset:step;list-style:none;padding:0;margin:var(--space-28) 0}
.how-steps li{position:relative;padding:var(--space-6) 0 var(--space-6) var(--space-64);margin:var(--space-18) 0;font-size:var(--text-18);line-height:1.6}
.how-steps li::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:0;width:44px;height:44px;border-radius:var(--radius-round);background:var(--accent2);color:var(--navy);display:grid;place-items:center;font-size:var(--text-20);font-weight:800;box-shadow:0 4px 10px rgba(216,227,30,.4)}
.how-steps li + li{border-top:1px solid var(--line-soft);padding-top:var(--space-22)}
.how-steps li + li::before{top:var(--space-16)}

/* --- Disclaimer: readable card --- */
.disclaimer .container{background:var(--white);border:1px solid var(--warn-border);border-radius:var(--radius-xl);padding:var(--space-28);box-shadow:0 4px 14px rgba(10,27,49,.05)}
.disclaimer p{line-height:1.75}

/* --- Footer: yellow top border, breathing room --- */
.site-footer{border-top:3px solid var(--accent2);padding:var(--space-40) var(--space-16) var(--space-32)}
.footer-inner{gap:var(--space-14)}
.footer-brand strong{font-size:var(--text-17)}

/* --- Detail dialog: polished --- */
.sec-dialog{padding:var(--space-24) var(--space-28) var(--space-28);border-radius:var(--radius-2xl)}
.sec-dialog .sheet-head{padding-bottom:var(--space-12);border-bottom:1px solid var(--line);margin-bottom:var(--space-8)}
.sec-dialog .sheet-close{background:var(--navy);color:var(--white);border-radius:var(--radius-pill);padding:var(--space-10) var(--space-18);font-size:var(--text-15);min-height:44px}
.sec-dialog .sheet-close:hover{background:var(--navy-2)}
.sec-dialog-body h4{font-size:var(--text-17)}

/* --- Mobile polish --- */
@media(max-width:768px){
  .section{padding:var(--space-48) var(--space-16)}
  .hero{padding:var(--space-28) var(--space-16) var(--space-24)}
  .hero h1{font-size:clamp(36px,9vw,44px)}
  .lede{font-size:var(--text-18)}
  .hero-inner{gap:var(--space-20)}
  .research-list{grid-template-columns:1fr}
  .research-list li:last-child{grid-column:auto}
  .how-steps li{padding-left:var(--space-58)}
  .disclaimer .container{padding:var(--space-20)}
  .sec-dialog{padding:var(--space-20) var(--space-18) var(--space-22)}
}
@media(max-width:560px){
  .section{padding:var(--space-40) var(--space-16)}
  .research-list li{padding:var(--space-18) var(--space-18) var(--space-18) var(--space-48)}
  .research-list li::before{left:var(--space-18);top:var(--space-22)}
}

/* --- Reduced motion: no hover lift / no transitions --- */
@media(prefers-reduced-motion:reduce){
  .btn,.btn.primary,.btn.secondary,.btn.ghost,.segmented button,.presets button,.filter-btn,.research-list li,.carousel-arrow,.carousel-dots button{transition:none;transform:none}
  .btn.primary:hover,.btn.secondary:hover,.research-list li:hover{transform:none}
}

/* ============================================================
   PHASE 2 — widget homepage + Holdings Explorer.
   Same house language: existing cards, pills, tables, tokens.
   ============================================================ */
[hidden]{display:none !important}
.widget-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-14);margin-top:var(--space-18);align-items:start}
.widget-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-xl);padding:var(--space-20);box-shadow:0 1px 3px rgba(10,27,49,.06);display:flex;flex-direction:column;gap:var(--space-10)}
.widget-card h3{margin:0;font-size:var(--text-19)}
.widget-card:first-child{border-left:5px solid var(--accent2)}
.widget-body{display:flex;flex-direction:column;gap:var(--space-10)}
.widget-stats{display:flex;gap:var(--space-12);flex-wrap:wrap}
.widget-stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-12) var(--space-16);display:flex;flex-direction:column;min-width:96px}
.widget-stat strong{font-size:var(--text-28);line-height:1.1;color:var(--navy)}
.widget-stat span{font-size:var(--text-13);color:var(--muted);font-weight:600}
.widget-note{font-size:var(--text-14);color:var(--muted);margin:0}
.widget-stamp{font-size:var(--text-12);color:var(--muted);border-top:1px solid var(--line);padding-top:var(--space-8);margin:var(--space-2) 0 0}
.widget-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.widget-list li{padding:var(--space-10) 0;border-top:1px solid var(--line-soft);font-size:var(--text-15);line-height:1.55;display:flex;flex-direction:column;gap:var(--space-3)}
.widget-list li:first-child{border-top:0;padding-top:var(--space-2)}
.widget-list li .pill{align-self:flex-start}
.widget-focus-lead{font-size:var(--text-16);line-height:1.65;margin:0}
.pill.break{background:var(--bad-bg);color:var(--bad-ink)}
.explorer-controls{align-items:flex-end}
.explorer-controls .search-label{flex-direction:column;align-items:flex-start;gap:var(--space-6);font-weight:600}
.explorer-controls select{min-height:44px;padding:var(--space-9) var(--space-12);border:2px solid var(--line);border-radius:var(--radius-pill);background:var(--white);font-size:var(--text-15)}
.explorer-controls select:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(216,227,30,.45)}
.explorer-detail{background:var(--white);border:1px solid var(--line);border-left:5px solid var(--accent2);border-radius:var(--radius-xl);padding:var(--space-20) var(--space-24);margin:var(--space-14) 0;box-shadow:0 4px 14px rgba(10,27,49,.08)}
.explorer-detail .sheet-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-10);padding-bottom:var(--space-10);border-bottom:1px solid var(--line);margin-bottom:var(--space-8)}
.explorer-detail .sheet-head h3{margin:0}
.explorer-table{min-width:760px}
@media(max-width:860px){.widget-grid{grid-template-columns:1fr}}
@media print{.widget-grid,#holdingsView{display:none !important}}


/* ============================================================
   PHASE 3 — lazy views (Groups / Earnings / Deep Dives / Plan)
   + command palette. Written against the design tokens only
   (DESIGN.md): no raw color, radius, spacing, or type literals.
   ============================================================ */
.view-stamp{font-size:var(--text-13);color:var(--muted);margin:0 0 var(--space-4)}
.stamp-stale{font-style:italic}
.group-card{cursor:pointer;transition:border-color .15s ease,transform .15s ease,box-shadow .15s ease}
.group-card:hover{border-color:var(--navy);transform:translateY(-1px);box-shadow:0 6px 16px rgba(10,27,49,.1)}
.group-open-hint{font-weight:700;color:var(--link)}
#earningsList .widget-list li{flex-direction:row;align-items:baseline;gap:var(--space-8);flex-wrap:wrap}
#deepdivesContent h3{margin:var(--space-8) 0 0;font-size:var(--text-19)}
.nav-search{background:none;border:1px solid var(--navy-line);color:var(--line-2);border-radius:var(--radius-pill);padding:var(--space-6) var(--space-12);font-weight:600;font-size:var(--text-14);cursor:pointer;min-height:0}
.nav-search:hover{color:var(--accent2);border-color:var(--accent2)}
.nav-search .kbd{font-size:var(--text-11);border:1px solid var(--navy-line);border-radius:var(--radius-2xs);padding:0 var(--space-4);margin-left:var(--space-4)}
.palette-backdrop{position:fixed;inset:0;background:var(--overlay);z-index:97}
.palette{position:fixed;left:50%;top:10%;transform:translateX(-50%);width:min(560px,calc(100vw - 32px));z-index:98}
.palette-box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-2xl);box-shadow:var(--shadow-dialog);padding:var(--space-16)}
.palette-box input{width:100%;padding:var(--space-12) var(--space-14);border:2px solid var(--line);border-radius:var(--radius-lg);font-size:var(--text-17)}
.palette-box input:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(216,227,30,.45)}
.palette-results{list-style:none;margin:var(--space-12) 0 0;padding:0;max-height:330px;overflow-y:auto;display:flex;flex-direction:column}
.palette-item{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-12);padding:var(--space-10) var(--space-12);border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-15)}
.palette-item.active{background:var(--hover)}
.palette-item-label{font-weight:600}
.palette-item-sub{color:var(--muted);font-size:var(--text-13);white-space:nowrap}
.palette-empty{padding:var(--space-12);color:var(--muted);font-size:var(--text-15)}
@media(max-width:560px){.palette{top:5%}.palette-item-sub{display:none}}
@media print{.palette,.palette-backdrop,#groupsView,#earningsView,#deepdivesView{display:none !important}}
