/* ════════════════════════════════════════════════════════════════════
   KONSOLEN-THEME
   ════════════════════════════════════════════════════════════════════ */

[data-theme="console"] {
    /* ── Palette ─────────────────────────────────────── */
    --green: #00ff41;
    --green-dim: #00aa2a;
    --green-dark: #003a0e;
    --green-faint: #001a07;

    /* ── Backgrounds ─────────────────────────────────── */
    --bg-body: #000000;
    --bg-app: #000000;
    --bg-toolbar: #000000;
    --bg-status: #000000;
    --bg-board: #000000;
    --bg-footer: #000000;
    --bg-cell: #000000;
    --bg-cell-hover: #001a07;
    --bg-input: #000000;
    --bg-btn-pencil: #000000;
    --bg-move-card: #000000;

    /* ── Text ────────────────────────────────────────── */
    --text-primary: #00ff41;
    --text-muted: #00aa2a;
    --text-faint: #005a14;

    /* ── Borders ─────────────────────────────────────── */
    --border-main: #00aa2a;
    --border-light: #003a0e;
    --border-input: #00aa2a;
    --border-cell: #003a0e;

    /* ── Accent (legacy) ─────────────────────────────── */
    --accent: #00ff41;
    --accent-dark: #000000;
    --accent-mid: #003a0e;

    /* ── Board ───────────────────────────────────────── */
    --board-border: #00ff41;
    --board-shadow: rgba(0, 255, 65, 0.15);

    /* ── Select ──────────────────────────────────────── */
    --select-bg: #003a0e;
    --select-border: #00ff41;
    --select-text: #00ff41;

    /* ── Validation ──────────────────────────────────── */
    --invalid-bg: transparent;
    --invalid-text: #ff4444;
    --correct-bg: transparent;
    --correct-text: #00ff41;
    --hint-bg: transparent;
    --hint-text: #ffdd00;

    /* ── Notes ───────────────────────────────────────── */
    --note-color: #005a14;
    --note-active: #00ff41;

    /* ── Leaderboard ranks ───────────────────────────── */
    --lb-gold: #00ff41;
    --lb-silver: #00cc33;
    --lb-bronze: #009922;

    /* ── Typography ──────────────────────────────────── */
    --font-modern: "Share Tech Mono", monospace;

    /* ── Radii ───────────────────────────────────────── */
    --radius-sm: 0px;
    --radius-md: 0px;
    --radius-lg: 0px;

    /* ── Cage ────────────────────────────────────────── */
    --cage-border: var(--green);

    /* ── User input ──────────────────────────────────── */
    --user-input-color: var(--green);

    /* ── Buttons ─────────────────────────────────────── */
    --btn-primary-bg: var(--green-dark);
    --btn-primary-color: var(--green);
    --btn-primary-bg-hover: rgba(0, 255, 65, 0.15);
    --btn-disabled-bg: var(--green-faint);
    --btn-disabled-color: #005a14;
    --btn-ghost-color: var(--green-dim);
    --btn-ghost-border: var(--green-dark);
    --btn-ghost-bg-hover: rgba(0, 255, 65, 0.05);
    --btn-active-bg: var(--green-dark);
    --btn-active-color: var(--green);
    --btn-active-border: var(--green);

    /* ── Win ─────────────────────────────────────────── */
    --win-gold: var(--green);
    --win-gold-hover: rgba(0, 255, 65, 0.15);
}

/* ── Body ─────────────────────────────────────────────────────────── */
[data-theme="console"] body {
    font-family: var(--font-modern);
    background: var(--bg-body);
}

/* ── CRT App-Container ────────────────────────────────────────────── */
[data-theme="console"] .app-container {
    position: relative;
    border-color: var(--border-light);
}
[data-theme="console"] .app-container::before {
    content: "";
    position: fixed;
    inset: 0;
    background: repeating-linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.13) 0px,
        rgba(0, 0, 0, 0.13) 1px,
        transparent 1px,
        transparent 3px
    );
    pointer-events: none;
    z-index: 9999;
}
[data-theme="console"] .app-container::after {
    content: "";
    position: fixed;
    inset: 0;
    background: radial-gradient(
        ellipse at center,
        transparent 55%,
        rgba(0, 0, 0, 0.55) 100%
    );
    pointer-events: none;
    z-index: 9998;
}

