:root {
            --lime-main: #00ff00;
            --lime-dim: #004400;
            --glass-bg: rgba(0, 10, 0, 0.94);
            --alert-red: #ff0000;
            --ghost-gray: #444444;
            --warn-orange: #ffaa00;
            --info-cyan: #00ffff;
            --dex-purple: #aa00ff;
            --gold-hvt: #ffd700;
        } 

        body {
            margin: 0; overflow: hidden; background-color: #000;
            font-family: 'Rajdhani', sans-serif; color: var(--lime-main);
            touch-action: none; user-select: none;
        } 

        /* --- SPLASH SCREEN --- */
        #splash-screen {
            position: fixed; inset: 0; z-index: 9999;
            background-color: #000;
            display: flex; flex-direction: column; justify-content: center; align-items: center;
            transition: opacity 1s ease-out;
        }
        #boot-container {
            z-index: 10000; display: flex; flex-direction: column; gap: 20px; align-items: center;
        }
        #boot-btn {
            background: #000; border: 2px solid var(--lime-main);
            color: var(--lime-main); padding: 15px 30px;
            font-family: 'Orbitron', sans-serif; font-size: 16px; letter-spacing: 4px;
            cursor: pointer; box-shadow: 0 0 20px var(--lime-main);
            animation: pulse-green 2s infinite;
        }
        @keyframes pulse-green {
            0% { box-shadow: 0 0 0 0 rgba(0, 255, 0, 0.7); }
            70% { box-shadow: 0 0 0 10px rgba(0, 255, 0, 0); }
            100% { box-shadow: 0 0 0 0 rgba(0, 255, 0, 0); }
        }
        #skip-btn {
            position: absolute; top: 30px; right: 30px; z-index: 10001;
            background: rgba(0,0,0,0.7); border: 1px solid #333; color: #666;
            padding: 8px 15px; font-family: 'Share Tech Mono'; font-size: 12px;
            cursor: pointer; display: block;
        }
        #skip-btn:hover { border-color: var(--lime-main); color: var(--lime-main); }
        .fade-out { opacity: 0; pointer-events: none; } 

        /* --- FAKE THUMB SCANNER (replaces ACTIVATE button; reads anyone's thumb) --- */
        #thumb-scan { display: flex; flex-direction: column; align-items: center; gap: 14px;
            cursor: pointer; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; outline: none; padding: 4px; }
        .ts-ring { position: relative; width: 140px; height: 140px; display: flex; align-items: center; justify-content: center; }
        .ts-prog { position: absolute; inset: 0; width: 140px; height: 140px; transform: rotate(-90deg); }
        .ts-prog-track { fill: none; stroke: rgba(0,255,0,0.13); stroke-width: 4; }
        .ts-prog-bar { fill: none; stroke: #00ff00; stroke-width: 4; stroke-linecap: round; filter: drop-shadow(0 0 6px #00ff00); }
        .ts-print { position: relative; width: 120px; height: 120px; border-radius: 50%; overflow: hidden;
            display: flex; align-items: center; justify-content: center; border: 1px solid rgba(0,255,0,0.28);
            background: radial-gradient(circle, rgba(0,42,0,0.55) 0%, rgba(0,12,0,0.88) 100%);
            box-shadow: inset 0 0 22px rgba(0,255,0,0.12); transition: box-shadow .2s, border-color .2s; }
        .ts-print svg { width: 60px; height: 60px; color: #2f8f2f; transition: color .2s, filter .2s; }
        /* IPFS power-button video: round, zoomed to fill, not directly touchable
           (taps pass through to #thumb-scan so the button still activates). */
        .ts-print .ts-vid { position: absolute; inset: 0; width: 100%; height: 100%;
            object-fit: cover; border-radius: 50%; display: block; pointer-events: none;
            background: #000; }
        #thumb-scan.scanning .ts-print svg { color: #00ff00; filter: drop-shadow(0 0 6px #00ff00); }
        #thumb-scan.granted .ts-print { border-color: #00ff00; box-shadow: inset 0 0 26px rgba(0,255,0,0.28), 0 0 26px rgba(0,255,0,0.4); }
        #thumb-scan.granted .ts-print svg { color: #00ff00; filter: drop-shadow(0 0 12px #00ff00); }
        .ts-scanline { position: absolute; left: 0; right: 0; top: 0; height: 2px; opacity: 0;
            background: linear-gradient(90deg, transparent, #00ff00, transparent); box-shadow: 0 0 12px 2px rgba(0,255,0,0.55); }
        #thumb-scan.scanning .ts-scanline { opacity: 1; animation: ts-sweep 0.85s ease-in-out infinite; }
        @keyframes ts-sweep { 0% { top: 4%; } 50% { top: 94%; } 100% { top: 4%; } }
        #thumb-scan:not(.scanning):not(.granted) .ts-print { animation: ts-idle 2.6s ease-in-out infinite; }
        @keyframes ts-idle { 0%,100% { box-shadow: inset 0 0 22px rgba(0,255,0,0.10); } 50% { box-shadow: inset 0 0 26px rgba(0,255,0,0.20), 0 0 16px rgba(0,255,0,0.16); } }
        .ts-label { font-family: 'Orbitron', sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 2px; color: #00ff00; text-shadow: 0 0 8px rgba(0,255,0,0.5); }
        #thumb-scan.granted .ts-label { color: #c7ffc7; text-shadow: 0 0 12px rgba(0,255,0,0.8); }
        .ts-status { font-family: 'Share Tech Mono', monospace; font-size: 8px; letter-spacing: 1.5px; color: #7ac77a; }
        @media (prefers-reduced-motion: reduce) {
            #thumb-scan.scanning .ts-scanline { animation: none; opacity: 1; }
            #thumb-scan:not(.scanning):not(.granted) .ts-print { animation: none; }
        }

        /* TUTORIAL OVERLAY */
        #tutorial-overlay {
            position: fixed; inset: 0; z-index: 5000; background: rgba(0,0,0,0.85);
            display: none; pointer-events: auto;
        }
        .tut-active { display: block !important; }
        
        /* HIGHLIGHTING LOGIC */
        .highlight-element {
            position: relative; 
            z-index: 5001 !important;
            box-shadow: 0 0 0 9999px rgba(0,0,0,0.85), 0 0 30px var(--lime-main);
            transition: all 0.3s ease;
        }
        
        #tut-card {
            position: absolute; bottom: 15%; left: 50%; transform: translateX(-50%);
            width: 90%; max-width: 400px;
            background: rgba(0, 20, 0, 0.98); border: 2px solid var(--lime-main);
            padding: 20px; border-radius: 8px; z-index: 5002;
            text-align: center; box-shadow: 0 0 30px var(--lime-main);
        }
        /* What's New briefing: center + scroll (content is longer than a tour step). */
        #tut-card.tut-scroll { top: 50%; bottom: auto; transform: translate(-50%, -50%);
            max-height: 82vh; overflow-y: auto; -webkit-overflow-scrolling: touch; }
        .tut-title { font-family: 'Orbitron'; font-weight: bold; color: white; margin-bottom: 10px; font-size: 18px; border-bottom: 1px solid #333; padding-bottom: 5px; }
        .tut-text { font-family: 'Share Tech Mono'; color: #ccc; font-size: 13px; line-height: 1.5; margin-bottom: 20px; text-align: left; }
        .tut-controls { display: flex; gap: 10px; justify-content: center; }
        .tut-btn {
            padding: 10px 25px; border: 1px solid var(--lime-main); background: #001100;
            color: var(--lime-main); font-family: 'Orbitron'; font-weight: bold; cursor: pointer;
            font-size: 12px; letter-spacing: 1px;
        }
        .tut-btn:hover { background: var(--lime-main); color: black; } 

        #app-background {
            position: absolute; inset: 0; z-index: 0;
            background: radial-gradient(circle at center, #002200 0%, #000000 70%);
        }
        #canvas-container { position: absolute; inset: 0; z-index: 1; opacity: 0.8; }
        #alert-layer { position: absolute; inset: 0; z-index: 900; pointer-events: none; } 

        #toast {
            /* v16.7.2: moved off dead-center → bottom snackbar so it no longer covers the action buttons */
            position: absolute; bottom: calc(76px + env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%);
            background: rgba(0, 50, 0, 0.95); border: 1px solid var(--lime-main);
            color: white; padding: 12px 24px; border-radius: 4px;
            font-family: 'Share Tech Mono'; font-size: 14px; letter-spacing: 1px;
            opacity: 0; pointer-events: none; transition: opacity 0.2s; z-index: 6000;
            box-shadow: 0 0 30px var(--lime-main); font-weight: bold; text-align: center;
            max-width: calc(100vw - 32px);
        }
        .toast-show { opacity: 1 !important; } 

        /* INTEL DASHBOARD MODAL */
        #intel-dashboard {
            position: fixed; top: 5%; left: 5%; right: 5%; bottom: 5%; z-index: 10000;
            background: rgba(5, 12, 5, 0.98); border: 2px solid var(--lime-main);
            border-radius: 12px; display: none; flex-direction: column;
            padding: 20px; font-family: 'Share Tech Mono'; backdrop-filter: blur(20px);
            box-shadow: 0 0 50px rgba(0,0,0,0.9);
            animation: neon-breathe 4s infinite ease-in-out;
        }
        #intel-dashboard.active { display: flex; }
        #intel-nav { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid var(--lime-main); padding-bottom: 15px; margin-bottom: 15px; }
        #intel-title { font-size: 20px; color: var(--lime-main); font-weight: bold; letter-spacing: 2px; font-family: 'Orbitron'; text-shadow: 0 0 10px var(--lime-main); }
        #intel-close { background: transparent; border: 1px solid #555; color: #555; padding: 5px 15px; cursor: pointer; font-size: 12px; }
        #intel-content { flex-grow: 1; background: #0a0a0a; border: 1px solid #113311; color: #00ff00; font-family: 'Share Tech Mono'; font-size: 12px; padding: 15px; overflow-y: auto; white-space: pre-wrap; box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.8); }
        #intel-actions { display: flex; gap: 10px; margin-top: 15px; }
        .intel-action-btn { flex: 1; background: #001100; border: 1px solid var(--lime-main); color: var(--lime-main); padding: 12px; font-weight: bold; font-size: 12px; cursor: pointer; text-transform: uppercase; letter-spacing: 1px; transition: all 0.2s; font-family: 'Orbitron'; display: flex; justify-content: center; align-items: center; gap: 5px; }
        .intel-action-btn:hover { background: var(--lime-main); color: #000; box-shadow: 0 0 15px var(--lime-main); } 

        /* BUBBLE MODAL */
        #bubble-modal {
            position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
            width: 85%; max-width: 350px; background: rgba(0, 20, 0, 0.98); border: 2px solid var(--lime-main);
            border-radius: 12px; padding: 20px; z-index: 2000; display: none; flex-direction: column; gap: 10px;
            box-shadow: 0 0 50px rgba(0, 255, 0, 0.3);
        }
        .modal-active { display: flex !important; }
        .modal-row { display: flex; justify-content: space-between; font-size: 12px; border-bottom: 1px solid #113311; padding-bottom: 5px; }
        .modal-label { color: #55aa55; font-weight: bold; }
        .modal-val { color: white; font-family: 'Share Tech Mono'; text-align: right; word-break: break-all; }
        .modal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
        .mod-btn { background: #001100; border: 1px solid var(--lime-main); color: var(--lime-main); padding: 10px; font-size: 10px; font-weight: bold; text-align: center; border-radius: 4px; font-family: 'Share Tech Mono'; cursor: pointer; transition: background 0.1s; }
        .mod-btn:active { background: var(--lime-main); color: black; }
        .mod-save { border-color: #ffaa00; color: #ffaa00; }
        .mod-trace { border-color: #00ffff; color: #00ffff; } 

        /* TRADINGVIEW CHART WINDOW */
        #tv-modal {
            position: fixed; top: 15%; left: 10%; width: 350px; height: 300px;
            background: rgba(0, 15, 0, 0.95); border: 2px solid var(--lime-main);
            border-radius: 8px; z-index: 9000; display: none; flex-direction: column;
            box-shadow: 0 0 30px rgba(0,0,0,0.8);
            resize: both; overflow: hidden; min-width: 300px; min-height: 250px;
        }
        #tv-header {
            background: #002200; color: var(--lime-main);
            padding: 6px 10px; font-family: 'Orbitron'; font-size: 11px;
            display: flex; justify-content: space-between; align-items: center;
            border-bottom: 1px solid var(--lime-dim); cursor: grab;
        }
        #tv-header:active { cursor: grabbing; }
        #tv-body { flex-grow: 1; background: #000; width: 100%; height: 100%; overflow: hidden; } 

        /* NEXUS-9 MODAL (FLOATING) */
        #nexus-modal {
            position: fixed; top: 20%; left: 15%; width: 350px; height: 500px;
            background: rgba(0, 15, 0, 0.95); border: 2px solid var(--lime-main);
            border-radius: 8px; z-index: 9001; display: none; flex-direction: column;
            box-shadow: 0 0 30px rgba(0,0,0,0.8);
            resize: both; overflow: hidden; min-width: 300px; min-height: 250px;
        }
        #nexus-header {
            background: #002200; color: var(--lime-main);
            padding: 6px 10px; font-family: 'Orbitron'; font-size: 11px;
            display: flex; justify-content: space-between; align-items: center;
            border-bottom: 1px solid var(--lime-dim); cursor: grab;
        }
        #nexus-header:active { cursor: grabbing; }
        #nexus-body { flex-grow: 1; background: #000; width: 100%; height: 100%; overflow: hidden; }

        /* TOP HUD */
        #hud-top {
            position: absolute; top: 0; left: 0; right: 0; z-index: 20;
            background: linear-gradient(to bottom, rgba(0,0,0,0.95) 70%, transparent);
            padding-top: max(25px, env(safe-area-inset-top)); 
            padding-left: 15px; padding-right: 15px; padding-bottom: 20px;
            pointer-events: none; display: flex; flex-direction: column; gap: 8px;
        } 

        #session-timer {
            position: absolute;
            top: max(5px, env(safe-area-inset-top));
            right: 15px;
            font-family: 'Share Tech Mono', monospace;
            font-size: 10px;
            color: var(--lime-main);
            text-shadow: 0 0 5px rgba(0, 255, 0, 0.4);
            letter-spacing: 1px;
            opacity: 0.8;
            z-index: 100;
        } 

        .stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; pointer-events: auto; margin-bottom: 5px; }
        .stat-box {
            background: rgba(0, 20, 0, 0.9); border: 1px solid var(--lime-dim);
            padding: 8px; border-radius: 6px; backdrop-filter: blur(10px);
            display: flex; flex-direction: column; justify-content: center;
            box-shadow: 0 4px 10px rgba(0,0,0,0.6);
            transition: border-color 0.2s; 
        }
        
        /* INTERACTIVE PRICE BOX STYLE */
        #price-box { cursor: pointer; }
        #price-box:hover { border-color: var(--lime-main); box-shadow: 0 0 15px rgba(0,255,0,0.3); } 

        /* FIXED: Removed text-shadow to stop fuzziness */
        .price-text { 
            font-family: 'Share Tech Mono', monospace; 
            font-size: 1.4rem; 
            font-weight: bold; 
            color: #fff; 
            text-shadow: none; 
        }
        .label-text { font-size: 0.65rem; color: #55aa55; letter-spacing: 1px; font-weight: bold; }
        .source-tag { font-size: 0.5rem; color: #338833; float: right; }
        
        .header-section { text-align: center; pointer-events: auto; position: relative; padding-bottom: 10px; }
        .glitch { font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: 1.2rem; color: var(--lime-main); letter-spacing: 2px; text-shadow: 0 0 10px var(--lime-main); }
        .subtitle { font-family: 'Share Tech Mono', monospace; font-size: 0.65rem; color: var(--lime-main); letter-spacing: 3px; opacity: 0.8; }
        
        /* TACTICAL CONTROL BAR */
        .tactical-bar {
            display: flex; justify-content: center; gap: 12px; margin-top: 8px; pointer-events: auto;
        }
        .tac-btn {
            width: 36px; height: 36px;
            background: rgba(0, 20, 0, 0.8); border: 1px solid #333; color: #666;
            cursor: pointer; border-radius: 8px; 
            display: flex; justify-content: center; align-items: center; transition: all 0.2s;
        }
        .tac-btn svg { width: 18px; height: 18px; stroke-width: 2; }
        .tac-btn:hover { border-color: var(--lime-main); color: var(--lime-main); transform: scale(1.1); }
        .tac-active { border-color: var(--lime-main); color: var(--lime-main); background: #001100; box-shadow: 0 0 10px rgba(0,255,0,0.2); }
        .tac-alert-active { border-color: var(--alert-red); color: var(--alert-red); background: #220000; box-shadow: 0 0 10px rgba(255,0,0,0.2); }
        
        #report-btn {
            width: auto; padding: 0 20px; font-family: 'Orbitron'; font-size: 10px; font-weight: bold; letter-spacing: 1px;
            background: #001100; border-color: var(--lime-main); color: var(--lime-main);
            box-shadow: 0 0 5px rgba(0,255,0,0.3);
        }
        #report-btn:hover { background: var(--lime-main); color: black; } 

        /* ── v16.3 MISSION CONTROL ─────────────────────────────── */
        #view-home { overflow-y: auto; overflow-x: hidden; padding: 0; }
        #mc-wrap { padding: 10px 10px 80px 10px; }
        #mc-header { text-align: center; padding: 12px 8px 8px; border-bottom: 1px solid rgba(0,255,0,0.15); margin-bottom: 10px; }
        #mc-title { font-family: 'Orbitron', monospace; font-size: 15px; font-weight: 900; color: #00ff00; letter-spacing: 3px; text-shadow: 0 0 12px rgba(0,255,0,0.5); }
        #mc-tagline { font-size: 10px; color: #66aa66; line-height: 1.5; margin: 6px 0; }
        #mc-mode-bar { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 8px; }
        #mc-mode-label { font-family: 'Share Tech Mono', monospace; font-size: 9px; color: #00ff00; letter-spacing: 2px; }
        #mc-mode-toggle-btn { background: rgba(0,20,0,0.8); border: 1px solid rgba(0,255,0,0.4); color: #66aa66; font-family: 'Share Tech Mono', monospace; font-size: 9px; letter-spacing: 1px; padding: 4px 10px; cursor: pointer; border-radius: 4px; }
        #mc-mode-toggle-btn:hover { border-color: #00ff00; color: #00ff00; }
        #mc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
        .mc-card { background: rgba(0,15,0,0.9); border: 1px solid rgba(0,255,0,0.2); border-radius: 8px; padding: 10px; display: flex; flex-direction: column; gap: 5px; }
        .mc-card-featured { border-color: #00ff00; box-shadow: 0 0 12px rgba(0,255,0,0.2); grid-column: 1 / -1; }
        .mc-card-wide { grid-column: 1 / -1; }
        .mc-card-icon { font-size: 18px; line-height: 1; }
        .mc-card-title { font-family: 'Orbitron', monospace; font-size: 9px; font-weight: 700; color: #00ff00; letter-spacing: 2px; }
        .mc-card-desc { font-size: 9px; color: #558855; line-height: 1.4; flex-grow: 1; }
        .mc-card-status { font-size: 8px; color: #336633; font-family: 'Share Tech Mono', monospace; }
        .mc-card-btn { margin-top: 6px; background: rgba(0,30,0,0.9); border: 1px solid rgba(0,255,0,0.5); color: #00ff00; font-family: 'Share Tech Mono', monospace; font-size: 8px; letter-spacing: 1px; padding: 6px 4px; cursor: pointer; border-radius: 4px; width: 100%; text-align: center; transition: all 0.15s; }
        .mc-card-btn:hover, .mc-card-btn:active { background: #00ff00; color: #000; border-color: #00ff00; }
        .mc-btn-featured { font-size: 9px; padding: 8px; letter-spacing: 2px; box-shadow: 0 0 8px rgba(0,255,0,0.2); }
        .mc-placeholder { border-style: dashed; opacity: 0.6; }
        #session-btn { width: auto; padding: 0 10px; font-family: 'Share Tech Mono'; font-size: 9px; letter-spacing: 1px; background: rgba(0,10,0,0.8); border-color: rgba(0,255,0,0.3); color: #558855; }
        #session-btn:hover { border-color: var(--lime-main); color: var(--lime-main); }
        #home-mc-btn { border-color: rgba(0,255,0,0.3); color: #66aa66; }
        #home-mc-btn:hover { border-color: #00ff00; color: #00ff00; }
        #home-mc-btn svg { width: 16px; height: 16px; }

        /* BOTTOM DECK */
        #hud-bottom { 
            position: absolute; bottom: 0; left: 0; right: 0; height: 55vh; z-index: 30; 
            display: flex; flex-direction: column; pointer-events: auto; 
            transition: height 0.3s ease-in-out, top 0.3s ease-in-out;
        }
        /* FULLSCREEN TACTICAL MODE */
        #hud-bottom.hud-maximized {
            height: 100vh;
            height: 100dvh;
            top: 0;
            bottom: 0;
            z-index: 50;
        } 

        #command-deck { flex-grow: 1; background: var(--glass-bg); border-top: 2px solid var(--lime-dim); backdrop-filter: blur(12px); display: flex; flex-direction: column; border-radius: 16px 16px 0 0; box-shadow: 0 -10px 40px rgba(0,0,0,0.8); overflow: hidden; }
        
        /* ICON TAB BAR */
        .tab-bar { display: flex; border-bottom: 1px solid var(--lime-dim); height: 50px; flex-shrink: 0; }
        .tab-btn { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-weight: bold; font-size: 9px; background: rgba(0,20,0,0.4); color: #006600; border-right: 1px solid var(--lime-dim); letter-spacing: 1px; font-family: 'Share Tech Mono', sans-serif; cursor: pointer; transition: all 0.2s; }
        .tab-btn svg { width: 18px; height: 18px; stroke-width: 1.5; }
        .tab-btn.active { background: #001100; color: var(--lime-main); border-bottom: 3px solid var(--lime-main); text-shadow: 0 0 5px var(--lime-main); }
        .tab-btn.active svg { stroke: var(--lime-main); stroke-width: 2; filter: drop-shadow(0 0 2px var(--lime-main)); }
        .tab-btn.hvt-active { color: var(--gold-hvt); }
        .tab-btn.hvt-active svg { stroke: var(--gold-hvt); } 

        .view-panel { display: none; flex-direction: column; height: 100%; padding: 0; position: relative; overflow: hidden; }
        .view-panel.active { display: flex; }
        /* BRIEF tab → true full-screen overlay (covers header + tab bar).
           Reserve a top strip so the fixed "X EXIT" button never sits over the
           console's reactor gauge / report header — the whole frame drops below it. */
        #view-brief.active { display:flex; flex-direction:column; position:fixed; inset:0; z-index:9990;
            width:100vw; height:100vh; height:100dvh; box-sizing:border-box; margin:0; background:#000;
            padding:0; padding-top:calc(env(safe-area-inset-top, 0px) + 48px); }
        #view-brief #brief-frame { flex:1 1 auto; width:100%; height:auto; min-height:0; border:0; display:block; }
        #brief-exit { position:fixed; top:max(8px, env(safe-area-inset-top)); right:8px;
            z-index:9996; background:rgba(0,0,0,0.82); border:1px solid #00ff00; color:#00ff00;
            font-family:'Share Tech Mono',monospace; font-size:11px; letter-spacing:2px;
            padding:7px 11px; cursor:pointer; box-shadow:0 0 10px rgba(0,255,0,0.4);
            -webkit-tap-highlight-color:transparent; border-radius:4px; }
        #brief-exit:active { background:#00ff00; color:#000; }
        
        /* ICON FILTER BAR */
        .filter-bar { display: flex; gap: 8px; padding: 10px; border-bottom: 1px solid var(--lime-dim); background: rgba(0,0,0,0.3); flex-shrink: 0; overflow-x: auto; align-items: center; }
        .filter-btn { min-width: 36px; height: 36px; background: #002200; border: 1px solid var(--lime-dim); color: #008800; border-radius: 6px; cursor: pointer; display: flex; justify-content: center; align-items: center; transition: all 0.2s; }
        .filter-btn svg { width: 16px; height: 16px; }
        .filter-btn.active { background: var(--lime-main); color: black; border-color: var(--lime-main); transform: scale(1.05); }
        
        #feed, #watch-list, #case-list, #report-list, #hvt-list { flex-grow: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; touch-action: pan-y; padding-bottom: 40px; }
        
        /* Clean TX Row */
        .tx-row { padding: 10px; border-bottom: 1px solid #112211; display: flex; flex-direction: column; gap: 4px; }
        .row-top { display: flex; justify-content: space-between; align-items: center; }
        .tag-pill { font-size: 9px; padding: 2px 6px; border-radius: 4px; font-weight: bold; display: inline-block; margin-left: 6px; font-family: 'Share Tech Mono'; }
        .tag-tsfr { background: #003300; color: #00ff00; border: 1px solid #005500; }
        .tag-dep { background: #442200; color: #ffaa00; border: 1px solid #663300; }
        .tag-wth { background: #003344; color: #00ffff; border: 1px solid #005566; }
        .tag-dex { background: #330044; color: #aa00ff; border: 1px solid #550066; }
        .tag-fail { background: #333; color: #aaa; border: 1px solid #555; }
        .tag-hvt { background: #443300; color: #ffd700; border: 1px solid #ffd700; box-shadow: 0 0 5px #ffd700; animation: blink-hvt 1s infinite; }
        .tag-l2 { background: #003344; color: #00ffff; border: 1px solid #00aaaa; }
        .tag-bot { background: #111; color: #888; border: 1px solid #333; }
        .tag-trust { background: #004400; color: #00ff00; border: 1px solid #008800; box-shadow: 0 0 5px #00ff00; }
        @keyframes blink-hvt { 50% { opacity: 0.5; } }
        .tx-failed { opacity: 0.5; border-left: 3px solid #555; background: rgba(20,20,20,0.5); }
        .tx-failed .action-btn { border-color: #333; color: #555; }
        .btn-row { display: flex; gap: 5px; margin-top: 4px; }
        .action-btn { flex: 1; padding: 8px 0; text-align: center; border-radius: 2px; font-size: 10px; font-weight: bold; font-family: 'Share Tech Mono'; background: #001100; color: #008800; border: 1px solid var(--lime-dim); cursor: pointer; }
        .action-btn:active { background: var(--lime-main); color: black; }
        .action-btn.trace-btn { border-color: var(--info-cyan); color: var(--info-cyan); }
        .action-btn.trace-btn:active { background: var(--info-cyan); color: black; }
        .entity-name { color: #ffcc00; font-weight: bold; }
        .control-bar { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; border-bottom: 1px solid var(--lime-dim); background: rgba(0,0,0,0.5); flex-shrink: 0; }
        .pause-btn { background: #002200; border: 1px solid var(--lime-main); color: var(--lime-main); padding: 4px 12px; border-radius: 4px; font-size: 11px; font-weight: bold; font-family: 'Share Tech Mono'; cursor: pointer; }
        .paused-mode { background: #442200 !important; border-color: #ffaa00 !important; color: #ffaa00 !important; }
        
        /* REPORT ROW STYLES */
        #report-header { display: flex; justify-content: space-between; padding: 8px 10px; background: rgba(0, 50, 0, 0.5); border-bottom: 1px solid var(--lime-dim); font-size: 9px; font-weight: bold; color: #55aa55; font-family: 'Share Tech Mono'; }
        .report-row { display: flex; justify-content: space-between; align-items: center; padding: 12px 10px; border-bottom: 1px solid #112211; font-size: 11px; font-family: 'Share Tech Mono'; cursor: pointer; transition: background 0.1s; }
        .report-row:hover { background: rgba(0, 255, 0, 0.1); }
        .rep-val-green { color: #00ff00; font-weight: bold; font-size: 12px; } .rep-val-white { color: #ffffff; opacity: 0.8; } .rep-val-dim { color: #666666; } 

        /* GRAPH AND MAP CANVAS & ZOOM CONTROLS */
        #graph-canvas, #map-canvas { width: 100%; height: 100%; display: block; background: #000500; cursor: crosshair; touch-action: none; }
        .graph-controls { position: absolute; bottom: 35px; left: 10px; z-index: 50; display: flex; gap: 5px; align-items: center; } 
        .g-btn { background: rgba(0, 20, 0, 0.8); border: 1px solid #335533; color: #00ff00; font-size: 14px; width: 28px; height: 28px; display: flex; justify-content: center; align-items: center; cursor: pointer; border-radius: 4px; font-weight: bold; }
        .g-btn:active { background: #00ff00; color: black; }
        .g-reset { font-size: 10px; width: auto; padding: 0 8px; } 

        /* COMPACT LEGEND (REWORKED) */
        #map-legend {
            position: absolute; bottom: 15px; right: 15px; 
            display: flex; flex-direction: column; gap: 2px; pointer-events: none;
            z-index: 40; white-space: nowrap; opacity: 0.8;
            align-items: flex-end;
        }
        .legend-item {
            font-size: 8px; padding: 2px 4px; border-radius: 3px;
            font-weight: bold; font-family: 'Share Tech Mono';
            background: rgba(0, 0, 0, 0.4); border-left: 3px solid;
            backdrop-filter: blur(2px); width: fit-content;
        }
        
        /* FULLSCREEN TOGGLE BUTTON */
        .view-toggle-btn {
            position: absolute; top: 10px; right: 10px; z-index: 60;
            background: rgba(0,0,0,0.6); border: 1px solid var(--lime-main); color: var(--lime-main);
            width: 30px; height: 30px; border-radius: 4px;
            display: flex; justify-content: center; align-items: center;
            cursor: pointer; font-weight: bold; font-family: 'Orbitron';
        }
        .view-toggle-btn:hover { background: var(--lime-main); color: black; } 

        /* MAP FILTER OVERLAY */
        #map-filter-overlay {
            position: absolute; top: 10px; left: 50%; transform: translateX(-50%);
            z-index: 50; display: flex; gap: 5px;
            background: rgba(0, 20, 0, 0.8); padding: 4px; border-radius: 20px;
            border: 1px solid #335533; backdrop-filter: blur(4px);
        }
        .map-filter-btn {
            background: transparent; border: 1px solid transparent; color: #66aa66;
            font-size: 9px; font-weight: bold; padding: 4px 10px; border-radius: 12px;
            font-family: 'Orbitron'; cursor: pointer; transition: all 0.2s;
        }
        .map-filter-btn.active {
            background: var(--lime-main); color: black; box-shadow: 0 0 10px rgba(0, 255, 0, 0.4);
        } 

        /* HVT ROW STYLES */
        .hvt-row {
            display: flex; justify-content: space-between; align-items: center;
            padding: 10px; border-bottom: 1px solid #222; background: rgba(0,20,0,0.4);
            border-left: 3px solid #333; transition: all 0.2s;
        }
        .hvt-row:hover { background: rgba(0,50,0,0.6); border-left-color: var(--gold-hvt); }
        
        .hvt-row.inactive { opacity: 0.3; order: 99; pointer-events: none; } /* Pushes to bottom */
        
        .hvt-label { font-size: 11px; font-weight: bold; color: var(--gold-hvt); }
        .hvt-addr { font-size: 9px; font-family: monospace; color: #666; }
        .hvt-bal { font-family: 'Share Tech Mono'; color: var(--lime-main); font-size: 13px; text-shadow: 0 0 5px rgba(0,255,0,0.3); }
        .hvt-actions { display: flex; gap: 5px; margin-top: 4px; justify-content: flex-end; }
        .hvt-btn {
            font-size: 9px; padding: 2px 8px; background: #001100; border: 1px solid #004400; color: #008800; cursor: pointer;
        }
        .hvt-btn:hover { background: var(--lime-main); color: black; } 

        @media print {
            body * { visibility: hidden; }
            #intel-dashboard, #intel-dashboard * { visibility: visible; }
            #intel-dashboard { position: absolute; left: 0; top: 0; background: white; color: black; padding: 0; border: none; animation: none; box-shadow: none; }
            #intel-content { border: none; box-shadow: none; color: black; font-size: 10pt; font-family: 'Courier New', monospace; }
            #intel-nav, #intel-actions { display: none; }
        }

        /* ════════════════════════════════════════════════════════════════
           v16.6-live-ui-skin1 — LIVE UI SKIN (visual layer only)
           Overrides cascade over base rules. No logic, no IDs changed.
           Touches: stat strip · Mission Control · feature cards ·
           system status · bottom nav. Scanner/bridge/Brief untouched.
        ════════════════════════════════════════════════════════════════ */
        :root {
            --sw-panel:   linear-gradient(158deg, rgba(0,22,6,0.92) 0%, rgba(0,10,2,0.97) 100%);
            --sw-panel-2: linear-gradient(135deg, rgba(0,40,11,0.95) 0%, rgba(0,16,4,0.97) 100%);
            --sw-edge:    rgba(0,255,0,0.20);
            --sw-edge-hot:rgba(0,255,0,0.55);
            --sw-glow-s:  0 0 10px rgba(0,255,0,0.18);
            --sw-glow-m:  0 0 22px rgba(0,255,0,0.26);
            --sw-glow-l:  0 0 38px rgba(0,255,0,0.34);
            --sw-ink:     #c8f5c8;
            --sw-ink-dim: #7fb87f;
        }

        /* ── TOP STAT STRIP ─────────────────────────────────────────── */
        .stat-grid { gap: 9px; margin-bottom: 4px; }
        .stat-box {
            position: relative; overflow: hidden;
            background: var(--sw-panel);
            border: 1px solid var(--sw-edge);
            border-radius: 9px; padding: 9px 11px;
            box-shadow: inset 0 0 18px rgba(0,255,0,0.04), 0 6px 16px rgba(0,0,0,0.55);
        }
        .stat-box::before {
            content: ''; position: absolute; left: 0; top: 14%; bottom: 14%; width: 2px;
            background: linear-gradient(180deg, transparent, #00ff00 50%, transparent);
            box-shadow: 0 0 8px #00ff00; opacity: 0.85;
        }
        .stat-box::after {
            content: ''; position: absolute; top: 6px; right: 6px; width: 7px; height: 7px;
            border-top: 1px solid rgba(0,255,0,0.5); border-right: 1px solid rgba(0,255,0,0.5);
        }
        #price-box:hover { border-color: var(--sw-edge-hot); box-shadow: var(--sw-glow-m), 0 6px 16px rgba(0,0,0,0.55); }
        .price-text { font-size: 1.5rem; letter-spacing: 0.5px; }
        .label-text { font-size: 0.62rem; color: var(--sw-ink-dim); letter-spacing: 1.5px; }
        .source-tag { color: #2e7d2e; }
        #session-timer {
            background: rgba(0,14,3,0.82); border: 1px solid rgba(0,255,0,0.22);
            border-radius: 6px; padding: 3px 8px; opacity: 0.95;
            box-shadow: 0 0 10px rgba(0,255,0,0.12); backdrop-filter: blur(6px);
        }
        .glitch { font-size: 1.32rem; letter-spacing: 3px; }
        .subtitle { letter-spacing: 4px; color: var(--sw-ink-dim); }

        /* ── TACTICAL BAR (subtle premium) ──────────────────────────── */
        .tac-btn { border-radius: 9px; background: rgba(0,16,3,0.8); border-color: rgba(0,255,0,0.18); }
        .tac-btn:hover { box-shadow: var(--sw-glow-s); }
        #report-btn { letter-spacing: 1.5px; box-shadow: 0 0 8px rgba(0,255,0,0.25); }

        /* ── MISSION CONTROL SHELL ──────────────────────────────────── */
        #mc-wrap { padding: 16px 13px 92px 13px; }
        #mc-header {
            text-align: center; padding: 16px 12px 14px;
            border-bottom: 1px solid rgba(0,255,0,0.18); margin-bottom: 16px;
            position: relative;
        }
        #mc-header::after {
            content: ''; position: absolute; left: 50%; bottom: -1px; transform: translateX(-50%);
            width: 120px; height: 1px; background: #00ff00; box-shadow: 0 0 12px #00ff00;
        }
        #mc-title { font-size: 17px; letter-spacing: 4px; text-shadow: 0 0 16px rgba(0,255,0,0.55); }
        #mc-tagline { font-size: 11px; color: var(--sw-ink); line-height: 1.55; margin: 9px auto 0; max-width: 440px; opacity: 0.92; }
        #mc-mode-bar { gap: 12px; margin-top: 14px; }
        #mc-mode-label { font-size: 10px; letter-spacing: 2px; color: var(--sw-ink-dim); }
        #mc-mode-toggle-btn {
            background: rgba(0,28,0,0.9); border: 1px solid rgba(0,255,0,0.45); color: #00ff00;
            font-size: 10px; padding: 6px 14px; border-radius: 20px; letter-spacing: 1px;
            box-shadow: 0 0 8px rgba(0,255,0,0.15); transition: all 0.18s;
        }
        #mc-mode-toggle-btn:hover { background: #00ff00; color: #000; box-shadow: var(--sw-glow-s); }

        #mc-grid { gap: 11px; }

        /* ── FEATURE CARDS ──────────────────────────────────────────── */
        .mc-card {
            position: relative; overflow: hidden;
            background: var(--sw-panel);
            border: 1px solid var(--sw-edge); border-radius: 12px;
            padding: 14px 13px; gap: 8px;
            box-shadow: inset 0 0 22px rgba(0,255,0,0.03), 0 8px 20px rgba(0,0,0,0.5);
            transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
        }
        .mc-card:hover, .mc-card:active {
            transform: translateY(-2px);
            border-color: var(--sw-edge-hot);
            box-shadow: var(--sw-glow-m), 0 10px 24px rgba(0,0,0,0.55);
        }
        /* faint scanline texture for depth */
        .mc-card::after {
            content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0.5;
            background: repeating-linear-gradient(0deg, transparent 0 3px, rgba(0,255,0,0.018) 3px 4px);
        }
        .mc-card > * { position: relative; z-index: 1; }
        .mc-placeholder { border-style: solid; opacity: 1; }

        /* HUD icon box (replaces bare emoji) */
        .mc-icon-box {
            width: 40px; height: 40px; flex-shrink: 0;
            display: flex; align-items: center; justify-content: center;
            background: rgba(0,255,0,0.06); border: 1px solid rgba(0,255,0,0.32);
            border-radius: 10px; box-shadow: inset 0 0 12px rgba(0,255,0,0.08);
        }
        .mc-icon-box svg { width: 21px; height: 21px; stroke: #00ff00; stroke-width: 1.8;
            fill: none; filter: drop-shadow(0 0 3px rgba(0,255,0,0.5)); }
        .mc-card-top { display: flex; align-items: center; gap: 11px; }
        .mc-card-heading { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
        .mc-card-title { font-size: 11px; letter-spacing: 1.5px; text-shadow: 0 0 8px rgba(0,255,0,0.3); }
        .mc-card-desc { font-size: 11.5px; color: var(--sw-ink); line-height: 1.45; opacity: 0.9; }

        /* status badges */
        .mc-badge {
            display: inline-flex; align-items: center; gap: 4px; width: fit-content;
            font-family: 'Share Tech Mono', monospace; font-size: 8px; letter-spacing: 1.5px;
            padding: 2px 8px; border-radius: 20px; font-weight: 700; text-transform: uppercase;
        }
        .mc-badge::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; box-shadow: 0 0 5px currentColor; }
        .badge-live   { color: #00ff00; border: 1px solid rgba(0,255,0,0.5);  background: rgba(0,255,0,0.07); animation: sw-pulse 1.6s infinite; }
        .badge-ready  { color: #00ff00; border: 1px solid rgba(0,255,0,0.4);  background: rgba(0,255,0,0.05); }
        .badge-active { color: #00ffd0; border: 1px solid rgba(0,255,208,0.45); background: rgba(0,255,208,0.06); }
        .badge-synced { color: #66ddff; border: 1px solid rgba(102,221,255,0.45); background: rgba(102,221,255,0.06); }
        .badge-review { color: #ffd700; border: 1px solid rgba(255,215,0,0.5);  background: rgba(255,215,0,0.07); }
        @keyframes sw-pulse { 50% { opacity: 0.55; } }

        .mc-card-btn {
            margin-top: 4px; background: rgba(0,30,0,0.92);
            border: 1px solid rgba(0,255,0,0.5); color: #00ff00;
            font-size: 9px; letter-spacing: 1.5px; padding: 9px 6px; border-radius: 7px;
            transition: all 0.16s; font-weight: 700;
        }
        .mc-card-btn:hover, .mc-card-btn:active { background: #00ff00; color: #000; box-shadow: var(--sw-glow-s); }

        /* ── DAILY BRIEF HERO ───────────────────────────────────────── */
        .mc-card-featured {
            background: var(--sw-panel-2);
            border: 1.5px solid #00ff00; border-radius: 14px;
            padding: 18px 16px;
            box-shadow: var(--sw-glow-l), inset 0 0 30px rgba(0,255,0,0.05), 0 10px 28px rgba(0,0,0,0.55);
        }
        /* corner brackets */
        .mc-card-featured::before {
            content: ''; position: absolute; top: 8px; left: 8px; width: 16px; height: 16px;
            border-top: 2px solid #00ff00; border-left: 2px solid #00ff00; opacity: 0.8; z-index: 2;
        }
        .mc-hero-corner { position: absolute; bottom: 8px; right: 8px; width: 16px; height: 16px;
            border-bottom: 2px solid #00ff00; border-right: 2px solid #00ff00; opacity: 0.8; z-index: 2; }
        .mc-hero-top { display: flex; align-items: center; gap: 14px; }
        .mc-hero-icon {
            width: 52px; height: 52px; flex-shrink: 0;
            display: flex; align-items: center; justify-content: center;
            background: rgba(0,255,0,0.09); border: 1px solid rgba(0,255,0,0.5);
            border-radius: 12px; box-shadow: inset 0 0 16px rgba(0,255,0,0.12), 0 0 14px rgba(0,255,0,0.25);
        }
        .mc-hero-icon svg { width: 30px; height: 30px; stroke: #00ff00; stroke-width: 1.8; fill: none;
            filter: drop-shadow(0 0 5px rgba(0,255,0,0.6)); }
        .mc-hero-text { display: flex; flex-direction: column; gap: 4px; }
        .mc-hero-title { font-family: 'Orbitron', monospace; font-weight: 900; font-size: 15px; color: #00ff00;
            letter-spacing: 1.5px; line-height: 1.15; text-shadow: 0 0 14px rgba(0,255,0,0.55); }
        .mc-hero-sub { font-family: 'Share Tech Mono', monospace; font-size: 9.5px; color: var(--sw-ink-dim);
            letter-spacing: 1.5px; }
        .mc-btn-featured {
            margin-top: 14px; font-size: 11px; padding: 13px; letter-spacing: 3px;
            background: linear-gradient(180deg, rgba(0,80,0,0.55), rgba(0,40,0,0.85));
            border: 1px solid #00ff00; color: #00ff00;
            box-shadow: var(--sw-glow-s), inset 0 0 16px rgba(0,255,0,0.08);
        }
        .mc-btn-featured:hover, .mc-btn-featured:active { background: #00ff00; color: #000; box-shadow: var(--sw-glow-m); }

        /* ── SYSTEM STATUS CARD ─────────────────────────────────────── */
        #mc-sysstatus {
            position: relative; overflow: hidden; grid-column: 1 / -1;
            margin-top: 4px;
            background: var(--sw-panel); border: 1px solid var(--sw-edge);
            border-radius: 12px; padding: 14px 14px 16px;
            box-shadow: inset 0 0 22px rgba(0,255,0,0.03), 0 8px 20px rgba(0,0,0,0.5);
        }
        .sys-head { display: flex; justify-content: space-between; align-items: center;
            margin-bottom: 13px; padding-bottom: 9px; border-bottom: 1px solid rgba(0,255,0,0.14); }
        .sys-head-title { font-family: 'Orbitron', monospace; font-weight: 700; font-size: 11px;
            color: #00ff00; letter-spacing: 2px; text-shadow: 0 0 8px rgba(0,255,0,0.3); }
        .sys-head-state { font-family: 'Share Tech Mono', monospace; font-size: 8.5px; letter-spacing: 1.5px;
            color: #00ff00; opacity: 0.85; }
        .sys-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
        .sys-cell { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
        .sys-cell svg { width: 19px; height: 19px; stroke: #00ff00; stroke-width: 1.7; fill: none;
            filter: drop-shadow(0 0 3px rgba(0,255,0,0.45)); }
        .sys-name { font-family: 'Share Tech Mono', monospace; font-size: 7.5px; letter-spacing: 0.5px;
            color: var(--sw-ink-dim); line-height: 1.2; }
        .sys-state { font-family: 'Share Tech Mono', monospace; font-size: 8px; font-weight: 700;
            letter-spacing: 0.5px; color: #00ff00; text-shadow: 0 0 5px rgba(0,255,0,0.4); }
        .sys-state.cyan { color: #66ddff; text-shadow: 0 0 5px rgba(102,221,255,0.4); }

        /* ── BOTTOM NAV POLISH ──────────────────────────────────────── */
        .tab-bar { height: 56px; border-bottom: 1px solid rgba(0,255,0,0.25);
            background: linear-gradient(180deg, rgba(0,14,3,0.7), rgba(0,6,1,0.85)); }
        .tab-btn { gap: 3px; font-size: 8px; letter-spacing: 1px; color: #2e7d2e;
            border-right: 1px solid rgba(0,255,0,0.08); position: relative; transition: all 0.18s; }
        .tab-btn svg { width: 19px; height: 19px; transition: all 0.18s; }
        .tab-btn:hover { color: #66aa66; }
        .tab-btn.active {
            background: linear-gradient(180deg, rgba(0,40,0,0.55), rgba(0,18,0,0.4));
            color: #00ff00; border-bottom: none; text-shadow: 0 0 8px rgba(0,255,0,0.6);
        }
        .tab-btn.active::before {
            content: ''; position: absolute; top: 0; left: 12%; right: 12%; height: 2px;
            background: #00ff00; box-shadow: 0 0 10px #00ff00;
        }
        .tab-btn.active svg { stroke: #00ff00; stroke-width: 2; transform: translateY(-1px);
            filter: drop-shadow(0 0 4px #00ff00); }
        .tab-btn.hvt-active { color: var(--gold-hvt); }
        .tab-btn.hvt-active svg { stroke: var(--gold-hvt); }

        /* ── RESPONSIVE ─────────────────────────────────────────────── */
        @media (max-width: 899px) {
            #mc-grid { grid-template-columns: 1fr 1fr; }
            .mc-card-btn { padding: 11px 6px; }   /* larger tap targets */
            .tab-btn { font-size: 7.5px; }
        }
        @media (min-width: 900px) {
            /* Part 1 keeps the existing shell; only widen MC for readability. */
            #mc-grid { max-width: 760px; margin: 0 auto; grid-template-columns: 1fr 1fr 1fr; }
            .mc-card-featured, #mc-sysstatus { grid-column: 1 / -1; }
            #mc-tagline { max-width: 620px; }
        }

        /* ════════════════════════════════════════════════════════════════
           v16.6.1-live-ui-skin2 — LIVE-APP SKIN PASS (visual layer only)
           Premium HUD across LIVE · MAP · GRAPH · HVT · EVIDENCE · REPORT
           + deck/HUD integration. CSS-only; no IDs, handlers, canvas,
           scanner, bridge, or Brief blob touched. Reuses --sw-* tokens.
        ════════════════════════════════════════════════════════════════ */

        /* ── COMMAND DECK SHELL: rounded top shell + HUD scanline texture ── */
        #command-deck {
            border-top: 1px solid rgba(0,255,0,0.5);
            box-shadow: 0 -10px 44px rgba(0,0,0,0.85), 0 -1px 0 rgba(0,255,0,0.4),
                        inset 0 1px 16px rgba(0,255,0,0.06);
        }
        #command-deck::before {
            content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0; opacity: 0.55;
            background:
              repeating-linear-gradient(0deg, transparent 0 3px, rgba(0,255,0,0.014) 3px 4px),
              radial-gradient(130% 55% at 50% 0%, rgba(0,255,0,0.06), transparent 72%);
        }
        #command-deck > * { position: relative; z-index: 1; }

        /* ── TOP HUD ↔ DECK integration ── */
        #hud-top { border-bottom: 1px solid rgba(0,255,0,0.12); }

        /* generic premium section header (HVT + Evidence top bars) */
        #view-hvt > div:first-child,
        #view-case > div:first-child {
            background: linear-gradient(180deg, rgba(0,28,8,0.7), rgba(0,10,2,0.55)) !important;
            border-bottom: 1px solid rgba(0,255,0,0.28) !important;
            box-shadow: inset 0 -1px 12px rgba(0,255,0,0.05);
        }

        /* ════ LIVE FEED ════ */
        .filter-bar {
            background: linear-gradient(180deg, rgba(0,18,4,0.6), rgba(0,8,2,0.4));
            border-bottom: 1px solid rgba(0,255,0,0.22); padding: 9px 10px;
        }
        .filter-btn {
            background: rgba(0,22,4,0.85); border: 1px solid rgba(0,255,0,0.25);
            border-radius: 8px; color: #2e9d2e; box-shadow: inset 0 0 10px rgba(0,255,0,0.04);
            transition: all 0.18s;
        }
        .filter-btn:hover { border-color: rgba(0,255,0,0.55); color: #00ff00; box-shadow: var(--sw-glow-s); }
        .filter-btn.active { background: var(--lime-main); color: #000; box-shadow: var(--sw-glow-m); transform: scale(1.06); }
        .control-bar {
            background: linear-gradient(180deg, rgba(0,16,4,0.75), rgba(0,7,1,0.6));
            border-bottom: 1px solid rgba(0,255,0,0.18); padding: 8px 13px;
        }
        .pause-btn {
            background: rgba(0,30,0,0.9); border: 1px solid rgba(0,255,0,0.5); border-radius: 7px;
            box-shadow: 0 0 8px rgba(0,255,0,0.12); transition: all 0.16s; padding: 5px 14px;
        }
        .pause-btn:hover { box-shadow: var(--sw-glow-s); }
        #feed { padding: 8px 9px 44px; }

        /* transaction HUD cards */
        .tx-row {
            position: relative; margin: 0 0 9px; padding: 11px 12px 11px 15px;
            background: var(--sw-panel); border: 1px solid var(--sw-edge);
            border-bottom: 1px solid var(--sw-edge); border-radius: 11px;
            box-shadow: inset 0 0 18px rgba(0,255,0,0.03), 0 6px 16px rgba(0,0,0,0.45);
            transition: border-color 0.16s, box-shadow 0.16s, transform 0.16s;
            gap: 6px;
        }
        .tx-row::before {   /* left neon accent rail */
            content: ''; position: absolute; left: 0; top: 10%; bottom: 10%; width: 3px;
            border-radius: 3px; background: linear-gradient(180deg, transparent, #00ff00 50%, transparent);
            box-shadow: 0 0 8px #00ff00;
        }
        .tx-row:hover { border-color: var(--sw-edge-hot); box-shadow: var(--sw-glow-s), 0 8px 18px rgba(0,0,0,0.5); transform: translateX(2px); }
        .tx-row .row-top .text-shadow-lime { font-size: 16px; font-weight: 800; color: #d8ffd8;
            text-shadow: 0 0 12px rgba(0,255,0,0.5); letter-spacing: 0.3px; }
        .tx-row .text-gray-400 { color: #8fbf8f !important; }
        .tx-row .text-gray-500 { color: #5f8f5f !important; }
        /* failed variant: red-tinted rail */
        .tx-row.tx-failed { opacity: 0.62; border-color: rgba(255,80,80,0.25); background: linear-gradient(158deg, rgba(22,6,6,0.9), rgba(10,2,2,0.95)); }
        .tx-row.tx-failed::before { background: linear-gradient(180deg, transparent, #ff5555 50%, transparent); box-shadow: 0 0 8px #ff5555; }

        /* premium tag pills */
        .tag-pill { border-radius: 20px; padding: 2px 9px; font-size: 8.5px; letter-spacing: 1px;
            border-width: 1px; }
        .tag-hvt { background: rgba(68,51,0,0.6); box-shadow: 0 0 8px rgba(255,215,0,0.45); }
        .tag-l2  { background: rgba(0,51,68,0.6); box-shadow: 0 0 7px rgba(0,255,255,0.3); }
        .tag-trust { box-shadow: 0 0 7px rgba(0,255,0,0.35); }

        /* action chips */
        .btn-row { gap: 7px; margin-top: 7px; }
        .action-btn {
            border-radius: 7px; padding: 8px 0; font-size: 9.5px; letter-spacing: 1px;
            background: rgba(0,26,0,0.9); border: 1px solid rgba(0,255,0,0.4); color: #2e9d2e;
            transition: all 0.15s;
        }
        .action-btn:hover { background: var(--lime-main); color: #000; box-shadow: var(--sw-glow-s); }
        .action-btn.trace-btn { border-color: rgba(0,255,255,0.5); color: #5fd8d8; }
        .action-btn.trace-btn:hover { background: var(--info-cyan); color: #000; box-shadow: 0 0 12px rgba(0,255,255,0.4); }

        /* ════ GRAPH ════ */
        #view-graph::after, #view-map::after {   /* canvas frame overlay (no geometry change) */
            content: ''; position: absolute; inset: 8px; pointer-events: none; z-index: 5;
            border: 1px solid rgba(0,255,0,0.22); border-radius: 12px;
            box-shadow: inset 0 0 48px rgba(0,255,0,0.05), inset 0 0 0 1px rgba(0,255,0,0.04);
        }
        #graph-input {
            background: rgba(0,12,2,0.92) !important; border: 1px solid rgba(0,255,0,0.45) !important;
            border-radius: 8px !important; padding: 8px 12px !important; width: 210px !important;
            color: #d8ffd8 !important; box-shadow: inset 0 0 12px rgba(0,255,0,0.06), 0 0 10px rgba(0,255,0,0.12) !important;
        }
        #graph-input::placeholder { color: #4e8e4e; }
        button[onclick="manualGraphTrace()"] {
            background: linear-gradient(180deg, rgba(0,70,0,0.6), rgba(0,34,0,0.85)) !important;
            border: 1px solid #00ff00 !important; border-radius: 8px !important; color: #00ff00 !important;
            padding: 0 16px !important; letter-spacing: 2px !important;
            box-shadow: var(--sw-glow-s), inset 0 0 12px rgba(0,255,0,0.08) !important;
        }
        button[onclick="manualGraphTrace()"]:hover { background: #00ff00 !important; color: #000 !important; box-shadow: var(--sw-glow-m) !important; }
        .graph-controls { gap: 6px; }
        .g-btn {
            background: rgba(0,18,2,0.9); border: 1px solid rgba(0,255,0,0.4); color: #00ff00;
            border-radius: 8px; box-shadow: inset 0 0 8px rgba(0,255,0,0.05); transition: all 0.15s;
        }
        .g-btn:hover { border-color: #00ff00; box-shadow: var(--sw-glow-s); }
        .g-btn:active, .g-btn.g-reset:active { background: var(--lime-main); color: #000; }

        /* ════ MAP ════ */
        #map-filter-overlay {
            background: rgba(0,14,3,0.85); border: 1px solid rgba(0,255,0,0.35);
            box-shadow: var(--sw-glow-s); padding: 5px;
        }
        .map-filter-btn { color: #66bb66; border-radius: 14px; }
        .map-filter-btn:hover { color: #00ff00; }
        .map-filter-btn.active { background: var(--lime-main); color: #000; box-shadow: var(--sw-glow-s); }
        #map-legend { gap: 4px; opacity: 0.92; }
        .legend-item {
            font-size: 8.5px; padding: 3px 8px; border-radius: 14px;
            background: rgba(0,8,2,0.78); border: 1px solid; border-left-width: 3px;
            box-shadow: 0 0 8px rgba(0,0,0,0.5); letter-spacing: 0.5px;
        }
        .view-toggle-btn {
            background: rgba(0,14,3,0.82); border: 1px solid rgba(0,255,0,0.45);
            border-radius: 8px; box-shadow: var(--sw-glow-s); transition: all 0.16s;
        }
        .view-toggle-btn:hover { background: var(--lime-main); color: #000; box-shadow: var(--sw-glow-m); }

        /* ════ HVT / WATCHLIST ════ */
        #hvt-addr-input, #hvt-tag-input {
            background: rgba(0,8,2,0.9) !important; border: 1px solid rgba(255,215,0,0.45) !important;
            border-radius: 7px !important; padding: 7px 10px !important;
            box-shadow: inset 0 0 10px rgba(255,215,0,0.05) !important;
        }
        button[onclick="addManualHVT()"] {
            background: linear-gradient(180deg, rgba(80,64,0,0.55), rgba(40,30,0,0.8)) !important;
            border: 1px solid var(--gold-hvt) !important; border-radius: 7px !important;
            box-shadow: 0 0 10px rgba(255,215,0,0.2) !important; letter-spacing: 1px !important;
        }
        button[onclick="addManualHVT()"]:hover { background: var(--gold-hvt) !important; color: #000 !important; }
        button[onclick="exportHVTList()"] { border-radius: 7px !important; border-color: rgba(255,215,0,0.4) !important; }
        /* HVT watchlist alert cards */
        .hvt-row {
            position: relative; margin: 0 9px 9px; padding: 12px 13px;
            background: linear-gradient(158deg, rgba(26,20,0,0.78), rgba(10,7,0,0.92));
            border: 1px solid rgba(255,215,0,0.28); border-bottom: 1px solid rgba(255,215,0,0.28);
            border-left: 3px solid var(--gold-hvt); border-radius: 11px;
            box-shadow: inset 0 0 18px rgba(255,215,0,0.04), 0 6px 16px rgba(0,0,0,0.45);
            transition: all 0.16s;
        }
        .hvt-row:hover { border-color: rgba(255,215,0,0.55); box-shadow: 0 0 18px rgba(255,215,0,0.18), 0 8px 18px rgba(0,0,0,0.5); transform: translateX(2px); }
        .hvt-label { font-size: 12px; text-shadow: 0 0 8px rgba(255,215,0,0.35); }
        .hvt-addr { color: #9a8a4a; }
        .hvt-bal { font-size: 14px; font-weight: 700; }
        .hvt-actions { gap: 6px; margin-top: 6px; }
        .hvt-btn {
            border-radius: 7px; padding: 5px 12px; font-size: 9.5px; letter-spacing: 1px;
            background: rgba(40,30,0,0.85); border: 1px solid rgba(255,215,0,0.45); color: #d8c060;
            transition: all 0.15s;
        }
        .hvt-btn:hover { background: var(--gold-hvt); color: #000; box-shadow: 0 0 10px rgba(255,215,0,0.4); }

        /* ════ EVIDENCE LOCKER ════ */
        #case-list { padding: 10px 9px 44px; }
        #case-list > div {   /* case cards (built with tailwind classes; id-scoped wins) */
            position: relative; margin-bottom: 9px !important; padding: 12px 13px !important;
            background: linear-gradient(158deg, rgba(26,20,0,0.78), rgba(10,7,0,0.92)) !important;
            border: 1px solid rgba(255,215,0,0.3) !important; border-left: 3px solid var(--gold-hvt) !important;
            border-radius: 11px !important;
            box-shadow: inset 0 0 16px rgba(255,215,0,0.04), 0 6px 16px rgba(0,0,0,0.45) !important;
            transition: all 0.16s;
        }
        #case-list > div:hover { border-color: rgba(255,215,0,0.6) !important; box-shadow: 0 0 16px rgba(255,215,0,0.18), 0 8px 18px rgba(0,0,0,0.5) !important; transform: translateX(2px); }
        #case-list > div .text-yellow-400 { font-size: 13px; text-shadow: 0 0 8px rgba(255,215,0,0.3); }
        button[onclick="exportCasesJSON()"] {
            border-radius: 8px !important; border: 1px solid rgba(0,255,0,0.5) !important;
            box-shadow: 0 0 8px rgba(0,255,0,0.15) !important; padding: 5px 14px !important; letter-spacing: 1px !important;
        }
        button[onclick="exportCasesJSON()"]:hover { background: var(--lime-main) !important; color: #000 !important; }
        button[onclick="clearCases()"] {
            background: linear-gradient(180deg, rgba(60,0,0,0.45), rgba(26,0,0,0.7)) !important;
            border-top: 1px solid rgba(255,80,80,0.4) !important;
        }
        button[onclick="clearCases()"]:hover { background: rgba(120,0,0,0.4) !important; color: #ff8888 !important; }

        /* ════ REPORT / SESSION ════ */
        #report-header {
            background: linear-gradient(180deg, rgba(0,34,0,0.7), rgba(0,14,0,0.5));
            border-bottom: 1px solid rgba(0,255,0,0.28); padding: 9px 12px;
            color: #66cc66; letter-spacing: 1.5px; text-shadow: 0 0 6px rgba(0,255,0,0.25);
        }
        .report-row {
            margin: 0 9px 7px; padding: 11px 12px;
            background: var(--sw-panel); border: 1px solid var(--sw-edge);
            border-bottom: 1px solid var(--sw-edge); border-radius: 10px;
            box-shadow: inset 0 0 14px rgba(0,255,0,0.025), 0 5px 14px rgba(0,0,0,0.4);
            transition: all 0.14s;
        }
        .report-row:hover { border-color: var(--sw-edge-hot); box-shadow: var(--sw-glow-s); background: rgba(0,22,6,0.95); }
        .rep-val-green { font-size: 13px; text-shadow: 0 0 8px rgba(0,255,0,0.35); }
        .rep-val-white { color: #e6ffe6; opacity: 0.92; }
        .rep-val-dim { color: #5a8a5a; }

        /* ── responsive: keep desktop intact, tune phone density ── */
        @media (max-width: 899px) {
            .tx-row, .hvt-row, .report-row, #case-list > div { margin-left: 6px; margin-right: 6px; }
        }
        @media (min-width: 900px) {
            #feed, #hvt-list, #report-list, #case-list { max-width: 920px; margin-left: auto; margin-right: auto; }
        }

        /* ════════════════════════════════════════════════════════════════
           v16.6.2-module-screen-rebuild1 — MODULE SCREEN SYSTEM (visual)
           Mission Control = launcher; each tool = full-screen mobile module;
           bottom dock (7) pinned to base. CSS + safe wrappers only. No
           scanner/canvas/bridge/Brief logic touched; switchView already
           resizes map/graph on entry. All view IDs + functions preserved.
        ════════════════════════════════════════════════════════════════ */

        /* ── MOBILE: flex-flow app shell (header → content → dock) ── */
        @media (max-width: 899px) {
            body { display: flex; flex-direction: column; height: 100dvh; }

            #hud-top {
                position: relative; inset: auto; flex: 0 0 auto; z-index: 21;
                padding-top: max(12px, env(safe-area-inset-top)); padding-bottom: 4px;
                display: flex; flex-direction: column;
            }
            .header-section { order: 1; padding-bottom: 3px; }   /* title above chips, like concept */
            .stat-grid { order: 2; }
            .tactical-bar { display: none; }                     /* relocated into MENU */
            #session-timer { top: max(6px, env(safe-area-inset-top)); }

            #hud-bottom {
                position: relative; inset: auto; height: auto;
                flex: 1 1 auto; min-height: 0; z-index: 22;
            }
            #command-deck { border-radius: 14px 14px 0 0; }

            /* active view fills the area above the dock and scrolls */
            .view-panel.active { flex: 1 1 auto; height: auto; min-height: 0; }

            /* dock moves to the BOTTOM of the deck (was at top) */
            .tab-bar { order: 99; border-top: 1px solid rgba(0,255,0,0.32); border-bottom: none;
                       padding-bottom: env(safe-area-inset-bottom); }
            .view-toggle-btn { display: none; }                  /* maximize obsolete here */

            /* TOOL screens take the whole screen → hide the big header */
            body:has(#view-live.active)   #hud-top,
            body:has(#view-map.active)    #hud-top,
            body:has(#view-graph.active)  #hud-top,
            body:has(#view-hvt.active)    #hud-top,
            body:has(#view-case.active)   #hud-top,
            body:has(#view-report.active) #hud-top { display: none; }

            #mc-wrap { padding-bottom: 26px; }                   /* dock no longer overlaps content */

            /* full-screen overlays for Resolver / Discovery / Menu */
            #wallet-resolver-modal, #discovery-inbox-modal { padding: 0 !important; align-items: stretch !important; }
            #wallet-resolver-modal > div, #discovery-inbox-modal > div {
                width: 100vw !important; max-width: 100vw !important;
                height: 100dvh !important; max-height: none !important;
                border-radius: 0 !important; border-left: none !important; border-right: none !important;
            }
            /* map/graph: nudge existing canvas overlays below the floating header */
            #view-map #map-filter-overlay { top: 54px; }
            #view-graph > div:has(#graph-input) { top: 58px !important; }
        }

        /* ── SLIM MODULE HEADER (back + title) — all screens ── */
        .mod-head {
            display: flex; align-items: center; gap: 10px; flex-shrink: 0;
            min-height: 46px; padding: 10px 12px;
            background: linear-gradient(180deg, rgba(0,26,7,0.94), rgba(0,10,2,0.82));
            border-bottom: 1px solid rgba(0,255,0,0.3);
            box-shadow: 0 2px 14px rgba(0,0,0,0.5), inset 0 -1px 10px rgba(0,255,0,0.05);
        }
        .mod-back {
            width: 32px; height: 32px; flex-shrink: 0; border-radius: 8px; cursor: pointer;
            background: rgba(0,28,0,0.9); border: 1px solid rgba(0,255,0,0.45); color: #00ff00;
            font-size: 22px; line-height: 1; display: flex; align-items: center; justify-content: center;
            transition: all 0.15s; -webkit-tap-highlight-color: transparent;
        }
        .mod-back:hover, .mod-back:active { background: #00ff00; color: #000; box-shadow: var(--sw-glow-s); }
        .mod-title { font-family: 'Orbitron', monospace; font-weight: 800; font-size: 12.5px; color: #00ff00;
            letter-spacing: 2px; text-shadow: 0 0 10px rgba(0,255,0,0.45); }
        .mod-head.gold { border-bottom-color: rgba(255,215,0,0.35); }
        .mod-head.gold .mod-back { border-color: rgba(255,215,0,0.5); color: var(--gold-hvt); }
        .mod-head.gold .mod-back:hover { background: var(--gold-hvt); color: #000; box-shadow: 0 0 10px rgba(255,215,0,0.4); }
        .mod-head.gold .mod-title { color: var(--gold-hvt); text-shadow: 0 0 10px rgba(255,215,0,0.4); }
        /* map/graph: header floats over canvas (no geometry shift) */
        #view-map > .mod-head, #view-graph > .mod-head {
            position: absolute; top: 0; left: 0; right: 0; z-index: 70;
            background: linear-gradient(180deg, rgba(0,10,2,0.94), rgba(0,10,2,0.35));
        }

        /* ── MENU full-screen overlay ── */
        #menu-modal { display: none; }
        .menu-head {
            display: flex; align-items: center; justify-content: space-between; flex-shrink: 0;
            padding: 14px 16px; padding-top: max(14px, env(safe-area-inset-top));
            border-bottom: 1px solid rgba(0,255,0,0.3);
            background: linear-gradient(180deg, rgba(0,26,7,0.95), rgba(0,8,1,0.8));
        }
        .menu-title { font-family: 'Orbitron', monospace; font-weight: 800; font-size: 14px; color: #00ff00;
            letter-spacing: 4px; text-shadow: 0 0 12px rgba(0,255,0,0.5); }
        .menu-close { background: rgba(0,24,0,0.85); border: 1px solid rgba(0,255,0,0.4); color: #66aa66;
            width: 34px; height: 34px; border-radius: 8px; font-size: 16px; cursor: pointer; }
        .menu-close:hover { color: #00ff00; border-color: #00ff00; }
        .menu-body { flex: 1; overflow-y: auto; padding: 14px 14px calc(20px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 9px; }
        .menu-sec { font-family: 'Share Tech Mono', monospace; font-size: 9px; color: #4e8e4e; letter-spacing: 2px;
            margin: 8px 2px 2px; }
        .menu-item {
            display: flex; align-items: center; gap: 13px; width: 100%; text-align: left; cursor: pointer;
            padding: 13px; border-radius: 11px; transition: all 0.15s;
            background: var(--sw-panel); border: 1px solid var(--sw-edge);
            box-shadow: inset 0 0 16px rgba(0,255,0,0.03), 0 6px 14px rgba(0,0,0,0.4);
        }
        .menu-item:hover, .menu-item:active { border-color: var(--sw-edge-hot); box-shadow: var(--sw-glow-s); transform: translateX(2px); }
        .menu-ico { width: 40px; height: 40px; flex-shrink: 0; border-radius: 10px;
            display: flex; align-items: center; justify-content: center;
            background: rgba(0,255,0,0.06); border: 1px solid rgba(0,255,0,0.32); }
        .menu-ico svg { width: 20px; height: 20px; stroke: #00ff00; stroke-width: 1.8; fill: none;
            filter: drop-shadow(0 0 3px rgba(0,255,0,0.5)); }
        .menu-item > span:nth-child(2) { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
        .menu-item b { font-family: 'Orbitron', monospace; font-size: 11px; color: #00ff00; letter-spacing: 1px; }
        .menu-item i { font-style: normal; font-size: 10.5px; color: var(--sw-ink-dim); line-height: 1.35; }
        .menu-arr { color: #2e7d2e; font-size: 18px; }
        .menu-item.util .menu-ico { background: rgba(255,215,0,0.05); border-color: rgba(255,215,0,0.3); }
        .menu-item.util .menu-ico svg { stroke: var(--gold-hvt); filter: drop-shadow(0 0 3px rgba(255,215,0,0.4)); }
        .menu-item.util b { color: #d8c060; }

        /* ════ v16.6.4-top-header-match1 — concept-matched top header ════ */
        .header-section { text-align: left; padding-bottom: 8px; }
        .hdr-row { display: flex; align-items: center; gap: 11px; }
        .hdr-logo { flex-shrink: 0; line-height: 0; }
        .hdr-logo svg { width: 44px; height: 44px; filter: drop-shadow(0 0 8px rgba(0,255,0,0.5)); }
        .hdr-text { flex: 1; min-width: 0; text-align: left; }
        .hdr-brand { font-family: 'Orbitron', monospace; font-size: 11px; font-weight: 700; color: #00ff00; letter-spacing: 5px; line-height: 1; opacity: 0.85; }
        .header-section .glitch { font-size: 1.45rem; line-height: 1.04; letter-spacing: 2px; margin: -6px 0 0; }
        .header-section .subtitle { font-size: 0.6rem; letter-spacing: 2.5px; color: #5a9a5a; opacity: 0.9; }
        .hdr-bell { position: relative; flex-shrink: 0; width: 40px; height: 40px; border-radius: 10px;
            background: rgba(0,20,0,0.85); border: 1px solid rgba(0,255,0,0.4); color: #00ff00; cursor: pointer;
            display: flex; align-items: center; justify-content: center; transition: all 0.15s; }
        .hdr-bell svg { width: 19px; height: 19px; stroke-width: 1.8; }
        .hdr-bell:hover, .hdr-bell:active { background: #00ff00; color: #000; box-shadow: var(--sw-glow-s); }
        .hdr-bell-dot { position: absolute; top: 8px; right: 9px; width: 7px; height: 7px; border-radius: 50%;
            background: #00ff00; box-shadow: 0 0 6px #00ff00; display: none; }
        body:has(#alert-toggle.tac-active) .hdr-bell-dot { display: block; }
        .stat-grid { display: flex; gap: 0; margin-bottom: 0; padding: 0;
            background: rgba(0,12,2,0.62); border: 1px solid rgba(0,255,0,0.16); border-radius: 11px; overflow: hidden;
            box-shadow: inset 0 0 18px rgba(0,255,0,0.03), 0 5px 14px rgba(0,0,0,0.45); }
        .stat-cell { flex: 1; min-width: 0; padding: 5px 6px; border-left: 1px solid rgba(0,255,0,0.1);
            display: flex; flex-direction: column; gap: 1px; }
        .stat-cell.cell-conn { flex: 0.7; }
        .stat-cell.cell-uptime { flex: 1.3; }
        .stat-cell:first-child { border-left: none; }
        .cell-label { font-family: 'Share Tech Mono', monospace; font-size: 7px; letter-spacing: 0.5px; color: #5a8a5a;
            white-space: nowrap; display: flex; align-items: center; gap: 3px; }
        .cell-val { font-family: 'Share Tech Mono', monospace; font-size: 0.82rem; font-weight: 700; color: #d8ffd8;
            line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .cell-sub { font-family: 'Share Tech Mono', monospace; font-size: 6.5px; letter-spacing: 0.5px; color: #4e7e4e; white-space: nowrap; }
        .stat-cell-btn { cursor: pointer; transition: background 0.15s; }
        .stat-cell-btn:hover, .stat-cell-btn:active { background: rgba(0,255,0,0.07); }
        .cell-chart { width: 10px; height: 10px; stroke-width: 2.4; opacity: 0.9; }
        .conn-val { display: flex; align-items: center; gap: 5px; }
        .conn-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; background: #4a3a00; box-shadow: 0 0 4px rgba(255,170,0,0.35); }
        .conn-state { color: #cfeccf; }
        body:has(#status-text.text-green-500) .conn-dot { background: #00ff00; box-shadow: 0 0 8px #00ff00; animation: sw-pulse 1.6s infinite; }
        body:has(#status-text.text-green-500) .conn-state { color: #00ff00; }
        body:has(#status-text.text-yellow-500) .conn-dot { background: #ffaa00; box-shadow: 0 0 6px #ffaa00; animation: none; }
        body:has(#status-text.text-yellow-500) .conn-state { color: #ffaa00; }
        #session-timer { position: static; top: auto; right: auto; opacity: 1; z-index: auto;
            font-family: 'Share Tech Mono', monospace; font-size: 0.82rem; font-weight: 700; color: #d8ffd8; text-shadow: none; letter-spacing: 0; text-align: center; }
        @media (max-width: 899px) { .header-section .glitch { font-size: 1.4rem; } }
        /* ════ v16.6.5-home-fit1 — self-contained no-scroll home screen ════ */
        .mc-card-featured { display: flex; flex-direction: row; align-items: center; gap: 12px; padding: 10px 13px; cursor: pointer; }
        .mc-card-featured .mc-hero-icon { width: 38px; height: 38px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
        .mc-card-featured .mc-hero-icon svg { width: 26px; height: 26px; }
        .mc-card-featured .mc-hero-text { flex: 1; min-width: 0; }
        .mc-hero-title { font-size: 0.92rem; line-height: 1.05; margin: 0; }
        .mc-hero-sub { font-size: 8px; letter-spacing: 0.5px; margin-top: 3px; }
        .mc-hero-arrow { flex-shrink: 0; font-size: 1.5rem; line-height: 1; color: #00ff00; opacity: 0.85; }
        .mc-card { position: relative; padding: 9px 10px; gap: 4px; cursor: pointer; overflow: hidden; min-height: 0; }
        .mc-card .mc-card-top { gap: 8px; align-items: center; }
        .mc-card .mc-icon-box { width: 30px; height: 30px; flex-shrink: 0; }
        .mc-card .mc-icon-box svg { width: 17px; height: 17px; }
        .mc-card-title { font-size: 0.7rem; line-height: 1.1; }
        .mc-badge { font-size: 6px; padding: 1px 4px; }
        .mc-card-desc { font-size: 9.5px; line-height: 1.25; color: #6a9a6a; opacity: 0.92; flex-grow: 0;
            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding-right: 16px; }
        .mc-card-arrow { position: absolute; right: 8px; bottom: 6px; font-size: 1.05rem; line-height: 1; color: #00ff00; opacity: 0.75; }
        #mc-sysstatus { padding: 8px 10px; }
        #mc-sysstatus .sys-head { margin-bottom: 6px; }
        #mc-sysstatus .sys-head-title { font-size: 9px; }
        #mc-sysstatus .sys-head-state { font-size: 8px; }
        #mc-sysstatus .sys-grid { gap: 4px; }
        #mc-sysstatus .sys-cell svg { width: 16px; height: 16px; }
        #mc-sysstatus .sys-name { font-size: 6px; margin-top: 2px; }
        #mc-sysstatus .sys-state { font-size: 7px; }
        @media (max-width: 899px) {
            #view-home.active { display: flex; flex-direction: column; overflow: hidden; padding: 8px 9px 6px; }
            #view-home #mc-wrap { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; gap: 6px; }
            #view-home #mc-grid { display: grid; grid-template-columns: 1fr 1fr;
                grid-template-rows: auto 1fr 1fr 1fr 1fr auto; gap: 6px; flex: 1 1 auto; min-height: 0; }
            #view-home .mc-card-featured, #view-home #mc-sysstatus { grid-column: 1 / -1; }
        }
        /* ════ v16.6.6-gold-pulse1 — gold-outline pulsing menu buttons ════ */
        @keyframes mcGoldPulse {
            0%, 100% { border-color: rgba(255,190,0,0.45); box-shadow: 0 0 3px rgba(255,190,0,0.20), inset 0 0 5px rgba(255,190,0,0.04); }
            50%      { border-color: rgba(255,215,0,0.95); box-shadow: 0 0 13px rgba(255,200,0,0.55), inset 0 0 9px rgba(255,200,0,0.10); }
        }
        #view-home #mc-grid .mc-card:not(.mc-card-featured) {
            border: 1px solid rgba(255,200,0,0.6);
            animation: mcGoldPulse 2.4s ease-in-out infinite;
        }
        #view-home #mc-grid .mc-card:not(.mc-card-featured) .mc-card-title { color: #00ff00; text-shadow: 0 0 6px rgba(0,255,0,0.45); }
        #view-home #mc-grid .mc-card:not(.mc-card-featured) .mc-card-arrow { color: #00ff00; }
        #view-home #mc-grid .mc-card:nth-of-type(odd)  { animation-delay: 0s; }
        #view-home #mc-grid .mc-card:nth-of-type(even) { animation-delay: 0.8s; }
        @media (prefers-reduced-motion: reduce) {
            #view-home #mc-grid .mc-card:not(.mc-card-featured) { animation: none; border-color: rgba(255,200,0,0.75); box-shadow: 0 0 6px rgba(255,190,0,0.35); }
        }
        /* ════ v16.6.7-fill-tighten1 — grid truly fills deck (no dead space) + tighter brief/status ════ */
        @media (max-width: 899px) {
            /* make #view-home ITSELF the grid: a direct flex child with a resolved height,
               so the 1fr rows fill instead of collapsing two levels deep */
            #view-home.active {
                display: grid;
                grid-template-columns: 1fr 1fr;
                /* v16.7.3: rows grow to fit content (min) but still stretch to fill the deck (1fr max),
                   so two-line card titles + status badges are never clipped. Scrolls only if it truly
                   can't fit, instead of cutting buttons off at the bottom. */
                grid-template-rows: auto minmax(auto, 1fr) minmax(auto, 1fr) minmax(auto, 1fr) minmax(auto, 1fr) auto;
                gap: 6px;
                flex: 1 1 0;
                min-height: 0;
                overflow-y: auto;
                overflow-x: hidden;
                padding: 4px 9px 6px;
                align-content: stretch;
            }
            #view-home #mc-wrap, #view-home #mc-grid { display: contents; }
            #view-home .mc-card-featured, #view-home #mc-sysstatus { grid-column: 1 / -1; }

            /* Daily Brief: one short line */
            .mc-card-featured { padding: 6px 12px; gap: 10px; }
            .mc-card-featured .mc-hero-icon { width: 32px; height: 32px; }
            .mc-card-featured .mc-hero-icon svg { width: 22px; height: 22px; }
            .mc-hero-title { font-size: 0.62rem; letter-spacing: 0.5px; line-height: 1.05; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
            .mc-hero-sub { font-size: 7px; letter-spacing: 0.4px; margin-top: 2px; }
            .mc-hero-arrow { font-size: 1.3rem; }

            /* System Status: smaller, so the middle buttons get the height */
            #mc-sysstatus { padding: 3px 10px; }
            #mc-sysstatus .sys-head { margin-bottom: 2px; }
            #mc-sysstatus .sys-head-title { font-size: 8px; }
            #mc-sysstatus .sys-head-state { font-size: 7px; }
            #mc-sysstatus .sys-grid { gap: 3px; }
            #mc-sysstatus .sys-cell svg { width: 11px; height: 11px; }
            #mc-sysstatus .sys-name { font-size: 5.5px; margin-top: 1px; }
            #mc-sysstatus .sys-state { font-size: 6.5px; }
        }
        /* ════ v16.6.8-header-title2 — XRPMAN PRESENTS + one-word SHADOWWATCH (big leading S·H) ════ */
        .hdr-big { font-size: 1.3em; }
        .header-section .glitch { line-height: 1.12; }
        /* ════ v16.6.9-header-fit1 — brand+bell on top line, SHADOWWATCH full-width (no bell collision), bigger S·H ════ */
        .hdr-topline { display: flex; align-items: center; gap: 8px; }
        .hdr-topline .hdr-bell { margin-left: auto; }
        .hdr-big { font-size: 1.5em; }
        .header-section .glitch { white-space: nowrap; }
        /* ════ v16.6.10-header-center1 — centered XRPMAN PRESENTS over big SHADOWWATCH (first+last letters big) ════ */
        .hdr-row { position: relative; display: block; text-align: center; }
        .hdr-logo { position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
        .hdr-logo svg { width: 36px; height: 36px; }
        .hdr-bell { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
        .hdr-text { text-align: center; padding: 0 44px; min-width: 0; }
        .hdr-brand { font-size: 9px; letter-spacing: 4px; text-align: center; }
        .header-section .glitch { text-align: center; white-space: nowrap; }
        .hdr-big { font-size: 1.5em; }
        /* ════ v16.6.11-header-toprow1 — logo + centered XRPMAN PRESENTS + bell on one row; SHADOWWATCH full-width below ════ */
        .hdr-toprow { display: flex; align-items: center; gap: 8px; margin-bottom: 1px; }
        .hdr-toprow .hdr-logo { position: static; transform: none; flex-shrink: 0; line-height: 0; }
        .hdr-toprow .hdr-logo svg { width: 30px; height: 30px; }
        .hdr-toprow .hdr-brand { position: static; flex: 1 1 auto; min-width: 0; text-align: center; font-size: 9px; letter-spacing: 4px; }
        .hdr-toprow .hdr-bell { position: static; transform: none; flex-shrink: 0; width: 34px; height: 34px; }
        .hdr-toprow .hdr-bell svg { width: 17px; height: 17px; }
        .header-section .glitch { text-align: center; white-space: nowrap; }
        .hdr-big { font-size: 1.5em; }

        /* ════ v16.6.13-ai-strip-novideo — header control cluster (fix bell/title crowding) + XRPMan AI typewriter strip + splash typed greeter & command-card (no video) ════ */
        /* keep the bell in a tidy right cluster so it never crowds the SHADOWWATCH title */
        .hdr-toprow { min-height: 22px; margin-bottom: 0; }
        .hdr-ctrls { display: flex; align-items: center; gap: 6px; flex-shrink: 0; margin-left: auto; }
        .hdr-toprow .hdr-bell { width: 30px; height: 30px; border-radius: 8px; }
        .hdr-toprow .hdr-bell svg { width: 15px; height: 15px; }
        .header-section { padding-top: 2px; }
        /* true-center XRPMAN PRESENTS: equal side tracks, auto center column, no overlap with bell/chip */
        .hdr-toprow { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 6px; }
        .hdr-toprow .hdr-logo { justify-self: start; }
        .hdr-toprow .hdr-brand { justify-self: center; flex: none; }
        .hdr-ctrls { justify-self: end; margin-left: 0; }

        /* ════ XRPMAN AI ASSISTANT STRIP — top-of-app, typewriter, reacts to every action, talks to the Commander ════ */
        #xrpman-strip { position: relative; overflow: hidden; margin: 6px 0 1px; padding: 9px 12px; border-radius: 10px;
            background: linear-gradient(135deg, rgba(0,20,0,0.95) 0%, rgba(0,40,10,0.85) 50%, rgba(0,20,0,0.95) 100%);
            border: 1px solid rgba(0,255,0,0.4);
            box-shadow: 0 2px 18px rgba(0,255,0,0.15), inset 0 -1px 0 rgba(0,255,0,0.25); }
        #xrpman-strip .xrp-scan { position: absolute; top: 0; left: 0; right: 0; height: 1px; pointer-events: none;
            background: linear-gradient(90deg, transparent, #00ff00, transparent); background-size: 200% 100%;
            animation: xrp-shimmer 3s linear infinite; }
        @keyframes xrp-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
        .xrp-strip-inner { display: flex; align-items: center; gap: 12px; position: relative; }
        #xrpman-avatar { position: relative; flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; border: 2px solid #00ff00;
            display: flex; align-items: center; justify-content: center;
            background: radial-gradient(circle, rgba(0,120,0,0.8) 0%, rgba(0,20,0,0.95) 100%);
            box-shadow: 0 0 16px rgba(0,255,0,0.55), inset 0 0 8px rgba(0,255,0,0.3); }
        #xrpman-avatar svg { width: 24px; height: 24px; filter: drop-shadow(0 0 5px #00ff00); }
        #xrpman-dot { position: absolute; top: -2px; right: -2px; width: 10px; height: 10px; border-radius: 50%;
            background: #00ff00; box-shadow: 0 0 8px #00ff00; animation: xrp-dot-pulse 1.6s ease-in-out infinite; }
        @keyframes xrp-dot-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.35; } }
        .xrp-strip-tx { flex: 1; min-width: 0; }
        .xrp-strip-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 2px; }
        #xrpman-name { font-family: 'Orbitron', sans-serif; font-weight: 700; font-size: 14px; color: #00ff00;
            letter-spacing: 3px; line-height: 1; text-shadow: 0 0 10px #00ff00, 0 0 3px #ffcc44; }
        #xrpman-sub { font-family: 'Share Tech Mono', monospace; font-size: 8px; letter-spacing: 1px; color: rgba(0,255,0,0.5); }
        .xrp-strip-line { display: flex; align-items: flex-start; }
        #xrpman-text { font-family: 'Share Tech Mono', monospace; font-size: 12px; line-height: 1.35; color: #a8ffa8;
            text-shadow: 0 0 4px rgba(0,255,0,0.4); height: 34px; overflow-y: auto;
            scrollbar-width: none; -ms-overflow-style: none;
            white-space: pre-wrap; word-break: break-word; }
        #xrpman-text::-webkit-scrollbar { display: none; }
        #xrpman-cursor { display: inline-block; flex-shrink: 0; width: 7px; height: 13px; margin: 2px 0 0 2px;
            background: #00ff00; box-shadow: 0 0 6px #00ff00; animation: xrp-cursor-blink 0.8s step-end infinite; }
        @keyframes xrp-cursor-blink { 0%,50% { opacity: 1; } 51%,100% { opacity: 0; } }
        #xrpman-next { flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%; cursor: pointer;
            border: 1px solid rgba(0,255,0,0.4); color: #00ff00; background: rgba(0,40,0,0.5); box-shadow: 0 0 8px rgba(0,255,0,0.2);
            display: flex; align-items: center; justify-content: center; transition: transform 0.15s; }
        #xrpman-next:hover { transform: scale(1.1); }
        #xrpman-next svg { width: 15px; height: 15px; }

        /* SPLASH — typed greeter transmission + premium command-card boot button (NO VIDEO) */
        #boot-greeter { width: min(380px, 90vw); margin: 0 auto; padding: 11px 13px; border-radius: 12px;
            background: linear-gradient(135deg, rgba(0,20,0,0.95) 0%, rgba(0,40,10,0.82) 50%, rgba(0,20,0,0.95) 100%);
            border: 1px solid rgba(0,255,0,0.4); box-shadow: 0 0 22px rgba(0,255,0,0.18), inset 0 0 14px rgba(0,255,0,0.05);
            display: flex; gap: 11px; align-items: center; }
        #boot-greeter .bg-avatar { position: relative; flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; border: 2px solid #00ff00;
            display: flex; align-items: center; justify-content: center;
            background: radial-gradient(circle, rgba(0,120,0,0.8) 0%, rgba(0,20,0,0.95) 100%); box-shadow: 0 0 16px rgba(0,255,0,0.5); }
        #boot-greeter .bg-avatar svg { width: 24px; height: 24px; filter: drop-shadow(0 0 5px #00ff00); }
        #boot-greeter .bg-dot { position: absolute; top: -2px; right: -2px; width: 9px; height: 9px; border-radius: 50%;
            background: #00ff00; box-shadow: 0 0 7px #00ff00; animation: xrp-dot-pulse 1.6s ease-in-out infinite; }
        #boot-greeter .bg-tx { flex: 1; min-width: 0; text-align: left; }
        #boot-greeter .bg-name { font-family: 'Orbitron', sans-serif; font-weight: 700; font-size: 13px; color: #00ff00; letter-spacing: 2px;
            text-shadow: 0 0 8px #00ff00; line-height: 1; margin-bottom: 3px; }
        #boot-greeter .bg-name span { font-family: 'Share Tech Mono', monospace; font-weight: 400; font-size: 8px; letter-spacing: 1px; color: rgba(0,255,0,0.5); }
        #boot-greeter .bg-line { display: flex; align-items: flex-start; }
        #boot-greeter-text { font-family: 'Share Tech Mono', monospace; font-size: 11.5px; line-height: 1.4; color: #a8ffa8;
            text-shadow: 0 0 4px rgba(0,255,0,0.4); min-height: 30px; white-space: pre-wrap; word-break: break-word; }
        #boot-greeter .bg-cursor { display: inline-block; flex-shrink: 0; width: 7px; height: 13px; margin: 2px 0 0 2px;
            background: #00ff00; box-shadow: 0 0 6px #00ff00; animation: xrp-cursor-blink 0.8s step-end infinite; }
        @media (prefers-reduced-motion: reduce) {
            #xrpman-strip .xrp-scan, #xrpman-dot, #xrpman-cursor, #boot-greeter .bg-dot, #boot-greeter .bg-cursor { animation: none; }
        }
        #boot-btn { display: flex; align-items: center; gap: 14px; width: min(360px, 88vw); padding: 15px 18px;
            background: linear-gradient(135deg, rgba(0,18,0,0.96), rgba(0,8,0,0.96)); border: 2px solid #00ff00; border-radius: 14px;
            color: #00ff00; cursor: pointer; text-align: left; font-family: 'Orbitron', sans-serif; letter-spacing: 0;
            animation: bootCardPulse 2.4s ease-in-out infinite; }
        #boot-btn:hover { box-shadow: 0 0 40px rgba(0,255,0,0.6), inset 0 0 22px rgba(0,255,0,0.1); }
        @keyframes bootCardPulse {
            0%,100% { box-shadow: 0 0 22px rgba(0,255,0,0.35), inset 0 0 18px rgba(0,255,0,0.06); }
            50%      { box-shadow: 0 0 40px rgba(0,255,0,0.6), inset 0 0 22px rgba(0,255,0,0.12); }
        }
        #boot-btn .boot-glyph { width: 40px; height: 40px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
            border: 1px solid rgba(0,255,0,0.5); border-radius: 10px; background: rgba(0,255,0,0.06); }
        #boot-btn .boot-glyph svg { width: 24px; height: 24px; }
        #boot-btn .boot-tx { flex: 1; min-width: 0; }
        #boot-btn .boot-main { font-size: 15px; font-weight: 900; letter-spacing: 2px; line-height: 1.1; }
        #boot-btn .boot-sub { font-family: 'Share Tech Mono', monospace; font-size: 8px; font-weight: 400; letter-spacing: 1.5px; color: #7ac77a; margin-top: 4px; }
        #boot-btn .boot-arrow { flex-shrink: 0; font-size: 22px; line-height: 1; opacity: 0.85; }
        @media (prefers-reduced-motion: reduce) { #boot-btn { animation: none; box-shadow: 0 0 24px rgba(0,255,0,0.4); } }