/* Design tokens are defined in css/tokens.css (loaded before this file). */

*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:hidden;width:100%}
body{font-family:'Inter',system-ui,sans-serif;background:var(--bg-body);color:var(--text-body);overflow-x:hidden;width:100%}
#main-wrapper{width:100%;max-width:100vw}
@media(min-width:1024px){#main-wrapper{width:calc(100vw - 230px);max-width:calc(100vw - 230px)}}
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border-solid);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--border-solid-strong)}

/* Sidebar */
.sidebar-link.active{background:linear-gradient(135deg,#1e3a5f,#172554);color:var(--accent-blue-light);font-weight:600;border-left:2px solid var(--accent-blue)}
.sidebar-link.active .sidebar-icon{color:var(--accent-blue)}
.sidebar-link:hover:not(.active){background:var(--bg-hover);border-left:2px solid transparent}
.sidebar-link{border-left:2px solid transparent}

/* Primary nav — the 4 main sections (dashboard, rotation, discovery, personal).
   Mirrors mobile bottom-nav visual language: blue-400 active accent with a subtle
   tinted background, versus the muted secondary nav below. */
.primary-nav{display:flex;flex-direction:column;gap:2px}
.primary-nav-item{display:flex;align-items:center;gap:12px;padding:10px 12px 10px 10px;border-radius:10px;font-size:13px;font-weight:500;color:#d1d5db;border-left:2px solid transparent;text-decoration:none;transition:background-color .15s ease,color .15s ease,border-color .15s ease}
.primary-nav-item .primary-nav-icon{color:#9ca3af;display:inline-flex;align-items:center;justify-content:center;transition:color .15s ease}
.primary-nav-item .primary-nav-label{letter-spacing:.01em}
.primary-nav-item:hover:not(.active){background:rgba(30,41,59,.55);color:#f3f4f6}
.primary-nav-item:hover:not(.active) .primary-nav-icon{color:#d1d5db}
.primary-nav-item:focus-visible{outline:none;box-shadow:0 0 0 2px rgba(59,130,246,.5)}
.primary-nav-item.active{background:linear-gradient(135deg,rgba(59,130,246,.14),rgba(59,130,246,.06));color:#60a5fa;font-weight:600;border-left-color:var(--accent-blue,#3b82f6)}
.primary-nav-item.active .primary-nav-icon{color:#60a5fa}
/* Light theme */
body.light-theme .primary-nav-item{color:#5c5347}
body.light-theme .primary-nav-item:hover:not(.active){background:#f5efe7;color:#2f2a24}
body.light-theme .primary-nav-item.active{background:linear-gradient(135deg,#e8ddd0,#f5efe7);color:#8b6914;border-left-color:#8b6914}
body.light-theme .primary-nav-item.active .primary-nav-icon{color:#8b6914}

/* Surface tiers — canonical card primitives */
/* surface-1 (hero): top-level section container */
.surface-1,.panel-card{background:var(--bg-card);border:1px solid var(--border-primary);transition:border-color 0.3s ease;overflow:hidden}
.surface-1:hover,.panel-card:hover{border-color:var(--border-strong)}

/* surface-2 (panel): standalone feature card with hover glow */
.surface-2,.metric-card{transition:all 0.25s cubic-bezier(.4,0,.2,1);border:1px solid var(--border-primary);background:var(--bg-card);overflow:hidden}
.surface-2:hover,.metric-card:hover{box-shadow:var(--shadow-glow-card);transform:translateY(-2px);border-color:var(--border-hover)}

/* surface-3 (nested): inner card within a surface */
.surface-3,.sub-card{background:var(--sub-card-gradient);border:1px solid rgba(51,65,85,0.5);border-radius:0.5rem;padding:0.875rem;transition:all 0.25s cubic-bezier(.4,0,.2,1)}
.surface-3:hover,.sub-card:hover{border-color:var(--tint-blue-strong);box-shadow:0 0 12px rgba(59,130,246,0.06),0 4px 12px rgba(0,0,0,0.3)}

/* News items */
.news-item:hover{background:var(--bg-row-hover)}

/* Journal popup — mobile bottom sheet / desktop anchored */
@media(max-width:1023px){
  #journal-popup-card{position:fixed;bottom:0;left:0;right:0;border-radius:1rem 1rem 0 0;max-height:60vh}
}
@media(min-width:1024px){
  #journal-popup-card{position:absolute;border-radius:0.75rem;width:320px;max-height:50vh}
}
/* Journal card hover pencil icon */
.metric-card .journal-pencil,.sub-card .journal-pencil{opacity:0;transition:opacity 0.15s}
.metric-card:hover .journal-pencil,.sub-card:hover .journal-pencil{opacity:1}
@media(max-width:1023px){.journal-pencil-news{opacity:0.6!important}tr.signal-row .journal-pencil-news{opacity:0.5!important}}
/* Prevent native text selection on long-press for mobile journal gesture */
@media(max-width:1023px){.metric-card,.sub-card,.news-item-wrap,.wl-news-item-wrap,tr.signal-row{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}}
/* Journal note badge */
.journal-badge{font-size:9px;padding:1px 5px;border-radius:9999px;background:var(--tint-blue);color:var(--accent-blue-light);font-weight:600;font-variant-numeric:tabular-nums}
/* Journal sentiment colors */
.j-sent-bullish{background:var(--tint-emerald);color:var(--accent-emerald-light);border-color:var(--tint-emerald-strong)}
.j-sent-bearish{background:var(--tint-red);color:var(--accent-red-light);border-color:var(--tint-red-strong)}
.j-sent-neutral{background:var(--tint-muted);color:var(--text-muted);border-color:rgba(156,163,175,0.3)}

/* Tabs */
.tab-active{color:var(--accent-blue-strong);border-bottom-color:var(--accent-blue-strong);font-weight:600}

/* Ticker */
.ticker-scroll{animation:ticker-move 55s linear infinite;width:max-content}
.ticker-scroll>span{flex-shrink:0}
@keyframes ticker-move{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes ticker-move-3x{0%{transform:translateX(0)}100%{transform:translateX(-33.333%)}}

/* Animations */
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:0.3}}
.pulse-dot{animation:pulse-dot 1.5s ease-in-out infinite}
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes glow-pulse{0%,100%{box-shadow:0 0 8px var(--tint-blue)}50%{box-shadow:0 0 16px var(--border-hover)}}

/* Section headings */
.sec-heading{
  position:relative;
  padding-left:14px;
  font-size:1.15rem;
  line-height:1.15;
  letter-spacing:-0.03em;
  font-weight:800;
  color:var(--text-bright);
  text-transform:none;
  font-family:'Inter',ui-sans-serif,system-ui,sans-serif;
}
.sec-heading::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:20px;border-radius:2px;background:linear-gradient(180deg,var(--accent-blue),#8b5cf6)}
body.light-theme .sec-heading{color:#0f172a}

/* Section dividers — tier-based spacing system */
.content-area>section+section{margin-top:2.5rem;border-top:1px solid var(--border-subtle);padding-top:1.5rem}
@media(min-width:640px){.content-area>section+section{margin-top:3rem;padding-top:2rem}}

/* Tier 1 — Hero zone: tight cluster, no dividers */
#sec-crypto,#sec-vix{margin-top:1rem!important;border-top:none!important;padding-top:0!important}

/* Tier 2 — Workspace: clear separation from hero */
#sec-watchlist{margin-top:2.5rem!important;border-top:1px solid var(--border-subtle)!important;padding-top:1.5rem!important}
@media(min-width:640px){#sec-watchlist{margin-top:3rem!important;padding-top:2rem!important}}

/* Tier 3-4 reference sections: slightly dimmer headings */
#sec-truth .sec-heading,#sec-twitter .sec-heading,#sec-fed .sec-heading,
#sec-yields .sec-heading,#sec-global .sec-heading,#sec-matrix .sec-heading{color:var(--text-dim)}

/* Prevent horizontal overflow bleeding — hard constraint on all content */
.content-area,.content-area>section,.content-area>section>*{box-sizing:border-box;max-width:100%}
.content-area>section{overflow:hidden;min-width:0}

/* Grid */
.grid{min-width:0}
.grid>*{min-width:0}
table{table-layout:fixed}

/* Toast notifications */
.toast-container{position:fixed;bottom:1.5rem;right:1.5rem;z-index:9999;display:flex;flex-direction:column;gap:0.5rem;pointer-events:none}
.toast{pointer-events:auto;padding:0.75rem 1rem;border-radius:0.75rem;font-size:0.75rem;font-weight:500;border:1px solid;backdrop-filter:blur(12px);animation:toast-in 0.3s ease-out;max-width:320px}
.toast.toast-success{background:rgba(6,78,59,0.85);border-color:rgba(52,211,153,0.3);color:var(--accent-emerald-lighter)}
.toast.toast-error{background:rgba(127,29,29,0.85);border-color:rgba(248,113,113,0.3);color:var(--accent-red-lighter)}
.toast.toast-warning{background:rgba(120,53,15,0.85);border-color:rgba(251,191,36,0.3);color:#fde68a}
.toast-out{animation:toast-out 0.3s ease-in forwards}
@keyframes toast-in{from{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:translateY(0)}}
@keyframes toast-out{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(1rem)}}

/* Shimmer animation (used by skeleton primitives — see Day 6 section below) */
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* Notification dropdown */
.notif-dropdown{position:absolute;top:calc(100% + 8px);right:0;width:320px;max-height:70vh;overflow-y:auto;background:linear-gradient(145deg,#1e293b,#0f172a);border:1px solid var(--border-primary);border-radius:0.75rem;box-shadow:0 8px 25px rgba(0,0,0,0.5);z-index:60;display:none}
.notif-dropdown.open{display:block}
.notif-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid rgba(71,85,105,0.3);position:sticky;top:0;background:linear-gradient(145deg,#1e293b,#0f172a);z-index:1}
.notif-title{font-size:12px;font-weight:600;color:var(--text-body);letter-spacing:0.02em}
.notif-view-all{font-size:11px;font-weight:500;color:var(--accent-blue-light);text-decoration:none}
.notif-view-all:hover{color:var(--accent-blue-lighter);text-decoration:underline}
.notif-section{padding:4px 0 6px}
.notif-section + .notif-section{border-top:1px solid rgba(71,85,105,0.2)}
.notif-section-title{font-size:10px;font-weight:600;color:var(--text-slate);text-transform:uppercase;letter-spacing:0.05em;padding:8px 12px 4px}
@media(max-width:639px){.notif-dropdown{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;max-height:70vh;border-radius:0.75rem 0.75rem 0 0}}

/* Stock-detail watchlist picker */
.sd-watchlist-popover{position:absolute;top:calc(100% + 6px);left:0;width:280px;max-height:60vh;overflow-y:auto;background:linear-gradient(145deg,#1e293b,#0f172a);border:1px solid var(--border-primary);border-radius:0.75rem;box-shadow:0 8px 25px rgba(0,0,0,0.5);z-index:50}
.sd-watchlist-popover.hidden{display:none}
.sd-wl-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid rgba(71,85,105,0.3);position:sticky;top:0;background:linear-gradient(145deg,#1e293b,#0f172a);z-index:1}
.sd-wl-header-title{font-size:11px;font-weight:600;color:var(--text-body);letter-spacing:0.04em;text-transform:uppercase}
.sd-wl-header-sym{font-size:11px;font-family:'JetBrains Mono',monospace;color:var(--accent-violet-light);font-weight:700}
.sd-wl-list{padding:4px 0}
.sd-wl-empty{padding:12px;text-align:center;font-size:11px;color:var(--text-faint)}
.sd-wl-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;transition:background 0.15s}
.sd-wl-row:hover{background:var(--glow-blue)}
.sd-wl-row-meta{display:flex;flex-direction:column;min-width:0;flex:1}
.sd-wl-row-name{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-wl-active-dot{width:6px;height:6px;border-radius:50%;background:var(--accent-emerald);flex-shrink:0}
.sd-wl-row-count{font-size:10px;color:var(--text-faint);font-family:'JetBrains Mono',monospace;margin-top:1px}
.sd-wl-row-action{flex-shrink:0}
.sd-wl-add-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:var(--tint-blue);color:var(--accent-blue-light);border:1px solid var(--tint-blue-strong);transition:all 0.15s;cursor:pointer}
.sd-wl-add-btn:hover{background:var(--tint-blue-strong);color:var(--accent-blue-lighter)}
.sd-wl-check{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:rgba(16,185,129,0.15);color:var(--accent-emerald-light);border:1px solid rgba(16,185,129,0.25);font-size:14px}
.sd-wl-remove{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:transparent;color:var(--text-faint);border:1px solid transparent;transition:all 0.15s;cursor:pointer;font-size:16px;line-height:1}
.sd-wl-remove:hover{background:rgba(239,68,68,0.15);color:var(--accent-red-light);border-color:rgba(239,68,68,0.25)}
.sd-wl-footer{padding:8px 10px;border-top:1px solid rgba(71,85,105,0.3);position:sticky;bottom:0;background:linear-gradient(145deg,#1e293b,#0f172a)}
.sd-wl-new-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:6px;padding:8px;font-size:11px;font-weight:600;color:var(--accent-blue-lighter);background:rgba(59,130,246,0.1);border:1px dashed rgba(59,130,246,0.35);border-radius:6px;transition:all 0.15s;cursor:pointer;letter-spacing:0.02em}
.sd-wl-new-btn:hover{background:rgba(59,130,246,0.18);color:#bfdbfe;border-color:rgba(59,130,246,0.5)}
.sd-wl-new-form{display:flex;align-items:center;gap:6px}
.sd-wl-new-form.hidden{display:none}
.sd-wl-new-input{flex:1;min-width:0;font-size:11px;background:rgba(15,23,42,0.6);border:1px solid rgba(59,130,246,0.35);border-radius:6px;padding:7px 8px;color:var(--text-body);font-family:inherit}
.sd-wl-new-input:focus{outline:none;border-color:var(--accent-blue);box-shadow:0 0 0 2px var(--tint-blue)}
.sd-wl-new-save{font-size:11px;font-weight:600;color:#fff;background:var(--accent-blue);border:none;border-radius:6px;padding:7px 10px;cursor:pointer;transition:background 0.15s}
.sd-wl-new-save:hover{background:var(--accent-blue-light)}
.sd-wl-new-cancel{font-size:16px;line-height:1;color:var(--text-faint);background:transparent;border:none;padding:4px 6px;cursor:pointer;transition:color 0.15s}
.sd-wl-new-cancel:hover{color:var(--text-body)}
#sd-watchlist-btn.has-matches #sd-watchlist-star{color:var(--accent-amber);fill:var(--accent-amber)}
body.light-theme .sd-watchlist-popover{background:linear-gradient(145deg,#fdfaf6,#f5efe7)!important;border-color:#e8e0d4!important;box-shadow:0 8px 25px rgba(0,0,0,0.08)!important}
body.light-theme .sd-wl-header{background:linear-gradient(145deg,#fdfaf6,#f5efe7)!important;border-bottom-color:#e8e0d4!important}
body.light-theme .sd-wl-footer{background:linear-gradient(145deg,#fdfaf6,#f5efe7)!important;border-top-color:#e8e0d4!important}
body.light-theme .sd-wl-header-title{color:#2c2418!important}
body.light-theme .sd-wl-row-name{color:#2c2418!important}
body.light-theme .sd-wl-row-count{color:#7a6a55!important}
body.light-theme .sd-wl-row:hover{background:rgba(59,130,246,0.06)!important}
body.light-theme .sd-wl-new-input{background:#fff!important;color:#2c2418!important}
@media(max-width:639px){.sd-watchlist-popover{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;max-height:75vh;border-radius:0.75rem 0.75rem 0 0}}

/* Circle user card */
.circle-card{transition:opacity 0.2s ease}
.circle-card.fade-out{opacity:0}

/* Encryption confirm/password modals */
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideUp{from{opacity:0;transform:translateY(12px) scale(0.97)}to{opacity:1;transform:translateY(0) scale(1)}}

/* Sync indicator */
@keyframes sync-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.sync-spinning svg{animation:sync-spin 1s linear infinite}

/* Hero zone gradient — tier 1 visual weight */
.content-area{background-image:var(--hero-gradient)}

/* Focus ring for accessibility */
*:focus-visible{outline:2px solid var(--accent-blue);outline-offset:2px;border-radius:4px}
/* Skip-to-content link */
.skip-to-content{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;z-index:100}
.skip-to-content:focus{position:fixed;top:0.5rem;left:50%;transform:translateX(-50%);width:auto;height:auto;padding:0.5rem 1.5rem;background:var(--accent-blue);color:#fff;font-size:0.875rem;font-weight:600;border-radius:0.5rem;z-index:100;box-shadow:0 4px 12px rgba(0,0,0,0.4)}

/* === Critical Tailwind fallbacks (ensures theme renders even if CDN fails) === */
.bg-\[\#0c1222\]{background:#0c1222}
.bg-\[\#0a0e19\]{background:#0a0e19}
.border-slate-800\/80{border-color:rgba(30,41,59,0.8)}
.border-slate-800\/60{border-color:rgba(30,41,59,0.6)}
.border-slate-700{border-color:var(--border-solid)}
.border-slate-700\/50{border-color:rgba(51,65,85,0.5)}
.border-slate-700\/40{border-color:rgba(51,65,85,0.4)}
.border-slate-600{border-color:var(--border-solid-strong)}
.text-gray-100{color:var(--text-primary)}
.text-gray-200{color:#e5e7eb}
.text-gray-300{color:var(--text-secondary)}
.text-gray-400{color:var(--text-muted)}
.text-gray-500{color:var(--text-dim)}
.text-blue-400{color:var(--accent-blue-light)}
.text-blue-400\/60{color:rgba(96,165,250,0.6)}
.text-emerald-400{color:var(--accent-emerald-light)}
.text-red-400{color:var(--accent-red-light)}
.text-amber-400{color:var(--accent-amber-light)}
.bg-amber-900\/30{background:rgba(120,53,15,0.3)}
.bg-emerald-900\/30{background:rgba(6,78,59,0.3)}
.bg-red-900\/30{background:rgba(127,29,29,0.3)}
.bg-blue-900\/30{background:rgba(30,58,138,0.3)}
.bg-gray-700{background:#374151}
.rounded-xl{border-radius:0.75rem}
.rounded-lg{border-radius:0.5rem}
.rounded{border-radius:0.25rem}
.font-mono{font-family:'JetBrains Mono',monospace}
.font-bold{font-weight:700}
.font-semibold{font-weight:600}
.font-medium{font-weight:500}
.tracking-wide{letter-spacing:0.025em}
.hidden{display:none}
.flex{display:flex}
.grid{display:grid}
.block{display:block}
.inline-flex{display:inline-flex}
.items-center{align-items:center}
.justify-between{justify-content:space-between}
.gap-1{gap:0.25rem}
.gap-1\.5{gap:0.375rem}
.gap-2{gap:0.5rem}
.gap-3{gap:0.75rem}
.gap-4{gap:1rem}
.p-3{padding:0.75rem}
.p-4{padding:1rem}
.p-5{padding:1.25rem}
.px-3{padding-left:0.75rem;padding-right:0.75rem}
.px-4{padding-left:1rem;padding-right:1rem}
.px-5{padding-left:1.25rem;padding-right:1.25rem}
.py-1{padding-top:0.25rem;padding-bottom:0.25rem}
.py-1\.5{padding-top:0.375rem;padding-bottom:0.375rem}
.py-2{padding-top:0.5rem;padding-bottom:0.5rem}
.py-2\.5{padding-top:0.625rem;padding-bottom:0.625rem}
.py-3{padding-top:0.75rem;padding-bottom:0.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}
.mb-1{margin-bottom:0.25rem}
.mb-2{margin-bottom:0.5rem}
.mb-3{margin-bottom:0.75rem}
.mb-4{margin-bottom:1rem}
.mt-1{margin-top:0.25rem}
.text-xs{font-size:0.75rem;line-height:1rem}
.text-sm{font-size:0.875rem;line-height:1.25rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-\[10px\]{font-size:10px}
.text-\[11px\]{font-size:11px}
.text-\[12\.5px\]{font-size:12.5px}
.w-full{width:100%}
.w-8{width:2rem}
.h-8{height:2rem}
.h-4{height:1rem}
.min-h-screen{min-height:100vh}
.overflow-hidden{overflow:hidden}
.overflow-x-auto{overflow-x:auto}
.relative{position:relative}
.absolute{position:absolute}
.fixed{position:fixed}
.border-b{border-bottom-width:1px;border-bottom-style:solid}
.border{border-width:1px;border-style:solid}
.transition-colors{transition:color 0.15s,background-color 0.15s,border-color 0.15s}
.transition-all{transition:all 0.15s}
#ticker-search-dropdown{position:absolute;top:100%;left:0;right:0;margin-top:4px;background:var(--bg-card-solid);border:1px solid var(--border-solid);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,0.5);z-index:200;max-height:280px;overflow-y:auto}
.ticker-result{padding:8px 12px;cursor:pointer;display:flex;align-items:baseline;gap:8px;transition:background 0.1s}
.ticker-result:hover,.ticker-result.active{background:rgba(139,92,246,0.15)}
.ticker-mode-btn,.twitter-tab-btn{padding:6px 10px;border-radius:8px;border:1px solid rgba(71,85,105,0.8);background:rgba(15,23,42,0.8);color:var(--text-slate);font-size:11px;font-weight:700;letter-spacing:0.04em;transition:all 0.15s;cursor:pointer}
.ticker-mode-btn.active,.twitter-tab-btn.active{background:rgba(124,58,237,0.18);border-color:rgba(139,92,246,0.7);color:var(--accent-violet-light);box-shadow:inset 0 0 0 1px rgba(139,92,246,0.15)}
.ticker-result-meta{font-size:9px;color:var(--text-faint);font-family:'JetBrains Mono',monospace;flex-shrink:0;text-transform:uppercase;letter-spacing:0.08em}

/* ========== LIGHT THEME ========== */
/* All overrides scoped under body.light-theme — dark theme is untouched */

body.light-theme{background:#faf6f1!important;color:#1e293b!important}
body.light-theme ::-webkit-scrollbar-thumb{background:#d4c9bb}
body.light-theme ::-webkit-scrollbar-thumb:hover{background:#b0a393}

/* Header */
body.light-theme header,
body.light-theme [class*="bg-[#0c1222]"],
body.light-theme [class*="bg-[#0a0e19]"],
body.light-theme [class*="bg-[#0a0f1a]"]{background:rgba(250,246,241,0.92)!important;border-color:#e8e0d4!important}

/* Sidebar */
body.light-theme aside,
body.light-theme [class*="bg-slate-900"]{background:#fdf9f4!important;border-color:#e8e0d4!important}
body.light-theme .sidebar-link{color:#5c5347!important}
body.light-theme .sidebar-link:hover:not(.active){background:#f5efe7!important}
body.light-theme .sidebar-link.active{background:linear-gradient(135deg,#e8ddd0,#f5efe7)!important;color:#8b6914!important}
body.light-theme .sidebar-link.active .sidebar-icon{color:#8b6914!important}

/* Cards */
body.light-theme .metric-card{background:linear-gradient(145deg,#fdfaf6 0%,#f5efe7 100%)!important;border-color:#e8e0d4!important}
body.light-theme .metric-card:hover{box-shadow:0 0 20px rgba(139,105,20,0.08),0 8px 25px rgba(0,0,0,0.05)!important;border-color:rgba(139,105,20,0.3)!important}
body.light-theme .panel-card{background:linear-gradient(145deg,#fdfaf6 0%,#f5efe7 100%)!important;border-color:#e8e0d4!important}
body.light-theme .panel-card:hover{border-color:#d4c9bb!important}
body.light-theme .sub-card{background:linear-gradient(145deg,#f5efe7 0%,#faf6f1 100%)!important;border-color:#e8e0d4!important}
body.light-theme .sub-card:hover{border-color:rgba(139,105,20,0.25)!important;box-shadow:0 0 12px rgba(139,105,20,0.06),0 4px 12px rgba(0,0,0,0.03)!important}
body.light-theme .dashboard-intro{background:radial-gradient(circle at top right, rgba(59,130,246,0.10), transparent 32%),linear-gradient(180deg,#fffaf5,#f5efe7)!important;border-color:#e8e0d4!important}
body.light-theme .dashboard-title,
body.light-theme .dashboard-mini-value,
body.light-theme .wl-card-symbol,
body.light-theme .metric-card .wl-value,
body.light-theme .metric-card>.text-xl,
body.light-theme .metric-card>.text-2xl{color:#0f172a!important}
body.light-theme .dashboard-lead,
body.light-theme .dashboard-mini-copy,
body.light-theme .section-copy{color:#475569!important}
body.light-theme .dashboard-mini-stat,
body.light-theme .section-pill{background:#fff!important;border-color:#e8e0d4!important}
body.light-theme .wl-label{color:#64748b!important}
body.light-theme .morning-brief-stat,
body.light-theme .morning-brief-block,
body.light-theme .morning-brief-action{background:#fff!important;border-color:#e8e0d4!important}
body.light-theme .morning-brief-title,
body.light-theme .morning-brief-stat-value,
body.light-theme .morning-brief-headline-title{color:#0f172a!important}
body.light-theme .morning-brief-copy,
body.light-theme .morning-brief-stat-meta,
body.light-theme .morning-brief-list li,
body.light-theme .morning-brief-headline-source,
body.light-theme .morning-brief-muted,
body.light-theme .morning-brief-meta,
body.light-theme .morning-brief-action-copy{color:#475569!important}
body.light-theme .options-radar-stat,
body.light-theme .options-radar-block,
body.light-theme .options-radar-action,
body.light-theme .options-radar-posture{background:#fff!important;border-color:#e8e0d4!important}
body.light-theme .options-radar-title,
body.light-theme .options-radar-stat-value,
body.light-theme .options-radar-posture-label,
body.light-theme .options-radar-action-label{color:#0f172a!important}
body.light-theme .options-radar-copy,
body.light-theme .options-radar-meta,
body.light-theme .options-radar-stat-meta,
body.light-theme .options-radar-stat-foot,
body.light-theme .options-radar-list li,
body.light-theme .options-radar-muted,
body.light-theme .options-radar-action-copy,
body.light-theme .options-radar-posture-copy{color:#475569!important}
body.light-theme .journal-memory-stat,
body.light-theme .journal-memory-block,
body.light-theme .journal-memory-list-item,
body.light-theme .journal-memory-drift,
body.light-theme .journal-memory-review,
body.light-theme .journal-memory-candidate{background:#fff!important;border-color:#e8e0d4!important}
body.light-theme .sd-ai-deep-card,
body.light-theme .sd-ai-deep-upgrade{background:#fff!important;border-color:#e8e0d4!important}
body.light-theme .journal-memory-title,
body.light-theme .journal-memory-stat-value,
body.light-theme .journal-memory-list-key,
body.light-theme .journal-memory-drift-key,
body.light-theme .journal-memory-review-key,
body.light-theme .journal-memory-candidate-title{color:#0f172a!important}
body.light-theme .sd-ai-deep-card-title,
body.light-theme .sd-ai-deep-pair-key,
body.light-theme .sd-ai-deep-upgrade-title{color:#0f172a!important}
body.light-theme .journal-memory-copy,
body.light-theme .journal-memory-block-copy,
body.light-theme .journal-memory-stat-copy,
body.light-theme .journal-memory-list-copy,
body.light-theme .journal-memory-list-meta,
body.light-theme .journal-memory-drift-copy,
body.light-theme .journal-memory-candidate-copy,
body.light-theme .journal-memory-candidate-meta{color:#475569!important}
body.light-theme .sd-ai-deep-copy,
body.light-theme .sd-ai-deep-hero-copy,
body.light-theme .sd-ai-deep-list li,
body.light-theme .sd-ai-deep-pair-value,
body.light-theme .sd-ai-deep-empty,
body.light-theme .sd-ai-deep-upgrade-copy{color:#475569!important}
body.light-theme .news-item .text-\[12\.5px\],
body.light-theme .wl-news-item .text-\[12px\]{color:#0f172a!important}

/* Ticker bar */
body.light-theme [class*="bg-[#0e1526]"]{background:#fdfaf6!important;border-color:#e8e0d4!important}

/* Content area background */
body.light-theme .content-area{background-image:radial-gradient(ellipse at top,rgba(180,140,60,0.04) 0%,transparent 60%)!important}
body.light-theme .content-area>section+section{border-color:rgba(212,201,187,0.5)}

/* Generic bg slate overrides */
body.light-theme [class*="bg-slate-800"]{background:#fdfaf6!important}
body.light-theme [class*="bg-slate-700"]{background:#f5efe7!important}
body.light-theme [class*="bg-slate-600"]{background:#e8e0d4!important}

/* Border overrides */
body.light-theme [class*="border-slate-800"]{border-color:#e8e0d4!important}
body.light-theme [class*="border-slate-700"]{border-color:#e8e0d4!important}
body.light-theme [class*="border-slate-600"]{border-color:#d4c9bb!important}

/* Text color overrides */
body.light-theme [class*="text-gray-100"]{color:#1e293b!important}
body.light-theme [class*="text-gray-200"]{color:#334155!important}
body.light-theme [class*="text-gray-300"]{color:#475569!important}
body.light-theme [class*="text-gray-400"]{color:#64748b!important}
body.light-theme [class*="text-gray-500"]{color:#94a3b8!important}
body.light-theme [class*="text-gray-600"]{color:#94a3b8!important}
body.light-theme [class*="text-white"]{color:#1e293b!important}

/* Keep colored text vivid on light background — darker shades for contrast on cream */
body.light-theme [class*="text-emerald-3"]{color:#10b981!important}
body.light-theme [class*="text-emerald-4"]{color:#059669!important}
body.light-theme [class*="text-emerald-5"]{color:#047857!important}
body.light-theme [class*="text-red-3"]{color:#ef4444!important}
body.light-theme [class*="text-red-4"]{color:#dc2626!important}
body.light-theme [class*="text-red-5"]{color:#b91c1c!important}
body.light-theme [class*="text-blue-4"]{color:#2563eb!important}
body.light-theme [class*="text-amber-4"]{color:#d97706!important}
body.light-theme [class*="text-violet-3"]{color:#7c3aed!important}
body.light-theme [class*="text-violet-4"]{color:#6d28d9!important}
body.light-theme [class*="text-violet-5"]{color:#5b21b6!important}

/* Amber text is too light on cream — darken for readability */
body.light-theme [class*="text-amber-2"]{color:#92400e!important}
body.light-theme [class*="text-amber-3"]{color:#92400e!important}
body.light-theme [class*="text-amber-5"]{color:#b45309!important}
body.light-theme [class*="hover\\:text-amber-2"]:hover{color:#78350f!important}

/* Badge backgrounds — slightly more opaque for light */
body.light-theme [class*="bg-emerald-900"]{background:rgba(6,78,59,0.1)!important}
body.light-theme [class*="bg-red-900"]{background:rgba(127,29,29,0.08)!important}
body.light-theme [class*="bg-amber-900"]{background:rgba(120,53,15,0.08)!important}
body.light-theme [class*="bg-blue-900"]{background:rgba(30,58,138,0.08)!important}
body.light-theme [class*="bg-violet-900"]{background:rgba(76,29,149,0.08)!important}
body.light-theme [class*="bg-gray-700"]{background:#e8e0d4!important}
body.light-theme [class*="bg-gray-800"]{background:#f5efe7!important}

/* Inputs and form controls */
body.light-theme input,body.light-theme textarea,body.light-theme select{background:#f5efe7!important;border-color:#d4c9bb!important;color:#334155!important}
body.light-theme input::placeholder,body.light-theme textarea::placeholder{color:#9c9084!important}
body.light-theme input:focus,body.light-theme textarea:focus{border-color:#c4a46c!important}

/* Dropdowns and popups */
body.light-theme .notif-dropdown{background:linear-gradient(145deg,#fdfaf6,#f5efe7)!important;border-color:#e8e0d4!important;box-shadow:0 8px 25px rgba(0,0,0,0.08)!important}
body.light-theme .notif-header{background:linear-gradient(145deg,#fdfaf6,#f5efe7)!important;border-bottom-color:#e8e0d4!important}
body.light-theme .notif-title{color:#2d2418!important}
body.light-theme .notif-view-all{color:#b07020!important}
body.light-theme .notif-view-all:hover{color:#845518!important}
body.light-theme .notif-section + .notif-section{border-top-color:#ead9c6!important}
body.light-theme .notif-section-title{color:#6b5b47!important}
body.light-theme #ticker-search-dropdown{background:#fdfaf6!important;border-color:#e8e0d4!important;box-shadow:0 8px 24px rgba(0,0,0,0.08)!important}
body.light-theme .ticker-result:hover,body.light-theme .ticker-result.active{background:rgba(139,105,20,0.08)!important}
body.light-theme .ticker-mode-btn,body.light-theme .twitter-tab-btn{background:#f5efe7!important;border-color:#d4c9bb!important;color:#5c5347!important}
body.light-theme .ticker-mode-btn.active,body.light-theme .twitter-tab-btn.active{background:rgba(139,105,20,0.08)!important;border-color:rgba(180,140,60,0.5)!important;color:#8b6914!important}

/* Toasts */
body.light-theme .toast.toast-success{background:rgba(220,252,231,0.95)!important;border-color:rgba(34,197,94,0.3)!important;color:#166534!important}
body.light-theme .toast.toast-error{background:rgba(254,226,226,0.95)!important;border-color:var(--tint-red-strong)!important;color:#991b1b!important}
body.light-theme .toast.toast-warning{background:rgba(254,249,195,0.95)!important;border-color:rgba(234,179,8,0.3)!important;color:#854d0e!important}

/* Shimmer light-theme override moved to Day 6 skeleton primitives section */

/* Tables */
body.light-theme table th{background:#f5efe7!important}
body.light-theme table tr:hover td{background:rgba(245,239,231,0.5)}
body.light-theme [class*="divide-slate"]{--tw-divide-opacity:1;border-color:#e8e0d4}

/* Modals / stock detail */
body.light-theme [class*="bg-[#0a0f1a]"]{background:#faf6f1!important}
body.light-theme #stock-detail-modal>div>div{background:#fdfaf6!important;border-color:#e8e0d4!important}

/* News items */
body.light-theme .news-item:hover{background:rgba(245,239,231,0.8)!important}

/* Hover states */
body.light-theme [class*="hover\\:bg-slate-700"]:hover{background:#f5efe7!important}

/* Journal */
body.light-theme .j-sent-bullish{background:rgba(16,185,129,0.08)!important}
body.light-theme .j-sent-bearish{background:rgba(239,68,68,0.08)!important}
body.light-theme .j-sent-neutral{background:rgba(156,163,175,0.08)!important}

/* Chart grid lines — override via CSS variable won't work, handled in JS */

/* Gradient text (brand) stays as-is */

/* Prevent flash of dark theme on light-mode page load */
html.light-pre body{background:#faf6f1!important;color:#1e293b!important}

/* Theme toggle button */
.theme-toggle{transition:all 0.2s}
.theme-toggle svg{transition:transform 0.3s ease}

/* ========== SECTOR ROTATION ========== */
/* Scoped container — prevents inheritance from .metric-card / .panel-card gradients */
.rotation-surface{
  background:var(--bg-inset);
  border:1px solid rgba(51,65,85,0.5);
}
.rotation-strip{
  background:linear-gradient(90deg,rgba(15,23,42,0.9),rgba(30,41,59,0.9));
  border:1px solid rgba(51,65,85,0.5);
}
.rotation-window-btn{
  background:transparent;
  color:var(--text-slate);
  border:1px solid rgba(71,85,105,0.5);
}
.rotation-window-btn:hover{color:var(--text-body);background:rgba(51,65,85,0.4)}
.rotation-window-btn.active{background:var(--tint-blue);color:var(--accent-blue-lighter);border-color:rgba(59,130,246,0.4)}

/* Grid: 4 cols desktop, 2 cols tablet, 1 col mobile */
.rotation-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}
@media (max-width:767px){
  .rotation-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:479px){
  .rotation-grid{grid-template-columns:1fr}
}

/* Tile: base + diverging color ramp via --tile-ramp var */
.rotation-tile{
  position:relative;
  padding:10px 12px;
  border-radius:8px;
  cursor:pointer;
  border:1px solid rgba(51,65,85,0.4);
  background:var(--tile-bg,rgba(30,41,59,0.6));
  transition:transform 0.12s ease,border-color 0.12s ease;
  outline:none;
}
.rotation-tile:hover{transform:translateY(-1px);border-color:rgba(148,163,184,0.5)}
.rotation-tile:focus-visible{box-shadow:0 0 0 2px var(--accent-blue),0 0 0 4px var(--border-hover)}
.rotation-tile[aria-selected="true"]{border-color:rgba(59,130,246,0.5)}
.rotation-tile .rot-rank{
  position:absolute;top:6px;right:8px;
  font-size:9px;font-family:JetBrains Mono,ui-monospace,monospace;
  color:rgba(148,163,184,0.7);
}
.rotation-tile .rot-label{
  font-size:11px;font-weight:600;color:var(--text-body);
  margin-bottom:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.rotation-tile .rot-etf{
  font-size:9px;font-family:JetBrains Mono,ui-monospace,monospace;
  color:rgba(148,163,184,0.6);
  margin-bottom:6px;
}
.rotation-tile .rot-return{
  font-size:14px;font-weight:700;font-family:JetBrains Mono,ui-monospace,monospace;
  color:var(--tile-text,var(--text-body));
}
.rotation-tile .rot-delta-dot{
  position:absolute;bottom:8px;right:8px;
  width:6px;height:6px;border-radius:50%;
  background:var(--accent-emerald);
  box-shadow:0 0 0 2px rgba(16,185,129,0.25);
  animation:rot-pulse 2s ease-in-out infinite;
}
.rotation-tile .rot-delta-dot.down{background:var(--accent-red);box-shadow:0 0 0 2px rgba(239,68,68,0.25)}
@keyframes rot-pulse{
  0%,100%{opacity:1}
  50%{opacity:0.4}
}

/* Diverging color ramp — 7 stops from deep red to deep emerald */
.rot-ramp-r3{--tile-bg:rgba(127,29,29,0.65);--tile-text:#fecaca}
.rot-ramp-r2{--tile-bg:rgba(153,27,27,0.55);--tile-text:#fecaca}
.rot-ramp-r1{--tile-bg:rgba(185,28,28,0.4);--tile-text:#fee2e2}
.rot-ramp-0 {--tile-bg:rgba(51,65,85,0.5);--tile-text:var(--text-body)}
.rot-ramp-g1{--tile-bg:rgba(5,150,105,0.4);--tile-text:#d1fae5}
.rot-ramp-g2{--tile-bg:rgba(4,120,87,0.55);--tile-text:#a7f3d0}
.rot-ramp-g3{--tile-bg:rgba(6,95,70,0.65);--tile-text:var(--accent-emerald-lighter)}

/* Multi-window heatmap table */
.rotation-mw-table{
  width:100%;border-collapse:collapse;
  font-family:JetBrains Mono,ui-monospace,monospace;
  font-size:10px;
}
.rotation-mw-table th{
  padding:4px 6px;color:var(--text-faint);font-size:9px;font-weight:600;
  text-transform:uppercase;letter-spacing:0.05em;
  border-bottom:1px solid rgba(51,65,85,0.5);
  cursor:pointer;white-space:nowrap;
  text-align:right;
}
.rotation-mw-table th:first-child{text-align:left}
.rotation-mw-table th:hover{color:var(--text-slate)}
.rotation-mw-table th.active-sort{color:var(--accent-blue-lighter)}
.rotation-mw-table td{
  padding:4px 6px;text-align:right;font-weight:600;
  border-bottom:1px solid rgba(51,65,85,0.2);
  background:var(--tile-bg,transparent);
  color:var(--tile-text,var(--text-body));
  white-space:nowrap;
}
.rotation-mw-table td:first-child{
  text-align:left;font-weight:600;color:var(--text-body);
  background:transparent;font-size:11px;
}
.rotation-mw-table td .mw-etf{font-size:8px;color:var(--text-faint);margin-left:4px}
.rotation-mw-table tr:hover td{filter:brightness(1.15)}
.rotation-mw-table td.mw-rank{font-size:8px;color:var(--text-slate);background:transparent;text-align:center;padding:4px 2px}

/* Multi-window table mobile */
@media(max-width:639px){
  .rotation-mw-table{font-size:9px;min-width:580px}
  .rotation-mw-table th{padding:3px 4px;font-size:8px}
  .rotation-mw-table td{padding:3px 4px}
  .rotation-mw-table td:first-child{font-size:10px;max-width:110px;overflow:hidden;text-overflow:ellipsis}
  .rotation-mw-table td .mw-etf{display:none}
  #rotation-multiwindow-table,#in-rotation-multiwindow-table{
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;scrollbar-color:rgba(71,85,105,0.5) transparent;
  }
  #rotation-multiwindow-table::-webkit-scrollbar,#in-rotation-multiwindow-table::-webkit-scrollbar{height:4px}
  #rotation-multiwindow-table::-webkit-scrollbar-thumb,#in-rotation-multiwindow-table::-webkit-scrollbar-thumb{background:rgba(71,85,105,0.5);border-radius:2px}
}

/* Performance chart wrapper */
.perf-chart-wrap{height:320px}
@media(max-width:639px){
  .perf-chart-wrap{height:220px}
}

/* Performance chart range buttons */
.rotation-perf-range-btn{
  background:transparent;
  color:var(--text-slate);
  border:1px solid rgba(71,85,105,0.5);
}
.rotation-perf-range-btn:hover{color:var(--text-body);background:rgba(51,65,85,0.4)}
.rotation-perf-range-btn.active{background:var(--tint-blue);color:var(--accent-blue-lighter);border-color:rgba(59,130,246,0.4)}

/* India rotation buttons (same style as US) */
.in-rotation-window-btn{background:transparent;color:var(--text-slate);border:1px solid rgba(71,85,105,0.5)}
.in-rotation-window-btn:hover{color:var(--text-body);background:rgba(51,65,85,0.4)}
.in-rotation-window-btn.active{background:var(--tint-blue);color:var(--accent-blue-lighter);border-color:rgba(59,130,246,0.4)}
.in-rotation-perf-range-btn{background:transparent;color:var(--text-slate);border:1px solid rgba(71,85,105,0.5)}
.in-rotation-perf-range-btn:hover{color:var(--text-body);background:rgba(51,65,85,0.4)}
.in-rotation-perf-range-btn.active{background:var(--tint-blue);color:var(--accent-blue-lighter);border-color:rgba(59,130,246,0.4)}

/* India rotation skeleton tiles — preserves 88px min-height; shared animation lives in Day 6 section */
.rotation-skeleton-tile{min-height:88px}

/* India drill-down panel */
.in-drilldown-panel{
  position:fixed;right:0;top:0;bottom:0;width:340px;max-width:90vw;
  background:var(--bg-card-deep);border-left:1px solid var(--border-primary);
  transform:translateX(100%);transition:transform 0.25s cubic-bezier(.4,0,.2,1);
  z-index:60;overflow-y:auto;
}
.in-drilldown-panel.open{transform:translateX(0)}
.in-drilldown-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:59;
  opacity:0;pointer-events:none;transition:opacity 0.25s;
}
.in-drilldown-backdrop.open{opacity:1;pointer-events:auto}
@media(max-width:639px){
  .in-drilldown-panel{
    top:auto;right:0;left:0;bottom:0;width:100%;max-width:100%;
    max-height:70vh;border-left:none;border-top:1px solid var(--border-primary);
    transform:translateY(100%);border-radius:12px 12px 0 0;
  }
  .in-drilldown-panel.open{transform:translateY(0)}
}

/* Themes list table */
.rotation-themes-row{
  display:grid;
  grid-template-columns:1.5fr 0.6fr 0.9fr 0.9fr 0.5fr;
  gap:8px;align-items:center;
  padding:8px 4px;
  border-bottom:1px solid rgba(51,65,85,0.3);
  font-size:11px;
}
.rotation-themes-row.header{
  font-size:9px;font-family:JetBrains Mono,ui-monospace,monospace;
  color:var(--text-faint);text-transform:uppercase;letter-spacing:0.05em;
  border-bottom:1px solid rgba(51,65,85,0.5);
  cursor:pointer;
}
.rotation-themes-row.header:hover{color:var(--text-slate)}
.rotation-themes-row .rot-theme-label{color:var(--text-body);font-weight:600}
.rotation-themes-row .rot-theme-etf{font-family:JetBrains Mono,ui-monospace,monospace;color:var(--text-faint);font-size:9px}
.rotation-themes-row .rot-theme-value{font-family:JetBrains Mono,ui-monospace,monospace;font-weight:600;text-align:right}
.rotation-themes-row:hover{background:rgba(30,41,59,0.35)}
.rotation-themes-row.is-custom{position:relative}
.rotation-themes-row.shimmer::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.05),transparent);
  background-size:200% 100%;
  animation:rot-shimmer 1.2s infinite;
}
@keyframes rot-shimmer{
  0%{background-position:200% 0}
  100%{background-position:-200% 0}
}

/* Drawer: single DOM node, CSS toggles shape via media query */
.rotation-drawer{
  position:fixed;
  z-index:60;
  background:var(--bg-card-deep);
  border:1px solid rgba(51,65,85,0.8);
  box-shadow:-24px 0 48px rgba(0,0,0,0.45);
  transition:transform 0.22s ease,opacity 0.22s ease;
  display:flex;flex-direction:column;
  overflow:hidden;
}
.rotation-drawer-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:55;
  opacity:0;transition:opacity 0.22s ease;pointer-events:none;
}
.rotation-drawer-backdrop.is-open{opacity:1;pointer-events:auto}
.rotation-drawer-backdrop.hidden{display:none}
.rotation-drawer.hidden{display:none}

/* Desktop / tablet: slide from right */
@media (min-width:768px){
  .rotation-drawer{
    top:0;right:0;bottom:0;
    width:480px;max-width:90vw;
    transform:translateX(100%);
    border-left:1px solid rgba(51,65,85,0.8);
    border-top:none;border-right:none;border-bottom:none;
  }
  .rotation-drawer.is-open{transform:translateX(0)}
}
/* Mobile: slide from bottom */
@media (max-width:767px){
  .rotation-drawer{
    left:0;right:0;bottom:0;
    width:100%;max-height:85vh;
    border-top:1px solid rgba(51,65,85,0.8);
    border-top-left-radius:16px;border-top-right-radius:16px;
    transform:translateY(100%);
  }
  .rotation-drawer.is-open{transform:translateY(0)}
}
.rotation-drawer-header{
  display:flex;align-items:flex-start;justify-content:space-between;
  padding:14px 16px 10px 16px;
  border-bottom:1px solid rgba(51,65,85,0.4);
}
.rotation-drawer-meta{
  padding:8px 16px;
  font-size:10px;font-family:JetBrains Mono,ui-monospace,monospace;
  color:var(--text-slate);
  border-bottom:1px solid rgba(51,65,85,0.3);
}
.rotation-drawer-body{
  padding:12px 16px 20px 16px;
  overflow-y:auto;
  flex:1;
  font-size:11px;
}

/* .rotation-skeleton — shimmer styles now live in Day 6 skeleton primitives section */

/* Undo toast — scoped to rotation */
.rotation-undo-toast{
  position:fixed;bottom:20px;left:50%;transform:translateX(-50%);
  background:var(--bg-card-solid);border:1px solid rgba(71,85,105,0.6);
  padding:10px 14px;border-radius:8px;
  font-size:12px;color:var(--text-body);
  z-index:70;
  box-shadow:0 8px 24px rgba(0,0,0,0.4);
  display:flex;align-items:center;gap:12px;
}
.rotation-undo-toast button{
  background:transparent;border:none;color:var(--accent-blue-light);
  font-size:11px;font-weight:600;cursor:pointer;
}
.rotation-undo-toast button:hover{color:var(--accent-blue-lighter)}

/* Light theme re-mappings */
body.light-theme .rotation-surface{
  background:rgba(255,255,255,0.6);
  border-color:rgba(217,210,196,0.8);
}
body.light-theme .rotation-strip{
  background:linear-gradient(90deg,rgba(250,246,241,0.9),rgba(245,238,226,0.9));
  border-color:rgba(217,210,196,0.8);
}
body.light-theme .rotation-tile .rot-label{color:#1e293b}
body.light-theme .rotation-tile .rot-etf,
body.light-theme .rotation-tile .rot-rank{color:#64748b}
body.light-theme .rot-ramp-r3{--tile-bg:rgba(239,68,68,0.22);--tile-text:#7f1d1d}
body.light-theme .rot-ramp-r2{--tile-bg:rgba(239,68,68,0.15);--tile-text:#991b1b}
body.light-theme .rot-ramp-r1{--tile-bg:rgba(239,68,68,0.08);--tile-text:#b91c1c}
body.light-theme .rot-ramp-0 {--tile-bg:rgba(245,238,226,0.8);--tile-text:#1e293b}
body.light-theme .rot-ramp-g1{--tile-bg:var(--tint-emerald);--tile-text:#065f46}
body.light-theme .rot-ramp-g2{--tile-bg:rgba(16,185,129,0.22);--tile-text:#047857}
body.light-theme .rot-ramp-g3{--tile-bg:rgba(16,185,129,0.32);--tile-text:#065f46}
body.light-theme .rotation-drawer{background:#faf6f1;border-color:rgba(217,210,196,0.8)}
body.light-theme .rotation-drawer-meta{color:#64748b}
body.light-theme .rotation-themes-row .rot-theme-label{color:#1e293b}
body.light-theme .rotation-undo-toast{background:#faf6f1;color:#1e293b;border-color:rgba(217,210,196,0.8)}

/* ========== TERMINAL REDESIGN COMPONENTS ========== */
/* Pill badges — standardized across all pages */
.pill{padding:4px 10px;border-radius:16px;font-size:0.75rem;font-weight:600;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.pill-green{background:var(--tint-emerald);color:var(--accent-emerald)}
.pill-red{background:var(--tint-red);color:var(--accent-red-light)}
.pill-blue{background:rgba(59,130,246,0.12);color:var(--accent-blue-light)}
.pill-amber{background:var(--tint-amber);color:var(--accent-amber-light)}
.pill-neutral{background:rgba(71,85,105,0.25);color:var(--text-muted)}
body.light-theme .pill-green{background:#D1FAE5;color:#059669}
body.light-theme .pill-red{background:#FEE2E2;color:#DC2626}
body.light-theme .pill-blue{background:#DBEAFE;color:#2563EB}
body.light-theme .pill-amber{background:#FEF3C7;color:#D97706}
body.light-theme .pill-neutral{background:#E2E8F0;color:#475569}

/* Stat card — 4-col macro overview strip */
.stat-card{border:1px solid var(--border-primary);border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:8px;background:var(--bg-inset)}
.stat-label{font-size:0.75rem;color:var(--text-muted);text-transform:uppercase;font-weight:600;letter-spacing:0.05em}
.stat-value{font-size:1.5rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--text-primary)}
.stat-sub{font-size:0.75rem;color:var(--text-secondary)}
body.light-theme .stat-card{background:#fff;border-color:#E2E8F0}
body.light-theme .stat-label{color:#64748B}
body.light-theme .stat-value{color:#0F172A}
body.light-theme .stat-sub{color:#334155}

/* Data table — shared across watchlist, signal matrix, macro */
.data-table{width:100%;border-collapse:collapse}
.data-table th{text-align:left;font-size:0.75rem;color:var(--text-muted);text-transform:uppercase;padding:0 0 12px;border-bottom:1px solid var(--border-primary);font-weight:600;letter-spacing:0.05em}
.data-table th.right,.data-table td.right{text-align:right}
.data-table td{padding:14px 0;border-bottom:1px solid rgba(51,65,85,0.3);font-size:0.875rem;font-weight:500;color:var(--text-primary)}
.data-table tr:last-child td{border-bottom:none}
.data-table tr:hover td{background:rgba(30,41,59,0.4)}
.data-table .tabular{font-variant-numeric:tabular-nums}
body.light-theme .data-table th{color:#64748B;border-bottom-color:#E2E8F0}
body.light-theme .data-table td{color:#0F172A;border-bottom-color:#E2E8F0}
body.light-theme .data-table tr:hover td{background:rgba(241,245,249,0.6)}

/* Sector heatmap card — rotation page */
.sector-hm-card{border:1px solid var(--border-primary);border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:12px;background:var(--bg-inset)}
.sector-hm-card:hover{border-color:rgba(148,163,184,0.5)}
.heatmap-row{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;text-align:center;font-size:0.75rem;font-weight:600;font-variant-numeric:tabular-nums}
.heat-box{padding:6px 0;border-radius:4px}
.heat-g3{background:var(--accent-emerald);color:white}.heat-g2{background:var(--accent-emerald-light);color:white}.heat-g1{background:var(--tint-emerald);color:var(--accent-emerald)}
.heat-0{background:rgba(71,85,105,0.25);color:var(--text-muted)}
.heat-r1{background:var(--tint-red);color:var(--accent-red-light)}.heat-r2{background:var(--accent-red-light);color:white}.heat-r3{background:var(--accent-red);color:white}
body.light-theme .sector-hm-card{background:#fff;border-color:#E2E8F0}
body.light-theme .heat-g1{background:#D1FAE5;color:#059669}
body.light-theme .heat-0{background:#E2E8F0;color:#475569}
body.light-theme .heat-r1{background:#FEE2E2;color:#DC2626}

/* News item — consistent across news, Truth, Twitter */
.news-item-clean{padding:16px 0;border-bottom:1px solid rgba(51,65,85,0.3);display:flex;flex-direction:column;gap:8px}
.news-item-clean:last-child{border-bottom:none}
.news-item-clean .news-title{font-size:0.875rem;font-weight:500;color:var(--text-primary);line-height:1.4}
.news-item-clean .news-title:hover{color:var(--accent-blue-light);cursor:pointer}
.news-item-clean .news-meta{font-size:0.75rem;color:var(--text-muted);display:flex;gap:8px;align-items:center}
body.light-theme .news-item-clean{border-bottom-color:#E2E8F0}
body.light-theme .news-item-clean .news-title{color:#0F172A}
body.light-theme .news-item-clean .news-title:hover{color:#2563EB}
body.light-theme .news-item-clean .news-meta{color:#64748B}

/* Market toggle — rotation page US/India switcher */
.market-toggle{display:inline-flex;border-radius:8px;border:1px solid var(--border-primary);overflow:hidden;background:var(--bg-inset)}
.market-toggle-btn{padding:8px 20px;font-size:0.8125rem;font-weight:600;color:var(--text-muted);background:transparent;border:none;cursor:pointer;transition:all 0.15s}
.market-toggle-btn:hover{color:var(--text-body);background:rgba(51,65,85,0.4)}
.market-toggle-btn.active{background:var(--tint-blue);color:var(--accent-blue-lighter)}
body.light-theme .market-toggle{background:#F8FAFC;border-color:#E2E8F0}
body.light-theme .market-toggle-btn{color:#64748B}
body.light-theme .market-toggle-btn:hover{color:#0F172A;background:#F1F5F9}
body.light-theme .market-toggle-btn.active{background:#DBEAFE;color:#2563EB}

/* Rotation page layout */
.rotation-page-card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:12px;padding:24px;margin-bottom:24px}
.rotation-page-card .card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.rotation-page-card .card-title{font-size:1rem;font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:8px}
body.light-theme .rotation-page-card{background:#fff;border-color:#E2E8F0}
body.light-theme .rotation-page-card .card-title{color:#0F172A}

/* ========== DARK UI POLISH LAYER ========== */
:root{
  --surface-card:linear-gradient(180deg,rgba(30,41,59,0.96) 0%,rgba(15,23,42,0.96) 100%);
  --surface-soft:rgba(15,23,42,0.72);
  --surface-hover:rgba(30,41,59,0.82);
  --shadow-card:0 14px 34px rgba(2,6,23,0.22);
  --shadow-card-hover:0 18px 40px rgba(2,6,23,0.30);
}

.metric-card,.panel-card,.sub-card,.rotation-surface,.rotation-strip,
.feature-card,.theme-card,.stock-card,.stock-row,.search-wrap,.settings-card{
  position:relative;
  box-shadow:var(--shadow-card);
}

.metric-card::before,.panel-card::before,.sub-card::before,.rotation-surface::before,
.feature-card::before,.theme-card::before,.stock-card::before,.settings-card::before{
  content:'';
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(148,163,184,0.20),transparent);
  pointer-events:none;
}

.metric-card:hover,.panel-card:hover,.sub-card:hover,.rotation-surface:hover,
.feature-card:hover,.theme-card:hover,.stock-card:hover,.stock-row:hover,.settings-card:hover{
  box-shadow:var(--shadow-card-hover);
}

.metric-card{
  padding:1rem;
  border-radius:1rem;
  background:
    radial-gradient(circle at top right, rgba(96,165,250,0.08), transparent 32%),
    linear-gradient(180deg, rgba(24,35,56,0.98), rgba(15,23,42,0.98));
  border-color:rgba(71,85,105,0.62);
}

.metric-card > *:not(.absolute){
  position:relative;
  z-index:1;
}

.metric-card .wl-value,
.metric-card > .text-xl,
.metric-card > .text-2xl{
  color:var(--text-bright);
  letter-spacing:-0.03em;
  font-variant-numeric:tabular-nums;
}

.metric-card .text-\[10px\],
.metric-card .text-\[11px\],
.panel-card .text-\[10px\],
.panel-card .text-\[11px\],
.sub-card .text-\[10px\],
.sub-card .text-\[11px\]{
  letter-spacing:0.04em;
}

.panel-card{
  border-radius:1rem;
  background:
    radial-gradient(circle at top, rgba(255,255,255,0.03), transparent 36%),
    linear-gradient(180deg, rgba(24,35,56,0.98), rgba(15,23,42,0.99));
  border-color:rgba(71,85,105,0.58);
}

.sub-card{
  border-radius:0.9rem;
  background:
    linear-gradient(180deg, rgba(20,30,49,0.94), rgba(15,23,42,0.88));
  border-color:rgba(71,85,105,0.46);
}

.search-wrap,.settings-card,.feature-card,.theme-card,.stock-card,.stock-row{
  border-radius:0.95rem;
}

.search-wrap{
  background:linear-gradient(180deg,rgba(15,23,42,0.90),rgba(15,23,42,0.72));
  box-shadow:inset 0 1px 0 rgba(148,163,184,0.06),var(--shadow-card);
}

.search-wrap input{
  letter-spacing:0.01em;
}

.search-wrap:focus-within{
  transform:translateY(-1px);
}

/* Inline market toggle inside the semantic search bar (US | IN) */
.sem-mkt-btn.active{
  background:rgba(59,130,246,0.15);
  color:#93c5fd;
}
.sem-mkt-btn:focus-visible{
  outline:none;
  box-shadow:inset 0 0 0 1.5px rgba(59,130,246,0.55);
}

/* Deep scenario-analysis toggle (⚡) */
.sem-deep-btn.active{
  background:linear-gradient(135deg,rgba(245,158,11,0.18),rgba(139,92,246,0.14));
  border-color:rgba(245,158,11,0.45);
  color:#fcd34d;
}
.sem-deep-btn.active:hover{
  color:#fef3c7;
}
.sem-deep-btn:focus-visible{
  outline:none;
  box-shadow:inset 0 0 0 1.5px rgba(245,158,11,0.55);
}

/* Deep-mode theme section — impact chip + reasoning line */
.deep-theme-impact{
  font-size:10px;
  font-weight:600;
  letter-spacing:0.04em;
  padding:2px 6px;
  border-radius:4px;
  text-transform:uppercase;
  display:inline-flex;
  align-items:center;
  gap:3px;
}
.deep-theme-impact.positive{
  background:rgba(16,185,129,0.15);
  color:#6ee7b7;
  border:1px solid rgba(16,185,129,0.3);
}
.deep-theme-impact.negative{
  background:rgba(239,68,68,0.15);
  color:#fca5a5;
  border:1px solid rgba(239,68,68,0.3);
}
.deep-theme-impact.mixed{
  background:rgba(245,158,11,0.15);
  color:#fcd34d;
  border:1px solid rgba(245,158,11,0.3);
}
.deep-theme-reasoning{
  font-size:11px;
  color:#94a3b8;
  font-style:italic;
  line-height:1.4;
  margin-top:2px;
}

/* Deep-mode progress hint below the spinner */
.deep-progress{
  font-size:11px;
  font-family:'JetBrains Mono','Consolas',monospace;
  color:#94a3b8;
  margin-top:8px;
  letter-spacing:0.01em;
}

/* Diagnostics / Observability panel (deep-search mode) */
.diag-panel{
  margin:8px 0 18px 0;
  border:1px solid rgba(51,65,85,0.5);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(15,23,42,0.6),rgba(15,23,42,0.35));
  font-family:'JetBrains Mono','Consolas',monospace;
  overflow:hidden;
}
.diag-panel[open]{
  border-color:rgba(59,130,246,0.25);
}
.diag-panel-head{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  cursor:pointer;
  list-style:none;
  user-select:none;
  background:rgba(30,41,59,0.35);
}
.diag-panel-head::-webkit-details-marker{display:none;}
.diag-panel-title{
  font-size:13px;
  font-weight:700;
  letter-spacing:0.08em;
  color:#cbd5e1;
  text-transform:uppercase;
  flex:1;
}
.diag-panel-total{
  font-size:13px;
  color:#94a3b8;
}
.diag-panel-total strong{
  color:#e2e8f0;
  font-weight:600;
}
.diag-panel-chevron{
  font-size:14px;
  color:#64748b;
  transition:transform 0.15s;
}
.diag-panel[open] .diag-panel-chevron{
  transform:rotate(180deg);
}
.diag-panel-body{
  padding:12px 14px 14px;
}
.diag-section-title{
  font-size:12px;
  font-weight:700;
  letter-spacing:0.12em;
  color:#64748b;
  text-transform:uppercase;
  margin:14px 0 8px;
}
.diag-section-title:first-child{margin-top:0;}

.diag-subsection{
  margin:14px 0 8px;
}
.diag-subsection-head{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:28px;
  cursor:pointer;
  list-style:none;
  user-select:none;
}
.diag-subsection-head::-webkit-details-marker{display:none;}
.diag-subsection-title{
  font-size:12px;
  font-weight:700;
  letter-spacing:0.12em;
  color:#64748b;
  text-transform:uppercase;
}
.diag-subsection-meta{
  font-size:12px;
  color:#64748b;
  margin-left:auto;
}
.diag-subsection-chevron{
  font-size:13px;
  color:#64748b;
  transition:transform 0.15s;
}
.diag-subsection[open] .diag-subsection-chevron{
  transform:rotate(180deg);
}
.diag-subsection .diag-steps{
  margin-top:6px;
}

/* Status dots */
.diag-dot{
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  margin-right:8px;
  vertical-align:middle;
  background:#64748b;
}
.diag-dot-ok{background:#10b981;box-shadow:0 0 6px rgba(16,185,129,0.55);}
.diag-dot-warn{background:#f59e0b;}
.diag-dot-err{background:#ef4444;}

/* Pipeline step list */
.diag-steps{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.diag-step{
  display:grid;
  grid-template-columns:22px 1fr auto;
  gap:10px;
  padding:8px 2px;
  border-bottom:1px solid rgba(51,65,85,0.25);
}
.diag-step:last-child{border-bottom:none;}
.diag-step-num{
  color:#64748b;
  font-size:12px;
  line-height:1.6;
  text-align:right;
  padding-top:1px;
}
.diag-step-main{
  min-width:0;
}
.diag-step-title{
  font-size:14px;
  color:#e2e8f0;
  font-weight:500;
  line-height:1.4;
}
.diag-step-detail{
  color:#64748b;
  font-size:13px;
  font-weight:400;
  margin-left:4px;
}
.diag-step-meta{
  color:#94a3b8;
  font-size:13px;
  margin-top:2px;
  line-height:1.4;
}
.diag-step-ms{
  color:#cbd5e1;
  font-size:14px;
  font-weight:600;
  padding-top:1px;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}

/* Key-value rows (query block) */
.diag-kv{
  background:rgba(15,23,42,0.4);
  border-radius:6px;
  padding:8px 10px;
}
.diag-kv-row{
  display:grid;
  grid-template-columns:68px 1fr;
  gap:10px;
  padding:3px 0;
  font-size:13px;
}
.diag-kv-k{
  color:#64748b;
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:0.06em;
  padding-top:1px;
}
.diag-kv-v{
  color:#cbd5e1;
  word-break:break-word;
}

/* Theme table */
.diag-theme-table{
  background:rgba(15,23,42,0.4);
  border-radius:6px;
  overflow-x:auto;  /* horizontal scroll on narrow viewports */
}
.diag-theme-head,
.diag-theme-row{
  display:grid;
  grid-template-columns:minmax(130px,1.2fr) 100px 1fr 2fr 120px;
  gap:12px;
  padding:6px 10px;
  font-size:13px;
  align-items:start;
  min-width:860px;  /* guarantees all 5 columns render without squeeze */
}
.diag-theme-head{
  color:#64748b;
  font-size:12px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  border-bottom:1px solid rgba(51,65,85,0.3);
}
.diag-theme-row{
  border-bottom:1px solid rgba(51,65,85,0.2);
  color:#cbd5e1;
}
.diag-theme-row:last-child{border-bottom:none;}
.diag-theme-row .diag-th-name{
  color:#e2e8f0;
  font-weight:500;
}
.diag-theme-row .diag-th-impact.positive{color:#6ee7b7;}
.diag-theme-row .diag-th-impact.negative{color:#fca5a5;}
.diag-theme-row .diag-th-impact.mixed{color:#fcd34d;}
.diag-theme-row .diag-th-kw{
  color:#94a3b8;
  line-height:1.35;
}
.diag-theme-row .diag-th-query{
  color:#cbd5e1;
  line-height:1.35;
  font-style:italic;
  /* Let very long composed sub-queries wrap instead of expanding the grid */
  word-break:break-word;
}
.diag-theme-row .diag-th-count{
  color:#94a3b8;
  text-align:right;
  font-variant-numeric:tabular-nums;
}

@media (max-width:720px){
  .diag-theme-head,.diag-theme-row{
    grid-template-columns:1fr;
    gap:2px;
    padding:8px 10px;
    min-width:0;
  }
  .diag-theme-table{overflow-x:visible;}
  .diag-theme-row .diag-th-count,
  .diag-theme-row .diag-th-impact{text-align:left;}
  .diag-theme-head .diag-th-impact,
  .diag-theme-head .diag-th-kw,
  .diag-theme-head .diag-th-query,
  .diag-theme-head .diag-th-count{display:none;}  /* hide header labels on mobile; rows stack */
  .diag-theme-row .diag-th-query{padding-left:8px;border-left:2px solid rgba(59,130,246,0.3);}
}

/* Raw JSON dropdown */
.diag-raw{
  margin-top:12px;
  border-top:1px dashed rgba(51,65,85,0.35);
  padding-top:8px;
}
.diag-raw summary{
  font-size:12px;
  color:#64748b;
  letter-spacing:0.08em;
  text-transform:uppercase;
  cursor:pointer;
  padding:4px 0;
}
.diag-raw summary:hover{color:#94a3b8;}
.diag-raw-pre{
  font-size:12px;
  color:#94a3b8;
  background:rgba(0,0,0,0.35);
  padding:10px;
  border-radius:6px;
  overflow-x:auto;
  max-height:280px;
  white-space:pre;
  line-height:1.45;
  margin-top:6px;
}

/* ──────────────────────────────────────────────────────────────
   Animated Pipeline Visualization (deep-search observability)
   Pure SVG + CSS keyframes — no dependencies. Collapsible wrapper.
   Loop is ~6 s, then restarts. Built for clarity, not flash.
   ────────────────────────────────────────────────────────────── */
.diag-viz-wrap{
  margin-bottom:16px;
  border:1px solid rgba(51,65,85,0.45);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(15,23,42,0.6),rgba(8,12,24,0.85));
  overflow:hidden;
}
.diag-viz-wrap[open]{border-color:rgba(59,130,246,0.35);}
.diag-viz-head{
  display:flex;
  align-items:center;
  gap:12px;
  padding:8px 14px;
  cursor:pointer;
  user-select:none;
  list-style:none;
}
.diag-viz-head::-webkit-details-marker{display:none;}
.diag-viz-title{
  font-size:13px;
  font-weight:700;
  letter-spacing:0.08em;
  color:#e2e8f0;
  text-transform:uppercase;
}
.diag-viz-hint{
  flex:1;
  font-size:12px;
  color:#64748b;
  letter-spacing:0.02em;
}
.diag-viz-replay{
  font-size:12px;
  padding:3px 10px;
  border-radius:5px;
  background:rgba(59,130,246,0.12);
  border:1px solid rgba(59,130,246,0.35);
  color:#93c5fd;
  cursor:pointer;
  font-family:inherit;
  transition:all 0.15s;
}
.diag-viz-replay:hover{
  background:rgba(59,130,246,0.22);
  color:#dbeafe;
}
.diag-viz-body{
  padding:6px 4px 4px;
  background:
    radial-gradient(ellipse at center, rgba(59,130,246,0.04) 0%, transparent 60%),
    linear-gradient(180deg,rgba(8,12,24,0.4),rgba(0,0,0,0));
}

/* SVG canvas */
.pipe-svg{
  width:100%;
  height:auto;
  max-height:320px;
  font-family:'JetBrains Mono','Consolas',monospace;
  display:block;
}
/* The outer body positions the news tooltip relative to itself */
.diag-viz-body{position:relative;}

/* Summary-bar NLI chip (quick at-a-glance indicator before opening the panel) */
.diag-viz-chip{
  font-size:11px;
  font-weight:600;
  letter-spacing:0.04em;
  padding:2px 7px;
  border-radius:10px;
  border:1px solid rgba(100,116,139,0.5);
  background:rgba(30,41,59,0.5);
  color:#94a3b8;
}
.diag-viz-chip.chip-ok{
  border-color:rgba(16,185,129,0.4);
  color:#6ee7b7;
  background:rgba(16,185,129,0.08);
}
.diag-viz-chip.chip-warn{
  border-color:rgba(245,158,11,0.45);
  color:#fcd34d;
  background:rgba(245,158,11,0.08);
}

/* Hidden reference paths for animateMotion — don't render as strokes */
.pipe-hidden{fill:none;stroke:none;}

/* ── Connecting pipes ── */
.pipe-line{
  fill:none;
  stroke:rgba(71,85,105,0.55);
  stroke-width:1.5;
  stroke-dasharray:4 3;
  stroke-dashoffset:0;
  animation:pipe-draw 6s linear infinite;
}
.pipe-line-fanout{
  stroke:rgba(139,92,246,0.5);
  stroke-width:1.25;
  stroke-dasharray:3 3;
}
.pipe-line-track{
  stroke:rgba(59,130,246,0.5);
  stroke-width:1.25;
  stroke-dasharray:3 3;
}
.pipe-line-fanin{
  stroke:rgba(16,185,129,0.55);
  stroke-width:1.25;
  stroke-dasharray:3 3;
}
@keyframes pipe-draw{
  0%{stroke-dashoffset:0;}
  100%{stroke-dashoffset:-42;}
}

/* ── Flowing particles ── */
.pipe-particle{
  fill:#60a5fa;
  filter:drop-shadow(0 0 6px rgba(96,165,250,0.85));
  opacity:0;
}
.pipe-p1{
  animation:pipe-flow-p1 6s ease-in-out infinite;
}
.pipe-p2{
  animation:pipe-flow-p2 6s ease-in-out infinite;
  fill:#a78bfa;
  filter:drop-shadow(0 0 6px rgba(167,139,250,0.85));
}
.pipe-p3{
  fill:#c084fc;
  filter:drop-shadow(0 0 5px rgba(192,132,252,0.8));
  opacity:0.9;
}
.pipe-p4{
  fill:#10b981;
  filter:drop-shadow(0 0 6px rgba(16,185,129,0.9));
  animation:pipe-flow-p4 6s linear infinite;
}
@keyframes pipe-flow-p1{
  0%,15%{opacity:0;transform:translateX(0);}
  16%{opacity:1;}
  28%{opacity:1;transform:translateX(90px);}
  30%{opacity:0;transform:translateX(90px);}
  100%{opacity:0;transform:translateX(0);}
}
@keyframes pipe-flow-p2{
  0%,30%{opacity:0;transform:translateX(0);}
  31%{opacity:1;}
  48%{opacity:1;transform:translateX(130px);}
  50%{opacity:0;transform:translateX(130px);}
  100%{opacity:0;transform:translateX(0);}
}
@keyframes pipe-flow-p4{
  0%,60%{opacity:0;transform:translateX(0);}
  62%{opacity:1;}
  78%{opacity:1;transform:translateX(120px);}
  80%{opacity:0;transform:translateX(120px);}
  100%{opacity:0;}
}

/* ── Stage boxes (Query / News / LLM / Final) ── */
.pipe-stage{
  opacity:0.35;
  animation:pipe-stage-pulse 6s ease-in-out infinite;
  transform-origin:center;
  transform-box:fill-box;
}
@keyframes pipe-stage-pulse{
  0%,8%{opacity:0.35;}
  10%,22%{opacity:1;}  /* active moment */
  24%,100%{opacity:0.5;}
}
.pipe-s-query{animation-delay:0s;}
.pipe-s-nli{animation-delay:0.4s;}
.pipe-s-news{animation-delay:0.8s;}
.pipe-s-llm{animation-delay:1.6s;}
.pipe-s-final{animation-delay:4.6s;}

/* NLI node: colour indicates whether filters applied cleanly (green),
   partially (amber/dropped), or didn't exist (grey). */
.pipe-s-nli .pipe-box{stroke:rgba(100,116,139,0.5);}
.pipe-s-nli-applied .pipe-box{stroke:rgba(16,185,129,0.65);}
.pipe-s-nli-dropped .pipe-box{stroke:rgba(245,158,11,0.7);}
.pipe-s-nli-applied .pipe-sub{fill:#a7f3d0;}
.pipe-s-nli-dropped .pipe-sub{fill:#fcd34d;}
.pipe-s-nli-dropped .pipe-badge{fill:#fbbf24;}

.pipe-box{
  fill:rgba(30,41,59,0.75);
  stroke:rgba(100,116,139,0.5);
  stroke-width:1;
}
.pipe-s-query .pipe-box{stroke:rgba(59,130,246,0.55);}
.pipe-s-news .pipe-box{stroke:rgba(59,130,246,0.55);}
.pipe-s-llm .pipe-box{stroke:rgba(167,139,250,0.7);}
.pipe-s-final .pipe-box{stroke:rgba(16,185,129,0.7);}
.pipe-title{
  font-size:13px;
  font-weight:700;
  fill:#e2e8f0;
  letter-spacing:0.08em;
}
.pipe-sub{
  font-size:12px;
  fill:#cbd5e1;
}
.pipe-badge{
  font-size:11px;
  fill:#94a3b8;
  letter-spacing:0.04em;
  text-transform:uppercase;
}
.pipe-ms{
  font-size:12px;
  fill:#64748b;
  letter-spacing:0.02em;
}

/* ── Theme lanes (fan-out) ── */
.pipe-theme{
  opacity:0;
  animation:pipe-theme-appear 6s ease-out infinite;
}
@keyframes pipe-theme-appear{
  0%,38%{opacity:0;}
  42%,100%{opacity:1;}  /* stay visible — users need to read theme names */
}
.pipe-theme-box{
  fill:rgba(30,41,59,0.85);
  stroke:rgba(100,116,139,0.6);
  stroke-width:1;
}
.pipe-theme-positive .pipe-theme-box{stroke:rgba(16,185,129,0.75);}
.pipe-theme-negative .pipe-theme-box{stroke:rgba(239,68,68,0.75);}
.pipe-theme-mixed    .pipe-theme-box{stroke:rgba(245,158,11,0.75);}
.pipe-theme-text{
  font-size:11px;
  fill:#e2e8f0;
  font-weight:500;
}
.pipe-theme-positive .pipe-theme-text{fill:#a7f3d0;}
.pipe-theme-negative .pipe-theme-text{fill:#fca5a5;}
.pipe-theme-mixed    .pipe-theme-text{fill:#fcd34d;}

/* ── Shard mini-cards (cosine scan representation) ── */
.pipe-shard{
  opacity:0;
  animation:pipe-shard-scan 6s ease-in-out infinite;
}
@keyframes pipe-shard-scan{
  0%,55%{opacity:0;}
  58%{opacity:1;}
  72%{opacity:1;}
  76%,100%{opacity:0.4;}
}
.pipe-shard-box{
  fill:rgba(30,41,59,0.9);
  stroke:rgba(59,130,246,0.5);
  stroke-width:0.75;
}
.pipe-shard-dot{
  fill:#60a5fa;
  animation:pipe-shard-blink 1s ease-in-out infinite alternate;
}
.pipe-shard-dot:nth-child(2){animation-delay:0.2s;}
.pipe-shard-dot:nth-child(3){animation-delay:0.4s;}
@keyframes pipe-shard-blink{
  0%{opacity:0.3;}
  100%{opacity:1;}
}

/* ── Stage hover overlays: NLI filters + NEWS headlines ── */
.pipe-s-nli-hover,
.pipe-s-news-hover{cursor:help;}
.pipe-hover-capture{
  fill:transparent;
  stroke:none;
  pointer-events:all;
  cursor:help;
}
.pipe-news-tooltip,
.pipe-nli-tooltip{
  position:absolute;
  max-height:calc(100% - 28px);
  overflow-y:auto;
  padding:10px 12px;
  background:rgba(15,23,42,0.98);
  border:1px solid rgba(59,130,246,0.45);
  border-radius:8px;
  box-shadow:0 12px 40px rgba(0,0,0,0.55), 0 0 0 1px rgba(59,130,246,0.1);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity 0.12s, visibility 0.12s;
  z-index:30;
  font-family:'JetBrains Mono','Consolas',monospace;
}
.pipe-news-tooltip{
  top:50%;
  left:38%;
  transform:translateY(-50%);
  width:min(560px,58%);
}
.pipe-nli-tooltip{
  top:50%;
  left:24.4%;
  transform:translateY(-50%);
  width:min(430px,42%);
}
.diag-viz-body:has(.pipe-s-nli-hover:hover) .pipe-nli-tooltip,
.pipe-nli-tooltip:hover,
.diag-viz-body:has(.pipe-s-news-hover:hover) .pipe-news-tooltip,
.pipe-news-tooltip:hover{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.pipe-news-tooltip-title{
  font-size:12px;
  font-weight:700;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:#93c5fd;
  margin-bottom:8px;
  padding-bottom:6px;
  border-bottom:1px solid rgba(51,65,85,0.5);
}
.pipe-news-tip-item{
  display:flex;
  gap:8px;
  padding:6px 4px;
  border-radius:4px;
  text-decoration:none;
  color:#cbd5e1;
  font-size:13px;
  line-height:1.35;
  transition:background 0.1s;
}
.pipe-news-tip-item:hover{
  background:rgba(30,41,59,0.7);
}
.pipe-news-tip-num{
  color:#64748b;
  flex-shrink:0;
  min-width:16px;
}
.pipe-news-tip-body{flex:1;min-width:0;}
.pipe-news-tip-title{
  display:block;
  color:#e2e8f0;
}
.pipe-news-tip-meta{
  display:block;
  color:#64748b;
  font-size:12px;
  margin-top:2px;
}
.pipe-nli-tip-section{
  padding:7px 0;
  border-bottom:1px solid rgba(51,65,85,0.35);
}
.pipe-nli-tip-section:last-child{border-bottom:none;padding-bottom:0;}
.pipe-nli-tip-section:first-of-type{padding-top:0;}
.pipe-nli-tip-label{
  font-size:11px;
  font-weight:700;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:#64748b;
  margin-bottom:6px;
}
.pipe-nli-tip-chips{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}
.pipe-nli-tip-chip{
  display:inline-flex;
  padding:3px 7px;
  border-radius:4px;
  font-size:12px;
  font-weight:600;
}
.pipe-nli-tip-chip.applied{
  color:#6ee7b7;
  background:rgba(16,185,129,0.13);
  border:1px solid rgba(16,185,129,0.35);
}
.pipe-nli-tip-empty{
  color:#64748b;
  font-size:13px;
  font-style:italic;
}
.pipe-nli-tip-dropped{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.pipe-nli-tip-drop{
  display:flex;
  gap:8px;
  align-items:flex-start;
  font-size:12px;
  line-height:1.35;
}
.pipe-nli-tip-drop-phrase{
  flex:0 0 auto;
  max-width:42%;
  color:#fcd34d;
  font-weight:700;
  overflow-wrap:anywhere;
}
.pipe-nli-tip-drop-reason{
  color:#94a3b8;
}
.pipe-nli-tip-code{
  display:block;
  color:#cbd5e1;
  background:rgba(0,0,0,0.32);
  border:1px solid rgba(51,65,85,0.45);
  border-radius:4px;
  padding:5px 7px;
  font-size:12px;
  white-space:normal;
  overflow-wrap:anywhere;
}

/* ── NLI section (text observability) ── */
.diag-nli{
  background:rgba(15,23,42,0.4);
  border-radius:6px;
  padding:8px 10px;
}
.diag-nli-row{
  display:grid;
  grid-template-columns:78px 1fr;
  gap:10px;
  padding:4px 0;
  align-items:start;
  min-height:24px;
}
.diag-nli-k{
  color:#64748b;
  font-size:12px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  padding-top:5px;
}
.diag-nli-v{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
}
.diag-nli-chip{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:12px;
  font-weight:600;
  padding:3px 8px;
  border-radius:4px;
  letter-spacing:0.02em;
  font-family:inherit;
}
.diag-nli-applied{
  background:rgba(16,185,129,0.14);
  border:1px solid rgba(16,185,129,0.35);
  color:#6ee7b7;
}
.diag-nli-dropped{
  background:rgba(245,158,11,0.12);
  border:1px solid rgba(245,158,11,0.4);
  color:#fcd34d;
}
.diag-nli-x{color:#64748b;margin:0 2px;}
.diag-nli-why{
  color:#94a3b8;
  font-weight:400;
  font-size:11px;
  font-style:italic;
}
.diag-nli-empty{
  color:#64748b;
  font-style:italic;
  font-size:13px;
}
.diag-nli-residual{
  display:inline-block;
  background:rgba(0,0,0,0.35);
  border:1px solid rgba(51,65,85,0.4);
  color:#cbd5e1;
  padding:3px 8px;
  border-radius:4px;
  font-size:13px;
  font-family:inherit;
  word-break:break-word;
}
.diag-nli-hint{
  font-size:12px;
  color:#64748b;
  font-style:italic;
  padding:2px 0 6px 88px;
  line-height:1.4;
}

/* Respect reduced-motion preference — show the diagram statically */
@media (prefers-reduced-motion: reduce){
  .pipe-line,.pipe-particle,.pipe-stage,.pipe-theme,.pipe-shard,.pipe-shard-dot{
    animation:none !important;
    opacity:1;
  }
}

@media (max-width:640px){
  .diag-viz-hint{display:none;}
  .diag-viz-head{
    flex-wrap:wrap;
    gap:8px;
    padding:10px 12px;
  }
  .diag-viz-title{
    flex:1 1 auto;
    white-space:nowrap;
  }
  .diag-viz-chip{
    font-size:10px;
    padding:3px 6px;
  }
  .diag-viz-replay{
    width:36px;
    height:32px;
    padding:0;
    font-size:0;
  }
  .diag-viz-replay::before{
    content:'↻';
    font-size:16px;
  }
  .diag-viz-body{
    overflow-x:auto;
    overflow-y:hidden;
    padding:12px 10px 10px;
    -webkit-overflow-scrolling:touch;
  }
  .pipe-svg{
    width:900px;
    max-width:none;
    min-width:900px;
    max-height:none;
  }
  .pipe-news-tooltip,
  .pipe-nli-tooltip{
    display:none;
  }
}

/* Evidence footer — news chips that informed the analysis */
.evidence-section{
  margin-top:24px;
  padding:14px 16px;
  border:1px dashed rgba(71,85,105,0.5);
  border-radius:12px;
  background:rgba(15,23,42,0.35);
}
.evidence-section-title{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.1em;
  color:#94a3b8;
  text-transform:uppercase;
  margin-bottom:10px;
}
.evidence-chip{
  display:block;
  padding:8px 10px;
  border-radius:8px;
  background:rgba(30,41,59,0.5);
  border:1px solid rgba(51,65,85,0.4);
  font-size:12px;
  line-height:1.4;
  color:#cbd5e1;
  text-decoration:none;
  transition:all 0.15s;
  margin-bottom:6px;
}
.evidence-chip:hover{
  background:rgba(30,41,59,0.8);
  border-color:rgba(59,130,246,0.4);
  color:#f1f5f9;
}
.evidence-chip-meta{
  font-size:10px;
  color:#64748b;
  margin-top:3px;
  font-family:'JetBrains Mono','Consolas',monospace;
}

.settings-card{
  background:linear-gradient(180deg,rgba(30,41,59,0.84),rgba(15,23,42,0.90));
  transition:border-color 0.2s ease,box-shadow 0.2s ease,transform 0.2s ease;
}

.settings-card:hover{
  border-color:rgba(71,85,105,0.8);
  transform:translateY(-1px);
}

.settings-card-body{
  border-top:1px solid var(--border-subtle);
  padding-top:0.9rem;
}

.llm-provider-pill.active{
  background:linear-gradient(145deg,rgba(59,130,246,0.35) 0%,rgba(37,99,235,0.25) 100%);
  border-color:rgba(59,130,246,0.55);
  color:#dbeafe;
  box-shadow:0 0 0 1px var(--tint-blue-strong) inset;
}
.llm-provider-pill[data-llm-provider="grok"].active{
  background:linear-gradient(145deg,rgba(139,92,246,0.35) 0%,rgba(124,58,237,0.25) 100%);
  border-color:rgba(139,92,246,0.55);
  color:#ede9fe;
  box-shadow:0 0 0 1px rgba(139,92,246,0.25) inset;
}

/* Deep-analysis override pills — amber accent to signal "paid tier" */
.deep-analysis-pill.active{
  background:linear-gradient(145deg,rgba(245,158,11,0.32) 0%,rgba(217,119,6,0.22) 100%);
  border-color:rgba(245,158,11,0.55);
  color:#fef3c7;
  box-shadow:0 0 0 1px rgba(245,158,11,0.22) inset;
}
.deep-analysis-pill[data-deep-provider=""].active{
  background:linear-gradient(145deg,rgba(100,116,139,0.35) 0%,rgba(71,85,105,0.25) 100%);
  border-color:rgba(148,163,184,0.5);
  color:var(--text-body);
  box-shadow:0 0 0 1px rgba(148,163,184,0.25) inset;
}

.feature-card,.theme-card,.stock-card{
  background:var(--surface-card);
}

.theme-card,.stock-card,.feature-card{
  overflow:hidden;
}

.journal-view-btn,.journal-filter-btn,.phil-filter-btn,
.rotation-window-btn,.rotation-perf-range-btn,.in-rotation-window-btn,.in-rotation-perf-range-btn{
  min-height:2rem;
  box-shadow:inset 0 1px 0 rgba(148,163,184,0.06);
  transition:transform 0.15s ease,box-shadow 0.15s ease,background-color 0.15s ease,color 0.15s ease,border-color 0.15s ease;
}

.journal-view-btn:hover,.journal-filter-btn:hover,.phil-filter-btn:hover,
.rotation-window-btn:hover,.rotation-perf-range-btn:hover,.in-rotation-window-btn:hover,.in-rotation-perf-range-btn:hover{
  transform:translateY(-1px);
}

.market-toggle{
  box-shadow:var(--shadow-card);
}

.market-toggle-btn{
  min-height:2.25rem;
  letter-spacing:0.01em;
}

.page-intro{
  background:linear-gradient(180deg,rgba(30,41,59,0.92),rgba(15,23,42,0.92));
  border:1px solid var(--border-primary);
  border-radius:1rem;
  box-shadow:var(--shadow-card);
}

.page-intro .page-kicker{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--accent-blue-light);
  margin-bottom:0.5rem;
}

.page-intro .page-title{
  font-size:1.35rem;
  line-height:1.2;
  font-weight:700;
  color:var(--text-bright);
}

.page-intro .page-subtitle{
  margin-top:0.45rem;
  max-width:54rem;
  font-size:0.84rem;
  line-height:1.65;
  color:var(--text-slate);
}

.dashboard-intro{
  padding:1.15rem;
  border-radius:1.2rem;
  background:
    radial-gradient(circle at top right, rgba(96,165,250,0.16), transparent 34%),
    linear-gradient(180deg, rgba(19,31,53,0.96), rgba(15,23,42,0.98));
  border:1px solid rgba(71,85,105,0.72);
}

.dashboard-intro-grid{
  display:grid;
  gap:1rem;
}

.dashboard-intro-main{
  min-width:0;
}

.dashboard-kicker{
  display:inline-flex;
  align-items:center;
  gap:0.45rem;
  margin-bottom:0.75rem;
  padding:0.45rem 0.75rem;
  border-radius:999px;
  background:rgba(15,23,42,0.48);
  border:1px solid rgba(96,165,250,0.22);
  color:#bfdbfe;
  font-size:11px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
}

.dashboard-kicker-dot{
  width:0.45rem;
  height:0.45rem;
  border-radius:999px;
  background:var(--accent-blue-light);
  box-shadow:0 0 0 6px rgba(96,165,250,0.12);
}

.dashboard-title{
  font-size:clamp(1.5rem, 2.5vw, 2.2rem);
  line-height:1.06;
  letter-spacing:-0.035em;
  font-weight:800;
  color:var(--text-bright);
  max-width:12ch;
}

.dashboard-lead{
  margin-top:0.8rem;
  max-width:60rem;
  color:var(--text-soft);
  font-size:0.98rem;
  line-height:1.78;
}

.dashboard-intro-stats{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:0.75rem;
}

.dashboard-mini-stat{
  padding:0.95rem 1rem;
  border-radius:1rem;
  background:rgba(15,23,42,0.58);
  border:1px solid rgba(71,85,105,0.48);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.03);
}

.dashboard-mini-label{
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.11em;
  color:var(--accent-blue-lighter);
}

.dashboard-mini-value{
  margin-top:0.45rem;
  font-size:1rem;
  font-weight:700;
  letter-spacing:-0.02em;
  color:var(--text-bright);
}

.dashboard-mini-copy{
  margin-top:0.35rem;
  font-size:12px;
  line-height:1.55;
  color:var(--text-slate);
}

.section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:0.9rem;
  margin-bottom:0.85rem;
  flex-wrap:wrap;
}

.section-head-main{
  min-width:0;
  flex:1 1 24rem;
}

.section-kicker{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--accent-blue-light);
  margin-bottom:0.3rem;
}

.section-copy{
  margin-top:0.4rem;
  max-width:54rem;
  font-size:13px;
  line-height:1.7;
  color:var(--text-slate);
}

.section-head-actions{
  display:flex;
  align-items:center;
  gap:0.5rem;
  flex-wrap:wrap;
}

.section-pills{
  display:flex;
  flex-wrap:wrap;
  gap:0.45rem;
  margin-top:0.85rem;
}

.section-pill{
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
  padding:0.4rem 0.7rem;
  border-radius:999px;
  background:rgba(15,23,42,0.45);
  border:1px solid rgba(71,85,105,0.5);
  color:var(--text-soft);
  font-size:11px;
  font-weight:600;
}

.morning-brief-surface{
  padding:1.1rem;
  overflow:hidden;
  transition:max-height 0.28s ease, opacity 0.2s ease, padding 0.25s ease, margin-top 0.25s ease, border 0.2s ease;
  max-height:4000px;
}

.morning-brief-surface.is-collapsed{
  max-height:0;
  opacity:0;
  padding-top:0;
  padding-bottom:0;
  margin-top:0;
  border-width:0;
  pointer-events:none;
}

.brief-toggle-btn{
  display:inline-flex;
  align-items:center;
  gap:0.35rem;
  padding:0.35rem 0.65rem;
  font-size:11px;
  font-weight:600;
  letter-spacing:0.04em;
  text-transform:uppercase;
  color:var(--text-soft);
  background:var(--bg-row-hover);
  border:1px solid rgba(71,85,105,0.5);
  border-radius:9999px;
  cursor:pointer;
  transition:all 0.15s ease;
  font-family:'JetBrains Mono', monospace;
}

.brief-toggle-btn:hover{
  color:#f1f5f9;
  background:rgba(51,65,85,0.8);
  border-color:rgba(100,116,139,0.6);
}

.brief-toggle-btn[aria-expanded="false"] .brief-toggle-icon{
  transform:rotate(-90deg);
}

.brief-toggle-icon{
  transition:transform 0.2s ease;
}

.morning-brief-shell{
  display:grid;
  gap:1rem;
}

.morning-brief-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}

.morning-brief-copy-wrap{
  min-width:0;
  flex:1 1 36rem;
}

.morning-brief-kicker{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--accent-blue-light);
  margin-bottom:0.35rem;
}

.morning-brief-title-row{
  display:flex;
  align-items:center;
  gap:0.75rem;
  flex-wrap:wrap;
}

.morning-brief-title{
  font-size:1.2rem;
  line-height:1.1;
  letter-spacing:-0.03em;
  font-weight:800;
  color:var(--text-bright);
}

.morning-brief-regime{
  display:inline-flex;
  align-items:center;
  padding:0.35rem 0.7rem;
  border-radius:999px;
  border:1px solid rgba(71,85,105,0.55);
  background:var(--bg-inset);
  font-size:10px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
}

.morning-brief-regime.is-positive{
  border-color:var(--tint-emerald-strong);
  color:var(--accent-emerald-pale);
}

.morning-brief-regime.is-negative{
  border-color:var(--tint-red-strong);
  color:var(--accent-red-lighter);
}

.morning-brief-regime.is-neutral{
  border-color:rgba(245,158,11,0.3);
  color:var(--accent-amber-lighter);
}

.morning-brief-copy{
  margin-top:0.55rem;
  max-width:52rem;
  color:var(--text-soft);
  font-size:0.94rem;
  line-height:1.7;
}

.morning-brief-meta{
  color:var(--text-faint);
  font-size:11px;
  font-weight:600;
  white-space:nowrap;
}

.morning-brief-grid{
  display:grid;
  gap:1rem;
}

.morning-brief-stats{
  display:grid;
  gap:0.75rem;
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.morning-brief-stat,
.morning-brief-block,
.morning-brief-action{
  border:1px solid rgba(71,85,105,0.45);
  border-radius:1rem;
  background:rgba(15,23,42,0.48);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.03);
}

.morning-brief-stat{
  padding:0.95rem 1rem;
}

.morning-brief-stat-label,
.morning-brief-block-title{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--text-slate);
}

.morning-brief-stat-value{
  margin-top:0.5rem;
  font-size:1.15rem;
  line-height:1.1;
  font-weight:800;
  letter-spacing:-0.03em;
  color:var(--text-bright);
  font-variant-numeric:tabular-nums;
}

.morning-brief-stat-meta{
  margin-top:0.35rem;
  font-size:12px;
  line-height:1.5;
  color:var(--text-slate);
}

.morning-brief-content{
  display:grid;
  gap:0.75rem;
}

.morning-brief-block{
  padding:0.95rem 1rem;
}

.morning-brief-list{
  margin-top:0.7rem;
  display:grid;
  gap:0.55rem;
  padding-left:1rem;
}

.morning-brief-list li{
  color:var(--text-soft);
  font-size:13px;
  line-height:1.7;
}

.morning-brief-headlines{
  margin-top:0.7rem;
  display:grid;
  gap:0.55rem;
}

.morning-brief-headline{
  display:grid;
  gap:0.2rem;
  padding:0.8rem 0.9rem;
  border-radius:0.9rem;
  border:1px solid rgba(71,85,105,0.35);
  background:rgba(15,23,42,0.36);
  text-decoration:none;
  transition:border-color 0.15s ease,transform 0.15s ease,background 0.15s ease;
}

.morning-brief-headline:hover{
  border-color:rgba(59,130,246,0.4);
  background:var(--bg-row-hover);
  transform:translateY(-1px);
}

.morning-brief-headline-title{
  color:var(--text-body);
  font-size:13px;
  line-height:1.55;
}

.morning-brief-headline-source,
.morning-brief-muted{
  color:var(--text-slate);
  font-size:11px;
  line-height:1.55;
}

.morning-brief-actions{
  display:grid;
  gap:0.7rem;
  grid-template-columns:repeat(4,minmax(0,1fr));
  padding:0.8rem;
}

.morning-brief-action{
  padding:0.8rem 0.9rem;
  text-align:left;
  width:100%;
  cursor:pointer;
  transition:border-color 0.15s ease,transform 0.15s ease,background 0.15s ease;
}

.morning-brief-action:hover{
  transform:translateY(-1px);
  border-color:rgba(59,130,246,0.4);
  background:rgba(30,41,59,0.72);
}

.morning-brief-action-label{
  display:block;
  color:var(--text-body);
  font-size:12px;
  font-weight:700;
  letter-spacing:0.02em;
}

.morning-brief-action-copy{
  display:block;
  margin-top:0.3rem;
  color:var(--text-slate);
  font-size:11px;
  line-height:1.45;
}

.morning-brief-empty{
  padding:1rem 0.25rem;
}

/* Collapsible panel shell (shared by Options Radar, etc.) */
.panel-collapse-shell{
  display:grid;
  gap:1rem;
}
.panel-collapse-title-row{
  display:flex;
  align-items:center;
  gap:0.75rem;
  flex-wrap:wrap;
}
.panel-collapse-toggle{
  margin-left:auto;
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
  padding:0.35rem 0.7rem;
  border-radius:0.5rem;
  border:1px solid rgba(71,85,105,0.55);
  background:var(--bg-inset);
  color:var(--text-soft);
  font-size:11px;
  font-weight:600;
  letter-spacing:0.04em;
  cursor:pointer;
  transition:background 0.15s, border-color 0.15s, color 0.15s;
}
.panel-collapse-toggle:hover{
  background:rgba(30,41,59,0.75);
  border-color:rgba(59,130,246,0.45);
  color:#f1f5f9;
}
.panel-collapse-toggle-icon{
  transition:transform 0.2s ease;
}
.panel-collapse-shell.is-collapsed .panel-collapse-toggle-icon{
  transform:rotate(-90deg);
}
.panel-collapse-shell.is-collapsed .panel-collapse-body{
  display:none;
}
.panel-collapse-body{
  display:block;
}

.options-radar-surface{
  padding:1.1rem;
}

.options-radar-shell{
  display:grid;
  gap:1rem;
}

.options-radar-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}

.options-radar-copy-wrap{
  min-width:0;
  flex:1 1 36rem;
}

.options-radar-kicker{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--accent-amber);
  margin-bottom:0.35rem;
}

.options-radar-title-row{
  display:flex;
  align-items:flex-start;
  gap:0.75rem;
  flex-wrap:wrap;
}

.options-radar-title{
  font-size:1.15rem;
  line-height:1.1;
  letter-spacing:-0.03em;
  font-weight:800;
  color:var(--text-bright);
}

.options-radar-regime{
  display:inline-flex;
  align-items:center;
  padding:0.38rem 0.72rem;
  border-radius:999px;
  border:1px solid rgba(71,85,105,0.55);
  background:var(--bg-inset);
  font-size:10px;
  font-weight:700;
  letter-spacing:0.04em;
  max-width:min(28rem,100%);
}

.options-radar-regime.is-positive{
  color:var(--accent-emerald-pale);
  border-color:var(--tint-emerald-strong);
}

.options-radar-regime.is-negative{
  color:var(--accent-red-lighter);
  border-color:var(--tint-red-strong);
}

.options-radar-regime.is-neutral{
  color:var(--accent-amber-lighter);
  border-color:rgba(245,158,11,0.3);
}

.options-radar-copy{
  margin-top:0.55rem;
  max-width:54rem;
  color:var(--text-soft);
  font-size:0.94rem;
  line-height:1.7;
}

.options-radar-meta{
  color:var(--text-slate);
  font-size:11px;
  font-weight:600;
  white-space:nowrap;
}

.options-radar-grid{
  display:grid;
  gap:1rem;
}

.options-radar-stats{
  display:grid;
  gap:0.75rem;
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.options-radar-stat,
.options-radar-block,
.options-radar-action,
.options-radar-posture{
  border:1px solid rgba(71,85,105,0.45);
  border-radius:1rem;
  background:rgba(15,23,42,0.48);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.03);
}

.options-radar-stat{
  padding:0.95rem 1rem;
}

.options-radar-stat-label,
.options-radar-block-title{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--text-slate);
}

.options-radar-stat-value{
  margin-top:0.48rem;
  font-size:1.15rem;
  line-height:1.1;
  font-weight:800;
  color:var(--text-bright);
  font-variant-numeric:tabular-nums;
}

.options-radar-stat-value.is-positive{color:var(--accent-emerald-pale);}
.options-radar-stat-value.is-negative{color:var(--accent-red-lighter);}
.options-radar-stat-value.is-neutral{color:var(--accent-amber-lighter);}

.options-radar-stat-meta,
.options-radar-stat-foot{
  margin-top:0.35rem;
  color:var(--text-slate);
  font-size:12px;
  line-height:1.5;
}

.options-radar-content{
  display:grid;
  gap:0.75rem;
}

.options-radar-block{
  padding:0.95rem 1rem;
}

.options-radar-posture-list{
  display:grid;
  gap:0.7rem;
  margin-top:0.75rem;
}

.options-radar-posture{
  padding:0.9rem 1rem;
}

.options-radar-posture-market{
  display:inline-flex;
  align-items:center;
  padding:0.22rem 0.5rem;
  border-radius:999px;
  background:rgba(30,64,175,0.18);
  border:1px solid rgba(59,130,246,0.24);
  color:var(--accent-blue-lighter);
  font-size:10px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
}

.options-radar-posture-label{
  margin-top:0.55rem;
  color:var(--text-bright);
  font-size:13px;
  font-weight:800;
}

.options-radar-posture-copy{
  margin-top:0.35rem;
  color:var(--text-slate);
  font-size:12px;
  line-height:1.6;
}

.options-radar-posture.is-positive{
  border-color:rgba(16,185,129,0.28);
}

.options-radar-posture.is-negative{
  border-color:rgba(239,68,68,0.28);
}

.options-radar-posture.is-neutral{
  border-color:rgba(245,158,11,0.24);
}

.options-radar-list{
  margin-top:0.7rem;
  display:grid;
  gap:0.55rem;
  padding-left:1rem;
}

.options-radar-list li{
  color:var(--text-soft);
  font-size:13px;
  line-height:1.7;
}

.options-radar-list-label{
  color:var(--text-body);
  font-weight:700;
}

.options-radar-muted{
  color:var(--text-slate);
  font-size:11px;
}

.options-radar-actions{
  display:grid;
  gap:0.7rem;
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.options-radar-action{
  padding:0.82rem 0.9rem;
  text-align:left;
  width:100%;
  cursor:pointer;
  transition:border-color 0.15s ease,transform 0.15s ease,background 0.15s ease;
}

.options-radar-action:hover{
  transform:translateY(-1px);
  border-color:rgba(245,158,11,0.35);
  background:rgba(30,41,59,0.72);
}

.options-radar-action-label{
  display:block;
  color:var(--text-bright);
  font-size:12px;
  font-weight:700;
}

.options-radar-action-copy{
  display:block;
  margin-top:0.32rem;
  color:var(--text-slate);
  font-size:11px;
  line-height:1.45;
}

.options-radar-empty{
  padding:1rem 0.25rem;
}

.journal-memory-empty{
  padding:0.6rem 0.25rem;
}

.journal-memory-shell{
  display:grid;
  gap:1rem;
}

.journal-memory-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}

.journal-memory-copy-wrap{
  min-width:0;
  flex:1 1 36rem;
}

.journal-memory-kicker{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--accent-blue-light);
  margin-bottom:0.35rem;
}

.journal-memory-title-row{
  display:flex;
  align-items:center;
  gap:0.75rem;
  flex-wrap:wrap;
}

.journal-memory-title{
  font-size:1.15rem;
  line-height:1.1;
  letter-spacing:-0.03em;
  font-weight:800;
  color:var(--text-bright);
}

.journal-memory-regime{
  display:inline-flex;
  align-items:center;
  padding:0.35rem 0.7rem;
  border-radius:999px;
  border:1px solid rgba(71,85,105,0.55);
  background:var(--bg-inset);
  color:var(--accent-blue-lighter);
  font-size:10px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
}

.journal-memory-copy{
  margin-top:0.55rem;
  max-width:54rem;
  color:var(--text-soft);
  font-size:0.94rem;
  line-height:1.7;
}

.journal-memory-stats{
  display:grid;
  gap:0.75rem;
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.journal-memory-stat,
.journal-memory-block,
.journal-memory-list-item,
.journal-memory-drift,
.journal-memory-review,
.journal-memory-candidate{
  border:1px solid rgba(71,85,105,0.45);
  border-radius:1rem;
  background:rgba(15,23,42,0.48);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.03);
}

.journal-memory-stat{
  padding:0.95rem 1rem;
}

.journal-memory-stat-label,
.journal-memory-block-title{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--text-slate);
}

.journal-memory-stat-value{
  margin-top:0.48rem;
  font-size:1.15rem;
  line-height:1.1;
  font-weight:800;
  color:var(--text-bright);
  font-variant-numeric:tabular-nums;
}

.journal-memory-stat-value.is-positive{color:var(--accent-emerald-pale);}
.journal-memory-stat-value.is-negative{color:var(--accent-red-lighter);}
.journal-memory-stat-value.is-neutral{color:var(--accent-amber-lighter);}

.journal-memory-stat-copy,
.journal-memory-block-copy,
.journal-memory-list-copy,
.journal-memory-list-meta,
.journal-memory-drift-copy,
.journal-memory-candidate-copy,
.journal-memory-candidate-meta{
  margin-top:0.35rem;
  color:var(--text-slate);
  font-size:12px;
  line-height:1.55;
}

.journal-memory-grid{
  display:grid;
  gap:0.75rem;
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.journal-memory-block{
  padding:0.95rem 1rem;
}

.journal-memory-list,
.journal-memory-drift-list,
.journal-memory-review-list,
.journal-memory-candidate-list{
  display:grid;
  gap:0.7rem;
  margin-top:0.8rem;
}

.journal-memory-list-item{
  padding:0.9rem 1rem;
  text-align:left;
  width:100%;
  transition:border-color 0.15s ease,transform 0.15s ease,background 0.15s ease;
}

.journal-memory-list-item:hover,
.journal-memory-drift:hover,
.journal-memory-review:hover,
.journal-memory-candidate:hover{
  transform:translateY(-1px);
  border-color:rgba(59,130,246,0.35);
  background:rgba(30,41,59,0.72);
}

.journal-memory-list-top,
.journal-memory-review-top,
.journal-memory-candidate-top,
.journal-memory-drift-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0.75rem;
  flex-wrap:wrap;
}

.journal-memory-list-key,
.journal-memory-drift-key,
.journal-memory-review-key,
.journal-memory-candidate-title{
  color:var(--text-bright);
  font-size:13px;
  font-weight:800;
}

.journal-memory-badge{
  display:inline-flex;
  align-items:center;
  padding:0.22rem 0.55rem;
  border-radius:999px;
  background:rgba(30,41,59,0.72);
  border:1px solid rgba(71,85,105,0.45);
  color:var(--text-soft);
  font-size:10px;
  font-weight:700;
  letter-spacing:0.06em;
  text-transform:uppercase;
}

.journal-memory-drift,
.journal-memory-review,
.journal-memory-candidate{
  padding:0.9rem 1rem;
}

.journal-memory-drift.is-positive{
  border-color:rgba(16,185,129,0.24);
}

.journal-memory-drift.is-negative{
  border-color:rgba(239,68,68,0.24);
}

.journal-memory-drift.is-neutral{
  border-color:rgba(245,158,11,0.22);
}

.journal-memory-drift-span{
  color:var(--text-slate);
  font-size:10px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
}

.journal-memory-review-actions,
.journal-memory-candidate-actions{
  display:flex;
  align-items:center;
  gap:0.55rem;
  flex-wrap:wrap;
  margin-top:0.7rem;
}

.journal-memory-mini-btn{
  border:1px solid rgba(71,85,105,0.55);
  border-radius:999px;
  padding:0.48rem 0.8rem;
  background:rgba(15,23,42,0.55);
  color:var(--text-soft);
  font-size:11px;
  font-weight:700;
  transition:border-color 0.15s ease,background 0.15s ease,color 0.15s ease,transform 0.15s ease;
}

.journal-memory-mini-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(59,130,246,0.35);
}

.journal-memory-mini-btn.is-primary{
  border-color:rgba(217,119,6,0.35);
  background:rgba(120,53,15,0.18);
  color:var(--accent-amber-light);
}

.journal-memory-mini-btn.is-saved{
  border-color:var(--tint-emerald-strong);
  background:rgba(6,78,59,0.18);
  color:var(--accent-emerald-pale);
}

.journal-memory-empty-small{
  padding:0.95rem 1rem;
  border-radius:0.9rem;
  border:1px dashed rgba(71,85,105,0.38);
  color:var(--text-slate);
  font-size:12px;
  line-height:1.6;
}

.sd-ai-deep-shell{
  display:grid;
  gap:0.85rem;
}

.sd-ai-deep-top{
  display:grid;
  gap:0.35rem;
}

.sd-ai-deep-kicker,
.sd-ai-deep-upgrade-kicker{
  font-size:10px;
  font-weight:800;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:#a78bfa;
}

.sd-ai-deep-copy,
.sd-ai-deep-upgrade-copy{
  color:var(--text-slate);
  font-size:12px;
  line-height:1.6;
}

.sd-ai-deep-hero-grid,
.sd-ai-deep-grid{
  display:grid;
  gap:0.75rem;
  grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));
}

.sd-ai-deep-card,
.sd-ai-deep-upgrade{
  border-radius:0.95rem;
  border:1px solid rgba(71,85,105,0.35);
  background:linear-gradient(180deg,rgba(15,23,42,0.76),rgba(15,23,42,0.62));
  padding:0.95rem 1rem;
}

.sd-ai-deep-hero-card{
  min-height:100%;
}

.sd-ai-deep-card.is-positive{
  border-color:rgba(16,185,129,0.42);
  box-shadow:inset 0 0 0 1px var(--tint-emerald);
}

.sd-ai-deep-card.is-negative{
  border-color:rgba(239,68,68,0.42);
  box-shadow:inset 0 0 0 1px var(--tint-red);
}

.sd-ai-deep-card.is-neutral{
  border-color:rgba(245,158,11,0.22);
}

.sd-ai-deep-card-title,
.sd-ai-deep-upgrade-title{
  color:var(--text-bright);
  font-size:12px;
  font-weight:800;
  letter-spacing:0.08em;
  text-transform:uppercase;
}

.sd-ai-deep-hero-copy{
  margin-top:0.52rem;
  color:var(--text-body);
  font-size:13px;
  line-height:1.68;
}

.sd-ai-deep-list{
  display:grid;
  gap:0.62rem;
  margin-top:0.7rem;
  padding-left:1rem;
}

.sd-ai-deep-list li{
  color:var(--text-soft);
  font-size:12px;
  line-height:1.62;
}

/* 5-year chart pattern card */
.sd-ai-deep-pattern-row{display:block}
.sd-pattern-card{display:flex;flex-direction:column;gap:0.55rem}
.sd-pattern-name{
  margin-top:0.45rem;
  font-size:18px;
  font-weight:800;
  letter-spacing:-0.01em;
  color:var(--text-bright);
  line-height:1.25;
}
.sd-pattern-badges{display:flex;flex-wrap:wrap;gap:0.38rem}
.sd-pattern-badge{
  display:inline-flex;
  align-items:center;
  padding:3px 9px;
  border-radius:999px;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:0.02em;
  text-transform:uppercase;
  border:1px solid transparent;
}
.sd-pattern-badge-bullish{background:rgba(16,185,129,0.16);color:var(--accent-emerald-lighter);border-color:rgba(16,185,129,0.38)}
.sd-pattern-badge-bearish{background:rgba(239,68,68,0.16);color:var(--accent-red-lighter);border-color:rgba(239,68,68,0.38)}
.sd-pattern-badge-neutral{background:rgba(245,158,11,0.16);color:var(--accent-amber-lighter);border-color:rgba(245,158,11,0.38)}
.sd-pattern-badge-conf{background:rgba(59,130,246,0.14);color:var(--accent-blue-lighter);border-color:rgba(59,130,246,0.32)}
.sd-pattern-badge-stage{background:rgba(148,163,184,0.14);color:var(--text-soft);border-color:rgba(148,163,184,0.32)}
.sd-pattern-badge-window{background:rgba(139,92,246,0.16);color:var(--accent-violet-light);border-color:rgba(139,92,246,0.38)}
.sd-pattern-levels{
  display:grid;
  gap:0.5rem;
  grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));
  margin-top:0.15rem;
}
.sd-pattern-level{
  background:var(--bg-inset);
  border:1px solid rgba(71,85,105,0.3);
  border-radius:0.55rem;
  padding:0.45rem 0.6rem;
}
.sd-pattern-level-key{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--text-slate);
}
.sd-pattern-level-val{
  margin-top:0.18rem;
  font-size:13px;
  font-weight:700;
  color:#f1f5f9;
  font-family:'JetBrains Mono',ui-monospace,monospace;
}
.sd-pattern-reasoning{
  color:var(--text-soft);
  font-size:12.5px;
  line-height:1.62;
}
body.light-theme .sd-pattern-name{color:#0f172a!important}
body.light-theme .sd-pattern-level{background:#f8f5ef!important;border-color:#e8e0d4!important}
body.light-theme .sd-pattern-level-key{color:#64748b!important}
body.light-theme .sd-pattern-level-val{color:#0f172a!important}
body.light-theme .sd-pattern-reasoning{color:#475569!important}

.sd-pattern-windows{
  margin-top:1rem;
  padding-top:0.9rem;
  border-top:1px dashed rgba(71,85,105,0.4);
}
.sd-pattern-windows-title{
  font-size:10.5px;
  font-weight:700;
  letter-spacing:0.09em;
  text-transform:uppercase;
  color:var(--text-slate);
  margin-bottom:0.55rem;
}
.sd-pattern-windows-grid{
  display:grid;
  gap:0.5rem;
  grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));
}
.sd-pattern-window-row{
  background:rgba(15,23,42,0.45);
  border:1px solid rgba(71,85,105,0.32);
  border-radius:0.6rem;
  padding:0.55rem 0.7rem;
  display:flex;
  flex-direction:column;
  gap:0.35rem;
}
.sd-pattern-window-row.is-positive{border-color:rgba(16,185,129,0.35);background:rgba(16,185,129,0.06)}
.sd-pattern-window-row.is-negative{border-color:rgba(239,68,68,0.35);background:rgba(239,68,68,0.06)}
.sd-pattern-window-row.is-unclear{opacity:0.78}
.sd-pattern-window-row.is-primary{
  border-width:1.5px;
  box-shadow:0 0 0 1px rgba(59,130,246,0.22) inset;
}
.sd-pattern-window-head{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:0.4rem;
}
.sd-pattern-window-tag{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:10.5px;
  font-weight:800;
  letter-spacing:0.06em;
  color:var(--accent-violet-light);
  background:rgba(139,92,246,0.16);
  border:1px solid rgba(139,92,246,0.38);
  border-radius:999px;
  padding:0.1rem 0.48rem;
}
.sd-pattern-window-name{
  font-size:13px;
  font-weight:700;
  color:#e5e7eb;
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.sd-pattern-window-chips{display:flex;flex-wrap:wrap;gap:0.3rem}
.sd-pattern-chip{
  display:inline-flex;
  align-items:center;
  font-size:10px;
  font-weight:700;
  letter-spacing:0.02em;
  text-transform:uppercase;
  padding:0.1rem 0.42rem;
  border-radius:999px;
  border:1px solid transparent;
}
.sd-pattern-chip-bullish{background:rgba(16,185,129,0.14);color:var(--accent-emerald-lighter);border-color:rgba(16,185,129,0.34)}
.sd-pattern-chip-bearish{background:rgba(239,68,68,0.14);color:var(--accent-red-lighter);border-color:rgba(239,68,68,0.34)}
.sd-pattern-chip-neutral{background:rgba(245,158,11,0.14);color:var(--accent-amber-lighter);border-color:rgba(245,158,11,0.34)}
.sd-pattern-chip-muted{background:rgba(148,163,184,0.12);color:var(--text-soft);border-color:rgba(148,163,184,0.28)}
.sd-pattern-chip-primary{background:rgba(59,130,246,0.18);color:var(--accent-blue-lighter);border-color:rgba(59,130,246,0.4)}
.sd-pattern-window-reason{
  font-size:11.5px;
  line-height:1.55;
  color:var(--text-soft);
}

body.light-theme .sd-pattern-windows-title{color:#475569!important}
body.light-theme .sd-pattern-windows{border-top-color:#e8e0d4!important}
body.light-theme .sd-pattern-window-row{background:#f8f5ef!important;border-color:#e8e0d4!important}
body.light-theme .sd-pattern-window-row.is-positive{background:rgba(16,185,129,0.1)!important;border-color:rgba(16,185,129,0.35)!important}
body.light-theme .sd-pattern-window-row.is-negative{background:rgba(239,68,68,0.1)!important;border-color:rgba(239,68,68,0.35)!important}
body.light-theme .sd-pattern-window-name{color:#0f172a!important}
body.light-theme .sd-pattern-window-reason{color:#475569!important}

.sd-ai-deep-pairs{
  display:grid;
  gap:0.65rem;
  margin-top:0.72rem;
}

.sd-ai-deep-pair{
  display:grid;
  gap:0.22rem;
}

.sd-ai-deep-pair-key{
  color:var(--text-bright);
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.08em;
}

.sd-ai-deep-pair-value,
.sd-ai-deep-empty{
  color:var(--text-slate);
  font-size:12px;
  line-height:1.58;
}

.sd-ai-deep-upgrade{
  background:
    radial-gradient(circle at top right,rgba(139,92,246,0.16),transparent 46%),
    linear-gradient(180deg,rgba(30,41,59,0.86),rgba(15,23,42,0.92));
}

.page-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:0.5rem;
}

.page-chip{
  display:inline-flex;
  align-items:center;
  gap:0.35rem;
  padding:0.45rem 0.7rem;
  border-radius:999px;
  background:rgba(15,23,42,0.55);
  border:1px solid rgba(51,65,85,0.7);
  color:var(--text-soft);
  font-size:11px;
  font-weight:600;
  line-height:1;
}

.section-caption{
  font-size:11px;
  color:var(--text-slate);
  line-height:1.55;
}

.empty-state-card{
  background:
    radial-gradient(circle at top,var(--glow-blue),transparent 50%),
    linear-gradient(180deg,rgba(30,41,59,0.9),rgba(15,23,42,0.95));
}

.wl-card{
  min-height:220px;
}

.wl-card-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:0.75rem;
  margin-bottom:0.7rem;
  padding-left:2.25rem;
  padding-right:1.75rem;
}

.wl-card-symbol{
  font-size:1.3rem;
  line-height:1;
  letter-spacing:-0.04em;
  font-weight:800;
  color:var(--text-bright);
  font-family:'JetBrains Mono',monospace;
}

.wl-card-meta-row{
  display:flex;
  flex-wrap:wrap;
  gap:0.4rem;
  margin-top:0.55rem;
}

.wl-market-pill,
.wl-status-pill{
  display:inline-flex;
  align-items:center;
  padding:0.3rem 0.55rem;
  border-radius:999px;
  font-size:10px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  border:1px solid rgba(71,85,105,0.6);
  background:var(--bg-inset);
  color:var(--text-soft);
}

.wl-market-pill{
  border-color:rgba(59,130,246,0.32);
  color:var(--accent-blue-lighter);
}

.wl-status-pill.is-holding{
  border-color:rgba(59,130,246,0.32);
  color:var(--accent-blue-lighter);
}

.wl-card-price{
  font-size:1.55rem;
  line-height:1.1;
  font-weight:800;
  color:var(--text-bright);
}

.wl-card .wl-ext-hours{
  margin-top:0.4rem;
}

.wl-card .wl-holding{
  margin-top:0.9rem;
  padding-top:0.8rem;
  border-top:1px solid rgba(71,85,105,0.38);
}

.wl-card .wl-position,
.wl-card .wl-pl{
  font-size:14px;
}

.wl-label{
  letter-spacing:0.08em;
  text-transform:uppercase;
}

.news-item-wrap,
.wl-news-item-wrap{
  break-inside:avoid;
}

.news-item,
.wl-news-item{
  line-height:1.7;
}

.news-item .text-\[12\.5px\],
.wl-news-item .text-\[12px\]{
  color:var(--text-body);
}

.news-item .text-\[10px\],
.wl-news-item .text-\[10px\]{
  color:var(--text-slate);
}

.detail-surface{
  background:var(--surface-card);
  border:1px solid rgba(51,65,85,0.55);
  border-radius:1rem;
  box-shadow:var(--shadow-card);
}

.detail-surface-soft{
  background:linear-gradient(180deg,rgba(15,23,42,0.82),rgba(15,23,42,0.68));
  border:1px solid rgba(51,65,85,0.45);
  border-radius:0.9rem;
}

.detail-surface-muted{
  background:linear-gradient(180deg,rgba(15,23,42,0.68),rgba(15,23,42,0.60));
  border:1px solid var(--border-subtle);
  border-radius:0.9rem;
}

.detail-section-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0.75rem;
  margin-bottom:0.75rem;
}

.detail-section-title .label{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--text-muted);
}

@media(max-width:767px){
  .morning-brief-stats,
  .morning-brief-actions{
    grid-template-columns:1fr;
  }

  .morning-brief-copy{
    font-size:0.9rem;
    line-height:1.68;
  }

  .morning-brief-title{
    font-size:1.05rem;
  }

  .options-radar-copy{
    font-size:0.9rem;
    line-height:1.68;
  }

  .sd-ai-deep-copy,
  .sd-ai-deep-hero-copy,
  .sd-ai-deep-list li,
  .sd-ai-deep-pair-value{
    font-size:0.9rem;
    line-height:1.68;
  }

  .journal-memory-copy{
    font-size:0.9rem;
    line-height:1.68;
  }

  .options-radar-stats,
  .options-radar-actions{
    grid-template-columns:1fr;
  }

  .journal-memory-stats,
  .journal-memory-grid{
    grid-template-columns:1fr;
  }

  .dashboard-title{
    max-width:16ch;
  }

  .dashboard-lead{
    font-size:0.94rem;
    line-height:1.72;
  }

  .dashboard-intro-stats{
    grid-template-columns:1fr;
  }

  .section-copy{
    font-size:13.5px;
    line-height:1.72;
  }

  .page-intro .page-title{
    font-size:1.15rem;
  }
}

@media(min-width:1024px){
  .dashboard-intro-grid{
    grid-template-columns:minmax(0, 1.7fr) minmax(18rem, 1fr);
    align-items:start;
  }

  .dashboard-intro-stats{
    grid-template-columns:1fr;
  }

  .morning-brief-grid{
    grid-template-columns:minmax(0,1.15fr) minmax(22rem,0.85fr);
    align-items:start;
  }

  .options-radar-grid{
    grid-template-columns:minmax(0,1.05fr) minmax(21rem,0.95fr);
    align-items:start;
  }

  .journal-memory-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* ─────────────────────────────────────────────────────────────
   MOBILE UX — P0 overrides
   Scope: <640px only. Desktop "Bloomberg terminal" density untouched.
   ───────────────────────────────────────────────────────────── */
@media(max-width:639px){
  /* 1. Bump sub-12px utility font-sizes for readability */
  .text-\[9px\]{font-size:11.5px!important}
  .text-\[10px\]{font-size:12px!important}
  .text-\[11px\]{font-size:13px!important}
  .text-\[12px\],.text-\[12\.5px\]{font-size:14px!important}

  /* 2. Prevent iOS zoom-on-focus: all inputs/selects/textareas must be ≥16px.
     Keep visual size reasonable with slightly tighter padding. */
  input,textarea,select{font-size:16px!important}
  input[type="checkbox"],input[type="radio"]{font-size:inherit!important}

  /* 3. Safe-area-inset horizontal padding for toast container on notched devices. */
  .toast-container{
    right:max(1rem,calc(1rem + env(safe-area-inset-right)))!important;
    left:max(1rem,env(safe-area-inset-left))!important;
  }
  .toast{max-width:none}

  /* P1 #5 — Touch targets: 40px+ on pill buttons, tf switchers, filter chips */
  .sd-hist-tf-btn,.sd-hist-metric-btn,
  .rotation-window-btn,.rotation-perf-range-btn,
  .market-toggle-btn,
  .sd-fin-btn,
  #sd-fin-btn-annual,#sd-fin-btn-quarterly{
    min-height:40px!important;
    padding-top:8px!important;padding-bottom:8px!important;
    padding-left:12px!important;padding-right:12px!important;
  }
  /* Sidebar links inside flyout — already comfortable but ensure 44px */
  #sidebar .sidebar-link{min-height:44px}

  /* P1 #6 — Stock detail stats: 2-col grid on mobile so all 6 tiles are
     visible in 3 rows without horizontal scrolling. Tighter tile padding so
     label+value+sub don't overflow inside each ~150px wide cell. */
  #sd-quick-stats.sd-quick-stats-grid:not(.hidden) .sd-stat-tile{
    padding:7px 10px;
  }
  #sd-quick-stats.sd-quick-stats-grid:not(.hidden) .sd-stat-value{
    font-size:14px;
  }
  #sd-quick-stats.sd-quick-stats-grid:not(.hidden) .sd-stat-sub{
    font-size:10px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  /* Ensure the price/stats column inside the header flex row stays constrained */
  #sec-stock-overview > .flex > .flex-1{min-width:0}
  /* Price & symbol: scale down slightly on tight mobile widths so they don't
     wrap awkwardly next to the alert/refresh buttons */
  #sd-symbol{font-size:20px!important}
  #sd-price{font-size:18px!important}
  #sd-extended-hours{font-size:12px!important}
  /* Hide scrollbar on iOS, keep slim bar on Android/desktop-mobile */
  #sd-quick-stats.sd-quick-stats-grid::-webkit-scrollbar{height:2px}
  #sd-quick-stats.sd-quick-stats-grid::-webkit-scrollbar-thumb{background:rgba(71,85,105,0.4)}

  /* P1 #10 — Ticker bar hidden via #ticker-bar.hidden sm:flex (see index.html) */

  /* P1 #11 — Scroll affordance: gradient fade on horizontal scrollers that overflow */
  .has-scroll-fade{position:relative}
  .has-scroll-fade::after{
    content:'';
    position:absolute;top:0;right:0;bottom:0;width:28px;
    background:linear-gradient(to left, rgba(12,18,34,0.92), transparent);
    pointer-events:none;
    border-top-right-radius:inherit;
    border-bottom-right-radius:inherit;
    z-index:2;
  }
}

/* 4. Body scroll lock when sidebar is open (class toggled by toggleSidebar on <1024px).
   Outside media query — applies whenever class is set, which JS only does on mobile. */
body.sidebar-open{overflow:hidden;position:fixed;width:100%;left:0;right:0}

/* Safe-area side padding for fixed shell elements on all viewports that support it */
#sidebar{padding-left:env(safe-area-inset-left)}

/* ─────────────────────────────────────────────────────────────
   PULL-TO-REFRESH indicator (mobile only)
   ───────────────────────────────────────────────────────────── */
#ptr-indicator{
  position:fixed;top:max(0.5rem,env(safe-area-inset-top));left:50%;
  width:44px;height:44px;border-radius:22px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:0;
  background:rgba(12,18,34,0.92);
  border:1px solid rgba(51,65,85,0.7);
  box-shadow:0 6px 20px rgba(0,0,0,0.35);
  color:var(--accent-blue-lighter);
  transform:translate(-50%,-56px);
  opacity:0;
  z-index:60;
  pointer-events:none;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
#ptr-indicator .ptr-spinner{width:20px;height:20px;display:flex;align-items:center;justify-content:center;transition:transform 120ms ease-out}
#ptr-indicator .ptr-spinner svg{width:20px;height:20px}
#ptr-indicator .ptr-label{display:none}
#ptr-indicator.armed{color:var(--accent-blue);border-color:rgba(59,130,246,0.55)}
#ptr-indicator.armed .ptr-spinner{transform:rotate(180deg)}
#ptr-indicator.loading .ptr-spinner{animation:ptr-spin 0.9s linear infinite}
@keyframes ptr-spin{to{transform:rotate(360deg)}}

/* ─────────────────────────────────────────────────────────────
   BOTTOM NAV (mobile/tablet <1024px) — scoped to viewports where
   the bottom nav renders so FAB sits above and content has room.
   ───────────────────────────────────────────────────────────── */
@media(max-width:1023px){
  #mobile-menu-fab{
    bottom:calc(64px + env(safe-area-inset-bottom))!important;
    left:max(1rem,calc(1rem + env(safe-area-inset-left)))!important;
  }
  .toast-container{
    bottom:calc(72px + env(safe-area-inset-bottom))!important;
  }
  .content-area{padding-bottom:calc(6rem + env(safe-area-inset-bottom))!important}
  main{padding-bottom:calc(6rem + env(safe-area-inset-bottom))!important}
  #bottom-nav .bottom-nav-tab[aria-current="page"]{position:relative}
  #bottom-nav .bottom-nav-tab[aria-current="page"]::before{
    content:'';position:absolute;top:0;left:25%;right:25%;height:2px;
    background:linear-gradient(90deg, transparent, rgba(59,130,246,0.9), transparent);
    border-radius:0 0 2px 2px;
  }
}

/* ============================================================================
   Day 4 — Canonical buttons + fields
   Primitives used site-wide. Existing inline Tailwind patterns migrate here
   incrementally. Focus ring is applied globally via :focus-visible.
   ============================================================================ */

/* Global focus ring — one consistent style, token-driven */
:focus-visible{outline:2px solid var(--accent-blue);outline-offset:2px;border-radius:inherit}
.field:focus-visible,.field-search:focus-visible,textarea.field:focus-visible{outline:none;border-color:var(--accent-blue);box-shadow:0 0 0 3px var(--tint-blue)}

/* Base button */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.375rem;font-family:var(--font-ui);font-weight:600;font-size:var(--fs-sm);line-height:1;padding:0.5rem 0.875rem;border-radius:var(--radius-md);border:1px solid transparent;cursor:pointer;transition:background 0.15s,border-color 0.15s,color 0.15s,transform 0.08s;white-space:nowrap;user-select:none}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:0.55;cursor:not-allowed;pointer-events:none}

/* Primary — filled blue tint */
.btn-primary{background:var(--tint-blue-strong);border-color:var(--border-hover);color:var(--accent-blue-lighter)}
.btn-primary:hover{background:rgba(59,130,246,0.35);border-color:var(--accent-blue);color:#fff}

/* Ghost — subtle tertiary */
.btn-ghost{background:rgba(30,41,59,0.5);border-color:rgba(51,65,85,0.4);color:var(--text-muted)}
.btn-ghost:hover{color:var(--text-secondary);background:rgba(51,65,85,0.5);border-color:rgba(71,85,105,0.5)}

/* Icon — square button, text/icon only */
.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border-radius:var(--radius-md);border:1px solid transparent;color:var(--text-faint);background:transparent;cursor:pointer;transition:color 0.15s,background 0.15s,border-color 0.15s}
.btn-icon:hover{color:var(--text-secondary);background:rgba(51,65,85,0.5)}
.btn-icon.is-lg{width:32px;height:32px}

/* Toggle — pill for filter/tab groups */
.btn-toggle{display:inline-flex;align-items:center;gap:0.25rem;font-size:var(--fs-xs);font-weight:600;padding:0.25rem 0.625rem;border-radius:var(--radius-pill);background:rgba(30,41,59,0.5);color:var(--text-faint);border:1px solid rgba(51,65,85,0.3);cursor:pointer;transition:color 0.15s,background 0.15s,border-color 0.15s;white-space:nowrap}
.btn-toggle:hover{color:var(--text-secondary);border-color:rgba(51,65,85,0.5)}
.btn-toggle.active{background:var(--tint-blue);color:var(--accent-blue-lighter);border-color:var(--border-hover)}

/* Field — text input / textarea */
.field{width:100%;background:rgba(30,41,59,0.6);border:1px solid rgba(51,65,85,0.5);border-radius:var(--radius-md);padding:0.5rem 0.75rem;font-size:var(--fs-base);color:var(--text-secondary);font-family:inherit;transition:border-color 0.15s,box-shadow 0.15s}
.field::placeholder{color:var(--text-dim)}
.field:focus{outline:none;border-color:var(--accent-blue);box-shadow:0 0 0 3px var(--tint-blue)}
.field-sm{padding:0.375rem 0.625rem;font-size:var(--fs-sm)}
textarea.field{resize:none;line-height:1.45}

/* Field-search — left icon slot; parent adds a <span> with absolute SVG */
.field-search{padding-left:2rem}

/* Field-amber — accent variant used by philosophy forms */
.field-amber:focus{border-color:var(--accent-amber);box-shadow:0 0 0 3px var(--tint-amber)}
.field-amber:focus-visible{border-color:var(--accent-amber);box-shadow:0 0 0 3px var(--tint-amber);outline:none}

/* ============================================================================
   Day 5 — Typography scale
   One rhythmic system: h1 → h2 → h3 → kicker → data. Existing named classes
   (.sec-heading, .page-title, .page-kicker) alias into h1/h2/label-kicker.
   ============================================================================ */

/* h1 — page title (e.g. "My Journal", "Market Overview") */
.h1-page,.page-intro .page-title{font-size:1.35rem;line-height:1.2;font-weight:700;letter-spacing:-0.01em;color:var(--text-bright);font-family:var(--font-ui)}
@media(min-width:640px){.h1-page{font-size:1.5rem}}

/* h2 — section heading (renders with left accent bar via .sec-heading) */
.h2-section,.sec-heading{position:relative;padding-left:14px;font-size:var(--fs-xl);line-height:1.15;letter-spacing:-0.03em;font-weight:800;color:var(--text-bright);font-family:var(--font-ui)}
.h2-section::before,.sec-heading::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:20px;border-radius:2px;background:linear-gradient(180deg,var(--accent-blue),#8b5cf6)}

/* h3 — card title (e.g. sub-card headings) */
.h3-card{font-size:var(--fs-md);line-height:1.3;font-weight:600;color:var(--text-body);letter-spacing:-0.005em;font-family:var(--font-ui)}

/* label-kicker — uppercase small label above a title or above data */
.label-kicker,.page-intro .page-kicker{font-size:var(--fs-sm);font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-muted);font-family:var(--font-ui)}
.label-kicker-xs{font-size:var(--fs-xs);letter-spacing:0.12em}
.label-kicker-accent{color:var(--accent-blue-light)}
/* Data-style kicker: smaller + monospace — used above metric card values */
.label-kicker-data{font-size:var(--fs-xs);font-weight:600;letter-spacing:0.06em;text-transform:none;color:var(--text-muted);font-family:var(--font-mono)}
.label-kicker-data-md{font-size:var(--fs-sm);font-weight:600;letter-spacing:0.06em;text-transform:none;color:var(--text-muted);font-family:var(--font-mono)}
/* Tight kicker: 10px + text-transform:uppercase + narrow letter-spacing — form labels */
.label-kicker-tight{font-size:var(--fs-xs);font-weight:600;letter-spacing:0.025em;text-transform:uppercase;color:var(--text-muted);font-family:var(--font-ui)}

/* text-data — tabular numeric style for stats, tables, prices */
.text-data{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-0.01em}
.text-data-sm{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--fs-sm);letter-spacing:0.02em}

/* ============================================================================
   Day 6 — Skeleton / loading state primitives
   One animation, five shapes. Legacy .shimmer-card + .rotation-skeleton alias
   into .skeleton-card. Respect prefers-reduced-motion.
   ============================================================================ */

/* Base: any element with .skeleton gets the shimmer. */
.skeleton,.skeleton-text,.skeleton-card,.skeleton-chart,.skeleton-row,.shimmer-card,.rotation-skeleton{
  background:linear-gradient(90deg,#334155 25%,#475569 50%,#334155 75%);
  background-size:200% 100%;
  animation:shimmer 1.5s infinite;
  border-radius:var(--radius-sm);
  display:block;
  position:relative;
  overflow:hidden;
}

/* Shape variants — height/width defaults, can be overridden inline */
.skeleton-text{height:0.75em;width:100%;border-radius:var(--radius-xs);display:inline-block}
.skeleton-card,.shimmer-card{border-radius:var(--radius-lg);min-height:60px}
.skeleton-chart{height:200px;width:100%;border-radius:var(--radius-md)}
.skeleton-row{height:44px;width:100%;border-radius:var(--radius-md);margin-bottom:0.5rem}

/* Dimmer pulse variant — used for rotation tiles */
.skeleton-pulse,.rotation-skeleton-tile{
  background:rgba(30,41,59,0.5);
  border:1px solid rgba(51,65,85,0.3);
  border-radius:var(--radius-sm);
  animation:skeleton-pulse 1.6s ease-in-out infinite;
}
@keyframes skeleton-pulse{0%,100%{opacity:0.4}50%{opacity:0.7}}

@media(prefers-reduced-motion:reduce){
  .skeleton,.skeleton-text,.skeleton-card,.skeleton-chart,.skeleton-row,.shimmer-card,.rotation-skeleton,
  .skeleton-pulse,.rotation-skeleton-tile{animation:none;background:#334155;opacity:0.6}
}

body.light-theme .skeleton,
body.light-theme .skeleton-text,
body.light-theme .skeleton-card,
body.light-theme .skeleton-chart,
body.light-theme .skeleton-row,
body.light-theme .shimmer-card,
body.light-theme .rotation-skeleton{
  background:linear-gradient(90deg,#e8e0d4 25%,#f5efe7 50%,#e8e0d4 75%)!important;
  background-size:200% 100%!important;
}
body.light-theme .skeleton-pulse,
body.light-theme .rotation-skeleton-tile{
  background:rgba(232,224,212,0.5)!important;
  border-color:rgba(212,201,187,0.4)!important;
}

/* ============================================================================
   Day 7 — Empty-state primitive
   Shared structure: icon slot → title → subtitle → CTA.
   Variants: default (blue), -amber, -violet, -emerald; size modifier -sm.
   ============================================================================ */

.empty-state{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:var(--space-2xl) var(--space-xl);
  text-align:center;border-radius:var(--radius-xl);
}
.empty-state-icon{
  width:56px;height:56px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:var(--radius-xl);
  background:var(--tint-blue);border:1px solid var(--border-hover);
  color:var(--accent-blue-light);
  margin-bottom:var(--space-md);
}
.empty-state-icon svg{width:28px;height:28px;stroke-width:1.5}
.empty-state-title{color:var(--text-soft);font-size:var(--fs-md);font-weight:600;margin-bottom:4px;font-family:var(--font-ui)}
.empty-state-subtitle{color:var(--text-muted);font-size:var(--fs-sm);max-width:360px;line-height:1.5}
.empty-state-cta{margin-top:var(--space-lg)}

/* Compact: for inside cards / sub-cards */
.empty-state-sm{padding:var(--space-lg) var(--space-md);gap:0}
.empty-state-sm .empty-state-icon{width:40px;height:40px;margin-bottom:var(--space-sm)}
.empty-state-sm .empty-state-icon svg{width:20px;height:20px}
.empty-state-sm .empty-state-title{font-size:var(--fs-base)}
.empty-state-sm .empty-state-subtitle{font-size:var(--fs-xs)}

/* Inline: for very tight slots (single row of text + tiny icon) */
.empty-state-inline{
  display:flex;align-items:center;gap:var(--space-sm);
  padding:var(--space-md) var(--space-lg);text-align:left;
  color:var(--text-muted);font-size:var(--fs-sm);
}
.empty-state-inline svg{width:16px;height:16px;color:var(--text-dim);flex-shrink:0}

/* Accent variants */
.empty-state-amber .empty-state-icon{background:var(--tint-amber);color:var(--accent-amber-light);border-color:rgba(245,158,11,0.3)}
.empty-state-violet .empty-state-icon{background:rgba(139,92,246,0.15);color:var(--accent-violet-light);border-color:rgba(139,92,246,0.3)}
.empty-state-emerald .empty-state-icon{background:var(--tint-emerald);color:var(--accent-emerald-light);border-color:var(--tint-emerald-strong)}
.empty-state-muted .empty-state-icon{background:var(--tint-muted);color:var(--text-muted);border-color:var(--border-subtle)}

body.light-theme .empty-state-title{color:var(--text-body)}
body.light-theme .empty-state-subtitle{color:var(--text-muted)}

/* ============================================================================
   Day 8 — Error primitives
   .error-card for whole-section fetch failures; .retry-pill for per-metric
   fail chips. Both use amber/red tints from tokens.
   ============================================================================ */

.error-card{
  background:var(--tint-red);
  border:1px solid rgba(239,68,68,0.25);
  border-radius:var(--radius-lg);
  padding:var(--space-xl);
  display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);
  text-align:center;
}
.error-card-icon{
  width:48px;height:48px;border-radius:var(--radius-xl);
  background:rgba(239,68,68,0.2);color:var(--accent-red-light);
  display:inline-flex;align-items:center;justify-content:center;
  margin-bottom:var(--space-xs);
}
.error-card-icon svg{width:24px;height:24px;stroke-width:1.5}
.error-card-title{color:var(--accent-red-lighter);font-size:var(--fs-md);font-weight:600;font-family:var(--font-ui)}
.error-card-subtitle{color:var(--text-muted);font-size:var(--fs-sm);max-width:360px;line-height:1.5}
.error-card-cta{margin-top:var(--space-sm)}

/* Compact inline error — for spots tighter than a card */
.error-inline{
  display:inline-flex;align-items:center;gap:var(--space-sm);
  color:var(--accent-red-lighter);font-size:var(--fs-sm);
  background:var(--tint-red);border:1px solid rgba(239,68,68,0.25);
  border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md);
}
.error-inline svg{width:16px;height:16px;color:var(--accent-red-light);flex-shrink:0}

/* Retry pill — small amber chip with spinning ⟳ during retry */
.retry-pill{
  display:inline-flex;align-items:center;gap:4px;
  padding:2px 8px;
  font-size:var(--fs-xs);font-weight:600;font-family:var(--font-mono);
  border-radius:var(--radius-pill);
  background:var(--tint-amber);color:var(--accent-amber-light);
  border:1px solid rgba(245,158,11,0.3);
  cursor:pointer;white-space:nowrap;
  transition:filter var(--dur-fast) var(--ease-out),background var(--dur-fast) var(--ease-out);
}
.retry-pill:hover{filter:brightness(1.15)}
.retry-pill svg{width:10px;height:10px;display:block}
.retry-pill.is-retrying{pointer-events:none;opacity:0.7}
.retry-pill.is-retrying svg{animation:spin 0.8s linear infinite}

/* Metric-card fetch-failed indicator — CSS-only retry affordance on value ::after */
.metric-card.fetch-failed [class*="text-2xl"]::after,
.metric-card.fetch-failed [class*="text-xl"]::after,
.metric-card.fetch-failed [class*="text-lg"]::after{
  content:' ⟳';color:var(--accent-amber);font-size:var(--fs-base);
  margin-left:4px;cursor:pointer;opacity:0.75;
  font-family:var(--font-mono);
}
.metric-card.fetch-failed [class*="text-2xl"]::after:hover,
.metric-card.fetch-failed [class*="text-xl"]::after:hover,
.metric-card.fetch-failed [class*="text-lg"]::after:hover{opacity:1}

body.light-theme .error-card{background:rgba(220,38,38,0.08)!important;border-color:rgba(220,38,38,0.25)!important}
body.light-theme .error-card-icon{background:rgba(220,38,38,0.12)!important;color:#b91c1c!important}
body.light-theme .error-card-title{color:#991b1b!important}
body.light-theme .error-inline{background:rgba(220,38,38,0.08)!important;border-color:rgba(220,38,38,0.25)!important;color:#991b1b!important}
body.light-theme .retry-pill{background:rgba(180,83,9,0.12)!important;color:#92400e!important;border-color:rgba(180,83,9,0.3)!important}

/* ============================================================================
   Day 9 — Micro-interactions
   Button press scale, spring easing on pill toggles, price flash on updateCard.
   ============================================================================ */

/* Physical press feedback — scale down slightly on any tappable primitive */
.btn:active,
.btn-icon:active,
.btn-toggle:active,
.retry-pill:active,
.market-toggle-btn:active,
.chart-refresh-btn:active{
  transform:scale(0.97);
}

/* Spring easing on the sliding-state transition for pill toggles */
.market-toggle-btn,
.btn-toggle{
  transition:background 0.22s cubic-bezier(0.34,1.56,0.64,1),
             color 0.18s var(--ease-out),
             border-color 0.18s var(--ease-out),
             transform 0.08s var(--ease-out);
}

/* Price flash — green/red sweep that fades back to default */
@keyframes flashUp{
  0%{background-color:rgba(16,185,129,0.28);color:var(--accent-emerald-pale)}
  100%{background-color:transparent}
}
@keyframes flashDown{
  0%{background-color:rgba(239,68,68,0.28);color:var(--accent-red-lighter)}
  100%{background-color:transparent}
}
.flash-up{animation:flashUp 0.9s ease-out;border-radius:4px;padding:0 4px;margin:0 -4px}
.flash-down{animation:flashDown 0.9s ease-out;border-radius:4px;padding:0 4px;margin:0 -4px}

@media(prefers-reduced-motion:reduce){
  .btn:active,.btn-icon:active,.btn-toggle:active,.retry-pill:active,
  .market-toggle-btn:active,.chart-refresh-btn:active{transform:none}
  .flash-up,.flash-down{animation:none}
}

body.light-theme .flash-up{animation-name:flashUpLight}
body.light-theme .flash-down{animation-name:flashDownLight}
@keyframes flashUpLight{
  0%{background-color:rgba(5,150,105,0.22);color:#047857}
  100%{background-color:transparent}
}
@keyframes flashDownLight{
  0%{background-color:rgba(220,38,38,0.22);color:#b91c1c}
  100%{background-color:transparent}
}