/* ── Header ───────────────────────────────────────────────────────── */
[data-theme="console"] header {
    background: var(--bg-toolbar);
    border-bottom: 1px solid var(--border-main);
    padding: 8px 10px 7px;
    padding-top: calc(8px + env(safe-area-inset-top));
}
[data-theme="console"] .header-right {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 14px;
}
[data-theme="console"] .btn-settings {
    border: 1px solid var(--btn-ghost-border);
    border-radius: var(--radius-sm);
    color: var(--btn-ghost-color);
    background: transparent;
    box-shadow: none;
    transition:
        color 0.12s,
        border-color 0.12s,
        box-shadow 0.12s;
}
[data-theme="console"] .btn-settings:hover {
    color: var(--green);
    border-color: var(--green);
    background: transparent;
    box-shadow: 0 0 8px rgba(0, 255, 65, 0.25);
}
[data-theme="console"] header h1 {
    font-family: "VT323", monospace;
    font-size: 2rem;
    letter-spacing: 6px;
    color: var(--text-primary);
    text-shadow:
        0 0 10px var(--green),
        0 0 20px rgba(0, 255, 65, 0.4);
    animation: console-flicker 8s infinite;
}

@keyframes console-flicker-slow {
    0%,
    88%,
    100% {
        opacity: 1;
    }
    89% {
        opacity: 0.75;
    }
    90% {
        opacity: 1;
    }
    91% {
        opacity: 0.85;
    }
    92% {
        opacity: 1;
    }
}
@keyframes console-flicker {
    0%,
    95%,
    100% {
        opacity: 1;
    }
    96% {
        opacity: 0.82;
    }
    97% {
        opacity: 1;
    }
    98% {
        opacity: 0.88;
    }
    99% {
        opacity: 1;
    }
}

[data-theme="console"] .subtitle,
[data-theme="console"] .version {
    display: none;
}

[data-theme="console"] .version-sup {
    display: inline;
    font-family: var(--font-modern);
    font-size: 0.38em;
    color: var(--text-muted);
    letter-spacing: 2px;
    vertical-align: super;
    margin-left: 4px;
    text-shadow: none;
    opacity: 0.9;
}

/* ── Toolbar ──────────────────────────────────────────────────────── */
[data-theme="console"] .toolbar {
    border-bottom: 1px solid var(--border-light);
    position: relative;
}
[data-theme="console"] .toolbar::after {
    content: "";
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.18) 0px,
        rgba(0, 0, 0, 0.18) 1px,
        transparent 1px,
        transparent 3px
    );
    pointer-events: none;
    z-index: 9999;
}
[data-theme="console"] .control-group label {
    color: var(--text-muted);
    font-family: var(--font-modern);
    letter-spacing: 1px;
    text-transform: lowercase;
    font-weight: normal;
}
[data-theme="console"] .control-group select,
[data-theme="console"] #seed-input {
    background: var(--bg-input);
    border: 1px solid var(--border-input);
    color: var(--text-primary);
    font-family: var(--font-modern);
    border-radius: var(--radius-sm);
    height: 29px;
    box-sizing: border-box;
}
[data-theme="console"] .control-group select:focus,
[data-theme="console"] #seed-input:focus {
    outline: none;
    border-color: var(--green);
    box-shadow: 0 0 6px rgba(0, 255, 65, 0.35);
}

/* ── Buttons ──────────────────────────────────────────────────────── */
[data-theme="console"] .btn {
    font-family: var(--font-modern);
    border-radius: var(--radius-sm);
    letter-spacing: 0.5px;
    text-transform: lowercase;
}
[data-theme="console"] .btn-primary {
    background: var(--btn-primary-bg);
    border: 1px solid var(--btn-primary-color);
    color: var(--btn-primary-color);
}
[data-theme="console"] .btn-primary:hover {
    background: var(--btn-primary-bg-hover);
    box-shadow: 0 0 10px rgba(0, 255, 65, 0.3);
}
[data-theme="console"] .btn-primary:disabled {
    background: var(--btn-disabled-bg);
    border-color: var(--btn-disabled-color);
    color: var(--btn-disabled-color);
}
[data-theme="console"] .btn-ghost {
    background: var(--bg-body);
    border: 1px solid var(--btn-ghost-border);
    color: var(--btn-ghost-color);
}
[data-theme="console"] .btn-ghost:hover {
    border-color: var(--green);
    color: var(--green);
    box-shadow: 0 0 8px rgba(0, 255, 65, 0.2);
    background: var(--btn-ghost-bg-hover);
}

