/* ========== SHARED STYLES — Trading Intelligence Hub ========== */
/* Extracted from 15 dashboard files to eliminate ~2,500 lines of duplication */

/* ── RESET & BASE ── */
*{margin:0;padding:0;box-sizing:border-box;}
html{height:100%;overflow-y:scroll;-webkit-overflow-scrolling:touch;}
body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;line-height:1.6;min-height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;}

/* ── CSS VARIABLES (Dark Default) ── */
:root {
  --bg:#06090F; --card:#161b22; --border:#30363d;
  --text:#c9d1d9; --muted:#8b949e; --accent:#00D4AA;
  --green:#3fb950; --red:#f85149; --yellow:#d29922;
  --purple:#bc8cff; --blue:#58a6ff; --orange:#db6d28;
  --accent-gold:#D4AF37; --bg-card-hover:#1c2128;
  --font-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
}

/* ── PAGE HEADER STANDARD ── */
.page-header { text-align: center; padding: 32px 16px 24px; }
.page-header h1 { font-size: 1.8rem; font-weight: 700; color: var(--text); margin: 0; }
.page-header .page-icon { margin-right: 8px; }
.page-subtitle { color: var(--muted); font-size: 0.9rem; margin: 8px 0 0; }

/* ── SMOOTH THEME TRANSITION ── */
body{transition:background-color var(--dur-slow, 0.3s) ease,color var(--dur-slow, 0.3s) ease;}
.cross-nav,.card,.stat-card,.signal-card,.tab,.btn-sm,.filter-bar input,.filter-bar select,.theme-toggle,.search-input,.search-result,.kb-content,.mobile-bottom-nav,.nav-more-dropdown,.ee-block,.glass,.scroll-top-btn,.refresh-btn,.refresh-toast,.portfolio-heat-badge,.compare-popup,.compare-col,.top-picks-container{transition:background-color var(--dur-slow, 0.3s) ease,color var(--dur-slow, 0.3s) ease,border-color var(--dur-slow, 0.3s) ease;}
table.t,.price-table{transition:background-color var(--dur-slow, 0.3s) ease,color var(--dur-slow, 0.3s) ease;}

