/* ════════════════════════════════════════════════════════════
   STOCKCARDS — Design System
   Dark theme, trading card aesthetics, collector-grade UI
   ════════════════════════════════════════════════════════════ */

/* ── GLOBAL UTILITIES ── */
.hidden { display: none !important; }
.color-positive { color: var(--green); }
.color-negative { color: var(--red); }
.color-warning  { color: var(--orange); }
.color-caution  { color: var(--yellow); }

/* ── VARIABLES ── */
:root {
    --bg:           #0a0a0b;
    --surface:      #111113;
    --surface-2:    #18181a;
    --surface-3:    #222225;
    --border:       rgba(255,255,255,0.06);
    --border-hover: rgba(255,255,255,0.12);
    --text:         #e4e4e7;
    --text-muted:   #71717a;
    --text-dim:     #52525b;
    --green:        #22c55e;
    --green-bg:     rgba(34,197,94,0.15);
    --yellow:       #eab308;
    --yellow-bg:    rgba(234,179,8,0.15);
    --orange:       #f97316;
    --orange-bg:    rgba(249,115,22,0.15);
    --red:          #ef4444;
    --red-bg:       rgba(239,68,68,0.15);
    --blue:         #60a5fa;
    --blue-bg:      rgba(96,165,250,0.15);
    --gold:         #d4af37;
    --gold-bg:      rgba(212,175,55,0.15);
    --gold-light:   #f5d67b;
    --silver:       #c0c0c0;
    --font-display: 'Bebas Neue', sans-serif;
    --font-body:    'DM Sans', system-ui, sans-serif;
    --font-mono:    'IBM Plex Mono', monospace;
}

/* ── RESET ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--text); font-family: var(--font-body); line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; border: none; font-family: inherit; }
img { max-width: 100%; }

/* ── TICKER TAPE ── */
.ticker-tape { position: fixed; top: 0; left: 0; right: 0; height: 46px; z-index: 100; background: rgba(0,0,0,0.8); backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); }
.ticker-tape .tradingview-widget-container { height: 46px; }

/* ── NAVBAR ── */
.navbar { position: sticky; top: 46px; z-index: 90; display: flex; align-items: center; justify-content: space-between; padding: 0 32px; height: 60px; background: rgba(10,10,11,0.85); backdrop-filter: blur(16px); border-bottom: 1px solid var(--border); }
.nav-left, .nav-center, .nav-right { display: flex; align-items: center; }
.nav-right { gap: 10px; }
.logo { display: flex; align-items: center; gap: 8px; }
.logo-text { font-family: var(--font-display); font-size: 1.5rem; letter-spacing: 3px; line-height: 1; }
.brand-top { color: #fff; }
.brand-bottom { color: var(--green); }
.nav-center { gap: 8px; }
.nav-link { padding: 8px 16px; border-radius: 8px; font-size: 0.85rem; font-weight: 500; color: var(--text-muted); transition: all 0.2s; white-space: nowrap; }
.nav-link:hover { color: var(--text); background: rgba(255,255,255,0.05); }
.nav-link.active { color: #fff; background: rgba(255,255,255,0.08); }
.xp-badge { display: flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 20px; background: rgba(34,197,94,0.1); border: 1px solid rgba(34,197,94,0.2); font-size: 0.8rem; font-weight: 600; color: var(--green); }
.xp-level { font-family: 'Bebas Neue', sans-serif; font-size: 0.85rem; letter-spacing: 0.5px; color: var(--green); }
.xp-bar-wrap { width: 48px; height: 6px; border-radius: 3px; background: rgba(255,255,255,0.08); overflow: hidden; }
.xp-bar-fill { height: 100%; border-radius: 3px; background: var(--green); transition: width 0.6s ease; }
.xp-count { font-family: 'IBM Plex Mono', monospace; font-size: 0.75rem; color: rgba(34,197,94,0.7); }
.xp-toast { position: fixed; top: 80px; right: 32px; padding: 8px 18px; border-radius: 12px; background: rgba(34,197,94,0.15); border: 1px solid rgba(34,197,94,0.3); color: var(--green); font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem; letter-spacing: 1px; opacity: 0; transform: translateY(10px); pointer-events: none; z-index: 9999; transition: opacity 0.3s, transform 0.3s; }
.xp-toast-show { opacity: 1; transform: translateY(0); }
.account-btn { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.06); border: 1px solid var(--border); color: var(--text-muted); cursor: pointer; transition: all 0.2s; }
.account-btn:hover { background: rgba(255,255,255,0.1); color: var(--text); border-color: var(--green); }

/* ── MAIN LAYOUT ── */
.main-content { max-width: 1400px; margin: 0 auto; padding: 106px 32px 60px; }
.page { display: none; }
.page.active { display: block; animation: fadeIn 0.3s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ── HERO ── */
.hero {
    position: relative;
    padding: 64px 0 56px;
    text-align: center;
    overflow: hidden;
    min-height: 340px;
}

/* Ambient glow — radial light from center bottom */
.hero-glow {
    position: absolute;
    bottom: -40%;
    left: 50%;
    transform: translateX(-50%);
    width: 800px;
    height: 500px;
    background: radial-gradient(ellipse at center, rgba(34,197,94,0.05) 0%, rgba(34,197,94,0.02) 40%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

/* Grain texture — film-quality noise */
.hero-grain {
    position: absolute;
    inset: 0;
    opacity: 0.035;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-repeat: repeat;
    background-size: 200px;
    pointer-events: none;
    z-index: 1;
}

/* Full-width chart canvas */
.hero-chart {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 65%;
    z-index: 1;
    opacity: 0;
    transition: opacity 1s ease;
}
.hero-chart.drawn { opacity: 1; }

/* Content layer */
.hero-content {
    position: relative;
    z-index: 3;
}

/* Tagline — vertical slide with overflow clip */
.hero-tagline-wrap {
    overflow: hidden;
    height: clamp(3.2rem, 7.5vw, 5.4rem);
    margin-bottom: 4px;
}
.hero-title {
    font-family: var(--font-display);
    font-size: clamp(3rem, 7vw, 5rem);
    letter-spacing: 4px;
    line-height: 1;
    opacity: 0;
    transform: translateY(20px);
    animation: heroReveal 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.2s forwards;
}
.hero-line {
    display: inline-block;
    background: linear-gradient(135deg, #fff 30%, #86efac 100%);
    background-size: 100% 100%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease;
}

.hero-sub-wrap { overflow: hidden; margin-bottom: 28px; }
.hero-subtitle {
    color: var(--text-muted);
    font-size: 1.05rem;
    letter-spacing: 0.3px;
    opacity: 0;
    transform: translateY(16px);
    animation: heroReveal 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.4s forwards;
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease;
}

/* Performance — bottom-right corner, clear of candles */
.hero-perf {
    position: absolute;
    bottom: 16px;
    right: 24px;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    background: rgba(10,10,11,0.75);
    backdrop-filter: blur(8px);
    border: 1px solid var(--border);
    border-radius: 8px;
    opacity: 0;
    transform: translateY(8px);
    animation: heroReveal 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.8s forwards;
}
.hero-perf-value {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--green);
    letter-spacing: -0.5px;
    line-height: 1;
}
.hero-perf-meta {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 0.6rem;
    color: var(--text-dim);
    letter-spacing: 0.5px;
}
/* Hero stats strip — live win rate bar below hero */
.hero-stats-strip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 12px 24px;
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    animation: heroReveal 0.6s cubic-bezier(0.16, 1, 0.3, 1) 1.2s both;
}
.hero-stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 0 32px;
}
.hero-stat-value {
    font-family: var(--font-mono);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--green);
    letter-spacing: -0.5px;
}
.hero-stat-label {
    font-size: 0.65rem;
    color: var(--text-dim);
    letter-spacing: 0.8px;
    text-transform: uppercase;
}
.hero-stat-sep {
    width: 1px;
    height: 32px;
    background: var(--border);
}
@media (max-width: 480px) {
    .hero-stat-item { padding: 0 16px; }
    .hero-stat-value { font-size: 1rem; }
}

/* Section divider — breathing room between hero and content */
.section-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border), transparent);
    margin: 8px 0 40px;
}

/* Keyframes */
@keyframes heroReveal {
    to { opacity: 1; transform: translateY(0); }
}

/* Tagline transition states */
.hero-line.slide-out { transform: translateY(-100%); opacity: 0; }
.hero-line.slide-in { transform: translateY(100%); opacity: 0; }
.hero-subtitle.slide-out { transform: translateY(-12px); opacity: 0; }
.hero-subtitle.slide-in { transform: translateY(12px); opacity: 0; }

/* ── DASHBOARD GRID ── */
.dashboard-grid { display: grid; grid-template-columns: 1fr 340px; gap: 32px; }
.opportunities-section { min-width: 0; }
.section-header { margin-bottom: 24px; }
.section-header-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.section-header-top .section-title { margin-bottom: 0; }
.section-title { font-family: var(--font-display); font-size: 1.6rem; letter-spacing: 2px; margin-bottom: 14px; }