/* ── Icon Buttons ─────────────────────────────────────────────────── */
[data-theme="console"] .btn-pencil {
    background: var(--bg-btn-pencil);
    border: 1px solid var(--btn-ghost-border);
    color: var(--btn-ghost-color);
    border-radius: var(--radius-sm);
}
[data-theme="console"] .btn-pencil:hover {
    border-color: var(--green);
    color: var(--green);
    background: var(--bg-btn-pencil);
}
[data-theme="console"] #btn-notes[data-active="true"],
[data-theme="console"] #btn-validate[data-active="true"],
[data-theme="console"] #btn-timer[data-active="true"],
[data-theme="console"] #btn-numpad[data-active="true"] {
    background: var(--btn-active-bg);
    border-color: var(--btn-active-border);
    box-shadow: inset 0 0 0 1px var(--btn-active-border);
    color: var(--btn-active-color);
}
[data-theme="console"] #btn-validate[data-active="false"],
[data-theme="console"] #btn-timer[data-active="false"] {
    color: var(--text-faint);
    border-color: var(--btn-ghost-border);
}

/* ── Status ───────────────────────────────────────────────────────── */
[data-theme="console"] .status {
    font-family: var(--font-modern);
    font-style: normal;
    color: var(--text-muted);
    border-bottom: 1px solid var(--border-light);
    background: var(--bg-status);
    text-transform: lowercase;
}
[data-theme="console"] .status::before {
    content: "> ";
    color: var(--text-primary);
}
[data-theme="console"] .status::after {
    content: "";
    display: none;
}

/* ── Board Container ──────────────────────────────────────────────── */
[data-theme="console"] #board-container {
    background: var(--bg-board);
    position: relative;
}
[data-theme="console"] #board-container::after {
    content: "";
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.25) 0px,
        rgba(0, 0, 0, 0.25) 1px,
        transparent 1px,
        transparent 3px
    );
    pointer-events: none;
    z-index: 9999;
}

/* ── Board ────────────────────────────────────────────────────────── */
[data-theme="console"] #board {
    border: 2px solid var(--board-border);
    background: var(--board-border);
    box-shadow:
        0 0 20px rgba(0, 255, 65, 0.25),
        0 0 60px rgba(0, 255, 65, 0.08);
}

/* ── Cells ────────────────────────────────────────────────────────── */
[data-theme="console"] .cell {
    background: var(--bg-cell);
    border-color: var(--border-cell);
}
[data-theme="console"] .cell:hover:not(.selected) {
    background: var(--bg-cell-hover);
}
[data-theme="console"] .cell.selected {
    background: var(--select-bg) !important;
    outline: none;
    border-color: var(--select-border) !important;
    box-shadow: inset 0 0 8px rgba(0, 255, 65, 0.3);
}

/* ── Cursor ───────────────────────────────────────────────────────── */
[data-theme="console"] .cell-cursor {
    display: none;
}
[data-theme="console"] .cell.selected .cell-cursor {
    display: block;
    width: 2px;
    height: 40%;
    background: var(--green);
    box-shadow: 0 0 6px var(--green);
    animation: console-blink 1s step-end infinite;
    pointer-events: none;
}
@keyframes console-blink {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}

/* ── Cage Borders ─────────────────────────────────────────────────── */
[data-theme="console"] .cell.bt {
    border-top: 1.5px solid var(--cage-border);
}
[data-theme="console"] .cell.bb {
    border-bottom: 1.5px solid var(--cage-border);
}
[data-theme="console"] .cell.bl {
    border-left: 1.5px solid var(--cage-border);
}
[data-theme="console"] .cell.br {
    border-right: 1.5px solid var(--cage-border);
}

/* ── Cage Label ───────────────────────────────────────────────────── */
[data-theme="console"] .cage-label {
    font-family: var(--font-modern);
    font-weight: normal;
    color: var(--text-muted);
    text-shadow: 0 0 4px rgba(0, 255, 65, 0.4);
}

/* ── Cell Value ───────────────────────────────────────────────────── */
[data-theme="console"] .cell-value {
    font-family: "VT323", monospace;
    font-size: var(--cell-value-size, clamp(1.2rem, 3.8vw, 2.2rem));
    font-weight: normal;
    color: var(--user-input-color);
    text-shadow: 0 0 8px rgba(0, 255, 65, 0.6);
}

/* ── Notes ────────────────────────────────────────────────────────── */
[data-theme="console"] .note {
    font-family: var(--font-modern);
}

