:root {
            /* Semantic color system: 3 roles + 1 destructive */
            --accent: #a78bfa;           /* primary actions, branding */
            --accent-dim: rgba(167,139,250,0.15);
            --accent-glow: rgba(139,92,246,0.3);
            --reward: #22c55e;           /* earnings, rewards, success */
            --reward-dim: rgba(34,197,94,0.15);
            --muted-accent: rgba(255,255,255,0.5);
            --destructive: #ef4444;      /* exit, errors */
            --destructive-dim: rgba(239,68,68,0.12);
            --pending: #f59e0b;

            --bg: #0a0a0f;
            --bg-card: rgba(255,255,255,0.03);
            --bg-card-hover: rgba(255,255,255,0.06);
            --border: rgba(255,255,255,0.06);
            --border-hover: rgba(255,255,255,0.12);
            --text: #ffffff;
            --text-dim: rgba(255,255,255,0.7);
            --text-muted: rgba(255,255,255,0.55);
            --text-faint: rgba(255,255,255,0.35);
        }
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body {
            font-family: 'Inter', -apple-system, sans-serif;
            background: var(--bg); color: var(--text);
            min-height: 100vh; -webkit-font-smoothing: antialiased;
        }
        h1,h2,h3 { font-family: 'Plus Jakarta Sans', sans-serif; }
        .mono { font-family: 'JetBrains Mono', monospace; }

        .aurora {
            position: fixed; top: -100px; left: 50%; transform: translateX(-50%);
            width: 800px; height: 500px;
            background:
                radial-gradient(ellipse at 50% 50%, rgba(139,92,246,0.5) 0%, transparent 50%),
                radial-gradient(ellipse at 30% 30%, rgba(236,72,153,0.3) 0%, transparent 45%),
                radial-gradient(ellipse at 70% 40%, rgba(6,182,212,0.25) 0%, transparent 45%);
            filter: blur(60px); pointer-events: none; z-index: 0;
            animation: aurora 8s ease-in-out infinite alternate;
        }
        @keyframes aurora {
            0% { opacity: 0.7; transform: translateX(-50%) scale(1); }
            100% { opacity: 1; transform: translateX(-50%) scale(1.05); }
        }

        .container { max-width: 1280px; margin: 0 auto; padding: 20px 24px; position: relative; z-index: 1; }

        /* ===== DASHBOARD GRID ===== */
        .dashboard-grid {
            display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; align-items: stretch;
        }
        .grid-left { grid-column: 1; }
        .grid-right { grid-column: 2; }
        .grid-full { grid-column: 1 / -1; }
        #positionBar { grid-row: 1; }
        #stakeCard { display: flex; flex-direction: column; }
        #bettingCard { display: flex; flex-direction: column; }
        #resultsCard { grid-column: 1 / -1; }

        /* Stake card slot — unused */
        #stakeCardSlot { display: none; }
        .stake-compact-row { display: none; }

        /* Manage Stake button in position bar */
        .pos-manage-btn {
            padding: 6px 14px; border-radius: 6px; border: 1px solid var(--accent-dim);
            background: var(--accent-dim); color: var(--accent);
            font-family: 'Inter'; font-size: 11px; font-weight: 600;
            cursor: pointer; transition: all 0.2s; text-decoration: none;
        }
        .pos-manage-btn:hover { background: rgba(167,139,250,0.25); border-color: var(--accent); }

        /* ===== STAKE MODAL ===== */
        .stake-modal-overlay {
            display: none; position: fixed; inset: 0; z-index: 1000;
            background: rgba(0,0,0,0.7); backdrop-filter: blur(4px);
            align-items: center; justify-content: center;
        }
        .stake-modal-overlay.open { display: flex; }
        .stake-modal {
            background: #111118; border: 1px solid var(--border);
            border-radius: 16px; padding: 24px 28px; width: 100%; max-width: 480px;
            position: relative; box-shadow: 0 24px 80px rgba(0,0,0,0.5);
        }
        .stake-modal-close {
            position: absolute; top: 14px; right: 16px;
            background: none; border: none; color: var(--text-muted);
            font-size: 20px; cursor: pointer; padding: 4px 8px; line-height: 1;
        }
        .stake-modal-close:hover { color: var(--text); }
        .stake-modal .card-header { margin-bottom: 16px; }
        .stake-modal .stake-balances { margin-bottom: 16px; }
        .stake-modal .stake-info-rows { margin-bottom: 16px; }
        .stake-modal .stake-info-row { padding: 6px 0; }
        @media (max-width: 520px) {
            .stake-modal { margin: 16px; padding: 20px; }
        }

        /* ===== POSITION BAR ===== */
        .position-bar {
            display: none; grid-column: 1 / -1;
            padding: 12px 20px; border-radius: 12px;
            background: var(--bg-card); border: 1px solid var(--border);
        }
        .position-bar.visible { display: block; }
        .position-bar-inner {
            display: flex; align-items: center; justify-content: space-between; gap: 12px;
        }
        .position-bar-stats {
            display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
        }
        .pos-stat { display: flex; flex-direction: column; gap: 2px; }
        .pos-stat.removed, .pos-action-btn.removed { display: none !important; }
        /* Staking removed from /testnet — lives at /stake-test */
        .stake-modal-overlay, .pos-manage-btn, #stakeCardSlot { display: none !important; }
        .pos-stat-label { font-size: 10px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.5px; }
        .pos-stat-val { font-family: 'JetBrains Mono'; font-size: 14px; font-weight: 600; color: var(--text-dim); }
        .pos-stat-val.reward { color: var(--reward); }
        .pos-stat-val.accent { color: var(--accent); }
        .pos-apy-badge { font-size: 9px; color: var(--reward); font-weight: 600; letter-spacing: 0; text-transform: none; opacity: 0.85; }
        .position-bar-actions {
            display: flex; align-items: center; gap: 6px; flex-shrink: 0;
        }
        .pos-action-btn {
            padding: 5px 12px; border-radius: 6px; border: none;
            font-family: 'Inter'; font-size: 11px; font-weight: 600;
            cursor: pointer; transition: all 0.2s;
        }
        .pos-action-btn.claim {
            background: var(--reward-dim); color: var(--reward); border: 1px solid rgba(34,197,94,0.3);
        }
        .pos-action-btn.claim:hover { background: rgba(34,197,94,0.25); }
        .pos-action-btn.withdraw {
            background: transparent; color: var(--text-muted); border: 1px solid var(--border);
        }
        .pos-action-btn.withdraw:hover { background: var(--bg-card-hover); color: var(--text-dim); }
        .pos-action-btn.exit {
            background: transparent; color: var(--destructive); border: 1px solid rgba(239,68,68,0.2);
        }
        .pos-action-btn.exit:hover { background: var(--destructive-dim); }
        .pos-divider {
            width: 1px; height: 24px; background: var(--border); flex-shrink: 0;
        }
        .pos-claim-note {
            font-size: 10px; color: var(--text-faint); text-align: center; margin-top: 6px;
        }

        /* ===== NAV BAR ===== */
        .nav {
            position: sticky; top: 0; z-index: 100;
            background: rgba(10,10,15,0.85); backdrop-filter: blur(20px);
            border-bottom: 1px solid var(--border);
        }
        .nav-inner {
            max-width: 1200px; margin: 0 auto; padding: 0 24px;
            display: flex; align-items: center; justify-content: space-between; height: 56px;
        }
        .nav-left { display: flex; align-items: center; gap: 28px; }
        .nav-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--text); }
        .nav-logo { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; border: 1px solid var(--border); }
        .nav-name { font-family: 'Plus Jakarta Sans'; font-weight: 700; font-size: 16px; }
        .nav-badge {
            display: inline-block; padding: 3px 10px; border-radius: 20px;
            background: var(--accent-dim); color: var(--accent);
            font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;
        }
        .nav-links { display: flex; gap: 20px; }
        .nav-links a {
            font-size: 13px; color: var(--text-muted); text-decoration: none; font-weight: 500;
            transition: color 0.2s; padding: 4px 0;
        }
        .nav-links a:hover { color: var(--text-dim); }
        .nav-right { display: flex; align-items: center; gap: 12px; }
        .nav-cta {
            display: inline-flex; align-items: center; gap: 6px;
            padding: 7px 18px; border-radius: 99px;
            font-family: 'Inter'; font-size: 12px; font-weight: 600; text-decoration: none;
            cursor: pointer; transition: all 0.2s; border: none;
        }
        .nav-cta:hover { transform: translateY(-1px); }
        .nav-cta.stake-btn {
            background: transparent; border: 1px solid rgba(124,58,237,0.5); color: var(--accent);
        }
        .nav-cta.stake-btn:hover { box-shadow: 0 0 20px rgba(124,58,237,0.3); }
        .nav-cta.get-btn {
            background: linear-gradient(135deg, #7c3aed, #3b82f6); color: #fff;
        }
        .nav-cta.get-btn:hover { box-shadow: 0 0 20px rgba(124,58,237,0.4); }
        .connect-btn {
            padding: 5px 14px; border-radius: 99px;
            background: rgba(167,139,250,0.12); border: 1px solid rgba(167,139,250,0.3);
            color: #a78bfa; font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 600;
            cursor: pointer; transition: all 0.2s; white-space: nowrap;
        }
        .connect-btn:hover { background: rgba(167,139,250,0.2); border-color: rgba(167,139,250,0.5); }
        .connect-btn.connected {
            background: var(--bg-card); border: 1px solid var(--border);
            color: var(--text-dim); font-size: 12px; font-family: 'JetBrains Mono';
            cursor: pointer; border-radius: 99px;
        }
        .connect-btn.connected:hover { transform: none; box-shadow: none; border-color: var(--destructive); color: var(--destructive); }

        .faucet-link {
            color: var(--text-faint); font-size: 11px; cursor: pointer;
            text-decoration: underline; text-decoration-style: dashed;
            text-underline-offset: 3px; transition: color 0.2s; border: none; background: none;
        }
        .faucet-link:hover { color: var(--accent); }
        /* More dropdown */
        .nav-more { position: relative; }
        .nav-more > span { font-size: 13px; font-weight: 500; color: var(--text-muted); cursor: pointer; transition: color 0.2s; user-select: none; }
        .nav-more:hover > span { color: var(--text-dim); }
        .nav-more-dropdown { display: none; position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%); background: rgba(20,20,30,0.95); backdrop-filter: blur(16px); border: 1px solid var(--border); border-radius: 10px; padding: 6px 0; min-width: 160px; z-index: 120; box-shadow: 0 8px 32px rgba(0,0,0,0.4); }
        .nav-more:hover .nav-more-dropdown { display: block; }
        .nav-more-dropdown::before { content: ''; position: absolute; top: -12px; left: 0; right: 0; height: 12px; }
        .nav-more-dropdown a { display: block; padding: 8px 16px; font-size: 13px; font-weight: 500; color: var(--text-muted); text-decoration: none; transition: all 0.15s; }
        .nav-more-dropdown a:hover { color: var(--text); background: rgba(255,255,255,0.04); }
        /* Hamburger */
        .nav-hamburger { display: none; flex-direction: column; gap: 4px; cursor: pointer; padding: 6px; border: none; background: none; }
        .nav-hamburger span { width: 20px; height: 2px; background: var(--text-muted); border-radius: 2px; transition: all 0.3s; }
        .nav-hamburger:hover span { background: var(--text); }
        /* Mobile menu */
        .mobile-menu { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 200; background: rgba(10,10,15,0.97); backdrop-filter: blur(20px); flex-direction: column; align-items: center; justify-content: center; gap: 20px; }
        .mobile-menu.open { display: flex; }
        .mobile-menu a { font-size: 18px; font-weight: 600; color: var(--text-dim); text-decoration: none; padding: 10px 24px; transition: color 0.2s; }
        .mobile-menu a:hover { color: var(--accent); }
        .mobile-menu-close { position: absolute; top: 16px; right: 20px; font-size: 28px; color: var(--text-muted); background: none; border: none; cursor: pointer; padding: 4px; }
        .mobile-menu-close:hover { color: var(--text); }
        .mobile-menu-ctas { display: flex; flex-direction: column; gap: 12px; margin-top: 12px; align-items: center; }
        .mobile-menu .nav-badge { margin: 0; }

        #howItWorks { max-width: 520px; margin-left: auto; margin-right: auto; }

        @media (max-width: 768px) {
            .nav-links { display: none; }
            .nav-badge { display: none; }
            .nav-cta.get-btn { display: none; }
            .nav-hamburger { display: flex; }
            .nav-inner { padding: 0 12px; height: 48px; }
            .nav-left { gap: 10px; }
            .nav-name { font-size: 14px; }
            .nav-right { gap: 8px; }
            .nav-cta.stake-btn { padding: 5px 10px; font-size: 11px; }
            .connect-btn { padding: 5px 10px; font-size: 11px; }
            .connect-btn.connected { font-size: 11px; }
            .header-value-props { padding: 10px 14px; }
            .value-prop { font-size: 12px; }
        }
        @media (max-width: 480px) {
            .nav-name { font-size: 13px; }
            .nav-logo { width: 24px; height: 24px; }
        }

        /* ===== CARD ===== */
        .card {
            background: var(--bg-card); border: 1px solid var(--border); border-radius: 16px;
            padding: 20px; transition: opacity 0.3s;
        }
        .card.dimmed { opacity: 0.4; pointer-events: none; }
        .card-header {
            display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px;
        }
        .card-title {
            font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;
            color: var(--text-muted); margin: 0;
        }
        .card-badge {
            font-family: 'JetBrains Mono'; font-size: 10px; padding: 2px 8px;
            border-radius: 6px; font-weight: 600;
        }

        /* ===== HERO BALANCES ===== */
        .hero-balance { text-align: center; margin-bottom: 12px; }
        .hero-balance .label { font-size: 11px; color: var(--text-muted); margin-bottom: 2px; }
        .hero-balance .value {
            font-family: 'JetBrains Mono'; font-size: 32px; font-weight: 700;
        }
        .hero-balance .value.accent { color: var(--accent); }
        .hero-balance .value.reward { color: var(--reward); }
        .hero-balance .empty-hint {
            font-size: 12px; color: var(--text-faint); font-family: 'Inter'; font-weight: 400; margin-top: 4px;
        }
        .secondary-stats { display: flex; justify-content: center; gap: 32px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
        .secondary-stat .label { font-size: 10px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.5px; }
        .secondary-stat .value { font-family: 'JetBrains Mono'; font-size: 13px; color: var(--text-dim); margin-top: 2px; }

        /* ===== STAKE BALANCES (compact) ===== */
        .stake-balances {
            display: flex; justify-content: space-between; gap: 8px;
            margin-bottom: 14px; padding: 14px 16px; border-radius: 10px;
            background: rgba(255,255,255,0.02); border: 1px solid var(--border);
        }
        .stake-bal { text-align: center; flex: 1; }
        .stake-bal-label { display: block; font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 4px; }
        .stake-bal-val { font-size: 18px; font-weight: 700; color: var(--text); }

        /* ===== STAKE INFO ROWS ===== */
        .stake-info-rows { margin-bottom: 16px; }
        .stake-info-row {
            display: flex; justify-content: space-between; align-items: center;
            padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,0.03);
        }
        .stake-info-row:last-child { border-bottom: none; }
        .stake-info-label { font-size: 12px; color: var(--text-muted); }
        .stake-info-val { font-size: 12px; color: var(--text-dim); font-weight: 500; }

        /* ===== REWARD SOURCE ===== */
        .reward-source {
            background: rgba(34,197,94,0.04); border: 1px solid rgba(34,197,94,0.12);
            border-radius: 8px; padding: 10px 12px; margin-bottom: 16px;
        }
        .reward-source-header {
            font-family: 'JetBrains Mono', monospace; font-size: 9px; font-weight: 600;
            text-transform: uppercase; letter-spacing: 0.12em; color: var(--green);
            margin-bottom: 8px;
        }
        .reward-source-row {
            display: flex; justify-content: space-between; align-items: center;
            padding: 3px 0; font-size: 11px;
        }
        .reward-source-label { color: var(--text-muted); }
        .reward-source-val { color: var(--text-dim); font-family: 'JetBrains Mono', monospace; font-size: 11px; }
        .reward-source-link {
            color: var(--cyan); font-family: 'JetBrains Mono', monospace; font-size: 11px;
            text-decoration: none;
        }
        .reward-source-link:hover { text-decoration: underline; }

        /* ===== INPUTS ===== */
        .input-group { margin-bottom: 12px; }
        .input-row { display: flex; gap: 8px; }
        .input-row input {
            flex: 1; padding: 12px 16px; border-radius: 10px;
            background: rgba(255,255,255,0.05); border: 1px solid var(--border);
            color: var(--text); font-family: 'JetBrains Mono'; font-size: 14px; outline: none;
        }
        .input-row input:focus { border-color: var(--accent); }
        .input-row input::placeholder { color: var(--text-faint); }
        .max-btn {
            padding: 12px 14px; border-radius: 10px; border: 1px solid var(--accent);
            background: var(--accent-dim); color: var(--accent); font-weight: 700; font-size: 11px;
            cursor: pointer; white-space: nowrap; text-transform: uppercase; letter-spacing: 0.5px;
            transition: all 0.2s;
        }
        .max-btn:hover { background: rgba(167,139,250,0.25); }
        .estimate-preview {
            font-size: 11px; color: var(--text-faint); margin-top: 6px; padding-left: 4px;
            font-family: 'JetBrains Mono'; min-height: 16px;
        }
        .estimate-preview span { color: var(--reward); }

        /* ===== BUTTONS ===== */
        .action-row { display: flex; gap: 8px; }
        .btn {
            flex: 1; padding: 13px; border: none; border-radius: 10px;
            font-family: 'Plus Jakarta Sans'; font-size: 13px; font-weight: 700;
            cursor: pointer; transition: all 0.2s; position: relative;
        }
        .btn:disabled { opacity: 0.35; cursor: not-allowed; }
        .btn-primary {
            background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%); color: white;
        }
        .btn-primary:hover:not(:disabled) { box-shadow: 0 4px 16px var(--accent-glow); transform: translateY(-1px); }
        .btn-claim {
            background: linear-gradient(135deg, var(--reward) 0%, #16a34a 100%); color: white;
        }
        .btn-claim:hover:not(:disabled) { box-shadow: 0 4px 16px rgba(34,197,94,0.3); transform: translateY(-1px); }
        .btn-secondary {
            background: transparent; border: 1px solid var(--border); color: var(--text-dim);
        }
        .btn-secondary:hover:not(:disabled) { background: var(--bg-card-hover); color: var(--text); border-color: var(--border-hover); }
        .btn-exit {
            background: transparent; border: 1px solid rgba(239,68,68,0.3); color: var(--destructive);
            font-size: 12px;
        }
        .btn-exit:hover:not(:disabled) { background: var(--destructive-dim); border-color: var(--destructive); }

        /* ===== POOL INFO ===== */
        .pool-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; }
        .pool-label { font-size: 12px; color: var(--text-muted); display: flex; align-items: center; gap: 4px; }
        .pool-value { font-family: 'JetBrains Mono'; font-size: 12px; color: var(--text-dim); }
        .pool-value.highlight { color: var(--accent); font-weight: 600; }
        .info-tip {
            display: inline-flex; align-items: center; justify-content: center;
            width: 14px; height: 14px; border-radius: 50%; background: rgba(255,255,255,0.06);
            font-size: 9px; color: var(--text-faint); cursor: help; position: relative;
        }
        .info-tip:hover .tooltip { display: block; }
        .tooltip {
            display: none; position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%);
            background: #1a1a2e; border: 1px solid var(--border-hover); border-radius: 8px;
            padding: 8px 12px; font-size: 11px; color: var(--text-dim); white-space: nowrap;
            font-family: 'Inter'; font-weight: 400; z-index: 10;
        }
        .tooltip::after {
            content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
            border: 5px solid transparent; border-top-color: #1a1a2e;
        }

        /* ===== TX LOG ===== */
        .tx-log {
            margin-top: 8px; padding: 10px 12px; border-radius: 10px;
            background: rgba(255,255,255,0.02); border: 1px solid var(--border);
            max-height: 100px; overflow-y: auto; font-family: 'JetBrains Mono'; font-size: 11px;
            color: var(--text-muted); line-height: 1.6; display: none;
        }
        .tx-log.visible { display: block; }
        .tx-log .success { color: var(--reward); }
        .tx-log .error { color: var(--destructive); }
        .tx-log .pending { color: var(--pending); }

        /* ===== CONTRACT ADDRESSES ===== */
        .addr-section { margin-top: 20px; }
        .addr-toggle {
            display: flex; align-items: center; justify-content: center; gap: 6px;
            width: 100%; border: none; background: none; color: var(--text-faint);
            font-size: 11px; cursor: pointer; padding: 8px; transition: color 0.2s;
        }
        .addr-toggle:hover { color: var(--text-muted); }
        .addr-toggle .arrow { transition: transform 0.2s; font-size: 8px; }
        .addr-toggle.open .arrow { transform: rotate(180deg); }
        .addr-list { display: none; margin-top: 8px; }
        .addr-list.open {
            display: block; padding: 16px; background: var(--bg-card);
            border: 1px solid var(--border); border-radius: 12px;
        }
        .addr-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border); }
        .addr-row:last-child { border-bottom: none; }
        .addr-label { font-size: 11px; color: var(--text-muted); min-width: 90px; font-weight: 600; }
        .addr-value {
            font-family: 'JetBrains Mono'; font-size: 11px; color: var(--text-faint); cursor: pointer;
            flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: color 0.2s;
        }
        .addr-value:hover { color: var(--accent); }
        .addr-link { color: var(--text-faint); text-decoration: none; font-size: 13px; flex-shrink: 0; }
        .addr-link:hover { color: var(--accent); }

        /* ===== CONFIRM MODAL ===== */
        .modal-overlay {
            display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.7);
            z-index: 1000; align-items: center; justify-content: center;
        }
        .modal-overlay.visible { display: flex; }
        .modal {
            background: #12121a; border: 1px solid var(--border-hover); border-radius: 16px;
            padding: 28px; max-width: 360px; width: 90%; text-align: center;
        }
        .modal h3 { font-size: 16px; margin-bottom: 8px; }
        .modal p { font-size: 13px; color: var(--text-muted); margin-bottom: 20px; line-height: 1.5; }
        .modal-actions { display: flex; gap: 8px; }
        .modal-actions .btn { font-size: 13px; }

        /* ===== STEPS ===== */
        .steps { display: flex; flex-direction: column; gap: 10px; }
        .step {
            display: flex; align-items: flex-start; gap: 12px;
            font-size: 13px; color: var(--text-dim); line-height: 1.5;
        }
        .step strong { color: var(--text); }
        .step-num {
            flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%;
            background: var(--accent-dim); color: var(--accent);
            font-family: 'JetBrains Mono'; font-size: 11px; font-weight: 700;
            display: flex; align-items: center; justify-content: center; margin-top: 1px;
        }

        .spinner { display: inline-block; width: 14px; height: 14px; border: 2px solid transparent;
            border-top-color: currentColor; border-radius: 50%; animation: spin 0.6s linear infinite;
            vertical-align: middle; margin-right: 4px;
        }
        @keyframes spin { to { transform: rotate(360deg); } }

        /* ===== TESTING GUIDE ===== */
        .guide-content {
            display: none; margin-top: 8px; padding: 20px;
            background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px;
        }
        .guide-content.open { display: block; }
        .guide-header {
            font-size: 12px; color: var(--text-muted); margin-bottom: 16px;
            padding-bottom: 12px; border-bottom: 1px solid var(--border);
        }
        .guide-step { margin-bottom: 16px; }
        .guide-step:last-of-type { margin-bottom: 12px; }
        .guide-step-header { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
        .guide-step-header strong { font-size: 13px; color: var(--text); }
        .guide-step-body { padding-left: 32px; font-size: 12px; color: var(--text-dim); line-height: 1.6; }
        .guide-check { padding: 2px 0; }
        .guide-note {
            margin-top: 6px; padding: 6px 10px; border-radius: 6px;
            background: rgba(245,158,11,0.08); border: 1px solid rgba(245,158,11,0.15);
            font-size: 11px; color: var(--pending);
        }
        .guide-verify {
            margin-top: 6px; padding: 6px 10px; border-radius: 6px;
            background: var(--reward-dim); font-size: 11px; color: var(--reward);
        }
        .guide-link { color: var(--accent); text-decoration: none; }
        .guide-link:hover { text-decoration: underline; }
        .guide-footer {
            margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--border);
            font-size: 11px; color: var(--text-faint); line-height: 1.6;
        }
        .guide-footer code {
            padding: 1px 5px; border-radius: 4px; background: rgba(255,255,255,0.06);
            font-family: 'JetBrains Mono'; font-size: 10px;
        }

        /* ===== CSP: Replace inline style attributes ===== */
        .hide { display: none !important; }

        /* Permanently hidden backward-compat elements */
        #walletWETH, #walletHint, #earnedHero, #shareBadge, #poolCard, #oracleCard,
        #stakePoolShareInline, #stakeRewardRateInline, #stakeTotalStakedInline {
            display: none !important;
        }

        /* How-it-works footer */
        .hiw-footer { margin-top:14px; padding-top:12px; border-top:1px solid var(--border); font-size:11px; color:var(--text-faint); line-height:1.6; }
        .hiw-footer a { color:var(--accent); text-decoration:none; }

        /* Market status bar sub-label */

        /* Pending color for burn stats */
        .color-pending { color: var(--pending); }

        /* Withdraw section */
        #withdrawSection { margin-top: 8px; }
        .withdraw-unstake-btn { flex:none; padding:12px 16px; }

        /* Polymarket icon small */
        .poly-icon-sm { border-radius:3px; }

        /* Bet prediction sublabel */
        .bet-pred-sub { opacity:0.5; font-size:10px; }

        /* Bet poly meta */
        .bet-poly-meta { color:var(--text-faint); font-size:10px; }
        .bet-poly-link { color:var(--accent); font-size:10px; margin-left:6px; text-decoration:none; }
        .bet-onchain-link { color:var(--text-faint); font-size:10px; text-decoration:none; opacity:0.7; display:block; margin-top:4px; }
        .bet-onchain-link:hover { opacity:1; color:var(--accent); }

        /* Mint mWETH small button */
        .mint-link-sm { font-size:10px; margin-left:8px; }

        /* Full-width button */
        .btn-full { width:100%; }

        /* Signal popup confidence row */
        .signal-popup-conf-row { margin-bottom:16px; }
        #popupConf { color:var(--accent); }

        /* Results card top margin */
        #resultsCard { margin-top: 12px; }

        /* Table placeholder cells */
        .td-placeholder { text-align:center; color:var(--text-faint); }

        /* Trades summary stat colors */
        #tradesRecord { color:var(--text-dim); }
        #tradesTotal { color:var(--accent); }

        /* Signals pane - backtest header */
        .backtest-header { padding:10px 16px 6px; border-bottom:1px solid var(--border); }
        .backtest-title { font-size:13px; font-weight:600; color:var(--text-dim); }
        .backtest-version { float:right; font-size:10px; color:var(--text-faint); font-family:var(--mono); }

        /* Backtest stat colors */
        .stat-green { color:#4ade80; }
        .stat-dim { color:var(--text-dim); }
        .stat-accent { color:var(--accent); }
        .stat-yellow { color:#facc15; }

        /* Bar header */
        .bar-label { color:var(--text-muted); font-size:11px; }
        .bar-count { font-size:11px; color:var(--text-dim); }
        .backtest-fill { width:61%; background:linear-gradient(90deg,#4ade80,#22d3ee); }

        /* Methodology section */
        .methodology-text { padding:10px 12px 6px; font-size:11px; color:var(--text-muted); line-height:1.6; border-bottom:1px solid var(--border); }
        .methodology-text b { color:var(--text-dim); }

        /* Crowd vs Oracle */
        .cvo-poly-icon { border-radius:2px; vertical-align:middle; }
        #cvoResolved { color:var(--text-dim); }
        #cvoPending { color:var(--pending); }
        .cvo-howto { padding:10px 12px; font-size:10px; color:var(--text-faint); line-height:1.5; }
        .cvo-howto b { color:var(--text-muted); }

        /* Stake modal */
        #apyBadge { background:var(--reward-dim); color:var(--reward); }
        #stakeRequirement { background:rgba(124,58,237,0.1); border:1px solid rgba(124,58,237,0.3); border-radius:8px; padding:12px; margin-bottom:16px; text-align:center; font-size:13px; color:var(--text-dim); line-height:1.5; }
        .stake-req-highlight { color:var(--accent); }
        #stakedBV7X { color:var(--accent); }
        #earnedWETH { color:var(--reward); }
        .stake-actions-row { text-align:center; margin-top:12px; }
        .stake-divider { opacity:0.3; margin:0 6px; }

        /* Hidden countdown wrapper */
        .countdown-wrapper { display: none; }

        /* ===== MOBILE ===== */
        @media (max-width: 768px) {
            .dashboard-grid { grid-template-columns: 1fr; }
            .position-bar-inner { flex-direction: column; align-items: flex-start; gap: 8px; }
            .position-bar-actions { width: 100%; }
        }
        @media (max-width: 480px) {
            .container { padding: 20px 16px; }
            .hero-balance .value { font-size: 26px; }
            .secondary-stats { gap: 20px; }
            .countdown-banner .time { font-size: 18px; }
        }

        /* ===== ORACLE SIGNAL ===== */
        .oracle-signal-badge {
            display: inline-flex; align-items: center; gap: 10px;
            padding: 12px 32px; border-radius: 12px;
            font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 28px;
            letter-spacing: -1px; line-height: 1;
        }
        .oracle-signal-badge.buy {
            color: var(--reward); background: var(--reward-dim);
            border: 1px solid rgba(34,197,94,0.2); box-shadow: 0 0 40px rgba(34,197,94,0.15);
        }
        .oracle-signal-badge.sell {
            color: var(--destructive); background: var(--destructive-dim);
            border: 1px solid rgba(239,68,68,0.2); box-shadow: 0 0 40px rgba(239,68,68,0.15);
        }
        .oracle-signal-badge.hold {
            color: var(--pending); background: rgba(245,158,11,0.12);
            border: 1px solid rgba(245,158,11,0.2); box-shadow: 0 0 40px rgba(245,158,11,0.1);
        }
        .oracle-btc-price { font-size: 22px; font-weight: 600; color: var(--text); }
        .oracle-btc-change { font-size: 12px; margin-top: 2px; }
        .oracle-btc-change.up { color: var(--reward); }
        .oracle-btc-change.down { color: var(--destructive); }
        .oracle-confidence-row {
            display: flex; align-items: center; gap: 10px; margin-bottom: 16px; padding: 0 4px;
        }
        .oracle-confidence-label {
            font-size: 10px; font-weight: 600; color: var(--text-muted);
            text-transform: uppercase; letter-spacing: 1px; min-width: 72px;
        }
        .oracle-confidence-bg {
            flex: 1; height: 5px; background: var(--border); border-radius: 3px; overflow: hidden;
        }
        .oracle-confidence-fill {
            height: 100%; border-radius: 3px; transition: width 0.6s ease; background: var(--accent);
        }
        .oracle-confidence-val { font-size: 12px; color: var(--text-dim); min-width: 32px; text-align: right; }
        .oracle-pillars {
            display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 16px;
        }
        .oracle-pillar {
            background: rgba(255,255,255,0.02); border: 1px solid var(--border);
            border-radius: 8px; padding: 10px 6px; text-align: center;
        }
        .oracle-pillar-label {
            font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;
            color: var(--text-muted); margin-bottom: 4px;
        }
        .oracle-pillar-status {
            font-family: 'JetBrains Mono'; font-size: 11px; font-weight: 700;
            padding: 2px 6px; border-radius: 4px; display: inline-block;
        }
        .oracle-pillar-status.bullish { color: var(--reward); background: var(--reward-dim); }
        .oracle-pillar-status.bearish { color: var(--destructive); background: var(--destructive-dim); }
        .oracle-pillar-status.neutral { color: var(--pending); background: rgba(245,158,11,0.12); }
        .oracle-commentary {
            font-style: italic; font-size: 12px; color: var(--text-muted); line-height: 1.5;
            padding-top: 12px; border-top: 1px solid var(--border);
        }
        .oracle-meta { font-size: 10px; color: var(--text-faint); margin-top: 8px; }

        /* ===== TRADING TERMINAL TABS ===== */
        .record-tabs {
            display: flex; align-items: center; gap: 0; margin-bottom: 16px;
            border-bottom: 1px solid var(--border); overflow-x: auto; -webkit-overflow-scrolling: touch;
        }
        .record-tab {
            padding: 8px 14px; border: none; border-bottom: 2px solid transparent;
            background: transparent; color: var(--text-muted);
            font-family: 'Inter'; font-size: 11px; font-weight: 600;
            cursor: pointer; transition: all 0.2s; text-transform: uppercase; letter-spacing: 0.5px;
            white-space: nowrap; flex-shrink: 0;
        }
        .record-tab:hover { color: var(--text-dim); }
        .record-tab.active {
            color: #fff; border-bottom-color: var(--accent);
        }
        .record-tab-spacer { flex: 1; }
        .signal-history-link {
            font-size: 10px; color: var(--text-faint); cursor: pointer;
            text-decoration: underline; white-space: nowrap; flex-shrink: 0;
            padding: 8px 10px; transition: color 0.2s;
        }
        .signal-history-link:hover { color: var(--accent); }
        /* Terminal table */
        .terminal-table { width: 100%; border-collapse: collapse; font-size: 12px; }
        .terminal-table th {
            text-align: left; padding: 6px 8px; color: var(--text-faint);
            font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px;
            border-bottom: 1px solid var(--border); font-weight: 500;
        }
        .terminal-table td {
            padding: 5px 8px; border-bottom: 1px solid rgba(255,255,255,0.03);
            font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--text-dim);
        }
        .terminal-table tr:hover td { background: rgba(255,255,255,0.02); }
        .terminal-table .col-up { color: var(--reward); }
        .terminal-table .col-down { color: var(--destructive); }
        .terminal-table .col-active { color: var(--pending, #eab308); }
        .terminal-table .col-won { color: var(--reward); }
        .terminal-table .col-lost { color: var(--destructive); }
        .terminal-table .col-muted { color: var(--text-faint); }

        /* Open Positions — Polymarket-style portfolio */
        .open-positions-table td { vertical-align: middle; padding: 10px 8px; }
        .open-positions-table tr { border-bottom: 1px solid rgba(255,255,255,0.06); }
        .open-positions-table th { font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; }
        .op-market-cell { display: flex; align-items: flex-start; gap: 10px; }
        .op-btc-icon {
            width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
            background: #f7931a; display: flex; align-items: center; justify-content: center;
            font-weight: 800; font-size: 15px; color: #fff; margin-top: 1px;
        }
        .op-market-info { flex: 1; min-width: 0; }
        .op-market-name { font-size: 13px; color: var(--text-primary, #e2e8f0); margin-bottom: 3px; line-height: 1.2; }
        .op-position-badge {
            display: inline-block; font-size: 10px; font-weight: 700; padding: 2px 8px;
            border-radius: 4px; letter-spacing: 0.02em;
        }
        .op-position-badge.up { background: #22c55e; color: #fff; }
        .op-position-badge.down { background: #ef4444; color: #fff; }
        .op-shares { font-size: 11px; color: var(--text-faint); margin-left: 6px; }
        .op-avg-now { font-family: 'JetBrains Mono', monospace; font-size: 12px; white-space: nowrap; }
        .op-avg-now .arrow { color: var(--text-faint); margin: 0 3px; }
        .op-value-cell { text-align: right; }
        .op-value-amount { font-family: 'JetBrains Mono', monospace; font-size: 13px; font-weight: 600; color: var(--text-primary, #e2e8f0); }
        .op-value-pnl { font-size: 11px; margin-top: 2px; }
        .op-value-pnl.positive { color: #22c55e; }
        .op-value-pnl.negative { color: #ef4444; }
        .op-sell-btn {
            background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
            color: var(--text-secondary, #94a3b8); font-size: 11px; font-weight: 600;
            padding: 4px 12px; border-radius: 6px; cursor: pointer; white-space: nowrap;
        }
        .op-sell-btn:hover { background: rgba(255,255,255,0.1); color: #fff; }

        .trades-summary {
            display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-bottom: 16px;
        }

        /* ===== RESULTS / SCORECARD ===== */
        .results-stats {
            display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 16px;
        }
        .results-stat {
            background: rgba(255,255,255,0.02); border: 1px solid var(--border);
            border-radius: 8px; padding: 12px 6px; text-align: center;
        }
        .results-stat-val {
            font-family: 'JetBrains Mono'; font-size: 18px; font-weight: 700; margin-bottom: 2px;
        }
        .results-stat-lbl {
            font-size: 9px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px;
        }
        .results-bar-wrap { margin-bottom: 16px; }
        .results-bar-header {
            display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px;
        }
        .results-bar-bg {
            height: 6px; background: var(--destructive-dim); border-radius: 3px; overflow: hidden;
        }
        .results-bar-fill {
            height: 100%; border-radius: 3px; transition: width 0.8s ease; background: var(--text-muted);
        }
        .results-table-wrap {
            border: 1px solid var(--border); border-radius: 8px; overflow: hidden;
        }
        .results-table { width: 100%; border-collapse: collapse; }
        .results-table th {
            font-family: 'JetBrains Mono'; font-size: 9px; font-weight: 600;
            color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px;
            padding: 8px; text-align: left; border-bottom: 1px solid var(--border);
        }
        .results-table td {
            padding: 7px 8px; font-size: 11px; font-family: 'JetBrains Mono';
            color: var(--text-dim); border-bottom: 1px solid var(--border);
        }
        .results-table tr:last-child td { border-bottom: none; }
        .results-table tr:hover { background: rgba(255,255,255,0.02); }
        .res-badge {
            display: inline-block; font-family: 'JetBrains Mono'; font-size: 9px;
            font-weight: 600; padding: 2px 6px; border-radius: 3px;
        }
        .res-badge.win { background: var(--reward-dim); color: var(--reward); }
        .res-badge.loss { background: var(--destructive-dim); color: var(--destructive); }
        .res-badge.pending { background: rgba(255,255,255,0.05); color: var(--text-muted); }

        /* ===== CROWD vs ORACLE ===== */
        .cvo-matchup {
            display: flex; align-items: center; justify-content: center; gap: 20px;
            padding: 20px 12px; margin-bottom: 16px;
            background: rgba(255,255,255,0.02); border: 1px solid var(--border); border-radius: 12px;
        }
        .cvo-side { text-align: center; flex: 1; }
        .cvo-side-label {
            font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px;
            color: var(--text-muted); margin-bottom: 6px; font-weight: 600;
        }
        .cvo-side-dir {
            font-family: 'Plus Jakarta Sans', sans-serif; font-size: 28px; font-weight: 800;
            margin-bottom: 4px;
        }
        .cvo-side-dir.up { color: var(--reward); }
        .cvo-side-dir.down { color: var(--destructive); }
        .cvo-side-dir.neutral { color: var(--text-muted); }
        .cvo-side-meta {
            font-family: 'JetBrains Mono'; font-size: 10px; color: var(--text-faint);
        }
        .cvo-vs {
            font-size: 12px; font-weight: 700; color: var(--text-faint);
            text-transform: uppercase; letter-spacing: 1px;
        }
        .cvo-resolve-note {
            text-align: center; font-size: 10px; color: var(--text-faint);
            margin-bottom: 8px; font-family: 'JetBrains Mono';
        }
        .cvo-market-link {
            text-align: center; margin-bottom: 16px; font-size: 11px;
        }
        .cvo-market-link a {
            color: var(--accent); text-decoration: none; margin-left: 4px;
            font-family: 'Inter'; font-weight: 500;
        }
        .cvo-market-link a:hover { text-decoration: underline; }
        @media (max-width: 480px) {
            .cvo-matchup { gap: 12px; padding: 16px 8px; }
            .cvo-side-dir { font-size: 22px; }
        }

        @media (max-width: 480px) {
            .oracle-pillars { grid-template-columns: repeat(2, 1fr); }
            .results-stats { grid-template-columns: repeat(2, 1fr); }
            .results-table th, .results-table td { padding: 6px 5px; font-size: 10px; }
            .oracle-signal-badge { font-size: 22px; padding: 10px 24px; }
        }

        /* ===== BETTING CARD ===== */
        .bet-prediction {
            text-align: center; padding: 20px 0 16px; border-bottom: 1px solid var(--border); margin-bottom: 16px;
        }
        .bet-prediction-label {
            font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px;
            color: var(--text-dim); margin-bottom: 10px;
        }
        .bet-prediction-dir {
            font-family: 'Plus Jakarta Sans'; font-size: 36px; font-weight: 800;
            letter-spacing: -1px; line-height: 1; margin-bottom: 6px;
        }
        .bet-prediction-dir.up { color: var(--reward); }
        .bet-prediction-dir.down { color: var(--destructive); }
        .bet-prediction-dir.neutral { color: var(--pending); }
        .bet-prediction-dir.gated { color: var(--text-muted); font-size: 16px; }
        .bet-prediction-meta {
            font-family: 'JetBrains Mono'; font-size: 13px; color: var(--text-dim);
        }
        .bet-prediction-meta .change { margin-left: 6px; font-size: 11px; }
        .bet-prediction-meta .change.up { color: var(--reward); }
        .bet-prediction-meta .change.down { color: var(--destructive); }
        .bet-why {
            display: inline-block; margin-top: 8px; border: none; background: none;
            color: var(--text-faint); font-size: 11px; cursor: pointer;
            text-decoration: underline; text-decoration-style: dashed;
            text-underline-offset: 3px; transition: color 0.2s;
        }
        .bet-powered-by {
            display: flex; align-items: center; gap: 8px;
            margin-bottom: 12px; justify-content: center;
        }
        .bet-powered-by span {
            font-size: 12px; color: var(--text-dim); text-transform: uppercase;
            letter-spacing: 1px; font-weight: 600;
        }
        .bet-powered-by svg { opacity: 0.5; }
        .bet-why:hover { color: var(--accent); }
        .bet-kalshi {
            display: flex; align-items: center; justify-content: center; gap: 6px;
            margin-top: 10px; font-size: 11px; color: var(--text-faint);
        }
        .bet-kalshi-label { letter-spacing: 0.3px; }
        .bet-kalshi-val {
            font-family: 'JetBrains Mono'; font-weight: 600; font-size: 12px;
        }
        .bet-kalshi-val.up { color: var(--reward); }
        .bet-kalshi-val.down { color: var(--destructive); }
        .bet-balance-row {
            display: flex; align-items: center; justify-content: space-between;
            margin-bottom: 14px;
        }
        .bet-balance-label { font-size: 11px; color: var(--text-muted); }
        .bet-balance-val {
            font-family: 'JetBrains Mono'; font-size: 13px; color: var(--reward); font-weight: 600;
        }
        .bet-sides { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px; }
        .bet-side {
            padding: 14px 8px; border-radius: 10px; text-align: center; cursor: pointer;
            border: 2px solid var(--border); background: transparent;
            transition: all 0.15s; user-select: none;
        }
        .bet-side:hover { border-color: var(--border-hover); }
        .bet-side.selected-up { border-color: var(--reward); background: var(--reward-dim); }
        .bet-side.selected-down { border-color: var(--destructive); background: var(--destructive-dim); }
        .bet-side-inner { display: flex; align-items: center; justify-content: center; gap: 6px; }
        .bet-side-arrow { font-size: 16px; }
        .bet-side-label { font-size: 14px; font-weight: 700; }
        .bet-payout-preview {
            font-size: 11px; color: var(--text-faint); margin-top: 6px; padding-left: 4px;
            font-family: 'JetBrains Mono'; min-height: 16px;
        }
        .bet-payout-preview span { color: var(--text-dim); }
        .bet-payout-preview .preview-profit { color: var(--reward); font-weight: 600; }
        .poly-info-grid {
            display: grid; grid-template-columns: 1fr 1fr; gap: 6px 12px;
            background: rgba(255,255,255,0.02); border: 1px solid var(--border);
            border-radius: 8px; padding: 10px 12px; margin-bottom: 12px;
        }
        .poly-info-item { display: flex; justify-content: space-between; align-items: center; }
        .poly-info-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; }
        .poly-info-val { font-size: 12px; font-weight: 600; font-family: 'JetBrains Mono'; color: var(--text-dim); }
        .poly-info-val.highlight-up { color: var(--reward); }
        .poly-info-val.highlight-down { color: var(--destructive); }
        .bet-divider { border: none; border-top: 1px solid var(--border); margin: 16px 0; }
        .bet-section-label {
            font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;
            color: var(--text-muted); margin-bottom: 8px; text-align: center;
        }
        .bet-active-display {
            padding: 14px; border-radius: 10px; text-align: center;
            background: rgba(255,255,255,0.02); border: 1px solid var(--border);
        }
        .bet-active-dir { font-size: 15px; font-weight: 700; margin-bottom: 4px; }
        .bet-active-dir.up { color: var(--reward); }
        .bet-active-dir.down { color: var(--destructive); }
        .bet-active-details { font-size: 11px; color: var(--text-muted); font-family: 'JetBrains Mono'; line-height: 1.6; }
        .bet-history-row {
            display: flex; justify-content: space-between; align-items: center;
            padding: 6px 0; border-bottom: 1px solid var(--border); font-size: 11px;
            font-family: 'JetBrains Mono';
        }
        .bet-history-row:last-child { border-bottom: none; }
        .bet-history-left { color: var(--text-dim); }
        .bet-history-result { font-weight: 600; }
        .bet-history-result.win { color: var(--reward); }
        .bet-history-result.loss { color: var(--destructive); }

        /* Signal details popup */
        .signal-popup-overlay {
            display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.7);
            z-index: 1000; align-items: center; justify-content: center;
        }
        .signal-popup-overlay.visible { display: flex; }
        .signal-popup {
            background: #12121a; border: 1px solid var(--border-hover); border-radius: 16px;
            padding: 24px; max-width: 380px; width: 90%;
        }
        .signal-popup-header {
            display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px;
        }
        .signal-popup-title {
            font-size: 13px; font-weight: 700; color: var(--text);
        }
        .signal-popup-close {
            border: none; background: none; color: var(--text-faint); font-size: 18px;
            cursor: pointer; padding: 0 4px; line-height: 1;
        }
        .signal-popup-close:hover { color: var(--text); }
        .signal-popup-pillars {
            display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-bottom: 16px;
        }
        .signal-popup-pillar {
            display: flex; align-items: center; justify-content: space-between;
            padding: 8px 12px; border-radius: 8px;
            background: rgba(255,255,255,0.03); border: 1px solid var(--border);
        }
        .signal-popup-pillar-label { font-size: 11px; color: var(--text-muted); }
        .signal-popup-pillar-val { font-family: 'JetBrains Mono'; font-size: 11px; font-weight: 700; }
        .signal-popup-pillar-val.bullish { color: var(--reward); }
        .signal-popup-pillar-val.bearish { color: var(--destructive); }
        .signal-popup-pillar-val.neutral { color: var(--pending); }
        .signal-popup-commentary {
            font-style: italic; font-size: 12px; color: var(--text-muted); line-height: 1.6;
            padding: 12px; border-radius: 8px; background: rgba(255,255,255,0.02);
        }
        .bet-oracle-dot {
            width: 8px; height: 8px; border-radius: 50%;
            background: var(--accent); display: inline-block;
            box-shadow: 0 0 6px var(--accent-glow);
        }
        .btc-chart-wrap {
            background: var(--bg-card); border: 1px solid var(--border);
            border-radius: 12px; padding: 0; margin-bottom: 16px;
            overflow: hidden;
        }
        .btc-chart-header {
            display: flex; align-items: center; justify-content: space-between;
            padding: 14px 16px 0;
        }
        .btc-chart-price {
            display: flex; align-items: center; gap: 10px;
        }
        .btc-chart-label {
            font-size: 11px; font-weight: 600; color: var(--text-muted);
            text-transform: uppercase; letter-spacing: 0.5px;
        }
        .btc-chart-val {
            font-size: 26px; font-weight: 700; color: var(--text);
            transition: opacity 0.15s;
        }
        .btc-chart-change {
            font-size: 12px; font-weight: 500;
        }
        .btc-chart-change.up { color: var(--reward); }
        .btc-chart-change.down { color: var(--destructive); }
        .btc-chart-canvas-wrap {
            position: relative; width: 100%; height: 340px; padding: 0 4px;
        }
        #btcCanvas {
            display: block; width: 100%; height: 100%;
        }
        @keyframes tickerFlash { 0%{opacity:0.5} 100%{opacity:1} }

        /* ===== VALUE PROPS ===== */
        .header-value-props {
            display: flex; flex-direction: column; gap: 6px;
            padding: 12px 20px;
            background: rgba(255,255,255,0.03); border: 1px solid var(--border);
            border-radius: 10px;
        }
        .value-prop {
            font-size: 14px; color: var(--text-dim); line-height: 1.5;
            display: flex; align-items: center; gap: 8px;
        }
        .value-prop-icon { font-size: 16px; flex-shrink: 0; }
        .value-prop strong { color: var(--text); }
        /* Testnet info popup */
        .testnet-info-popup {
            display: none; position: absolute; top: calc(100% + 8px); left: 0;
            background: #1a1a2e; border: 1px solid var(--border); border-radius: 10px;
            padding: 16px 20px; width: 380px; z-index: 100;
            box-shadow: 0 8px 32px rgba(0,0,0,0.6);
            text-transform: none; letter-spacing: normal; font-weight: 400;
            font-size: 13px; line-height: 1.5; color: var(--text-dim);
        }
        .testnet-info-popup.visible { display: block; }
        .testnet-info-popup .value-prop { font-size: 13px; display: block; }

        /* ===== POSITION BAR (TOP, above chart) ===== */
        .position-bar-top {
            display: none; /* shown via JS when position bar is populated */
            margin-bottom: 12px;
        }

        /* ===== CHART + BET SIDE-BY-SIDE ===== */
        .chart-bet-row {
            display: grid; grid-template-columns: 1fr 400px; gap: 14px;
            align-items: stretch; margin-bottom: 14px;
        }
        .chart-bet-row .btc-chart-wrap { margin-bottom: 0; }
        .chart-bet-row #bettingSlot > .card { margin: 0; height: 100%; display: flex; flex-direction: column; }
        @media (max-width: 860px) {
            .chart-bet-row { grid-template-columns: 1fr; }
        }


        /* ── Real Wager Overlay (terminal card) ── */
        .real-wager-overlay {
            position: absolute; inset: 0; z-index: 5;
            background: rgba(10,10,15,0.92);
            backdrop-filter: blur(6px);
            display: flex; align-items: center; justify-content: center;
            border-radius: 12px;
        }
        .real-wager-overlay.hide { display: none; }
        #resultsCard { position: relative; }
        .real-wager-overlay-inner {
            text-align: center; padding: 32px 24px; max-width: 380px;
        }
        .real-wager-overlay-icon {
            font-size: 36px; margin-bottom: 12px;
        }
        .real-wager-overlay-title {
            font-family: 'Plus Jakarta Sans', sans-serif;
            font-size: 18px; font-weight: 700; margin-bottom: 8px;
            color: var(--text);
        }
        .real-wager-overlay-text {
            font-size: 13px; color: var(--text-dim); line-height: 1.5;
            margin-bottom: 16px;
        }
        .real-wager-overlay-btn {
            display: inline-block; text-decoration: none;
            padding: 10px 24px; font-size: 14px;
        }
        .real-wager-overlay-sub {
            font-size: 11px; color: var(--text-faint); margin-top: 14px;
        }
        .real-wager-overlay-dismiss {
            background: none; border: none; color: var(--text-muted);
            font-size: 11px; cursor: pointer; margin-top: 6px;
            text-decoration: underline; padding: 4px 8px;
        }
        .real-wager-overlay-dismiss:hover { color: var(--text); }

        /* ── Wager Fee Mode Toggle ── */
        .bet-mode-toggle {
            display: flex; gap: 4px; margin: 8px 0 4px; padding: 3px;
            background: rgba(255,255,255,0.04); border-radius: 8px;
        }
        .bet-mode-btn {
            flex: 1; padding: 6px 0; font-size: 12px; font-weight: 600;
            border: none; border-radius: 6px; cursor: pointer;
            background: transparent; color: var(--text-muted); transition: all 0.2s;
        }
        .bet-mode-btn.active { background: var(--accent); color: #fff; }
        .bet-mode-btn:hover:not(.active) { color: var(--text); }

        /* ── Wager Fee Info ── */
        .wager-fee-info {
            margin: 8px 0; padding: 10px 12px;
            background: rgba(167,139,250,0.08); border: 1px solid rgba(167,139,250,0.15);
            border-radius: 8px; font-size: 13px;
        }
        .wager-fee-row { display: flex; justify-content: space-between; padding: 2px 0; }
        .wager-fee-row span:last-child { font-family: 'JetBrains Mono', monospace; font-weight: 600; }
        .wager-fee-note { color: var(--text-faint); font-size: 11px; justify-content: center; margin-top: 4px; }

        /* ── Wager Success ── */
        .wager-success {
            padding: 20px 16px; text-align: center;
        }
        .wager-success-check {
            font-size: 32px; color: var(--reward); margin-bottom: 4px;
        }
        .wager-success-title {
            font-size: 18px; font-weight: 700; color: var(--reward); margin-bottom: 12px;
        }
        .wager-success-detail {
            font-size: 14px; color: var(--text-dim); margin-bottom: 6px;
        }
        .wager-tx-link {
            color: var(--accent); text-decoration: none; font-family: 'JetBrains Mono', monospace;
            font-size: 13px;
        }
        .wager-tx-link:hover { text-decoration: underline; }