[data-theme="night"] {
    --bg-primary: #0a0000;
    --bg-secondary: #120000;
    --bg-tertiary: #1a0000;
    --bg-input: #0e0000;
    --text-primary: #cc3333;
    --text-secondary: #993333;
    --text-muted: #662222;
    --accent: #aa2222;
    --accent-hover: #882222;
    /* Red equivalents of the accent tint / accent text tokens so every
       rgba(var(--accent-rgb), a) fill and var(--accent-text) label turns
       red in night mode without per-control overrides. */
    --accent-rgb: 170, 34, 34;
    --accent-text: #cc3333;
    --success: #663333;
    --warning: #884422;
    --danger: #aa2222;
    --border: #331111;
    /* Red equivalents of the status RGB triples so success/warning tints
       desaturate in night mode (match --success / --warning above). */
    --success-rgb: 102, 51, 51;
    --warning-rgb: 136, 68, 34;
    /* Secondary "icy-cyan" accent family -> red in night mode (side drawer,
       focus/QC rings, progress fills, video controls). */
    --accent2: #aa2222;
    --accent2-rgb: 170, 34, 34;
    --accent2-light: #cc3333;
    --accent2-light-rgb: 204, 51, 51;
    --accent2-deep: #882222;
    /* Glass panel navy -> very dark red so the floating sidebars match
       the night theme instead of staying blue. */
    --panel-glass-rgb: 26, 0, 0;
}

[data-theme="night"] .logo {
    color: #cc3333;
}

[data-theme="night"] .status-indicator.ok {
    background: rgba(102, 51, 51, 0.3);
    color: #993333;
}

[data-theme="night"] .status-indicator.error {
    background: rgba(170, 34, 34, 0.2);
    color: #aa2222;
}

[data-theme="night"] .dpad-stop {
    background: #661111;
    border-color: #661111;
}

[data-theme="night"] .dpad-stop:hover {
    background: #882222;
}

[data-theme="night"] .btn-primary {
    background: #882222;
    border-color: #882222;
}

[data-theme="night"] .btn-primary:hover {
    background: #aa2222;
}

[data-theme="night"] .btn-danger {
    background: rgba(170, 34, 34, 0.15);
    border-color: #882222;
    color: #aa2222;
}

[data-theme="night"] .seq-num {
    background: #882222;
}

[data-theme="night"] .stepper-value {
    color: #cc3333;
}

[data-theme="night"] .preview-area {
    background: #050000;
}

[data-theme="night"] .sky-viewer {
    background: #050000;
}

[data-theme="night"] .chip-icon {
    color: #cc3333;
}

[data-theme="night"] .input-sm,
[data-theme="night"] .input-md,
[data-theme="night"] .search-input {
    background: #0e0000;
    border-color: #331111;
    color: #cc3333;
}

[data-theme="night"] .input-sm:focus,
[data-theme="night"] .input-md:focus,
[data-theme="night"] .search-input:focus {
    border-color: #882222;
}

[data-theme="night"] input[type="range"] {
    accent-color: #882222;
}