/* ── Progress ─────────────────────────────────────────────────────── */
[data-theme="console"] .progress-label {
    color: var(--text-muted);
    font-family: var(--font-modern);
    letter-spacing: 1px;
    text-transform: lowercase;
    font-weight: normal;
}
[data-theme="console"] #progress-text {
    color: var(--text-primary);
}
[data-theme="console"] .progress-track {
    background: var(--green-dark);
    border-radius: var(--radius-sm);
    height: 4px;
}
[data-theme="console"] .progress-bar {
    background: var(--green);
    border-radius: var(--radius-sm);
    box-shadow: 0 0 6px var(--green);
}
[data-theme="console"] .progress-bar.complete {
    background: var(--green);
}

/* ── Move Card ────────────────────────────────────────────────────── */
[data-theme="console"] .move-card {
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    background: var(--bg-move-card);
}
[data-theme="console"] .move-card-label {
    color: var(--text-muted);
    font-family: var(--font-modern);
    letter-spacing: 1px;
    text-transform: lowercase;
    font-weight: normal;
}
[data-theme="console"] .move-card-value {
    color: var(--text-primary);
    font-family: "VT323", monospace;
    font-size: 2rem;
    text-shadow: 0 0 8px rgba(0, 255, 65, 0.5);
}

/* ── Timer ────────────────────────────────────────────────────────── */
[data-theme="console"] .timer-display-header {
    font-family: "VT323", monospace;
    font-size: 2rem;
    letter-spacing: 4px;
    color: var(--text-muted);
    text-shadow: 0 0 8px rgba(0, 255, 65, 0.3);
    opacity: 1;
}
[data-theme="console"] .timer-display {
    background: var(--green-dark);
    border: 1px solid var(--green);
    color: var(--green);
    border-radius: var(--radius-sm);
    font-family: "VT323", monospace;
    font-size: 1.2rem;
    letter-spacing: 2px;
    box-shadow: 0 0 6px rgba(0, 255, 65, 0.2);
}

/* ── Footer ───────────────────────────────────────────────────────── */
[data-theme="console"] .footer {
    font-family: var(--font-modern);
    font-size: clamp(0.55em, 1vw, 0.85em);
    color: var(--text-muted);
    border-top: 1px solid var(--border-light);
    background: var(--bg-footer);
    letter-spacing: 0;
    text-transform: lowercase;
}
[data-theme="console"] .footer svg {
    opacity: 0.6;
}

/* ── Separators ───────────────────────────────────────────────────── */
[data-theme="console"] .toolbar-sep,
[data-theme="console"] .toolbar-sep-main,
[data-theme="console"] .toolbar-sep-vertical {
    background: var(--border-light);
}

/* ── Modal ────────────────────────────────────────────────────────── */
[data-theme="console"] .modal {
    background: var(--bg-body);
    border: 1px solid var(--green);
    border-radius: var(--radius-sm);
    box-shadow: 0 0 30px rgba(0, 255, 65, 0.2);
}
[data-theme="console"] .modal p {
    font-family: var(--font-modern);
    color: var(--text-primary);
    text-transform: lowercase;
    font-size: 0.85em;
}
[data-theme="console"] .modal-buttons .btn {
    text-transform: lowercase;
    font-family: var(--font-modern);
    font-size: 0.85em;
}
[data-theme="console"] .settings-title {
    font-size: 1rem;
}

/* ── Win Banner ───────────────────────────────────────────────────── */
/* Console-Theme: canvas handles overlay; inner content hidden */
[data-theme="console"] .win-banner.visible {
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
[data-theme="console"] .win-banner-inner {
    display: none !important;
}
[data-theme="console"] .win-trophy {
    color: var(--win-gold);
    filter: drop-shadow(0 0 8px rgba(0, 255, 65, 0.6));
}
[data-theme="console"] .win-divider {
    background: var(--border-light);
}
[data-theme="console"] .win-text strong {
    font-family: "VT323", monospace;
    font-size: 2rem;
    color: var(--win-gold);
    text-shadow: 0 0 10px rgba(0, 255, 65, 0.5);
    letter-spacing: 4px;
    text-transform: lowercase;
}
[data-theme="console"] .win-stats {
    background: var(--bg-cell-hover);
    border-color: var(--border-light);
    border-radius: var(--radius-sm);
}
[data-theme="console"] .win-stat-sep {
    background: var(--border-light);
}
[data-theme="console"] .win-stat-label {
    font-family: var(--font-modern);
    color: var(--text-muted);
    letter-spacing: 1px;
    text-transform: lowercase;
}
[data-theme="console"] .win-stat-value {
    font-family: "VT323", monospace;
    font-size: 1.2rem;
    color: var(--win-gold);
    text-shadow: 0 0 6px rgba(0, 255, 65, 0.4);
}
[data-theme="console"] .win-seed-row {
    background: var(--bg-cell-hover);
    border-color: var(--border-light);
    border-radius: var(--radius-sm);
}
[data-theme="console"] .win-stat-seed {
    font-family: var(--font-modern);
    color: var(--win-gold);
    letter-spacing: 2px;
}
[data-theme="console"] .win-buttons #win-new {
    background: var(--btn-primary-bg);
    color: var(--win-gold);
    border-color: var(--win-gold);
}
[data-theme="console"] .win-buttons #win-new:hover {
    background: var(--win-gold-hover);
    box-shadow: 0 0 10px rgba(0, 255, 65, 0.3);
}
[data-theme="console"] .win-buttons #win-close {
    background: transparent;
    color: var(--btn-ghost-color);
    border-color: var(--btn-ghost-border);
}
[data-theme="console"] .win-buttons #win-close:hover {
    border-color: var(--green);
    color: var(--green);
    background: transparent;
}
[data-theme="console"] #win-best {
    text-transform: lowercase;
}