/* Market toggle (US / CA) */
.market-toggle { display: flex; gap: 2px; background: var(--card-bg); border: 1px solid var(--border); border-radius: 6px; padding: 2px; }
.market-btn { font-family: var(--font-mono); font-size: 0.65rem; font-weight: 600; padding: 4px 12px; border: none; border-radius: 4px; background: transparent; color: var(--text-dim); cursor: pointer; transition: all 0.2s ease; letter-spacing: 0.5px; }
.market-btn:hover { color: var(--text); }
.market-btn.active { background: var(--accent); color: #000; }
/* Live Accuracy Widget */
.dash-accuracy-bar { align-items: center; gap: 10px; background: rgba(255,255,255,0.03); border: 1px solid var(--border); border-radius: 8px; padding: 7px 12px; margin-bottom: 10px; flex-wrap: wrap; }
.dab-verified { align-items: center; gap: 6px; font-size: 0.75rem; color: var(--text-muted); }
.dab-check { color: #22c55e; flex-shrink: 0; }
.dab-text strong { color: #22c55e; }
.dab-live { align-items: center; gap: 10px; flex: 1; flex-wrap: wrap; }
.dab-stat { display: flex; flex-direction: column; align-items: center; min-width: 46px; }
.dab-val { font-size: 0.82rem; font-weight: 700; color: var(--text); }
.dab-lbl { font-size: 0.65rem; color: var(--text-dim); margin-top: 1px; }
.dab-pos { color: #22c55e; }
.dab-neg { color: #ef4444; }
.dab-sep { width: 1px; height: 24px; background: var(--border); }
.dab-toggle { display: flex; gap: 4px; margin-left: auto; }
.dab-toggle-btn { padding: 3px 8px; border-radius: 5px; font-size: 0.68rem; font-weight: 600; background: transparent; color: var(--text-dim); border: 1px solid var(--border); cursor: pointer; transition: all 0.15s; }
.dab-toggle-btn:hover { background: rgba(255,255,255,0.06); color: var(--text); }
.dab-toggle-btn.active { background: rgba(255,255,255,0.1); color: var(--text); border-color: rgba(255,255,255,0.2); }

.section-context { font-size: 0.75rem; color: var(--text-dim); margin-bottom: 14px; display: none; }
.section-context.visible { display: block; }
.filter-pills { display: flex; gap: 6px; flex-wrap: wrap; }
.export-csv-wrap { display: flex; justify-content: flex-end; margin-top: 8px; }
.export-csv-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 8px; font-size: 0.75rem; font-weight: 600; background: rgba(96,165,250,0.12); color: #60a5fa; border: 1px solid rgba(96,165,250,0.3); cursor: pointer; transition: all 0.2s; }
.export-csv-btn:hover { background: rgba(96,165,250,0.2); border-color: rgba(96,165,250,0.5); }
.pill { padding: 8px 16px; border-radius: 8px; font-size: 0.78rem; font-weight: 600; background: rgba(255,255,255,0.04); color: var(--text-muted); border: 1px solid var(--border); transition: all 0.2s; display: inline-flex; align-items: center; gap: 5px; }
.pill-icon { flex-shrink: 0; opacity: 0.6; }
.pill:hover { background: rgba(255,255,255,0.08); color: var(--text); }
.pill:hover .pill-icon { opacity: 1; }

/* Per-signal active pill colors */
.pill.active { border-color: rgba(255,255,255,0.2); transform: translateY(-1px); }
.pill.active .pill-icon { opacity: 1; }
.pill[data-filter="all"].active { background: rgba(255,255,255,0.1); color: #fff; border-color: rgba(255,255,255,0.2); box-shadow: 0 2px 8px rgba(255,255,255,0.06); }
.pill[data-filter="PLAY"].active { background: rgba(34,197,94,0.15); color: var(--green); border-color: rgba(34,197,94,0.35); box-shadow: 0 2px 12px rgba(34,197,94,0.15); }
.pill[data-filter="WATCH"].active { background: rgba(234,179,8,0.15); color: var(--yellow); border-color: rgba(234,179,8,0.35); box-shadow: 0 2px 12px rgba(234,179,8,0.12); }
.pill[data-filter="DECK"].active { background: rgba(96,165,250,0.15); color: #60a5fa; border-color: rgba(96,165,250,0.35); box-shadow: 0 2px 12px rgba(96,165,250,0.12); }
.pill[data-filter="PASS"].active { background: rgba(239,68,68,0.12); color: var(--red); border-color: rgba(239,68,68,0.3); box-shadow: 0 2px 12px rgba(239,68,68,0.1); }

/* Crypto sector filter row — shown below signal pills when Crypto tab is active */
.crypto-sector-filters { margin-top: 10px; flex-wrap: wrap; }
.crypto-sector-filters .pill.active { background: rgba(251,191,36,0.15); color: #f59e0b; border-color: rgba(251,191,36,0.4); box-shadow: 0 2px 12px rgba(251,191,36,0.12); }

/* Crypto tab styling — amber/gold accent to differentiate from US/CA */
.market-btn[data-market="CRYPTO"].active { background: #f59e0b; color: #000; }

/* Loading state */
.loading-state { text-align: center; padding: 60px 0; color: var(--text-muted); }
.loading-state.hidden { display: none; }
.spinner { width: 32px; height: 32px; margin: 0 auto 12px; border: 3px solid var(--border); border-top-color: var(--green); border-radius: 50%; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ── STOCK CARDS ── */
.cards-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 20px; }
.stock-card { border-radius: 16px; overflow: hidden; cursor: pointer; transition: transform 0.3s, box-shadow 0.3s; }
.stock-card:hover { transform: translateY(-6px) scale(1.02); }
.card-inner { border-radius: 16px; overflow: hidden; position: relative; }
.card-content { position: relative; z-index: 5; }

/* Tier styles */
.stock-card.prime .card-inner, .modal-card.prime { background: linear-gradient(145deg, #1a1815, #0d0b09); box-shadow: 0 0 0 2px rgba(212,175,55,0.4), 0 0 30px rgba(212,175,55,0.12), 0 16px 32px rgba(0,0,0,0.5); }
.stock-card.prime .card-inner::before, .modal-card.prime::before { content:''; position:absolute; inset:0; background: linear-gradient(125deg, transparent 0%, transparent 40%, rgba(212,175,55,0.08) 45%, rgba(255,215,0,0.15) 50%, rgba(212,175,55,0.08) 55%, transparent 60%, transparent 100%); background-size: 200% 200%; animation: shimmer 1.5s ease-in-out 1; pointer-events:none; z-index:10; }
.stock-card.prime .tier-badge, .modal-card.prime .tier-badge { background: linear-gradient(135deg, var(--gold), var(--gold-light)); color: #0a0a0b; }
.stock-card.prime .rating-fill, .modal-card.prime .rating-fill { background: linear-gradient(90deg, var(--gold), var(--gold-light)); }

.stock-card.select .card-inner, .modal-card.select { background: linear-gradient(145deg, #18181a, #0d0d0e); box-shadow: 0 0 0 2px rgba(192,192,192,0.25), 0 0 20px rgba(192,192,192,0.08), 0 16px 32px rgba(0,0,0,0.5); }
.stock-card.select .tier-badge, .modal-card.select .tier-badge { background: linear-gradient(135deg, #a8a8a8, #d4d4d4); color: #0a0a0b; }
.stock-card.select .rating-fill, .modal-card.select .rating-fill { background: linear-gradient(90deg, var(--green), #4ade80); }

.stock-card.standard .card-inner, .modal-card.standard { background: linear-gradient(145deg, #141416, #0a0a0b); box-shadow: 0 0 0 1px var(--border), 0 16px 32px rgba(0,0,0,0.4); }
.stock-card.standard .tier-badge, .modal-card.standard .tier-badge { background: rgba(255,255,255,0.12); color: #999; }
.stock-card.standard .rating-fill, .modal-card.standard .rating-fill { background: linear-gradient(90deg, var(--yellow), #fde047); }

.stock-card.pass .card-inner, .modal-card.pass { background: linear-gradient(145deg, #1a1412, #0d0a09); box-shadow: 0 0 0 1px rgba(239,68,68,0.25), 0 16px 32px rgba(0,0,0,0.4); }
.stock-card.pass .tier-badge, .modal-card.pass .tier-badge { background: var(--red-bg); color: var(--red); }
.stock-card.pass .rating-fill, .modal-card.pass .rating-fill { background: linear-gradient(90deg, var(--red), #f87171); }

@keyframes shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }

/* Card top bar */
.card-top-bar { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; }
.tier-badge { padding: 4px 10px; border-radius: 6px; font-size: 0.55rem; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; }

/* Signal badges */
.signal-badge { padding: 4px 10px; border-radius: 6px; font-size: 0.55rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; display: flex; align-items: center; gap: 5px; }
.signal-badge.play { background: var(--green-bg); color: var(--green); }
.signal-badge.watch { background: var(--yellow-bg); color: var(--yellow); }
.signal-badge.deck { background: var(--blue-bg); color: var(--blue); }
.signal-badge.pass { background: var(--red-bg); color: var(--red); }
.signal-dot { width: 6px; height: 6px; border-radius: 50%; }
.signal-badge.play .signal-dot { background: var(--green); animation: pulse 1.5s ease-in-out infinite; }
.signal-badge.watch .signal-dot { background: var(--yellow); }
.signal-badge.deck .signal-dot { background: var(--blue); }
.signal-badge.pass .signal-dot { background: var(--red); }
@keyframes pulse { 0%,100% { opacity:1; box-shadow: 0 0 0 0 rgba(34,197,94,0.4); } 50% { opacity:0.7; box-shadow: 0 0 0 4px rgba(34,197,94,0); } }

/* Mini chart — iframe is taller than container so TV branding/links are clipped below */
.card-chart { width: 100%; height: 120px; overflow: hidden; position: relative; }
.card-chart iframe { pointer-events: none; width: 100%; height: 220px; border: none; margin-top: -5px; }

/* Card identity — ticker + confidence side by side */
.card-identity {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 4px 14px 0;
}
.card-id-left { display: flex; flex-direction: column; gap: 2px; }
.card-ticker {
    font-family: var(--font-display);
    font-size: 1.6rem;
    letter-spacing: 2px;
    line-height: 1;
    color: #fff;
}
.card-price {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    color: var(--text-muted);
}
.card-change { font-weight: 500; }
.card-change.positive { color: var(--green); }
.card-change.negative { color: var(--red); }

/* Confidence number — the product's IP, visually dominant */
.card-confidence {
    font-family: var(--font-mono);
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    user-select: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}
.card-confidence:hover { opacity: 0.85; }
.conf-num {
    font-size: 2.2rem;
    letter-spacing: -1px;
}
.conf-breakdown-hint {
    font-size: 0.6rem;
    font-family: var(--font-body);
    font-weight: 600;
    color: rgba(255,255,255,0.35);
    width: 14px; height: 14px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,0.2);
    display: flex; align-items: center; justify-content: center;
    line-height: 1;
}

/* Score breakdown popover */
.score-breakdown-tip {
    position: absolute;
    z-index: 9999;
    width: 220px;
    background: #1a1a1f;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 10px;
    padding: 10px 0 6px;
    box-shadow: 0 12px 32px rgba(0,0,0,0.6);
    font-family: var(--font-body);
    display: none;
    pointer-events: none;
}
.score-breakdown-tip.visible { display: block; pointer-events: auto; }
.bd-header {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.4);
    padding: 0 12px 6px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    margin-bottom: 4px;
}
.bd-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 3px 12px;
    font-size: 0.75rem;
}
.bd-pts {
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: 0.78rem;
    width: 36px;
    text-align: right;
    flex-shrink: 0;
}
.bd-pos { color: #22c55e; }
.bd-neg { color: #ef4444; }
.bd-label { color: rgba(255,255,255,0.75); }

/* Pattern type badge — shows detected pattern directly on card */
.card-pattern {
    padding: 2px 14px 4px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.card-pattern-badge {
    font-size: 0.62rem;
    font-family: var(--font-mono);
    font-weight: 600;
    letter-spacing: 0.5px;
    padding: 2px 8px;
    border-radius: 4px;
    background: rgba(34,197,94,0.08);
    color: rgba(34,197,94,0.75);
    border: 1px solid rgba(34,197,94,0.18);
    text-transform: none;
}
.card-pattern-badge.bearish {
    background: rgba(249,115,22,0.1);
    color: var(--orange);
    border-color: rgba(249,115,22,0.3);
}
.card-pattern-wr {
    font-size: 0.58rem;
    font-family: var(--font-mono);
    font-weight: 600;
    letter-spacing: 0.3px;
    padding: 2px 6px;
    border-radius: 3px;
}
.card-pattern-wr.wr-pos { background: rgba(34,197,94,0.08); color: rgba(34,197,94,0.85); border: 1px solid rgba(34,197,94,0.2); }
.card-pattern-wr.wr-neutral { background: rgba(234,179,8,0.08); color: rgba(234,179,8,0.85); border: 1px solid rgba(234,179,8,0.2); }
.card-pattern-wr.wr-neg { background: rgba(239,68,68,0.08); color: rgba(239,68,68,0.8); border: 1px solid rgba(239,68,68,0.2); }

/* Confidence bar — right under identity */
.card-conf-bar { padding: 6px 14px 2px; }
.card-conf-bar .rating-bar { height: 4px; }

/* Rating bar (shared between cards + modal) */
.rating-bar { height: 6px; background: rgba(255,255,255,0.06); border-radius: 3px; overflow: hidden; }
.rating-fill { height: 100%; border-radius: 3px; transition: width 0.6s ease; }
.rating-label { font-size: 0.5rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px; }
.rating-score { font-family: var(--font-mono); font-size: 1.5rem; font-weight: 700; line-height: 1; min-width: 36px; }
.rating-score-max { font-size: 0.6rem; color: var(--text-dim); font-weight: 400; }

/* Card bottom — compact stats row */
.card-bottom { padding: 8px 14px 12px; }
.stats-row {
    display: flex;
    justify-content: space-between;
    padding-top: 8px;
    border-top: 1px solid var(--border);
}
.stat-compact { display: flex; align-items: center; gap: 4px; }
.stat-compact .stat-label { font-size: 0.5rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.5px; }
.stat-compact .stat-value { font-family: var(--font-mono); font-size: 0.72rem; color: #fff; font-weight: 500; }
.stat-compact .stat-value.positive { color: var(--green); }
.stat-compact .stat-value.warning { color: var(--orange); }
.stat-compact .stat-value.negative { color: var(--red); }
.stat-compact .stat-value.neutral { color: var(--text-muted); }

/* R:R ratio line below stats row */
.signal-rr {
    font-size: 11px;
    color: #666;
    margin-top: 4px;
    font-family: 'IBM Plex Mono', monospace;
}
.signal-kelly {
    font-size: 11px;
    color: #666;
    margin-top: 2px;
    font-family: 'IBM Plex Mono', monospace;
}
.signal-earnings-warn {
    display: inline-block;
    margin-top: 4px;
    padding: 1px 7px;
    border-radius: 4px;
    font-size: 10px;
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 600;
    letter-spacing: 0.3px;
    background: rgba(239, 68, 68, 0.15);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.signal-options-chip {
    display: inline-block;
    margin-top: 4px;
    padding: 1px 7px;
    border-radius: 4px;
    font-size: 10px;
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 600;
    letter-spacing: 0.3px;
}
.signal-options-chip.options-bullish {
    background: rgba(34, 197, 94, 0.12);
    color: #22c55e;
    border: 1px solid rgba(34, 197, 94, 0.3);
}
.signal-options-chip.options-bearish {
    background: rgba(239, 68, 68, 0.12);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

/* Institutional ownership chip — shows % held by institutions + score modifier */
.signal-inst-chip {
    display: inline-block;
    margin-top: 4px;
    padding: 1px 7px;
    border-radius: 4px;
    font-size: 10px;
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 600;
    letter-spacing: 0.3px;
}
.signal-inst-chip.inst-high {
    background: rgba(34, 197, 94, 0.12);
    color: #22c55e;
    border: 1px solid rgba(34, 197, 94, 0.3);
}
.signal-inst-chip.inst-mid {
    background: rgba(168, 238, 168, 0.10);
    color: #a3e635;
    border: 1px solid rgba(163, 230, 53, 0.25);
}
.signal-inst-chip.inst-neutral {
    background: rgba(148, 163, 184, 0.10);
    color: #94a3b8;
    border: 1px solid rgba(148, 163, 184, 0.25);
}
.signal-inst-chip.inst-low {
    background: rgba(239, 68, 68, 0.10);
    color: #f87171;
    border: 1px solid rgba(239, 68, 68, 0.25);
}

.signal-velocity-chip {
    display: inline-block;
    margin-top: 4px;
    padding: 1px 7px;
    border-radius: 4px;
    font-size: 10px;
    font-family: 'IBM Plex Mono', monospace;
    font-weight: 600;
    letter-spacing: 0.3px;
}
.signal-velocity-chip.velocity-up {
    background: rgba(34, 197, 94, 0.12);
    color: #22c55e;
    border: 1px solid rgba(34, 197, 94, 0.3);
}
.signal-velocity-chip.velocity-down {
    background: rgba(239, 68, 68, 0.12);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.card-actions-row { display: flex; gap: 10px; align-items: center; margin-top: 4px; }
.card-share-btn { background: none; border: none; color: var(--text-muted); font-size: 0.6rem; cursor: pointer; padding: 4px 0; text-decoration: underline; letter-spacing: 0.4px; }
.card-share-btn:hover { color: var(--text); }
.card-compare-btn { background: none; border: none; color: var(--text-muted); font-size: 0.6rem; cursor: pointer; padding: 4px 0; text-decoration: underline; letter-spacing: 0.4px; }
.card-compare-btn:hover { color: var(--text); }
.card-compare-btn.pinned { color: #22c55e; font-weight: 600; text-decoration: none; }

.card-challenge-btn { background: none; border: 1px solid rgba(245,158,11,0.3); color: #f59e0b; font-size: 0.6rem; cursor: pointer; padding: 3px 8px; border-radius: 4px; letter-spacing: 0.4px; font-weight: 600; }
.card-challenge-btn:hover { background: rgba(245,158,11,0.1); border-color: #f59e0b; }

/* ── OUTCOME BUTTONS + FORM ── */
.card-outcome-btn { background: none; border: 1px solid rgba(139,92,246,0.3); color: #8b5cf6; font-size: 0.6rem; cursor: pointer; padding: 3px 8px; border-radius: 4px; letter-spacing: 0.4px; font-weight: 600; }
.card-outcome-btn:hover { background: rgba(139,92,246,0.1); border-color: #8b5cf6; }
.card-outcome-form { display: flex; gap: 6px; align-items: center; margin-top: 6px; padding: 6px 0; }
.card-outcome-form.hidden { display: none; }
.outcome-exit-input { width: 80px; padding: 4px 8px; background: var(--surface-alt, #1a1a2e); border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-size: 0.65rem; font-family: 'IBM Plex Mono', monospace; }
.outcome-exit-input:focus { outline: none; border-color: #8b5cf6; }
.outcome-exit-input.outcome-input-error { border-color: #ef4444; animation: shake 0.3s ease; }
@keyframes shake { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-3px); } 75% { transform: translateX(3px); } }
.outcome-win-btn { background: rgba(34,197,94,0.15); border: 1px solid rgba(34,197,94,0.4); color: #22c55e; font-size: 0.6rem; font-weight: 700; cursor: pointer; padding: 4px 10px; border-radius: 4px; }
.outcome-win-btn:hover { background: rgba(34,197,94,0.25); }
.outcome-win-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.outcome-loss-btn { background: rgba(239,68,68,0.15); border: 1px solid rgba(239,68,68,0.4); color: #ef4444; font-size: 0.6rem; font-weight: 700; cursor: pointer; padding: 4px 10px; border-radius: 4px; }
.outcome-loss-btn:hover { background: rgba(239,68,68,0.25); }
.outcome-loss-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.outcome-result { font-size: 0.65rem; font-weight: 600; letter-spacing: 0.3px; }
.outcome-result.outcome-win { color: #22c55e; }
.outcome-result.outcome-loss { color: #ef4444; }
.outcome-result.outcome-error { color: #f59e0b; }

/* ── REGIME CHIP (per-card) ── */
.card-regime-chip { font-size: 0.5rem; font-weight: 700; letter-spacing: 0.5px; padding: 2px 6px; border-radius: 3px; margin-left: auto; text-transform: uppercase; }
.regime-chip-risk-off { color: #ef4444; background: rgba(239,68,68,0.12); border: 1px solid rgba(239,68,68,0.25); }
.regime-chip-volatile { color: #f59e0b; background: rgba(245,158,11,0.12); border: 1px solid rgba(245,158,11,0.25); }
.regime-chip-recovery { color: #60a5fa; background: rgba(96,165,250,0.12); border: 1px solid rgba(96,165,250,0.25); }

/* ── WIN RATE STRIP ── */
.win-rate-strip { display: flex; align-items: center; gap: 12px; padding: 8px 16px; margin-bottom: 12px; background: var(--surface-alt, #12121a); border: 1px solid var(--border); border-radius: 8px; flex-wrap: wrap; }
.wrs-label { font-size: 0.65rem; font-weight: 700; color: var(--text-muted); letter-spacing: 0.5px; text-transform: uppercase; }
.wrs-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 0.65rem; font-family: 'IBM Plex Mono', monospace; }
.wrs-tier { font-weight: 700; letter-spacing: 0.3px; }
.wrs-play { color: #22c55e; }
.wrs-watch { color: #f59e0b; }
.wrs-deck { color: #60a5fa; }
.wrs-rate { font-weight: 600; }
.wr-pos { color: #22c55e; }
.wr-neutral { color: #f59e0b; }
.wr-neg { color: #ef4444; }
.wrs-count { color: var(--text-muted); font-size: 0.55rem; }
.wrs-total { padding-left: 8px; border-left: 1px solid var(--border); }

/* ── TRADE CHALLENGER MODAL ── */
.challenger-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.7); z-index: 200; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); }
.challenger-overlay.hidden { display: none; }
.challenger-modal { width: 90%; max-width: 560px; max-height: 85vh; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; overflow-y: auto; padding: 24px; position: relative; }
.challenger-close { position: absolute; top: 12px; right: 16px; background: none; border: none; color: var(--text-muted); font-size: 1.4rem; cursor: pointer; }
.challenger-header h3 { margin: 0 0 4px; font-size: 1.1rem; }
.challenger-sub { color: var(--text-dim); font-size: 0.78rem; margin: 0 0 16px; }
.challenger-verdict { text-align: center; margin-bottom: 20px; }
.cv-badge { display: inline-flex; align-items: center; gap: 8px; padding: 10px 24px; border-radius: 12px; color: #fff; font-weight: 700; font-size: 1rem; letter-spacing: 1px; }
.cv-icon { font-size: 1.2rem; font-weight: 800; }
.challenger-gates { display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; }
.cg-gate { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); border-radius: 10px; padding: 12px; }
.cg-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.cg-name { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-muted); flex: 1; }
.cg-score { font-family: var(--font-mono); font-size: 0.82rem; font-weight: 700; }
.cg-verdict { font-size: 0.6rem; font-weight: 700; padding: 2px 8px; border-radius: 4px; color: #fff; letter-spacing: 0.5px; }
.cg-signals { margin-bottom: 6px; }
.cg-signal { font-size: 0.72rem; color: var(--text-dim); padding: 2px 0; }
.cg-rec { font-size: 0.75rem; color: var(--text-muted); font-style: italic; }
.challenger-summary { padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.06); }
.cs-text { font-size: 0.82rem; color: var(--text-primary); line-height: 1.5; }
.cs-blocks { font-size: 0.75rem; color: var(--red); margin-top: 8px; font-weight: 600; }
[data-theme="light"] .challenger-modal { background: #fff; }
[data-theme="light"] .cg-gate { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); }
@media (max-width: 640px) { .challenger-modal { width: 95%; padding: 16px; } }

/* ── COMPARISON MODAL ── */
.compare-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.75); z-index: 300; display: flex; align-items: center; justify-content: center; padding: 16px; }
.compare-modal-overlay.hidden { display: none; }
.compare-modal { background: var(--surface); border: 1px solid var(--border); border-radius: 20px; width: 100%; max-width: 640px; max-height: 90vh; overflow-y: auto; }
.compare-header { display: flex; justify-content: space-between; align-items: center; padding: 18px 20px 14px; border-bottom: 1px solid var(--border); }
.compare-title { font-family: var(--font-display); font-size: 0.85rem; letter-spacing: 1.5px; color: var(--text); }
.compare-header-actions { display: flex; gap: 10px; align-items: center; }
.cmp-clear-btn { background: none; border: 1px solid var(--border); color: var(--text-muted); font-size: 0.7rem; cursor: pointer; padding: 4px 10px; border-radius: 6px; letter-spacing: 0.5px; }
.cmp-clear-btn:hover { border-color: #ef4444; color: #ef4444; }
.cmp-close-btn { background: none; border: none; color: var(--text-muted); font-size: 1.4rem; cursor: pointer; line-height: 1; padding: 0 4px; }
.cmp-close-btn:hover { color: var(--text); }
.compare-body { padding: 16px 20px 20px; }
.cmp-table { width: 100%; border-collapse: collapse; }
.cmp-table thead th { padding: 6px 8px; }
.cmp-table tbody tr { border-bottom: 1px solid rgba(255,255,255,0.05); }
.cmp-table tbody tr:last-child { border-bottom: none; }
.cmp-label { color: var(--text-muted); font-size: 0.7rem; letter-spacing: 0.5px; text-transform: uppercase; padding: 8px 8px 8px 0; white-space: nowrap; width: 30%; }
.cmp-head { text-align: center; }
.cmp-ticker { font-family: var(--font-display); font-size: 1rem; letter-spacing: 2px; color: var(--text); }
.cmp-cell { text-align: center; font-size: 0.82rem; padding: 8px; color: var(--text); }
.cmp-winner { background: rgba(34, 197, 94, 0.08); border-radius: 6px; }
.cmp-loser { opacity: 0.55; }
.cmp-breakdown { vertical-align: top; }
.cmp-bd-item { display: block; font-size: 0.68rem; margin: 2px 0; }
.cmp-actions { display: flex; gap: 12px; margin-top: 16px; }
.cmp-open-btn { flex: 1; background: none; border: 1px solid var(--border); color: var(--text); font-size: 0.75rem; cursor: pointer; padding: 8px 12px; border-radius: 8px; letter-spacing: 0.5px; }
.cmp-open-btn:hover { border-color: var(--text-muted); }

/* ── SCORE HISTORY SPARKLINE ── */
.card-score-history { display: flex; align-items: flex-end; gap: 4px; margin: 4px 0 2px; height: 24px; }
.spark-label { font-size: 9px; color: var(--text-muted); letter-spacing: 0.5px; text-transform: uppercase; align-self: center; margin-right: 2px; flex-shrink: 0; }
.spark-bars { display: flex; align-items: flex-end; gap: 2px; }
.spark-bar { width: 7px; border-radius: 1px 1px 0 0; min-height: 2px; opacity: 0.85; }
.spark-trend { font-size: 12px; font-weight: 700; align-self: center; margin-left: 2px; }

/* ── SIDEBAR ── */
.sidebar { display: flex; flex-direction: column; gap: 16px; }
.sidebar-card { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 20px; }
.card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.card-header h3 { font-family: var(--font-display); font-size: 1rem; letter-spacing: 1.5px; }

/* Mood */
.mood-source { font-size: 0.65rem; color: var(--text-dim); }
.mood-display { text-align: center; margin-bottom: 12px; }
.mood-value { font-family: var(--font-mono); font-size: 2.5rem; font-weight: 700; }
.mood-label { font-size: 0.85rem; color: var(--text-muted); }
.mood-bar { height: 8px; background: linear-gradient(90deg, var(--red), var(--orange), var(--yellow), var(--green)); border-radius: 4px; position: relative; overflow: hidden; }
.mood-fill { height: 100%; background: transparent; position: relative; }
.mood-fill::after { content:''; position: absolute; right: -2px; top: -3px; width: 4px; height: 14px; background: #fff; border-radius: 2px; box-shadow: 0 0 6px rgba(255,255,255,0.5); }
.mood-scale { display: flex; justify-content: space-between; margin-top: 6px; font-size: 0.6rem; color: var(--text-dim); }
.mood-rec { font-size: 0.75rem; color: var(--text-muted); margin-top: 10px; text-align: center; }
.mood-context { font-family: var(--font-mono); font-size: 0.7rem; color: var(--green); text-align: center; margin-top: 6px; padding-top: 8px; border-top: 1px solid var(--border); letter-spacing: 0.5px; }

/* Watchlist */
.add-btn { width: 28px; height: 28px; border-radius: 8px; background: rgba(255,255,255,0.06); color: var(--text-muted); font-size: 1.1rem; display: flex; align-items: center; justify-content: center; transition: all 0.2s; }
.add-btn:hover { background: rgba(34,197,94,0.15); color: var(--green); }
.watchlist-search-wrap { position: relative; margin-bottom: 10px; }
.watchlist-search { width: 100%; padding: 8px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface-2); color: var(--text); font-size: 0.8rem; font-family: var(--font-body); outline: none; }
.watchlist-search:focus { border-color: var(--green); }
.watchlist-search::placeholder { color: var(--text-dim); }
.watchlist-dropdown { position: absolute; top: 100%; left: 0; right: 0; background: var(--surface-2); border: 1px solid var(--border); border-radius: 8px; max-height: 240px; overflow-y: auto; z-index: 50; margin-top: 4px; box-shadow: 0 8px 24px rgba(0,0,0,0.4); }
.watchlist-dropdown.hidden { display: none; }
.watchlist-dd-item { display: flex; align-items: center; gap: 8px; padding: 10px 12px; cursor: pointer; border-bottom: 1px solid var(--border); transition: background 0.15s; }
.watchlist-dd-item:last-child { border-bottom: none; }
.watchlist-dd-item:hover { background: rgba(34,197,94,0.08); }
.watchlist-dd-ticker { font-family: var(--font-mono); font-weight: 600; font-size: 0.8rem; color: var(--text); min-width: 48px; }
.watchlist-dd-name { font-size: 0.75rem; color: var(--text-muted); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.watchlist-dd-sector { font-size: 0.65rem; color: var(--text-dim); background: var(--surface-3); padding: 2px 6px; border-radius: 4px; }
.watchlist-toggle-row { display: flex; align-items: center; margin-bottom: 10px; }
.toggle-label { display: flex; align-items: center; gap: 8px; font-size: 0.7rem; color: var(--text-muted); cursor: pointer; user-select: none; }
.toggle-label input { display: none; }
.toggle-slider { width: 32px; height: 18px; background: var(--surface-3); border-radius: 9px; position: relative; transition: background 0.2s; flex-shrink: 0; }
.toggle-slider::after { content: ''; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; background: var(--text-dim); border-radius: 50%; transition: transform 0.2s, background 0.2s; }
.toggle-label input:checked + .toggle-slider { background: var(--green-bg); }
.toggle-label input:checked + .toggle-slider::after { transform: translateX(14px); background: var(--green); }
.watchlist-items { display: flex; flex-direction: column; gap: 6px; }
.watchlist-item { display: flex; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--border); gap: 8px; transition: background 0.15s; border-radius: 6px; padding: 8px 6px; margin: 0 -6px; }
.watchlist-item:hover { background: rgba(34,197,94,0.06); }
.watchlist-ticker { font-family: var(--font-mono); font-weight: 600; font-size: 0.8rem; min-width: 44px; }
.watchlist-name { font-size: 0.7rem; color: var(--text-dim); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.watchlist-rating { font-family: var(--font-mono); font-size: 0.65rem; font-weight: 600; padding: 2px 7px; border-radius: 4px; letter-spacing: 0.5px; }
.watchlist-rating.prime { background: var(--gold-bg); color: var(--gold); }
.watchlist-rating.select { background: rgba(160,160,168,0.15); color: #a0a0a8; }
.watchlist-rating.standard { background: var(--surface-3); color: var(--text-muted); }
.watchlist-rating.pass { background: var(--red-bg); color: var(--red); }
.watchlist-rating.loading { background: var(--surface-3); color: var(--text-dim); }
.watchlist-price { font-family: var(--font-mono); font-size: 0.75rem; color: var(--text-muted); }
.watchlist-remove { background: none; color: var(--text-dim); font-size: 0.7rem; padding: 2px 6px; border-radius: 4px; flex-shrink: 0; }
.watchlist-remove:hover { color: var(--red); background: var(--red-bg); }
.watchlist-disclaimer { font-size: 0.6rem; color: var(--text-dim); line-height: 1.4; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); }

/* Legend */
.legend-section { margin-bottom: 14px; }
.legend-section:last-child { margin-bottom: 0; }
.legend-section + .legend-section { padding-top: 12px; border-top: 1px solid var(--border); }
.legend-section-label { font-size: 0.55rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 8px; }
.legend-items { display: flex; flex-direction: column; gap: 10px; }
.legend-items.compact { gap: 6px; }
.legend-item { display: flex; align-items: center; gap: 10px; }
.legend-dot { width: 10px; height: 10px; border-radius: 4px; flex-shrink: 0; }
.legend-dot.gold { background: linear-gradient(135deg, var(--gold), var(--gold-light)); }
.legend-dot.silver { background: linear-gradient(135deg, #a8a8a8, #d4d4d4); }
.legend-dot.bronze { background: rgba(255,255,255,0.15); }
.legend-dot.red { background: var(--red-bg); }
.legend-dot.play { background: var(--green); }
.legend-dot.watch { background: var(--yellow); }
.legend-dot.deck { background: var(--blue); }
.legend-dot.pass { background: var(--red); }
.legend-label { font-size: 0.75rem; font-weight: 600; }
.legend-desc { font-size: 0.65rem; color: var(--text-dim); margin-left: 6px; }

/* ── MODAL ── */
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.85); backdrop-filter: blur(8px); display: flex; align-items: center; justify-content: center; z-index: 200; opacity: 0; visibility: hidden; transition: all 0.3s; padding: 20px; }
.modal-overlay.active { opacity: 1; visibility: visible; }
.modal-card { width: 100%; max-width: 700px; max-height: 90vh; border-radius: 20px; overflow: hidden; position: relative; transform: scale(0.85); transition: transform 0.35s ease; }
.modal-overlay.active .modal-card { transform: scale(1); }
.modal-inner { position: relative; z-index: 5; overflow-y: auto; max-height: 90vh; }
.modal-top-bar { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid var(--border); }
.modal-top-left { display: flex; align-items: center; gap: 10px; }
.close-btn { width: 32px; height: 32px; border-radius: 8px; background: rgba(255,255,255,0.06); color: var(--text-muted); font-size: 1.3rem; display: flex; align-items: center; justify-content: center; transition: all 0.2s; }
.close-btn:hover { background: rgba(255,255,255,0.1); color: #fff; }
.modal-header { padding: 20px 20px 8px; }
.modal-ticker { font-family: var(--font-display); font-size: 2.5rem; letter-spacing: 3px; line-height: 1; }
.modal-company { font-size: 0.8rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 1px; margin-top: 4px; }
.modal-blurb { padding: 8px 20px 16px; }
.modal-blurb p { font-size: 0.88rem; color: var(--text-muted); line-height: 1.6; }

/* Info grid */
.info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 0 20px 16px; }
.info-section { background: rgba(255,255,255,0.02); border: 1px solid var(--border); border-radius: 12px; padding: 14px; transition: border-color 0.2s; }
.info-section.clickable { cursor: pointer; }
.info-section.clickable:hover { border-color: rgba(255,255,255,0.15); }
.info-section-header { display: flex; justify-content: space-between; align-items: center; }
.info-section-title { font-size: 0.55rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 2px; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.info-section-header .info-section-title { flex: 1; }
.info-expand-icon { font-size: 0.65rem; color: var(--text-dim); transition: transform 0.2s; margin-bottom: 10px; }
.info-expand-icon.open { transform: rotate(90deg); }
.info-row { display: flex; justify-content: space-between; align-items: center; padding: 5px 0; }
.info-label { font-size: 0.72rem; color: var(--text-dim); }
.info-value { font-family: var(--font-mono); font-size: 0.78rem; color: #fff; font-weight: 500; }
.info-value.positive { color: var(--green); }
.info-value.negative { color: var(--red); }
.info-value.warning { color: var(--yellow); }
.info-expanded { overflow: hidden; transition: max-height 0.3s ease; }
.info-expanded.hidden { display: none; }
.info-divider { height: 1px; background: var(--border); margin: 8px 0; }
.info-category { font-size: 0.5rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 1.5px; margin: 8px 0 4px; opacity: 0.7; }

/* Company info snapshot */
.modal-company-info { padding: 0 20px 8px; font-size: 0.72rem; color: var(--text-dim); line-height: 1.5; }
.modal-company-info .company-tags { display: flex; gap: 6px; margin-bottom: 6px; flex-wrap: wrap; }
.modal-company-info .company-tag { font-size: 0.6rem; padding: 2px 8px; border-radius: 4px; background: rgba(255,255,255,0.04); border: 1px solid var(--border); color: var(--text-muted); letter-spacing: 0.5px; }
.modal-company-info .company-desc { font-size: 0.72rem; color: var(--text-dim); line-height: 1.5; }

/* Modal chart */
.modal-chart-wrap { padding: 0 20px 16px; }
.modal-chart-wrap iframe { width: 100%; height: 360px; border: none; border-radius: 12px; background: rgba(0,0,0,0.3); }

/* Trade Plan */
.trade-plan { padding: 0 20px 16px; }
.trade-plan-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.trade-plan-title { font-size: 0.85rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px; color: var(--muted); }
.risk-toggle { display: flex; gap: 4px; background: rgba(255,255,255,0.04); border-radius: 8px; padding: 3px; }
.risk-btn { padding: 5px 12px; border: none; border-radius: 6px; background: transparent; color: var(--muted); font-size: 0.7rem; font-weight: 500; cursor: pointer; transition: all 0.2s; letter-spacing: 0.3px; }
.risk-btn:hover { color: var(--text); }
.risk-btn.active[data-risk="conservative"] { background: rgba(34,197,94,0.15); color: #22c55e; }
.risk-btn.active[data-risk="moderate"] { background: rgba(250,204,21,0.15); color: #facc15; }
.risk-btn.active[data-risk="aggressive"] { background: rgba(239,68,68,0.15); color: #ef4444; }

.trade-plan-visual { display: flex; justify-content: space-between; align-items: stretch; gap: 8px; margin-bottom: 16px; position: relative; padding: 12px 0; }
.trade-level { flex: 1; text-align: center; position: relative; z-index: 1; }
.trade-level-label { font-size: 0.6rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 4px; }
.trade-level-price { font-size: 1.1rem; font-weight: 700; font-variant-numeric: tabular-nums; padding: 6px 0; }
.trade-level-sub { font-size: 0.6rem; color: var(--muted); }
.stop-level .trade-level-label, .stop-level .trade-level-price { color: #ef4444; }
.entry-level .trade-level-label { color: var(--muted); }
.entry-level .trade-level-price { color: var(--text); }
.target-level .trade-level-label, .target-level .trade-level-price { color: #22c55e; }
.trade-level-line { display: none; }

.trade-plan-stats { display: flex; gap: 1px; background: var(--border); border-radius: 10px; overflow: hidden; margin-bottom: 10px; }
.tp-stat { flex: 1; padding: 10px 8px; text-align: center; background: var(--surface); }
.tp-stat:first-child { border-radius: 10px 0 0 10px; }
.tp-stat:last-child { border-radius: 0 10px 10px 0; }
.tp-stat.highlight { background: rgba(255,255,255,0.03); }
.tp-stat-label { font-size: 0.6rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 3px; }
.tp-stat-value { font-size: 0.9rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.tp-stat-value.negative { color: var(--red); }
.tp-stat-value.positive { color: var(--green); }
.tp-stat.highlight .tp-stat-value { font-size: 1.05rem; color: var(--text); }

.trade-plan-note { font-size: 0.65rem; color: var(--muted); text-align: center; padding: 4px 0; font-style: italic; }

.rr-legend { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 8px 0 4px; }
.rr-legend-title { font-size: 0.6rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--muted); margin-right: 4px; }
.rr-legend-item { font-size: 0.6rem; font-weight: 500; padding: 2px 8px; border-radius: 4px; }
.rr-legend-item.rr-great { color: #22c55e; background: rgba(34,197,94,0.1); }
.rr-legend-item.rr-solid { color: #4ade80; background: rgba(74,222,128,0.08); }
.rr-legend-item.rr-weak { color: #facc15; background: rgba(250,204,21,0.1); }
.rr-legend-item.rr-bad { color: #ef4444; background: rgba(239,68,68,0.1); }

/* Modal footer */
.modal-footer { padding: 14px 20px; border-top: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; }
.modal-stats { display: flex; gap: 24px; }
.modal-stat { text-align: center; }
.modal-stat-label { font-size: 0.5rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 3px; }
.modal-stat-value { font-family: var(--font-mono); font-size: 0.85rem; font-weight: 500; }
.modal-rating { display: flex; align-items: center; gap: 12px; }
.modal-rating-bar-wrap { display: flex; flex-direction: column; gap: 4px; }

/* ── NEWS ── */
.page-header { margin-bottom: 32px; }
.page-header h1 { font-family: var(--font-display); font-size: 2rem; letter-spacing: 2px; }
.page-header p { color: var(--text-muted); margin-top: 4px; }
.page-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 12px;
    padding: 9px 14px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--surface);
    color: var(--text);
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.page-action-btn:hover { border-color: var(--blue); color: var(--blue); }
.news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }

/* ── EARNINGS CALENDAR ────────────────────────────────── */
.page-subhead { color: var(--text-muted); margin-top: 4px; font-size: 0.9rem; }
.earnings-empty, .earnings-none { text-align: center; padding: 48px 0; color: var(--text-muted); }
.earnings-empty p, .earnings-none p { margin-bottom: 16px; }
.btn-secondary { background: var(--card-bg); border: 1px solid var(--border); color: var(--text-primary); padding: 8px 20px; border-radius: 6px; cursor: pointer; font-size: 0.85rem; }
.btn-secondary:hover { border-color: var(--accent); color: var(--accent); }
.earnings-table-wrap { overflow-x: auto; }
.earnings-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.earnings-table thead th { padding: 10px 14px; text-align: left; color: var(--text-muted); font-weight: 600; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px; border-bottom: 1px solid var(--border); }
.earnings-row { cursor: pointer; transition: background 0.15s; }
.earnings-row:hover { background: rgba(255,255,255,0.04); }
.earnings-row td { padding: 12px 14px; border-bottom: 1px solid rgba(255,255,255,0.06); vertical-align: middle; }
.earn-ticker { font-family: var(--font-display); font-weight: 700; font-size: 1rem; letter-spacing: 0.5px; }
.earn-score { font-weight: 700; color: var(--accent); }
.earn-pattern { color: var(--text-muted); font-size: 0.85rem; }
.earn-chip { display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 0.78rem; font-weight: 700; }
.earn-chip-red    { background: rgba(239,68,68,0.18); color: #ef4444; }
.earn-chip-orange { background: rgba(249,115,22,0.18); color: #f97316; }
.earn-chip-yellow { background: rgba(234,179,8,0.18); color: #eab308; }
.news-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 20px; transition: all 0.2s; }
.news-card:hover { border-color: var(--border-hover); transform: translateY(-2px); }
.news-card a { display: block; }
.news-source { font-size: 0.65rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; }
.news-title { font-size: 0.95rem; font-weight: 600; line-height: 1.4; margin-bottom: 8px; }
.news-summary { font-size: 0.8rem; color: var(--text-muted); line-height: 1.5; margin-bottom: 10px; }
.news-tickers { display: flex; gap: 6px; flex-wrap: wrap; }
.news-ticker-tag { font-family: var(--font-mono); font-size: 0.65rem; padding: 2px 8px; border-radius: 4px; background: rgba(34,197,94,0.1); color: var(--green); }

/* ── LEARN ── */
.levels-grid { display: flex; flex-direction: column; gap: 24px; }
.level-card { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 24px; }
.level-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; cursor: pointer; }
.level-title { font-family: var(--font-display); font-size: 1.2rem; letter-spacing: 1px; }
.level-progress { font-family: var(--font-mono); font-size: 0.75rem; color: var(--text-muted); }
.level-progress-bar { height: 4px; background: rgba(255,255,255,0.06); border-radius: 2px; overflow: hidden; margin-bottom: 16px; }
.level-progress-fill { height: 100%; background: var(--green); border-radius: 2px; transition: width 0.4s; }
.lessons-list { display: flex; flex-direction: column; gap: 8px; }
.lesson-item { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-radius: 10px; background: rgba(255,255,255,0.02); border: 1px solid var(--border); cursor: pointer; transition: all 0.2s; }
.lesson-item:hover { background: rgba(255,255,255,0.04); border-color: var(--border-hover); }
.lesson-item.completed { border-color: rgba(34,197,94,0.2); }
.lesson-item.completed .lesson-check { color: var(--green); }
.lesson-title-text { font-size: 0.85rem; }
.lesson-xp { font-family: var(--font-mono); font-size: 0.7rem; color: var(--text-dim); }
.lesson-check { font-size: 0.85rem; color: var(--text-dim); }

/* Learn toolbar & paths */
.learn-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; gap: 12px; flex-wrap: wrap; }
.glossary-btn { padding: 8px 16px; border-radius: 10px; background: rgba(255,255,255,0.04); border: 1px solid var(--border); color: var(--text-muted); font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.2s; }
.glossary-btn:hover { border-color: var(--green); color: var(--green); }
.learn-stats { display: flex; gap: 20px; margin-bottom: 24px; padding: 16px 20px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; flex-wrap: wrap; }
.learn-stat { display: flex; flex-direction: column; gap: 2px; }
.learn-stat-value { font-family: var(--font-display); font-size: 1.3rem; color: var(--green); }
.learn-stat-label { font-size: 0.7rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 1px; }
.level-card .lessons-list { display: none; flex-direction: column; gap: 8px; }
.level-card.expanded .lessons-list { display: flex; }
.level-path-badge { font-family: var(--font-mono); font-size: 0.6rem; padding: 2px 8px; border-radius: 4px; text-transform: uppercase; letter-spacing: 1px; }
.level-path-badge.beginner { background: rgba(34,197,94,0.1); color: var(--green); }
.level-path-badge.intermediate { background: rgba(234,179,8,0.1); color: var(--yellow, #eab308); }
.level-path-badge.advanced { background: rgba(239,68,68,0.1); color: var(--red, #ef4444); }
.lesson-takeaways { margin-top: 16px; padding: 14px 18px; background: rgba(34,197,94,0.05); border-radius: 10px; border: 1px solid rgba(34,197,94,0.1); }
.lesson-takeaways h4 { font-size: 0.8rem; font-weight: 700; margin-bottom: 8px; color: var(--green); text-transform: uppercase; letter-spacing: 1px; }
.lesson-takeaways li { font-size: 0.82rem; line-height: 1.6; color: var(--text-muted); margin-bottom: 4px; padding-left: 4px; }
.lesson-nav { display: flex; justify-content: space-between; margin-top: 20px; gap: 12px; }
.lesson-nav-btn { padding: 10px 18px; border-radius: 10px; background: rgba(255,255,255,0.04); border: 1px solid var(--border); color: var(--text-muted); font-size: 0.8rem; cursor: pointer; transition: all 0.2s; }
.lesson-nav-btn:hover { border-color: var(--green); color: var(--green); }
.lesson-nav-btn:disabled { opacity: 0.3; cursor: default; }

/* XP celebration */
@keyframes xpPop { 0% { transform: scale(1); } 50% { transform: scale(1.4); color: var(--green); } 100% { transform: scale(1); } }
/* ── GLOSSARY ── */
.glossary-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.7); z-index: 200; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); }
.glossary-overlay.hidden { display: none; }
.glossary-panel { width: 90%; max-width: 600px; max-height: 80vh; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; display: flex; flex-direction: column; overflow: hidden; }
.glossary-header { display: flex; align-items: center; gap: 12px; padding: 18px 20px; border-bottom: 1px solid var(--border); }
.glossary-header h3 { font-family: var(--font-display); font-size: 1.2rem; letter-spacing: 1px; white-space: nowrap; }
.glossary-header input { flex: 1; background: rgba(255,255,255,0.04); border: 1px solid var(--border); border-radius: 8px; padding: 8px 12px; color: var(--text); font-size: 0.85rem; outline: none; }
.glossary-header input:focus { border-color: rgba(34,197,94,0.4); }
.glossary-header .close-btn { background: none; color: var(--text-muted); font-size: 1.5rem; cursor: pointer; padding: 0 4px; }
.glossary-body { overflow-y: auto; padding: 16px 20px; }
.glossary-letter { font-family: var(--font-display); font-size: 1rem; color: var(--green); margin: 16px 0 8px; letter-spacing: 2px; }
.glossary-letter:first-child { margin-top: 0; }
.glossary-term { padding: 10px 14px; border-radius: 8px; background: rgba(255,255,255,0.02); border: 1px solid var(--border); margin-bottom: 6px; }
.glossary-term-name { font-weight: 700; font-size: 0.85rem; margin-bottom: 3px; }
.glossary-term-def { font-size: 0.8rem; color: var(--text-muted); line-height: 1.5; }

/* ── ONBOARDING ── */
.onboarding-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.85); z-index: 300; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(8px); }
.onboarding-overlay.hidden { display: none; }
.onboarding-card { width: 90%; max-width: 480px; background: var(--surface); border: 1px solid var(--border); border-radius: 20px; padding: 40px 32px; text-align: center; }
.onboarding-card h2 { font-family: var(--font-display); font-size: 2rem; letter-spacing: 2px; margin-bottom: 8px; }
.onboarding-card p { font-size: 0.9rem; color: var(--text-muted); margin-bottom: 28px; line-height: 1.5; }
.onboarding-options { display: flex; flex-direction: column; gap: 12px; }
.onboarding-opt { padding: 18px 20px; border-radius: 14px; background: rgba(255,255,255,0.03); border: 1px solid var(--border); cursor: pointer; text-align: left; transition: all 0.2s; }
.onboarding-opt:hover { border-color: var(--green); background: rgba(34,197,94,0.05); }
.onboarding-opt-title { display: block; font-weight: 700; font-size: 0.95rem; margin-bottom: 4px; }
.onboarding-opt-desc { display: block; font-size: 0.8rem; color: var(--text-muted); }

/* ── TOOLTIPS ── */
[data-tooltip] { position: relative; }
[data-tooltip]:hover::after { content: attr(data-tooltip); position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%); padding: 8px 12px; background: rgba(15,15,20,0.95); border: 1px solid var(--border); border-radius: 8px; font-size: 0.72rem; color: var(--text-muted); line-height: 1.4; white-space: nowrap; z-index: 100; pointer-events: none; animation: tooltipIn 0.15s ease; max-width: 260px; white-space: normal; text-align: center; }
@keyframes tooltipIn { from { opacity: 0; transform: translateX(-50%) translateY(4px); } to { opacity: 1; transform: translateX(-50%); } }

/* ── CHAT SUGGESTIONS ── */
.chat-suggestions { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 0; }
.chat-suggestion { padding: 6px 12px; border-radius: 16px; background: rgba(34,197,94,0.08); border: 1px solid rgba(34,197,94,0.2); color: var(--green); font-size: 0.72rem; cursor: pointer; transition: all 0.2s; white-space: nowrap; }
.chat-suggestion:hover { background: rgba(34,197,94,0.15); border-color: var(--green); }

/* ── CHAT ── */
.chat-fab { position: fixed; bottom: 24px; right: 24px; width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(135deg, var(--green), #16a34a); display: flex; align-items: center; justify-content: center; font-size: 1.4rem; cursor: pointer; z-index: 150; box-shadow: 0 4px 20px rgba(34,197,94,0.3); transition: transform 0.2s; }
.chat-fab:hover { transform: scale(1.08); }
.chat-panel { position: fixed; bottom: 90px; right: 24px; width: 380px; max-height: 500px; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; z-index: 150; display: none; flex-direction: column; box-shadow: 0 16px 48px rgba(0,0,0,0.5); overflow: hidden; }
.chat-panel.open { display: flex; animation: slideUp 0.3s ease; }
@keyframes slideUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.chat-header { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; border-bottom: 1px solid var(--border); }
.chat-name { font-weight: 600; font-size: 0.9rem; display: block; }
.chat-status { font-size: 0.7rem; color: var(--green); }
.chat-close { background: none; color: var(--text-muted); font-size: 1.3rem; }
.chat-messages { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; max-height: 340px; }
.chat-msg { max-width: 85%; }
.chat-msg p { padding: 10px 14px; border-radius: 12px; font-size: 0.85rem; line-height: 1.5; }
.chat-msg.assistant p { background: rgba(255,255,255,0.06); border-radius: 12px 12px 12px 4px; }
.chat-msg.user p { background: rgba(34,197,94,0.15); border-radius: 12px 12px 4px 12px; margin-left: auto; }
.chat-msg.user { align-self: flex-end; }
.chat-input-wrap { display: flex; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--border); }
.chat-input-wrap input { flex: 1; background: rgba(255,255,255,0.04); border: 1px solid var(--border); border-radius: 10px; padding: 10px 14px; color: var(--text); font-size: 0.85rem; outline: none; }
.chat-input-wrap input:focus { border-color: rgba(34,197,94,0.4); }
.chat-input-wrap button { width: 40px; height: 40px; border-radius: 10px; background: var(--green); color: #000; font-size: 1.1rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }

/* ── FOOTER ── */
.site-footer { padding: 32px; border-top: 1px solid var(--border); margin-top: 60px; text-align: center; }
.disclaimer { font-size: 0.7rem; color: var(--text-dim); line-height: 1.6; max-width: 800px; margin: 0 auto 12px; }
.copyright { font-size: 0.65rem; color: var(--text-dim); }

/* ── THEME TOGGLE BUTTON ── */
.theme-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--border);
    color: var(--text-muted);
    cursor: pointer;
    transition: all 0.2s;
    font-size: 1rem;
}
.theme-btn:hover {
    background: rgba(255,255,255,0.1);
    color: var(--text);
    border-color: var(--green);
}

/* ── LIGHT MODE ── */
[data-theme="light"] {
    --bg:           #f5f7fa;
    --surface:      #ffffff;
    --surface-2:    #eef0f4;
    --surface-3:    #e2e5eb;
    --border:       rgba(0,0,0,0.08);
    --border-hover: rgba(0,0,0,0.16);
    --text:         #0f1117;
    --text-muted:   #52576a;
    --text-dim:     #8b929e;
}

[data-theme="light"] body {
    background: var(--bg);
    color: var(--text);
}

/* Navbar */
[data-theme="light"] .navbar {
    background: rgba(245,247,250,0.92);
    border-bottom-color: rgba(0,0,0,0.08);
}
[data-theme="light"] .nav-link:hover { background: rgba(0,0,0,0.04); }
[data-theme="light"] .nav-link.active { background: rgba(0,0,0,0.07); color: #0f1117; }
[data-theme="light"] .account-btn { background: rgba(0,0,0,0.05); }
[data-theme="light"] .account-btn:hover { background: rgba(0,0,0,0.09); }
[data-theme="light"] .theme-btn { background: rgba(0,0,0,0.05); }
[data-theme="light"] .theme-btn:hover { background: rgba(0,0,0,0.09); }

/* Ticker tape */
[data-theme="light"] .ticker-tape { background: rgba(245,247,250,0.95); }

/* Hero */
[data-theme="light"] .hero-line {
    background: linear-gradient(135deg, #0f1117 30%, #166534 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
[data-theme="light"] .hero-perf { background: rgba(245,247,250,0.88); }

/* Stock cards — tier overrides */
[data-theme="light"] .stock-card.prime .card-inner,
[data-theme="light"] .modal-card.prime {
    background: linear-gradient(145deg, #fffdf5, #fdf8e1);
    box-shadow: 0 0 0 2px rgba(212,175,55,0.45), 0 0 24px rgba(212,175,55,0.1), 0 12px 28px rgba(0,0,0,0.1);
}
[data-theme="light"] .stock-card.select .card-inner,
[data-theme="light"] .modal-card.select {
    background: linear-gradient(145deg, #fafafa, #f2f2f4);
    box-shadow: 0 0 0 2px rgba(140,140,148,0.3), 0 12px 28px rgba(0,0,0,0.1);
}
[data-theme="light"] .stock-card.standard .card-inner,
[data-theme="light"] .modal-card.standard {
    background: linear-gradient(145deg, #f8f9fb, #f0f2f5);
    box-shadow: 0 0 0 1px rgba(0,0,0,0.08), 0 12px 28px rgba(0,0,0,0.08);
}
[data-theme="light"] .stock-card.pass .card-inner,
[data-theme="light"] .modal-card.pass {
    background: linear-gradient(145deg, #fff8f8, #fdf0f0);
    box-shadow: 0 0 0 1px rgba(239,68,68,0.25), 0 12px 28px rgba(0,0,0,0.08);
}

/* Card text — needs dark color in light mode */
[data-theme="light"] .card-ticker { color: #0f1117; }
[data-theme="light"] .info-value { color: #0f1117; }
[data-theme="light"] .modal-ticker { color: #0f1117; }
[data-theme="light"] .stat-compact .stat-value { color: #0f1117; }

/* Sidebar / surface cards */
[data-theme="light"] .sidebar-card {
    background: #ffffff;
    border-color: rgba(0,0,0,0.08);
}

/* Info sections in modal */
[data-theme="light"] .info-section {
    background: rgba(0,0,0,0.02);
    border-color: rgba(0,0,0,0.08);
}

/* Filter pills */
[data-theme="light"] .pill {
    background: rgba(0,0,0,0.04);
    border-color: rgba(0,0,0,0.1);
    color: var(--text-muted);
}
[data-theme="light"] .pill:hover { background: rgba(0,0,0,0.07); }
[data-theme="light"] .pill[data-filter="all"].active { background: rgba(0,0,0,0.1); color: #0f1117; }

/* Rating bar background */
[data-theme="light"] .rating-bar { background: rgba(0,0,0,0.07); }

/* Trade plan */
[data-theme="light"] .risk-toggle { background: rgba(0,0,0,0.04); }
[data-theme="light"] .tp-stat { background: #ffffff; }

/* Modal overlay */
[data-theme="light"] .modal-overlay { background: rgba(0,0,0,0.5); }

/* Chat panel */
[data-theme="light"] .chat-panel { background: #ffffff; border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .chat-msg.assistant p { background: rgba(0,0,0,0.05); }
[data-theme="light"] .chat-msg.user p { background: rgba(34,197,94,0.12); }
[data-theme="light"] .chat-input-wrap input { background: rgba(0,0,0,0.04); border-color: rgba(0,0,0,0.1); color: #0f1117; }

/* Watchlist */
[data-theme="light"] .watchlist-search { background: #f5f7fa; border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .watchlist-dropdown { background: #ffffff; border-color: rgba(0,0,0,0.1); box-shadow: 0 8px 24px rgba(0,0,0,0.12); }

/* News + Learn cards */
[data-theme="light"] .news-card { background: #ffffff; border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .level-card { background: #ffffff; border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .lesson-item { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .lesson-item:hover { background: rgba(0,0,0,0.04); }

/* Footer */
[data-theme="light"] .site-footer { border-top-color: rgba(0,0,0,0.08); }

/* Loading spinner */
[data-theme="light"] .spinner { border-color: rgba(0,0,0,0.1); border-top-color: var(--green); }

/* Market toggle */
[data-theme="light"] .market-toggle { background: rgba(0,0,0,0.04); border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .market-btn { color: var(--text-dim); }

/* ── ACCOUNT DROPDOWN ── */
.account-menu-wrap { position: relative; }
.account-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 6px;
    min-width: 160px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.35);
    z-index: 1000;
}
.account-dd-name {
    padding: 8px 12px 4px;
    font-size: 0.72rem;
    color: var(--text-dim);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--border);
    margin-bottom: 4px;
}
.account-dd-item {
    display: block;
    width: 100%;
    padding: 9px 12px;
    text-align: left;
    background: none;
    border: none;
    border-radius: 6px;
    color: var(--text);
    font-family: var(--font-body);
    font-size: 0.85rem;
    cursor: pointer;
    transition: background 0.15s;
}
.account-dd-item:hover { background: var(--surface-raised); }
.account-dd-item.signout { color: #ef4444; }

/* ── AUTH MODAL ── */
.auth-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.65);
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(4px);
}
.auth-modal {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 32px 28px 28px;
    width: 100%;
    max-width: 380px;
    position: relative;
    box-shadow: 0 24px 80px rgba(0,0,0,0.5);
}
.auth-modal-close {
    position: absolute;
    top: 14px; right: 16px;
    background: none; border: none;
    color: var(--text-dim);
    font-size: 1.4rem;
    cursor: pointer;
    line-height: 1;
    padding: 4px 8px;
    border-radius: 6px;
    transition: background 0.15s;
}
.auth-modal-close:hover { background: var(--surface-raised); color: var(--text); }
.auth-logo {
    font-family: var(--font-display);
    font-size: 1.4rem;
    letter-spacing: 0.05em;
    color: var(--green);
    margin-bottom: 20px;
}
.auth-tabs {
    display: flex;
    gap: 4px;
    background: var(--surface-raised);
    border-radius: 8px;
    padding: 3px;
    margin-bottom: 24px;
}
.auth-tab {
    flex: 1;
    padding: 7px 0;
    background: none;
    border: none;
    border-radius: 6px;
    color: var(--text-dim);
    font-family: var(--font-body);
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.auth-tab.active {
    background: var(--surface);
    color: var(--text);
    box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}
.auth-form { display: flex; flex-direction: column; gap: 14px; }
.auth-field { display: flex; flex-direction: column; gap: 5px; }
.auth-field-label {
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--text-dim);
    letter-spacing: 0.03em;
}
.auth-hint { font-weight: 400; color: var(--text-muted); font-size: 0.72rem; }
.auth-input {
    background: var(--surface-raised);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 10px 12px;
    color: var(--text);
    font-family: var(--font-mono);
    font-size: 0.85rem;
    outline: none;
    transition: border-color 0.2s;
}
.auth-input:focus { border-color: var(--green); }
.auth-error {
    font-size: 0.78rem;
    color: #ef4444;
    background: rgba(239,68,68,0.08);
    border: 1px solid rgba(239,68,68,0.2);
    border-radius: 6px;
    padding: 8px 10px;
}
.auth-submit {
    margin-top: 4px;
    padding: 11px;
    background: var(--green);
    border: none;
    border-radius: 8px;
    color: #0f1117;
    font-family: var(--font-body);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s;
}
.auth-submit:hover { opacity: 0.88; }
.auth-disclaimer { font-size: 0.68rem; color: var(--text-dim); text-align: center; margin-top: 10px; line-height: 1.4; }

/* ── SET ALERT BUTTON + PANEL ── */
.set-alert-btn-wrap { padding: 0 24px 8px; }
.set-alert-btn {
    width: 100%;
    padding: 11px;
    background: none;
    border: 1px solid var(--green);
    border-radius: 8px;
    color: var(--green);
    font-family: var(--font-body);
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s;
}
.set-alert-btn:hover { background: rgba(34,197,94,0.08); }
.alert-panel {
    margin: 0 24px 16px;
    background: var(--surface-raised);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 16px;
}
.alert-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
}
.alert-panel-title {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text);
}
.alert-panel-close {
    background: none; border: none;
    color: var(--text-dim);
    font-size: 1.2rem;
    cursor: pointer;
    padding: 0 4px;
    line-height: 1;
}
.alert-rows { display: flex; flex-direction: column; gap: 10px; }
.alert-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.alert-label { font-size: 0.8rem; color: var(--text-dim); }
.alert-dir-toggle {
    display: flex;
    gap: 4px;
    background: var(--surface);
    border-radius: 6px;
    padding: 2px;
}
.alert-dir-btn {
    padding: 5px 14px;
    background: none;
    border: none;
    border-radius: 5px;
    color: var(--text-dim);
    font-size: 0.78rem;
    font-family: var(--font-body);
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.alert-dir-btn.active {
    background: var(--green);
    color: #0f1117;
}
.alert-price-input {
    width: 100%;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 9px 12px;
    color: var(--text);
    font-family: var(--font-mono);
    font-size: 0.85rem;
    outline: none;
    transition: border-color 0.2s;
}
.alert-price-input:focus { border-color: var(--green); }
.alert-notify-row { gap: 12px; }
.alert-check {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.8rem;
    color: var(--text-dim);
    cursor: pointer;
}
.alert-check-disabled { opacity: 0.45; cursor: not-allowed; }
.coming-soon-tag {
    font-size: 0.65rem;
    background: var(--border);
    padding: 1px 5px;
    border-radius: 4px;
    color: var(--text-muted);
}
.alert-error {
    font-size: 0.78rem;
    color: #ef4444;
    background: rgba(239,68,68,0.08);
    border: 1px solid rgba(239,68,68,0.2);
    border-radius: 6px;
    padding: 7px 10px;
    margin-top: 4px;
}
.alert-success {
    font-size: 0.78rem;
    color: var(--green);
    margin-top: 4px;
    text-align: center;
}
.alert-submit-btn {
    margin-top: 10px;
    width: 100%;
    padding: 10px;
    background: var(--green);
    border: none;
    border-radius: 8px;
    color: #0f1117;
    font-family: var(--font-body);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s;
}
.alert-submit-btn:hover { opacity: 0.88; }

/* ── STOCK NOTES ── */
/* ── NOTES — open button ── */
.notes-btn-wrap { margin-top: 10px; }
.notes-open-btn {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 14px;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--text-muted);
    font-size: 0.84rem;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    text-align: left;
    transition: border-color 0.18s, color 0.18s, background 0.18s;
}
.notes-open-btn:hover {
    border-color: rgba(34,197,94,0.4);
    color: var(--text);
    background: rgba(34,197,94,0.04);
}
.notes-open-btn svg { flex-shrink: 0; color: var(--green); opacity: 0.7; }
.notes-open-btn:hover svg { opacity: 1; }
.notes-btn-label { flex: 1; }
/* green dot shown when a note already exists for this stock */
.notes-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--green);
    box-shadow: 0 0 6px rgba(34,197,94,0.6);
    flex-shrink: 0;
}

/* ── NOTES — editor panel ── */
.notes-panel {
    margin-top: 10px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
    animation: notesFadeIn 0.18s ease;
}
@keyframes notesFadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: none; }
}
.notes-panel-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 14px 10px;
    border-bottom: 1px solid var(--border);
}
.notes-panel-icon {
    color: var(--green);
    opacity: 0.85;
    flex-shrink: 0;
    display: flex;
}
.notes-panel-title {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    flex: 1;
}
.notes-ticker-badge {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--green);
    background: rgba(34,197,94,0.1);
    border: 1px solid rgba(34,197,94,0.2);
    border-radius: 5px;
    padding: 2px 7px;
    letter-spacing: 0.04em;
}
.notes-panel-close {
    background: none;
    border: none;
    color: var(--text-dim);
    font-size: 1.1rem;
    cursor: pointer;
    padding: 4px;
    line-height: 1;
    border-radius: 6px;
    transition: color 0.15s, background 0.15s;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}
.notes-panel-close:hover { color: var(--text); background: rgba(255,255,255,0.06); }

/* ── NOTES — sentiment tag pills ── */
.notes-tags-row {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 7px 14px 8px;
    border-bottom: 1px solid var(--border);
    flex-wrap: wrap;
}
.notes-tags-hint {
    font-size: 0.67rem;
    color: var(--text-dim);
    font-family: var(--font-mono);
    margin-right: 2px;
    white-space: nowrap;
}
.notes-tag {
    padding: 3px 10px;
    border-radius: 20px;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--text-muted);
    font-size: 0.71rem;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
    line-height: 1.5;
}
.notes-tag:hover             { border-color: rgba(34,197,94,0.45); color: var(--green); background: rgba(34,197,94,0.07); }
.notes-tag-bearish:hover     { border-color: rgba(239,68,68,0.45); color: var(--red); background: rgba(239,68,68,0.07); }
.notes-tag-wait:hover        { border-color: rgba(245,158,11,0.45); color: var(--yellow); background: rgba(245,158,11,0.07); }
.notes-tag-watch:hover       { border-color: rgba(96,165,250,0.45); color: #60a5fa; background: rgba(96,165,250,0.07); }

/* ── NOTES — auto-resize textarea ── */
.notes-textarea {
    width: 100%;
    min-height: 80px;
    overflow-y: hidden;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--border);
    color: var(--text);
    font-family: var(--font-mono);
    font-size: 0.82rem;
    line-height: 1.65;
    padding: 13px 14px;
    resize: none;
    box-sizing: border-box;
    outline: none;
    display: block;
    transition: background 0.15s;
}
.notes-textarea:focus { background: rgba(34,197,94,0.02); }
.notes-textarea::placeholder { color: var(--text-dim); line-height: 1.65; }

/* ── NOTES — footer ── */
.notes-panel-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 7px 14px 9px;
    gap: 8px;
}
.notes-footer-left {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}
.notes-save-status {
    font-size: 0.68rem;
    font-family: var(--font-mono);
    color: var(--text-dim);
    min-height: 1em;
    transition: color 0.25s;
    white-space: nowrap;
}
.notes-save-status.saving { color: var(--text-dim); }
.notes-save-status.saved  { color: var(--green); opacity: 0.85; }
.notes-char-count {
    font-size: 0.67rem;
    font-family: var(--font-mono);
    color: var(--text-dim);
    white-space: nowrap;
    transition: color 0.2s;
}
.notes-char-count.warn  { color: var(--yellow); }
.notes-char-count.limit { color: var(--red); }
.notes-shortcut-hint {
    font-size: 0.63rem;
    font-family: var(--font-mono);
    color: var(--text-dim);
    opacity: 0.5;
    white-space: nowrap;
    flex-shrink: 0;
}
.notes-panel-actions { display: flex; gap: 6px; align-items: center; flex-shrink: 0; }
.notes-save-btn {
    padding: 7px 18px;
    background: var(--green);
    border: none;
    border-radius: 7px;
    color: #000;
    font-size: 0.82rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    letter-spacing: 0.02em;
    transition: opacity 0.15s, transform 0.1s;
}
.notes-save-btn:hover          { opacity: 0.88; }
.notes-save-btn:active         { transform: scale(0.97); }
.notes-save-btn:disabled       { opacity: 0.45; cursor: default; }
.notes-delete-btn {
    padding: 7px 12px;
    background: none;
    border: none;
    border-radius: 7px;
    color: var(--text-dim);
    font-size: 0.82rem;
    font-family: inherit;
    cursor: pointer;
    transition: color 0.15s, background 0.15s;
}
.notes-delete-btn:hover { color: var(--red); background: rgba(239,68,68,0.08); }
.notes-msg {
    font-size: 0.74rem;
    padding: 4px 14px 8px;
}
.notes-msg.error { color: var(--red); }

/* ── NOTES — light mode ── */
[data-theme="light"] .notes-panel         { background: #fff; border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .notes-panel-header  { border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .notes-tags-row      { border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .notes-textarea      { color: #0f1117; border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .notes-textarea:focus { background: rgba(34,197,94,0.03); }
[data-theme="light"] .notes-open-btn      { border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .notes-panel-footer  { border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .notes-tag           { border-color: rgba(0,0,0,0.15); }

/* ── MY ALERTS MODAL ── */
.my-alerts-modal { max-width: 440px; padding: 0; overflow: hidden; }
.my-alerts-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 20px 16px;
    border-bottom: 1px solid var(--border);
}
.my-alerts-title { font-size: 1rem; font-weight: 600; color: var(--text); margin: 0; }
.my-alerts-body { padding: 12px 16px 20px; max-height: 60vh; overflow-y: auto; }
.my-alerts-empty {
    text-align: center;
    color: var(--text-muted);
    font-size: 0.82rem;
    padding: 24px 0;
    line-height: 1.6;
}
.my-alert-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 12px;
    background: var(--surface-raised);
    border-radius: 8px;
    margin-bottom: 6px;
    transition: opacity 0.2s;
}
.my-alert-info { display: flex; align-items: center; gap: 10px; }
.my-alert-ticker { font-family: var(--font-mono); font-weight: 600; font-size: 0.85rem; color: var(--text); }
.my-alert-dir {
    font-size: 0.78rem;
    font-weight: 500;
    padding: 2px 8px;
    border-radius: 4px;
}
.my-alert-dir.above { color: var(--green); background: rgba(34,197,94,0.1); }
.my-alert-dir.below { color: #ef4444; background: rgba(239,68,68,0.1); }
.my-alert-market { font-size: 0.7rem; color: var(--text-muted); }
.my-alert-delete {
    background: none; border: none;
    color: var(--text-muted);
    font-size: 1.1rem;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 4px;
    transition: color 0.15s, background 0.15s;
}
.my-alert-delete:hover { color: #ef4444; background: rgba(239,68,68,0.1); }

/* Light mode overrides for new elements */
[data-theme="light"] .account-dropdown { background: #ffffff; border-color: rgba(0,0,0,0.1); box-shadow: 0 8px 32px rgba(0,0,0,0.14); }
[data-theme="light"] .account-dd-item:hover { background: #f5f7fa; }
[data-theme="light"] .auth-modal { background: #ffffff; border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .auth-tab.active { background: #f5f7fa; }
[data-theme="light"] .auth-input { background: #f5f7fa; border-color: rgba(0,0,0,0.1); color: #0f1117; }
[data-theme="light"] .alert-panel { background: #f5f7fa; border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .alert-price-input { background: #ffffff; border-color: rgba(0,0,0,0.1); color: #0f1117; }
[data-theme="light"] .alert-dir-toggle { background: #ffffff; }
[data-theme="light"] .my-alert-item { background: #f5f7fa; }

/* ── MY NOTES MODAL ── */
.my-note-item {
    background: var(--surface-2);
    border-radius: 10px;
    padding: 13px 14px 11px;
    margin-bottom: 8px;
    border: 1px solid var(--border);
    cursor: pointer;
    transition: border-color 0.18s, background 0.18s;
}
.my-note-item:hover {
    border-color: rgba(34,197,94,0.35);
    background: rgba(34,197,94,0.03);
}
/* "Open stock card →" hint that fades in on hover */
.my-note-open-hint {
    font-size: 0.67rem;
    font-family: var(--font-mono);
    color: var(--green);
    opacity: 0;
    text-align: right;
    margin-top: 6px;
    transition: opacity 0.15s;
}
.my-note-item:hover .my-note-open-hint { opacity: 0.75; }
.my-note-header {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 9px;
}
.my-note-ticker {
    font-family: var(--font-mono);
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--green);
    background: rgba(34,197,94,0.1);
    border: 1px solid rgba(34,197,94,0.2);
    border-radius: 5px;
    padding: 2px 8px;
    letter-spacing: 0.04em;
}
.my-note-market {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--text-dim);
    background: var(--surface-3);
    border-radius: 4px;
    padding: 2px 6px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.my-note-date {
    font-size: 0.68rem;
    color: var(--text-dim);
    margin-left: auto;
    white-space: nowrap;
}
.my-note-delete {
    background: none;
    border: none;
    color: var(--text-dim);
    font-size: 1rem;
    cursor: pointer;
    padding: 2px 5px;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s, background 0.15s;
    flex-shrink: 0;
}
.my-note-delete:hover { color: var(--red); background: rgba(239,68,68,0.1); }
.my-note-content {
    font-family: var(--font-mono);
    font-size: 0.79rem;
    color: var(--text-muted);
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.6;
    max-height: 60px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to bottom, black 50%, transparent 100%);
    mask-image: linear-gradient(to bottom, black 50%, transparent 100%);
}
[data-theme="light"] .my-note-item { background: #f5f7fa; border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .my-note-market { background: #e8eaed; }

/* ── MOBILE NAV HAMBURGER ── */
.nav-hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 36px;
    height: 36px;
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0;
    transition: background 0.2s, border-color 0.2s;
}
.nav-hamburger:hover { background: rgba(255,255,255,0.1); border-color: var(--green); }
.nav-hamburger span {
    display: block;
    width: 16px;
    height: 2px;
    background: var(--text-muted);
    border-radius: 2px;
    transition: transform 0.25s ease, opacity 0.25s ease, background 0.2s;
}
.nav-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); background: var(--text); }
.nav-hamburger.open span:nth-child(2) { opacity: 0; }
.nav-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); background: var(--text); }

/* ── MOBILE NAV DRAWER ── */
.mobile-nav-drawer {
    display: none;
    position: fixed;
    top: 106px; /* ticker (46px) + navbar (60px) */
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(10,10,11,0.97);
    backdrop-filter: blur(20px);
    z-index: 89;
    flex-direction: column;
    padding: 24px 24px 40px;
    gap: 4px;
    overflow-y: auto;
    transform: translateY(-12px);
    opacity: 0;
    transition: opacity 0.22s ease, transform 0.22s ease;
    pointer-events: none;
}
.mobile-nav-drawer.open {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.mobile-nav-link {
    display: block;
    padding: 14px 16px;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 500;
    color: var(--text-muted);
    transition: background 0.15s, color 0.15s;
}
.mobile-nav-link:hover,
.mobile-nav-link.active {
    background: rgba(255,255,255,0.07);
    color: #fff;
}
.mobile-nav-divider {
    height: 1px;
    background: var(--border);
    margin: 12px 0;
}
.mobile-nav-upgrade {
    margin-top: 4px;
    padding: 14px 16px;
    border-radius: 10px;
    background: rgba(34,197,94,0.12);
    border: 1px solid rgba(34,197,94,0.25);
    color: var(--green);
    font-size: 0.95rem;
    font-weight: 600;
    text-align: left;
    transition: background 0.15s, border-color 0.15s;
}
.mobile-nav-upgrade:hover {
    background: rgba(34,197,94,0.2);
    border-color: rgba(34,197,94,0.4);
}

/* ── RESPONSIVE ── */
@media (max-width: 960px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .sidebar { order: -1; }
    .navbar { padding: 0 16px; }
    .main-content { padding: 106px 16px 40px; }
    .hero { min-height: 280px; }
    .hero-glow { width: 500px; }
}
@media (max-width: 768px) {
    .nav-center { display: none; }
    .nav-hamburger { display: flex; }
    .mobile-nav-drawer { display: flex; }
}
@media (max-width: 640px) {
    .stock-card { width: 100%; max-width: 340px; }
    .cards-container { grid-template-columns: 1fr; }
    .info-grid { grid-template-columns: 1fr; }
    .chat-panel { width: calc(100% - 32px); right: 16px; }
}

/* ── LEADERBOARD ── */

/* Signal legend bar */
.lb-legend {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 8px 0;
}
.lb-legend-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 2px 16px 2px 0;
}
.lb-legend-sep {
    width: 1px;
    height: 18px;
    background: var(--border);
    margin: 0 16px 0 0;
    flex-shrink: 0;
}
.lb-legend-badge {
    font-size: 0.65rem !important;
    padding: 2px 6px !important;
}
.lb-legend-icon { font-size: 0.9rem; opacity: 0.6; }
.lb-legend-text {
    font-size: 0.78rem;
    color: var(--text-muted);
    white-space: nowrap;
}
@media (max-width: 700px) {
    .lb-legend-sep { display: none; }
    .lb-legend-item { padding: 2px 0; width: 100%; }
    .lb-legend-text { white-space: normal; }
}
[data-theme="light"] .lb-legend { background: #fff; }

/* Footer note below table */
.lb-footer-note {
    text-align: center;
    font-size: 0.75rem;
    color: var(--text-dim);
    padding: 10px 0 4px;
}

.leaderboard-section {
    max-width: 960px;
    margin: 0 auto 40px;
    padding: 0 24px;
}
.leaderboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    gap: 16px;
    flex-wrap: wrap;
}
.leaderboard-header-left {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.leaderboard-badge {
    font-size: 0.72rem;
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--gold);
    background: var(--gold-bg);
    border: 1px solid rgba(212,175,55,0.3);
    padding: 3px 8px;
    border-radius: 4px;
}
.leaderboard-loading {
    text-align: center;
    padding: 28px;
    color: var(--text-muted);
    font-family: var(--font-mono);
    font-size: 0.85rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
}
.leaderboard-empty {
    text-align: center;
    padding: 32px;
    color: var(--text-dim);
    font-size: 0.88rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
}
.leaderboard-container {
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    background: var(--surface);
}
.leaderboard-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}
.leaderboard-table thead th {
    padding: 10px 14px;
    text-align: left;
    font-family: var(--font-mono);
    font-size: 0.70rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-dim);
    background: var(--surface-2);
    border-bottom: 1px solid var(--border);
    font-weight: 500;
}
.lb-row {
    cursor: pointer;
    border-bottom: 1px solid var(--border);
    transition: background 0.15s;
}
.lb-row:last-child { border-bottom: none; }
.lb-row:hover { background: var(--surface-2); }
.lb-row td { padding: 12px 14px; vertical-align: middle; }
.lb-rank-cell {
    color: var(--text-dim);
    font-family: var(--font-mono);
    font-weight: 600;
    text-align: center;
    width: 36px;
}
.lb-rank { width: 36px; text-align: center; }
/* Gold / silver / bronze top 3 */
.lb-row:nth-child(1) .lb-rank-cell { color: var(--gold); }
.lb-row:nth-child(2) .lb-rank-cell { color: var(--silver); }
.lb-row:nth-child(3) .lb-rank-cell { color: var(--orange); }
.lb-ticker-text {
    font-family: var(--font-mono);
    font-weight: 600;
    color: var(--text);
}
.lb-name-cell { color: var(--text-muted); font-size: 0.83rem; }
.lb-pattern-badge {
    font-size: 0.72rem;
    font-family: var(--font-mono);
    background: var(--surface-3);
    border: 1px solid var(--border);
    padding: 2px 7px;
    border-radius: 4px;
    color: var(--text-muted);
    white-space: nowrap;
}
.lb-conf-col { width: 160px; }
.lb-conf-bar-wrap {
    display: inline-block;
    width: 56px;
    height: 4px;
    background: var(--surface-3);
    border-radius: 2px;
    vertical-align: middle;
    margin-right: 7px;
    overflow: hidden;
}
.lb-conf-bar {
    display: block;
    height: 100%;
    background: var(--green);
    border-radius: 2px;
    min-width: 4px;
}
.lb-conf-num {
    font-family: var(--font-mono);
    font-size: 0.82rem;
    color: var(--green);
    vertical-align: middle;
}
.lb-price-cell {
    font-family: var(--font-mono);
    font-size: 0.85rem;
    white-space: nowrap;
}
.lb-date-cell {
    color: var(--text-dim);
    font-size: 0.82rem;
    white-space: nowrap;
}
@media (max-width: 640px) {
    .lb-hide-sm { display: none; }
    .leaderboard-section { padding: 0 12px; }
}
[data-theme="light"] .leaderboard-container { background: #fff; }
[data-theme="light"] .leaderboard-table thead th { background: #f4f4f5; }
[data-theme="light"] .leaderboard-loading,
[data-theme="light"] .leaderboard-empty { background: #fff; }
[data-theme="light"] .lb-row:hover { background: #f9f9fa; }
[data-theme="light"] .lb-pattern-badge { background: #f0f0f2; }

/* ── TRACK RECORD ──────────────────────────────────────────── */
/* Track Record explainer callout */
/* Track Record tabs */
.tr-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 16px;
    border-bottom: 2px solid rgba(255,255,255,0.08);
}
.tr-tab {
    padding: 10px 20px;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--text-dim);
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}
.tr-tab:hover { color: var(--text-muted); }
.tr-tab.active {
    color: var(--green);
    border-bottom-color: var(--green);
}
[data-theme="light"] .tr-tabs { border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .tr-tab.active { color: #16a34a; border-bottom-color: #16a34a; }
.tr-tab-content.hidden { display: none; }

/* Compact filter bar */
.tr-filters-compact {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 16px;
    padding: 10px 14px;
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 10px;
}
.tr-filters-compact .tr-filter-pills {
    display: flex;
    gap: 2px;
}
.tr-filters-compact .pill {
    padding: 5px 10px;
    font-size: 0.72rem;
}
.tr-select {
    padding: 5px 10px;
    font-size: 0.75rem;
    font-family: var(--font-mono);
    background: rgba(255,255,255,0.05);
    color: var(--text-primary);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    outline: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23888' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 8px center;
    padding-right: 24px;
}
.tr-select:focus { border-color: var(--green); }
.tr-select option { background: #1a1a2e; color: #eee; }
[data-theme="light"] .tr-filters-compact { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .tr-select { background-color: #fff; color: #1a1a2e; border-color: rgba(0,0,0,0.12); }
[data-theme="light"] .tr-select option { background: #fff; color: #1a1a2e; }
.tr-filters-compact .tr-ticker-input {
    padding: 5px 10px;
    font-size: 0.75rem;
    width: 80px;
    border-radius: 6px;
}
@media (max-width: 640px) {
    .tr-tabs { gap: 0; }
    .tr-tab { padding: 8px 14px; font-size: 0.75rem; }
    .tr-filters-compact { gap: 6px; padding: 8px 10px; }
    .tr-filters-compact .pill { padding: 4px 8px; font-size: 0.68rem; }
    .tr-select { font-size: 0.7rem; padding: 4px 20px 4px 8px; }
    .tr-filters-compact .tr-ticker-input { width: 60px; font-size: 0.7rem; }
}

.tr-explainer {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 14px;
    background: rgba(59, 130, 246, 0.07);
    border: 1px solid rgba(59, 130, 246, 0.2);
    border-radius: 8px;
    font-size: 0.82rem;
    color: var(--text-muted);
    margin-bottom: 20px;
    line-height: 1.5;
}
.tr-explainer svg { color: #3b82f6; opacity: 0.7; }

/* Stat cards */
.tr-stat-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}
@media (max-width: 640px) {
    .tr-stat-cards { grid-template-columns: repeat(2, 1fr); }
}
.tr-stat-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 14px 16px;
}
.tr-stat-card-value {
    font-family: var(--font-display);
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--text);
    line-height: 1;
    margin-bottom: 4px;
}
.tr-stat-card-label {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 2px;
}
.tr-stat-card-sub {
    font-size: 0.73rem;
    color: var(--text-dim);
}
[data-theme="light"] .tr-stat-card { background: #fff; }

/* Win rate headline bar */
.tr-winrate-bar {
    background: linear-gradient(135deg, rgba(34,197,94,0.08) 0%, rgba(34,197,94,0.04) 100%);
    border: 1px solid rgba(34,197,94,0.25);
    border-radius: 12px;
    padding: 16px 20px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}
.tr-winrate-bar-label {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--green);
    letter-spacing: 1px;
    text-transform: uppercase;
    white-space: nowrap;
    flex-shrink: 0;
}
.tr-winrate-bar-stats {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-family: var(--font-mono);
    font-size: 0.82rem;
}
.tr-winrate-rate {
    font-family: var(--font-display);
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--green);
    line-height: 1;
}
.tr-winrate-sep {
    color: rgba(255,255,255,0.15);
    font-size: 0.75rem;
}
.tr-winrate-stat {
    color: var(--text-muted);
    font-size: 0.82rem;
}
.tr-winrate-pos { color: var(--green); }
.tr-winrate-neg { color: var(--red); }
.tr-winrate-note {
    margin-left: auto;
    font-size: 0.72rem;
    color: var(--text-dim);
    white-space: nowrap;
    flex-shrink: 0;
}
[data-theme="light"] .tr-winrate-bar {
    background: linear-gradient(135deg, rgba(34,197,94,0.06) 0%, rgba(34,197,94,0.02) 100%);
}
.tr-winrate-patterns {
    font-size: 0.72rem;
    color: var(--text-dim);
    margin-top: 0.2rem;
    width: 100%;
}
.tr-winrate-pattern {
    white-space: nowrap;
}
.tr-winrate-pct-note {
    color: var(--text-muted, rgba(255,255,255,0.3));
    font-size: 0.68rem;
}
@media (max-width: 640px) {
    .tr-winrate-note { display: none; }
    .tr-winrate-bar { flex-wrap: wrap; }
}

/* Pattern Backtest Table */
.backtest-section {
    margin-bottom: 20px;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 12px;
    overflow: hidden;
}
.backtest-header {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 12px 16px 10px;
    background: rgba(255,255,255,0.03);
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.backtest-title {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--text-muted);
}
.backtest-subtitle {
    font-size: 0.72rem;
    color: var(--text-dim);
}
.backtest-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}
.backtest-table thead th {
    padding: 8px 14px;
    text-align: left;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--text-dim);
    background: rgba(255,255,255,0.02);
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.backtest-table tbody td {
    padding: 9px 14px;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    font-family: var(--font-mono);
    color: var(--text-primary);
}
.backtest-table tbody tr:last-child td { border-bottom: none; }
.backtest-table tbody tr:hover { background: rgba(255,255,255,0.02); }
.backtest-wr-pos { color: var(--green); font-weight: 600; }
.backtest-wr-neg { color: var(--red); font-weight: 600; }
.backtest-wr-neutral { color: var(--text-muted); font-weight: 600; }
.backtest-ret-pos { color: var(--green); }
.backtest-ret-neg { color: var(--red); }
.backtest-n { color: var(--text-dim); font-size: 0.75rem; }
[data-theme="light"] .backtest-section { border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .backtest-header { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .backtest-table thead th { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .backtest-table tbody td { border-color: rgba(0,0,0,0.04); }
@media (max-width: 640px) {
    .backtest-table thead th:nth-child(n+4),
    .backtest-table tbody td:nth-child(n+4) { display: none; }
}

/* ── Walk-Forward Backtest ────────────────────────────── */
.wf-controls {
    display: flex;
    gap: 20px;
    padding: 10px 16px;
    flex-wrap: wrap;
}
.wf-chart-container {
    position: relative;
    width: 100%;
    padding: 0 16px 16px;
    box-sizing: border-box;
}
.wf-chart-container canvas {
    width: 100%;
    border-radius: 8px;
}
.wf-tooltip {
    position: absolute;
    background: rgba(20, 20, 40, 0.95);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 0.72rem;
    font-family: var(--font-mono);
    color: var(--text-primary);
    pointer-events: none;
    z-index: 10;
    white-space: nowrap;
}
.wf-stats {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 10px;
    padding: 0 16px 16px;
}
.wf-stat-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 8px;
    padding: 12px 14px;
    text-align: center;
}
.wf-stat-value {
    font-size: 1.1rem;
    font-weight: 700;
    font-family: var(--font-mono);
    color: var(--text-primary);
    margin-bottom: 2px;
}
.wf-stat-label {
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--text-dim);
}
.wf-stat-pos { color: var(--green); }
.wf-stat-neg { color: var(--red); }
.wf-ticker-list {
    padding: 0 16px 16px;
}
.wf-ticker-table tbody tr {
    cursor: pointer;
}
.wf-ticker-table tbody tr:hover {
    background: rgba(255,255,255,0.05);
}
.wf-drilldown {
    margin-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.08);
    padding-top: 10px;
}
.wf-drill-close {
    font-size: 0.7rem;
    cursor: pointer;
    margin-left: auto;
}
.wf-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 40px 16px;
    color: var(--text-muted);
    font-size: 0.85rem;
}
.wf-loading .spinner {
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255,255,255,0.1);
    border-top-color: var(--green);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Light theme overrides */
[data-theme="light"] .wf-stat-card { background: rgba(0,0,0,0.02); border-color: rgba(0,0,0,0.06); }
[data-theme="light"] .wf-tooltip { background: rgba(255,255,255,0.95); border-color: rgba(0,0,0,0.12); color: #1a1a2e; }
[data-theme="light"] .wf-drilldown { border-color: rgba(0,0,0,0.08); }

/* Mobile */
@media (max-width: 640px) {
    .wf-stats { grid-template-columns: repeat(2, 1fr); }
    .wf-controls { flex-direction: column; gap: 8px; }
    .wf-ticker-table thead th:nth-child(n+4),
    .wf-ticker-table tbody td:nth-child(n+4) { display: none; }
}

/* Conf cell and market flag in ticker cell */
.tr-conf-cell {
    font-family: var(--font-mono);
    font-size: 0.83rem;
    color: var(--text-muted);
}
.tr-market-flag {
    font-size: 0.85em;
    margin-left: 4px;
    opacity: 0.8;
}

.tr-filter-group {
    display: flex;
    align-items: center;
    gap: 10px;
}
.tr-filter-label {
    font-size: 0.78rem;
    color: var(--text-dim);
    font-weight: 500;
    white-space: nowrap;
}
.tr-filter-pills {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.tr-ticker-input {
    background: var(--surface-raised);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 5px 10px;
    color: var(--text);
    font-family: var(--font-mono);
    font-size: 0.82rem;
    outline: none;
    width: 90px;
    transition: border-color 0.2s;
}
.tr-ticker-input:focus { border-color: var(--green); }
.tr-stats-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-bottom: 16px;
    font-size: 0.85rem;
    flex-wrap: wrap;
}
.tr-stat {
    font-family: var(--font-mono);
    font-size: 0.83rem;
    color: var(--text-muted);
}
.tr-stat-pos { color: var(--green); }
.tr-stat-neg { color: var(--red); }
.tr-stat-divider { color: var(--border); }
.tr-return-pos {
    color: var(--green);
    font-weight: 600;
}
.tr-return-neg {
    color: var(--red);
    font-weight: 600;
}
.tr-return-flat { color: var(--text-dim); }
[data-theme="light"] .tr-stats-bar { background: #fff; }

/* Signal status badges */
.tr-status-badge {
    display: inline-block;
    font-size: 0.72rem;
    font-family: var(--font-mono);
    font-weight: 500;
    padding: 3px 8px;
    border-radius: 4px;
    white-space: nowrap;
}
.tr-status-active {
    background: rgba(34, 197, 94, 0.15);
    color: var(--green);
    border: 1px solid rgba(34, 197, 94, 0.3);
}
.tr-status-late {
    background: rgba(251, 146, 60, 0.15);
    color: #fb923c;
    border: 1px solid rgba(251, 146, 60, 0.3);
}
.tr-status-expired {
    background: rgba(148, 163, 184, 0.1);
    color: var(--text-dim);
    border: 1px solid rgba(148, 163, 184, 0.2);
}


/* ── INTELLIGENCE PAGE ───────────────────────────────────────────── */
.regime-banner {
    margin: 0 0 24px 0;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(15,23,42,0.6);
    overflow: hidden;
}
.regime-banner-inner {
    padding: 20px 24px;
}
.regime-label-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
/* Regime pill in dashboard Opportunities header */
.regime-header-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 99px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
    border: 1px solid;
}
.regime-header-pill.uptrend       { color: #22c55e; border-color: rgba(34,197,94,0.3); background: rgba(34,197,94,0.1); }
.regime-header-pill.caution       { color: #f59e0b; border-color: rgba(245,158,11,0.3); background: rgba(245,158,11,0.1); }
.regime-header-pill.bear          { color: #ef4444; border-color: rgba(239,68,68,0.3); background: rgba(239,68,68,0.1); }
.regime-header-pill.extreme-fear  { color: #f87171; border-color: rgba(248,113,113,0.4); background: rgba(248,113,113,0.12); }
.regime-header-pill.regime-trending  { color: #22c55e; border-color: rgba(34,197,94,0.3); background: rgba(34,197,94,0.1); }
.regime-header-pill.regime-volatile  { color: #f59e0b; border-color: rgba(245,158,11,0.3); background: rgba(245,158,11,0.1); }
.regime-header-pill.regime-riskoff   { color: #ef4444; border-color: rgba(239,68,68,0.3); background: rgba(239,68,68,0.1); }
.regime-header-pill.regime-recovery  { color: #60a5fa; border-color: rgba(96,165,250,0.3); background: rgba(96,165,250,0.1); }
.regime-conf { opacity: 0.6; font-size: 0.65rem; }
.regime-header-pill::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
}

.regime-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}
.regime-dot.trending  { background: #22c55e; box-shadow: 0 0 8px rgba(34,197,94,0.5); }
.regime-dot.volatile  { background: #f59e0b; box-shadow: 0 0 8px rgba(245,158,11,0.5); }
.regime-dot.risk_off  { background: #ef4444; box-shadow: 0 0 8px rgba(239,68,68,0.5); }
.regime-dot.recovery  { background: #38bdf8; box-shadow: 0 0 8px rgba(56,189,248,0.5); }
.regime-label {
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.regime-rationale {
    color: var(--text-dim);
    font-size: 0.875rem;
    margin: 0 0 12px 0;
    line-height: 1.5;
}
.regime-thresholds {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.75rem;
}
.regime-threshold-tag {
    padding: 3px 10px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.04);
    color: var(--text-dim);
    white-space: nowrap;
}

.intel-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
}
.intel-market-toggle {
    margin-left: auto;
    display: flex;
    gap: 4px;
}
@media (max-width: 640px) {
    .intel-filters { flex-direction: column; align-items: flex-start; gap: 10px; }
    .intel-market-toggle { margin-left: 0; }
}

/* Intelligence brief cards — extends base .signal-card */
.intel-card {
    position: relative;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 12px;
    background: rgba(15,23,42,0.7);
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: border-color 0.2s, transform 0.2s;
    cursor: pointer;
}
.intel-card:hover {
    border-color: rgba(255,255,255,0.18);
    transform: translateY(-2px);
}
.intel-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.intel-card-ticker {
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: 0.05em;
}
.intel-card-name {
    font-size: 0.75rem;
    color: var(--text-dim);
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.intel-regime-context {
    font-size: 0.8rem;
    color: #94a3b8;
    line-height: 1.45;
    padding: 8px 10px;
    background: rgba(255,255,255,0.03);
    border-left: 2px solid rgba(255,255,255,0.12);
    border-radius: 0 6px 6px 0;
}
.intel-action {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--text);
}
.intel-sizing {
    font-size: 0.72rem;
    color: var(--text-dim);
    font-family: 'IBM Plex Mono', monospace;
}
.intel-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 2px;
}
.intel-badge {
    font-size: 0.68rem;
    padding: 2px 7px;
    border-radius: 4px;
    font-family: 'IBM Plex Mono', monospace;
    background: rgba(255,255,255,0.06);
    color: var(--text-dim);
    border: 1px solid rgba(255,255,255,0.08);
}
.intel-badge.pocket-pivot {
    background: rgba(34,197,94,0.12);
    color: #4ade80;
    border-color: rgba(34,197,94,0.25);
}
.intel-badge.tight {
    background: rgba(56,189,248,0.1);
    color: #38bdf8;
    border-color: rgba(56,189,248,0.25);
}
.intel-badge.bear-regime {
    background: rgba(239,68,68,0.1);
    color: #f87171;
    border-color: rgba(239,68,68,0.25);
}
.intel-badge.tight-base {
    background: rgba(251,191,36,0.12);
    color: #fbbf24;
    border-color: rgba(251,191,36,0.3);
}

/* ── Portfolio / Challenger / Monitor ────────────────────── */
.port-tabs { display:flex; gap:8px; margin-bottom:24px; }
.port-tab { padding:8px 20px; border-radius:20px; border:1px solid var(--border); background:transparent; color:var(--text-muted); cursor:pointer; font-size:0.85rem; transition:all .15s; }
.port-tab.active { background:var(--accent); color:#000; border-color:var(--accent); font-weight:600; }
.port-tab-content.hidden { display:none; }

.tool-card { background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:24px; margin-bottom:20px; }
.tool-card-title { font-size:1rem; font-weight:600; color:var(--text); margin:0 0 8px; }
.tool-card-desc { font-size:0.82rem; color:var(--text-muted); margin:0 0 20px; line-height:1.5; }
.tool-form { display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end; }
.tool-field { display:flex; flex-direction:column; gap:4px; min-width:140px; }
.tool-field-wide { flex:1; min-width:260px; }
.tool-field label { font-size:0.75rem; color:var(--text-muted); font-weight:500; }
.tool-hint { font-size:0.7rem; color:var(--text-muted); opacity:.7; }
.tool-field input, .tool-field select { background:var(--bg); border:1px solid var(--border); border-radius:8px; color:var(--text); padding:8px 12px; font-size:0.85rem; outline:none; }
.tool-field input:focus, .tool-field select:focus { border-color:var(--accent); }
.tool-btn { padding:9px 24px; background:var(--accent); color:#000; border:none; border-radius:8px; font-weight:600; font-size:0.85rem; cursor:pointer; white-space:nowrap; transition:opacity .15s; }
.tool-btn:hover { opacity:.85; }
.tool-btn:disabled { opacity:.4; cursor:not-allowed; }
.tool-results { margin-top:8px; }

/* Monitor results */
.mon-regime-row { display:flex; align-items:center; gap:10px; padding:14px 18px; background:var(--card-bg); border:1px solid var(--border); border-radius:10px; margin-bottom:16px; }
.mon-regime-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.mon-regime-dot.trending { background:#22c55e; }
.mon-regime-dot.volatile { background:#f59e0b; }
.mon-regime-dot.risk_off { background:#ef4444; }
.mon-regime-dot.recovery { background:#3b82f6; }
.mon-regime-label { font-weight:600; font-size:0.9rem; }
.mon-regime-rationale { font-size:0.78rem; color:var(--text-muted); flex:1; }
.mon-var-badge { font-size:0.75rem; padding:3px 10px; border-radius:12px; background:rgba(245,158,11,0.12); color:#f59e0b; border:1px solid rgba(245,158,11,0.25); }

.alert-list { display:flex; flex-direction:column; gap:8px; margin-bottom:16px; }
.alert-item { display:flex; gap:12px; align-items:flex-start; padding:12px 16px; border-radius:10px; border:1px solid; }
.alert-item.critical { background:rgba(239,68,68,0.07); border-color:rgba(239,68,68,0.25); }
.alert-item.warning { background:rgba(245,158,11,0.07); border-color:rgba(245,158,11,0.2); }
.alert-badge { font-size:0.68rem; font-weight:700; padding:2px 8px; border-radius:10px; white-space:nowrap; margin-top:1px; }
.alert-item.critical .alert-badge { background:rgba(239,68,68,0.15); color:#f87171; }
.alert-item.warning .alert-badge { background:rgba(245,158,11,0.15); color:#fbbf24; }
.alert-msg { font-size:0.82rem; color:var(--text); line-height:1.4; }
.mon-healthy { padding:14px 18px; background:rgba(34,197,94,0.07); border:1px solid rgba(34,197,94,0.2); border-radius:10px; color:#4ade80; font-size:0.85rem; font-weight:500; }

/* Challenger results */
.chal-verdict { display:flex; align-items:center; gap:12px; padding:18px 20px; border-radius:12px; margin-bottom:20px; border:1px solid; }
.chal-verdict.proceed { background:rgba(34,197,94,0.08); border-color:rgba(34,197,94,0.25); }
.chal-verdict.caution { background:rgba(245,158,11,0.08); border-color:rgba(245,158,11,0.25); }
.chal-verdict.block { background:rgba(239,68,68,0.08); border-color:rgba(239,68,68,0.25); }
.chal-verdict-badge { font-size:1rem; font-weight:700; padding:4px 16px; border-radius:20px; white-space:nowrap; }
.proceed .chal-verdict-badge { background:rgba(34,197,94,0.15); color:#4ade80; }
.caution .chal-verdict-badge { background:rgba(245,158,11,0.15); color:#fbbf24; }
.block .chal-verdict-badge { background:rgba(239,68,68,0.15); color:#f87171; }
.chal-verdict-summary { font-size:0.83rem; color:var(--text); line-height:1.5; }

.gate-list { display:flex; flex-direction:column; gap:8px; }
.gate-item { display:flex; align-items:flex-start; gap:12px; padding:12px 16px; background:var(--card-bg); border:1px solid var(--border); border-radius:10px; }
.gate-dot { width:8px; height:8px; border-radius:50%; margin-top:5px; flex-shrink:0; }
.gate-dot.pass { background:#22c55e; }
.gate-dot.caution { background:#f59e0b; }
.gate-dot.block { background:#ef4444; }
.gate-name { font-size:0.78rem; font-weight:600; color:var(--text-muted); min-width:110px; }
.gate-reason { font-size:0.82rem; color:var(--text); line-height:1.4; flex:1; }
.gate-score { font-size:0.72rem; color:var(--text-muted); white-space:nowrap; }

/* ── SUBSCRIPTION TIER BADGE (nav) ──────────────────────────────────────── */
.tier-badge-nav {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    cursor: pointer;
    border: 1px solid;
    transition: opacity 0.15s;
    white-space: nowrap;
}
.tier-badge-nav:hover { opacity: 0.8; }
.tier-badge-nav.free { background: rgba(113,113,122,0.12); color: var(--text-muted); border-color: rgba(113,113,122,0.25); }
.tier-badge-nav.pro { background: rgba(34,197,94,0.12); color: var(--green); border-color: rgba(34,197,94,0.3); }
.tier-badge-nav.elite { background: rgba(212,175,55,0.12); color: var(--gold); border-color: rgba(212,175,55,0.3); }

.nav-upgrade-btn {
    display: none;
    padding: 5px 14px;
    background: var(--gold);
    color: #0a0a0b;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.3px;
    cursor: pointer;
    border: none;
    transition: opacity 0.15s;
    white-space: nowrap;
}
.nav-upgrade-btn:hover { opacity: 0.88; }
.nav-upgrade-btn.visible { display: inline-block; }

/* ── TIER LIMIT BANNER ───────────────────────────────────────────────────── */
.tier-limit-banner {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 12px 0 0;
    padding: 12px 18px;
    background: rgba(212,175,55,0.07);
    border: 1px solid rgba(212,175,55,0.22);
    border-radius: 10px;
    flex-wrap: wrap;
}
.tier-limit-banner.visible { display: flex; }
.tier-limit-text {
    font-size: 0.83rem;
    color: var(--text-muted);
    line-height: 1.4;
}
.tier-limit-text strong { color: var(--text); }
.tier-limit-cta {
    padding: 7px 18px;
    background: var(--gold);
    color: #0a0a0b;
    border: none;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity 0.15s;
    flex-shrink: 0;
}
.tier-limit-cta:hover { opacity: 0.88; }

/* ── PRICING MODAL ──────────────────────────────────────────────────────── */
.pricing-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.72);
    z-index: 300;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
}
.pricing-overlay.active { opacity: 1; visibility: visible; }

.pricing-modal {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 20px;
    width: 100%;
    max-width: 800px;
    max-height: 90vh;
    overflow-y: auto;
    padding: 32px;
    position: relative;
}
.pricing-modal-close {
    position: absolute;
    top: 16px;
    right: 20px;
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.4rem;
    cursor: pointer;
    line-height: 1;
    padding: 4px 8px;
    transition: color 0.15s;
}
.pricing-modal-close:hover { color: var(--text); }

.pricing-header { text-align: center; margin-bottom: 28px; }
.pricing-title {
    font-family: var(--font-display);
    font-size: 1.8rem;
    letter-spacing: 1px;
    color: var(--text);
    margin-bottom: 6px;
}
.pricing-subtitle { font-size: 0.85rem; color: var(--text-muted); line-height: 1.5; }
.pricing-anchor {
    margin-top: 8px;
    font-size: 0.78rem;
    color: var(--text-dim);
    background: rgba(255,255,255,0.03);
    border-radius: 6px;
    padding: 6px 12px;
    display: inline-block;
}
.pricing-anchor strong { color: var(--green); }

.pricing-cols {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
    margin-bottom: 20px;
}
@media (max-width: 640px) {
    .pricing-cols { grid-template-columns: 1fr; }
    .pricing-modal { padding: 20px 16px; }
}

.pricing-col {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 24px 20px;
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
    transition: border-color 0.2s;
}
.pricing-col.recommended {
    border-color: var(--gold);
    background: rgba(212,175,55,0.04);
}
.pricing-recommended-badge {
    display: none;
    position: absolute;
    top: -11px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--gold);
    color: #0a0a0b;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    padding: 3px 12px;
    border-radius: 10px;
    white-space: nowrap;
}
.pricing-col.recommended .pricing-recommended-badge { display: block; }

.pricing-tier-name {
    font-family: var(--font-display);
    font-size: 1.1rem;
    letter-spacing: 0.5px;
    color: var(--text);
    margin-bottom: 4px;
}
.pricing-price {
    font-family: var(--font-mono);
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 2px;
}
.pricing-price span { font-size: 0.8rem; color: var(--text-muted); font-weight: 400; }
.pricing-tagline { font-size: 0.75rem; color: var(--text-muted); margin-bottom: 20px; min-height: 32px; line-height: 1.4; }

.pricing-features {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 24px;
    flex: 1;
}
.pricing-feature {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 0.8rem;
    color: var(--text);
    line-height: 1.35;
}
.pricing-feature .feat-icon { flex-shrink: 0; margin-top: 1px; font-size: 0.75rem; font-weight: 700; }
.pricing-feature.included .feat-icon { color: var(--green); }
.pricing-feature.excluded .feat-icon { color: var(--text-dim); }
.pricing-feature.excluded { color: var(--text-dim); }

.pricing-cta {
    width: 100%;
    padding: 11px;
    border-radius: 10px;
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    border: 1px solid;
    transition: opacity 0.15s, background 0.15s;
}
.pricing-cta:hover { opacity: 0.88; }
.pricing-cta.free-cta { background: transparent; color: var(--text-muted); border-color: var(--border); cursor: default; }
.pricing-cta.pro-cta { background: var(--gold); color: #0a0a0b; border-color: var(--gold); }
.pricing-cta.elite-cta { background: transparent; color: var(--gold); border-color: var(--gold); }
.pricing-cta:disabled { opacity: 0.45; cursor: not-allowed; }

.pricing-loading-msg {
    display: none;
    text-align: center;
    font-size: 0.8rem;
    color: var(--text-muted);
    margin-top: 8px;
}
.pricing-loading-msg.visible { display: block; }
.pricing-error-msg {
    display: none;
    text-align: center;
    font-size: 0.8rem;
    color: var(--orange);
    margin-top: 8px;
    line-height: 1.5;
}
.pricing-error-msg.visible { display: block; }

/* ── PRICING PAGE ─────────────────────────────────────────────────────────── */
.pricing-page-hero {
    text-align: center;
    padding: 48px 24px 32px;
    max-width: 720px;
    margin: 0 auto;
}
.pricing-page-anchor {
    display: inline-block;
    font-size: 0.78rem;
    color: var(--text-muted);
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 5px 14px;
    margin-bottom: 20px;
}
.pricing-page-anchor strong { color: var(--green); }
.pricing-page-title {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 2.8rem;
    letter-spacing: 0.04em;
    color: var(--text);
    margin: 0 0 10px;
}
.pricing-page-sub {
    font-size: 0.9rem;
    color: var(--text-muted);
    line-height: 1.5;
}
.pricing-page-cols {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
    max-width: 900px;
    margin: 0 auto 48px;
    padding: 0 24px;
}
@media (max-width: 768px) {
    .pricing-page-cols { grid-template-columns: 1fr; max-width: 420px; }
    .pricing-page-title { font-size: 2rem; }
}

/* Hero testimonials strip */
.hero-testimonials {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    max-width: 900px;
    margin: 0 auto 32px;
    padding: 0 24px;
}
@media (max-width: 768px) {
    .hero-testimonials { grid-template-columns: 1fr; max-width: 420px; }
}

/* Testimonials */
.pricing-testimonials {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    max-width: 900px;
    margin: 0 auto 48px;
    padding: 0 24px;
}
@media (max-width: 768px) {
    .pricing-testimonials { grid-template-columns: 1fr; max-width: 420px; }
}
.pricing-testimonial-card {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 20px;
}
.ptc-quote {
    font-size: 0.85rem;
    color: var(--text);
    line-height: 1.6;
    margin-bottom: 12px;
    font-style: italic;
}
.ptc-author {
    font-size: 0.78rem;
    color: var(--text-muted);
    font-family: 'IBM Plex Mono', monospace;
}
.ptc-verified {
    font-size: 0.68rem;
    background: rgba(0, 200, 150, 0.12);
    color: var(--green);
    border-radius: 4px;
    padding: 1px 6px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* FAQ */
.pricing-faq {
    max-width: 900px;
    margin: 0 auto 64px;
    padding: 0 24px;
}
.pricing-faq-title {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.6rem;
    letter-spacing: 0.04em;
    color: var(--text);
    margin: 0 0 24px;
}
.pricing-faq-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
@media (max-width: 768px) {
    .pricing-faq-grid { grid-template-columns: 1fr; }
}
.pricing-faq-item {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 18px 20px;
}
.pf-q {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 8px;
}
.pf-a {
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.6;
}

/* ── ACCOUNT MODAL ───────────────────────────────────────────────────────── */
.account-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.6);
    z-index: 300;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
}
.account-modal-overlay.active { opacity: 1; visibility: visible; }

.account-modal-box {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 16px;
    width: 100%;
    max-width: 380px;
    padding: 28px;
    position: relative;
}
.account-modal-close {
    position: absolute;
    top: 14px;
    right: 18px;
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.3rem;
    cursor: pointer;
    padding: 4px 8px;
    transition: color 0.15s;
}
.account-modal-close:hover { color: var(--text); }
.account-modal-title {
    font-family: var(--font-display);
    font-size: 1.2rem;
    letter-spacing: 0.5px;
    margin-bottom: 20px;
}
.account-tier-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    margin-bottom: 12px;
}
.account-tier-label { font-size: 0.78rem; color: var(--text-muted); }
.account-tier-value {
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.3px;
}
.account-tier-value.free { color: var(--text-muted); }
.account-tier-value.pro { color: var(--green); }
.account-tier-value.elite { color: var(--gold); }
.account-status-row {
    font-size: 0.78rem;
    color: var(--text-muted);
    padding: 0 4px;
    margin-bottom: 20px;
}
.account-status-row .status-active { color: var(--green); }
.account-status-row .status-past-due { color: var(--orange); }
.account-manage-btn {
    width: 100%;
    padding: 11px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--text);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 0.15s;
    margin-bottom: 10px;
}
.account-manage-btn:hover { border-color: var(--border-hover); }
.account-upgrade-prompt {
    margin-top: 14px;
    padding: 14px;
    background: rgba(212,175,55,0.06);
    border: 1px solid rgba(212,175,55,0.18);
    border-radius: 10px;
    text-align: center;
}
.account-upgrade-prompt p { font-size: 0.8rem; color: var(--text-muted); margin-bottom: 10px; line-height: 1.4; }
.account-upgrade-now-btn {
    padding: 9px 24px;
    background: var(--gold);
    color: #0a0a0b;
    border: none;
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: pointer;
    transition: opacity 0.15s;
}
.account-upgrade-now-btn:hover { opacity: 0.88; }

/* ── TOAST NOTIFICATIONS ─────────────────────────────────────────────────── */
.toast-container {
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 500;
    display: flex;
    flex-direction: column;
    gap: 8px;
    pointer-events: none;
}
.toast {
    padding: 12px 20px;
    border-radius: 10px;
    font-size: 0.85rem;
    font-weight: 500;
    color: #fff;
    white-space: nowrap;
    animation: toastIn 0.25s ease, toastOut 0.3s ease 3.5s forwards;
    border: 1px solid;
    box-shadow: 0 8px 20px rgba(0,0,0,0.4);
}
.toast.success { background: rgba(34,197,94,0.15); border-color: rgba(34,197,94,0.3); color: #86efac; }
.toast.neutral { background: rgba(255,255,255,0.07); border-color: rgba(255,255,255,0.12); color: var(--text); }
.toast.error { background: rgba(239,68,68,0.12); border-color: rgba(239,68,68,0.25); color: #fca5a5; }

@keyframes toastIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }

/* ── ONBOARDING OVERLAY ─────────────────────────────── */
.onboarding-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.75);
    backdrop-filter: blur(6px);
    z-index: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.onboarding-overlay.hidden { display: none; }

.onboarding-box {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 20px;
    width: 100%;
    max-width: 420px;
    padding: 32px 28px 24px;
    position: relative;
    box-shadow: 0 24px 64px rgba(0,0,0,0.5);
}

.onboarding-skip {
    position: absolute;
    top: 16px;
    right: 18px;
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 0.8rem;
    cursor: pointer;
    padding: 4px 8px;
    transition: color 0.15s;
    font-family: var(--font-body);
    letter-spacing: 0.03em;
    text-transform: uppercase;
}
.onboarding-skip:hover { color: var(--text); }

.onboarding-steps { min-height: 200px; }

.onboarding-step { display: none; animation: obFadeIn 0.25s ease; }
.onboarding-step.active { display: block; }
@keyframes obFadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

.ob-icon {
    font-family: var(--font-display);
    font-size: 2rem;
    color: var(--accent);
    margin-bottom: 12px;
    letter-spacing: 0.05em;
}

.ob-title {
    font-family: var(--font-display);
    font-size: 1.5rem;
    color: var(--text);
    margin: 0 0 12px;
    letter-spacing: 0.02em;
}

.ob-body {
    color: var(--text-muted);
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 0 0 14px;
}

.ob-signals { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.ob-signal-row { display: flex; align-items: center; gap: 12px; }
.ob-signal-desc { color: var(--text-muted); font-size: 0.85rem; }

.ob-list {
    color: var(--text-muted);
    font-size: 0.875rem;
    line-height: 1.7;
    margin: 8px 0 0 0;
    padding-left: 20px;
}
.ob-list li { margin-bottom: 4px; }
.ob-list strong { color: var(--text); }

.ob-disclaimer {
    font-size: 0.75rem;
    color: var(--text-faint, var(--text-muted));
    opacity: 0.6;
    margin-top: 14px;
}

.ob-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin: 20px 0 16px;
}
.ob-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--border);
    cursor: pointer;
    transition: background 0.2s, transform 0.2s;
}
.ob-dot.active { background: var(--accent); transform: scale(1.3); }
.ob-dot:hover { background: var(--text-muted); }

.ob-actions { display: flex; justify-content: flex-end; }
.ob-next-btn {
    background: var(--accent);
    color: #000;
    border: none;
    border-radius: 8px;
    padding: 10px 24px;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    transition: opacity 0.15s, transform 0.15s;
}
.ob-next-btn:hover { opacity: 0.88; transform: translateY(-1px); }
@keyframes toastOut { from { opacity:1; } to { opacity:0; } }

/* ── ACCOUNT SETTINGS PAGE ────────────────────────────────── */
.account-settings-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.25rem;
    max-width: 900px;
}
.acct-card {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
}
.acct-card-wide { grid-column: 1 / -1; }
.acct-card-title {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-muted);
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.acct-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}
.acct-row:last-child { border-bottom: none; }
.acct-row-toggle { align-items: flex-start; gap: 1rem; }
.acct-row-score-threshold { align-items: center; gap: 1rem; }
.acct-score-threshold-wrap { flex-shrink: 0; }
.acct-min-score-input {
    width: 64px;
    background: var(--card-bg);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    color: var(--text-primary);
    font-size: 0.9rem;
    font-weight: 600;
    padding: 0.3rem 0.5rem;
    text-align: center;
}
.acct-min-score-input:focus { outline: none; border-color: var(--accent); }
.acct-label { font-size: 0.85rem; color: var(--text-muted); }
.acct-value { font-size: 0.9rem; color: var(--text-primary); font-weight: 500; }
.acct-hint {
    font-size: 0.78rem;
    color: var(--text-muted);
    margin-top: 0.2rem;
}
.acct-disclaimer { margin-top: 1rem; padding-top: 0.75rem; border-top: 1px solid rgba(255,255,255,0.04); }
.acct-tier-badge {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    padding: 3px 10px;
    border-radius: 20px;
    background: rgba(139,148,158,0.15);
    color: #8b949e;
}
.acct-tier-badge.pro { background: rgba(56,139,253,0.15); color: #58a6ff; }
.acct-tier-badge.elite { background: rgba(63,185,80,0.15); color: #3fb950; }
.acct-actions { display: flex; gap: 0.75rem; margin-top: 1rem; flex-wrap: wrap; }
.acct-btn-primary, .acct-btn-upgrade {
    border: none;
    border-radius: 8px;
    padding: 8px 18px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.15s;
}
.acct-btn-primary { background: var(--accent); color: #000; }
.acct-btn-upgrade { background: rgba(63,185,80,0.15); color: #3fb950; border: 1px solid rgba(63,185,80,0.3); }
.acct-btn-primary:hover, .acct-btn-upgrade:hover { opacity: 0.82; }
.acct-count-badge {
    background: rgba(56,139,253,0.15);
    color: #58a6ff;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 10px;
}
.acct-empty-state {
    color: var(--text-muted);
    font-size: 0.875rem;
    padding: 1rem 0;
    text-align: center;
}
.acct-watchlist-list { display: flex; flex-direction: column; gap: 0.5rem; }
.acct-watchlist-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}
.acct-watchlist-row:last-child { border-bottom: none; }
.acct-watchlist-ticker { font-weight: 700; font-size: 0.9rem; color: var(--text-primary); min-width: 70px; }
.acct-watchlist-market { font-size: 0.75rem; color: var(--text-muted); }
.acct-signal-chip { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.05em; margin-left: auto; }

/* Toggle switch */
.acct-toggle { position: relative; display: inline-block; width: 44px; height: 24px; flex-shrink: 0; }
.acct-toggle input { opacity: 0; width: 0; height: 0; }
.acct-toggle-slider {
    position: absolute;
    inset: 0;
    background: rgba(139,148,158,0.25);
    border-radius: 24px;
    cursor: pointer;
    transition: background 0.2s;
}
.acct-toggle-slider:before {
    content: '';
    position: absolute;
    width: 18px; height: 18px;
    left: 3px; bottom: 3px;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.2s;
}
.acct-toggle input:checked + .acct-toggle-slider { background: #3fb950; }
.acct-toggle input:checked + .acct-toggle-slider:before { transform: translateX(20px); }

@media (max-width: 600px) {
    .account-settings-grid { grid-template-columns: 1fr; }
    .acct-card-wide { grid-column: 1; }
}

/* ── Referral Program ───────────────────────────────────────────────────── */
.referral-link-row {
    display: flex;
    gap: 8px;
    margin: 12px 0;
    align-items: center;
}
.referral-link-input {
    flex: 1;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 8px 10px;
    color: var(--text-primary);
    font-size: 13px;
    font-family: monospace;
    min-width: 0;
}
.referral-code-input {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 7px 10px;
    color: var(--text-primary);
    font-size: 13px;
    width: 120px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.referral-apply-wrap {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-shrink: 0;
}
.referral-credit-active { color: var(--accent); font-weight: 600; }
.referral-msg { font-size: 12px; margin-top: 6px; }
.referral-msg-ok  { color: var(--accent); }
.referral-msg-err { color: var(--bearish); }

/* Pricing page referral CTA block */
.pricing-referral-cta {
    text-align: center;
    background: linear-gradient(135deg, rgba(48,186,0,0.07), rgba(48,186,0,0.02));
    border: 1px solid rgba(48,186,0,0.2);
    border-radius: 12px;
    padding: 36px 24px;
    margin: 40px auto;
    max-width: 540px;
}
.pricing-referral-icon { font-size: 40px; margin-bottom: 12px; }
.pricing-referral-title { font-size: 20px; font-weight: 700; margin-bottom: 10px; color: var(--text-primary); }
.pricing-referral-sub { font-size: 14px; color: var(--text-secondary); margin-bottom: 20px; line-height: 1.6; }

/* ── Smart Money Tracker ────────────────────────────────────────────────── */
.sm-paywall {
    text-align: center;
    padding: 60px 24px 32px;
    max-width: 520px;
    margin: 0 auto;
}
.sm-paywall-icon { font-size: 48px; margin-bottom: 16px; }
.sm-paywall-title { font-size: 22px; font-weight: 700; color: #e6edf3; margin-bottom: 10px; }
.sm-paywall-desc { color: #8b949e; line-height: 1.6; margin-bottom: 24px; }
.sm-congress-preview { margin-top: 32px; text-align: left; }
.sm-content { padding: 0 0 40px; }
.sm-section { margin-bottom: 36px; }
.sm-section-title {
    font-size: 13px;
    font-weight: 600;
    color: #8b949e;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 12px;
}
.sm-section-hint { color: #666; font-size: 13px; margin-bottom: 10px; }

/* Congress disclosure list */
.sm-congress-list { display: flex; flex-direction: column; gap: 6px; }
.sm-congress-row {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #161b22;
    border: 1px solid #30363d;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 13px;
}
.sm-congress-ticker { font-weight: 700; color: #58a6ff; min-width: 56px; }
.sm-congress-action { font-weight: 700; min-width: 44px; }
.sm-action-buy { color: #3fb950; }
.sm-action-exit { color: #f85149; }
.sm-action-trim { color: #d29922; }
.sm-congress-name { color: #c9d1d9; flex: 1; }
.sm-congress-date { color: #8b949e; font-size: 12px; white-space: nowrap; }
.sm-congress-empty { color: #8b949e; font-size: 13px; padding: 12px 0; }

/* Trader grid */
.sm-trader-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 16px;
}
.sm-trader-card {
    background: #161b22;
    border: 1px solid #30363d;
    border-radius: 12px;
    padding: 18px 16px 14px;
    cursor: pointer;
    transition: border-color 0.2s, transform 0.15s;
}
.sm-trader-card:hover { border-color: #58a6ff; transform: translateY(-2px); }
.sm-trader-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.sm-trader-name { font-size: 15px; font-weight: 700; color: #e6edf3; }
.sm-trader-source {
    font-size: 10px;
    font-weight: 600;
    color: #8b949e;
    background: #21262d;
    border-radius: 4px;
    padding: 2px 6px;
    text-transform: uppercase;
}
.sm-trader-tag { font-size: 12px; color: #8b949e; margin-bottom: 12px; }
.sm-trader-stats { display: flex; gap: 10px; margin-bottom: 14px; }
.sm-stat { flex: 1; text-align: center; }
.sm-stat-val { font-size: 14px; font-weight: 700; color: #3fb950; }
.sm-stat-label { font-size: 10px; color: #8b949e; margin-top: 2px; }
.sm-trader-actions { display: flex; justify-content: flex-end; }
.sm-follow-btn {
    font-size: 12px;
    font-weight: 600;
    padding: 5px 14px;
    border-radius: 6px;
    border: 1px solid #30363d;
    background: transparent;
    color: #8b949e;
    cursor: pointer;
    transition: all 0.15s;
}
.sm-follow-btn:hover { border-color: #58a6ff; color: #58a6ff; }
.sm-follow-btn.following { border-color: #3fb950; color: #3fb950; background: rgba(63,185,80,0.08); }
.sm-empty { color: #8b949e; font-size: 13px; padding: 24px 0; text-align: center; }

/* Convergence */
.sm-convergence-list { display: flex; flex-direction: column; gap: 10px; }
.sm-convergence-card {
    background: linear-gradient(135deg, #1c1a0f, #161b22);
    border: 1px solid #d29922;
    border-radius: 10px;
    padding: 14px 16px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.sm-conv-ticker { font-size: 16px; font-weight: 700; color: #d29922; min-width: 60px; }
.sm-conv-label {
    font-size: 11px;
    font-weight: 700;
    color: #d29922;
    background: rgba(210,153,34,0.12);
    border-radius: 4px;
    padding: 2px 8px;
}
.sm-conv-traders { color: #8b949e; font-size: 13px; flex: 1; }

/* Trader profile modal */
.sm-modal-title { font-size: 18px; font-weight: 700; color: #e6edf3; }
.sm-modal-meta { display: flex; gap: 8px; margin-top: 6px; flex-wrap: wrap; }
.sm-following-badge {
    font-size: 11px;
    font-weight: 700;
    color: #3fb950;
    background: rgba(63,185,80,0.1);
    border-radius: 4px;
    padding: 2px 8px;
}
.sm-pos-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.sm-pos-table th {
    color: #8b949e;
    font-weight: 600;
    text-align: left;
    padding: 6px 8px;
    border-bottom: 1px solid #30363d;
}
.sm-pos-table td {
    color: #c9d1d9;
    padding: 8px 8px;
    border-bottom: 1px solid #21262d;
}

@media (max-width: 600px) {
    .sm-trader-grid { grid-template-columns: 1fr; }
    .sm-trader-stats { gap: 6px; }
}

/* ── POLYMARKET LIVE SMART MONEY FEED ──────────────────────────────────────── */

.pm-paywall { text-align: center; padding: 80px 24px; max-width: 480px; margin: 0 auto; }
.pm-paywall-icon { font-size: 48px; margin-bottom: 16px; }
.pm-paywall-title { font-size: 22px; font-weight: 700; color: #f0f6fc; margin-bottom: 12px; }
.pm-paywall-desc { font-size: 15px; color: #8b949e; line-height: 1.6; margin-bottom: 24px; }
.pm-content { display: flex; flex-direction: column; gap: 32px; }
.pm-feed-bar { display: flex; align-items: center; gap: 8px; background: #161b22; border: 1px solid #30363d; border-radius: 8px; padding: 10px 16px; font-size: 13px; color: #8b949e; }
.pm-feed-dot { width: 8px; height: 8px; background: #3fb950; border-radius: 50%; animation: pm-pulse 2s infinite; flex-shrink: 0; }
@keyframes pm-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
.pm-section { display: flex; flex-direction: column; gap: 12px; }
.pm-section-title { font-size: 16px; font-weight: 700; color: #f0f6fc; display: flex; align-items: center; gap: 10px; }
.pm-section-title-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.pm-top-selector { display: flex; align-items: center; gap: 6px; }
.pm-top-label { font-size: 13px; color: #8b949e; }
.pm-top-btn { background: #21262d; border: 1px solid #30363d; color: #8b949e; font-size: 13px; font-weight: 600; padding: 4px 12px; border-radius: 6px; cursor: pointer; transition: all 0.15s; }
.pm-top-btn:hover { border-color: #58a6ff; color: #58a6ff; }
.pm-top-btn.active { background: #1f6feb; border-color: #1f6feb; color: #fff; }
.pm-filter-bar { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 16px; padding: 12px 16px; background: #161b22; border: 1px solid #21262d; border-radius: 8px; }
.pm-filter-group { display: flex; align-items: center; gap: 6px; }
.pm-filter-label { font-size: 12px; color: #8b949e; font-weight: 600; min-width: 32px; }
.pm-filter-btn { background: #21262d; border: 1px solid #30363d; color: #8b949e; font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 5px; cursor: pointer; transition: all 0.15s; }
.pm-filter-btn:hover { border-color: #58a6ff; color: #58a6ff; }
.pm-filter-btn.active { background: #1f6feb22; border-color: #58a6ff; color: #58a6ff; }
.pm-rank-badge { display: inline-block; background: #ffd70022; color: #ffd700; font-size: 11px; font-weight: 700; padding: 1px 6px; border-radius: 4px; margin-right: 6px; }
.pm-feed-profit { font-size: 11px; color: #3fb950; font-weight: 600; }
.pm-follow-all-btn { background: #238636; border: 1px solid #2ea043; color: #fff; font-size: 13px; font-weight: 600; padding: 4px 14px; border-radius: 6px; cursor: pointer; transition: all 0.15s; margin-left: 8px; }
.pm-follow-all-btn:hover:not(:disabled) { background: #2ea043; }
.pm-follow-all-btn:disabled { opacity: 0.7; cursor: default; }
.pm-section-hint { font-size: 13px; color: #8b949e; margin: 0; }
.pm-elite-badge { font-size: 10px; font-weight: 700; color: #0d1117; background: linear-gradient(135deg, #ffd700, #ff8c00); padding: 2px 8px; border-radius: 10px; text-transform: uppercase; letter-spacing: 0.5px; }
.pm-live-badge { font-size: 10px; font-weight: 700; color: #ffffff; background: #f85149; padding: 2px 8px; border-radius: 10px; letter-spacing: 1px; animation: pm-pulse 2s infinite; }
.pm-wallet-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.pm-wallet-card { background: #161b22; border: 1px solid #30363d; border-radius: 12px; padding: 20px; cursor: pointer; transition: border-color 0.15s, transform 0.15s; }
.pm-wallet-card:hover { border-color: #4299e1; transform: translateY(-2px); }
.pm-wallet-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; gap: 8px; }
.pm-wallet-name { font-size: 14px; font-weight: 600; color: #f0f6fc; font-family: monospace; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pm-follow-btn { font-size: 12px; font-weight: 600; color: #4299e1; background: transparent; border: 1px solid #4299e1; border-radius: 6px; padding: 4px 12px; cursor: pointer; white-space: nowrap; flex-shrink: 0; transition: background 0.15s, color 0.15s; }
.pm-follow-btn:hover { background: #4299e1; color: #0d1117; }
.pm-follow-btn.following { color: #3fb950; border-color: #3fb950; }
.pm-follow-btn.following:hover { background: #3fb950; color: #0d1117; }
.pm-wallet-stats { display: flex; gap: 16px; flex-wrap: wrap; }
.pm-stat { display: flex; flex-direction: column; gap: 2px; }
.pm-stat-label { font-size: 11px; color: #8b949e; text-transform: uppercase; letter-spacing: 0.5px; }
.pm-stat-value { font-size: 16px; font-weight: 700; color: #f0f6fc; }
.pm-stat-up { color: #3fb950; }
.pm-stat-down { color: #f85149; }
.pm-empty { font-size: 14px; color: #8b949e; text-align: center; padding: 40px 0; }
.pm-bet-feed { display: flex; flex-direction: column; gap: 12px; max-height: 600px; overflow-y: auto; }
.pm-feed-empty { font-size: 14px; color: #8b949e; text-align: center; padding: 32px 0; }
.pm-feed-card { background: #161b22; border: 1px solid #30363d; border-radius: 10px; padding: 16px; animation: pm-slide-in 0.3s ease; }
@keyframes pm-slide-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
.pm-feed-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.pm-feed-wallet { font-size: 13px; font-weight: 600; color: #4299e1; font-family: monospace; }
.pm-feed-time { font-size: 11px; color: #8b949e; }
.pm-feed-question { font-size: 14px; color: #f0f6fc; margin-bottom: 10px; line-height: 1.4; }
.pm-feed-card-stats { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pm-feed-amount { font-size: 14px; font-weight: 600; color: #f0f6fc; }
.pm-feed-odds { font-size: 13px; color: #8b949e; }
.pm-feed-wr { font-size: 12px; color: #8b949e; }
.pm-bet-side { font-size: 12px; font-weight: 700; padding: 2px 10px; border-radius: 10px; letter-spacing: 0.5px; }
.pm-side-yes { background: rgba(63, 185, 80, 0.15); color: #3fb950; border: 1px solid #3fb950; }
.pm-side-no { background: rgba(248, 81, 73, 0.15); color: #f85149; border: 1px solid #f85149; }
.pm-convergence-list { display: flex; flex-direction: column; gap: 12px; }
.pm-convergence-card { background: linear-gradient(135deg, rgba(255,215,0,0.05), rgba(255,140,0,0.05)); border: 1px solid rgba(255,215,0,0.3); border-radius: 10px; padding: 16px; }
.pm-conv-question { font-size: 15px; font-weight: 600; color: #f0f6fc; margin-bottom: 10px; }
.pm-conv-meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.pm-conv-amount { font-size: 14px; font-weight: 600; color: #ffd700; }
.pm-conv-sectors { font-size: 13px; color: #8b949e; }
.pm-conv-tickers { display: flex; gap: 8px; flex-wrap: wrap; }
.pm-conv-ticker { font-size: 12px; font-weight: 700; color: #ffd700; background: rgba(255,215,0,0.1); border: 1px solid rgba(255,215,0,0.3); padding: 2px 8px; border-radius: 4px; }
.pm-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.7); z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.pm-modal-box { background: #161b22; border: 1px solid #30363d; border-radius: 14px; width: 100%; max-width: 720px; max-height: 80vh; display: flex; flex-direction: column; overflow: hidden; }
.pm-modal-header { display: flex; justify-content: space-between; align-items: flex-start; padding: 20px 24px; border-bottom: 1px solid #30363d; }
.pm-modal-title { font-size: 18px; font-weight: 700; color: #f0f6fc; margin: 0 0 4px; font-family: monospace; }
.pm-modal-meta { font-size: 13px; color: #8b949e; }
.pm-modal-close { background: none; border: none; color: #8b949e; font-size: 24px; cursor: pointer; line-height: 1; padding: 0; flex-shrink: 0; }
.pm-bets-header { display: grid; grid-template-columns: 1fr 60px 80px 60px 70px; gap: 8px; padding: 10px 24px; font-size: 11px; font-weight: 600; color: #8b949e; text-transform: uppercase; letter-spacing: 0.5px; border-bottom: 1px solid #30363d; background: #0d1117; }
.pm-bets-list { overflow-y: auto; flex: 1; }
.pm-bet-row { display: grid; grid-template-columns: 1fr 60px 80px 60px 70px; gap: 8px; padding: 12px 24px; border-bottom: 1px solid #21262d; align-items: center; }
.pm-bet-row:hover { background: #1c2128; }
.pm-bet-question { font-size: 13px; color: #c9d1d9; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pm-bet-link { color: #58a6ff; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pm-bet-link:hover { text-decoration: underline; color: #79c0ff; }
.pm-bet-amount { font-size: 13px; font-weight: 600; color: #f0f6fc; }
.pm-bet-odds { font-size: 13px; color: #8b949e; }
.pm-bet-outcome { font-size: 12px; font-weight: 600; }
.pm-outcome-win { color: #3fb950; }
.pm-outcome-loss { color: #f85149; }
.pm-outcome-open { color: #e3b341; }
.pm-modal-empty { padding: 32px 24px; text-align: center; color: #8b949e; font-size: 14px; }

@media (max-width: 600px) {
    .pm-wallet-grid { grid-template-columns: 1fr; }
    .pm-wallet-stats { gap: 12px; }
    .pm-bets-header, .pm-bet-row { grid-template-columns: 1fr 50px 60px; }
}

/* ── AUTO-TRADER PAGE ─────────────────────────────────────────────────────── */
.at-login-gate { display: flex; justify-content: center; align-items: center; min-height: 40vh; }
.at-login-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 32px; max-width: 380px; width: 100%; }
.at-login-title { font-size: 1.1rem; font-weight: 600; color: var(--text); margin-bottom: 8px; }
.at-login-hint { font-size: 13px; color: var(--muted); margin-bottom: 20px; }
.at-login-form { display: flex; flex-direction: column; gap: 12px; }
.at-login-error { margin-top: 10px; padding: 8px 12px; background: rgba(248,81,73,0.15); border: 1px solid rgba(248,81,73,0.4); border-radius: 6px; color: #f85149; font-size: 13px; }

.at-status-strip { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; margin-bottom: 20px; font-size: 13px; color: var(--muted); }
.at-status-dot { width: 10px; height: 10px; border-radius: 50%; background: #8b949e; flex-shrink: 0; }

.at-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.at-panel { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 20px; }
.at-panel-title { font-size: 14px; font-weight: 600; color: var(--text); margin-bottom: 16px; }
.at-panel-title-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.at-log-panel { margin-bottom: 20px; }
.at-refresh-btn { background: none; border: 1px solid var(--border); border-radius: 6px; padding: 4px 12px; font-size: 12px; color: var(--muted); cursor: pointer; }
.at-refresh-btn:hover { color: var(--text); border-color: var(--text); }

.at-settings-form { display: flex; flex-direction: column; gap: 14px; }
.at-field { display: flex; flex-direction: column; gap: 6px; }
.at-label { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.05em; }
.at-input { background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 8px 10px; color: var(--text); font-size: 13px; width: 100%; box-sizing: border-box; }
.at-input:focus { outline: none; border-color: var(--accent); }
.at-num-input { width: 120px; }

.at-toggle-row { display: flex; align-items: center; gap: 10px; }
.at-toggle { position: relative; display: inline-block; width: 36px; height: 20px; flex-shrink: 0; }
.at-toggle input { opacity: 0; width: 0; height: 0; }
.at-toggle-slider { position: absolute; cursor: pointer; inset: 0; background: #3d444d; border-radius: 20px; transition: background 0.2s; }
.at-toggle-slider::before { content: ''; position: absolute; width: 14px; height: 14px; left: 3px; top: 3px; background: #fff; border-radius: 50%; transition: transform 0.2s; }
.at-toggle input:checked + .at-toggle-slider { background: var(--accent, #58a6ff); }
.at-toggle input:checked + .at-toggle-slider::before { transform: translateX(16px); }
.at-toggle-hint { font-size: 12px; color: var(--muted); }
.at-save-msg { font-size: 12px; color: #3fb950; margin-top: 4px; }

.at-account-body { display: flex; flex-direction: column; gap: 10px; }
.at-account-stat { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--border); }
.at-account-stat:last-child { border-bottom: none; }
.at-stat-label { font-size: 12px; color: var(--muted); }
.at-stat-val { font-size: 14px; font-weight: 600; color: var(--text); }

.at-log-empty { padding: 24px 0; text-align: center; color: var(--muted); font-size: 14px; }
.at-log-wrap { overflow-x: auto; }
.at-log-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.at-log-table th { text-align: left; padding: 8px 10px; color: var(--muted); font-weight: 500; border-bottom: 1px solid var(--border); white-space: nowrap; }
.at-log-table td { padding: 8px 10px; border-bottom: 1px solid var(--border); color: var(--text); vertical-align: middle; }
.at-log-ticker { font-weight: 600; color: #58a6ff; }
.at-st { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; text-transform: uppercase; background: rgba(139,148,158,0.15); color: #8b949e; }
.at-st-filled { background: rgba(63,185,80,0.15); color: #3fb950; }
.at-st-closed { background: rgba(88,166,255,0.15); color: #58a6ff; }
.at-st-error  { background: rgba(248,81,73,0.15);  color: #f85149; }
.at-st-pending { background: rgba(227,179,65,0.15); color: #e3b341; }
.at-outcome { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; text-transform: uppercase; }
.at-out-win  { background: rgba(63,185,80,0.15);  color: #3fb950; }
.at-out-loss { background: rgba(248,81,73,0.15);   color: #f85149; }
.at-out-open { background: rgba(227,179,65,0.15);  color: #e3b341; }

@media (max-width: 768px) {
    .at-grid { grid-template-columns: 1fr; }
    .at-num-input { width: 100%; }
}

/* ── Push opt-in banner ─────────────────────────────────────────────────── */
.push-opt-in-banner {
    position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%);
    background: #161b22; border: 1px solid #30363d; border-radius: 8px;
    padding: 12px 16px; display: flex; align-items: center; gap: 12px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.5); z-index: 1100;
    font-size: 14px; color: #c9d1d9; max-width: calc(100vw - 40px);
    animation: slideUp 0.3s ease;
}
@keyframes slideUp { from { opacity: 0; transform: translateX(-50%) translateY(20px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }
.push-opt-btn { padding: 6px 14px; border-radius: 6px; border: none; cursor: pointer; font-size: 13px; font-weight: 600; white-space: nowrap; }
.push-opt-yes { background: #388bfd; color: #fff; }
.push-opt-yes:hover { background: #58a6ff; }
.push-opt-no  { background: transparent; color: #8b949e; border: 1px solid #30363d; }
.push-opt-no:hover { color: #c9d1d9; }

/* ── Intelligence page — light mode overrides ─────────────────────────── */
[data-theme="light"] .regime-banner { background: #f0f4f8; border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .regime-label { color: #1a202c; }
[data-theme="light"] .regime-rationale { color: #4a5568; }
[data-theme="light"] .intel-card { background: #ffffff; border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .intel-card-header { border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .intel-card-ticker { color: #0f1117; }
[data-theme="light"] .intel-regime-context { color: #4a5568; background: rgba(0,0,0,0.04); }
[data-theme="light"] .regime-header-pill { background: rgba(0,0,0,0.06); color: #1a202c; }

/* ── ACTIVATION PROGRESS BAR ──────────────────────────────────────────── */
.activation-bar {
    position: relative;
    background: var(--surface-2);
    border: 1px solid rgba(212,175,55,0.2);
    border-radius: 12px;
    padding: 14px 40px 14px 18px;
    margin-bottom: 20px;
    transition: opacity 0.35s ease, transform 0.35s ease;
}
.actbar-dismiss {
    position: absolute;
    top: 10px;
    right: 10px;
    background: none;
    color: var(--text-muted);
    font-size: 12px;
    padding: 4px 6px;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s;
}
.actbar-dismiss:hover { color: var(--text); }
.actbar-top { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.actbar-title { font-size: 0.78rem; font-weight: 600; color: var(--gold-light); text-transform: uppercase; letter-spacing: 0.06em; }
.actbar-count { font-size: 0.72rem; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.actbar-steps { display: flex; gap: 20px; flex-wrap: wrap; margin-bottom: 10px; }
.actbar-step { display: flex; align-items: center; gap: 5px; font-size: 0.78rem; color: var(--text-muted); transition: color 0.2s; }
.actbar-step.done { color: var(--green); }
.actbar-icon { font-size: 0.85em; }
.actbar-track { height: 3px; background: var(--surface-3); border-radius: 2px; overflow: hidden; }
.actbar-fill { height: 100%; background: linear-gradient(90deg, var(--gold), var(--gold-light)); border-radius: 2px; transition: width 0.45s ease; }
.activation-bar.completing { opacity: 0; transform: translateY(-6px); }
[data-theme="light"] .activation-bar { background: #f8f8f0; border-color: rgba(180,140,20,0.25); }
[data-theme="light"] .actbar-title { color: #a07830; }
[data-theme="light"] .actbar-step { color: #888; }
[data-theme="light"] .actbar-step.done { color: #16a34a; }

/* ── CANCEL FLOW MODAL ───────────────────────────────────────────────────── */
.cfm-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.65);
    z-index: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.cfm-overlay.hidden { display: none; }
.cfm-box {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 16px;
    width: 100%;
    max-width: 400px;
    padding: 32px 28px 28px;
    position: relative;
}
.cfm-close {
    position: absolute;
    top: 14px;
    right: 18px;
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.3rem;
    cursor: pointer;
    padding: 4px 8px;
    transition: color 0.15s;
}
.cfm-close:hover { color: var(--text); }
.cfm-step-label {
    font-size: 0.7rem;
    font-family: var(--font-mono);
    letter-spacing: 0.6px;
    color: var(--text-muted);
    margin-bottom: 10px;
}
.cfm-title {
    font-family: var(--font-display);
    font-size: 1.15rem;
    letter-spacing: 0.4px;
    margin: 0 0 12px;
}
.cfm-body {
    font-size: 0.85rem;
    color: var(--text-muted);
    line-height: 1.5;
    margin: 0 0 20px;
}
.cfm-actions { display: flex; flex-direction: column; gap: 10px; }
.cfm-btn-primary {
    display: block;
    text-align: center;
    padding: 11px 20px;
    background: var(--gold);
    color: #000;
    font-weight: 700;
    font-size: 0.85rem;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    text-decoration: none;
    transition: opacity 0.15s;
}
.cfm-btn-primary:hover { opacity: 0.88; }
.cfm-btn-ghost {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 0.78rem;
    cursor: pointer;
    padding: 6px 0;
    text-decoration: underline;
    text-align: center;
    width: 100%;
    transition: color 0.15s;
}
.cfm-btn-ghost:hover { color: var(--text); }
.cfm-pause-options { display: flex; gap: 10px; margin-bottom: 12px; }
.cfm-pause-btn {
    flex: 1;
    padding: 10px 14px;
    background: var(--surface-3);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text);
    font-size: 0.82rem;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}
.cfm-pause-btn:hover { border-color: var(--gold); background: var(--surface); }
.cfm-reasons {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 20px;
}
.cfm-reason {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.83rem;
    color: var(--text-muted);
    cursor: pointer;
}
.cfm-reason:hover { color: var(--text); }
.cfm-reason-cb { accent-color: var(--gold); cursor: pointer; }
.cfm-btn-danger {
    width: 100%;
    padding: 11px 20px;
    background: none;
    border: 1px solid rgba(239,68,68,0.35);
    border-radius: 8px;
    color: #ef4444;
    font-size: 0.83rem;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}
.cfm-btn-danger:hover { background: rgba(239,68,68,0.08); border-color: #ef4444; }
.acct-cancel-link {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 0.72rem;
    cursor: pointer;
    padding: 4px 0;
    text-decoration: underline;
    margin-top: 6px;
    display: block;
    transition: color 0.15s;
}
.acct-cancel-link:hover { color: #ef4444; }
[data-theme="light"] .cfm-box { background: #fff; }
[data-theme="light"] .cfm-pause-btn { background: #f3f4f6; border-color: #d1d5db; }
[data-theme="light"] .cfm-pause-btn:hover { background: #fff; border-color: #b8960e; }