/* ── LIGHT THEME ── */
body.light{--bg:#f0f3f6;--card:#ffffff;--border:#c8d1da;--text:#1a1e24;--muted:#4a5568;--green:#16a34a;--red:#dc2626;--yellow:#ca8a04;--blue:#2563eb;--purple:#7c3aed;--orange:#ea580c;--accent:#00b894;}
body.light .cross-nav{background:rgba(255,255,255,0.96);border-bottom-color:var(--accent);}
body.light header h1,body.light h2,body.light h3{color:#1f2328;}
body.light header p{color:#59636e;}
body.light .stat-card .value{color:#1f2328;}
body.light .stat-card{background:#fff;border-color:#d0d7de;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.06));}
body.light .stat-card:hover{filter:drop-shadow(0 4px 8px rgba(0,0,0,0.1));}
body.light .filter-bar input,body.light .filter-bar select{background:#f0f2f5;color:#24292f;border-color:#d0d7de;}
body.light .ai-reasoning{color:rgba(0,0,0,0.6);background:rgba(0,0,0,0.03);}
body.light .hold-period{color:rgba(0,0,0,0.4);}
body.light .card{background:#fff;border-color:#d0d7de;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.06));}
body.light .card:hover{filter:drop-shadow(0 4px 8px rgba(0,0,0,0.1));}
body.light .card h3{color:var(--accent);}
body.light .card h4{color:#1f2328;}
body.light .signal-card{background:#fff;border-color:#d0d7de;}
body.light .tab{background:#fff;border-color:#d0d7de;color:#59636e;}
body.light .tab:hover{border-color:var(--accent);color:#1f2328;}
body.light .tab.active{color:#000;}
body.light .btn-sm{background:#fff;border-color:#d0d7de;color:#1f2328;}
body.light .btn-sm:hover{border-color:var(--accent);color:var(--accent);}
body.light .kb-content{background:#fff;border-color:#d0d7de;}
body.light .kb-key{background:rgba(0,212,170,0.1);}
body.light .score-ring{border-color:#d0d7de !important;}
body.light .confidence-bar{background:#e6e8eb;}
body.light .params,body.light .calc-result,body.light .cr-result,body.light .cr-result .big,body.light .ai-score-card{background:#f0f2f5;color:#1f2328;}
body.light .ai-panel{background:#fff;border-color:#d0d7de;}
body.light .sector-btn{background:#fff;border-color:#d0d7de;color:#59636e;}
body.light .sector-btn:hover,body.light .sector-btn.active{color:#000;}
body.light .pos-form{background:#fff;border-color:#d0d7de;}
body.light .pos-form .field input,body.light .pos-form .field select{background:#f0f2f5;color:#24292f;border-color:#d0d7de;}
body.light .calc,body.light .calc-card{background:#fff;border-color:#d0d7de;}
body.light .cr input{background:#f0f2f5;color:#24292f;border-color:#d0d7de;}
body.light .scroll-top-btn{box-shadow:0 4px 15px rgba(0,0,0,0.15);}
body.light .stale-banner{background:rgba(154,103,0,0.1);border-color:rgba(154,103,0,0.3);}
body.light .toast{box-shadow:0 8px 32px rgba(0,0,0,0.1);}
body.light .skeleton{background:linear-gradient(90deg,#fff 25%,#f0f2f5 50%,#fff 75%);background-size:200% 100%;}
body.light .col-picker-dropdown{background:#fff;border-color:#d0d7de;box-shadow:0 8px 24px rgba(0,0,0,0.12);}
body.light .view-toggle{border-color:#d0d7de;}
body.light .view-toggle button{color:#59636e;}
body.light .view-toggle button.active{color:#000;}
body.light .streak-hot{background:rgba(207,34,46,0.1);color:#cf222e;}
body.light .streak-warm{background:rgba(154,103,0,0.1);color:#9a6700;}
body.light .streak-cold{background:rgba(9,105,218,0.1);color:#0969da;}
body.light .pair-card{background:#fff;border-color:#d0d7de;}
body.light .pair-card .pc-pair{color:#1f2328;}
body.light .insight-card{background:#fff;border-color:#d0d7de;}
body.light .calc-card{background:#fff;border-color:#d0d7de;}
body.light .calc-row input,body.light .calc-row select{background:#f0f2f5;color:#24292f;border-color:#d0d7de;}
body.light .gauge-value{color:#1f2328;}
body.light .indicator-card{background:#fff;border-color:#d0d7de;}
body.light .strategy-card{background:#fff;border-color:#d0d7de;}
body.light .strategy-card h3{color:#1f2328;}
body.light .resource-item{background:#fff;border-color:#d0d7de;}
body.light .res-item,body.light .resource-card{background:#fff;border-color:#d0d7de;}
body.light .edu-card{background:#fff;border-color:#d0d7de;}
body.light .edu-card code{background:#f0f2f5;color:#8250df;}
body.light .sector-card{background:#fff;border-color:#d0d7de;}
body.light .warn-box{background:rgba(207,34,46,0.06);border-color:rgba(207,34,46,0.2);}
body.light .cache-banner{background:rgba(154,103,0,0.1);border-color:rgba(154,103,0,0.3);}
body.light .win-rate-card{background:#fff;border-color:#d0d7de;}
body.light .market-breadth-bar{background:#fff;border-color:#d0d7de;}
body.light .compare-selected-btn{box-shadow:0 8px 32px rgba(0,0,0,0.15);}
body.light table.t td,body.light .price-table td{color:#1f2328;}
body.light .sort-toggle-btn{background:#fff;border-color:#d0d7de;color:#59636e;}
body.light .sort-toggle-btn:hover{border-color:var(--accent);color:#1f2328;}
body.light .yield-table th{background:#e6e8eb;color:#59636e;}
body.light .yield-table td{color:#1f2328;}
body.light .yield-table{background:#fff;border-color:#d0d7de;}
body.light .export-btn,body.light .export-bar button{background:#fff;border-color:#d0d7de;color:#1f2328;}
/* Scrollbar for light */
body.light ::-webkit-scrollbar-track{background:#f6f8fa;}
body.light ::-webkit-scrollbar-thumb{background:#d0d7de;}
body.light ::-webkit-scrollbar-thumb:hover{background:var(--accent);}
/* Theme toggle button prominence in light mode */
body.light .theme-toggle,body.light .theme-toggle-btn{border-color:#d0d7de;background:rgba(0,0,0,0.04);}
body.light .theme-toggle:hover,body.light .theme-toggle-btn:hover{border-color:var(--accent);background:rgba(0,212,170,0.08);}

/* ── CONTAINER ── */
.container{max-width:1440px;margin:0 auto;padding:20px;}

/* ── CROSS-NAV ── */
.cross-nav{position:sticky;top:0;z-index:1000;background:rgba(6,9,15,0.95);border-bottom:2px solid var(--accent);padding:8px 20px;display:flex;align-items:center;font-size:var(--fs-sm, 0.82rem);flex-wrap:nowrap;gap:8px;overflow:visible;}
.cross-nav .brand{color:var(--accent);font-weight:700;font-size:var(--fs-base, 0.92rem);letter-spacing:0.5px;white-space:nowrap;flex-shrink:0;text-decoration:none;}
a.brand:hover{opacity:0.85;}
.cross-nav .nav-links{display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;flex:1;min-width:0;scrollbar-width:none;-ms-overflow-style:none;}
.cross-nav .nav-links::-webkit-scrollbar{display:none;}
.cross-nav .nav-link{padding:6px 14px;border-radius:var(--radius-sm, 6px);text-decoration:none;color:var(--muted);font-weight:600;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;border:1px solid transparent;white-space:nowrap;}
.cross-nav .nav-link:hover{color:var(--text);border-color:var(--border);background:rgba(255,255,255,0.04);}
.cross-nav .nav-link.active{background:var(--accent);color:var(--bg);border-color:var(--accent);box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 40%, transparent);}

/* ── NAV MINIMIZE/MAXIMIZE TOGGLE ── */
.nav-collapse-btn{background:none;border:1px solid var(--border);border-radius:var(--radius-sm, 6px);width:32px;height:32px;cursor:pointer;font-size:var(--fs-sm, 0.82rem);color:var(--muted);display:inline-flex;align-items:center;justify-content:center;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;flex-shrink:0;margin-left:4px;}
.nav-collapse-btn:hover{border-color:var(--accent);color:var(--accent);}
.cross-nav.minimized{padding:4px 12px;gap:4px;}
.cross-nav.minimized .brand{font-size:0;width:28px;overflow:hidden;}
.cross-nav.minimized .brand::first-letter{font-size:var(--fs-base, 0.92rem);}
.cross-nav.minimized .nav-links{gap:2px;}
.cross-nav.minimized .nav-link{padding:4px 6px;font-size:0;width:32px;height:32px;justify-content:center;overflow:hidden;position:relative;}
.cross-nav.minimized .nav-link::before{content:attr(data-icon);font-size:var(--fs-base, 0.92rem);display:inline-flex;align-items:center;justify-content:center;}
.cross-nav.minimized .nav-link[data-icon]::before{content:attr(data-icon);}
.cross-nav.minimized .nav-link:hover::after{content:attr(data-label);position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);background:rgba(13,17,23,0.95);backdrop-filter:blur(12px);color:var(--text);padding:5px 10px;border-radius:var(--radius-sm, 6px);font-size:0.75rem;font-weight:600;white-space:nowrap;border:1px solid var(--border);z-index:1001;box-shadow:0 8px 24px rgba(0,0,0,0.4);pointer-events:none;letter-spacing:0.01em;}
.cross-nav.minimized .nav-more-wrap{width:32px;}
.cross-nav.minimized .nav-more-btn{font-size:0;width:32px;height:32px;padding:0;min-width:unset;}
.cross-nav.minimized .nav-more-btn::before{content:'⋯';font-size:var(--fs-md, 1.05rem);}
.cross-nav.minimized .theme-toggle,.cross-nav.minimized .theme-toggle-btn{width:30px;height:30px;font-size:var(--fs-base, 0.92rem);}
.cross-nav.minimized .search-btn{width:30px;height:30px;font-size:var(--fs-sm, 0.82rem);padding:0;}

/* ── THEME TOGGLE ── */
.theme-toggle,.theme-toggle-btn{background:none;border:1px solid var(--border);border-radius:50%;width:36px;height:36px;cursor:pointer;font-size:1.1rem;color:var(--text);display:inline-flex;align-items:center;justify-content:center;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;margin-left:4px;flex-shrink:0;}
.cross-nav button[onclick*="openSearch"]{flex-shrink:0;}
.theme-toggle:hover,.theme-toggle-btn:hover{border-color:var(--accent);color:var(--accent);}

/* ── HEADER ── */
header{text-align:center;padding:28px 0 18px;border-bottom:1px solid var(--border);margin-bottom:28px;}
header h1{font-size:2rem;color:var(--text);margin-bottom:4px;letter-spacing:-0.02em;font-weight:800;line-height:1.2;}
header p{color:var(--muted);font-size:var(--fs-base, 0.92rem);line-height:1.5;letter-spacing:0.01em;}
#last-updated{color:var(--accent);font-size:var(--fs-sm, 0.82rem);margin-top:7px;font-weight:600;}

/* ── TABS ── */
.tabs{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:24px;justify-content:center;}
.tab{padding:9px 18px;background:var(--card);border:1px solid var(--border);border-radius:8px;cursor:pointer;color:var(--muted);font-size:0.88rem;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;white-space:nowrap;}
.tab:hover{border-color:var(--accent);color:var(--text);}
.tab.active{background:linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 65%, #000));color:var(--bg);border-color:var(--accent);font-weight:700;box-shadow:0 2px 12px color-mix(in srgb, var(--accent) 28%, transparent);}

/* ── SECTIONS ── */
.section{display:none;content-visibility:auto;contain-intrinsic-size:0 500px;}
.section.active{display:block;animation:fadeInSection 0.35s ease forwards;}
@keyframes fadeInSection{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}

/* ── STAT CARDS ── */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:14px;margin-bottom:24px;}
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);padding:16px;text-align:center;transition:transform var(--dur-slow, 0.3s) cubic-bezier(0.4,0,0.2,1),filter var(--dur-slow, 0.3s) ease,border-color var(--dur-slow, 0.3s) ease;contain:content;}
.stat-card:hover{transform:translateY(-3px) scale(1.01);filter:drop-shadow(0 10px 20px rgba(0,212,170,0.18));border-color:rgba(0,212,170,0.25);}
.stat-card .label{font-size:var(--fs-xs, 0.72rem);color:var(--muted);text-transform:uppercase;letter-spacing:1px;}
.stat-card .value{font-size:1.35rem;font-weight:700;color:#fff;margin:5px 0;}
.stat-card .change{font-size:var(--fs-sm, 0.82rem);}
.positive{color:var(--green);}
.negative{color:var(--red);}
.neutral-c{color:var(--yellow);}

/* ── TABLES ── */
table.t,.price-table{width:100%;border-collapse:collapse;background:var(--card);border-radius:var(--radius-md, 10px);overflow:hidden;border:1px solid var(--border);margin-bottom:20px;}
table.t th,.price-table th{background:#1c2128;padding:12px 14px;text-align:left;font-size:0.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.5px;cursor:pointer;user-select:none;white-space:nowrap;position:sticky;top:0;z-index:10;}
table.t th:hover,.price-table th:hover{color:var(--accent);}
table.t td,.price-table td{padding:13px 16px;border-top:1px solid var(--border);font-size:0.88rem;transition:background var(--dur-fast, 0.15s) ease;}
table.t tbody tr:nth-child(even) td,.price-table tbody tr:nth-child(even) td{background:rgba(139,148,158,0.03);}
table.t tr:hover td,.price-table tr:hover td{background:rgba(0,212,170,0.06);}
table.t tr:hover td:first-child,.price-table tr:hover td:first-child{border-left:3px solid var(--accent);}
body.light table.t tbody tr:nth-child(even) td,body.light .price-table tbody tr:nth-child(even) td{background:rgba(0,0,0,0.015);}
body.light table.t th,body.light .price-table th{background:#e6e8eb;}
body.light table.t tr:hover td,body.light .price-table tr:hover td{background:#f0f2f5;}

/* ── FILTER BAR ── */
.filter-bar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px;align-items:center;}
.filter-bar input{flex:1;min-width:180px;background:#1c2128;border:1px solid var(--border);border-radius:8px;padding:9px 14px;color:#fff;font-size:var(--fs-base, 0.92rem);}
.filter-bar input:focus{outline:none;border-color:var(--accent);}
.filter-bar select{background:#1c2128;border:1px solid var(--border);border-radius:8px;padding:9px 12px;color:#fff;font-size:var(--fs-sm, 0.82rem);cursor:pointer;}

/* ── EXPORT BAR & BUTTONS ── */
.export-bar{display:flex;gap:8px;margin-bottom:16px;justify-content:center;flex-wrap:wrap;}
.btn-sm{padding:6px 16px;background:var(--card);border:1px solid var(--border);border-radius:8px;color:var(--text);cursor:pointer;font-size:var(--fs-sm, 0.82rem);font-weight:600;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;}
.btn-sm:hover{border-color:var(--accent);color:var(--accent);filter:drop-shadow(0 0 6px rgba(0,212,170,0.15));}
.btn-sm:active{transform:scale(0.98);}
.btn{background:linear-gradient(135deg,var(--accent),#00a080);color:#000;border:none;border-radius:7px;padding:9px 20px;cursor:pointer;font-size:0.88rem;font-weight:700;transition:transform var(--dur-fast, 0.15s),box-shadow var(--dur, 0.2s),opacity var(--dur, 0.2s);}
.btn:active{transform:scale(0.98);}
.btn:hover{opacity:0.92;filter:drop-shadow(0 4px 8px rgba(0,212,170,0.3));}
.btn-full{width:100%;margin-top:6px;}

/* ── CARDS ── */
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);padding:22px;margin-bottom:18px;transition:transform var(--dur-slow, 0.3s) cubic-bezier(0.4,0,0.2,1),filter var(--dur-slow, 0.3s) ease,border-color var(--dur-slow, 0.3s) ease;contain:layout style;}
.card:hover{transform:translateY(-2px) scale(1.01);filter:drop-shadow(0 10px 20px rgba(0,212,170,0.18));border-color:rgba(0,212,170,0.3);}
.card h3{color:var(--accent);font-size:1.1rem;margin-bottom:12px;letter-spacing:0.02em;}
.card h4{color:#fff;margin-bottom:8px;letter-spacing:0.01em;}

/* ── AI COMPONENTS ── */
.ai-reasoning{font-style:italic;color:rgba(255,255,255,0.7);font-size:var(--fs-sm, 0.82rem);line-height:1.4;margin-top:6px;padding:6px 8px;background:rgba(255,255,255,0.03);border-radius:var(--radius-sm, 6px);border-left:2px solid var(--accent);}
.hold-period{font-size:0.75rem;color:rgba(255,255,255,0.5);margin-top:4px;}
.confidence-bar{height:6px;background:var(--border);border-radius:3px;margin-top:10px;overflow:hidden;}
.confidence-fill{height:100%;border-radius:3px;transition:width 0.6s ease;will-change:width;}
.score-ring{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.25rem;margin:8px auto;position:relative;transition:box-shadow var(--dur-slow, 0.3s) ease;}
.score-ring.glow-bullish{box-shadow:0 0 16px rgba(63,185,80,0.35),0 0 32px rgba(63,185,80,0.15);}
.score-ring.glow-bearish{box-shadow:0 0 16px rgba(248,81,73,0.35),0 0 32px rgba(248,81,73,0.15);}
.score-ring.glow-neutral{box-shadow:0 0 12px rgba(210,153,34,0.25),0 0 24px rgba(210,153,34,0.1);}
.score-ring.glow-strong{animation:scoreRingPulse 2.5s ease-in-out infinite;}
@keyframes scoreRingPulse{0%,100%{filter:brightness(1) drop-shadow(0 0 6px rgba(0,212,170,0.2));}50%{filter:brightness(1.12) drop-shadow(0 0 18px rgba(0,212,170,0.45));}}
.factor-bar{display:flex;align-items:center;gap:8px;margin-bottom:5px;}
.factor-label{width:80px;font-size:var(--fs-xs, 0.72rem);color:var(--muted);text-align:right;flex-shrink:0;}
.factor-track{flex:1;height:6px;background:rgba(139,148,158,0.1);border-radius:3px;overflow:hidden;}
.factor-fill{height:100%;border-radius:3px;transition:width 0.5s;}
.factor-val{width:28px;font-size:var(--fs-xs, 0.72rem);font-weight:700;text-align:right;}

/* ── SIGNAL CARDS ── */
.signal-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);padding:20px 20px 20px 24px;position:relative;overflow:hidden;margin-bottom:14px;transition:transform var(--dur-slow, 0.3s) cubic-bezier(0.4,0,0.2,1),filter var(--dur-slow, 0.3s) ease,border-color var(--dur-slow, 0.3s) ease;line-height:1.55;}
.signal-card:hover{transform:translateY(-2px);filter:drop-shadow(0 8px 18px rgba(0,0,0,0.2));border-color:rgba(0,212,170,0.2);}
.signal-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;}
.signal-card::after{content:'';position:absolute;top:0;left:0;bottom:0;width:4px;}
.signal-card.bullish::before{background:var(--green);}
.signal-card.bullish::after{background:var(--green);}
.signal-card.bearish::before{background:var(--red);}
.signal-card.bearish::after{background:var(--red);}
.signal-card.neutral-s::before{background:var(--yellow);}
.signal-card.neutral-s::after{background:var(--yellow);}

/* ── Signal Intensity Classes ── */
.signal-strong-buy { border-top: 3px solid var(--green); filter: drop-shadow(0 -4px 10px rgba(63,185,80,0.25)); }
.signal-buy { border-top: 3px solid rgba(63,185,80,0.5); }
.signal-hold { border-top: 3px solid var(--yellow); }
.signal-sell { border-top: 3px solid rgba(248,81,73,0.5); }
.signal-strong-sell { border-top: 3px solid var(--red); filter: drop-shadow(0 -4px 10px rgba(248,81,73,0.25)); }

/* ── ENTRY/EXIT BLOCKS ── */
.ee-block{margin-top:8px;font-size:var(--fs-xs, 0.72rem);line-height:1.6;background:#0d1117;border-radius:5px;padding:7px 9px;}
body.light .ee-block{background:#eee;}

/* ── RESOURCE GRID ── */
.res-grid,.resource-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:12px;}
.res-item,.resource-card{background:var(--card);border:1px solid var(--border);border-radius:9px;padding:14px;transition:border-color var(--dur, 0.2s),transform var(--dur, 0.2s);}
.res-item:hover,.resource-card:hover{border-color:var(--accent);transform:translateY(-2px);}
.res-item a,.resource-card a{color:var(--accent);text-decoration:none;font-weight:600;font-size:var(--fs-base, 0.92rem);}
.res-item a:hover,.resource-card a:hover{text-decoration:underline;}
.res-item .rm{color:var(--muted);font-size:var(--fs-sm, 0.82rem);margin-top:3px;}
.tag{display:inline-block;padding:2px 7px;border-radius:3px;font-size:0.68rem;font-weight:700;margin-left:5px;}
.tag-free{background:rgba(63,185,80,0.15);color:var(--green);}
.tag-paid{background:rgba(210,153,34,0.15);color:var(--yellow);}

/* ── WARNING / INFO BOXES ── */
.warn-box{background:rgba(248,81,73,0.1);border:1px solid rgba(248,81,73,0.3);border-radius:8px;padding:15px;margin:18px 0;}
.warn-box h4{color:var(--red);margin-bottom:5px;}
.warn-box p{color:var(--muted);font-size:0.88rem;}
.cache-banner{display:none;background:rgba(210,153,34,0.18);border:1px solid var(--yellow);color:var(--yellow);padding:10px 16px;border-radius:8px;margin-bottom:16px;font-size:var(--fs-sm, 0.82rem);text-align:center;font-weight:600;}

/* ── LOADING ── */
.spinner{display:inline-block;width:26px;height:26px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin 0.8s linear infinite;will-change:transform;}
@keyframes spin{to{transform:rotate(360deg);}}
.refresh-ring{display:inline-block;width:16px;height:16px;border-radius:50%;border:2px solid var(--border);border-top-color:var(--accent);vertical-align:middle;margin-left:8px;}
.refresh-ring.active{animation:spin 90s linear infinite;}

/* ── GLASS MORPHISM ── */
.glass{background:rgba(22,27,34,0.85)!important;}
body.light .glass{background:rgba(255,255,255,0.7)!important;}

/* ── SCROLL TO TOP ── */
.scroll-top-btn{position:fixed;bottom:30px;right:30px;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#00a080);color:#000;border:none;font-size:1.3rem;cursor:pointer;opacity:0;visibility:hidden;transition:opacity var(--dur-slow, 0.3s),visibility var(--dur-slow, 0.3s),transform var(--dur, 0.2s);z-index:9000;filter:drop-shadow(0 4px 8px rgba(0,212,170,0.4));display:flex;align-items:center;justify-content:center;}
.scroll-top-btn.visible{opacity:1;visibility:visible;}
.scroll-top-btn:hover{transform:translateY(-3px);}

/* ── API PROGRESS ── */
.api-progress{position:fixed;top:0;left:0;height:3px;width:100%;background:linear-gradient(90deg,var(--accent),#00a080);z-index:10000;animation:progress 2s ease infinite;display:none;will-change:transform;}
@keyframes progress{0%{transform:translateX(-100%);}50%{transform:translateX(0);}100%{transform:translateX(100%);}}

/* ── SEARCH OVERLAY ── */
.search-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.85);z-index:9999;justify-content:center;padding-top:15vh;content-visibility:auto;}
.search-overlay.active{display:flex;content-visibility:visible;}
.search-box{width:90%;max-width:600px;}
.search-input{width:100%;padding:16px 20px;font-size:1.1rem;background:var(--card);border:2px solid var(--accent);border-radius:var(--radius-lg, 14px);color:#fff;outline:none;}
body.light .search-input{color:#1f2328;}
.search-results{margin-top:12px;max-height:50vh;overflow-y:auto;}
.search-result{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--card);border:1px solid var(--border);border-radius:8px;margin-bottom:6px;cursor:pointer;transition:border-color var(--dur, 0.2s);text-decoration:none;color:var(--text);}
.search-result:hover{border-color:var(--accent);}
.search-result .sr-title{font-weight:600;color:#fff;}
body.light .search-result .sr-title{color:#1f2328;}
.search-result .sr-desc{font-size:var(--fs-sm, 0.82rem);color:var(--muted);}
.search-result .sr-badge{font-size:var(--fs-xs, 0.72rem);padding:2px 8px;border-radius:4px;font-weight:700;}

/* Command Palette — Quick Switcher */
.cmd-palette{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:10000;display:none;align-items:flex-start;justify-content:center;padding-top:12vh;backdrop-filter:blur(4px);content-visibility:auto;}
.cmd-palette.active{display:flex;content-visibility:visible;}
.cmd-box{width:90%;max-width:580px;background:var(--card,#161b22);border:1px solid var(--border,#30363d);border-radius:var(--radius-lg, 14px);box-shadow:0 20px 60px rgba(0,0,0,0.5);overflow:hidden;}
.cmd-input-wrap{display:flex;align-items:center;padding:14px 18px;border-bottom:1px solid var(--border,#30363d);gap:10px;}
.cmd-input-wrap .cmd-icon{font-size:1.1rem;color:var(--muted,#8b949e);}
.cmd-input{flex:1;background:none;border:none;color:var(--text,#c9d1d9);font-size:var(--fs-md, 1.05rem);outline:none;}
.cmd-input::placeholder{color:var(--muted,#8b949e);}
.cmd-input-wrap kbd{font-size:0.65rem;padding:2px 6px;border-radius:4px;background:rgba(139,148,158,0.12);color:var(--muted,#8b949e);border:1px solid rgba(139,148,158,0.2);}
.cmd-results{max-height:50vh;overflow-y:auto;padding:6px 0;}
.cmd-results::-webkit-scrollbar{width:4px;}
.cmd-results::-webkit-scrollbar-thumb{background:var(--border,#30363d);border-radius:2px;}
.cmd-item{display:flex;align-items:center;gap:12px;padding:10px 18px;cursor:pointer;transition:background var(--dur-fast, 0.15s);}
.cmd-item:hover,.cmd-item.selected{background:rgba(0,212,170,0.08);}
.cmd-item .cmd-item-icon{font-size:1.2rem;width:28px;text-align:center;}
.cmd-item .cmd-item-text{flex:1;min-width:0;}
.cmd-item .cmd-item-title{font-size:0.88rem;font-weight:600;color:var(--text,#c9d1d9);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cmd-item .cmd-item-desc{font-size:var(--fs-xs, 0.72rem);color:var(--muted,#8b949e);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cmd-item .cmd-item-badge{font-size:0.62rem;padding:2px 8px;border-radius:var(--radius-md, 10px);font-weight:600;text-transform:uppercase;letter-spacing:0.5px;}
.cmd-item .cmd-item-shortcut{font-size:0.65rem;color:var(--muted,#8b949e);padding:2px 6px;border-radius:4px;background:rgba(139,148,158,0.1);border:1px solid rgba(139,148,158,0.15);}
.cmd-empty{padding:30px 18px;text-align:center;color:var(--muted,#8b949e);font-size:0.88rem;}

/* Recently Visited Bar */
.recent-bar{display:flex;align-items:center;gap:6px;padding:0 18px;margin-bottom:4px;overflow-x:auto;flex-wrap:nowrap;}
.recent-bar::-webkit-scrollbar{display:none;}

/* Nav active indicator animation */
.nav-link.active{position:relative;}
.nav-link.active::after{content:'';position:absolute;bottom:-2px;left:20%;right:20%;height:2px;background:var(--accent,#00D4AA);border-radius:1px;}

/* Smooth page transitions */
.container,.dashboard-section,.command-center{animation:fadeSlideIn 0.3s ease;}
@keyframes fadeSlideIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}

/* ── KEYBOARD SHORTCUTS MODAL ── */
.kb-modal{display:none;position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,0.7);align-items:center;justify-content:center;content-visibility:auto;}
.kb-modal.show{display:flex;content-visibility:visible;}
.kb-content{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg, 14px);padding:28px;max-width:420px;width:90%;}
.kb-content h3{color:var(--accent);margin-bottom:14px;}
.kb-row{display:flex;justify-content:space-between;padding:6px 0;font-size:0.88rem;border-bottom:1px solid var(--border);}
.kb-row:last-child{border-bottom:none;}
.kb-key{background:rgba(0,212,170,0.15);color:var(--accent);padding:2px 8px;border-radius:4px;font-family:monospace;font-size:var(--fs-sm, 0.82rem);}

/* ── TOOLTIP ── */
[data-tooltip]{position:relative;cursor:help;}
[data-tooltip]::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:#1c2128;color:var(--text);padding:6px 12px;border-radius:var(--radius-sm, 6px);font-size:0.75rem;opacity:0;pointer-events:none;transition:opacity var(--dur, 0.2s);border:1px solid var(--border);z-index:100;max-width:280px;white-space:normal;text-align:center;line-height:1.4;}
[data-tooltip]:hover::after{opacity:1;}
body.light [data-tooltip]::after{background:#fff;border-color:#d0d7de;color:#24292f;}

/* ── ASSET LINK ── */
.asset-link{color:var(--text);text-decoration:none;cursor:pointer;transition:color var(--dur, 0.2s);font-weight:700;}
.asset-link:hover{color:var(--accent);text-decoration:underline;}

/* ── SPARKLINES ── */
.sparkline{display:inline-block;vertical-align:middle;}
.sparkline svg{display:block;}

/* ── FOCUS ── */
*:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

/* ── SCROLLBAR ── */
::-webkit-scrollbar{width:8px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px;}
::-webkit-scrollbar-thumb:hover{background:var(--accent);}

/* ── PATTERN GRID ── */
.pattern-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;}

/* ── SMOOTH TRANSITIONS (targeted properties only) ── */
.signal-card{contain:content;}
.res-item,.resource-card{transition:border-color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease;}

/* ── MOBILE HAMBURGER NAV ── */
.nav-toggle{display:none;background:none;border:none;color:var(--text);font-size:1.4rem;cursor:pointer;padding:8px;min-width:44px;min-height:44px;align-items:center;justify-content:center;}

/* ── MOBILE BOTTOM NAV ── */
.mobile-bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;z-index:10001;background:rgba(13,17,23,0.98);border-top:1px solid var(--border);padding:6px 8px env(safe-area-inset-bottom);justify-content:space-around;align-items:center;will-change:transform;}
body.light .mobile-bottom-nav{background:rgba(255,255,255,0.98);}
.mobile-bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:var(--muted);font-size:0.64rem;font-weight:600;padding:8px 0;min-width:56px;transition:color var(--dur, 0.2s);}
.mobile-bottom-nav a.active{color:var(--accent);}
.mobile-bottom-nav a .nav-icon{font-size:1.2rem;}
.nav-badge{position:absolute;top:-2px;right:4px;background:var(--red);color:#fff;font-size:0.55rem;font-weight:800;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 4px;box-shadow:0 0 6px var(--red);}

/* ── TABLE HORIZONTAL SCROLL ON MOBILE ── */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius-md, 10px);border:1px solid var(--border);margin-bottom:20px;contain:layout style;}
.table-wrap table{border:none;border-radius:0;margin-bottom:0;}
.table-wrap::-webkit-scrollbar{height:4px;}
.table-wrap::-webkit-scrollbar-thumb{background:var(--accent);border-radius:2px;}

/* ── SORTABLE TABLE HEADERS ── */
table th[style*="cursor"]:hover{background:rgba(0,212,170,0.08) !important;}

/* ── SKELETON LOADING ── */
.skeleton{background:linear-gradient(90deg,var(--card) 0%,rgba(139,148,158,0.06) 20%,rgba(139,148,158,0.1) 50%,rgba(139,148,158,0.06) 80%,var(--card) 100%);background-size:300% 100%;animation:shimmerSmooth 2s ease-in-out infinite;border-radius:var(--radius-sm, 6px);}
@keyframes shimmerSmooth{0%{background-position:300% 0;}100%{background-position:-300% 0;}}

/* ── FADE-IN ANIMATION ── */
.fade-in{animation:fadeIn 0.4s ease forwards;}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}

/* ── PULSE DOT ── */
.pulse-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);animation:pulseDot 2s ease infinite;}
@keyframes pulseDot{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.5;transform:scale(1.3);}}

/* ── RESPONSIVE ── */
@media(max-width:768px){
  /* Premium glass cross-nav — single compositing layer, cheap on GPU */
  .cross-nav{padding:10px 16px;max-height:unset;transition:padding var(--dur, 0.2s) ease,background var(--dur-slow, 0.3s) ease;background:rgba(6,9,15,0.95);border-bottom:1px solid color-mix(in srgb, var(--accent) 35%, transparent);}
  .cross-nav.scrolled{padding:6px 14px;background:rgba(10,14,20,0.88);}
  .cross-nav.scrolled .nav-brand{font-size:var(--fs-sm, 0.82rem);}
  .cross-nav .nav-links{display:none;flex-direction:column;gap:4px;width:calc(100% - 16px);position:absolute;top:calc(100% + 8px);left:8px;right:8px;background:rgba(13,17,23,0.78);backdrop-filter:blur(28px) saturate(180%);-webkit-backdrop-filter:blur(28px) saturate(180%);padding:10px;border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,0.55),0 0 0 1px rgba(255,255,255,0.03) inset;z-index:999;max-height:calc(100vh - 140px);overflow-y:auto;-webkit-overflow-scrolling:touch;transform:translateZ(0);}
  .cross-nav .nav-links.open{display:flex;animation:fadeIn 0.22s ease;}
  .nav-toggle{display:inline-flex;border-radius:var(--radius-md, 10px);transition:background var(--dur-fast, 0.15s) ease,transform var(--dur-fast, 0.15s) ease;}
  .nav-toggle:active{transform:scale(0.94);background:rgba(255,255,255,0.06);}
  .cross-nav .nav-link{min-height:44px;display:flex;align-items:center;justify-content:flex-start;padding:10px 14px;border-radius:var(--radius-md, 10px);font-size:var(--fs-base, 0.92rem);letter-spacing:0.01em;}
  .cross-nav .nav-link:active{background:color-mix(in srgb, var(--accent) 14%, transparent);}
  .cross-nav .search-btn{display:none;}
  .cross-nav .utility-bar{display:none !important;}
  .cross-nav > .theme-toggle-btn{display:inline-flex;width:34px;height:34px;font-size:var(--fs-base, 0.92rem);margin-left:auto;border-radius:var(--radius-md, 10px);}
  .cross-nav > .nav-collapse-btn{display:none;}
  .nav-links .theme-toggle-btn{display:flex !important;min-height:44px;width:100%;justify-content:center;align-items:center;border-top:1px solid var(--border);margin-top:4px;padding-top:8px;border-radius:0;}
  .nav-more-wrap{width:100%;}
  .nav-more-btn{display:flex !important;width:100%;min-height:44px;align-items:center;justify-content:center;font-size:var(--fs-sm, 0.82rem);border-top:1px solid var(--border);margin-top:4px;padding-top:8px;color:var(--muted);font-weight:600;background:none;border-radius:var(--radius-md, 10px);}
  .nav-more-dropdown{display:none !important;position:static !important;background:rgba(255,255,255,0.03) !important;backdrop-filter:none !important;border:1px solid var(--border) !important;box-shadow:none !important;border-radius:var(--radius-lg, 14px) !important;margin-top:6px;padding:6px !important;min-width:unset !important;animation:none !important;}
  .nav-more-dropdown.open{display:flex !important;flex-direction:column;gap:2px;}
  .nav-more-dropdown a{min-height:44px;display:flex;align-items:center;justify-content:flex-start;padding:10px 14px;border-radius:8px;}
  .nmd-group{width:100%;border-top:1px solid var(--border);padding-top:6px;margin-top:4px;}
  .nmd-group:first-child{border-top:none;padding-top:0;margin-top:0;}
  .nmd-label{text-align:center;padding:8px 0 4px;font-size:var(--fs-xs, 0.72rem);letter-spacing:0.06em;text-transform:uppercase;}
  .nav-cat{width:100%;}
  .nav-cat-btn{width:100%;min-height:44px;justify-content:space-between;border-top:1px solid var(--border);margin-top:4px;padding:10px 14px;border-radius:var(--radius-md, 10px);}
  .nav-cat-btn:active{background:rgba(255,255,255,0.05);}
  .nav-cat-dropdown{position:static !important;background:rgba(255,255,255,0.03) !important;backdrop-filter:none !important;border:1px solid var(--border) !important;border-left:2px solid color-mix(in srgb, var(--accent) 55%, transparent) !important;box-shadow:none !important;border-radius:var(--radius-lg, 14px) !important;margin:6px 0 0 8px !important;padding:6px !important;min-width:unset !important;animation:none !important;}
  .nav-cat:not(.open) .nav-cat-dropdown{display:none !important;}
  .nav-cat.open .nav-cat-dropdown{display:block !important;animation:fadeIn 0.2s ease;}
  .nav-cat-link{min-height:44px;justify-content:flex-start;padding:10px 14px;border-radius:8px;}
  .nav-cat-link:active{transform:none;background:color-mix(in srgb, var(--accent) 14%, transparent);}
  .nav-recent{display:none;}

  /* Premium bottom nav — single compositing layer with blur */
  .mobile-bottom-nav{display:flex;backdrop-filter:blur(24px) saturate(180%) !important;-webkit-backdrop-filter:blur(24px) saturate(180%) !important;background:rgba(13,17,23,0.72) !important;border-top:1px solid color-mix(in srgb, var(--accent) 25%, var(--border)) !important;box-shadow:0 -8px 32px rgba(0,0,0,0.35);transform:translateZ(0);}
  body.light .mobile-bottom-nav{background:rgba(255,255,255,0.78) !important;}
  body{padding-bottom:72px;}

  /* Premium tabs — fade-edge indicator + scroll snap */
  .tabs{gap:6px;overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start;padding:4px 2px;scroll-snap-type:x proximity;mask-image:linear-gradient(90deg, #000 0, #000 calc(100% - 24px), transparent 100%);-webkit-mask-image:linear-gradient(90deg, #000 0, #000 calc(100% - 24px), transparent 100%);}
  .tabs::-webkit-scrollbar{display:none;}
  .tab{padding:10px 16px;font-size:0.84rem;min-height:42px;display:flex;align-items:center;justify-content:center;flex-shrink:0;scroll-snap-align:start;letter-spacing:0.01em;}
  .tab:active{transform:scale(0.97);}

  .stat-grid{grid-template-columns:repeat(2, 1fr);gap:10px;}
  .stat-card{padding:14px 12px;}

  .filter-bar{flex-direction:column;gap:8px;}
  .filter-bar input,.filter-bar select{width:100%;min-height:44px;font-size:var(--fs-base, 0.92rem);border-radius:var(--radius-md, 10px);}

  header{padding:20px 0 14px;margin-bottom:20px;}
  header h1{font-size:1.6rem;letter-spacing:-0.022em;line-height:1.15;}
  header p{font-size:0.86rem;}

  .export-bar{flex-direction:column;gap:8px;}
  .btn-sm{width:100%;text-align:center;min-height:44px;border-radius:var(--radius-md, 10px);font-size:0.88rem;transition:transform var(--dur-fast, 0.15s) ease,background var(--dur-fast, 0.15s) ease;}
  .btn-sm:active{transform:scale(0.98);}
  .btn{min-height:46px;border-radius:var(--radius-lg, 14px);font-size:var(--fs-base, 0.92rem);transition:transform var(--dur-fast, 0.15s) ease;}
  .btn:active{transform:scale(0.98);}

  .scroll-top-btn{bottom:128px;right:16px;width:44px;height:44px;box-shadow:0 8px 24px rgba(0,0,0,0.4);}
  .refresh-btn{bottom:184px;right:16px;width:44px;height:44px;}
  #platform-health-badge{top:auto !important;bottom:72px !important;left:16px !important;right:auto !important;}

  /* Tactile tap feedback */
  .card:active,.signal-card:active,.stat-card:active{transform:scale(0.995);}

  /* Perf: avoid blur on large/numerous surfaces (cards are cheap without it); keep blur only on overlays and fixed chrome */
  html,body{-webkit-overflow-scrolling:touch;overscroll-behavior-y:auto;touch-action:pan-y pan-x;}
  .container{touch-action:pan-y pan-x;}
  .card,.signal-card,.stat-card{backdrop-filter:none;-webkit-backdrop-filter:none;contain:layout style;}
  .section.active{contain:none;}
  .search-overlay,.cmd-palette,.kb-modal,.compare-overlay{backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);}

  .scanner-table,.price-table,.t{font-size:var(--fs-sm, 0.82rem);}
  .scanner-table thead th,.price-table thead th,.t thead th{padding:10px 8px;font-size:0.68rem;}
  .scanner-table tbody td,.price-table tbody td,.t tbody td{padding:10px 8px;}

  input,select,textarea{min-height:44px;border-radius:var(--radius-md, 10px);font-size:16px;}
}
@media(max-width:480px){
  .container{padding:14px 12px;}
  header h1{font-size:1.4rem;}
  .stat-card .value{font-size:1.25rem;}
  .stat-card .label{font-size:var(--fs-xs, 0.72rem);letter-spacing:0.04em;}
  .signal-card{padding:14px;}
  .res-grid,.resource-grid{grid-template-columns:1fr;}
  .ai-heatmap{grid-template-columns:repeat(auto-fill,minmax(72px,1fr)) !important;gap:4px;}
  .ai-hm-cell{padding:6px 4px;font-size:0.68rem;}
}

/* ── TOAST NOTIFICATIONS ── */
#toast-container{position:fixed;top:60px;right:20px;z-index:11000;display:flex;flex-direction:column;gap:8px;pointer-events:none;}
.toast{display:flex;align-items:center;gap:8px;padding:12px 18px;border-radius:var(--radius-md, 10px);font-size:var(--fs-sm, 0.82rem);font-weight:600;color:#fff;background:rgba(22,27,34,0.95);transform:translateX(120%);transition:transform var(--dur-slow, 0.3s) cubic-bezier(0.4,0,0.2,1),opacity var(--dur-slow, 0.3s);opacity:0;pointer-events:auto;filter:drop-shadow(0 8px 16px rgba(0,0,0,0.3));max-width:360px;will-change:transform,opacity;}
.toast.show{transform:translateX(0);opacity:1;}
.toast-icon{font-size:1.1rem;flex-shrink:0;}
.toast-success{background:rgba(63,185,80,0.9);border:1px solid var(--green);}
.toast-error{background:rgba(248,81,73,0.9);border:1px solid var(--red);}
.toast-warning{background:rgba(210,153,34,0.9);border:1px solid var(--yellow);color:#000;}
.toast-info{background:rgba(0,212,170,0.9);border:1px solid var(--accent);color:#000;}
/* Mobile: move toasts to bottom (above bottom nav) so they don't block hamburger/nav */
@media(max-width:768px){
  #toast-container{top:auto;bottom:80px;right:12px;left:12px;align-items:stretch;}
  .toast{max-width:100%;font-size:0.78rem;padding:10px 14px;border-radius:8px;transform:translateY(120%);filter:drop-shadow(0 -4px 12px rgba(0,0,0,0.3));}
  .toast.show{transform:translateY(0);}
}

/* ── STALE DATA BANNER ── */
.stale-banner{background:rgba(210,153,34,0.15);border:1px solid rgba(210,153,34,0.4);color:var(--yellow);padding:10px 16px;border-radius:8px;margin-bottom:16px;font-size:var(--fs-sm, 0.82rem);text-align:center;font-weight:600;animation:fadeIn 0.4s ease;}

/* ── BREADCRUMB ── */
.breadcrumb{display:flex;align-items:center;gap:4px;font-size:0.78rem;color:var(--muted);margin-bottom:12px;padding:0 4px;}
.bc-link{color:var(--accent);text-decoration:none;font-weight:600;}
.bc-link:hover{text-decoration:underline;}
.bc-sep{color:var(--border);margin:0 2px;}
.bc-current{color:var(--text);font-weight:600;}

/* ── STREAK BADGES ── */
.streak-badge{display:inline-block;padding:1px 6px;border-radius:var(--radius-md, 10px);font-size:0.65rem;font-weight:700;vertical-align:middle;margin-left:4px;}
.streak-hot{background:rgba(248,81,73,0.2);color:var(--red);}
.streak-warm{background:rgba(210,153,34,0.2);color:var(--yellow);}
.streak-cold{background:rgba(88,166,255,0.2);color:var(--blue);}

/* ── MARKET STATUS DOTS ── */
.market-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;}
.market-dot.open{background:var(--green);box-shadow:0 0 6px var(--green);}
.market-dot.closed{background:var(--red);opacity:0.6;}

/* ── PERFORMANCE MODE ── */
body.perf-mode *{animation:none !important;transition:none !important;}
body.perf-mode .sparkline,body.perf-mode .pulse-dot{display:none !important;}
body.perf-mode .stat-card:hover,body.perf-mode .card:hover{transform:none !important;box-shadow:none !important;}

/* ── TABLE ROW HOVER SPARKLINE ── */
.row-spark{opacity:0;transition:opacity var(--dur, 0.2s);position:absolute;right:4px;top:50%;transform:translateY(-50%);}
tr:hover .row-spark{opacity:1;}

/* ── VOLATILITY REGIME BADGE ── */
.vol-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:var(--radius-lg, 14px);font-size:var(--fs-xs, 0.72rem);font-weight:700;letter-spacing:0.3px;}
.vol-high{background:rgba(248,81,73,0.15);color:var(--red);border:1px solid rgba(248,81,73,0.3);}
.vol-medium{background:rgba(210,153,34,0.15);color:var(--yellow);border:1px solid rgba(210,153,34,0.3);}
.vol-low{background:rgba(63,185,80,0.15);color:var(--green);border:1px solid rgba(63,185,80,0.3);}

/* ── CONVICTION RANK ── */
.conviction-rank{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;font-size:var(--fs-xs, 0.72rem);font-weight:800;background:var(--accent);color:#000;margin-right:6px;}
.conviction-rank.top3{background:linear-gradient(135deg,#FFD700,#FFA500);box-shadow:0 0 8px rgba(255,215,0,0.4);}

/* ── SECTOR FLOW BARS ── */
.flow-bar{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:0.78rem;}
.flow-track{flex:1;height:8px;background:rgba(139,148,158,0.1);border-radius:4px;overflow:hidden;position:relative;}
.flow-fill-pos{height:100%;background:var(--green);border-radius:4px;float:right;}
.flow-fill-neg{height:100%;background:var(--red);border-radius:4px;float:left;}

/* ── HEALTH DOTS ── */
.health-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;}
.health-item{display:flex;align-items:center;gap:6px;padding:6px 10px;background:var(--card);border:1px solid var(--border);border-radius:8px;font-size:0.75rem;font-weight:600;}
.health-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
.health-dot.fresh{background:var(--green);box-shadow:0 0 6px var(--green);}
.health-dot.stale{background:var(--yellow);}
.health-dot.offline{background:var(--red);opacity:0.6;}

/* ── NAV "MORE" DROPDOWN ── */
.nav-more-wrap{position:relative;flex-shrink:0;}
.nav-more-btn{padding:6px 14px;border-radius:var(--radius-sm, 6px);text-decoration:none;color:var(--muted);font-weight:600;border:1px solid transparent;white-space:nowrap;cursor:pointer;background:none;font-size:var(--fs-sm, 0.82rem);transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;}
.nav-more-btn:hover{color:var(--text);border-color:var(--border);}
.nav-more-btn.open{color:var(--accent);border-color:var(--accent);}
.nav-more-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;background:rgba(22,27,34,0.98);border:1px solid var(--border);border-radius:var(--radius-lg, 14px);padding:16px;min-width:480px;z-index:2000;box-shadow:0 16px 48px rgba(0,0,0,0.5);}
.nav-more-dropdown.open{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px 16px;animation:fadeIn 0.2s ease;}
body.light .nav-more-dropdown{background:rgba(255,255,255,0.97);box-shadow:0 16px 48px rgba(0,0,0,0.15);}
.nav-group-label,.nmd-label{padding:6px 0 4px;font-size:0.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:1.2px;font-weight:700;}
.nmd-group{margin-bottom:4px;}
.nmd-group:last-child{margin-bottom:0;}
.nav-more-dropdown a{display:block;padding:7px 10px;color:var(--text);text-decoration:none;font-size:var(--fs-sm, 0.82rem);font-weight:600;transition:background var(--dur-fast, 0.15s),color var(--dur-fast, 0.15s);border-radius:var(--radius-sm, 6px);white-space:nowrap;}
.nav-more-dropdown a:hover{background:rgba(0,212,170,0.1);color:var(--accent);}
.nav-more-dropdown a.active{color:var(--accent);}
.nav-more-divider{height:1px;background:var(--border);margin:6px 0;}

/* ── CATEGORY NAV DROPDOWNS (Desktop) ── */
.nav-cat{position:relative;flex-shrink:0;}
.nav-cat-btn{padding:6px 14px;border-radius:var(--radius-sm, 6px);color:var(--muted);font-weight:600;border:1px solid transparent;white-space:nowrap;cursor:pointer;background:none;font-size:var(--fs-sm, 0.82rem);transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;display:flex;align-items:center;gap:4px;}
.nav-cat-btn:hover{color:var(--text);border-color:var(--border);background:rgba(255,255,255,0.04);}
.nav-cat.open .nav-cat-btn,.nav-cat-active .nav-cat-btn{color:var(--accent);border-color:color-mix(in srgb, var(--accent) 35%, transparent);background:color-mix(in srgb, var(--accent) 8%, transparent);}
.nav-cat-arrow{font-size:var(--fs-xs, 0.72rem);transition:transform var(--dur, 0.2s);}
.nav-cat.open .nav-cat-arrow{transform:rotate(180deg);}
.nav-cat-dropdown{display:none;position:absolute;top:calc(100% + 8px);left:0;background:rgba(13,17,23,0.92);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid var(--border);border-radius:var(--radius-lg, 14px);padding:6px;min-width:220px;z-index:2000;box-shadow:0 20px 48px rgba(0,0,0,0.6),0 0 0 1px rgba(255,255,255,0.02) inset;}
.nav-cat.open .nav-cat-dropdown{display:block;animation:fadeIn 0.15s ease;}
body.light .nav-cat-dropdown{background:rgba(255,255,255,0.97);box-shadow:0 12px 40px rgba(0,0,0,0.12);}
.nav-cat-link{display:flex;align-items:center;gap:10px;padding:9px 12px;color:var(--text);text-decoration:none;font-size:0.84rem;font-weight:600;transition:background var(--dur-fast, 0.15s) ease,color var(--dur-fast, 0.15s) ease,transform var(--dur-fast, 0.15s) ease;border-radius:8px;white-space:nowrap;}
.nav-cat-link:hover{background:color-mix(in srgb, var(--accent) 12%, transparent);color:var(--accent);transform:translateX(2px);}
.nav-cat-link.active{color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, transparent);box-shadow:inset 2px 0 0 var(--accent);}

/* Nav signal badges */
.nav-sig-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;font-size:0.62rem;font-weight:800;line-height:1;margin-left:auto;}
.nav-sig-bull{background:rgba(63,185,80,0.2);color:var(--green);}
.nav-sig-bear{background:rgba(248,81,73,0.2);color:var(--red);}
.nav-sig-hot{background:rgba(210,153,34,0.25);color:#d4a017;}
.nav-cat-count{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;border-radius:8px;font-size:0.58rem;font-weight:800;background:rgba(63,185,80,0.15);color:var(--green);margin-left:2px;}

/* Recently visited row */
.nav-recent{display:flex;align-items:center;gap:4px;margin-right:8px;padding-right:10px;border-right:1px solid var(--border);}
.nav-recent-link{padding:3px 8px;border-radius:5px;color:var(--muted);text-decoration:none;font-size:var(--fs-xs, 0.72rem);font-weight:600;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;white-space:nowrap;opacity:0.7;}
.nav-recent-link:hover{color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, transparent);opacity:1;}

/* ── COLUMN PICKER ── */
.col-picker-wrap{display:inline-block;position:relative;}
.col-picker-btn{background:none;border:none;color:var(--muted);cursor:pointer;font-size:var(--fs-sm, 0.82rem);padding:2px 6px;border-radius:4px;transition:color var(--dur, 0.2s);}
.col-picker-btn:hover{color:var(--accent);}
.col-picker-dropdown{display:none;position:absolute;top:calc(100% + 4px);right:0;background:var(--card);border:1px solid var(--border);border-radius:8px;padding:10px;min-width:200px;z-index:2000;box-shadow:0 8px 24px rgba(0,0,0,0.4);max-height:320px;overflow-y:auto;}
.col-picker-dropdown.open{display:block;}
.col-picker-dropdown label{display:flex;align-items:center;gap:8px;padding:5px 4px;font-size:var(--fs-sm, 0.82rem);color:var(--text);cursor:pointer;border-radius:4px;transition:background var(--dur-fast, 0.15s);}
.col-picker-dropdown label:hover{background:rgba(0,212,170,0.08);}
.col-picker-dropdown input[type="checkbox"]{accent-color:var(--accent);width:16px;height:16px;}
.col-picker-title{font-size:var(--fs-xs, 0.72rem);color:var(--muted);text-transform:uppercase;letter-spacing:0.8px;padding-bottom:6px;border-bottom:1px solid var(--border);margin-bottom:6px;font-weight:700;}

/* ── VIEW MODE TOGGLE ── */
.view-toggle{display:inline-flex;border:1px solid var(--border);border-radius:var(--radius-sm, 6px);overflow:hidden;margin-left:8px;}
.view-toggle button{padding:5px 12px;background:none;border:none;color:var(--muted);font-size:0.78rem;cursor:pointer;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;font-weight:600;}
.view-toggle button.active{background:var(--accent);color:#000;}
.view-toggle button:hover:not(.active){color:var(--text);}

/* table compact mode */
table.compact th,table.compact td{padding:6px 10px;font-size:var(--fs-sm, 0.82rem);}
table.compact td{font-size:var(--fs-sm, 0.82rem);}

/* ── REFRESH DATA BUTTON ── */
.refresh-btn{position:fixed;bottom:70px;right:20px;z-index:900;width:48px;height:48px;border-radius:50%;background:var(--card);border:1px solid var(--border);color:var(--accent,#58a6ff);font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 15px rgba(0,0,0,0.3);transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;}
.refresh-btn:hover{transform:scale(1.1);border-color:var(--accent,#58a6ff);box-shadow:0 0 20px rgba(88,166,255,0.3);}
.refresh-btn.spinning svg,.refresh-btn.spinning{animation:refreshSpin 1s linear infinite;}
@keyframes refreshSpin{to{transform:rotate(360deg);}}
.refresh-toast{position:fixed;bottom:130px;right:20px;z-index:901;background:var(--card);border:1px solid var(--accent,#58a6ff);border-radius:8px;padding:8px 16px;font-size:var(--fs-sm, 0.82rem);color:var(--text,#e6edf3);box-shadow:0 4px 15px rgba(0,0,0,0.3);opacity:0;transition:opacity var(--dur-slow, 0.3s);pointer-events:none;}
.refresh-toast.show{opacity:1;}
body.light .refresh-btn{background:#fff;border-color:#d0d7de;}
body.light .refresh-toast{background:#fff;border-color:#d0d7de;color:#1f2328;}

/* ── TABLE ROW CLICK-TO-HIGHLIGHT ── */
table.t tr.selected td{border-left:3px solid var(--accent,#58a6ff);background:rgba(88,166,255,0.05);}

/* ── DATA FRESHNESS INDICATOR ── */
.data-freshness{font-size:0.78rem;color:var(--muted);text-align:center;margin-top:-18px;margin-bottom:18px;opacity:0.8;}
.data-freshness .fresh-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px;vertical-align:middle;}
.data-freshness .fresh-dot.fresh{background:var(--green);}
.data-freshness .fresh-dot.stale{background:var(--yellow);}
.data-freshness .fresh-dot.old{background:var(--red);opacity:0.6;}

/* ── WIN RATE STATS CARD ── */
.win-rate-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg, 14px);padding:18px;position:relative;overflow:hidden;}
.win-rate-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--green),var(--accent),var(--red));}
.win-rate-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.win-rate-title{font-size:var(--fs-sm, 0.82rem);font-weight:700;color:var(--text);text-transform:uppercase;letter-spacing:0.5px;}
.win-rate-badge{font-size:1.6rem;font-weight:800;}

/* ── PORTFOLIO HEAT BADGE ── */
.portfolio-heat-badge{position:fixed;bottom:90px;left:20px;z-index:9000;background:rgba(22,27,34,0.96);border:1px solid var(--border);border-radius:var(--radius-lg, 14px);padding:10px 14px;text-align:center;min-width:70px;filter:drop-shadow(0 8px 16px rgba(0,0,0,0.3));transition:transform var(--dur, 0.2s) ease;}
.portfolio-heat-badge:hover{transform:translateY(-3px);filter:drop-shadow(0 12px 20px rgba(0,212,170,0.2));}
.heat-score{font-size:1.5rem;font-weight:800;line-height:1;}
.heat-label{font-size:0.65rem;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-top:2px;}
.heat-detail{font-size:var(--fs-xs, 0.72rem);color:var(--muted);margin-top:2px;}
.heat-warn{font-size:0.6rem;color:var(--yellow);margin-top:2px;}
body.light .portfolio-heat-badge{background:rgba(255,255,255,0.92);}
@media(max-width:768px){.portfolio-heat-badge{bottom:80px;left:12px;padding:8px 10px;min-width:60px;}.heat-score{font-size:1.2rem;}}

/* ── MARKET BREADTH BAR ── */
.market-breadth-bar{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);padding:12px 16px;margin:12px 20px 16px;animation:fadeIn 0.4s ease;}
.breadth-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.breadth-track{display:flex;height:10px;border-radius:5px;overflow:hidden;background:var(--border);}
.breadth-fill-bull{background:var(--green);transition:width 0.6s ease;}
.breadth-fill-neutral{background:var(--yellow);transition:width 0.6s ease;}
.breadth-fill-bear{background:var(--red);transition:width 0.6s ease;}
.breadth-labels{display:flex;justify-content:space-between;margin-top:6px;font-size:var(--fs-xs, 0.72rem);font-weight:600;}

/* ── COMPARE SELECTED BUTTON ── */
.compare-selected-btn{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);z-index:9500;display:none;align-items:center;justify-content:center;gap:6px;padding:12px 24px;background:linear-gradient(135deg,var(--accent),#00a080);color:#000;border:none;border-radius:var(--radius-lg, 14px);font-size:var(--fs-base, 0.92rem);font-weight:700;cursor:pointer;filter:drop-shadow(0 8px 16px rgba(0,212,170,0.4));transition:transform 0.2s ease;animation:fadeIn 0.3s ease;}
.compare-selected-btn:hover{transform:translateX(-50%) translateY(-2px);filter:drop-shadow(0 12px 20px rgba(0,212,170,0.5));}

/* ── COMPARE OVERLAY ── */
.compare-overlay{display:none;position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,0.8);align-items:center;justify-content:center;padding:20px;content-visibility:auto;}
.compare-overlay.active{display:flex;animation:fadeIn 0.3s ease;content-visibility:visible;}
.compare-popup{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;max-width:700px;width:100%;max-height:80vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,0.5);}
.compare-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;border-bottom:1px solid var(--border);padding-bottom:12px;}
.compare-header h3{color:var(--accent);font-size:1.1rem;margin:0;}
.compare-grid{display:grid;gap:16px;}
.compare-col{text-align:center;padding:16px;background:rgba(139,148,158,0.05);border-radius:var(--radius-md, 10px);border:1px solid var(--border);}
.compare-ticker{font-size:1.2rem;font-weight:800;color:var(--text);margin-bottom:8px;}
.compare-price{font-size:var(--fs-md, 1.05rem);color:var(--text);margin-bottom:4px;}
.compare-change{font-size:var(--fs-base, 0.92rem);font-weight:700;margin-bottom:10px;}
.compare-score{margin:10px 0;}
.compare-signal{font-size:var(--fs-base, 0.92rem);margin-bottom:4px;}
.compare-conf{font-size:0.75rem;color:var(--muted);}
body.light .compare-popup{background:#fff;}
body.light .compare-col{background:rgba(0,0,0,0.02);}

/* ── COMPARE CHECKBOX VISIBILITY ── */
.compare-cb{opacity:0.3;transition:opacity var(--dur, 0.2s);}
tr:hover .compare-cb,.compare-cb:checked{opacity:1;}

/* ── TOP PICK HIGHLIGHTING ── */
.top-pick-badge{display:inline-block;padding:2px 8px;background:linear-gradient(135deg,#d4a017,#f0c040);color:#000;font-size:0.68rem;font-weight:800;border-radius:4px;text-transform:uppercase;letter-spacing:0.5px;animation:topPickGlow 2s ease-in-out infinite;}
@keyframes topPickGlow{0%,100%{box-shadow:0 0 6px rgba(212,175,55,0.4);}50%{box-shadow:0 0 16px rgba(212,175,55,0.8);}}
.top-pick-row td{border-left:3px solid #d4a017 !important;background:rgba(212,175,55,0.04) !important;}
.top-pick-row td:first-child::before{content:'\2B50 ';font-size:var(--fs-sm, 0.82rem);}
.top-pick-card{background:linear-gradient(135deg,rgba(212,175,55,0.08),rgba(240,192,64,0.04));border:1px solid rgba(212,175,55,0.3);border-radius:var(--radius-md, 10px);padding:14px;text-align:center;min-width:140px;}
.top-pick-card .tp-ticker{font-size:var(--fs-md, 1.05rem);font-weight:800;color:#d4a017;}
.top-pick-card .tp-score{font-size:1.4rem;font-weight:800;margin:4px 0;}
.top-pick-card .tp-signal{font-size:0.78rem;font-weight:700;}
.top-picks-row{display:flex;gap:12px;overflow-x:auto;padding:12px 0;margin-bottom:16px;}
.top-picks-container{background:var(--card);border:1px solid rgba(212,175,55,0.3);border-radius:var(--radius-lg, 14px);padding:16px;margin-bottom:20px;}
.top-picks-container h3{color:#d4a017;font-size:var(--fs-base, 0.92rem);margin-bottom:10px;text-transform:uppercase;letter-spacing:1px;}

/* Sector top 3 glow in heatmap */
.hm-top3{box-shadow:0 0 8px rgba(212,175,55,0.5);border:1px solid rgba(212,175,55,0.6) !important;}
.hm-top1{box-shadow:0 0 12px rgba(212,175,55,0.8);border:2px solid #d4a017 !important;animation:topPickGlow 2s ease-in-out infinite;}
.hm-top1 .top-pick-badge{position:absolute;top:4px;right:4px;z-index:2;}
.stock-cell.hm-top3{box-shadow:0 0 8px rgba(212,175,55,0.5);border:1px solid rgba(212,175,55,0.6) !important;}
.stock-cell.hm-top1{box-shadow:0 0 12px rgba(212,175,55,0.8);border:2px solid #d4a017 !important;animation:topPickGlow 2s ease-in-out infinite;position:relative;}

/* Sort toggle bar */
.sort-toggle-bar{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:var(--fs-sm, 0.82rem);}
.sort-toggle-bar span{color:var(--muted);font-weight:600;}
.sort-toggle-btn{padding:5px 14px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm, 6px);color:var(--muted);cursor:pointer;font-size:var(--fs-sm, 0.82rem);font-weight:600;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;}
.sort-toggle-btn:hover{border-color:var(--accent);color:var(--text);}
.sort-toggle-btn.active{background:linear-gradient(135deg,#d4a017,#f0c040);color:#000;border-color:#d4a017;font-weight:700;}

body.light .top-pick-badge{background:linear-gradient(135deg,#b8860b,#d4a017);color:#fff;}
body.light .top-pick-row td{background:rgba(212,175,55,0.08) !important;}
body.light .top-pick-card{background:rgba(212,175,55,0.1);border-color:rgba(212,175,55,0.4);}
body.light .top-picks-container{background:#fff;}

/* ── PREMIUM TYPOGRAPHY & TRANSITIONS ── */
h1,h2,h3,h4,h5,h6{letter-spacing:-0.01em;line-height:1.25;font-weight:700;}
h1{font-weight:800;}
h2{font-weight:750;}
.label,.ee-label,.rgi-label,.ais-metric-label,.calc-input-group label,.fund-label,.trade-label{font-weight:600;}
p,.ai-reasoning,.reasoning,.rec-strategy{line-height:1.65;}

/* ── ENHANCED AI SCORE RING (Large Hero Version) ── */
.ai-score-ring .score-number{font-size:2.4rem;font-weight:900;line-height:1;letter-spacing:-0.02em;}
.ai-score-ring .score-label{font-size:var(--fs-xs, 0.72rem);letter-spacing:0.8px;margin-top:2px;}
.ai-score-ring svg circle[stroke-linecap]{filter:drop-shadow(0 0 6px currentColor);}

/* ── GRADIENT ACCENT FOR STRONG SIGNALS ── */
.signal-badge{transition:transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;}
.signal-badge.strong-buy{box-shadow:0 0 20px rgba(63,185,80,0.25);animation:signalGlow 3s ease-in-out infinite;}
.signal-badge.strong-sell{box-shadow:0 0 20px rgba(248,81,73,0.25);animation:signalGlowRed 3s ease-in-out infinite;}
@keyframes signalGlow{0%,100%{box-shadow:0 0 12px rgba(63,185,80,0.2);}50%{box-shadow:0 0 24px rgba(63,185,80,0.4);}}
@keyframes signalGlowRed{0%,100%{box-shadow:0 0 12px rgba(248,81,73,0.2);}50%{box-shadow:0 0 24px rgba(248,81,73,0.4);}}

/* ── FACTOR BAR ENHANCEMENTS ── */
.factor-row{transition:background var(--dur-fast, 0.15s) ease;border-radius:4px;padding:2px 4px;margin-bottom:6px;}
.factor-row:hover{background:rgba(139,148,158,0.04);}
.factor-bar{transition:width 0.6s cubic-bezier(0.4,0,0.2,1);}
.factor-bar-wrap{height:10px;border-radius:5px;}
.factor-bar{border-radius:5px;}

/* ── MARKET STATE BADGE ── */
.market-state-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 12px;border-radius:20px;font-size:var(--fs-xs, 0.72rem);font-weight:700;letter-spacing:0.5px;text-transform:uppercase;}
.market-state-badge.state-open{background:rgba(63,185,80,0.15);color:var(--green);border:1px solid rgba(63,185,80,0.3);}
.market-state-badge.state-open::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--green);animation:pulseDot 2s ease infinite;}
.market-state-badge.state-closed{background:rgba(248,81,73,0.12);color:var(--red);border:1px solid rgba(248,81,73,0.25);}
.market-state-badge.state-pre{background:rgba(88,166,255,0.12);color:var(--blue);border:1px solid rgba(88,166,255,0.25);}
.market-state-badge.state-post{background:rgba(188,140,255,0.12);color:var(--purple);border:1px solid rgba(188,140,255,0.25);}

/* ── ENHANCED HERO CARD ── */
.hero-card{border-top:3px solid transparent;background-clip:padding-box;}
.hero-card.hero-bullish{border-image:linear-gradient(90deg,var(--green),var(--accent)) 1;}
.hero-card.hero-bearish{border-image:linear-gradient(90deg,var(--red),var(--orange)) 1;}
.hero-card.hero-neutral{border-image:linear-gradient(90deg,var(--yellow),var(--orange)) 1;}

/* ── PRICE DISPLAY PREMIUM ── */
.hero-price{font-variant-numeric:tabular-nums;letter-spacing:-0.03em;}
.hero-price .price-direction{display:inline-flex;align-items:center;margin-left:8px;font-size:var(--fs-md, 1.05rem);vertical-align:middle;}
.hero-price .price-direction.up{color:var(--green);}
.hero-price .price-direction.down{color:var(--red);}

/* ── STAT CARD VALUE COLOR CODING ── */
.stat-card .value.positive{-webkit-text-fill-color:var(--green);animation:none;}
.stat-card .value.negative{-webkit-text-fill-color:var(--red);animation:none;}

/* ── TOOLTIPS ON STAT CARDS ── */
.stat-card[data-tooltip]::after{bottom:auto;top:calc(100% + 6px);font-size:var(--fs-xs, 0.72rem);max-width:220px;z-index:20;box-shadow:0 4px 12px rgba(0,0,0,0.3);}

/* ── MOBILE TOUCH IMPROVEMENTS ── */
@media(max-width:768px){
  .stat-card{min-height:44px;padding:14px 12px;}
  .tab{min-height:44px;padding:10px 16px;}
  .btn-sm,.btn{min-height:44px;}
  .signal-card{padding:18px 16px 18px 20px;}
  .factor-label{font-size:0.75rem;}
  .hero-card{padding:20px 16px;}
  .hero-name{font-size:1.35rem;}
  .rec-grid{grid-template-columns:1fr 1fr;}
  .ee-grid{grid-template-columns:1fr 1fr;}
  .ai-summary-metrics{grid-template-columns:1fr 1fr;}
  .target-grid{grid-template-columns:1fr 1fr;}
  .rec-header{flex-direction:column;align-items:flex-start;}
  .rec-direction-badge{font-size:1.2rem;padding:8px 20px;}
}
@media(max-width:480px){
  .stat-grid{grid-template-columns:1fr 1fr;gap:10px;}
  .stat-card .label{font-size:0.68rem;}
  .stat-card .value{font-size:1.1rem;}
  .rec-grid{grid-template-columns:1fr 1fr;gap:10px;}
  .ai-summary-metrics{grid-template-columns:1fr;}
  .hero-price{font-size:2.2rem;}
  .rec-direction-badge{font-size:var(--fs-md, 1.05rem);padding:6px 16px;letter-spacing:1px;}
  .rec-grid-item{padding:10px 8px;}
  .factor-label{width:90px;font-size:var(--fs-xs, 0.72rem);}
}

/* ── COLLAPSIBLE SECTIONS (MOBILE) ── */
.collapsible-header{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:12px 0;user-select:none;-webkit-tap-highlight-color:transparent;}
.collapsible-header::after{content:'\\25BC';font-size:var(--fs-xs, 0.72rem);color:var(--muted);transition:transform var(--dur-slow, 0.3s) ease;}
.collapsible-header.collapsed::after{transform:rotate(-90deg);}
.collapsible-body{overflow:hidden;transition:max-height var(--dur-slow, 0.3s) cubic-bezier(0.4,0,0.2,1);max-height:2000px;}
.collapsible-body.collapsed{max-height:0;overflow:hidden;}

/* ── REDUCED MOTION ── */
@media(prefers-reduced-motion:reduce){
  *{animation-duration:0.01ms !important;transition-duration:0.01ms !important;}
}

/* ── PRINT STYLES ── */
@media print{
  .cross-nav,.mobile-bottom-nav,.scroll-top-btn,#toast-container,.nav-toggle,.theme-toggle,.theme-toggle-btn,.export-bar,.filter-bar,.tabs,.search-overlay,.kb-modal,.api-progress,.refresh-btn,.refresh-toast,.data-freshness,.action-summary{display:none !important;}
  body{background:#fff !important;color:#000 !important;padding:0 !important;}
  .container{max-width:100%;padding:10px;}
  .card,.stat-card,.signal-card{break-inside:avoid;border:1px solid #ccc;box-shadow:none;background:#fff !important;}
  .stat-card .value,.card h3,.card h4{color:#000 !important;}
  table.t th,.price-table th{background:#eee !important;color:#333 !important;}
  table.t td,.price-table td{color:#000 !important;}
  a{color:#000 !important;text-decoration:underline;}
  header{border-bottom:2px solid #000;padding:10px 0;}
  header h1{color:#000 !important;font-size:1.5rem;}
}

/* ── FREEZE PANES: Sticky table headers & first column ── */
.table-scroll-wrap{overflow:auto;max-height:70vh;border:1px solid var(--border);border-radius:var(--radius-md, 10px);position:relative;}
table.t thead th{position:sticky;top:0;z-index:3;background:var(--card,#161b22);}
table.t thead th::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:var(--border);}
/* Sticky first column (ticker/symbol) */
table.t th:first-child,
table.t td:first-child{position:sticky;left:0;z-index:2;background:inherit;}
table.t thead th:first-child{z-index:4;} /* Corner cell: both sticky */
/* Shadow indicators for scroll */
.table-scroll-wrap.scrolled-right td:first-child,
.table-scroll-wrap.scrolled-right th:first-child{box-shadow:4px 0 8px -2px rgba(0,0,0,0.3);}
.table-scroll-wrap.scrolled-down thead th{box-shadow:0 4px 8px -2px rgba(0,0,0,0.3);}

/* Light theme */
body.light table.t thead th{background:var(--card,#fff);}
body.light table.t th:first-child,
body.light table.t td:first-child{background:inherit;}

/* Ensure table cells have proper background for sticky to work */
table.t tbody tr{background:var(--bg,#0d1117);}
table.t tbody tr:nth-child(even){background:var(--card,#161b22);}
body.light table.t tbody tr{background:var(--bg,#fff);}
body.light table.t tbody tr:nth-child(even){background:var(--card,#f6f8fa);}
table.t tbody tr:hover{background:rgba(88,166,255,0.06);}
body.light table.t tbody tr:hover{background:rgba(88,166,255,0.08);}

/* ── UNIVERSAL BUTTON FEEDBACK ── */
/* Ensure all interactive buttons have pointer cursor and active feedback */
button,.export-btn,.section-tab,.tab,.btn,.btn-sm,.nav-more-btn,.page-btn,.ex-btn,
.take-trade-btn,.at-btn,.pos-remove,.pf-remove-btn,.chart-tf-btn,.recent-chip,
.sort-toggle-btn,.view-toggle button,.col-picker-btn,.ai-refresh-btn,.refresh-btn,
[onclick]{cursor:pointer;}
button:active,.export-btn:active,.section-tab:active,.page-btn:active,.ex-btn:active,
.take-trade-btn:active,.at-btn:active,.sort-toggle-btn:active,.chart-tf-btn:active,
.recent-chip:active,.ai-refresh-btn:active,[onclick]:active{transform:scale(0.97);}

/* ── ACTION SUMMARY CARD ── */
.action-summary{background:linear-gradient(135deg,rgba(88,166,255,0.08),rgba(0,212,170,0.05));border:1px solid var(--border);border-radius:var(--radius-lg, 14px);padding:20px;margin-bottom:20px;text-align:center;}
.as-title{font-size:var(--fs-sm, 0.82rem);text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);font-weight:700;margin-bottom:12px;}
.as-grid{display:flex;gap:16px;justify-content:center;margin-bottom:12px;flex-wrap:wrap;}
.as-stat{padding:10px 20px;border-radius:8px;font-weight:700;}
.as-buy{background:rgba(63,185,80,0.12);color:var(--green,#3fb950);}
.as-sell{background:rgba(248,81,73,0.12);color:var(--red,#f85149);}
.as-hold{background:rgba(139,148,158,0.12);color:var(--muted);}
.as-count{font-size:1.4rem;display:block;}
.as-top-pick{font-size:var(--fs-base, 0.92rem);color:var(--text);font-weight:600;}
.as-top-pick span{color:var(--accent,#58a6ff);font-weight:800;}
body.light .action-summary{background:linear-gradient(135deg,rgba(9,105,218,0.06),rgba(0,212,170,0.04));border-color:#d0d7de;}
body.light .as-buy{background:rgba(26,127,55,0.1);color:#1a7f37;}
body.light .as-sell{background:rgba(207,34,46,0.1);color:#cf222e;}
body.light .as-hold{background:rgba(89,99,110,0.08);color:#59636e;}
@media(max-width:480px){.as-grid{gap:8px;}.as-stat{padding:8px 14px;}.as-count{font-size:1.1rem;}}

/* ── WATCHLIST DRAWER ── */
.watchlist-drawer{position:fixed;top:0;right:0;width:380px;height:100vh;background:var(--card,#0d1117);border-left:1px solid var(--border);z-index:9999;transition:transform var(--dur-slow, 0.3s) ease;overflow-y:auto;padding:20px;filter:drop-shadow(-4px 0 10px rgba(0,0,0,0.3));transform:translateX(100%);will-change:transform;}
.watchlist-drawer.open{transform:translateX(0);}
.watchlist-drawer .wd-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;}
.watchlist-drawer .wd-title{font-size:1.1rem;font-weight:800;}
.watchlist-drawer .wd-close{background:none;border:none;color:var(--muted);font-size:1.4rem;cursor:pointer;transition:color var(--dur, 0.2s);}
.watchlist-drawer .wd-close:hover{color:var(--text);}
.watchlist-drawer .wd-item{display:flex;justify-content:space-between;align-items:center;padding:12px;border-bottom:1px solid var(--border);cursor:pointer;transition:background var(--dur, 0.2s);}
.watchlist-drawer .wd-item:hover{background:rgba(88,166,255,0.06);}
.wd-ticker{font-weight:800;font-size:var(--fs-base, 0.92rem);}
.wd-score{font-weight:700;font-size:0.88rem;}
.wd-signal{font-size:0.75rem;padding:2px 8px;border-radius:4px;font-weight:700;text-align:center;margin-top:3px;}
.wd-remove{background:none;border:none;color:var(--red,#f85149);cursor:pointer;font-size:var(--fs-base, 0.92rem);opacity:0.5;transition:opacity var(--dur, 0.2s);}
.wd-remove:hover{opacity:1;}
body.light .watchlist-drawer{background:#fff;border-left-color:#d0d7de;}
@media(max-width:480px){.watchlist-drawer{width:100%;}}

/* ── RISK CALC DISPLAY ── */
.risk-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:16px 0;}
.risk-metric-card{background:rgba(88,166,255,0.04);border:1px solid var(--border);border-radius:8px;padding:12px;text-align:center;}
.risk-metric-card .rm-label{font-size:var(--fs-xs, 0.72rem);text-transform:uppercase;letter-spacing:0.8px;color:var(--muted);margin-bottom:6px;}
.risk-metric-card .rm-val{font-size:1.2rem;font-weight:800;}
.risk-metric-card .rm-grade{font-size:0.68rem;font-weight:600;margin-top:4px;}

/* ══════════════════════════════════════════════════════════════
   SENTIMENT WIDGET (TH-4)
   ══════════════════════════════════════════════════════════════ */
.sentiment-widget{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg, 14px);padding:20px;margin-bottom:20px;position:relative;overflow:hidden;}
.sentiment-widget::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--red),var(--yellow),var(--green));}
.sentiment-widget h3{font-size:0.78rem;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);margin-bottom:16px;display:flex;align-items:center;gap:8px;}
.sentiment-widget h3 .sw-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);animation:swPulse 2s ease infinite;}
@keyframes swPulse{0%,100%{opacity:1;box-shadow:0 0 4px var(--accent);}50%{opacity:0.5;box-shadow:0 0 12px var(--accent);}}
.sw-grid{display:grid;grid-template-columns:200px 1fr 1fr;gap:16px;align-items:start;}
@media(max-width:900px){.sw-grid{grid-template-columns:1fr;}}

/* Fear/Greed Gauge */
.fear-greed-gauge{position:relative;width:180px;height:100px;margin:0 auto;}
.fear-greed-gauge .fg-arc{width:180px;height:90px;border-radius:90px 90px 0 0;background:conic-gradient(from 0.75turn,var(--red) 0%,var(--yellow) 25%,var(--green) 50%);overflow:hidden;position:relative;}
.fear-greed-gauge .fg-arc::after{content:'';position:absolute;bottom:0;left:10%;width:80%;height:80%;background:var(--card);border-radius:100px 100px 0 0;}
.fear-greed-gauge .fg-needle{position:absolute;bottom:0;left:50%;width:3px;height:75px;background:var(--accent);transform-origin:bottom center;border-radius:2px;transition:transform 0.8s cubic-bezier(0.4,0,0.2,1);z-index:2;}
.fear-greed-gauge .fg-value{position:absolute;bottom:4px;left:50%;transform:translateX(-50%);font-size:1.5rem;font-weight:800;z-index:3;}
.fear-greed-gauge .fg-labels{display:flex;justify-content:space-between;font-size:0.65rem;color:var(--muted);margin-top:4px;padding:0 4px;}
.fear-greed-gauge .fg-label-text{text-align:center;font-size:var(--fs-sm, 0.82rem);font-weight:600;margin-top:6px;color:var(--text);}

/* News Storm Alert */
.news-storm-alert{display:none;padding:10px 14px;background:rgba(210,153,34,0.12);border:1px solid rgba(210,153,34,0.3);border-radius:8px;margin-bottom:12px;font-size:var(--fs-sm, 0.82rem);color:var(--yellow);font-weight:600;animation:stormPulse 1.5s ease infinite;}
.news-storm-alert.active{display:flex;align-items:center;gap:8px;}
@keyframes stormPulse{0%,100%{border-color:rgba(210,153,34,0.3);}50%{border-color:rgba(210,153,34,0.7);box-shadow:0 0 12px rgba(210,153,34,0.15);}}

/* AI vs Lexicon Agreement */
.sw-agreement{display:flex;align-items:center;gap:6px;font-size:0.78rem;padding:6px 10px;border-radius:var(--radius-sm, 6px);font-weight:600;}
.sw-agreement.agree{background:rgba(63,185,80,0.1);color:var(--green);border:1px solid rgba(63,185,80,0.2);}
.sw-agreement.diverge{background:rgba(210,153,34,0.1);color:var(--yellow);border:1px solid rgba(210,153,34,0.2);}

/* Sentiment Sparkline */
.sentiment-sparkline{display:flex;align-items:flex-end;gap:2px;height:40px;margin:8px 0;}
.sentiment-sparkline .spark-bar{flex:1;min-width:4px;max-width:10px;border-radius:2px 2px 0 0;transition:height var(--dur-slow, 0.3s) ease;cursor:default;position:relative;}
.sentiment-sparkline .spark-bar:hover{opacity:0.8;}
.sentiment-sparkline .spark-bar:hover::after{content:attr(data-val);position:absolute;bottom:calc(100% + 4px);left:50%;transform:translateX(-50%);background:var(--card);border:1px solid var(--border);padding:2px 6px;border-radius:4px;font-size:0.65rem;white-space:nowrap;z-index:5;}

/* Top Headlines */
.sw-headlines{list-style:none;padding:0;margin:0;}
.sw-headlines li{padding:8px 0;border-bottom:1px solid var(--border);font-size:var(--fs-sm, 0.82rem);line-height:1.4;display:flex;gap:8px;align-items:flex-start;}
.sw-headlines li:last-child{border-bottom:none;}
.sw-headlines .sw-hl-badge{flex-shrink:0;font-size:0.65rem;padding:2px 6px;border-radius:4px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;}
.sw-headlines .sw-hl-score{flex-shrink:0;font-size:var(--fs-xs, 0.72rem);font-weight:700;min-width:32px;text-align:right;}
body.light .sentiment-widget{background:#fff;border-color:#d0d7de;}
body.light .fear-greed-gauge .fg-arc::after{background:#fff;}

/* ══════════════════════════════════════════════════════════════
   CORRELATION MATRIX HEATMAP (TH-5)
   ══════════════════════════════════════════════════════════════ */
.corr-heatmap-wrap{overflow-x:auto;margin:16px 0;}
.corr-heatmap{border-collapse:collapse;font-size:var(--fs-xs, 0.72rem);}
.corr-heatmap th{background:#1c2128;padding:8px 6px;text-align:center;font-size:0.68rem;color:var(--muted);white-space:nowrap;position:sticky;top:0;z-index:1;}
.corr-heatmap td{padding:8px;text-align:center;border:1px solid var(--border);font-weight:700;min-width:54px;font-size:var(--fs-xs, 0.72rem);cursor:default;transition:transform var(--dur-fast, 0.15s),box-shadow var(--dur-fast, 0.15s);position:relative;}
.corr-heatmap td:hover{transform:scale(1.15);z-index:2;box-shadow:0 0 12px rgba(0,0,0,0.4);}
.corr-heatmap .ch-row-header{background:#1c2128;color:var(--muted);font-weight:700;text-align:right;padding-right:10px;position:sticky;left:0;z-index:2;white-space:nowrap;}
body.light .corr-heatmap th,body.light .corr-heatmap .ch-row-header{background:#e6e8eb;}
.corr-period-toggle{display:flex;gap:6px;margin-bottom:14px;}
.corr-period-toggle button{padding:6px 14px;border-radius:var(--radius-sm, 6px);border:1px solid var(--border);background:var(--card);color:var(--muted);font-size:0.78rem;font-weight:600;cursor:pointer;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;}
.corr-period-toggle button.active{background:var(--accent);color:#000;border-color:var(--accent);}
.corr-period-toggle button:hover:not(.active){border-color:var(--accent);color:var(--text);}

/* ══════════════════════════════════════════════════════════════
   TH-8: MOBILE-RESPONSIVE OVERHAUL
   ══════════════════════════════════════════════════════════════ */

/* ── Enhanced Mobile Responsive (768px) ── */
@media(max-width:768px){
  .container{padding:12px;}
  h1{font-size:1.5rem !important;}
  h2{font-size:1.2rem !important;}
  body{font-size:var(--fs-base, 0.92rem);}
  header h1{font-size:1.5rem;}
  header p{font-size:var(--fs-sm, 0.82rem);}

  /* Cross-nav: scrollable, icons-only */
  .cross-nav{padding:8px 12px;overflow:visible;flex-wrap:nowrap;}
  .cross-nav .nav-links{scrollbar-width:none;-ms-overflow-style:none;}

  /* Stat cards: 2-col tablet */
  .stat-grid{grid-template-columns:repeat(2, 1fr);gap:10px;}

  /* Signal cards & price tables: full width single column */
  .signal-card{width:100%;}
  .price-table,.table.t{width:100%;}
  .pattern-grid,.res-grid,.resource-grid{grid-template-columns:1fr;}

  /* Data tables: horizontal scroll wrapper */
  .table-scroll-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius-md, 10px);margin-bottom:16px;}
  .table-scroll-wrapper table{min-width:600px;}
  .table-scroll-wrapper::-webkit-scrollbar{height:4px;}
  .table-scroll-wrapper::-webkit-scrollbar-thumb{background:var(--accent);border-radius:2px;}

  /* Tabs: horizontal scroll, smaller */
  .tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:5px;justify-content:flex-start;padding-bottom:4px;scrollbar-width:none;}
  .tabs::-webkit-scrollbar{display:none;}
  .tab{font-size:var(--fs-sm, 0.82rem);padding:8px 12px;white-space:nowrap;flex-shrink:0;}

  /* Entry/Exit blocks: stack vertically */
  .ee-block{display:flex;flex-direction:column;gap:6px;}

  /* Cards: reduce padding */
  .card{padding:16px;border-radius:var(--radius-lg, 14px);}
  .signal-card{padding:14px;border-radius:var(--radius-lg, 14px);}

  /* Modal/overlay: full screen */
  .search-overlay .search-box{width:96%;max-width:100%;}
  .kb-content{max-width:96%;padding:20px;}
  .compare-overlay{padding:10px;}
  .compare-popup{max-width:100%;border-radius:var(--radius-lg, 14px);padding:16px;max-height:90vh;}
  .cmd-box{width:96%;max-width:100%;}
  .watchlist-drawer{width:100%;}

  /* Sentiment widget responsive */
  .sw-grid{grid-template-columns:1fr !important;}
  .fear-greed-gauge{margin:0 auto 12px;}

  /* Correlation heatmap scroll */
  .corr-heatmap-wrap{margin:8px 0;}

  /* Filter bar: stack */
  .filter-bar{flex-direction:column;gap:8px;}
  .filter-bar input,.filter-bar select{width:100%;min-width:unset;}

  /* Export bar: stack */
  .export-bar{flex-direction:column;gap:6px;}
  .btn-sm{width:100%;text-align:center;}

  /* Scroll-top button above mobile nav — staggered to avoid FAB overlap */
  .scroll-top-btn{bottom:128px;right:16px;width:40px;height:40px;font-size:1.1rem;}
  .refresh-btn{bottom:184px;right:16px;width:40px;height:40px;}

  /* Portfolio heat badge */
  .portfolio-heat-badge{bottom:80px;left:12px;}
}

/* ── Phone-specific (480px) ── */
@media(max-width:480px){
  .container{padding:10px;}
  h1{font-size:1.3rem !important;}
  h2{font-size:1.1rem !important;}
  body{font-size:var(--fs-sm, 0.82rem);}
  .stat-grid{grid-template-columns:1fr 1fr;gap:8px;}
  .stat-card{padding:12px;}
  .stat-card .value{font-size:1.15rem;}
  .stat-card .label{font-size:0.68rem;}
  .card{padding:14px;border-radius:var(--radius-md, 10px);}
  .tab{font-size:0.78rem;padding:7px 10px;}
  .signal-card{padding:12px;}
  .as-grid{gap:6px;}
  .as-stat{padding:6px 12px;}
  .as-count{font-size:var(--fs-md, 1.05rem);}
  header{padding:16px 0 12px;margin-bottom:16px;}
}

/* ── Enhanced Mobile Bottom Nav (TH-8) ── */
/* NOTE: Base .mobile-bottom-nav is above (line ~334). Only add enhancements here. */
.mobile-bottom-nav a{position:relative;}
.mobile-bottom-nav a.active::before{content:'';position:absolute;top:-4px;left:25%;right:25%;height:2px;background:var(--accent);border-radius:1px;}
.mobile-bottom-nav a .nav-icon{line-height:1;}
.mobile-bottom-nav a:active{transform:scale(0.92);}

/* ══════════════════════════════════════════════════════════════
   TH-9: WATCHLIST ENHANCEMENTS
   ══════════════════════════════════════════════════════════════ */

/* ── Export & Share Buttons ── */
.wl-export-btn,.wl-share-btn{display:inline-flex;align-items:center;gap:4px;padding:5px 12px;border-radius:var(--radius-sm, 6px);border:1px solid var(--border);background:var(--card);color:var(--muted);font-size:0.75rem;font-weight:600;cursor:pointer;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;}
.wl-export-btn:hover,.wl-share-btn:hover{border-color:var(--accent);color:var(--accent);box-shadow:0 0 10px rgba(0,212,170,0.12);}
.wl-export-btn:active,.wl-share-btn:active{transform:scale(0.97);}

/* ── Share Button on Signal Cards ── */
.signal-share-btn{position:absolute;top:10px;right:10px;background:none;border:1px solid var(--border);color:var(--muted);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:0.75rem;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;z-index:5;}
.signal-share-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(0,212,170,0.08);}

/* ── Shared Signal Banner ── */
.shared-signal-banner{background:linear-gradient(135deg,rgba(88,166,255,0.1),rgba(0,212,170,0.08));border:1px solid rgba(88,166,255,0.3);border-radius:var(--radius-lg, 14px);padding:20px;margin-bottom:20px;text-align:center;animation:fadeIn 0.4s ease;}
.shared-signal-banner h3{color:var(--accent);font-size:var(--fs-md, 1.05rem);margin-bottom:8px;}
.shared-signal-banner .ssb-score{font-size:2rem;font-weight:800;margin:8px 0;}
.shared-signal-banner .ssb-meta{font-size:var(--fs-sm, 0.82rem);color:var(--muted);}
.shared-signal-banner .ssb-factors{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:10px;}
.shared-signal-banner .ssb-factor{padding:4px 10px;background:rgba(139,148,158,0.08);border-radius:var(--radius-sm, 6px);font-size:0.75rem;color:var(--text);}

/* ── Alert Bell & Badge ── */
.alert-bell-btn{background:none;border:1px solid var(--border);color:var(--muted);width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:var(--fs-sm, 0.82rem);transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;position:relative;}
.alert-bell-btn:hover{border-color:var(--accent);color:var(--accent);}
.alert-bell-btn .alert-count{position:absolute;top:-4px;right:-4px;background:var(--red);color:#fff;font-size:0.55rem;font-weight:800;min-width:14px;height:14px;border-radius:7px;display:flex;align-items:center;justify-content:center;padding:0 3px;}

/* ── Alert Form Popover ── */
.alert-form-popover{position:absolute;top:100%;right:0;z-index:100;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);padding:14px;min-width:220px;box-shadow:0 8px 24px rgba(0,0,0,0.4);display:none;animation:fadeIn 0.2s ease;}
.alert-form-popover.open{display:block;}
.alert-form-popover label{display:block;font-size:0.75rem;color:var(--muted);margin-bottom:4px;font-weight:600;}
.alert-form-popover input,.alert-form-popover select{width:100%;padding:8px 10px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm, 6px);color:var(--text);font-size:var(--fs-sm, 0.82rem);margin-bottom:8px;}
.alert-form-popover input:focus,.alert-form-popover select:focus{outline:none;border-color:var(--accent);}
.alert-form-popover .afp-submit{width:100%;padding:8px;background:linear-gradient(135deg,var(--accent),#00a080);color:#000;border:none;border-radius:var(--radius-sm, 6px);font-weight:700;font-size:var(--fs-sm, 0.82rem);cursor:pointer;}
.alert-form-popover .afp-submit:hover{opacity:0.9;}
body.light .alert-form-popover{background:#fff;box-shadow:0 8px 24px rgba(0,0,0,0.12);}

/* ── Active Alerts Panel ── */
.alerts-panel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg, 14px);margin-bottom:20px;overflow:hidden;}
.alerts-panel-header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;cursor:pointer;transition:background var(--dur, 0.2s);}
.alerts-panel-header:hover{background:rgba(0,212,170,0.04);}
.alerts-panel-header h3{font-size:var(--fs-sm, 0.82rem);text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:0;display:flex;align-items:center;gap:8px;}
.alerts-panel-header .ap-toggle{color:var(--muted);font-size:var(--fs-sm, 0.82rem);transition:transform var(--dur-slow, 0.3s);}
.alerts-panel-header .ap-toggle.open{transform:rotate(180deg);}
.alerts-panel-body{max-height:0;overflow:hidden;transition:max-height var(--dur-slow, 0.3s) ease;}
.alerts-panel-body.open{max-height:600px;}
.alerts-panel-body .ap-item{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-top:1px solid var(--border);font-size:var(--fs-sm, 0.82rem);}
.alerts-panel-body .ap-item .ap-ticker{font-weight:700;}
.alerts-panel-body .ap-item .ap-target{color:var(--muted);}
.alerts-panel-body .ap-item .ap-dir{font-size:var(--fs-xs, 0.72rem);padding:2px 6px;border-radius:4px;font-weight:600;}
.alerts-panel-body .ap-item .ap-dir.above{background:rgba(63,185,80,0.12);color:var(--green);}
.alerts-panel-body .ap-item .ap-dir.below{background:rgba(248,81,73,0.12);color:var(--red);}
.alerts-panel-body .ap-item .ap-triggered{color:var(--yellow);font-weight:700;font-size:var(--fs-xs, 0.72rem);}
.alerts-panel-body .ap-remove{background:none;border:none;color:var(--red);cursor:pointer;font-size:var(--fs-base, 0.92rem);opacity:0.5;transition:opacity var(--dur, 0.2s);}
.alerts-panel-body .ap-remove:hover{opacity:1;}
body.light .alerts-panel{background:#fff;border-color:#d0d7de;}

/* ══════════════════════════════════════════════════════════════
   TH-10: PERFORMANCE OPTIMIZATION
   ══════════════════════════════════════════════════════════════ */

/* ── Enhanced Skeleton Loading ── */
.skeleton-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);padding:20px;margin-bottom:14px;}
.skeleton-line{height:14px;border-radius:4px;margin-bottom:10px;background:linear-gradient(90deg,var(--card) 25%,rgba(139,148,158,0.1) 50%,var(--card) 75%);background-size:200% 100%;animation:shimmer 1.5s ease infinite;}
.skeleton-line.short{width:40%;}
.skeleton-line.medium{width:65%;}
.skeleton-line.long{width:90%;}
.skeleton-line.full{width:100%;}
.skeleton-circle{width:56px;height:56px;border-radius:50%;margin:8px auto;background:linear-gradient(90deg,var(--card) 25%,rgba(139,148,158,0.1) 50%,var(--card) 75%);background-size:200% 100%;animation:shimmer 1.5s ease infinite;}
.skeleton-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);padding:16px;text-align:center;}
.skeleton-stat .skeleton-line{margin:6px auto;}
.skeleton-row{display:flex;gap:14px;margin-bottom:14px;}
.skeleton-row .skeleton-stat{flex:1;}
.skeleton-table{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);overflow:hidden;margin-bottom:20px;}
.skeleton-table-header{background:rgba(139,148,158,0.06);padding:12px 14px;display:flex;gap:20px;}
.skeleton-table-header .skeleton-line{margin:0;height:12px;}
.skeleton-table-row{padding:12px 14px;border-top:1px solid var(--border);display:flex;gap:20px;}
.skeleton-table-row .skeleton-line{margin:0;height:12px;}

/* ── Progressive Load Fade Transition ── */
.data-fresh-transition{animation:dataFadeIn 0.4s ease forwards;}
@keyframes dataFadeIn{from{opacity:0.6;}to{opacity:1;}}

/* Light mode skeleton adjustments */
body.light .skeleton-card,body.light .skeleton-stat,body.light .skeleton-table{background:#fff;border-color:#d0d7de;}
body.light .skeleton-line{background:linear-gradient(90deg,#fff 25%,#f0f2f5 50%,#fff 75%);background-size:200% 100%;}

/* === Typed Skeleton Loaders === */
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.skeleton-stat-card{display:flex;flex-direction:column;gap:8px;padding:16px;border-radius:var(--radius-md, 10px);background:var(--card, #161b22);border:1px solid var(--border, rgba(255,255,255,0.06))}
.skeleton-stat-card .skeleton-line{height:12px;border-radius:4px;background:linear-gradient(90deg,rgba(255,255,255,0.04) 25%,rgba(255,255,255,0.08) 50%,rgba(255,255,255,0.04) 75%);background-size:200% 100%;animation:shimmer 2s infinite}
.skeleton-stat-card .skeleton-line.w-40{width:40%}
.skeleton-stat-card .skeleton-line.w-60{width:60%}
.skeleton-stat-card .skeleton-line.w-80{width:80%}
.skeleton-stat-card .skeleton-value{height:28px;width:50%;border-radius:4px;background:linear-gradient(90deg,rgba(255,255,255,0.04) 25%,rgba(255,255,255,0.08) 50%,rgba(255,255,255,0.04) 75%);background-size:200% 100%;animation:shimmer 2s infinite;margin:4px 0}

.skeleton-signal-card{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:var(--radius-md, 10px);background:var(--card, #161b22);border:1px solid var(--border, rgba(255,255,255,0.06))}
.skeleton-signal-card .skeleton-avatar{width:36px;height:36px;border-radius:50%;flex-shrink:0;background:linear-gradient(90deg,rgba(255,255,255,0.04) 25%,rgba(255,255,255,0.08) 50%,rgba(255,255,255,0.04) 75%);background-size:200% 100%;animation:shimmer 2s infinite}
.skeleton-signal-card .skeleton-content{flex:1;display:flex;flex-direction:column;gap:6px}
.skeleton-signal-card .skeleton-line{height:10px;border-radius:3px;background:linear-gradient(90deg,rgba(255,255,255,0.04) 25%,rgba(255,255,255,0.08) 50%,rgba(255,255,255,0.04) 75%);background-size:200% 100%;animation:shimmer 2s infinite}
.skeleton-signal-card .skeleton-score{width:44px;height:44px;border-radius:50%;flex-shrink:0;background:linear-gradient(90deg,rgba(255,255,255,0.04) 25%,rgba(255,255,255,0.08) 50%,rgba(255,255,255,0.04) 75%);background-size:200% 100%;animation:shimmer 2s infinite}

.skeleton-table-row{display:flex;gap:16px;padding:10px 16px;border-bottom:1px solid var(--border, rgba(255,255,255,0.06))}
.skeleton-table-row .skeleton-cell{height:14px;border-radius:3px;background:linear-gradient(90deg,rgba(255,255,255,0.04) 25%,rgba(255,255,255,0.08) 50%,rgba(255,255,255,0.04) 75%);background-size:200% 100%;animation:shimmer 2s infinite}
.skeleton-table-row .skeleton-cell:nth-child(1){width:15%}
.skeleton-table-row .skeleton-cell:nth-child(2){width:25%}
.skeleton-table-row .skeleton-cell:nth-child(3){width:20%}
.skeleton-table-row .skeleton-cell:nth-child(4){width:15%}
.skeleton-table-row .skeleton-cell:nth-child(5){flex:1}

/* Light mode typed skeleton adjustments */
body.light .skeleton-stat-card,body.light .skeleton-signal-card{background:#fff;border-color:#d0d7de;}
body.light .skeleton-stat-card .skeleton-line,body.light .skeleton-stat-card .skeleton-value,body.light .skeleton-signal-card .skeleton-avatar,body.light .skeleton-signal-card .skeleton-line,body.light .skeleton-signal-card .skeleton-score,body.light .skeleton-table-row .skeleton-cell{background:linear-gradient(90deg,#fff 25%,#f0f2f5 50%,#fff 75%);background-size:200% 100%;animation:shimmer 2s infinite}

/* ── SHARED PLATFORM DISCLAIMER ── */
.platform-disclaimer{max-width:800px;margin:40px auto 20px;padding:16px 20px;border-top:1px solid var(--border);color:var(--muted);font-size:0.75rem;line-height:1.6;text-align:center;}
.platform-disclaimer .disclaimer-source{font-size:var(--fs-xs, 0.72rem);margin-top:8px;opacity:0.7;}
body.light .platform-disclaimer{color:#57606a;border-top-color:#d0d7de;}

/* ── TRADE SETUP ENGINE CARDS ── */
.tse-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg, 14px);overflow:hidden;margin:12px 0;}
.tse-card.tse-neutral{padding:16px;}
.tse-header{display:flex;align-items:center;gap:10px;padding:14px 18px;background:rgba(139,148,158,0.04);border-bottom:1px solid var(--border);}
.tse-grade{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;font-weight:900;font-size:0.88rem;color:#fff;flex-shrink:0;}
.tse-grade-sm{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:4px;font-weight:900;font-size:0.65rem;color:#fff;vertical-align:middle;}
.tse-hdr-info{flex:1;}
.tse-direction{font-weight:800;font-size:var(--fs-md, 1.05rem);}
.tse-grade-label{display:block;font-size:0.75rem;color:var(--muted);margin-top:2px;}
.tse-rr-badge{font-weight:800;font-size:var(--fs-sm, 0.82rem);flex-shrink:0;}
.tse-section{padding:12px 18px;border-bottom:1px solid var(--border);}
.tse-section:last-child{border-bottom:none;}
.tse-section-title{font-size:0.78rem;font-weight:800;letter-spacing:0.5px;text-transform:uppercase;margin-bottom:8px;color:var(--accent);}
.tse-entry .tse-section-title{color:var(--green);}
.tse-exit .tse-section-title{color:var(--red);}
.tse-row{display:flex;justify-content:space-between;align-items:baseline;padding:3px 0;font-size:var(--fs-sm, 0.82rem);}
.tse-label{color:var(--muted);font-weight:600;min-width:110px;}
.tse-val{font-weight:700;text-align:right;}
.tse-stop-row{padding:6px 0;margin:4px 0;background:rgba(248,81,73,0.06);border-radius:var(--radius-sm, 6px);padding-left:8px;padding-right:8px;}
.tse-confirmations{margin-top:8px;padding:8px 10px;background:rgba(139,148,158,0.04);border-radius:8px;}
.tse-confirm-item{font-size:0.78rem;padding:3px 0;line-height:1.5;color:var(--muted);}
.tse-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:10px;text-align:center;}
.tse-metric{padding:8px 4px;}
.tse-metric-val{font-size:var(--fs-md, 1.05rem);font-weight:800;color:var(--text);}
.tse-metric-label{font-size:0.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.5px;margin-top:2px;}
.tse-invalidation{padding:10px 18px;}
body.light .tse-card{background:#fff;border-color:#d0d7de;}
body.light .tse-header{background:rgba(0,0,0,0.02);}
body.light .tse-stop-row{background:rgba(248,81,73,0.04);}
body.light .tse-confirmations{background:rgba(0,0,0,0.02);}
@media(max-width:600px){.tse-metrics{grid-template-columns:repeat(3,1fr);}.tse-row{flex-direction:column;gap:2px;}.tse-val{text-align:left;}}

/* ── AI COMMENTARY PANEL ── */
.ai-commentary-panel{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08);border-radius:var(--radius-lg, 14px);padding:16px 20px;margin:12px 0;}
.ai-commentary-panel .commentary-header{display:flex;align-items:center;gap:12px;margin-bottom:8px;}
.ai-commentary-panel .commentary-score{font-size:2em;font-weight:700;}
.ai-commentary-panel .commentary-label{font-size:var(--fs-sm, 0.82rem);color:var(--muted);text-transform:uppercase;letter-spacing:0.5px;}
.ai-commentary-panel .commentary-regime{font-size:0.75rem;padding:3px 10px;border-radius:20px;background:rgba(255,255,255,0.06);color:var(--muted);display:inline-block;margin-left:auto;}
.ai-commentary-panel .commentary-text{color:rgba(255,255,255,0.8);line-height:1.6;margin:8px 0;font-size:var(--fs-base, 0.92rem);}
.ai-commentary-panel .bull-bear-bar{height:6px;border-radius:3px;background:linear-gradient(to right,#3fb950 var(--bull-pct),#f85149 var(--bull-pct));margin:10px 0;}
.ai-commentary-panel .bull-bear-labels{display:flex;justify-content:space-between;font-size:0.75rem;color:var(--muted);}
.ai-commentary-panel .top-factors{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;}
.ai-commentary-panel .top-factors .factor-chip{font-size:0.75rem;padding:3px 10px;border-radius:20px;background:rgba(255,255,255,0.06);color:var(--text);}
.ai-commentary-panel .factor-chip.bullish{background:rgba(63,185,80,0.12);color:var(--green);}
.ai-commentary-panel .factor-chip.bearish{background:rgba(248,81,73,0.12);color:var(--red);}
.ai-commentary-panel .commentary-loading{color:var(--muted);font-size:var(--fs-sm, 0.82rem);padding:8px 0;}
body.light .ai-commentary-panel{background:rgba(0,0,0,0.02);border-color:rgba(0,0,0,0.08);}
body.light .ai-commentary-panel .commentary-text{color:rgba(0,0,0,0.7);}
body.light .ai-commentary-panel .commentary-regime,body.light .ai-commentary-panel .factor-chip{background:rgba(0,0,0,0.04);}
body.light .ai-commentary-panel .factor-chip.bullish{background:rgba(26,127,55,0.1);color:var(--green);}
body.light .ai-commentary-panel .factor-chip.bearish{background:rgba(207,34,46,0.1);color:var(--red);}

/* ═══════════════════════════════════════════════════════════════════
   CONSOLIDATED FROM INLINE STYLES — extracted from 11-28 HTML files
   ═══════════════════════════════════════════════════════════════════ */

/* ── PORTFOLIO TRACKER (.pos-*) ── */
/* Used by: stocks, bonds, etfs, forex, commodities, leveraged-etfs, options, mutual-funds, reits, private-re, alternatives, international-stocks, european-stocks, global-markets, oil-dashboard */
.pos-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:20px;}
.pos-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:20px;padding:16px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);}
.pos-form .field{display:flex;flex-direction:column;gap:4px;}
.pos-form .field label{font-size:0.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.5px;}
.pos-form .field select,.pos-form .field input{background:#1c2128;border:1px solid var(--border);border-radius:var(--radius-sm, 6px);padding:7px 11px;color:#fff;font-size:0.88rem;}
.pos-form .field input:focus,.pos-form .field select:focus{outline:none;border-color:var(--accent);}
.pos-remove{background:var(--red);color:#fff;border:none;border-radius:4px;padding:4px 10px;cursor:pointer;font-size:0.78rem;font-weight:700;}
.pos-remove:hover{opacity:0.8;}

/* ── GAUGE CHART (.gauge-*) ── */
/* Used by: bonds, etfs, forex, options, commodities, leveraged-etfs, mutual-funds, macro, ai-insights, multi-asset, highlight, private-re */
.gauge-wrap{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:24px;}
.gauge-container{width:200px;height:120px;position:relative;margin:0 auto 16px;}
.gauge-bg{width:200px;height:100px;border-radius:100px 100px 0 0;background:conic-gradient(from 0.75turn, var(--red) 0%, var(--yellow) 25%, var(--green) 50%);overflow:hidden;position:relative;}
.gauge-bg::after{content:'';position:absolute;bottom:0;left:10%;width:80%;height:80%;background:var(--bg);border-radius:100px 100px 0 0;}
.gauge-needle{position:absolute;bottom:0;left:50%;width:3px;height:85px;background:var(--accent);transform-origin:bottom center;border-radius:2px;transition:transform 0.8s ease;}
.gauge-value{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);font-size:1.8rem;font-weight:800;color:#fff;}
.gauge-labels{display:flex;justify-content:space-between;font-size:var(--fs-xs, 0.72rem);color:var(--muted);margin-top:4px;}
.gauge-label{font-size:var(--fs-md, 1.05rem);font-weight:600;margin-top:4px;}

/* ── CALCULATOR (.calc-*) ── */
/* Used by: bonds, etfs, forex, leveraged-etfs, options, mutual-funds, highlight */
.calc-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);padding:24px;margin-bottom:20px;}
.calc-card h3{color:var(--accent);margin-bottom:16px;}
.calc-row{display:flex;gap:12px;margin-bottom:10px;align-items:center;flex-wrap:wrap;}
.calc-row label{width:140px;color:var(--muted);font-size:0.88rem;flex-shrink:0;}
.calc-row input,.calc-row select{flex:1;min-width:120px;background:#1c2128;border:1px solid var(--border);border-radius:8px;padding:9px 14px;color:#fff;font-size:var(--fs-base, 0.92rem);}
.calc-row input:focus{outline:none;border-color:var(--accent);}
.calc-result{margin-top:16px;padding:16px;background:rgba(0,212,170,0.06);border:1px solid rgba(0,212,170,0.2);border-radius:8px;}
.calc-result .cr-label{font-size:0.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:1px;}
.calc-result .cr-val{font-size:1.3rem;font-weight:700;color:var(--accent);margin-top:4px;}

/* ── PAIR CARDS (.pair-*) ── */
/* Used by: bonds, etfs, forex, leveraged-etfs, mutual-funds, international-stocks, european-stocks */
.pair-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-bottom:24px;}
.pair-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md, 10px);padding:18px;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;}
.pair-card:hover{border-color:var(--accent);transform:translateY(-2px);}
.pair-card .pc-pair{font-size:1.1rem;font-weight:700;color:#fff;margin-bottom:4px;}
.pair-card .pc-name{font-size:0.78rem;color:var(--muted);margin-bottom:10px;}
.pair-card .pc-price{font-size:1.4rem;font-weight:800;color:var(--accent);margin-bottom:6px;}
.pair-card .pc-change{font-size:var(--fs-base, 0.92rem);font-weight:600;}
.pair-card .pc-meta{display:flex;gap:12px;margin-top:10px;font-size:0.78rem;color:var(--muted);}

/* ── CONSOLIDATED LIGHT MODE (from inline styles) ── */
/* These were duplicated across 5-28 HTML files each */
body.light .price-table td strong{color:#1f2328;}
body.light .pos-form .field input,body.light .pos-form .field select{background:#f0f2f5;color:#24292f;border-color:#d0d7de;}
body.light .calc-row input,body.light .calc-row select{background:#f0f2f5;color:#24292f;border-color:#d0d7de;}
body.light .calc-card{background:#fff;border-color:#d0d7de;}
body.light .calc-result{background:#f0f2f5;color:#1f2328;}

/* ── CONSOLIDATED RESPONSIVE (from inline styles) ── */
@media(max-width:768px){
  .pair-grid{grid-template-columns:1fr;}
  .calc-row{flex-direction:column;}
  .calc-row label{width:100%;}
  .pos-form{flex-direction:column;}
}

/* ═══════════════════════════════════════════════════════════════════
   POLISH PASS — design tokens, new components, mobile sweep (2026-04-12)
   ═══════════════════════════════════════════════════════════════════ */

/* ── DESIGN TOKENS ── */
:root{
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;
  --radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-pill:999px;
  --shadow-1:0 1px 2px rgba(0,0,0,.2);
  --shadow-2:0 4px 8px rgba(0,0,0,.25);
  --shadow-3:0 10px 24px rgba(0,0,0,.35);
  --shadow-glow:0 0 0 1px rgba(0,212,170,.25),0 4px 20px rgba(0,212,170,.18);
  --fs-xs:0.72rem;--fs-sm:0.82rem;--fs-base:0.92rem;--fs-md:1.05rem;--fs-lg:1.25rem;--fs-xl:1.6rem;--fs-2xl:2rem;
  --dur-fast:0.15s;--dur:0.25s;--dur-slow:0.4s;
}
body.light{--shadow-1:0 1px 2px rgba(0,0,0,.06);--shadow-2:0 4px 10px rgba(0,0,0,.08);--shadow-3:0 10px 24px rgba(0,0,0,.12);--shadow-glow:0 0 0 1px rgba(0,184,148,.2),0 4px 20px rgba(0,184,148,.12);}

/* Reduced motion respect */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
}

/* Stronger focus ring for a11y across all interactive surfaces */
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[role="button"]:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-sm, 6px);}

/* ── EMPTY / ERROR STATES ── */
.empty-state,.error-state{padding:40px 24px;text-align:center;background:var(--card);border:1px solid var(--border,rgba(255,255,255,0.08));border-radius:var(--radius-md);color:var(--muted);margin:18px 0;}
.empty-state .es-icon,.error-state .es-icon{font-size:2rem;margin-bottom:10px;opacity:.6;}
.empty-state .es-title,.error-state .es-title{font-size:var(--fs-md, 1.05rem);font-weight:700;color:var(--text);margin-bottom:6px;}
.empty-state .es-sub{font-size:var(--fs-sm, 0.82rem);line-height:1.5;max-width:420px;margin:0 auto 14px;}
.error-state{border-color:rgba(248,81,73,.35);background:rgba(248,81,73,.05);}
.error-state .es-title{color:var(--red);}
.empty-state .es-cta,.error-state .es-cta{display:inline-block;padding:8px 18px;margin-top:8px;background:var(--accent);color:#000;border:none;border-radius:8px;font-weight:700;font-size:var(--fs-sm, 0.82rem);cursor:pointer;}

/* ── INLINE LOADING SPINNER ── */
.spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(139,148,158,.2);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;vertical-align:middle;}
.spinner-lg{width:28px;height:28px;border-width:3px;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ── POSITION-SIZE CHIP (for #22) ── */
.pos-size-chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:var(--radius-pill);background:rgba(0,212,170,.1);border:1px solid rgba(0,212,170,.28);color:var(--accent);font-size:var(--fs-xs, 0.72rem);font-weight:700;letter-spacing:.02em;white-space:nowrap;cursor:help;}
.pos-size-chip::before{content:'📏';font-size:0.75rem;}
.pos-size-chip.warn{background:rgba(210,153,34,.1);border-color:rgba(210,153,34,.3);color:var(--yellow);}
.pos-size-chip.danger{background:rgba(248,81,73,.1);border-color:rgba(248,81,73,.3);color:var(--red);}
body.light .pos-size-chip{background:rgba(0,184,148,.1);color:var(--accent);}

/* ── REGIME TRANSITION BANNER (for #24) ── */
.regime-banner{position:relative;z-index:999;padding:10px 18px;display:flex;align-items:center;gap:12px;font-size:var(--fs-sm, 0.82rem);font-weight:600;background:linear-gradient(90deg,rgba(0,212,170,.14),rgba(88,166,255,.14));border-bottom:1px solid rgba(0,212,170,.35);backdrop-filter:blur(10px);animation:regimeSlideIn .45s ease;}
.regime-banner.risk-on{background:linear-gradient(90deg,rgba(63,185,80,.16),rgba(0,212,170,.14));border-bottom-color:rgba(63,185,80,.4);}
.regime-banner.risk-off{background:linear-gradient(90deg,rgba(248,81,73,.14),rgba(210,153,34,.14));border-bottom-color:rgba(248,81,73,.4);}
.regime-banner.transition{background:linear-gradient(90deg,rgba(210,153,34,.14),rgba(188,140,255,.14));border-bottom-color:rgba(210,153,34,.4);}
.regime-banner .rb-icon{font-size:1.1rem;}
.regime-banner .rb-label{font-weight:800;}
.regime-banner .rb-from{color:var(--muted);}
.regime-banner .rb-arrow{color:var(--muted);margin:0 4px;}
.regime-banner .rb-actions{margin-left:auto;display:flex;gap:8px;}
.regime-banner .rb-btn{padding:4px 12px;background:transparent;color:var(--text);border:1px solid var(--border);border-radius:var(--radius-pill);cursor:pointer;font-size:0.75rem;font-weight:600;}
.regime-banner .rb-btn:hover{border-color:var(--accent);color:var(--accent);}
.regime-banner .rb-dismiss{background:none;border:none;color:var(--muted);cursor:pointer;font-size:1.1rem;padding:0 4px;}
@keyframes regimeSlideIn{from{transform:translateY(-100%);opacity:0;}to{transform:translateY(0);opacity:1;}}

/* ── WATCHLIST PORTFOLIO PANEL (for #25) ── */
.wl-portfolio-panel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px;margin:16px 0;}
.wl-portfolio-panel .wlp-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.wl-portfolio-panel .wlp-title{font-size:var(--fs-md, 1.05rem);font-weight:800;color:var(--text);}
.wl-portfolio-panel .wlp-score{margin-left:auto;font-size:1.4rem;font-weight:800;color:var(--accent);}
.wl-portfolio-panel .wlp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:14px;}
.wl-portfolio-panel .wlp-stat{background:rgba(139,148,158,.04);border-radius:8px;padding:10px 12px;}
.wl-portfolio-panel .wlp-stat-label{font-size:0.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;}
.wl-portfolio-panel .wlp-stat-val{font-size:var(--fs-md, 1.05rem);font-weight:700;color:var(--text);margin-top:3px;}
.wl-portfolio-panel .wlp-suggestions{margin-top:14px;padding-top:12px;border-top:1px solid var(--border);}
.wl-portfolio-panel .wlp-sug-item{font-size:var(--fs-sm, 0.82rem);padding:6px 10px;background:rgba(0,212,170,.06);border-left:3px solid var(--accent);border-radius:var(--radius-sm, 6px);margin-bottom:6px;color:var(--text);}
.wl-portfolio-panel .wlp-sug-item.warn{background:rgba(210,153,34,.06);border-left-color:var(--yellow);}
.wl-portfolio-panel .wlp-sug-item.bad{background:rgba(248,81,73,.06);border-left-color:var(--red);}

/* ── COMPARE MODE (for #23) ── */
.compare-mode-panel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md);padding:18px;margin:16px 0;}
.compare-mode-panel .cmp-header{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap;}
.compare-mode-panel .cmp-input-row{display:flex;gap:6px;flex-wrap:wrap;}
.compare-mode-panel .cmp-input{background:#1c2128;border:1px solid var(--border);border-radius:var(--radius-sm, 6px);padding:7px 10px;color:#fff;font-size:var(--fs-sm, 0.82rem);width:110px;text-transform:uppercase;}
.compare-mode-panel .cmp-add-btn{padding:7px 14px;background:var(--accent);color:#000;border:none;border-radius:var(--radius-sm, 6px);font-weight:700;font-size:var(--fs-sm, 0.82rem);cursor:pointer;}
.compare-mode-panel .cmp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;}
.compare-mode-panel .cmp-col{background:rgba(139,148,158,.04);border:1px solid var(--border);border-radius:var(--radius-md, 10px);padding:14px;position:relative;}
.compare-mode-panel .cmp-col .cmp-remove{position:absolute;top:8px;right:10px;background:none;border:none;color:var(--muted);cursor:pointer;font-size:var(--fs-md, 1.05rem);}
.compare-mode-panel .cmp-ticker{font-size:1.2rem;font-weight:800;color:var(--text);margin-bottom:4px;}
.compare-mode-panel .cmp-price{font-size:1.1rem;font-weight:700;color:var(--accent);margin-bottom:8px;}
.compare-mode-panel .cmp-score{font-size:1.6rem;font-weight:800;color:var(--text);}
.compare-mode-panel .cmp-score-label{font-size:var(--fs-xs, 0.72rem);color:var(--muted);text-transform:uppercase;}
.compare-mode-panel .cmp-row{display:flex;justify-content:space-between;padding:4px 0;font-size:var(--fs-sm, 0.82rem);border-top:1px dashed var(--border);margin-top:4px;}
.compare-mode-panel .cmp-row-label{color:var(--muted);}
.compare-mode-panel .cmp-row-val{color:var(--text);font-weight:600;}
.compare-mode-panel .cmp-winner{border-color:var(--accent);box-shadow:var(--shadow-glow);}
.compare-mode-panel .cmp-winner::before{content:'★ TOP PICK';position:absolute;top:-10px;left:12px;background:var(--accent);color:#000;font-size:0.65rem;padding:2px 8px;border-radius:var(--radius-pill);font-weight:800;}
body.light .compare-mode-panel .cmp-input{background:#f0f2f5;color:#24292f;}

/* ── ONBOARDING MODAL (for #27) ── */
.onb-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(6px);z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeInOverlay .3s ease;}
@keyframes fadeInOverlay{from{opacity:0;}to{opacity:1;}}
.onb-modal{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:28px;max-width:520px;width:100%;max-height:92vh;overflow-y:auto;box-shadow:var(--shadow-3);}
.onb-modal h2{font-size:1.4rem;font-weight:800;color:var(--text);margin-bottom:6px;}
.onb-modal .onb-sub{font-size:var(--fs-base, 0.92rem);color:var(--muted);margin-bottom:18px;line-height:1.5;}
.onb-modal .onb-progress{display:flex;gap:6px;margin-bottom:18px;}
.onb-modal .onb-dot{flex:1;height:4px;background:var(--border);border-radius:2px;transition:background .2s;}
.onb-modal .onb-dot.active{background:var(--accent);}
.onb-modal .onb-dot.done{background:rgba(0,212,170,.4);}
.onb-modal label{display:block;font-size:0.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin:12px 0 6px;}
.onb-modal .onb-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;}
.onb-modal .onb-opt{padding:10px 12px;background:rgba(139,148,158,.04);border:1px solid var(--border);border-radius:8px;color:var(--text);cursor:pointer;font-size:var(--fs-sm, 0.82rem);font-weight:600;text-align:center;transition:background-color var(--dur, 0.2s) ease,border-color var(--dur, 0.2s) ease,color var(--dur, 0.2s) ease,transform var(--dur, 0.2s) ease,box-shadow var(--dur, 0.2s) ease;}
.onb-modal .onb-opt:hover{border-color:var(--accent);}
.onb-modal .onb-opt.selected{background:rgba(0,212,170,.12);border-color:var(--accent);color:var(--accent);}
.onb-modal input[type="number"],.onb-modal input[type="text"]{width:100%;background:#1c2128;border:1px solid var(--border);border-radius:8px;padding:10px 14px;color:#fff;font-size:var(--fs-base, 0.92rem);}
.onb-modal .onb-actions{display:flex;gap:10px;margin-top:22px;}
.onb-modal .onb-btn{flex:1;padding:10px 18px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text);cursor:pointer;font-weight:700;font-size:var(--fs-base, 0.92rem);}
.onb-modal .onb-btn.primary{background:var(--accent);color:#000;border-color:var(--accent);}
.onb-modal .onb-btn:disabled{opacity:.4;cursor:not-allowed;}
.onb-modal .onb-skip{background:none;border:none;color:var(--muted);font-size:0.78rem;text-decoration:underline;cursor:pointer;margin-top:12px;display:block;text-align:center;width:100%;}
body.light .onb-modal input[type="number"],body.light .onb-modal input[type="text"]{background:#f0f2f5;color:#24292f;}

/* ── SHARE CARD EXPORT (for #28) ── */
.share-card-export{background:linear-gradient(135deg,#0d1117,#161b22);border:1px solid var(--accent);border-radius:var(--radius-lg);padding:28px;width:min(480px,100%);max-width:480px;color:#fff;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;}
.share-card-export .sc-header{display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.08);}
.share-card-export .sc-brand{font-weight:800;color:var(--accent);font-size:var(--fs-sm, 0.82rem);letter-spacing:.5px;}
.share-card-export .sc-date{font-size:var(--fs-xs, 0.72rem);color:rgba(255,255,255,.5);margin-left:auto;}
.share-card-export .sc-ticker{font-size:2.2rem;font-weight:900;margin-bottom:4px;}
.share-card-export .sc-price{font-size:1.3rem;color:var(--accent);margin-bottom:14px;}
.share-card-export .sc-score-ring{display:inline-flex;align-items:center;justify-content:center;width:90px;height:90px;border-radius:50%;border:4px solid var(--accent);font-size:1.8rem;font-weight:800;margin:0 auto 14px;}
.share-card-export .sc-verdict{font-size:var(--fs-md, 1.05rem);font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px;}
.share-card-export .sc-reason{font-size:0.88rem;line-height:1.5;color:rgba(255,255,255,.8);margin-bottom:14px;}
.share-card-export .sc-footer{font-size:var(--fs-xs, 0.72rem);color:rgba(255,255,255,.4);text-align:center;padding-top:12px;border-top:1px solid rgba(255,255,255,.08);}

/* ── MOBILE SWEEP (for #26) ── */
@media (max-width:900px){
  .container{padding:14px;}
  header h1{font-size:1.55rem;}
  header{padding:18px 0 12px;margin-bottom:18px;}
  .tabs{gap:5px;margin-bottom:16px;}
  .tab{padding:7px 13px;font-size:var(--fs-sm, 0.82rem);}
  .stat-grid{grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:10px;}
  .stat-card{padding:12px;}
  .stat-card .value{font-size:1.15rem;}
  .card{padding:16px;}
  table.t th,.price-table th{padding:9px 10px;font-size:var(--fs-xs, 0.72rem);}
  table.t td,.price-table td{padding:10px 12px;font-size:var(--fs-sm, 0.82rem);}
  .filter-bar{gap:7px;}
  .filter-bar input{min-width:140px;font-size:var(--fs-sm, 0.82rem);}
  .regime-banner{padding:8px 14px;font-size:0.78rem;flex-wrap:wrap;}
  .regime-banner .rb-actions{width:100%;margin-left:0;margin-top:4px;}
  .onb-modal{padding:20px;}
}
@media (max-width:520px){
  .container{padding:10px;}
  header h1{font-size:1.35rem;letter-spacing:-0.01em;}
  .stat-grid{grid-template-columns:repeat(2,1fr);gap:8px;}
  .stat-card{padding:10px;}
  .stat-card .label{font-size:0.64rem;}
  .stat-card .value{font-size:1.02rem;}
  .btn{padding:8px 14px;font-size:var(--fs-sm, 0.82rem);}
  .btn-sm{padding:5px 12px;font-size:0.76rem;}
  .wl-portfolio-panel .wlp-grid{grid-template-columns:repeat(2,1fr);gap:7px;}
  .compare-mode-panel .cmp-grid{grid-template-columns:1fr;}
}

/* Touch targets ≥ 44x44 on mobile */
@media (max-width:768px){
  .nav-link,.tab,.btn,.btn-sm,.theme-toggle,.theme-toggle-btn{min-height:38px;display:inline-flex;align-items:center;}
  input,select,textarea{min-height:40px;}
}

/* === Score Popover === */
.score-popover{position:absolute;z-index:9999;width:260px;background:rgba(13,17,23,.96);border:1px solid var(--border,rgba(255,255,255,.08));border-radius:var(--radius-lg,12px);backdrop-filter:blur(20px);box-shadow:var(--shadow-3,0 8px 32px rgba(0,0,0,.5));padding:0;opacity:0;pointer-events:none;transform:translateY(4px);transition:opacity var(--dur,.2s),transform var(--dur,.2s)}
.score-popover.sp-visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.sp-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--border,rgba(255,255,255,.08))}
.sp-ticker{font-weight:700;font-size:var(--fs-base,14px);color:var(--text,#e6edf3)}
.sp-score{font-size:var(--fs-lg,18px);font-weight:800;font-variant-numeric:tabular-nums}
.sp-body{padding:8px 16px 12px}
.sp-section{font-size:var(--fs-xs,11px);color:var(--muted,#8b949e);text-transform:uppercase;letter-spacing:.05em;margin:8px 0 4px;padding-top:8px;border-top:1px solid var(--border,rgba(255,255,255,.06))}
.sp-row{display:flex;justify-content:space-between;align-items:center;padding:3px 0;font-size:var(--fs-sm,12px)}
.sp-label{color:var(--muted,#8b949e)}
.sp-val{color:var(--text,#e6edf3);font-weight:600;font-variant-numeric:tabular-nums}

/* ═══════════════════════════════════════════════════════════════════
   PREMIUM UI FEATURES (merged from premium-ui.css)
   ═══════════════════════════════════════════════════════════════════ */

/* ── A. Typography Optimization ────────────────────────────────── */
html{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-size-adjust:100%;-webkit-text-size-adjust:100%;}
h1,h2,h3,h4,h5,h6,.hero h1,.hero h2,.pipeline-header h1,.journal-header h1{font-feature-settings:"kern" 1,"liga" 1;letter-spacing:-0.02em;}
h1{font-size:clamp(1.8rem,4vw + 0.5rem,3.2rem);}
h2{font-size:clamp(1.3rem,2.5vw + 0.4rem,2rem);}
h3{font-size:clamp(1.1rem,2vw + 0.3rem,1.5rem);}
label,.stat-label,.label,caption,th,[class*="label"],[class*="Label"],.pipeline-stats span,.journal-stats .label{letter-spacing:0.05em;text-transform:uppercase;font-size:0.7rem;font-weight:600;}
.stat-value,.score,.price,.change,.value,[class*="score"],[class*="Score"],[class*="price"],[class*="Price"],[class*="pnl"],[class*="PnL"],[class*="percent"],[class*="Percent"],td,th,.pipeline-stats .stat-number,.journal-stats .value,.ticker-item span,code,.mono{font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1;}

/* ── B. Staggered Card Reveal Animation ────────────────────────── */
@keyframes revealCard{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
.card,.stat-card,.signal-card,.premium-card,.glass-card,.insight-card,.dashboard-card,.kpi-card{animation:revealCard var(--dur-slow,0.5s) cubic-bezier(0.4,0,0.2,1) backwards;}
.card:nth-child(1),.stat-card:nth-child(1),.signal-card:nth-child(1){animation-delay:50ms;}
.card:nth-child(2),.stat-card:nth-child(2),.signal-card:nth-child(2){animation-delay:100ms;}
.card:nth-child(3),.stat-card:nth-child(3),.signal-card:nth-child(3){animation-delay:150ms;}
.card:nth-child(4),.stat-card:nth-child(4),.signal-card:nth-child(4){animation-delay:200ms;}
.card:nth-child(5),.stat-card:nth-child(5),.signal-card:nth-child(5){animation-delay:250ms;}
.card:nth-child(6),.stat-card:nth-child(6),.signal-card:nth-child(6){animation-delay:300ms;}
.card:nth-child(7),.stat-card:nth-child(7),.signal-card:nth-child(7){animation-delay:350ms;}
.card:nth-child(8),.stat-card:nth-child(8),.signal-card:nth-child(8){animation-delay:400ms;}
.card:nth-child(9),.stat-card:nth-child(9),.signal-card:nth-child(9){animation-delay:450ms;}
.card:nth-child(10),.stat-card:nth-child(10),.signal-card:nth-child(10){animation-delay:500ms;}
.card:nth-child(11),.stat-card:nth-child(11),.signal-card:nth-child(11){animation-delay:550ms;}
.card:nth-child(12),.stat-card:nth-child(12),.signal-card:nth-child(12){animation-delay:600ms;}
.card:nth-child(13),.stat-card:nth-child(13),.signal-card:nth-child(13){animation-delay:650ms;}
.card:nth-child(14),.stat-card:nth-child(14),.signal-card:nth-child(14){animation-delay:700ms;}
.card:nth-child(15),.stat-card:nth-child(15),.signal-card:nth-child(15){animation-delay:750ms;}
.card:nth-child(16),.stat-card:nth-child(16),.signal-card:nth-child(16){animation-delay:800ms;}

/* ── C. Dynamic Score Bar Gradients ────────────────────────────── */
.score-bar,.factor-bar,[class*="score-bar"],[class*="progress"]{position:relative;overflow:hidden;border-radius:4px;background:rgba(139,148,158,0.08);}
.score-bar-fill,.factor-bar-fill,[class*="bar-fill"]{border-radius:4px;transition:width 600ms cubic-bezier(0.4,0,0.2,1);}
.score-bar-fill[style*="width: 0"],.score-bar-fill[style*="width: 1"],.score-bar-fill[style*="width: 2"]{background:linear-gradient(90deg,#f85149,#f0883e);}
.score-bar-fill[style*="width: 3"],.score-bar-fill[style*="width: 4"],.score-bar-fill[style*="width: 5"]{background:linear-gradient(90deg,#f0883e,#d4a017);}
.score-bar-fill[style*="width: 6"],.score-bar-fill[style*="width: 7"]{background:linear-gradient(90deg,#d4a017,#3fb950);}
.score-bar-fill[style*="width: 8"],.score-bar-fill[style*="width: 9"],.score-bar-fill[style*="width: 100"]{background:linear-gradient(90deg,#3fb950,#00d4aa);}

/* ── D. Live Pulse Indicator ───────────────────────────────────── */
@keyframes livePulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.5;transform:scale(1.4);}}
.live-dot,.live-indicator,[class*="live"] .dot,.status-live::before{display:inline-block;width:8px;height:8px;border-radius:50%;background:#3fb950;animation:livePulse 2s ease-in-out infinite;box-shadow:0 0 8px rgba(63,185,80,0.5);}

/* ── E. Enhanced Tooltip System ────────────────────────────────── */
[data-tooltip]::before{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(4px);padding:6px 12px;border-radius:8px;background:rgba(13,17,23,0.85);backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5);border:1px solid rgba(139,148,158,0.15);color:var(--text,#E6EDF3);font-size:0.75rem;font-weight:500;line-height:1.4;white-space:nowrap;max-width:280px;box-shadow:0 8px 24px rgba(0,0,0,0.4);opacity:0;pointer-events:none;transition:opacity 200ms ease,transform 200ms ease;z-index:9999;}
[data-tooltip]::after{content:'';position:absolute;bottom:calc(100% + 2px);left:50%;transform:translateX(-50%) translateY(4px);border:5px solid transparent;border-top-color:rgba(13,17,23,0.85);opacity:0;pointer-events:none;transition:opacity 200ms ease,transform 200ms ease;z-index:9999;}
[data-tooltip]:hover::before,[data-tooltip]:hover::after{opacity:1;transform:translateX(-50%) translateY(0);}

/* ── F. Custom Scrollbar (Premium) ─────────────────────────────── */
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:rgba(139,148,158,0.04);}
::-webkit-scrollbar-thumb{background:rgba(212,175,55,0.25);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:rgba(212,175,55,0.45);}
::-webkit-scrollbar-corner{background:transparent;}
*{scrollbar-width:thin;scrollbar-color:rgba(212,175,55,0.25) rgba(139,148,158,0.04);}

/* ── G. Pulse-Dots Loader ──────────────────────────────────────── */
@keyframes pulseDotLoader{0%,80%,100%{transform:scale(0.6);opacity:0.3;}40%{transform:scale(1);opacity:1;}}
.pulse-dots{display:inline-flex;gap:4px;align-items:center;}
.pulse-dots .dot,.pulse-dots span{width:6px;height:6px;border-radius:50%;background:var(--accent-gold,#D4AF37);animation:pulseDotLoader 1.4s infinite ease-in-out;}
.pulse-dots .dot:nth-child(2),.pulse-dots span:nth-child(2){animation-delay:0.16s;}
.pulse-dots .dot:nth-child(3),.pulse-dots span:nth-child(3){animation-delay:0.32s;}

/* ── H. Utility Classes ────────────────────────────────────────── */
.text-gradient{background:linear-gradient(135deg,var(--accent-gold,#D4AF37),#E8C878);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.fade-edge-right{mask-image:linear-gradient(to right,black 85%,transparent 100%);-webkit-mask-image:linear-gradient(to right,black 85%,transparent 100%);}
.fade-edge-both{mask-image:linear-gradient(to right,transparent,black 5%,black 95%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,black 5%,black 95%,transparent);}
.text-green,.text-bull{color:#3fb950;}
.text-red,.text-bear{color:#f85149;}
.text-gold{color:#D4AF37;}

/* ── I. Signal Conviction Meter ────────────────────────────────── */
.conviction-meter{display:inline-flex;gap:3px;align-items:center;}
.conviction-meter .dot{width:8px;height:8px;border-radius:50%;background:rgba(139,148,158,0.2);transition:background 200ms ease;}
.conviction-meter .dot.active{background:var(--accent-gold,#D4AF37);box-shadow:0 0 6px rgba(212,175,55,0.4);}
.conviction-meter[data-level="1"] .dot:nth-child(-n+1){background:#f85149;}
.conviction-meter[data-level="2"] .dot:nth-child(-n+2){background:#f0883e;}
.conviction-meter[data-level="3"] .dot:nth-child(-n+3){background:#d4a017;}
.conviction-meter[data-level="4"] .dot:nth-child(-n+4){background:#3fb950;}
.conviction-meter[data-level="5"] .dot:nth-child(-n+5){background:#00d4aa;box-shadow:0 0 6px rgba(0,212,170,0.4);}

/* ── J. Obsidian Cockpit Design System (opt-in via body.obsidian) ── */
body.obsidian{
  --obs-bg-0:#050709;--obs-bg-1:#0a0e14;--obs-bg-2:#111820;--obs-bg-3:#1a2230;
  --obs-border:#1e2a3a;--obs-text:#e2e8f0;--obs-muted:#64748b;
  --obs-accent:#d4a017;--obs-green:#22c55e;--obs-red:#ef4444;--obs-blue:#3b82f6;
  --obs-font-mono:'SF Mono','Fira Code','Cascadia Code',monospace;
  --obs-radius:8px;--obs-transition:0.2s cubic-bezier(0.4,0,0.2,1);
  background:var(--obs-bg-0);color:var(--obs-text);
}

/* Panel */
body.obsidian .obs-panel{background:var(--obs-bg-1);border:1px solid var(--obs-border);border-radius:var(--obs-radius);padding:16px;}

/* Numeric display */
body.obsidian .obs-num{font-family:var(--obs-font-mono);font-variant-numeric:tabular-nums;color:var(--obs-text);letter-spacing:-0.02em;}

/* Label */
body.obsidian .obs-label{text-transform:uppercase;letter-spacing:1.5px;color:var(--obs-muted);font-size:0.68rem;font-weight:600;}

/* Score Ring */
body.obsidian .obs-score-ring{width:48px;height:48px;border-radius:50%;border:3px solid var(--obs-muted);display:flex;align-items:center;justify-content:center;font-family:var(--obs-font-mono);font-size:0.85rem;font-weight:700;color:var(--obs-text);transition:border-color var(--obs-transition);}
body.obsidian .obs-score-ring[data-tier="green"]{border-color:var(--obs-green);}
body.obsidian .obs-score-ring[data-tier="gold"]{border-color:var(--obs-accent);}
body.obsidian .obs-score-ring[data-tier="red"]{border-color:var(--obs-red);}

/* Factor Row */
body.obsidian .obs-factor-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--obs-border);}
body.obsidian .obs-factor-row .obs-factor-label{flex:0 0 120px;font-size:0.75rem;color:var(--obs-muted);}
body.obsidian .obs-factor-row .obs-factor-value{flex:0 0 48px;text-align:right;font-family:var(--obs-font-mono);font-size:0.8rem;color:var(--obs-text);}
body.obsidian .obs-factor-row .obs-factor-bar{flex:1;height:6px;background:var(--obs-bg-3);border-radius:3px;overflow:hidden;}
body.obsidian .obs-factor-row .obs-factor-fill{height:100%;border-radius:3px;transition:width var(--obs-transition);}

/* Tabs */
body.obsidian .obs-tabs{display:flex;gap:4px;background:var(--obs-bg-2);border-radius:var(--obs-radius);padding:4px;}
body.obsidian .obs-tabs button{background:transparent;border:none;color:var(--obs-muted);padding:6px 14px;border-radius:6px;font-size:0.8rem;cursor:pointer;transition:all var(--obs-transition);}
body.obsidian .obs-tabs button:hover{color:var(--obs-text);background:var(--obs-bg-3);}
body.obsidian .obs-tabs button.active{background:var(--obs-accent);color:#050709;font-weight:600;}

/* Buttons */
body.obsidian .obs-btn{background:var(--obs-bg-2);border:1px solid var(--obs-border);color:var(--obs-text);padding:8px 16px;border-radius:var(--obs-radius);font-size:0.82rem;cursor:pointer;transition:all var(--obs-transition);}
body.obsidian .obs-btn:hover{background:var(--obs-bg-3);box-shadow:0 0 12px rgba(212,160,23,0.1);}
body.obsidian .obs-btn-primary{background:linear-gradient(135deg,#d4a017,#b8860b);border-color:transparent;color:#050709;font-weight:600;}
body.obsidian .obs-btn-primary:hover{box-shadow:0 0 16px rgba(212,160,23,0.3);}
body.obsidian .obs-btn-ghost{background:transparent;border-color:transparent;color:var(--obs-muted);}
body.obsidian .obs-btn-ghost:hover{color:var(--obs-text);background:var(--obs-bg-2);}

/* Pulse */
@keyframes obsPulse{0%,100%{opacity:1;}50%{opacity:0.4;}}
body.obsidian .obs-pulse{animation:obsPulse 2s ease-in-out infinite;}

/* Toast Stack */
body.obsidian .obs-toast-stack{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:9999;pointer-events:none;}
@keyframes obsSlideIn{from{transform:translateX(100%);opacity:0;}to{transform:translateX(0);opacity:1;}}
body.obsidian .obs-toast{background:var(--obs-bg-2);border:1px solid var(--obs-border);border-radius:var(--obs-radius);padding:12px 16px;font-size:0.82rem;color:var(--obs-text);pointer-events:auto;animation:obsSlideIn 0.3s ease-out;box-shadow:0 4px 24px rgba(0,0,0,0.4);}

/* Skeleton */
@keyframes obsShimmer{0%{background-position:-200% 0;}100%{background-position:200% 0;}}
body.obsidian .obs-skeleton{background:linear-gradient(90deg,var(--obs-bg-2) 25%,var(--obs-bg-3) 50%,var(--obs-bg-2) 75%);background-size:200% 100%;animation:obsShimmer 1.5s ease-in-out infinite;border-radius:var(--obs-radius);min-height:20px;}

/* Action Bar */
body.obsidian .obs-action-bar{display:flex;gap:8px;align-items:center;padding:8px 0;}

/* ── Obsidian Responsive ── */
@media(max-width:780px){
  body.obsidian .obs-action-bar{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:4px;}
  body.obsidian .obs-action-bar .obs-btn{scroll-snap-align:start;flex-shrink:0;min-height:44px;min-width:44px;}
  body.obsidian .obs-factor-row .obs-factor-label{flex:0 0 80px;font-size:0.7rem;}
  body.obsidian .obs-panel{padding:12px;}
  body.obsidian [class*="grid"]{grid-template-columns:1fr !important;}
}
@media(max-width:380px){
  body.obsidian .obs-panel{padding:8px;}
  body.obsidian .obs-tabs button{padding:5px 10px;font-size:0.72rem;}
  body.obsidian .obs-btn{padding:6px 12px;font-size:0.76rem;}
  body.obsidian .obs-label{font-size:0.6rem;}
}
@media(prefers-reduced-motion:reduce){
  body.obsidian .obs-pulse,body.obsidian .obs-skeleton{animation:none;}
  body.obsidian .obs-toast{animation:none;}
  body.obsidian *{transition-duration:0s !important;}
}

/* ========== DISCLOSURE TOOLTIPS ========== */
[data-term] { position: relative; cursor: help; }
[data-term]::after {
  content: '\u24D8';
  font-size: 0.55em;
  opacity: 0.35;
  margin-left: 3px;
  vertical-align: super;
  transition: opacity 0.15s;
}
[data-term]:hover::after { opacity: 0.8; }
.disclosure-tip {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  background: #1a2233;
  color: #e6edf3;
  border: 1px solid rgba(48,54,61,0.8);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 0.72rem;
  line-height: 1.4;
  max-width: 240px;
  white-space: normal;
  z-index: 9999;
  pointer-events: none;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
  animation: fadeIn 0.15s ease;
}
.disclosure-tip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: #1a2233;
}
@keyframes fadeIn { from { opacity: 0; transform: translateX(-50%) translateY(4px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }

/* Skeleton Loader (Phase 13) */
.skeleton {
  background: linear-gradient(90deg, rgba(255,255,255,0.04) 25%, rgba(255,255,255,0.08) 50%, rgba(255,255,255,0.04) 75%);
  background-size: 200% 100%;
  animation: obsShimmer 1.5s ease-in-out infinite;
  border-radius: 8px;
  min-height: 20px;
}
.skeleton-text { height: 14px; margin: 6px 0; border-radius: 4px; }
.skeleton-card { height: 120px; border-radius: 12px; }

/* ========== AI COCKPIT — Floating Cross-Page Intelligence Panel ========== */
#ai-cockpit-toggle {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 9990;
  width: 40px;
  height: 120px;
  background: color-mix(in srgb, var(--bg, #06090F) 90%, transparent);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid var(--border, rgba(48,54,61,0.6));
  border-right: none;
  border-radius: 10px 0 0 10px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--muted, #8b949e);
  transition: all 0.25s ease;
  padding: 8px 0;
}
#ai-cockpit-toggle:hover { color: var(--accent, #58a6ff); background: color-mix(in srgb, var(--bg, #06090F) 95%, transparent); }
#ai-cockpit-toggle .aic-icon { font-size: 1.1rem; }
#ai-cockpit-toggle .aic-badge {
  font-size: 0.55rem;
  font-weight: 700;
  background: #d4a017;
  color: #050709;
  border-radius: 6px;
  padding: 1px 4px;
  min-width: 14px;
  text-align: center;
  line-height: 1.2;
}
#ai-cockpit-toggle.has-alerts .aic-badge { animation: obsPulse 2s ease-in-out infinite; }

#ai-cockpit-panel {
  position: fixed;
  right: -330px;
  top: 0;
  bottom: 0;
  width: 320px;
  z-index: 9991;
  background: color-mix(in srgb, var(--bg, #06090F) 95%, transparent);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-left: 1px solid var(--border, rgba(48,54,61,0.6));
  box-shadow: -4px 0 24px rgba(0,0,0,0.4);
  transition: right 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  padding: 0;
}
#ai-cockpit-panel.open { right: 0; }
#ai-cockpit-panel.open ~ #ai-cockpit-toggle { right: 320px; }

.aic-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 16px 12px;
  border-bottom: 1px solid var(--border, rgba(48,54,61,0.6));
  position: sticky;
  top: 0;
  background: inherit;
  z-index: 1;
}
.aic-header h3 { font-size: 0.9rem; font-weight: 700; margin: 0; color: var(--text, #e6edf3); }
.aic-close {
  background: none;
  border: 1px solid var(--border);
  color: var(--muted);
  font-size: 0.9rem;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
}
.aic-close:hover { color: var(--text); border-color: var(--text); }

.aic-section {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border, rgba(48,54,61,0.6));
}
.aic-section-title {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--muted, #8b949e);
  margin: 0 0 8px;
}

/* Regime Badge */
.aic-regime {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  background: rgba(255,255,255,0.03);
  border-radius: 8px;
}
.aic-regime-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.aic-regime-label { font-size: 0.82rem; font-weight: 600; color: var(--text); }
.aic-regime-conf { font-size: 0.7rem; color: var(--muted); margin-left: auto; font-family: var(--font-mono, monospace); }

/* Expected Returns List */
.aic-returns-list { display: flex; flex-direction: column; gap: 4px; }
.aic-return-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-radius: 6px;
  transition: background 0.15s;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
}
.aic-return-row:hover { background: rgba(255,255,255,0.04); }
.aic-return-rank {
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--muted);
  width: 16px;
  text-align: center;
}
.aic-return-ticker {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--text);
  min-width: 48px;
}
.aic-return-pct {
  font-size: 0.8rem;
  font-weight: 700;
  font-family: var(--font-mono, monospace);
  margin-left: auto;
}
.aic-return-score {
  font-size: 0.65rem;
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: 600;
  background: rgba(255,255,255,0.06);
}

/* Quick Actions */
.aic-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.aic-action-btn {
  padding: 6px 10px;
  font-size: 0.72rem;
  font-weight: 600;
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--muted);
  cursor: pointer;
  text-decoration: none;
  transition: all 0.15s;
  white-space: nowrap;
}
.aic-action-btn:hover { background: rgba(255,255,255,0.08); color: var(--text); border-color: var(--accent, #58a6ff); }

/* System Health Dot */
.aic-health {
  display: flex;
  align-items: center;
  gap: 8px;
}
.aic-health-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #3fb950;
}
.aic-health-dot.warn { background: #d29922; }
.aic-health-dot.error { background: #f85149; }
.aic-health-label { font-size: 0.75rem; color: var(--muted); }

/* Alerts in cockpit */
.aic-alert-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 6px 0;
  font-size: 0.75rem;
  color: var(--text);
}
.aic-alert-icon { flex-shrink: 0; font-size: 0.85rem; }
.aic-alert-text { flex: 1; line-height: 1.3; }
.aic-alert-time { font-size: 0.6rem; color: var(--muted); white-space: nowrap; }
.aic-empty { text-align: center; padding: 12px; color: var(--muted); font-size: 0.75rem; }

/* Mobile: cockpit as bottom sheet */
@media (max-width: 768px) {
  #ai-cockpit-toggle {
    top: auto;
    bottom: 72px;
    right: 16px;
    transform: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid var(--border);
    gap: 0;
  }
  #ai-cockpit-toggle .aic-label { display: none; }
  #ai-cockpit-toggle .aic-badge { position: absolute; top: -4px; right: -4px; }
  #ai-cockpit-panel {
    right: auto;
    left: 0;
    top: auto;
    bottom: -100%;
    width: 100%;
    height: 70vh;
    border-left: none;
    border-top: 1px solid var(--border);
    border-radius: 16px 16px 0 0;
    transition: bottom 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
  #ai-cockpit-panel.open { bottom: 0; }
  #ai-cockpit-panel.open ~ #ai-cockpit-toggle { display: none; }
}

/* ========== EXPANDABLE ROWS ========== */
tr[data-expandable] { cursor: pointer; transition: background 0.15s; }
tr[data-expandable]:hover { background: rgba(255,255,255,0.04); }
tr[data-expandable].expanded { background: rgba(88,166,255,0.06); }
tr[data-expandable]::after { content: '▸'; float: right; color: #484f58; transition: transform 0.2s; }
tr[data-expandable].expanded::after { transform: rotate(90deg); }
.expand-detail { animation: expandIn 0.2s ease; }
@keyframes expandIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }

/* ========== STANDARD RESPONSIVE BREAKPOINTS ========== */
@media (max-width: 1440px) {
  .container { max-width: 1200px; }
}
@media (max-width: 1024px) {
  .container { max-width: 960px; padding: 0 16px; }
}
@media (max-width: 768px) {
  .container { padding: 0 12px; }
  .stat-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .container { padding: 0 8px; }
  .stat-grid { grid-template-columns: 1fr; }
  .glass-card { padding: 12px; }
}

/* ==========================================================
   NEW NAVIGATION SYSTEM — Mega Menu, Bottom Nav v2, Priority Links
   ========================================================== */

/* ── MEGA MENU OVERLAY — full-screen mobile menu ── */
#mega-menu-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: var(--bg, #06090F);
  overflow-y: auto;
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-overflow-scrolling: touch;
  padding-bottom: 80px; /* space for bottom nav */
}
#mega-menu-overlay.open {
  transform: translateY(0);
}

/* Mega menu header */
.mega-menu-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px 12px;
  border-bottom: 1px solid var(--border, rgba(48,54,61,0.6));
  position: sticky;
  top: 0;
  background: var(--bg, #06090F);
  z-index: 1;
}
.mega-menu-header h2 {
  font-size: 1.3rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0;
}
.mega-menu-close {
  background: none;
  border: 1px solid var(--border);
  color: var(--text, #e6edf3);
  font-size: 1.2rem;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Mega menu search */
.mega-menu-search {
  padding: 12px 20px;
  border-bottom: 1px solid var(--border);
}
.mega-menu-search input {
  width: 100%;
  padding: 10px 14px;
  background: var(--card, rgba(13,17,23,0.8));
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  font-size: 0.9rem;
  outline: none;
}
.mega-menu-search input:focus {
  border-color: var(--accent, #58a6ff);
}

/* Mega menu category sections */
.mega-cat {
  border-bottom: 1px solid var(--border);
}
.mega-cat-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--text);
  transition: background 0.15s;
}
.mega-cat-header:active {
  background: rgba(255,255,255,0.04);
}
.mega-cat-header .mega-cat-arrow {
  transition: transform 0.2s ease;
  font-size: 0.8rem;
  color: var(--muted);
}
.mega-cat.open .mega-cat-arrow {
  transform: rotate(180deg);
}
.mega-cat-header .mega-cat-count {
  font-size: 0.65rem;
  padding: 1px 6px;
  border-radius: 8px;
  background: rgba(88,166,255,0.15);
  color: #58a6ff;
  margin-left: 8px;
  font-weight: 600;
}

/* Mega menu links list */
.mega-cat-links {
  display: none;
  padding: 0 12px 12px;
}
.mega-cat.open .mega-cat-links {
  display: block;
}
.mega-cat-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 14px;
  border-radius: 10px;
  color: var(--text);
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 500;
  transition: background 0.15s;
}
.mega-cat-link:hover,
.mega-cat-link:active {
  background: rgba(255,255,255,0.06);
}
.mega-cat-link.active {
  background: rgba(88,166,255,0.12);
  color: var(--accent, #58a6ff);
  font-weight: 700;
}
.mega-cat-link .link-icon {
  font-size: 1.1rem;
  width: 24px;
  text-align: center;
  flex-shrink: 0;
}

/* Signal badge in mega menu */
.mega-cat-link .nav-sig-badge {
  margin-left: auto;
}

/* ── UPDATED MOBILE BOTTOM NAV (v2 — 5 items including menu) ── */
.mobile-bottom-nav {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10001; /* above mega menu and overlays */
  background: color-mix(in srgb, var(--bg, #06090F) 85%, transparent);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-top: 1px solid var(--border, rgba(48,54,61,0.6));
  padding: 6px 0 env(safe-area-inset-bottom, 6px);
  justify-content: space-around;
}

@media (max-width: 768px) {
  .mobile-bottom-nav { display: flex; }
}

.mobile-bottom-nav a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 8px 0;
  color: var(--muted, #8b949e);
  text-decoration: none;
  font-size: 0.64rem;
  font-weight: 600;
  flex: 1;
  min-width: 0;
  transition: color 0.15s;
  position: relative;
}
.mobile-bottom-nav a .nav-icon {
  font-size: 1.15rem;
  line-height: 1;
}
.mobile-bottom-nav a.active {
  color: var(--accent, #58a6ff);
}
.mobile-bottom-nav a.active::before {
  content: '';
  position: absolute;
  top: -6px;
  left: 25%;
  right: 25%;
  height: 2px;
  background: var(--accent, #58a6ff);
  border-radius: 2px;
}

/* ── DESKTOP PRIORITY LINKS ── */
.nav-priority, .nav-priority-links {
  display: flex;
  gap: 2px;
  align-items: center;
  margin-right: 8px;
  padding-right: 8px;
  border-right: 1px solid var(--border);
}
.nav-priority .nav-link, .nav-priority-links .nav-link {
  font-weight: 700;
  font-size: 0.78rem;
  padding: 5px 10px;
  border-radius: 6px;
  white-space: nowrap;
}
.nav-priority .nav-link.active, .nav-priority-links .nav-link.active {
  background: rgba(88,166,255,0.12);
  color: var(--accent, #58a6ff);
}

/* Hide priority links on mobile (they're in bottom nav) */
@media (max-width: 768px) {
  .nav-priority, .nav-priority-links { display: none; }
}

/* ── BODY PADDING FOR BOTTOM NAV ON MOBILE ── */
@media (max-width: 768px) {
  body {
    padding-bottom: 72px; /* space for mobile bottom nav */
  }
}

/* ══════════════════════════════════════════════
   PHASE 26 — ACCESSIBILITY
   ══════════════════════════════════════════════ */

/* 26A. Focus-visible indicators for all interactive elements */
:focus-visible {
  outline: 2px solid var(--accent, #58a6ff);
  outline-offset: 2px;
  border-radius: 4px;
}
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--accent, #58a6ff);
  outline-offset: 2px;
}

/* 26B. Skip-to-content link */
.skip-to-content {
  position: absolute;
  top: -100%;
  left: 16px;
  z-index: 100000;
  padding: 8px 16px;
  background: var(--accent, #58a6ff);
  color: #fff;
  border-radius: 0 0 8px 8px;
  font-weight: 700;
  font-size: 0.85rem;
  text-decoration: none;
  transition: top 0.2s;
}
.skip-to-content:focus {
  top: 0;
}

/* 26E. Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ══════════════════════════════════════════════
   PHASE 32 — UI POLISH MICRO-ENHANCEMENTS
   ══════════════════════════════════════════════ */

/* 32C. Page transition animation */
main, .page-content {
  animation: pageIn 0.2s ease-out;
}
@keyframes pageIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 32D. Scroll-to-top button */
.scroll-top-btn {
  position: fixed;
  bottom: 24px;
  right: 24px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--card, #161b22);
  border: 1px solid var(--border, #30363d);
  color: var(--text, #c9d1d9);
  font-size: 1.2rem;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s, transform 0.2s;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
}
.scroll-top-btn.visible {
  opacity: 1;
  pointer-events: auto;
}
.scroll-top-btn:hover {
  transform: scale(1.1);
  background: var(--accent, #58a6ff);
  color: #fff;
}
@media (max-width: 768px) {
  .scroll-top-btn { bottom: 128px; right: 16px; }
}

/* 32E. Table row hover effects */
.data-table tr:hover, table.sortable tr:hover, .obs-panel table tr:hover {
  background: rgba(255,255,255,0.03);
  transition: background 0.15s;
}

/* 32F. Empty state component */
.empty-state {
  text-align: center;
  padding: 48px 24px;
  color: var(--muted, #8b949e);
}
.empty-state-icon {
  font-size: 2.5rem;
  margin-bottom: 12px;
  opacity: 0.5;
}
.empty-state-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text, #c9d1d9);
  margin-bottom: 8px;
}
.empty-state-msg {
  font-size: 0.85rem;
  max-width: 400px;
  margin: 0 auto;
  line-height: 1.5;
}

/* 32G. Notification badge pulse */
@keyframes badgePulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.2); }
}
.badge-pulse {
  animation: badgePulse 1s ease-in-out 2;
}

/* 32I. Keyboard shortcut hint */
.kbd {
  display: inline-block;
  padding: 2px 5px;
  font-size: 0.65rem;
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace);
  color: var(--muted, #8b949e);
  background: rgba(255,255,255,0.06);
  border: 1px solid var(--border, #30363d);
  border-radius: 3px;
  line-height: 1;
  vertical-align: middle;
  margin-left: 4px;
}

/* 32J. Fluid responsive typography */
:root {
  --fs-base: clamp(0.85rem, 0.8rem + 0.25vw, 1rem);
}

/* 32K. Print-friendly layouts */
@media print {
  nav, #ai-cockpit, #ai-cockpit-toggle, #ai-cockpit-panel,
  .view-toggle, .vt-btn, .mobile-bottom-nav,
  .scroll-top-btn, .theme-toggle, .search-overlay {
    display: none !important;
  }
  body {
    background: white !important;
    color: black !important;
    padding: 0 !important;
  }
  .card, .obs-panel, .stat-card, .signal-card {
    border: 1px solid #ddd !important;
    box-shadow: none !important;
    background: white !important;
    color: black !important;
  }
  * {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

/* ══════════════════════════════════════════════
   PHASE 33 — CSV EXPORT BUTTON
   ══════════════════════════════════════════════ */
.csv-export-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  font-size: 0.72rem;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--border, #30363d);
  border-radius: 6px;
  color: var(--muted, #8b949e);
  cursor: pointer;
  transition: all 0.15s;
}
.csv-export-btn:hover {
  background: rgba(255,255,255,0.1);
  color: var(--text, #c9d1d9);
}

/* ══════════════════════════════════════════════
   PHASE 28 — DATA FRESHNESS INDICATORS
   ══════════════════════════════════════════════ */
.data-freshness {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.7rem;
  color: var(--muted, #8b949e);
  padding: 2px 8px;
  border-radius: 4px;
  background: rgba(255,255,255,0.03);
}
.data-freshness.stale {
  color: #d29922;
  background: rgba(210,153,34,0.1);
}
.data-freshness.error {
  color: #f85149;
  background: rgba(248,81,73,0.1);
}

/* ══════════════════════════════════════════════
   PHASE 29 — OFFLINE BANNER
   ══════════════════════════════════════════════ */
/* ══════════════════════════════════════════════
   COLUMN FILTER — Clickable cell filtering
   ══════════════════════════════════════════════ */
table td[data-cf-col] {
  cursor: pointer;
  transition: all 0.15s;
}
table td[data-cf-col]:hover {
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 3px;
}
table th .cf-icon {
  font-size: 0.7em;
  opacity: 0.4;
  margin-left: 2px;
  transition: opacity 0.15s;
}
table th:hover .cf-icon {
  opacity: 0.8;
}
.cf-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: rgba(212,160,23,0.15);
  border: 1px solid rgba(212,160,23,0.3);
  border-radius: 8px;
  font-size: 0.78rem;
  color: var(--accent, #d4a017);
  font-weight: 600;
  margin: 8px 0;
  flex-wrap: wrap;
}
.cf-badge button {
  background: none;
  border: none;
  color: var(--accent, #d4a017);
  cursor: pointer;
  font-size: 0.9rem;
  padding: 0 2px;
}
.cf-badge button:hover {
  color: var(--text, #e6edf3);
}

.offline-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 99999;
  padding: 8px 16px;
  background: #d29922;
  color: #000;
  text-align: center;
  font-size: 0.8rem;
  font-weight: 600;
  transform: translateY(-100%);
  transition: transform 0.3s;
}
.offline-banner.show {
  transform: translateY(0);
}