/* ── Custom Select ────────────────────────────────────────────────── */
[data-theme="console"] .custom-select {
    display: block;
}
[data-theme="console"] .control-group select {
    display: none !important;
}
[data-theme="console"] .custom-select-btn {
    background: var(--bg-input);
    border: 1px solid var(--border-input);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    font-family: var(--font-modern);
    font-size: 13px;
}
[data-theme="console"] .custom-select-btn:hover {
    border-color: var(--green);
    background: var(--bg-cell-hover);
    box-shadow: 0 0 6px rgba(0, 255, 65, 0.2);
}
[data-theme="console"] .custom-select-dropdown {
    background: var(--bg-body);
    border: 1px solid var(--border-input);
    border-radius: var(--radius-sm);
    box-shadow: 0 4px 20px rgba(0, 255, 65, 0.15);
    z-index: 10001;
}
[data-theme="console"] .custom-select-option {
    font-family: var(--font-modern);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    text-transform: lowercase;
}
[data-theme="console"] .custom-select-option:hover {
    background: var(--select-bg);
    color: var(--text-primary);
}
[data-theme="console"] .custom-select-option[data-selected] {
    color: var(--text-primary);
    background: var(--bg-cell-hover);
}
[data-theme="console"] .custom-select-label {
    text-transform: lowercase;
}

/* ── Label case ───────────────────────────────────────────────────── */
[data-theme="console"] .label-upper {
    display: none;
}
[data-theme="console"] .label-title {
    display: inline;
}

/* ── Info Button ──────────────────────────────────────────────────── */
[data-theme="console"] .info-btn {
    border: 1.5px solid var(--green);
    background: var(--bg-body);
    color: var(--green);
    text-shadow: 0 0 6px rgba(0, 255, 65, 0.6);
    box-shadow: 0 0 6px rgba(0, 255, 65, 0.2);
}

/* ── Info Popup ───────────────────────────────────────────────────── */
[data-theme="console"] .info-popup {
    background: var(--bg-body) !important;
    background-image: repeating-linear-gradient(
        0deg,
        rgba(0, 255, 65, 0.05) 0px,
        rgba(0, 255, 65, 0.05) 1px,
        transparent 1px,
        transparent 3px
    ) !important;
    width: 280px;
    border: 1px solid var(--border-input);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    box-shadow: 0 0 12px rgba(0, 255, 65, 0.12);
    font-family: var(--font-modern);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 12px 14px;
    text-transform: lowercase;
    z-index: 10000;
    overflow: hidden;
}
[data-theme="console"] .info-popup::before {
    border-bottom-color: var(--border-input);
    z-index: 2;
}
[data-theme="console"] .info-popup::after {
    content: "";
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.3) 0px,
        rgba(0, 0, 0, 0.3) 1px,
        transparent 1px,
        transparent 3px
    );
    pointer-events: none;
    z-index: 9999;
}
[data-theme="console"] .info-popup strong {
    color: var(--text-primary);
    text-shadow: none;
    letter-spacing: 0;
    border-bottom: none;
    padding-bottom: 0;
    font-weight: normal;
    margin-top: 8px;
    margin-bottom: 1px;
    position: relative;
    z-index: 2;
}
[data-theme="console"] .info-popup strong::before {
    content: "// ";
    color: var(--text-muted);
}
[data-theme="console"] .info-popup ul {
    padding-left: 18px;
    list-style: none;
    margin: 0 0 4px 0;
    position: relative;
    z-index: 2;
}
[data-theme="console"] .info-popup ul li {
    color: var(--green-dim);
}
[data-theme="console"] .info-popup ul li::before {
    content: "> ";
    color: var(--text-muted);
    margin-left: -18px;
    margin-right: 4px;
}

