/* MC Background Easter Egg — kills default grid, makes bg transparent */
        body.mc-bg-active::before {
            background-image: none !important;
        }
        body.mc-bg-active {
            background: #0a0a14 !important;
        }

        :root {
            --bg:       #0b0d1f;
            --surface:  #0e1028;
            --surface2: #111330;
            --surface3: #161838;
            --border:   #1e2045;
            --border2:  #2a2d58;
            --accent:   #00d4ff;
            --muted:    #9098c8;
            --text:     #d8dcf0;
            --text-dim: #a0a8d0;
            --green:    #22c55e;
            --red:      #ef4444;
            --amber:    #f59e0b;
            --purple:   #a855f7;
            /* Logo-inspired palette */
            --cyan:     #00d4ff;
            --cyan-dim: #4ecdc4;
            --magenta:  #c850c0;
        }
        * { box-sizing: border-box; }
        html {
            /* NO overflow-x here — it kills position:fixed on iOS Safari.
               Horizontal containment is handled by .bluf-page-wrap's overflow-x:clip
               and max-width:100vw on children. See dev log "STICKY HEADER HISTORY". */
            max-width: 100vw;
        }
        body {
            font-family: 'Inter', system-ui, sans-serif;
            background: var(--bg); color: var(--text);
            min-height: 100vh;
            max-width: 100vw;
            overscroll-behavior-x: none;
            /* NO overflow-x here — same iOS Safari reason as html.
               .bluf-page-wrap (sibling of #stickyHeader, not parent) handles clip. */
        }
        body::before {
            content: ''; position: fixed; inset: 0;
            background-image:
                linear-gradient(rgba(59,130,246,0.022) 1px, transparent 1px),
                linear-gradient(90deg, rgba(59,130,246,0.022) 1px, transparent 1px);
            background-size: 48px 48px;
            pointer-events: none; z-index: 0;
        }
        .z1 { position: relative; z-index: 1; }
        .mono { font-family: 'Space Mono', monospace; }
        .tab-active { border-bottom: 2px solid var(--accent); color: var(--accent); }
        .tab { border-bottom: 2px solid transparent; color: var(--muted);
               transition: color 0.2s, border-color 0.2s; }
        .tab:hover { color: #90b4e8; border-bottom-color: rgba(59,130,246,0.3); }
        .spinner { border: 2px solid var(--border2); border-top: 2px solid var(--accent);
                   border-radius: 50%; width: 16px; height: 16px;
                   animation: spin 0.8s linear infinite; display: inline-block; }
        @keyframes spin { to { transform: rotate(360deg); } }
        .report-body { font-family: 'Inter', sans-serif; font-size: 0.875rem;
                       line-height: 1.55; color: #c0c0d8; }
        .report-body strong { color: #e0e0f4; }
        .report-body p { margin-bottom: 5px; }
        .btn-action { background: transparent; border: 1px solid var(--border2);
                      color: var(--text-dim); font-family: 'Space Mono', monospace;
                      font-size: 10px; letter-spacing: 1.5px; padding: 12px 16px;
                      cursor: pointer; transition: all 0.18s; text-transform: uppercase;
                      min-height: 44px; }
        .btn-action:hover { border-color: var(--accent); color: var(--accent);
                            background: rgba(59,130,246,0.06); }
        .level-card { flex: 1; min-width: 80px; max-width: 140px; background: var(--surface2);
                      border: 1px solid var(--border); padding: 10px 12px;
                      position: relative; overflow: hidden; }
        .level-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; }
        .level-card.anchor::before { background: var(--green); }
        .level-card.flip::before   { background: var(--accent); }
        .level-card.pain::before   { background: var(--purple); }
        .level-card.bias::before   { background: var(--muted); }
        .level-card.tip::before    { background: var(--border2); }
        .level-label { font-family: 'Space Mono', monospace; font-size: 9px;
                       letter-spacing: 2px; color: var(--text-dim); text-transform: uppercase; margin-bottom: 6px; }
        .level-value { font-family: 'Space Mono', monospace; font-size: 24px;
                       font-weight: 700; line-height: 1; }
        .level-sub { font-size: 10px; color: var(--muted); margin-top: 5px; }
        .trade-card { background: var(--surface); border: 1px solid var(--border2);
                      border-top: 2px solid var(--accent); padding: 16px 18px; }
        .trade-card.put-card { border-top-color: var(--red); }
        .greek-pill { background: var(--surface3); border: 1px solid var(--border2);
                      padding: 2px 9px; font-family: 'Space Mono', monospace;
                      font-size: 0.68rem; color: var(--muted); display: inline-block; }
        .greek-pill span { color: #d0d0f0; font-weight: 700; }
        .hub-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
        @media (max-width: 600px) { .hub-grid { grid-template-columns: 1fr; } }

        /* ── Scan Feed Filter Bar ──────────────────────────────────── */
        .sf-filter-bar {
            display: flex; align-items: center; gap: 10px; padding: 10px 14px;
            background: var(--surface2); border-bottom: 1px solid var(--border);
            flex-wrap: wrap;
        }
        .sf-filter-search { flex-shrink: 0; }
        .sf-ticker-input {
            background: var(--bg, #0b0d1f); border: 1px solid var(--border2);
            color: var(--cyan); font-family: 'Space Mono', monospace; font-size: 11px;
            letter-spacing: 0.5px; padding: 6px 12px; outline: none; width: 160px;
            border-radius: 8px; transition: border-color 0.2s, box-shadow 0.2s;
        }
        .sf-ticker-input::placeholder { color: #5060a0; }
        .sf-ticker-input:focus { border-color: var(--cyan); box-shadow: 0 0 8px rgba(0,212,255,0.15); }
        .sf-filter-pills { display: flex; gap: 4px; flex-wrap: wrap; }
        .sf-pill {
            background: transparent; border: 1px solid var(--border2); color: #64748b;
            font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 0.5px;
            padding: 4px 10px; cursor: pointer; transition: all 0.15s; text-transform: uppercase;
            white-space: nowrap; border-radius: 8px; font-weight: 500;
        }
        .sf-pill:hover { border-color: var(--cyan); color: var(--cyan); }
        .sf-pill.active {
            background: rgba(0,212,255,0.08);
            border-color: var(--cyan); color: var(--cyan); font-weight: 700;
        }

        /* ── Scan Feed Status Bar ──────────────────────────────────── */
        .sf-status-bar {
            display: flex; align-items: center; gap: 8px; margin-left: auto;
            background: rgba(0,212,255,0.03); border: 1px solid rgba(0,212,255,0.1);
            border-radius: 8px; padding: 4px 10px;
        }
        .sf-status-chip {
            display: flex; align-items: center; gap: 4px;
        }
        .sf-status-label {
            font-family: 'Space Mono', monospace; font-size: 9px; letter-spacing: 1.5px;
            color: #64748b; font-weight: 500; text-transform: uppercase;
        }
        .sf-status-value {
            font-family: 'Space Mono', monospace; font-size: 11px; font-weight: 700;
            color: #e2e8f0; letter-spacing: 0.5px;
        }
        .sf-status-divider {
            width: 1px; height: 14px; background: rgba(0,212,255,0.15); flex-shrink: 0;
        }
        .sf-status-divider-inline {
            font-family: 'Space Mono', monospace; font-size: 9px; color: #3a3a5a;
            margin: 0 2px;
        }
        .sf-pos-label { color: #4ade80 !important; font-size: 8px !important; }
        .sf-neg-label { color: #f87171 !important; font-size: 8px !important; }
        .sf-refresh-btn {
            background: transparent; border: 1px solid rgba(0,212,255,0.2);
            color: var(--cyan); font-size: 14px; cursor: pointer; padding: 2px 8px;
            border-radius: 6px; transition: all 0.15s; line-height: 1;
        }
        .sf-refresh-btn:hover {
            background: rgba(0,212,255,0.08); border-color: var(--cyan);
            box-shadow: 0 0 8px rgba(0,212,255,0.15);
        }
        .sf-live-dot {
            width: 7px; height: 7px; border-radius: 50%; background: #22c55e;
            animation: pulseGlow 2s ease-in-out infinite; flex-shrink: 0;
        }

        @keyframes scanPulse {
            0%, 100% { opacity: 1; transform: scale(1); }
            50% { opacity: 0.4; transform: scale(0.7); }
        }

        /* ── Scan History Feed ──────────────────────────────────────── */
        .scan-feed { width: 100%; }
        .scan-feed-table { width: 100%; border-collapse: collapse; font-family: 'Space Mono', monospace; }
        .scan-feed-table th {
            font-size: 11px; letter-spacing: 0.5px; color: #64748b; text-transform: uppercase;
            padding: 12px 14px; border-bottom: 2px solid var(--border2); text-align: left;
            background: var(--bg, #0b0d1f); position: sticky; top: 0; z-index: 10;
            font-weight: 600;
        }
        .scan-feed-table td {
            font-size: 13px; padding: 10px 14px; border-bottom: 1px solid var(--border);
            color: #e2e8f0; cursor: pointer; transition: background 0.1s;
        }
        .scan-feed-table tr:hover td { background: rgba(0,212,255,0.04); }

        /* Column 1: Ticker + scan metadata */
        .sf-col1 { display: flex; flex-direction: column; gap: 2px; }
        .sf-ticker { font-weight: 700; font-size: 13px; letter-spacing: 0.1em; color: #00d4ff; }
        .sf-meta { font-size: 10px; color: #64748b; letter-spacing: 0.3px; line-height: 1.3; }
        .sf-count { color: #a0a8d0; font-weight: 600; }
        .sf-between { color: var(--cyan-dim); font-weight: 500; }

        /* Dollar values + deltas */
        .sf-dollar { color: #e8e8ff; font-weight: 700; }
        .sf-delta-up { color: #4ade80; font-size: 11px; font-weight: 600; margin-left: 3px; }
        .sf-delta-dn { color: #f87171; font-size: 11px; font-weight: 600; margin-left: 3px; }
        .sf-dash { color: #505070; }

        /* Regime +/− icons */
        .sf-regime-pos { color: #4ade80; font-size: 20px; font-weight: 700; line-height: 1; }
        .sf-regime-neg { color: #f87171; font-size: 20px; font-weight: 700; line-height: 1; }
        .sf-regime-unk { color: #eab308; font-size: 16px; line-height: 1; }

        .scan-feed-empty {
            text-align: center; padding: 40px 20px;
            font-family: 'Space Mono', monospace; font-size: 11px; letter-spacing: 2px; color: #5060a0;
        }

        /* ── Quick Scan Dropdown ──────────────────────────────────── */
        .quick-scan-wrap { position: relative; display: inline-block; margin-bottom: 12px; }
        .qs-toggle-btn {
            background: linear-gradient(135deg, rgba(0,212,255,0.06) 0%, rgba(200,80,192,0.04) 100%);
            border: 1px solid rgba(0,212,255,0.25);
            color: var(--cyan); font-family: 'Space Mono', monospace;
            font-size: 9px; letter-spacing: 2px; padding: 10px 16px;
            cursor: pointer; transition: all 0.18s; text-transform: uppercase;
            display: flex; align-items: center; gap: 8px; min-height: 44px;
        }
        .qs-toggle-btn:hover { border-color: var(--cyan); color: #fff; background: linear-gradient(135deg, rgba(0,212,255,0.12) 0%, rgba(200,80,192,0.08) 100%); box-shadow: 0 0 12px rgba(0,212,255,0.15); }
        .qs-toggle-btn.open { border-color: var(--magenta); color: var(--magenta); background: rgba(200,80,192,0.08); }
        /* Social square icons */
        .social-sq {
            display: flex; align-items: center; justify-content: center;
            width: 36px; height: 36px; font-size: 14px;
            background: rgba(12,12,26,0.8); border: 1px solid rgba(255,255,255,0.06);
            color: #404060; text-decoration: none; transition: all 0.15s; cursor: pointer;
        }
        .social-sq:hover {
            border-color: var(--sq-c, #3b82f6); color: var(--sq-c, #3b82f6);
            background: rgba(255,255,255,0.03);
            box-shadow: 0 0 8px color-mix(in srgb, var(--sq-c, #3b82f6) 20%, transparent);
        }
        /* (social visibility rules removed — single SOCIAL button used everywhere) */
        .qs-toggle-btn .qs-arrow { font-size: 8px; transition: transform 0.2s; }
        .qs-toggle-btn.open .qs-arrow { transform: rotate(180deg); }
        .qs-dropdown {
            display: none; position: absolute; top: 100%; left: 0; z-index: 60;
            background: var(--surface); border: 1px solid var(--border2);
            box-shadow: 0 8px 32px rgba(0,0,0,0.6); min-width: 200px; margin-top: 2px;
        }
        .qs-dropdown.open { display: block; }
        .qs-dropdown-item {
            padding: 12px 14px; cursor: pointer; transition: all 0.15s;
            border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 8px;
            position: relative; min-height: 44px;
        }
        .qs-dropdown-item:hover { background: rgba(59,130,246,0.04); }
        .qs-dropdown-item .qs-name {
            font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 1.5px;
            color: var(--text); text-transform: uppercase; font-weight: 700;
        }
        .qs-dropdown-item .qs-status {
            margin-left: auto; font-family: 'Space Mono', monospace; font-size: 10px;
            letter-spacing: 1px; color: var(--muted);
        }
        .qs-dropdown-item.scanning .qs-name { color: #a855f7; }
        .qs-dropdown-item.scanning { border-color: rgba(168,85,247,0.3); animation: pulseGlow 1.2s ease-in-out infinite; }
        /* Ticker preview on hover */
        .qs-ticker-preview {
            display: none; position: absolute; left: 100%; top: 0; z-index: 70;
            background: var(--surface2); border: 1px solid var(--border2);
            box-shadow: 0 8px 24px rgba(0,0,0,0.5); padding: 8px 10px;
            min-width: 140px; pointer-events: none;
        }
        .qs-dropdown-item:hover .qs-ticker-preview { display: block; }
        .qs-ticker-preview .qs-ticker-pill {
            font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 1px;
            color: #e2c4c4; padding: 3px 0; border-bottom: 1px solid var(--border);
        }
        .qs-ticker-preview .qs-ticker-pill:last-child { border-bottom: none; }

        /* ── Sidebar Panel (cards when ticker loaded) ──────────────── */
        .bluf-layout { display: flex; gap: 16px; }
        .bluf-main { flex: 1; min-width: 0; }
        .bluf-sidebar {
            width: 180px; flex-shrink: 0;
            background: var(--surface); border: 1px solid var(--border);
            max-height: calc(100vh - 120px); overflow-y: auto;
            position: sticky; top: 80px;
        }
        .bluf-sidebar .sidebar-tab {
            padding: 10px 12px; cursor: pointer; transition: all 0.15s;
            border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 6px;
            position: relative; min-height: 44px;
        }
        .bluf-sidebar .sidebar-tab:hover { background: rgba(59,130,246,0.04); }
        .bluf-sidebar .sidebar-tab.active { background: rgba(59,130,246,0.08); border-left: 2px solid var(--accent); }
        .bluf-sidebar .sidebar-tab .tab-title {
            font-family: 'Space Mono', monospace; font-size: 9px; letter-spacing: 1.5px;
            color: var(--text); text-transform: uppercase; font-weight: 700;
        }
        .bluf-sidebar .sidebar-tab .tab-badge {
            font-family: 'Space Mono', monospace; font-size: 8px; letter-spacing: 1px;
            padding: 1px 4px; border: 1px solid; margin-left: auto; white-space: nowrap;
        }
        /* ── Hover Preview Popup ──────────────────────────────────── */
        .sidebar-preview-popup {
            display: none; position: fixed; z-index: 9999;
            width: 260px; background: var(--surface2); border: 1px solid var(--border2);
            box-shadow: 0 12px 48px rgba(0,0,0,0.7), 0 0 1px rgba(59,130,246,0.2);
            pointer-events: none; overflow: hidden;
        }
        .sidebar-preview-popup .preview-header {
            width: 100%; height: 64px; background: var(--surface3); overflow: hidden;
            position: relative; display: flex; align-items: center; justify-content: center;
        }
        .sidebar-preview-popup .preview-header img {
            width: 100%; height: 100%; object-fit: cover; opacity: 0.85;
        }
        .sidebar-preview-popup .preview-body {
            padding: 10px 12px 12px;
        }
        .sidebar-preview-popup .preview-title {
            font-family: 'Space Mono', monospace; font-size: 9px;
            letter-spacing: 2.5px; color: var(--text); font-weight: 700; text-transform: uppercase;
        }
        .sidebar-preview-popup .preview-sub {
            font-size: 10px; color: var(--muted); margin-top: 3px; line-height: 1.4;
        }
        .sidebar-preview-popup .preview-badge {
            display: inline-block; font-family: 'Space Mono', monospace;
            font-size: 10px; letter-spacing: 1px; padding: 3px 8px;
            border: 1px solid; margin-top: 6px;
        }
        .sidebar-preview-popup::before {
            content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
        }

        /* ── Desktop: Fixed Left Sidebar Navigation ──────────────── */
        .nav-sidebar {
            width: 72px; position: fixed; left: 0; top: 0;
            height: 100vh; background: var(--surface);
            border-right: 1px solid var(--border);
            display: flex; flex-direction: column; align-items: center;
            z-index: 55; padding: 10px 0 0 0; gap: 0;
        }
        .nav-sidebar .nav-logo {
            width: 48px; height: 48px; margin-bottom: 12px; cursor: pointer;
            border-radius: 8px; overflow: hidden; flex-shrink: 0;
        }
        .nav-sidebar .nav-logo img { width: 100%; height: 100%; object-fit: cover; }
        .nav-sidebar .nav-divider {
            width: 44px; height: 1px; background: linear-gradient(90deg, var(--cyan), var(--magenta)); margin: 6px 0; opacity: 0.5;
        }
        .nav-item {
            display: flex; flex-direction: column; align-items: center;
            justify-content: center; gap: 4px; width: 100%;
            padding: 12px 0; cursor: pointer; min-height: 48px;
            border-left: 3px solid transparent; transition: all 0.2s;
            text-decoration: none; color: var(--text-dim); position: relative;
        }
        .nav-item:hover { color: var(--cyan); background: rgba(0,212,255,0.04); }
        .nav-item.active { border-left-color: var(--cyan); color: var(--cyan); background: rgba(0,212,255,0.06); }
        .nav-item[data-nav="charts"]:hover, .nav-item[data-nav="charts"].active { color: var(--cyan-dim); border-left-color: var(--cyan-dim); background: rgba(78,205,196,0.06); }
        .nav-item[data-nav="intel"]:hover, .nav-item[data-nav="intel"].active { color: var(--magenta); border-left-color: var(--magenta); background: rgba(200,80,192,0.06); }
        .nav-item[data-nav="trades"]:hover, .nav-item[data-nav="trades"].active { color: var(--purple); border-left-color: var(--purple); background: rgba(168,85,247,0.06); }
        .nav-item[data-nav="content"]:hover, .nav-item[data-nav="content"].active { color: var(--red); border-left-color: var(--red); background: rgba(239,68,68,0.06); }
        .nav-item[data-nav="social"]:hover, .nav-item[data-nav="social"].active { color: var(--cyan); border-left-color: var(--cyan); background: rgba(0,212,255,0.06); }
        .nav-item-icon { font-size: 18px; line-height: 1; }
        .nav-item-label {
            font-family: 'Space Mono', monospace; font-size: 9px;
            letter-spacing: 0.8px; text-transform: uppercase;
            text-align: center; white-space: nowrap;
        }
        .nav-item .nav-badge {
            position: absolute; top: 6px; right: 8px;
            font-family: 'Space Mono', monospace; font-size: 8px;
            min-width: 16px; height: 16px; border-radius: 8px;
            display: flex; align-items: center; justify-content: center;
            background: var(--cyan); color: #000; font-weight: 700;
        }

        /* ── Home Shorts Column — desktop website only ──────────── */
        .home-shorts-col {
            width: 390px; flex-shrink: 0;
            position: sticky; top: 80px;
            max-height: calc(100vh - 100px);
            overflow-y: auto;
            overflow-x: hidden;
            background: var(--bg, #060614);
            border-radius: 12px;
            scrollbar-width: thin;
            scrollbar-color: rgba(59,130,246,0.2) transparent;
        }
        .home-shorts-col::-webkit-scrollbar { width: 4px; }
        .home-shorts-col::-webkit-scrollbar-track { background: transparent; }
        .home-shorts-col::-webkit-scrollbar-thumb { background: rgba(59,130,246,0.2); border-radius: 2px; }
        .home-shorts-col .shorts-card {
            width: 100% !important;
            min-height: auto !important;
            border-radius: 12px !important;
            margin-bottom: 0 !important;
            animation: none !important;
            overflow: visible !important;
        }
        @media (max-width: 800px) {
            .home-shorts-col { display: none !important; }
        }

        /* ── Mobile Shorts Card (inline above scan feed) ──────────── */
        #mobileShortsWrap {
            margin-bottom: 12px;
        }
        #mobileShortsWrap .shorts-card {
            width: 100% !important;
            max-width: 100% !important;
            min-height: auto !important;
            border-radius: 12px !important;
            box-shadow: 0 0 40px rgba(59,130,246,0.08), 0 10px 40px rgba(0,0,0,0.5) !important;
            animation: none !important;
            overflow: visible !important;
        }
        @media (min-width: 801px) {
            #mobileShortsWrap { display: none !important; }
        }

        /* ── Section Top Tabs (sub-nav within each section) ──────── */
        .section-top-tabs {
            display: flex; gap: 0; border-bottom: 1px solid var(--border);
            background: var(--surface2); padding: 0; overflow-x: auto;
            -webkit-overflow-scrolling: touch; margin: 0;
        }
        .section-top-tabs::-webkit-scrollbar { height: 2px; }
        .section-top-tabs::-webkit-scrollbar-thumb { background: var(--border2); }
        .section-tab-btn {
            flex-shrink: 0; padding: 12px 16px;
            background: transparent; border: none;
            border-bottom: 2px solid transparent;
            color: var(--text-dim); font-family: 'Space Mono', monospace;
            font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase;
            cursor: pointer; transition: all 0.2s; white-space: nowrap;
            min-height: 44px;
        }
        .section-tab-btn:hover { color: var(--cyan); border-bottom-color: rgba(0,212,255,0.3); }
        .section-tab-btn.active { color: var(--cyan); border-bottom-color: var(--cyan); }

        /* ── Inline Chart View Switcher (inside chart sections) ──── */
        .chart-view-nav {
            display: flex; gap: 0; overflow-x: auto;
            background: var(--surface2); border-bottom: 1px solid var(--border);
            -webkit-overflow-scrolling: touch;
        }
        .chart-view-nav::-webkit-scrollbar { height: 2px; }
        .chart-view-nav::-webkit-scrollbar-thumb { background: var(--border2); }
        .chart-view-btn {
            flex-shrink: 0; padding: 10px 14px;
            background: transparent; border: none;
            border-bottom: 2px solid transparent;
            color: var(--text-dim); font-family: 'Space Mono', monospace;
            font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase;
            cursor: pointer; transition: all 0.2s; white-space: nowrap;
            min-height: 38px;
        }
        .chart-view-btn:hover { color: var(--cyan); border-bottom-color: rgba(0,212,255,0.3); }
        .chart-view-btn.active { color: var(--cyan); border-bottom-color: var(--cyan); }

        /* ── Main content area shifts right for desktop sidebar ──── */
        .bluf-page-wrap {
            margin-left: 72px; min-height: 100vh; overflow-x: clip;
            padding-top: 64px; /* offset for fixed header */
        }
        /* Fixed header for all breakpoints — sticky breaks when ancestors have overflow */
        #stickyHeader {
            position: fixed !important;
            top: 0 !important;
            left: 72px !important;
            right: 0 !important;
            width: auto !important;
            z-index: 999 !important;
            background: linear-gradient(90deg, #0e1230 0%, #141035 50%, #0e1230 100%) !important;
        }
        /* Nav content sections */
        .nav-content-section { display: none; }
        .nav-content-section.active {
            display: block;
            position: sticky;
            top: var(--sticky-offset, 90px);
            z-index: 11;
            background: var(--bg);
            margin: 0;
        }

        /* ── Mobile: Bottom Navigation Bar ────────────────────────── */
        .nav-mobile-bottom {
            display: none; /* hidden on desktop */
        }
        /* Desktop logo in header: bigger */
        .header-logo-img { height: 36px; width: 36px; }
        /* Header glow line */
        #stickyHeader::after {
            content: '';
            position: absolute;
            bottom: -1px;
            left: 0;
            right: 0;
            height: 1px;
            background: linear-gradient(90deg,
                transparent 0%,
                rgba(0,212,255,0.4) 20%,
                rgba(200,80,192,0.5) 50%,
                rgba(0,212,255,0.4) 80%,
                transparent 100%);
            animation: headerGlow 4s ease-in-out infinite;
        }
        @keyframes headerGlow {
            0%, 100% { opacity: 0.6; }
            50% { opacity: 1; }
        }

        /* ── Scan Chyron — fixed fade-cycle bar below header ──────── */
        .scan-chyron {
            position: fixed;
            top: 58px;
            left: 72px;
            right: 0;
            z-index: 998;
            height: 32px;
            background: linear-gradient(90deg, rgba(10,14,34,0.95) 0%, rgba(14,18,48,0.97) 50%, rgba(10,14,34,0.95) 100%);
            border-bottom: 1px solid rgba(0,212,255,0.12);
            box-shadow: 0 2px 12px rgba(0,0,0,0.4), 0 1px 0 rgba(0,212,255,0.06);
            overflow: hidden;
            display: flex;
            align-items: center;
        }
        .scan-chyron.chyron-hidden {
            display: none !important;
        }

        /* ── Left badge: pulse + INTEL label ── */
        .chyron-left-badge {
            display: flex;
            align-items: center;
            gap: 6px;
            padding: 0 10px 0 14px;
            flex-shrink: 0;
            border-right: 1px solid rgba(255,255,255,0.08);
            height: 100%;
            background: rgba(10,14,34,0.98);
            z-index: 2;
        }
        .chyron-pulse {
            display: inline-block;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: #22c55e;
            box-shadow: 0 0 8px rgba(34,197,94,0.5);
            animation: scanPulse 1s ease-in-out infinite;
            flex-shrink: 0;
        }
        .chyron-label {
            font-family: 'Space Mono', monospace;
            font-size: 8px;
            letter-spacing: 2px;
            color: #22c55e;
            font-weight: 700;
            flex-shrink: 0;
        }

        /* ── Scrolling track ── */
        .chyron-track-container {
            flex: 1;
            overflow: hidden;
            height: 100%;
            position: relative;
            mask-image: linear-gradient(90deg, transparent 0%, #000 3%, #000 97%, transparent 100%);
            -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 3%, #000 97%, transparent 100%);
        }
        .chyron-track {
            display: flex;
            align-items: center;
            height: 100%;
            white-space: nowrap;
            will-change: transform;
            animation: chyronScroll var(--chyron-duration, 90s) linear infinite;
        }
        /* Hover to pause, click to search */
        .chyron-track-container:hover .chyron-track {
            animation-play-state: paused;
        }
        @keyframes chyronScroll {
            0%   { transform: translateX(0); }
            100% { transform: translateX(-50%); }
        }

        /* ── Individual ticker items ── */
        .chyron-item {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 0 16px;
            height: 100%;
            cursor: pointer;
            border-right: 1px solid rgba(255,255,255,0.05);
            flex-shrink: 0;
            transition: background 0.15s;
        }
        .chyron-item:hover {
            background: rgba(0,212,255,0.06);
        }
        .chyron-item.chyron-item-new {
            animation: chyronFlash 2s ease-out;
        }
        @keyframes chyronFlash {
            0%   { background: rgba(34,197,94,0.25); }
            100% { background: transparent; }
        }
        .chy-ticker { color: #e2c4c4; font-family: 'Space Mono', monospace; font-weight: 700; letter-spacing: 0.1em; font-size: 12px; }
        .chy-price { color: #e0e4f0; font-family: 'Space Mono', monospace; font-size: 11px; font-weight: 600; }
        .chy-regime { font-size: 10px; font-weight: 700; }
        .chy-regime-pos { color: #22c55e; }
        .chy-regime-neg { color: #ef4444; }
        .chy-regime-neutral { color: #f59e0b; }
        .chy-level { font-family: 'Space Mono', monospace; font-size: 10px; font-weight: 600; }
        .chy-anchor { color: #22d3ee; }
        .chy-flip { color: #a855f7; }
        .chy-expiry { color: #f59e0b; }
        .chy-delta { font-size: 9px; font-weight: 600; margin-left: 1px; }
        .chy-delta-up { color: #22c55e; }
        .chy-delta-dn { color: #ef4444; }
        .chy-time { color: #5068a0; font-family: 'Space Mono', monospace; font-size: 9px; }
        .chy-sep { color: rgba(255,255,255,0.12); margin: 0 2px; font-size: 8px; }

        /* ── Toggle / hide button ── */
        .chyron-toggle-btn {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 28px;
            height: 100%;
            flex-shrink: 0;
            background: rgba(10,14,34,0.98);
            border: none;
            border-left: 1px solid rgba(255,255,255,0.08);
            color: #5068a0;
            font-size: 12px;
            cursor: pointer;
            transition: color 0.15s, background 0.15s;
            z-index: 2;
        }
        .chyron-toggle-btn:hover {
            color: #ef4444;
            background: rgba(239,68,68,0.08);
        }
        /* Mini restore button shown when chyron is hidden */
        .chyron-restore-btn {
            position: fixed;
            top: 58px;
            z-index: 998;
            right: 12px;
            width: 24px;
            height: 20px;
            background: rgba(10,14,34,0.9);
            border: 1px solid rgba(0,212,255,0.15);
            border-radius: 0 0 4px 4px;
            color: #22c55e;
            font-size: 9px;
            font-family: 'Space Mono', monospace;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            letter-spacing: 1px;
            transition: background 0.15s;
        }
        .chyron-restore-btn:hover {
            background: rgba(0,212,255,0.1);
        }

        /* ── Chyron responsive ── */
        /* Chyron sits flush against the bottom of the fixed mobile header (at
           108px). Isaac asked for the mobile chyron to be ~2x taller — it was
           shrunk at some point and feels cramped vs. the rest of the phone UI.
           Chyron height is now 56px (was 28), so it fills what used to be a
           gap between the chyron and the shorts card top. Page-wrap padding
           is bumped accordingly (108 + 56 + 4 = 168). All inner items scale
           up proportionally so the ticker, levels, price, deltas, time, and
           separators feel balanced in the taller bar. */
        @media (max-width: 800px) {
            .scan-chyron {
                left: 0 !important;
                top: 108px;
            }
            .chyron-restore-btn { top: 108px; }
        }
        @media (max-width: 768px) {
            .scan-chyron {
                top: 108px;
                height: 56px;
            }
            .chyron-left-badge { padding: 0 12px 0 14px; gap: 8px; }
            .chyron-pulse { width: 8px; height: 8px; }
            .chyron-label { font-size: 10px; letter-spacing: 2.5px; }
            .chyron-item { padding: 0 16px; gap: 8px; }
            .chy-ticker { font-size: 16px; }
            .chy-price { font-size: 14px; }
            .chy-regime { font-size: 13px; }
            .chy-level { font-size: 12px; }
            .chy-delta { font-size: 11px; }
            .chy-time { font-size: 11px; }
            .chy-sep { font-size: 10px; }
            .chyron-toggle-btn { width: 36px; font-size: 14px; }
            .chyron-restore-btn { top: 108px; width: 36px; height: 28px; font-size: 11px; }
            /* Chyron items are ~1.4x wider on mobile (bigger fonts) but the
               viewport is ~3x narrower. Same JS-set duration crawls. Speed it
               up so each ticker spends a sensible amount of time on screen. */
            .chyron-track {
                animation-duration: max(7s, calc(var(--chyron-duration, 90s) * 0.32));
            }
        }

        @media (min-width: 801px) {
            /* Hide header logo on desktop — sidebar has it */
            .header-logo { display: none !important; }
            /* Hide old sidebar on desktop — replaced by left nav */
            .bluf-sidebar { display: none !important; }
            /* Hide Back buttons — nav sidebar handles navigation */
            .back-btn { display: none !important; }
            /* SOCIAL button visible on all sizes — no toggle needed */
            /* Header is now outside .bluf-page-wrap — offset from sidebar on desktop */
            #stickyHeader { left: 72px !important; }
        }
        @media (max-width: 800px) {
            .nav-sidebar { display: none !important; }
            /* Top-right header-right is hidden on all mobile sizes — EXPORT lives in the bottom nav */
            .header-right { display: none !important; }
            .bluf-page-wrap { margin-left: 0 !important; padding-bottom: 76px; max-width: 100vw; overflow-x: clip; }
            #sectionContent, #sectionContent > div { max-width: 100vw; overflow-x: clip; word-break: break-word; }
            .nav-mobile-bottom {
                display: flex; position: fixed; bottom: 0; left: 0; right: 0;
                height: 68px; background: var(--surface);
                border-top: 2px solid var(--border2);
                justify-content: space-around; align-items: center;
                z-index: 55; padding: 0 4px;
                box-shadow: 0 -4px 20px rgba(0,0,0,0.5);
                -webkit-transform: translateZ(0); transform: translateZ(0);
                -webkit-backface-visibility: hidden; backface-visibility: hidden;
            }
            .nav-mobile-item {
                display: flex; flex-direction: column; align-items: center;
                justify-content: center; gap: 3px; cursor: pointer;
                color: var(--text-dim); text-decoration: none;
                transition: all 0.2s; flex: 1; height: 100%;
                min-width: 44px; min-height: 44px;
                border-top: 3px solid transparent; position: relative;
            }
            .nav-mobile-item:hover { color: var(--cyan); }
            .nav-mobile-item.active { color: var(--cyan); border-top-color: var(--cyan); background: rgba(0,212,255,0.06); }
            .nav-mobile-item[data-nav="charts"].active { color: var(--cyan-dim); border-top-color: var(--cyan-dim); }
            .nav-mobile-item[data-nav="intel"].active { color: var(--magenta); border-top-color: var(--magenta); }
            .nav-mobile-item[data-nav="trades"].active { color: var(--purple); border-top-color: var(--purple); }
            .nav-mobile-item[data-nav="content"].active { color: var(--red); border-top-color: var(--red); }
            .nav-mobile-item[data-nav="social"] { color: var(--cyan); }
            .nav-mobile-item[data-nav="social"]:active { background: rgba(0,212,255,0.1); }
            .nav-mobile-item[data-nav="export"] { color: var(--accent); }
            .nav-mobile-item[data-nav="export"]:active { background: rgba(0,212,255,0.1); }
            .nav-mobile-icon { font-size: 20px; line-height: 1; }
            .nav-mobile-label {
                font-family: 'Space Mono', monospace; font-size: 10px;
                letter-spacing: 0.8px; text-transform: uppercase;
                text-align: center; white-space: nowrap;
            }
            .nav-mobile-item .nav-badge {
                position: absolute; top: 4px; right: calc(50% - 20px);
                font-family: 'Space Mono', monospace; font-size: 8px;
                min-width: 16px; height: 16px; border-radius: 8px;
                display: flex; align-items: center; justify-content: center;
                background: var(--cyan); color: #000; font-weight: 700;
            }
            /* Old sidebar becomes horizontal scrollable tabs on mobile */
            .bluf-layout { flex-direction: column; }
            .bluf-sidebar { display: none !important; }
            .sidebar-preview-popup { display: none !important; }
            .qs-ticker-preview { display: none !important; }
            /* SOCIAL button always visible — no toggle needed */
            .social-sq { width: 44px; height: 44px; font-size: 16px; }
            /* Mobile: filter bar stacks */
            .sf-filter-bar { flex-direction: column; gap: 6px; padding: 6px 8px; }
            .sf-ticker-input { width: 100%; }
            .sf-filter-pills { flex-wrap: wrap; gap: 3px; }
            .sf-pill { font-size: 7px; padding: 3px 6px; }
            /* Scanner rows — larger touch targets + readable text */
            .scan-feed-table th { font-size: 9px; padding: 8px 6px; }
            .scan-feed-table td { padding: 10px 6px !important; min-height: 44px; font-size: 12px; }
            .scan-feed-table tr { min-height: 44px; }
            /* Mobile: column 1 compact */
            .sf-ticker { font-size: 12px; }
            .sf-meta { font-size: 8px; }
            /* Mobile: bold dollar values */
            .sf-dollar { font-size: 12px; }
            .sf-delta-up, .sf-delta-dn { font-size: 10px; }
            .sf-regime-pos, .sf-regime-neg { font-size: 18px; }
            /* Mobile: watermark above bottom nav */
            #iked33Watermark { bottom: 82px !important; font-size: 8px !important; }
        }

        /* ── iPad / Tablet breakpoint ──────────────────────────── */
        @media (min-width: 601px) and (max-width: 1024px) {
            .scan-feed-table th { font-size: 11px; padding: 12px 12px; letter-spacing: 1.5px; }
            .scan-feed-table td { font-size: 14px; padding: 14px 12px; }
            .scan-feed-table tr { min-height: 52px; }
            .sf-ticker { font-size: 14px; }
            .sf-meta { font-size: 10px; color: #a0a8c0; }
            .sf-dollar { font-size: 14px; }
            .sf-delta-up, .sf-delta-dn { font-size: 12px; }
            .sf-regime-pos, .sf-regime-neg { font-size: 22px; }
            .sf-filter-pills { gap: 5px; }
            .sf-pill { font-size: 9px; padding: 5px 10px; }
        }
        .hub-card {
            background: var(--surface2); border: 1px solid var(--border);
            padding: 0; cursor: pointer; transition: all 0.2s; overflow: hidden;
            position: relative;
        }
        .hub-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; transition: opacity 0.2s; }
        .hub-card.hc-gamma::before   { background: linear-gradient(90deg, #22c55e, #3b82f6); }
        .hub-card.hc-heatmap::before { background: linear-gradient(90deg, #ef4444, #22c55e); }
        .hub-card.hc-ideas::before   { background: linear-gradient(90deg, #3b82f6, #a855f7); }
        .hub-card.hc-tv::before      { background: linear-gradient(90deg, #6366f1, #3b82f6); }
        .hub-card.hc-force::before   { background: linear-gradient(90deg, #f59e0b, #ef4444); }
        .hub-card.hc-unusual::before { background: linear-gradient(90deg, #f59e0b, #ef4444); animation: pulseGlow 1.6s ease-in-out infinite; }
        .hub-card.hc-triggers::before { background: linear-gradient(90deg, #a855f7, #3b82f6); }
        .hub-card.hc-report::before { background: linear-gradient(90deg, #3b82f6, #22c55e); }
        .hub-card.hc-scanner::before { background: linear-gradient(90deg, #7c3aed, #a855f7); animation: pulseGlow 1.6s ease-in-out infinite; }
        .hub-card.hc-gemini::before { background: linear-gradient(90deg, #f59e0b, #ef4444); }
        @keyframes pulseGlow { 0%,100%{opacity:1} 50%{opacity:0.5} }
        .hub-card:hover { border-color: var(--border2); transform: translateY(-2px);
                          box-shadow: 0 8px 32px rgba(0,0,0,0.5); }
        .hub-card.active { border-color: var(--accent); }
        .hub-card-preview { width: 100%; height: 60px; display: block; background: var(--surface3); }
        .hub-card-body { padding: 10px 12px 12px; }
        .hub-card-title { font-family: 'Space Mono', monospace; font-size: 9px;
                          letter-spacing: 2.5px; color: var(--text); font-weight: 700; text-transform: uppercase; }
        .hub-card-sub { font-size: 10px; color: var(--muted); margin-top: 3px; line-height: 1.4; }
        /* Terminal social quick-launch pills */
        .terminal-ql {
            display:inline-flex;align-items:center;gap:6px;padding:6px 12px;
            background:rgba(12,12,26,0.8);border:1px solid rgba(255,255,255,0.06);border-radius:6px;
            text-decoration:none;transition:all 0.15s;cursor:pointer;
        }
        .terminal-ql:hover {
            border-color:var(--tql-c, #3b82f6);
            background:rgba(255,255,255,0.03);
            box-shadow:0 0 10px color-mix(in srgb, var(--tql-c, #3b82f6) 18%, transparent);
        }
        .terminal-ql-icon { font-size:12px;color:#505070;transition:color 0.15s; }
        .terminal-ql:hover .terminal-ql-icon { color:var(--tql-c, #3b82f6); }
        .terminal-ql-label {
            font-family:'Space Mono',monospace;font-size:9px;font-weight:600;
            letter-spacing:0.8px;color:#505070;text-transform:uppercase;transition:color 0.15s;
        }
        .terminal-ql:hover .terminal-ql-label { color:#c0c0d8; }
        .hub-card-badge { display: inline-block; font-family: 'Space Mono', monospace;
                          font-size: 10px; letter-spacing: 1px; padding: 3px 8px;
                          border: 1px solid; margin-top: 6px; }
        .badge-ready  { border-color: rgba(34,197,94,0.4); color: #22c55e; background: rgba(34,197,94,0.06); }
        .badge-none   { border-color: rgba(112,112,160,0.3); color: var(--muted); }
        .badge-flow   { border-color: rgba(99,102,241,0.4); color: #a5b4fc; background: rgba(99,102,241,0.06); }
        .badge-warn   { border-color: rgba(59,130,246,0.4); color: #60a5fa; background: rgba(59,130,246,0.08); }
        .badge-alert  { border-color: rgba(245,158,11,0.5); color: #f59e0b; background: rgba(245,158,11,0.08); animation: pulseGlow 1.6s ease-in-out infinite; }
        .section-panel { background: var(--surface); border: 1px solid var(--border); margin-top: 16px; }
        .section-header { padding: 10px 16px; border-bottom: 1px solid var(--border);
                          background: var(--surface2); display: flex; align-items: center;
                          justify-content: space-between;
                          position: sticky; top: calc(var(--sticky-offset, 90px) + 46px); z-index: 10; }
        .section-panel { margin-top: 0; }
        /* Give the TradingView iframe container enough clearance so the sticky
         * BLUF tabs/header don't cover the TV widget's own top toolbar/symbol
         * info when the section is scrolled into view. */
        #tv-outer { scroll-margin-top: calc(var(--sticky-offset, 90px) + 60px); }
        #sec-tv .section-panel { scroll-margin-top: var(--sticky-offset, 90px); }
        .section-label { font-family: 'Space Mono', monospace; font-size: 9px;
                         letter-spacing: 3px; color: var(--accent); text-transform: uppercase; font-weight: 700; }
        .back-btn { font-family: 'Space Mono', monospace; font-size: 9px; letter-spacing: 1px;
                    color: var(--muted); background: none; border: none; cursor: pointer;
                    transition: color 0.15s; padding: 0; }
        .back-btn:hover { color: var(--accent); }
        .unusual-card {
            background: var(--surface); border: 1px solid rgba(245,158,11,0.25);
            border-left: 3px solid var(--amber); padding: 14px 16px; margin-bottom: 10px;
        }
        .unusual-card.bearish { border-left-color: var(--red); border-color: rgba(239,68,68,0.2); }
        /* Phase 2: Pro terminal refinements */
        .hub-card { border-radius: 0; transition: all 0.25s cubic-bezier(0.4,0,0.2,1); }
        .hub-card:hover { transform: translateY(-3px); box-shadow: 0 12px 40px rgba(0,0,0,0.6), 0 0 1px rgba(59,130,246,0.3); }
        .section-panel { border-radius: 0; }
        .level-card { border-radius: 0; }
        /* Glow effects for critical elements */
        .hero-flip-glow { box-shadow: 0 0 20px rgba(0,210,255,0.15), inset 0 0 20px rgba(0,210,255,0.05); }
        /* Smooth scrollbar */
        ::-webkit-scrollbar { width: 6px; }
        ::-webkit-scrollbar-track { background: var(--bg); }
        ::-webkit-scrollbar-thumb { background: var(--border2); border-radius: 3px; }
        ::-webkit-scrollbar-thumb:hover { background: var(--accent); }

        /* ── Gamma Analysis Top Banner (for screen recording) ──────── */
        @keyframes bannerSlideIn {
            0% { transform: translateY(100%); opacity: 0; }
            60% { transform: translateY(-4px); opacity: 1; }
            100% { transform: translateY(0); opacity: 1; }
        }
        @keyframes bannerGlow {
            0%, 100% { box-shadow: 0 0 20px rgba(0,210,255,0.3), 0 0 60px rgba(0,210,255,0.1), inset 0 0 30px rgba(0,210,255,0.05); }
            50% { box-shadow: 0 0 30px rgba(0,210,255,0.5), 0 0 80px rgba(0,210,255,0.2), inset 0 0 40px rgba(0,210,255,0.1); }
        }
        @keyframes bannerTextPulse {
            0%, 100% { text-shadow: 0 0 10px currentColor, 0 0 30px currentColor; }
            50% { text-shadow: 0 0 20px currentColor, 0 0 50px currentColor, 0 0 80px currentColor; }
        }
        #gammaTopBanner {
            display: none;
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 9999;
            background: linear-gradient(135deg, #080818 0%, #0a0a20 40%, #0c0c28 100%);
            border-top: 2px solid rgba(0,210,255,0.4);
            padding: 14px 20px;
            animation: bannerSlideIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards,
                       bannerGlow 2.5s ease-in-out infinite;
            font-family: 'Space Mono', monospace;
            cursor: pointer;
            box-shadow: 0 -8px 40px rgba(0,0,0,0.8);
        }
        #gammaTopBanner .banner-strike {
            font-family: 'Orbitron', 'Space Mono', monospace;
            font-size: 28px;
            font-weight: 900;
            letter-spacing: 0.05em;
            line-height: 1;
            animation: bannerTextPulse 2s ease-in-out infinite;
        }
        #gammaTopBanner .banner-type {
            font-size: 10px;
            letter-spacing: 3px;
            text-transform: uppercase;
            font-weight: 700;
        }
        #gammaTopBanner .banner-detail {
            font-size: 11px;
            color: #8888b0;
            line-height: 1.5;
            margin-top: 4px;
        }
        #gammaTopBanner .banner-intensity-bar {
            height: 4px;
            border-radius: 2px;
            margin-top: 8px;
            background: linear-gradient(90deg, #0a0a16, #0a0a16);
            overflow: hidden;
            position: relative;
        }
        #gammaTopBanner .banner-intensity-fill {
            height: 100%;
            border-radius: 2px;
            transition: width 0.6s cubic-bezier(0.16, 1, 0.3, 1);
        }
        #gammaTopBanner .banner-close {
            position: absolute;
            top: 6px;
            right: 8px;
            font-size: 14px;
            color: #505070;
            cursor: pointer;
            padding: 10px 12px;
            min-width: 44px; min-height: 44px;
            display: flex; align-items: center; justify-content: center;
            transition: color 0.15s;
        }
        #gammaTopBanner .banner-close:hover { color: #ef4444; }

        /* ── YouTube Shorts Card Overlay ──────────────────────────── */
        @keyframes shortsCardFade {
            0% { opacity: 0; transform: scale(0.95); }
            100% { opacity: 1; transform: scale(1); }
        }
        @keyframes shortsGlow { 0%,100%{box-shadow:0 0 20px rgba(59,130,246,0.1);} 50%{box-shadow:0 0 40px rgba(59,130,246,0.25);} }
        @keyframes shortsPulse { 0%,100%{opacity:0.6;} 50%{opacity:1;} }
        @keyframes shortsSlideUp { from{opacity:0;transform:translateY(20px);} to{opacity:1;transform:translateY(0);} }
        @keyframes shortsFillBar { from{width:0%;} to{width:var(--fill-pct);} }
        @keyframes shortsRotate { from{transform:rotate(0deg);} to{transform:rotate(360deg);} }
        @keyframes fadeInUp { from{opacity:0;transform:translateY(10px);} to{opacity:1;transform:translateY(0);} }
        .shorts-ql {
            display:flex;flex-direction:column;align-items:center;gap:5px;padding:12px 10px;
            background:#0c0c1a;border:1px solid rgba(255,255,255,0.05);border-radius:6px;
            text-decoration:none;transition:all 0.15s;cursor:pointer;min-height:44px;
        }
        .shorts-ql:hover {
            border-color:var(--ql-c, #3b82f6);
            background:rgba(255,255,255,0.02);
            box-shadow:0 0 12px color-mix(in srgb, var(--ql-c, #3b82f6) 20%, transparent);
        }
        .shorts-ql-label {
            font-family:'Space Mono',monospace;font-size:10px;font-weight:600;
            text-transform:uppercase;letter-spacing:0.5px;color:#505070;text-align:center;
        }
        .shorts-ql:hover .shorts-ql-label { color:#c0c0d8; }
        #shortsCardOverlay {
            display: none;
            position: fixed;
            top: 0; left: 0; right: 0; bottom: 0;
            z-index: 1100;
            background: rgba(0,0,0,0.9);
            backdrop-filter: blur(12px);
            overflow-y: auto;
            overscroll-behavior: contain;
            padding: 20px 0;
        }
        #shortsCardOverlay.active { display: block; }
        #shortsCardOverlay > div {
            display: flex;
            flex-direction: column;
            align-items: center;
            min-height: min-content;
        }
        #shortsTickerBadge {
            position: fixed;
            top: 24px;
            right: calc(50vw - 195px + 10px);
            z-index: 210;
            background: #0a0a1a;
            border: 1px solid rgba(59,130,246,0.2);
            border-radius: 6px;
            padding: 4px 10px 5px;
            display: none;
            align-items: center;
            gap: 6px;
            font-family: 'Space Mono', monospace;
            box-shadow: 0 4px 16px rgba(0,0,0,0.7);
        }
        /* Old external badge hidden — sticky bar is now built into the card itself */
        #shortsCardOverlay.active ~ #shortsTickerBadge { display: none; }
        #shortsTickerBadge .stb-ticker {
            color: #22c55e;
            font-family: 'Orbitron', monospace;
            font-size: 10px;
            font-weight: 700;
            letter-spacing: 0.5px;
        }
        #shortsTickerBadge .stb-price {
            color: #e0e0f8;
            font-family: 'Orbitron', monospace;
            font-size: 10px;
            font-weight: 700;
            letter-spacing: 0.3px;
            padding-left: 2px;
            border-left: 1px solid rgba(255,255,255,0.08);
        }
        #shortsTickerBadge .stb-date {
            color: #d0d0e8;
            font-size: 9px;
            letter-spacing: 0.5px;
        }
        .shorts-card {
            width: 390px;
            min-height: 100vh;
            background: linear-gradient(180deg, var(--surface) 0%, var(--bg) 50%, var(--surface) 100%);
            border: 1px solid rgba(59,130,246,0.25);
            border-radius: 20px;
            overflow: visible;
            position: relative;
            box-shadow: 0 0 80px rgba(59,130,246,0.12), 0 30px 80px rgba(0,0,0,0.9);
            animation: shortsCardFade 0.3s ease-out, shortsGlow 4s ease-in-out infinite;
            display: flex;
            flex-direction: column;
            font-family: 'Space Mono', monospace;
            margin-bottom: 20px;
        }
        .shorts-card::before {
            content:'';position:absolute;top:0;left:0;right:0;bottom:0;
            background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,255,255,0.008) 2px,rgba(255,255,255,0.008) 4px);
            pointer-events:none;z-index:1;border-radius:inherit;
        }
        .shorts-section {
            padding: 24px 22px;
            border-bottom: 1px solid rgba(255,255,255,0.03);
            position: relative;
            animation: shortsSlideUp 0.4s ease-out both;
        }
        .shorts-section:nth-child(2) { animation-delay: 0.05s; }
        .shorts-section:nth-child(3) { animation-delay: 0.1s; }
        .shorts-section:nth-child(4) { animation-delay: 0.15s; }
        .shorts-section:nth-child(5) { animation-delay: 0.2s; }
        .shorts-section:nth-child(6) { animation-delay: 0.25s; }
        .shorts-section:nth-child(7) { animation-delay: 0.3s; }
        .shorts-section:nth-child(8) { animation-delay: 0.35s; }
        .shorts-section:nth-child(9) { animation-delay: 0.4s; }
        .shorts-section:nth-child(10) { animation-delay: 0.45s; }
        .shorts-section:nth-child(11) { animation-delay: 0.5s; }
        .shorts-section:nth-child(12) { animation-delay: 0.55s; }
        .shorts-section-label {
            font-family:'Orbitron','Space Mono',monospace;font-size:13px;letter-spacing:3px;
            color:#606088;margin-bottom:14px;text-transform:uppercase;
        }
        .shorts-level-box {
            background:#0c0c1a;border:1px solid rgba(255,255,255,0.06);padding:12px 14px;
            text-align:center;flex:1;position:relative;overflow:hidden;transition:border-color 0.3s;
        }
        .shorts-level-box:hover { border-color: rgba(59,130,246,0.3); }
        .shorts-level-tag { font-size:11px;letter-spacing:2px;margin-bottom:6px;font-weight:700; }
        .shorts-level-val { font-family:'Orbitron','Space Mono',monospace;font-size:28px;font-weight:900;color:#e8e8f4; }
        .shorts-bar-track { background:#0c0c1a;height:8px;border-radius:4px;overflow:hidden;position:relative; }
        .shorts-bar-fill { height:100%;border-radius:4px;animation:shortsFillBar 1s ease-out both; }
        .shorts-trigger-row {
            display:flex;align-items:center;gap:10px;padding:10px 0;
            border-bottom:1px solid rgba(255,255,255,0.03);
        }
        .shorts-trigger-row:last-child { border-bottom:none; }
        .shorts-mini-chart { background:#0c0c1a;border:1px solid rgba(255,255,255,0.04);border-radius:8px;padding:14px;margin-top:10px; }
        .shorts-donut-ring { fill:none;stroke-width:6;stroke-linecap:round; }
        .shorts-verdict-box {
            background:linear-gradient(135deg,rgba(59,130,246,0.08),rgba(168,85,247,0.08));
            border:1px solid rgba(59,130,246,0.3);border-radius:12px;padding:20px;text-align:center;
        }
        /* Bump all shorts card text for readability */
        .shorts-card { font-size: 13px; line-height: 1.6; }
        .shorts-section { padding: 26px 24px; }
        .shorts-trigger-row { font-size: 13px; padding: 12px 0; }
        .shorts-bar-track { height: 10px; }
        /* Script Modal */
        #shortsScriptModal {
            display:none;position:fixed;inset:0;z-index:1200;background:rgba(0,0,0,0.92);
            backdrop-filter:blur(12px);align-items:center;justify-content:center;padding:20px;
        }
        #shortsScriptModal.active { display:flex; }
        .shorts-script-box {
            background:#0a0a1a;border:1px solid rgba(59,130,246,0.3);border-radius:16px;
            width:460px;max-height:80vh;overflow:hidden;display:flex;flex-direction:column;
            box-shadow:0 0 60px rgba(59,130,246,0.15);
        }
        .shorts-script-box pre {
            margin:0;padding:20px;font-family:'Space Mono',monospace;font-size:11px;
            color:#c0c0e0;line-height:1.8;overflow-y:auto;flex:1;white-space:pre-wrap;word-break:break-word;
        }
        .shorts-btn {
            border:none;padding:12px 20px;font-family:'Space Mono',monospace;font-size:11px;
            letter-spacing:1.5px;cursor:pointer;border-radius:6px;transition:all 0.2s;font-weight:700;
            min-height:44px;
        }
        .shorts-btn:hover { filter:brightness(1.2); }
        .shorts-btn-primary { background:var(--accent,#3b82f6);color:#fff; }
        .shorts-btn-ghost { background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);color:#8888b0; }

        /* ── ANALYZE Button — Dark Signature (Purple / Gold / Blue) ───── */
        #analyzeBtn {
            background: linear-gradient(135deg, #0a0a1a 0%, #1a0e30 40%, #0c1a38 100%) !important;
            border: 1px solid rgba(168, 85, 247, 0.35) !important;
            border-radius: 6px !important;
            box-shadow: 0 0 12px rgba(168, 85, 247, 0.15),
                        0 0 6px rgba(245, 158, 11, 0.08),
                        0 2px 8px rgba(0, 0, 0, 0.6),
                        inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
            padding: 8px 20px !important;
            font-family: 'Space Mono', monospace !important;
            font-size: 10px !important;
            font-weight: 700 !important;
            letter-spacing: 2.5px !important;
            color: #e0d0f0 !important;
            cursor: pointer;
            transition: all 0.3s ease !important;
            text-shadow: 0 0 8px rgba(168, 85, 247, 0.4), 0 1px 3px rgba(0, 0, 0, 0.8) !important;
            position: relative;
            overflow: hidden;
        }
        #analyzeBtn::before {
            content: '';
            position: absolute;
            top: 0; left: -100%; right: 100%; bottom: 0;
            background: linear-gradient(90deg, transparent, rgba(245, 158, 11, 0.08), rgba(168, 85, 247, 0.12), transparent);
            transition: left 0.5s ease, right 0.5s ease;
        }
        #analyzeBtn::after {
            content: '';
            position: absolute;
            bottom: 0; left: 0; right: 0;
            height: 1px;
            background: linear-gradient(90deg, transparent, #a855f7, #f59e0b, #22d3ee, transparent);
            opacity: 0.5;
        }
        #analyzeBtn:hover {
            background: linear-gradient(135deg, #0e0a22 0%, #261440 35%, #0e2248 100%) !important;
            border-color: rgba(168, 85, 247, 0.6) !important;
            box-shadow: 0 0 24px rgba(168, 85, 247, 0.3),
                        0 0 12px rgba(245, 158, 11, 0.15),
                        0 0 8px rgba(34, 211, 238, 0.1),
                        0 4px 20px rgba(0, 0, 0, 0.5),
                        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
            transform: translateY(-1px);
            color: #ffffff !important;
            text-shadow: 0 0 12px rgba(168, 85, 247, 0.6), 0 0 24px rgba(245, 158, 11, 0.3) !important;
        }
        #analyzeBtn:hover::before { left: 100%; right: -100%; }
        #analyzeBtn:active {
            transform: translateY(0px);
            box-shadow: 0 0 6px rgba(168, 85, 247, 0.2),
                        0 1px 4px rgba(0, 0, 0, 0.7),
                        inset 0 2px 4px rgba(0, 0, 0, 0.5) !important;
        }

        /* ── Swing Trades Polish ────────────────────────────────────── */
                .setup-grid > div { border-radius: 4px; }

/* ═══════════════════════════════════════════════════════════════
   SWING TRADES — Modern Redesign
   ═══════════════════════════════════════════════════════════════ */
.swing-panel {
    background: var(--surface);
    border: 1px solid var(--border);
    border-top: none;
    /* No overflow:hidden here — it breaks position:sticky on .swing-header */
}
.swing-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 18px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(135deg, var(--surface2) 0%, rgba(245,158,11,0.03) 100%);
    position: sticky;
    top: calc(var(--sticky-offset, 90px) + 46px);
    z-index: 10;
}
.swing-header-left {
    display: flex;
    align-items: center;
    gap: 12px;
}
.swing-header-title {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    letter-spacing: 3px;
    color: #f59e0b;
    font-weight: 700;
    text-transform: uppercase;
}
.swing-header-date {
    font-family: 'Space Mono', monospace;
    font-size: 8px;
    letter-spacing: 1px;
    color: var(--text-dim);
    opacity: 0.6;
}
.swing-body {
    padding: 18px;
}
/* Section divider */
.swing-section-label {
    font-family: 'Space Mono', monospace;
    font-size: 8px;
    letter-spacing: 2.5px;
    color: #f59e0b;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 12px;
}
.swing-section-label::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, rgba(245,158,11,0.25), transparent);
}
/* Probability bar */
.swing-prob-bar {
    display: flex;
    height: 5px;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 16px;
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
}
.swing-prob-bar .bull { background: linear-gradient(90deg, #166534, #22c55e); }
.swing-prob-bar .bear { background: linear-gradient(90deg, #ef4444, #dc2626); }
.swing-prob-bar .tail { background: linear-gradient(90deg, #f59e0b, #d97706); }
/* Scenario cards */
.swing-scenario-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    margin-bottom: 24px;
}
.swing-scenario {
    padding: 16px;
    border-radius: 10px;
    border: 1px solid;
    position: relative;
    overflow: hidden;
}
.swing-scenario::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
}
.swing-scenario.bull {
    background: rgba(34,197,94,0.04);
    border-color: rgba(34,197,94,0.15);
}
.swing-scenario.bull::before { background: #22c55e; }
.swing-scenario.bear {
    background: rgba(239,68,68,0.04);
    border-color: rgba(239,68,68,0.15);
}
.swing-scenario.bear::before { background: #ef4444; }
.swing-scenario.tail {
    background: rgba(245,158,11,0.04);
    border-color: rgba(245,158,11,0.15);
}
.swing-scenario.tail::before { background: #f59e0b; }
.swing-scenario-pct {
    font-family: 'Orbitron', monospace;
    font-size: 28px;
    font-weight: 900;
    line-height: 1;
    margin-bottom: 4px;
}
.swing-scenario-tag {
    font-family: 'Space Mono', monospace;
    font-size: 8px;
    letter-spacing: 2px;
    font-weight: 700;
    margin-bottom: 10px;
}
.swing-scenario-desc {
    font-size: 11px;
    color: var(--text-dim);
    line-height: 1.65;
}
/* Structure grid */
.swing-structure-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 24px;
}
.swing-structure-card {
    background: rgba(99,102,241,0.03);
    border: 1px solid rgba(99,102,241,0.12);
    border-radius: 10px;
    padding: 14px;
    position: relative;
    overflow: hidden;
}
.swing-structure-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 2px;
    background: #6366f1;
    border-radius: 2px;
}
.swing-structure-label {
    font-family: 'Space Mono', monospace;
    font-size: 7px;
    letter-spacing: 2px;
    color: #6366f1;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.swing-structure-text {
    font-size: 11px;
    color: #c8c8e0;
    line-height: 1.65;
}
/* Trade setup cards */
.swing-setup-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 24px;
}
.swing-setup {
    border-radius: 10px;
    padding: 14px 16px;
    border: 1px solid;
    position: relative;
    overflow: hidden;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.swing-setup:hover {
    box-shadow: 0 2px 16px rgba(0,0,0,0.2);
}
.swing-setup::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 3px;
    border-radius: 3px;
}
.swing-setup.long {
    background: rgba(34,197,94,0.03);
    border-color: rgba(34,197,94,0.15);
}
.swing-setup.long::before { background: #22c55e; }
.swing-setup.long:hover { border-color: rgba(34,197,94,0.3); }
.swing-setup.short {
    background: rgba(239,68,68,0.03);
    border-color: rgba(239,68,68,0.15);
}
.swing-setup.short::before { background: #ef4444; }
.swing-setup.short:hover { border-color: rgba(239,68,68,0.3); }
.swing-setup-top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}
.swing-setup-ticker {
    font-family: 'Orbitron', monospace;
    font-size: 14px;
    font-weight: 900;
}
.swing-setup-type {
    font-family: 'Space Mono', monospace;
    font-size: 7px;
    letter-spacing: 1.5px;
    padding: 2px 8px;
    border-radius: 4px;
    font-weight: 700;
}
.swing-setup.long .swing-setup-ticker { color: #22c55e; }
.swing-setup.long .swing-setup-type { color: #22c55e; background: rgba(34,197,94,0.08); border: 1px solid rgba(34,197,94,0.2); }
.swing-setup.short .swing-setup-ticker { color: #ef4444; }
.swing-setup.short .swing-setup-type { color: #ef4444; background: rgba(239,68,68,0.08); border: 1px solid rgba(239,68,68,0.2); }
.swing-setup-score {
    font-family: 'Space Mono', monospace;
    font-size: 8px;
    letter-spacing: 1px;
    color: #f59e0b;
    margin-left: auto;
    background: rgba(245,158,11,0.06);
    border: 1px solid rgba(245,158,11,0.15);
    padding: 2px 6px;
    border-radius: 4px;
}
.swing-setup-meta {
    display: flex;
    gap: 14px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}
.swing-setup-meta span {
    font-size: 10px;
}
.swing-setup-meta .label {
    color: var(--text-dim);
    font-size: 9px;
    opacity: 0.6;
}
.swing-setup-meta .value {
    font-weight: 700;
}
.swing-setup-desc {
    font-size: 11px;
    color: var(--text-dim);
    line-height: 1.55;
}
/* Avoid cards */
.swing-avoid-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    margin-bottom: 24px;
}
.swing-avoid {
    background: rgba(239,68,68,0.03);
    border: 1px solid rgba(239,68,68,0.12);
    border-radius: 10px;
    padding: 12px 14px;
}
.swing-avoid-ticker {
    font-family: 'Orbitron', monospace;
    font-size: 12px;
    font-weight: 900;
    color: #ef4444;
    margin-bottom: 6px;
}
.swing-avoid-desc {
    font-size: 10px;
    color: var(--text-dim);
    line-height: 1.55;
}
/* Risk section */
.swing-risk-wrap {
    background: rgba(239,68,68,0.02);
    border: 1px solid rgba(239,68,68,0.1);
    border-radius: 10px;
    padding: 14px;
}
.swing-risk-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
}
.swing-risk-label {
    font-family: 'Space Mono', monospace;
    font-size: 7px;
    letter-spacing: 2px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.swing-risk-text {
    font-size: 11px;
    color: #c8c8e0;
    line-height: 1.55;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .swing-scenario-grid,
    .swing-avoid-grid,
    .swing-risk-grid { grid-template-columns: 1fr !important; }
    .swing-structure-grid,
    .swing-setup-grid { grid-template-columns: 1fr !important; }
    .swing-scenario-pct { font-size: 22px; }
    .swing-body { padding: 12px; }
}

        /* ── Mobile / Tablet Responsive ─────────────────────────────── */
        @media (max-width: 768px) {
            /* FIXED header on mobile — full width, no sidebar offset */
            #stickyHeader {
                position: fixed !important; top: 0 !important; left: 0 !important;
                right: 0 !important; width: 100% !important; z-index: 999 !important;
                background: linear-gradient(90deg, #0e1230 0%, #141035 50%, #0e1230 100%) !important;
                -webkit-transform: translateZ(0); transform: translateZ(0); /* Force GPU layer for iOS Safari */
                -webkit-backface-visibility: hidden; backface-visibility: hidden;
            }
            /* Push page content below the fixed header + chyron. Chyron now
               anchors at 108px with 56px height = bottom at 164px, plus a
               small buffer. Also removes the visible gap between header and
               chyron when scrolling. */
            .bluf-page-wrap { padding-top: 168px !important; }
            /* Header: wrap to multi-row */
            .header-inner {
                flex-wrap: wrap !important;
                padding: 8px 12px !important;
                gap: 8px !important;
            }
            /* Top row: logo + crypto + export + attribution fill the line */
            .header-logo { flex-shrink: 0; }
            .header-crypto {
                flex-shrink: 1;
                margin-left: 0 !important;
                gap: 6px !important;
            }
            /* Search form: full width on its own row, larger touch targets */
            .header-search {
                order: 10 !important;
                flex: 1 1 100% !important;
                max-width: 100% !important;
            }
            .header-search input {
                font-size: 16px !important;
                padding: 12px 14px !important;
                min-height: 44px !important;
            }
            .header-search button {
                padding: 12px 18px !important;
                font-size: 11px !important;
                min-height: 44px !important;
            }
            /* Export button */
            .header-export { flex-shrink: 0; min-width: 44px; min-height: 44px;
                             display: flex; align-items: center; justify-content: center; }
            /* Right panel: hide attribution on small screens, keep ticker/price */
            .header-right {
                border-left: none !important;
                padding-left: 0 !important;
                margin-left: 0 !important;
            }
            .header-right .header-attribution { display: none; }
            /* Level cards: stack 2-wide */
            .level-card { min-width: 80px !important; }
            /* Scenario cards + grids: single column on mobile */
            .scenario-row, .structure-grid, .setup-grid { grid-template-columns: 1fr !important; }
            /* Main content padding */
            .max-w-4xl { padding-left: 12px !important; padding-right: 12px !important; }
            /* Hub grid: single column on mobile for larger tap areas */
            .hub-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
            .hub-card-body { padding: 14px 16px 16px !important; }
            .hub-card-preview { height: 48px !important; }
            .hub-card-title { font-size: 10px !important; }
            .hub-card-sub { font-size: 12px !important; line-height: 1.5 !important; }
            .hub-card { min-height: 44px; }
            /* Shorts overlay: full-width native feel on mobile */
            .shorts-card {
                width: 100% !important;
                max-width: 100vw !important;
                min-height: auto !important;
                border-radius: 0 !important;
                border-left: none !important;
                border-right: none !important;
                margin-bottom: 0 !important;
                overflow: visible !important;
                animation: none !important;
            }
            .shorts-sticky-bar {
                position: -webkit-sticky !important;
                position: sticky !important;
                top: 0 !important;
                z-index: 50 !important;
            }
            .shorts-back-mobile {
                display: inline-flex !important;
            }
            #shortsCardOverlay {
                padding: 0 !important;
                overflow-y: auto !important;
                overscroll-behavior: contain !important;
            }
            #shortsCardOverlay > div {
                width: 100%;
                overflow: visible;
                position: static !important;
            }
            #shortsTickerBadge {
                right: 10px !important;
                top: 12px !important;
            }
            .shorts-section { padding: 20px 16px !important; }
            .shorts-script-box {
                width: 100% !important;
                max-width: 100vw !important;
                border-radius: 12px !important;
                margin: 10px !important;
            }
            /* Gamma banner: scale text for mobile */
            #gammaTopBanner { padding: 10px 14px !important; }
            #gammaTopBanner .banner-strike { font-size: 20px !important; }
            #gammaTopBanner .banner-type { font-size: 9px !important; letter-spacing: 2px !important; }
            #gammaTopBanner .banner-detail { font-size: 10px !important; }
            #gammaTopBanner .banner-close { top: 4px !important; right: 4px !important; }
            /* Chart containers: proper mobile heights */
            .section-panel canvas { max-width: 100%; }
            /* Heatmap: horizontal scroll */
            #interactiveHeatmap { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
            /* Back button: bigger touch target */
            .back-btn { padding: 10px 12px !important; min-height: 44px !important;
                        font-size: 10px !important; }
            /* Ticker-printing banner: lift OUT of header flex so it can't
               add a new row when loading starts (root cause of the "bounce"
               when searching on phone). Park it fixed just under the header. */
            #blufPrintingBanner {
                position: fixed !important;
                top: 104px !important;
                right: 8px !important;
                margin-left: 0 !important;
                padding: 3px 9px !important;
                border-radius: 6px !important;
                background: linear-gradient(135deg, rgba(14,18,48,0.95), rgba(20,16,53,0.95)) !important;
                border: 1px solid rgba(78,205,196,0.35) !important;
                box-shadow: 0 2px 10px rgba(0,0,0,0.35) !important;
                z-index: 1000 !important;
                -webkit-backdrop-filter: blur(8px);
                backdrop-filter: blur(8px);
            }
            #blufPrintingBanner #printingBannerText {
                font-size: 9px !important;
                letter-spacing: 2px !important;
            }
        }

        @media (max-width: 480px) {
            /* Extra small: further simplify */
            .header-crypto .crypto-pill {
                padding: 4px 8px !important;
                min-height: 28px;
            }
            .header-crypto .crypto-pill .crypto-label {
                display: inline; font-size: 8px !important;
            }
            .header-right { display: none !important; }
            .header-export span { display: none; }
            .level-card { min-width: 70px !important; }
            .level-value { font-size: 17px !important; }
            /* Gamma panel: tighten padding */
            .gamma-panel-inner { padding: 14px 12px 12px !important; }
            /* Charts: reduce container height for phone screens */
            #sec-gamma .section-panel > div:last-child > div { height: 300px !important; }
            #sec-force .section-panel > div:nth-child(2) > div[style*="height:400px"] { height: 260px !important; }
            /* TradingView: scale down on phone */
            #tv-outer { height: 500px !important; }
            /* Heatmap: reduce max-height, enable horizontal scroll */
            #interactiveHeatmap { max-height: 400px !important; -webkit-overflow-scrolling: touch;
                                  overflow-x: auto !important; }
            #interactiveHeatmap table { font-size: 10px !important; min-width: 500px; }
            #interactiveHeatmap th, #interactiveHeatmap td { padding: 4px 6px !important; }
            /* Chart view nav: slightly tighter on small screens */
            .chart-view-nav { padding: 0 2px; }
            .chart-view-btn { padding: 8px 10px !important; font-size: 8px !important; letter-spacing: 1px !important; }
            /* Section panel padding tighter on mobile */
            .section-panel > div[style*="padding:20px"] { padding: 10px !important; }
            .section-panel > div[style*="padding:16px 20px"] { padding: 10px 8px !important; }
            /* Gamma banner: even smaller on SE-size screens */
            #gammaTopBanner .banner-strike { font-size: 18px !important; }
            #gammaTopBanner .banner-detail { font-size: 10px !important; }
            /* Shorts: tighter padding on small phones */
            .shorts-section { padding: 16px 12px !important; }
            .shorts-level-val { font-size: 18px !important; }
        }

/* ── Egg pulse animation (from inline) ── */
@keyframes eggPulse { 0%,100%{opacity:1} 50%{opacity:0.7} }

/* ── Data Freshness Badge ─────────────────────────────── */
        .freshness-badge {
            font-family: 'Space Mono', monospace;
            font-size: 8px;
            letter-spacing: 1px;
            font-weight: 700;
            padding: 2px 8px;
            border-radius: 2px;
            background: rgba(0,0,0,0.3);
            white-space: nowrap;
            margin-left: 8px;
            flex-shrink: 0;
        }

/* ── Scan History Timeline Popup ───────────────────────── */
.scan-timeline-overlay {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.85); z-index: 9999;
    display: flex; align-items: center; justify-content: center;
    animation: stlFadeIn 0.15s ease-out;
}
@keyframes stlFadeIn { from { opacity: 0; } to { opacity: 1; } }

.scan-timeline-content {
    background: var(--surface); border: 1px solid var(--border2);
    max-width: 960px; width: 96%; max-height: 96vh; overflow-y: auto;
    padding: 10px 24px 8px; border-radius: 4px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.6);
}

.stl-header {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 4px; padding-bottom: 4px; border-bottom: 1px solid var(--border);
}
.stl-ticker {
    font-family: 'Orbitron', monospace; font-size: 22px; font-weight: 900;
    color: var(--cyan); letter-spacing: 2px;
}
.stl-meta {
    font-family: 'Space Mono', monospace; font-size: 11px;
    color: var(--text-dim); letter-spacing: 1px;
}
.stl-close {
    background: none; border: 1px solid var(--border); color: var(--muted);
    font-size: 16px; cursor: pointer; padding: 4px 10px; border-radius: 2px;
    transition: all 0.15s;
}
.stl-close:hover { color: var(--text); border-color: var(--border2); }

/* Sparkline grid */
.stl-sparkrow {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
    margin-bottom: 16px;
}
.stl-spark {
    background: rgba(255,255,255,0.015); border: 1px solid var(--border);
    padding: 10px 8px 6px; text-align: center; border-radius: 2px;
}
.stl-spark-label {
    font-family: 'Space Mono', monospace; font-size: 7px;
    letter-spacing: 2px; color: var(--muted); margin-bottom: 6px;
    text-transform: uppercase;
}
.stl-spark-value {
    font-family: 'Orbitron', monospace; font-size: 14px; font-weight: 700;
    margin-top: 4px;
}
.stl-spark-delta {
    font-family: 'Space Mono', monospace; font-size: 9px; margin-top: 2px;
}

/* Regime timeline bar */
.stl-regime-bar {
    display: flex; height: 8px; border-radius: 4px; overflow: hidden;
    margin-bottom: 16px; background: var(--surface3);
}
.stl-regime-seg {
    transition: width 0.3s;
}
.stl-regime-legend {
    display: flex; gap: 12px; justify-content: center; margin-bottom: 16px;
    font-family: 'Space Mono', monospace; font-size: 9px; color: var(--muted);
}
.stl-regime-dot {
    display: inline-block; width: 8px; height: 8px; border-radius: 50%;
    margin-right: 4px; vertical-align: middle;
}

/* History table */
.stl-table {
    width: 100%; border-collapse: collapse; font-family: 'Space Mono', monospace;
}
.stl-table th {
    font-size: 8px; letter-spacing: 1.5px; color: var(--muted);
    text-transform: uppercase; padding: 6px 8px; text-align: left;
    border-bottom: 1px solid var(--border);
}
.stl-table td {
    font-size: 11px; padding: 8px 8px; border-bottom: 1px solid rgba(30,32,69,0.5);
    color: var(--text-dim);
}
.stl-table tr:hover td { background: rgba(0,212,255,0.03); }
.stl-regime-badge {
    font-size: 8px; font-weight: 700; letter-spacing: 1px; padding: 2px 6px;
    border-radius: 2px; display: inline-block;
}
.stl-regime-badge.pos { background: rgba(34,197,94,0.15); color: #4ade80; }
.stl-regime-badge.neg { background: rgba(239,68,68,0.15); color: #f87171; }
.stl-regime-badge.unk { background: rgba(245,158,11,0.15); color: #fbbf24; }
.stl-regime-change {
    font-size: 8px; color: var(--amber); font-weight: 700;
    margin-left: 4px;
}
.stl-empty {
    text-align: center; padding: 40px; font-family: 'Space Mono', monospace;
    font-size: 10px; letter-spacing: 2px; color: var(--muted);
}

/* KPI row */
.stl-kpi-row {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
    margin-bottom: 16px;
}
.stl-kpi {
    background: rgba(255,255,255,0.015); border: 1px solid var(--border);
    padding: 10px 8px 8px; text-align: center; border-radius: 2px;
}
.stl-kpi-label {
    font-family: 'Space Mono', monospace; font-size: 9px;
    letter-spacing: 2px; color: var(--text-dim); margin-bottom: 4px;
    text-transform: uppercase;
}
.stl-kpi-value {
    font-family: 'Orbitron', monospace; font-size: 16px; font-weight: 700;
}
.stl-kpi-delta {
    margin-top: 3px; min-height: 14px;
}

/* Tab bar */
.stl-tab-bar {
    display: flex; align-items: center; gap: 2px; flex-wrap: wrap;
    border-bottom: 1px solid var(--border); margin-bottom: 0;
    padding-bottom: 0;
}
.stl-tab {
    font-family: 'Space Mono', monospace; font-size: 11px; letter-spacing: 2px;
    color: var(--text-dim); background: none; border: none; cursor: pointer;
    padding: 6px 12px; border-bottom: 2px solid transparent;
    transition: all 0.15s; text-transform: uppercase;
}
.stl-tab:hover { color: var(--text); }
.stl-tab.active { color: var(--cyan); border-bottom-color: var(--cyan); }

/* Chart mode pills */
.stl-chart-modes {
    display: flex; gap: 4px; margin-left: auto; padding: 4px 0; flex-wrap: wrap;
}
.stl-mode-pill {
    font-family: 'Space Mono', monospace; font-size: 10px; letter-spacing: 1px;
    color: var(--text-dim); background: rgba(255,255,255,0.04); border: 1px solid var(--border);
    padding: 4px 10px; border-radius: 2px; cursor: pointer;
    transition: all 0.15s; text-transform: uppercase;
}
.stl-mode-pill:hover { color: var(--text); border-color: var(--border2); }
.stl-mode-pill.active { color: var(--cyan); border-color: var(--cyan); background: rgba(0,212,255,0.06); }
.stl-sim-pill { font-weight: 700; }
.stl-sim-pill.active { animation: stlSimPulse 2s ease-in-out infinite; }
@keyframes stlSimPulse { 0%,100%{box-shadow:0 0 4px rgba(0,212,255,0.2);} 50%{box-shadow:0 0 12px rgba(0,212,255,0.4);} }

/* Chart panel */
.stl-panel { margin-top: 0; }
.stl-chart-wrap {
    height: 300px; position: relative; padding: 2px 0;
}

/* Mobile responsive */
@media (max-width: 600px) {
    .scan-timeline-content { padding: 8px 8px 6px; width: 98%; max-width: 100%; max-height: 98vh; overscroll-behavior: contain; }
    .stl-header { flex-wrap: wrap; gap: 6px; padding: 6px 0; margin-bottom: 4px; }
    .stl-kpi-row { grid-template-columns: repeat(2, 1fr); gap: 6px; }
    .stl-ticker { font-size: 18px; }
    .stl-kpi-value { font-size: 13px; }
    .stl-chart-wrap { height: 240px; }
    .stl-tab { padding: 6px 8px; font-size: 10px; letter-spacing: 1px; }
    .stl-mode-pill { padding: 3px 8px; font-size: 9px; }
    .stl-chart-modes { gap: 3px; }
    .stl-table td { font-size: 10px; padding: 6px 4px; }
    .stl-table th { font-size: 7px; padding: 4px; }
    #stlInfoBox { height: 280px !important; min-height: unset !important; overflow: hidden !important; }
    #stlInfoMeaning, #stlInfoMeaning + div { height: 110px !important; overflow: hidden !important; }
}

/* ═══ OVERLAY CHART GALLERY ═══ */
@media (max-width: 600px) {
    .overlay-thumb { aspect-ratio: 1/1 !important; }
    #overlayLightbox img { max-width: 98vw !important; max-height: 70vh !important; }
}

/* ═══ ONBOARDING: pulse arrow animation ═══ */
@keyframes pulse { 0%,100%{opacity:1;transform:translateY(0)} 50%{opacity:0.5;transform:translateY(-3px)} }

/* ═══ ONBOARDING: nav hint glow ═══ */
@keyframes navHintGlow {
    0%,100% { box-shadow: none; }
    50% { box-shadow: 0 0 12px rgba(0,212,255,0.5), inset 0 0 8px rgba(0,212,255,0.1); }
}
.nav-hint-glow {
    animation: navHintGlow 1.8s ease-in-out 3;
    position: relative;
}
.nav-hint-glow::after {
    content: 'Explore interactive charts \2192';
    position: absolute;
    left: 110%;
    top: 50%;
    transform: translateY(-50%);
    white-space: nowrap;
    font-family: 'Space Mono', monospace;
    font-size: 8px;
    letter-spacing: 1px;
    color: #00d4ff;
    opacity: 0;
    animation: navHintFadeIn 0.4s 0.5s forwards;
    pointer-events: none;
}
@keyframes navHintFadeIn { to { opacity: 1; } }

/* Mobile: tooltip goes below instead of right */
@media (max-width: 768px) {
    .nav-hint-glow::after {
        left: 50%;
        top: auto;
        bottom: -18px;
        transform: translateX(-50%);
        font-size: 7px;
    }
}

/* ═══ ONBOARDING: empty state card descriptions ═══ */
.sidebar-tab .tab-empty-hint {
    display: none;
    font-family: 'Inter', sans-serif;
    font-size: 8px;
    color: #5050a0;
    line-height: 1.3;
    margin-top: 1px;
    max-width: 120px;
}
.sidebar-tab.is-empty .tab-empty-hint { display: block; }
.sidebar-tab.is-empty .tab-badge.badge-none { display: none; }

/* ═══ ONBOARDING: Section empty state screens ═══ */
.section-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 24px;
    text-align: center;
    min-height: 300px;
}
.section-empty-icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    border: 2px solid;
    opacity: 0.7;
}
.section-empty-title {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    letter-spacing: 3px;
    color: var(--text-dim);
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 10px;
}
.section-empty-desc {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    color: #6060a0;
    line-height: 1.6;
    max-width: 320px;
}
.section-empty-hint {
    margin-top: 16px;
    font-family: 'Space Mono', monospace;
    font-size: 8px;
    letter-spacing: 2px;
    color: #3a3a6a;
    text-transform: uppercase;
}
.section-empty-spectrum {
    width: 100%;
    max-width: 200px;
    height: 3px;
    border-radius: 2px;
    margin-top: 20px;
    background: linear-gradient(90deg, #a855f7, #ef4444, #f59e0b, #22c55e, #3b82f6, #00d4ff);
    opacity: 0.4;
}

/* ═══════════════════════════════════════════════════════════════════
   COMMAND CENTER — Shared between BLUF Terminal Trade Ideas tab
   ═══════════════════════════════════════════════════════════════════ */

/* ── Command Center Button Grid ── */
.cmd-btn-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 10px;
}
.cmd-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 16px 12px;
    border-radius: 10px;
    border: 1px solid;
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.25s ease;
    background: transparent;
    color: #fff;
}
.cmd-btn:hover { transform: translateY(-2px); }
.cmd-btn .cmd-btn-icon { font-size: 24px; line-height: 1; }

.cmd-btn-populate {
    border-color: rgba(0,212,255,0.3);
    background: linear-gradient(135deg, rgba(0,212,255,0.08), rgba(59,130,246,0.08));
    color: #00d4ff;
}
.cmd-btn-populate:hover { border-color: #00d4ff; box-shadow: 0 4px 24px rgba(0,212,255,0.3); }

.cmd-btn-scan {
    border-color: rgba(34,197,94,0.3);
    background: linear-gradient(135deg, rgba(34,197,94,0.08), rgba(22,163,74,0.08));
    color: #22c55e;
}
.cmd-btn-scan:hover { border-color: #22c55e; box-shadow: 0 4px 24px rgba(34,197,94,0.3); }

.cmd-btn-opportunity {
    border-color: rgba(234,179,8,0.3);
    background: linear-gradient(135deg, rgba(234,179,8,0.1), rgba(245,158,11,0.08));
    color: #eab308;
}
.cmd-btn-opportunity:hover { border-color: #eab308; box-shadow: 0 4px 24px rgba(234,179,8,0.4); }

.cmd-btn-regime {
    border-color: rgba(236,72,153,0.3);
    background: linear-gradient(135deg, rgba(236,72,153,0.08), rgba(219,39,119,0.08));
    color: #ec4899;
}
.cmd-btn-regime:hover { border-color: #ec4899; box-shadow: 0 4px 24px rgba(236,72,153,0.3); }

.cmd-btn-pulse {
    border-color: rgba(20,184,166,0.3);
    background: linear-gradient(135deg, rgba(20,184,166,0.08), rgba(13,148,136,0.08));
    color: #14b8a6;
}
.cmd-btn-pulse:hover { border-color: #14b8a6; box-shadow: 0 4px 24px rgba(20,184,166,0.3); }

.cmd-btn-flyer {
    border-color: rgba(251,146,60,0.4);
    background: linear-gradient(135deg, rgba(251,146,60,0.12), rgba(249,115,22,0.08));
    color: #fb923c;
    position: relative;
    overflow: hidden;
}
.cmd-btn-flyer::after {
    content: '';
    position: absolute;
    top: -50%; left: -50%;
    width: 200%; height: 200%;
    background: conic-gradient(from 0deg, transparent, rgba(251,146,60,0.06), transparent, rgba(249,115,22,0.04), transparent);
    animation: flyerSpin 6s linear infinite;
}
@keyframes flyerSpin { to { transform: rotate(360deg); } }
.cmd-btn-flyer:hover { border-color: #fb923c; box-shadow: 0 4px 28px rgba(251,146,60,0.4), 0 0 12px rgba(251,146,60,0.15); }

/* ── Intel Results Card (output panel for command buttons) ── */
.cc-intel-card {
    background: linear-gradient(135deg, var(--surface) 0%, #0c0e24 100%);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    margin-top: 12px;
}
.cc-intel-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--border);
}
.cc-intel-pulse {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--cyan);
    box-shadow: 0 0 8px var(--cyan);
    animation: scanPulse 1.5s ease-in-out infinite;
}
.cc-intel-title {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    letter-spacing: 2px;
    color: var(--cyan);
    font-weight: 700;
    text-transform: uppercase;
}
.cc-intel-body {
    padding: 12px 14px;
    max-height: 480px;
    overflow-y: auto;
}

/* ── Populate Panel ── */
.cc-populate-panel {
    background: linear-gradient(135deg, rgba(0,212,255,0.03), rgba(59,130,246,0.03));
    border: 1px solid rgba(0,212,255,0.15);
    border-radius: 10px;
    padding: 14px;
    margin-top: 12px;
    display: none;
}
.cc-populate-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
    gap: 6px;
    margin-top: 10px;
}
.cc-populate-tile {
    text-align: center;
    padding: 8px 6px;
    border-radius: 6px;
    background: rgba(255,255,255,0.03);
    border: 1px solid var(--border);
    font-family: 'Space Mono', monospace;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 2px;
    color: var(--text-dim);
    transition: all 0.3s;
}

/* ── Top Tickers Bar Chart ── */
.cc-top-tickers {
    margin-top: 8px;
    font-family: 'Space Mono', monospace;
    font-size: 12px;
}
.cc-top-bar-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}
.cc-top-bar-ticker {
    width: 50px;
    font-weight: 700;
    letter-spacing: 1px;
}
.cc-top-bar-track {
    flex: 1;
    background: rgba(255,255,255,0.04);
    border-radius: 3px;
    height: 16px;
    overflow: hidden;
}
.cc-top-bar-fill {
    height: 100%;
    border-radius: 3px;
    opacity: 0.6;
    transition: width 0.5s ease;
}
.cc-top-bar-count {
    width: 30px;
    text-align: right;
    color: var(--text-dim);
    font-size: 10px;
}

/* ── Last 25 Ticker Grid (shared between home + trade ideas) ── */
/* ── L25 Search/Filter ── */
.l25-search-wrap {
    display: flex;
    align-items: center;
    gap: 4px;
    background: rgba(15,15,35,0.7);
    border: 1px solid var(--border2, rgba(255,255,255,0.08));
    border-radius: 4px;
    padding: 0 8px;
    height: 28px;
    transition: border-color 0.15s;
}
.l25-search-wrap:focus-within {
    border-color: var(--accent, #00d4ff);
    box-shadow: 0 0 6px rgba(0,212,255,0.15);
}
.l25-search-icon {
    font-size: 11px;
    opacity: 0.4;
}
.l25-search-input {
    background: transparent;
    border: none;
    outline: none;
    color: var(--accent, #00d4ff);
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.5px;
    width: 110px;
    padding: 0;
}
.l25-search-input::placeholder {
    color: rgba(96,96,160,0.6);
}
/* Prevent iOS Safari auto-zoom on focus — needs ≥16px font-size */
@media (max-width: 700px) {
    .l25-search-input { font-size: 16px; }
}
.l25-search-count {
    font-family: 'Space Mono', monospace;
    font-size: 9px;
    color: #5068a0;
    white-space: nowrap;
}

.l25-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 10px;
    padding-top: 12px;
}
/* Filtered-out tiles collapse */
.l25-tile.l25-filtered-out {
    display: none !important;
}
.l25-tile {
    position: relative;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 8px;
    padding: 14px 12px 12px;
    font-family: 'Space Mono', monospace;
    overflow: hidden;
    transition: border-color 0.3s, box-shadow 0.3s;
    min-height: 96px;
    cursor: pointer;
}
.l25-tile:hover {
    border-color: rgba(0,212,255,0.4);
    background: rgba(255,255,255,0.05);
}
.l25-tile.l25-active {
    border-color: rgba(0,212,255,0.5);
    animation: l25Glow 1.5s ease-in-out infinite;
}
@keyframes l25Glow {
    0%, 100% { box-shadow: 0 0 10px rgba(0,212,255,0.2); }
    50% { box-shadow: 0 0 24px rgba(0,212,255,0.5), 0 0 48px rgba(0,212,255,0.15); }
}
.l25-tile.l25-done { border-color: rgba(255,255,255,0.1); }

.l25-tile .l25-ticker {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #e2e8f0;
    margin-bottom: 5px;
}
.l25-regime-dot {
    display: inline-block;
    width: 7px; height: 7px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
}
.l25-tile .l25-price-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    font-size: 15px;
    margin-bottom: 3px;
}
.l25-tile .l25-levels {
    display: flex;
    gap: 6px;
    font-size: 10px;
    color: #6070a0;
    line-height: 1.5;
}
.l25-tile .l25-levels span { white-space: nowrap; }
.l25-tile .l25-time {
    font-size: 10px;
    color: #505070;
    margin-top: 3px;
}

/* Bottom loading bar */
.l25-bar {
    position: absolute;
    bottom: 0; left: 0;
    height: 3px;
    background: linear-gradient(90deg, #00d4ff, #a855f7);
    border-radius: 0 0 8px 8px;
    transition: width 0.4s ease;
    width: 0%;
}
.l25-bar.l25-bar-loading {
    animation: l25BarPulse 1.8s ease-in-out infinite;
}
@keyframes l25BarPulse {
    0% { width: 15%; opacity: 0.6; }
    50% { width: 75%; opacity: 1; }
    100% { width: 15%; opacity: 0.6; }
}
.l25-bar.l25-bar-done {
    width: 100%;
    background: linear-gradient(90deg, #22c55e, #4ade80);
    opacity: 0.5;
}
.l25-bar.l25-bar-stock {
    width: 100%;
    background: linear-gradient(90deg, #f59e0b, #fbbf24);
    opacity: 0.4;
}

/* ── Last 25 Section Header ── */
.l25-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
}
.l25-header-label {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    letter-spacing: 2px;
    color: var(--cyan);
    font-weight: 700;
    text-transform: uppercase;
}
.l25-header-time {
    font-family: 'Space Mono', monospace;
    font-size: 9px;
    color: var(--text-dim);
}

/* ── Scan Ticker Input (in Command Center) ── */
.cc-scan-input-wrap {
    display: none;
    margin-top: 12px;
    gap: 8px;
    align-items: center;
}
.cc-scan-input-wrap.active { display: flex; }
.cc-scan-input {
    flex: 1;
    background: var(--surface);
    border: 1px solid var(--border2);
    color: var(--text);
    font-family: 'Space Mono', monospace;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 10px 14px;
    border-radius: 8px;
    outline: none;
}
.cc-scan-input:focus { border-color: var(--cyan); box-shadow: 0 0 8px rgba(0,212,255,0.15); }
.cc-scan-go-btn {
    padding: 10px 18px;
    border-radius: 8px;
    border: 1px solid rgba(34,197,94,0.4);
    background: rgba(34,197,94,0.1);
    color: #22c55e;
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    cursor: pointer;
    transition: all 0.2s;
}
.cc-scan-go-btn:hover { border-color: #22c55e; box-shadow: 0 0 12px rgba(34,197,94,0.3); }

/* ═══════════════════════════════════════════════════════════════
   SUPERGLOW MODE
   ═══════════════════════════════════════════════════════════════ */
/* NOTE: filter on body breaks position:fixed on mobile (creates new containing block).
   Apply filter to .bluf-page-wrap (content only) and style fixed elements separately. */
body.superglow-mode .bluf-page-wrap {
    filter: saturate(1.8) brightness(1.05) contrast(1.05);
}
body.superglow-mode #stickyHeader,
body.superglow-mode .nav-mobile-bottom,
body.superglow-mode .scan-chyron {
    filter: saturate(1.8) brightness(1.05) contrast(1.05);
}
body.superglow-mode .bluf-page-wrap *,
body.superglow-mode #stickyHeader *,
body.superglow-mode .nav-mobile-bottom * {
    transition: text-shadow 0.3s, box-shadow 0.3s;
}
/* Header / clock area */
body.superglow-mode .header-bar {
    box-shadow: 0 0 40px rgba(168,85,247,0.2), 0 0 80px rgba(34,211,238,0.1);
}
/* Section cards */
body.superglow-mode .section-card,
body.superglow-mode .l25-tile {
    box-shadow: 0 0 14px rgba(168,85,247,0.12), 0 0 28px rgba(34,211,238,0.06);
    border-color: rgba(34,211,238,0.2);
}
/* L25 ticker names glow */
body.superglow-mode .l25-ticker {
    text-shadow: 0 0 10px currentColor;
}
/* Chyron glow */
body.superglow-mode .scan-chyron {
    box-shadow: 0 0 20px rgba(34,211,238,0.2), 0 0 40px rgba(168,85,247,0.1);
}
body.superglow-mode .chyron-item .chy-ticker {
    text-shadow: 0 0 10px rgba(0,212,255,0.7);
}
/* Nav tabs */
body.superglow-mode .nav-item.active {
    box-shadow: 0 0 16px rgba(0,212,255,0.25), 0 0 32px rgba(168,85,247,0.1);
}
/* Green / red glow */
body.superglow-mode .regime-bullish,
body.superglow-mode .l25-regime-bullish {
    text-shadow: 0 0 10px rgba(34,197,94,0.6);
}
body.superglow-mode .regime-bearish,
body.superglow-mode .l25-regime-bearish {
    text-shadow: 0 0 10px rgba(239,68,68,0.6);
}
/* Command buttons */
body.superglow-mode .cmd-btn {
    box-shadow: 0 0 16px rgba(59,130,246,0.2), 0 0 32px rgba(59,130,246,0.08);
}
/* Analyze button extra glow */
body.superglow-mode .analyze-btn {
    box-shadow: 0 0 24px rgba(168,85,247,0.4), 0 0 48px rgba(168,85,247,0.15), 0 0 80px rgba(34,211,238,0.08) !important;
}
/* Values & numbers */
body.superglow-mode .l25-spot,
body.superglow-mode .l25-anchor-val,
body.superglow-mode .l25-flip-val {
    text-shadow: 0 0 8px currentColor;
}
/* Swap trades table glow */
body.superglow-mode .swing-row {
    box-shadow: 0 0 8px rgba(168,85,247,0.08), 0 0 16px rgba(34,211,238,0.04);
}
/* Superglow button style in Command Center */
.cmd-btn-superglow {
    background: linear-gradient(135deg, rgba(168,85,247,0.15), rgba(34,211,238,0.1)) !important;
    border-color: rgba(168,85,247,0.3) !important;
    color: #c084fc !important;
}
.cmd-btn-superglow:hover {
    border-color: rgba(168,85,247,0.5) !important;
    box-shadow: 0 0 16px rgba(168,85,247,0.25) !important;
}
body.superglow-mode .cmd-btn-superglow {
    box-shadow: 0 0 20px rgba(168,85,247,0.4), 0 0 40px rgba(34,211,238,0.15) !important;
    border-color: rgba(168,85,247,0.6) !important;
    color: #e9d5ff !important;
    text-shadow: 0 0 10px rgba(168,85,247,0.8);
}
/* Easter egg in trades tab — subtle glow label */
.superglow-egg-btn {
    background: transparent;
    border: 1px solid transparent;
    color: var(--border);
    font-family: 'Space Mono', monospace;
    font-size: 7px;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 4px;
    cursor: default;
    transition: all 0.5s;
    opacity: 0.12;
}
.superglow-egg-btn:hover {
    opacity: 0.4;
    color: #c084fc;
    border-color: rgba(168,85,247,0.2);
    cursor: pointer;
}
body.superglow-mode .superglow-egg-btn {
    opacity: 1;
    color: #e9d5ff;
    border-color: rgba(168,85,247,0.5);
    text-shadow: 0 0 12px rgba(168,85,247,0.8);
    box-shadow: 0 0 12px rgba(168,85,247,0.2);
}

/* ═══════════════════════════════════════════════════════════════════
   MOMENTUM RADAR — Trades tab redesign (2026-05-17)
   Card-based layout for /api/scans/momentum-radar output. Driven by
   class names emitted from ccMomentumRadar() in static/js/bluf.js.
   Desktop ≥601px keeps the full multi-column header per card; mobile
   ≤600px re-stacks the header into rows, hides cards past rank-5
   behind an expand toggle, and trims signal chips to the top three
   so the Trades tab is scannable in one viewport. Schema-synced with
   MC algo-lab v2: surfaces confluence, regimeFlips (stability dots),
   acceleration (▲▲/▼), lastScan ("Xm ago"), and algoVersion stamp.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Section titles + flip-watch panel ─────────────────────────────── */
.radar-section-title {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: #06b6d4;
    letter-spacing: 3px;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 10px;
}
.radar-flipwatch {
    padding: 12px;
    margin-bottom: 12px;
    background: rgba(239,68,68,0.06);
    border: 1px solid rgba(239,68,68,0.25);
    border-radius: 10px;
}
.radar-flipwatch-title {
    font-family: 'Space Mono', monospace;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    color: #ef4444;
    margin-bottom: 8px;
    text-transform: uppercase;
}
.radar-flipwatch-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px solid rgba(255,255,255,0.03);
    flex-wrap: nowrap;
}
.radar-flipwatch-row:last-child { border-bottom: none; }
.radar-flipwatch-ticker {
    font-family: 'Space Mono', monospace;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #e2e8f0;
    flex-shrink: 0;
    white-space: nowrap;
    min-width: 60px;
}
.radar-flipwatch-regime {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    letter-spacing: 1.5px;
    flex-shrink: 0;
    min-width: 64px;
}
.radar-regime-pos { color: #22c55e; }
.radar-regime-neg { color: #ef4444; }
.radar-regime-neutral { color: #f59e0b; }
.radar-flipwatch-bar {
    flex: 1;
    background: rgba(255,255,255,0.04);
    border-radius: 3px;
    height: 6px;
    overflow: hidden;
    min-width: 40px;
}
.radar-flipwatch-bar-fill {
    height: 100%;
    border-radius: 3px;
    background: #eab308;
}
.radar-flipwatch-row[data-tier="med"] .radar-flipwatch-bar-fill { background: #f59e0b; }
.radar-flipwatch-row[data-tier="hi"]  .radar-flipwatch-bar-fill { background: #ef4444; }
.radar-flipwatch-pct {
    font-family: 'Space Mono', monospace;
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
    min-width: 42px;
    text-align: right;
    color: #eab308;
}
.radar-flipwatch-row[data-tier="med"] .radar-flipwatch-pct { color: #f59e0b; }
.radar-flipwatch-row[data-tier="hi"]  .radar-flipwatch-pct { color: #ef4444; }
.radar-flipwatch-chip {
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    letter-spacing: 1px;
    background: rgba(239,68,68,0.15);
    border: 1px solid rgba(239,68,68,0.3);
    border-radius: 4px;
    padding: 2px 6px;
    color: #ef4444;
    flex-shrink: 0;
}

/* ── Cards container ───────────────────────────────────────────────── */
.radar-cards { display: block; }

/* ── Single ticker card ────────────────────────────────────────────── */
.radar-card {
    padding: 14px;
    margin-bottom: 10px;
    background: rgba(6,182,212,0.02);
    border: 1px solid rgba(6,182,212,0.12);
    border-radius: 10px;
}
.radar-card-primary {
    background: rgba(6,182,212,0.04);
    border-color: rgba(6,182,212,0.3);
}

/* ── Card header row (ticker / regime dot / direction / score) ─────── */
.radar-card-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
    flex-wrap: nowrap;
    /* min-width:0 lets flex children shrink instead of forcing wrap */
    min-width: 0;
}
.radar-card-ticker {
    font-family: 'Space Mono', monospace;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 3px;
    color: #e2e8f0;
    /* CRITICAL: prevents "INTC" from breaking to "INT/C" under the
       3px letter-spacing + flex squeeze */
    white-space: nowrap;
    flex-shrink: 0;
}
.radar-card-regime-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}
.radar-card-regime-dot.radar-regime-pos { background: #22c55e; box-shadow: 0 0 6px rgba(34,197,94,0.5); }
.radar-card-regime-dot.radar-regime-neg { background: #ef4444; box-shadow: 0 0 6px rgba(239,68,68,0.5); }
.radar-card-regime-dot.radar-regime-neutral { background: #f59e0b; box-shadow: 0 0 6px rgba(245,158,11,0.5); }

.radar-card-dir {
    font-family: 'Space Mono', monospace;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1px;
    white-space: nowrap;
    flex-shrink: 0;
}
.radar-dir-bull { color: #22c55e; }
.radar-dir-bear { color: #ef4444; }
.radar-dir-neutral { color: #64748b; }

.radar-card-accel {
    font-size: 12px;
    color: #a855f7;
    letter-spacing: 1px;
    flex-shrink: 0;
    opacity: 0.85;
}
.radar-card-accel-tag {
    font-family: 'Space Mono', monospace;
    font-size: 9px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 3px;
    flex-shrink: 0;
    font-weight: 700;
}
.radar-accel-fast {
    color: #a855f7;
    background: rgba(168,85,247,0.10);
    border: 1px solid rgba(168,85,247,0.30);
}
.radar-accel-slow {
    color: #64748b;
    background: rgba(100,116,139,0.10);
    border: 1px solid rgba(100,116,139,0.25);
}

.radar-card-score-wrap {
    margin-left: auto;
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-shrink: 0;
    white-space: nowrap;
}
.radar-card-score-label {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: var(--text-dim);
    letter-spacing: 1px;
    text-transform: uppercase;
    /* nowrap fixes the "MOMENTUM" → "MOMEN / TUM" break under squeeze */
    white-space: nowrap;
}
.radar-card-score {
    font-family: 'Space Mono', monospace;
    font-size: 20px;
    font-weight: 700;
}
.radar-score-hi  { color: #06b6d4; }
.radar-score-med { color: #0891b2; }
.radar-score-lo  { color: #64748b; }

/* ── Card progress bar ─────────────────────────────────────────────── */
.radar-card-bar {
    background: rgba(255,255,255,0.04);
    border-radius: 4px;
    height: 6px;
    margin-bottom: 10px;
    overflow: hidden;
}
.radar-card-bar-fill {
    height: 100%;
    border-radius: 4px;
    background: linear-gradient(90deg, #64748b, #06b6d4);
}
.radar-bar-hi  { background: linear-gradient(90deg, #06b6d4, #22d3ee); }
.radar-bar-med { background: linear-gradient(90deg, #0891b2, #06b6d4); }
.radar-bar-lo  { background: linear-gradient(90deg, #475569, #64748b); }

/* ── Stats row ─────────────────────────────────────────────────────── */
.radar-card-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    font-family: 'Space Mono', monospace;
    font-size: 13px;
    color: #8888b0;
    margin-bottom: 8px;
}
.radar-stat-price { color: #e0e4f0; font-weight: 600; }
.radar-stat-slope { color: #a855f7; }
.radar-stat-flip { color: #64748b; }
.radar-stat-flip[data-hot="1"] { color: #ef4444; font-weight: 600; }
.radar-stat-iv { color: #94a3b8; }
.radar-stat-stability {
    color: var(--text-dim);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.radar-stability {
    letter-spacing: 1px;
    font-size: 10px;
}
.radar-stability-hi  { color: #22c55e; }   /* 0 flips — solid regime */
.radar-stability-med { color: #f59e0b; }   /* 1-2 flips — flickering */
.radar-stability-low { color: #ef4444; }   /* 3+ flips — volatile */

/* ── Signal chips ──────────────────────────────────────────────────── */
.radar-card-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.radar-chip {
    display: inline-block;
    border-radius: 5px;
    padding: 3px 10px;
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.5px;
    color: #94a3b8;
}
.radar-chip-heat-0 { background: rgba(100,116,139,0.15); border: 1px solid rgba(100,116,139,0.20); }
.radar-chip-heat-1 { background: rgba(6,182,212,0.10);   border: 1px solid rgba(6,182,212,0.20); }
.radar-chip-heat-2 { background: rgba(6,182,212,0.18);   border: 1px solid rgba(6,182,212,0.35); color: #06b6d4; }
.radar-chip-heat-3 { background: rgba(6,182,212,0.28);   border: 1px solid rgba(6,182,212,0.50); color: #06b6d4; font-weight: 600; }

/* ── Card footer (provenance: scans, confluence, age, algo version) ── */
.radar-card-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid rgba(255,255,255,0.04);
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    color: var(--text-dim);
    letter-spacing: 0.5px;
}
.radar-foot-sep { opacity: 0.35; }
.radar-foot-conf.radar-conf-bull  { color: #22c55e; }
.radar-foot-conf.radar-conf-bear  { color: #ef4444; }
.radar-foot-conf.radar-conf-mixed { color: #f59e0b; }
.radar-foot-ver {
    margin-left: auto;
    opacity: 0.45;
    font-size: 9px;
    letter-spacing: 1px;
}

/* ── Expand toggle (mobile-only; CSS hides on desktop) ─────────────── */
.radar-expand-btn {
    display: none;
    width: 100%;
    padding: 12px 14px;
    margin-top: 4px;
    background: rgba(6,182,212,0.06);
    border: 1px solid rgba(6,182,212,0.25);
    border-radius: 8px;
    color: #06b6d4;
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 700;
    cursor: pointer;
    min-height: 44px; /* tap target */
}
.radar-expand-btn:hover { background: rgba(6,182,212,0.12); }

/* ── Mobile re-layout (≤600px) ─────────────────────────────────────── */
@media (max-width: 600px) {
    /* Tighten the Command Center panel padding so cards have breathing room */
    #sec-ideas .section-panel > div[style*="padding:16px 20px"] { padding: 12px 10px !important; }
    .cc-intel-body { padding: 10px 10px; max-height: none; }

    /* Flip-watch row: wraps the bar + pct onto a second visual line.
       Ticker + regime stay on top; bar + pct + chip sit below. */
    .radar-flipwatch-row {
        flex-wrap: wrap;
        gap: 8px;
        padding: 8px 0;
    }
    .radar-flipwatch-ticker { font-size: 14px; min-width: 56px; }
    .radar-flipwatch-regime { font-size: 9px; min-width: 60px; letter-spacing: 1px; }
    .radar-flipwatch-bar { flex: 1 1 100%; order: 5; height: 5px; }
    .radar-flipwatch-pct { font-size: 13px; min-width: 38px; }
    .radar-flipwatch-chip { order: 6; font-size: 9px; padding: 2px 5px; }

    /* Card header: stack the score onto its own row so the
       ticker + direction never get crushed against MOMENTUM. */
    .radar-card { padding: 12px; margin-bottom: 8px; }
    .radar-card-head {
        flex-wrap: wrap;
        gap: 8px 10px;
        row-gap: 6px;
    }
    .radar-card-ticker { font-size: 19px; letter-spacing: 2.5px; }
    .radar-card-dir { font-size: 12px; }
    .radar-card-accel { font-size: 11px; }
    .radar-card-score-wrap {
        /* margin-left:auto already pushes it to the right edge of the first
           row; on the narrowest phones it wraps to a second row cleanly */
        flex-basis: auto;
    }
    .radar-card-score { font-size: 18px; }
    .radar-card-score-label { font-size: 9px; letter-spacing: 1.5px; }

    /* Stats row: 2-up grid so labels keep their values together */
    .radar-card-stats {
        gap: 4px 12px;
        font-size: 12px;
    }
    .radar-card-stats .radar-stat { white-space: nowrap; }

    /* Trim chip overflow: hide signals past the top-3 by default to keep
       cards scannable. Expand toggle below cards reveals everything. */
    .radar-card-chips { gap: 4px; }
    .radar-chip { font-size: 10px; padding: 2px 7px; }
    .radar-chip-extra { display: none; }
    .radar-cards-expanded .radar-chip-extra { display: inline-block; }

    /* Collapse rank-6+ cards by default; expand button toggles them */
    .radar-card-extra { display: none; }
    .radar-cards-expanded .radar-card-extra { display: block; }
    .radar-expand-btn { display: block; }

    /* Footer can wrap to two lines if needed */
    .radar-card-foot { font-size: 9px; gap: 4px; }
    .radar-foot-ver { font-size: 8px; }

    /* Chyron: give the close-X some breathing room so the last ticker
       no longer visually butts against it. Mobile-only. */
    .chyron-track-container {
        padding-right: 6px;
    }
    .chyron-toggle-btn {
        border-left: 1px solid rgba(255,255,255,0.12);
        background: rgba(10,14,34,1);
    }

    /* Command Center button grid: ensure 2-up on narrow phones with
       larger tap targets, fewer all-caps shouty buttons per row */
    .cmd-btn-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }
    .cmd-btn { padding: 14px 8px; font-size: 10px; letter-spacing: 1.5px; min-height: 64px; }
    .cmd-btn .cmd-btn-icon { font-size: 20px; }
}

/* ── Extra-small (≤390px iPhone) — one final squeeze pass ──────────── */
@media (max-width: 390px) {
    .radar-card-ticker { font-size: 17px; letter-spacing: 2px; }
    .radar-card-dir { font-size: 11px; }
    .radar-card-score { font-size: 16px; }
    .radar-card-stats { font-size: 11px; gap: 4px 10px; }
    .radar-flipwatch-ticker { font-size: 13px; }
}

/* ── Desktop affordance (≥601px) — keep the legacy single-row layout ─ */
@media (min-width: 601px) {
    .radar-card-extra { display: block; }
    .radar-chip-extra { display: inline-block; }
    .radar-expand-btn { display: none; }
}