/* ── Welcome Screen ───────────────────────────────────────────────── */
[data-theme="console"] .welcome-inner {
    color: var(--text-muted);
}
[data-theme="console"] .welcome-screen {
    position: relative;
}
[data-theme="console"] .welcome-screen::after {
    content: "";
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.35) 0px,
        rgba(0, 0, 0, 0.35) 1px,
        transparent 1px,
        transparent 3px
    );
    pointer-events: none;
    z-index: 9999;
}
[data-theme="console"] .welcome-inner h2 {
    font-family: "VT323", monospace;
    font-size: 1.8rem;
    color: var(--text-primary);
    text-shadow: 0 0 10px rgba(0, 255, 65, 0.4);
    letter-spacing: 3px;
    text-transform: lowercase;
}
[data-theme="console"] .welcome-inner p {
    font-family: var(--font-modern);
    color: var(--text-muted);
    text-transform: lowercase;
}
[data-theme="console"] .welcome-daily {
    background: transparent;
    border-color: var(--border-light);
    font-family: var(--font-modern);
}
[data-theme="console"] .welcome-daily-info {
    color: var(--text-muted);
    text-transform: lowercase;
}
[data-theme="console"] .welcome-daily-solved {
    color: var(--text-primary);
    text-transform: lowercase;
}
[data-theme="console"] .welcome-daily-unsolved {
    color: var(--text-faint);
    text-transform: lowercase;
}
[data-theme="console"] .welcome-hint {
    color: var(--text-faint) !important;
}

/* ── Validation States ────────────────────────────────────────────── */
/* Console: colour-only glow; no background fill */
[data-theme="console"] .cell.invalid,
[data-theme="console"] .cell.correct,
[data-theme="console"] .cell.hint {
    background: var(--bg-cell) !important;
    box-shadow: none !important;
}
[data-theme="console"] .cell.invalid .cell-value {
    color: #ff2020 !important;
    text-shadow:
        0 0 2px #fff,
        0 0 6px #ff2020,
        0 0 14px #ff2020,
        0 0 30px rgba(255, 32, 32, 0.5) !important;
}
[data-theme="console"] .cell.correct .cell-value {
    text-shadow:
        0 0 2px #fff,
        0 0 6px var(--green),
        0 0 14px var(--green),
        0 0 30px rgba(0, 255, 65, 0.5) !important;
}
[data-theme="console"] .cell.hint .cell-value {
    color: #ffff00 !important;
    text-shadow:
        0 0 2px #fff,
        0 0 6px #ffff00,
        0 0 14px #ffdd00,
        0 0 30px rgba(255, 220, 0, 0.5) !important;
    font-style: normal !important;
}

/* ── Matrix Rain Canvas ───────────────────────────────────────────── */
.matrix-canvas {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9998;
    pointer-events: none;
}

/* ── Numpad ───────────────────────────────────────────────────────── */
[data-theme="console"] .numpad {
    background: var(--bg-body);
    border-color: var(--border-light);
    box-shadow: 0 0 16px rgba(0, 255, 65, 0.1);
}
[data-theme="console"] .numpad-titlebar {
    background: linear-gradient(
        to right,
        var(--green-dark) 0%,
        var(--green-faint) 50%,
        var(--green-dark) 100%
    );
    border-color: var(--border-light);
    color: var(--text-faint);
    font-family: var(--font-modern);
    letter-spacing: 1px;
}
.numpad-title-console {
    display: none;
}
.numpad-title-text {
    display: inline;
}
[data-theme="console"] .numpad-title-console {
    display: inline;
    color: var(--green-dim);
    letter-spacing: 1px;
}
[data-theme="console"] .numpad-title-text {
    display: none;
}
[data-theme="console"] .numpad-btn {
    background: var(--bg-body);
    border-color: var(--border-light);
    color: var(--green-dim);
    font-family: var(--font-modern);
}
[data-theme="console"] .numpad-btn:hover {
    background: var(--bg-cell-hover);
    color: var(--green);
    border-color: var(--green-dim);
}
[data-theme="console"] .numpad-notes {
    background: var(--bg-body);
    border-color: var(--border-light);
    color: var(--green-dim);
    font-family: var(--font-modern);
}
[data-theme="console"] .numpad-notes[data-active="true"] {
    background: var(--bg-cell-hover);
    color: var(--green);
    border-color: var(--green-dim);
}
[data-theme="console"] .numpad-clear {
    background: var(--bg-body);
    border-color: var(--border-light);
    color: var(--text-faint);
    font-family: var(--font-modern);
}
[data-theme="console"] .numpad-clear:hover {
    background: #1a0000;
    color: var(--invalid-text);
    border-color: #ff444488;
}

/* ── Stats Tabs ───────────────────────────────────────────────────── */
[data-theme="console"] .stats-tabs {
    border-bottom-color: var(--border-light);
}
[data-theme="console"] .stats-tab {
    color: var(--green-dim);
    text-transform: lowercase;
}
[data-theme="console"] .stats-tab.active {
    color: var(--green);
    border-bottom-color: var(--green);
}

/* ── Leaderboard ──────────────────────────────────────────────────── */
[data-theme="console"] .lb-filter-select {
    background: var(--bg-body);
    border-color: var(--border-light);
    color: var(--text-primary);
    font-family: var(--font-modern);
    font-size: 0.85rem;
}
[data-theme="console"] .lb-period-btn {
    background: var(--bg-body);
    border-color: var(--border-light);
    color: var(--green-dim);
    font-family: var(--font-modern);
}
[data-theme="console"] .lb-period-btn.active {
    background: var(--btn-active-bg);
    border-color: var(--btn-active-border);
    color: var(--btn-active-color);
}
[data-theme="console"] .lb-row-new td {
    animation: none;
    background: rgba(0, 255, 65, 0.12);
    color: var(--text-primary);
}
[data-theme="console"] .lb-info,
[data-theme="console"] .lb-section-title,
[data-theme="console"] .lb-moves,
[data-theme="console"] .lb-date {
    color: var(--green-dim);
    text-transform: lowercase;
}
[data-theme="console"] .lb-name {
    color: var(--green);
}
[data-theme="console"] .lb-time {
    color: var(--green);
}
[data-theme="console"] .lb-row td {
    border-bottom-color: var(--bg-cell-hover);
}

/* ── Leaderboard Entry ────────────────────────────────────────────── */
[data-theme="console"] .lb-entry-modal {
    border-top-color: var(--green);
    border-color: var(--green-dim);
}
[data-theme="console"] .lb-entry-info {
    background: var(--bg-cell-hover);
    border-color: var(--border-light);
    color: var(--green-dim);
}
[data-theme="console"] .lb-entry-input {
    background: var(--bg-body);
    border-color: var(--border-light);
    color: var(--green);
    font-family: var(--font-modern);
}
[data-theme="console"] .lb-entry-input:focus {
    border-color: var(--green);
    box-shadow: 0 0 0 3px rgba(0, 255, 65, 0.08);
}

/* ── Stats Modal ──────────────────────────────────────────────────── */
[data-theme="console"] .stats-modal {
    border-color: var(--green-dim);
}
[data-theme="console"] .stats-total-label,
[data-theme="console"] .stats-empty,
[data-theme="console"] .stats-size-cell {
    color: var(--green-dim);
    text-transform: lowercase;
}
[data-theme="console"] .stats-total-value {
    color: var(--green);
}
[data-theme="console"] .stats-table th {
    color: var(--green-dim);
    border-bottom-color: var(--green-dim);
    text-transform: lowercase;
}
[data-theme="console"] .stats-table td {
    color: var(--green);
    border-bottom-color: var(--bg-cell-hover);
}

/* ── Update Banner ────────────────────────────────────────────────── */
[data-theme="console"] .update-banner {
    background: rgba(0, 0, 0, 0.82);
}
[data-theme="console"] .update-banner-inner {
    background: var(--bg-body);
    border-color: var(--green-dim);
    border-radius: var(--radius-sm);
    font-family: var(--font-modern);
    text-transform: lowercase;
}
[data-theme="console"] .update-banner-msg {
    color: var(--green);
    font-size: 0.85em;
}
[data-theme="console"] .update-banner-btn {
    background: var(--bg-cell-hover);
    color: var(--green);
    border: 1px solid var(--green-dim);
    border-radius: var(--radius-sm);
    font-family: var(--font-modern);
    text-transform: lowercase;
}
[data-theme="console"] .update-banner-btn:hover {
    background: var(--green);
    color: var(--bg-body);
    opacity: 1;
}
[data-theme="console"] .update-banner-close {
    color: var(--green-dim);
}
[data-theme="console"] .update-banner-btn--ghost {
    background: transparent;
    color: var(--green-dim);
    border-color: var(--green-dim);
}
[data-theme="console"] .update-banner-btn--ghost:hover {
    background: transparent;
    color: var(--green);
}
[data-theme="console"] .update-progress-wrap {
    display: flex;
}

/* ── Tutorial ─────────────────────────────────────────────────────── */
[data-theme="console"] .tut-modal {
    background: var(--bg-body);
    border-color: var(--green-dim);
    border-radius: var(--radius-sm);
    font-family: var(--font-modern);
}
[data-theme="console"] .tut-title {
    font-family: var(--font-modern);
    color: var(--green);
    text-transform: lowercase;
}
[data-theme="console"] .tut-body {
    color: var(--green);
}
[data-theme="console"] .tut-hint,
[data-theme="console"] .tut-feat span,
[data-theme="console"] .tut-ops em {
    color: var(--green-dim);
}
[data-theme="console"] .tut-ops li,
[data-theme="console"] .tut-feat strong {
    color: var(--green);
}
[data-theme="console"] .tut-dot {
    background: var(--green-dim);
}
[data-theme="console"] .tut-dot.active {
    background: var(--green);
}
[data-theme="console"] .tut-latin-row span {
    background: var(--bg-body);
    border-color: var(--green-dim);
    color: var(--green);
}
[data-theme="console"] .tcell {
    background: var(--bg-body);
    font-family: var(--font-modern);
    border: 1px solid rgba(0, 255, 65, 0.15);
}
[data-theme="console"] .tcell.ct {
    border-top-color: var(--green);
}
[data-theme="console"] .tcell.cr {
    border-right-color: var(--green);
}
[data-theme="console"] .tcell.cb {
    border-bottom-color: var(--green);
}
[data-theme="console"] .tcell.cl {
    border-left-color: var(--green);
}
[data-theme="console"] .tcell:hover {
    background: var(--bg-cell-hover);
}
[data-theme="console"] .tcell.tsel {
    background: var(--bg-cell-hover) !important;
}
[data-theme="console"] .tcell.terror {
    background: #1a0000 !important;
}
[data-theme="console"] .tcell-lbl,
[data-theme="console"] .tcell-val {
    color: var(--green);
}
[data-theme="console"] .tnpb {
    background: var(--bg-body);
    border-color: var(--green-dim);
    color: var(--green);
    border-radius: var(--radius-sm);
    font-family: var(--font-modern);
}
[data-theme="console"] .tnpb:hover {
    background: var(--bg-cell-hover);
}
[data-theme="console"] .tnpb.active {
    background: var(--green);
    color: var(--bg-body);
}
[data-theme="console"] .tnpb-del {
    color: var(--green-dim);
}
[data-theme="console"] .tut-success-phase svg {
    color: var(--green);
}
[data-theme="console"] .tut-success-phase p {
    color: var(--green-dim);
}

/* ── Mobile ───────────────────────────────────────────────────────── */
@media (max-width: 600px) {
    [data-theme="console"] .app-container::after {
        display: none;
    }

    [data-theme="console"] .mobile-bottom-nav {
        background: var(--bg-body) !important;
        border-top: 1px solid var(--green) !important;
        z-index: 9999 !important;
    }
    [data-theme="console"] .mobile-nav-item {
        color: var(--green-dim) !important;
        font-family: var(--font-modern);
        font-size: 0.52em;
        text-transform: lowercase;
    }
    [data-theme="console"] .mobile-nav-item:active,
    [data-theme="console"] .mobile-nav-item.active {
        color: var(--green) !important;
        text-shadow: 0 0 6px rgba(0, 255, 65, 0.5);
    }
    [data-theme="console"] .mobile-more-panel {
        background: var(--bg-body);
        border-top: 1px solid var(--border-light);
    }
    [data-theme="console"] .mobile-more-btn {
        border-color: var(--border-light);
        background: var(--bg-body);
        color: var(--green-dim);
        font-family: var(--font-modern);
        text-transform: lowercase;
        flex-direction: column;
        gap: 4px;
    }
    [data-theme="console"] .mobile-toolbar {
        background: var(--bg-body);
        border-bottom: 1px solid var(--border-light);
    }
    [data-theme="console"] .mobile-select,
    [data-theme="console"] .mobile-seed-input,
    [data-theme="console"] .mobile-seed-btn {
        background: var(--bg-body);
        border-color: var(--border-light);
        color: var(--green-dim);
        font-family: var(--font-modern);
    }
    [data-theme="console"] .mobile-btn-new {
        background: var(--bg-cell-hover) !important;
        border: 1px solid var(--green) !important;
        color: var(--green) !important;
        font-family: var(--font-modern);
        text-transform: lowercase;
    }
}