/* ═══════════════════════════════════════════════════════════════
   RUNIC THEME: Source Code
   "There is no spoon."
   CRT Phosphor Terminal — Single-Color Hacker Aesthetic
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] {
    /* ── PRIMITIVE HUES ───────────────────────────────────────── */
    --hue-primary:   120;     /* Phosphor-Grün */
    --hue-accent:    120;     /* Grün */
    --hue-gm:        45;      /* Amber – wie ein alter amber-Terminal */
    --hue-danger:    0;       /* Terminal-Rot */
    --hue-warning:   45;      /* Gelb */
    --hue-success:   120;     /* Grün */
    --hue-toxicity:  120;     /* Toxizität */
    --hue-neutral:   120;     /* Grün-Stich */

    /* ── SÄTTIGUNG & HELLIGKEIT ───────────────────────────────── */
    --sat-primary:   100%;
    --lit-primary:   50%;
    --lit-primary-hover: 58%;

    --sat-accent:    100%;
    --lit-accent:    50%;
    --lit-accent-hover: 58%;

    --sat-gm:        100%;
    --lit-gm:        50%;
    --lit-gm-text:   65%;

    --sat-danger:    100%;
    --lit-danger:    45%;
    --lit-danger-hover: 38%;

    --sat-warning:   100%;
    --lit-warning:   50%;

    --sat-toxicity:  100%;
    --lit-toxicity:  50%;

    --lightness-bg:  2%;      /* Annähernd rein schwarz */

    /* ── BORDER RADIUS (null – Terminal eckig) ────────────────── */
    --radius-sm:     0;
    --radius-md:     0;
    --radius-lg:     0;
    --radius-xl:     2px;
    --radius-2xl:    2px;

    /* ── TYPOGRAPHY ───────────────────────────────────────────── */
    --font-sans:     'Share Tech Mono', 'Consolas', 'Courier New', monospace;
    --font-mono:     'Share Tech Mono', 'Consolas', 'Courier New', monospace;

    /* ── TRANSITIONS (digital, hart) ─────────────────────────── */
    --duration-75:   40ms;
    --duration-150:  80ms;
    --duration-250:  120ms;
    --duration-300:  180ms;
    --duration-400:  300ms;

    --ease-out:      steps(4, end);
    --ease-in-out:   steps(4, end);

    /* ── SHADOWS ──────────────────────────────────────────────── */
    --shadow-glow-primary: 0 0 15px hsl(120 100% 50% / 0.5);
    --shadow-glow-gold:    0 0 15px hsl(45  100% 50% / 0.4);

    /* ── ICON FÄRBUNG ─────────────────────────────────────────── */
    --icon-color:  hsl(120 100% 50%);
    --icon-filter: brightness(0) saturate(100%) invert(39%) sepia(94%)
                   saturate(594%) hue-rotate(83deg) brightness(106%);

    /* ── GLITCH / PHOSPHOR FARBEN ─────────────────────────────── */
    --phosphor-bright: hsl(120 100% 72%);
    --phosphor-dim:    hsl(120 80%  30%);

    /* ── HINTERGRÜNDE ─────────────────────────────────────────── */
    --bg-page:          hsl(120 12% 2%);
    --bg-primary:       hsl(120 10% 4%);
    --bg-secondary:     hsl(120 8%  6% / 0.85);
    --bg-tertiary:      hsl(120 8%  5% / 0.95);
    --bg-card:          hsl(120 10% 5% / 0.92);
    --bg-hover:         hsl(120 10% 10% / 0.5);
    --bg-input:         hsl(120 8%  6%);

    --surface-elevated: hsl(120 10% 7%);
    --surface-overlay:  hsl(120 10% 8%);
    --surface-panel:    hsl(120 8%  5%);

    /* ── TEXT ─────────────────────────────────────────────────── */
    --text-label: hsl(120 70% 55%);
    --text-muted: hsl(120 50% 35% / 0.7);

    /* ── RAHMEN ───────────────────────────────────────────────── */
    --border-color:  hsl(120 100% 50% / 0.14);
    --border-subtle: hsl(120 100% 50% / 0.08);
    --border-strong: hsl(120 100% 50% / 0.32);

    /* ── FOCUS RING ───────────────────────────────────────────── */
    --color-focus-ring: hsl(120 100% 50% / 0.3);

    /* ── TOOLTIPS ─────────────────────────────────────────────── */
    --color-tooltip-bg:         hsl(120 15% 2%);
    --color-tooltip-highlight:  hsl(120 100% 65%);
    --color-tooltip-effect-bg:  hsla(120 100% 50% / 0.07);
    --color-tooltip-text:       hsl(120 60% 62%);
    --color-tooltip-label:      hsl(120 85% 52%);
    --color-tooltip-muted:      hsl(120 35% 38%);
    --color-tooltip-dim:        hsl(120 25% 28%);
    --color-tooltip-pos:        hsl(120 100% 55%);
    --color-tooltip-neg:        hsl(0   100% 50%);
    --color-tooltip-separator:  hsl(120 100% 50% / 0.18);
    --color-tooltip-section-bg: hsl(120 15% 4% / 0.9);

    /* ── ITEM QUALITY COLORS ────────────────────────────────── */
    --quality-0-color1:  rgb(30, 55, 30);      /* Toter Pixel */
    --quality-0-color2:  rgb(15, 30, 15);
    --quality-1-color1:  rgb(60, 100, 60);     /* Schwaches Signal */
    --quality-1-color2:  rgb(40, 70, 40);
    --quality-2-color1:  rgb(0, 200, 0);       /* Aktiv */
    --quality-2-color2:  rgb(0, 140, 0);
    --quality-3-color1:  rgb(0, 240, 0);       /* Starkes Signal */
    --quality-3-color2:  rgb(0, 175, 0);
    --quality-4-color1:  rgb(0, 255, 100);     /* System kritisch */
    --quality-4-color2:  rgb(0, 200, 50);
    --quality-5-color1:  rgb(255, 185, 0);     /* Amber-Override */
    --quality-5-color2:  rgb(200, 130, 0);
    --quality-6-color1:  rgb(220, 0, 0);       /* Fehler / Intrusion */
    --quality-6-color2:  rgb(160, 0, 0);
    --quality-7-color1:  rgb(0, 255, 200);     /* God Mode */
    --quality-7-color2:  rgb(175, 0, 255);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – ANIMATIONEN
   ═══════════════════════════════════════════════════════════════ */

/* Phosphor-Flicker: CRT-Intensitätsschwankung für Überschriften */
@keyframes phosphorFlicker {
    0%, 82%, 100% {
        text-shadow:
            0 0 6px  hsl(120 100% 50% / 0.55),
            0 0 14px hsl(120 100% 50% / 0.2);
        opacity: 1;
    }
    83% {
        text-shadow: 0 0 2px hsl(120 100% 50% / 0.15);
        opacity: 0.65;
    }
    84% {
        text-shadow:
            0 0 10px hsl(120 100% 50% / 0.9),
            0 0 25px hsl(120 100% 50% / 0.4);
        opacity: 1;
    }
    85% {
        text-shadow:
            0 0 6px hsl(120 100% 50% / 0.55),
            0 0 14px hsl(120 100% 50% / 0.2);
        opacity: 0.9;
    }
    86% { opacity: 1; }
}

/* Phosphor-Decay für Char-Namen: intensiver, mit kurzer Überlast */
@keyframes charNameDecay {
    0%, 76%, 100% {
        text-shadow:
            0 0 8px  hsl(120 100% 50% / 0.65),
            0 0 22px hsl(120 100% 50% / 0.28);
        color: hsl(120 100% 62%);
        opacity: 1;
    }
    77% {
        text-shadow: 0 0 1px hsl(120 100% 50% / 0.2);
        color: hsl(120 80% 40%);
        opacity: 0.5;
    }
    78% {
        text-shadow:
            0 0 20px hsl(120 100% 60% / 1),
            0 0 45px hsl(120 100% 50% / 0.6),
            0 0 80px hsl(120 100% 50% / 0.2);
        color: hsl(120 100% 85%);
        opacity: 1;
    }
    79% {
        text-shadow:
            0 0 8px  hsl(120 100% 50% / 0.65),
            0 0 22px hsl(120 100% 50% / 0.28);
        color: hsl(120 100% 62%);
    }
    83% {
        text-shadow:
            0 0 14px hsl(120 100% 55% / 0.85),
            0 0 35px hsl(120 100% 50% / 0.4);
        color: hsl(120 100% 72%);
    }
    84% {
        text-shadow:
            0 0 8px  hsl(120 100% 50% / 0.65),
            0 0 22px hsl(120 100% 50% / 0.28);
        color: hsl(120 100% 62%);
    }
}

/* Pulsierender Phosphor-Glow für Werte */
@keyframes phosphorPulse {
    0%, 100% {
        box-shadow:
            0 0 8px  hsl(120 100% 50% / 0.3),
            0 0 20px hsl(120 100% 50% / 0.08);
    }
    50% {
        box-shadow:
            0 0 18px hsl(120 100% 50% / 0.55),
            0 0 40px hsl(120 100% 50% / 0.18);
    }
}

/* Text-Glow für wichtige Werte */
@keyframes valueGlowGreen {
    0%, 100% { text-shadow: 0 0 6px hsl(120 100% 50% / 0.45); }
    50%      { text-shadow: 0 0 14px hsl(120 100% 50% / 0.85), 0 0 30px hsl(120 100% 50% / 0.35); }
}

/* Nav-Puls */
@keyframes matrixNavPulse {
    0%, 100% {
        box-shadow:
            0 2px 0 0 hsl(120 100% 50% / 0.4),
            0 0 20px hsla(120 100% 50% / 0.06);
    }
    50% {
        box-shadow:
            0 2px 0 0 hsl(120 100% 50% / 0.8),
            0 0 35px hsla(120 100% 50% / 0.14);
    }
}

/* Scan von oben nach unten für Login */
@keyframes matrixScanDown {
    0%   { top: -3px; }
    100% { top: 100%; }
}

/* Einmaliger Scan-Beam auf Hover */
@keyframes matrixScanBeam {
    0%    { top: -65px; opacity: 0; }
    8%    {             opacity: 1; }
    92%   {             opacity: 0.85; }
    100%  { top: calc(100% + 65px); opacity: 0; }
}

/* Tooltip-Scan: 2s Sweep + 5s Pause = 7s */
@keyframes matrixScanPos {
    0%      { background-position: 0 -60px; }
    28.5%   { background-position: 0 calc(100% + 60px); }
    100%    { background-position: 0 calc(100% + 60px); }
}

/* Terminal-Cursor-Blink */
@keyframes terminalBlink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0; }
}

/* Icon-Flicker */
@keyframes matrixIconFlicker {
    0%, 90%, 100% { filter: var(--icon-filter); opacity: 1; }
    91%           { opacity: 0.35; }
    92%           { opacity: 1; }
    95%           { opacity: 0.7; }
    96%           { opacity: 1; }
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – GLOBAL BACKGROUND
   CRT-Terminal: fast schwarzer Hintergrund, Phosphor-Schein,
   Scanlines, feines Raster
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] body {
    background-image:
        /* Phosphor-Vignette: Mitte leicht heller */
        radial-gradient(ellipse 90% 80% at 50% 50%,
            hsla(120 40% 5% / 0.6) 0%,
            transparent 100%),
        /* Feines Raster */
        linear-gradient(hsla(120 100% 50% / 0.022) 1px, transparent 1px),
        linear-gradient(90deg, hsla(120 100% 50% / 0.015) 1px, transparent 1px);
    background-color: hsl(120 12% 2%);
    background-size: 100%, 28px 28px, 28px 28px;
    background-attachment: fixed;
}

/* CRT-Effekt: Scanlines + Phosphor-Vignette */
[data-theme="source-code"] body::after {
    content: '';
    position: fixed;
    inset: 0;
    background:
        repeating-linear-gradient(
            0deg,
            transparent          0px,
            transparent          2px,
            hsla(120 60% 0% / 0.16) 2px,
            hsla(120 60% 0% / 0.16) 3px
        ),
        radial-gradient(
            ellipse at 50% 50%,
            transparent 55%,
            hsla(0 0% 0% / 0.55) 100%
        );
    pointer-events: none;
    z-index: var(--z-max);
}

/* Alle Bilder: Phosphor-Monochrom grün */
[data-theme="source-code"] img {
    filter: grayscale(100%) sepia(80%) hue-rotate(75deg) saturate(600%) brightness(0.9) contrast(1.25);
}

/* Icon-themed: eigene grüne Filter-Variable beibehalten */
[data-theme="source-code"] .icon-themed {
    filter: var(--icon-filter);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – TYPOGRAPHY
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] h1,
[data-theme="source-code"] h2,
[data-theme="source-code"] h3 {
    color: hsl(120 100% 55%);
    text-shadow:
        0 0 6px  hsl(120 100% 50% / 0.55),
        0 0 14px hsl(120 100% 50% / 0.2);
    letter-spacing: var(--tracking-wider);
    animation: phosphorFlicker 8s linear infinite;
    font-family: var(--font-mono);
    text-transform: uppercase;
}

[data-theme="source-code"] h4,
[data-theme="source-code"] h5,
[data-theme="source-code"] h6 {
    color: hsl(120 85% 48%);
    text-shadow: 0 0 8px hsl(120 100% 50% / 0.35);
    letter-spacing: var(--tracking-wide);
    font-family: var(--font-mono);
}

/* Logo */
[data-theme="source-code"] .logo,
[data-theme="source-code"] img[src*="logo"] {
    filter: drop-shadow(0 0 6px hsl(120 100% 50% / 0.5))
            drop-shadow(0 0 18px hsl(120 100% 50% / 0.2));
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – MODAL
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .modal {
    border: 1px solid hsla(120 100% 50% / 0.35);
    box-shadow:
        0 0 12px hsla(120 100% 50% / 0.14),
        inset 0 0 20px hsla(120 100% 50% / 0.03),
        var(--shadow-2xl);
    background: linear-gradient(180deg,
        hsl(120 10% 3% / 0.98),
        hsl(120 8%  4% / 0.99));
    position: relative;
}

/* Binär-/Katakana-Rauschen als Wasserzeichen */
[data-theme="source-code"] .modal::before {
    content: '01001101 01000001 01010100 01010010 01001001 01011000\A10101010 11001100 10110011 01010101 11010101 01100110\A01110111 00101010 11001001 01010110 10101100 01011010';
    white-space: pre;
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    font-family: var(--font-mono);
    font-size: 9px;
    line-height: 14px;
    color: hsla(120 100% 50% / 0.025);
    overflow: hidden;
    pointer-events: none;
    user-select: none;
    padding: 8px;
}

/* L-Bracket oben rechts */
[data-theme="source-code"] .modal::after {
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 18px; height: 18px;
    border-top:   2px solid hsl(120 100% 50% / 0.6);
    border-right: 2px solid hsl(120 100% 50% / 0.6);
    pointer-events: none;
}

[data-theme="source-code"] .modal-header {
    background: linear-gradient(135deg,
        hsla(120 100% 50% / 0.08),
        transparent);
    border-bottom: 1px solid hsla(120 100% 50% / 0.25);
}

[data-theme="source-code"] .modal-title {
    color: hsl(120 100% 60%);
    text-shadow:
        0 0 8px  hsl(120 100% 50% / 0.7),
        0 0 20px hsl(120 100% 50% / 0.3);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
    font-family: var(--font-mono);
}

[data-theme="source-code"] .modal-footer {
    border-top: 1px solid hsla(120 100% 50% / 0.2);
    background: hsl(120 10% 3% / 0.9);
}

[data-theme="source-code"] .modal-close {
    color: hsla(120 100% 50% / 0.6);
}

[data-theme="source-code"] .modal-close:hover {
    background: hsla(120 100% 50% / 0.08);
    color: hsl(120 100% 65%);
    box-shadow: 0 0 10px hsla(120 100% 50% / 0.35);
}

[data-theme="source-code"] .modal-danger {
    border-color: hsl(0 100% 45%);
    box-shadow: 0 0 14px hsla(0 100% 45% / 0.18);
}

[data-theme="source-code"] .modal-gm {
    border-color: hsl(45 100% 50%);
    box-shadow: 0 0 14px hsla(45 100% 50% / 0.18);
}

/* Scanlines in Modal-Body */
[data-theme="source-code"] .modal-body {
    position: relative;
}

[data-theme="source-code"] .modal-body::before {
    content: '';
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 2px,
        hsla(0 0% 0% / 0.06) 2px,
        hsla(0 0% 0% / 0.06) 4px
    );
    pointer-events: none;
    opacity: 0.5;
    z-index: 0;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – BUTTONS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .btn-primary {
    background: transparent;
    border: 1px solid hsl(120 100% 50% / 0.7);
    color: hsl(120 100% 60%);
    box-shadow:
        0 0 8px hsla(120 100% 50% / 0.3),
        inset 0 0 12px hsla(120 100% 50% / 0.05);
    font-family: var(--font-mono);
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

[data-theme="source-code"] .btn-primary:hover {
    background: hsla(120 100% 50% / 0.12);
    border-color: hsl(120 100% 60%);
    color: hsl(120 100% 72%);
    box-shadow:
        0 0 18px hsla(120 100% 50% / 0.55),
        0 0 40px hsla(120 100% 50% / 0.2),
        inset 0 0 16px hsla(120 100% 50% / 0.08);
}

[data-theme="source-code"] .btn-secondary {
    background: transparent;
    border: 1px solid hsla(120 100% 50% / 0.3);
    color: hsl(120 80% 50%);
    font-family: var(--font-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

[data-theme="source-code"] .btn-secondary:hover {
    background: hsla(120 100% 50% / 0.07);
    border-color: hsla(120 100% 50% / 0.6);
    color: hsl(120 100% 60%);
    box-shadow: 0 0 12px hsla(120 100% 50% / 0.3);
}

[data-theme="source-code"] .btn-danger {
    background: transparent;
    border: 1px solid hsl(0 100% 45% / 0.6);
    color: hsl(0 100% 55%);
    box-shadow: 0 0 8px hsla(0 100% 45% / 0.25);
    font-family: var(--font-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

[data-theme="source-code"] .btn-danger:hover {
    background: hsla(0 100% 45% / 0.1);
    border-color: hsl(0 100% 55%);
    box-shadow: 0 0 18px hsla(0 100% 45% / 0.5);
}

[data-theme="source-code"] .btn-gm {
    background: transparent;
    border: 1px solid hsl(45 100% 50% / 0.6);
    color: hsl(45 100% 60%);
    box-shadow: 0 0 8px hsla(45 100% 50% / 0.25);
    font-family: var(--font-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

[data-theme="source-code"] .btn-gm:hover {
    background: hsla(45 100% 50% / 0.1);
    box-shadow: 0 0 18px hsla(45 100% 50% / 0.45);
}

[data-theme="source-code"] .btn-ghost {
    color: hsl(120 80% 48%);
    font-family: var(--font-mono);
    letter-spacing: 0.06em;
}

[data-theme="source-code"] .btn-ghost:hover {
    background: hsla(120 100% 50% / 0.07);
    color: hsl(120 100% 60%);
}

[data-theme="source-code"] .tab-btn {
    background: hsl(120 8% 4% / 0.85);
    border-color: hsla(120 100% 50% / 0.2);
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

[data-theme="source-code"] .tab-btn:hover {
    background: hsl(120 10% 7% / 0.9);
    border-color: hsla(120 100% 50% / 0.5);
    box-shadow: 0 0 10px hsla(120 100% 50% / 0.25);
}

[data-theme="source-code"] .tab-btn.active {
    background: hsla(120 100% 50% / 0.12);
    border-color: hsl(120 100% 50% / 0.7);
    color: hsl(120 100% 65%);
    box-shadow:
        0 0 15px hsla(120 100% 50% / 0.4),
        inset 0 0 12px hsla(120 100% 50% / 0.06);
    font-weight: 700;
}

[data-theme="source-code"] .tab-btn.combat-active {
    background: hsla(0 100% 45% / 0.1) !important;
    border-color: hsl(0 100% 50% / 0.7) !important;
    color: hsl(0 100% 60%) !important;
    box-shadow: 0 0 15px hsla(0 100% 45% / 0.4) !important;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – CARDS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .card {
    border: 1px solid hsla(120 100% 50% / 0.18);
    box-shadow:
        0 0 8px  hsla(120 100% 50% / 0.06),
        inset 0 0 12px hsla(120 100% 50% / 0.02);
    background: hsl(120 8% 4% / 0.92);
    position: relative;
}

/* Phosphor-Leiste oben */
[data-theme="source-code"] .card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg,
        transparent,
        hsl(120 100% 50% / 0.5),
        transparent);
    pointer-events: none;
}

[data-theme="source-code"] .card:hover {
    border-color: hsla(120 100% 50% / 0.4);
    box-shadow:
        0 0 16px hsla(120 100% 50% / 0.14),
        inset 0 0 18px hsla(120 100% 50% / 0.03);
}

[data-theme="source-code"] .card:hover::before {
    background: linear-gradient(90deg,
        transparent,
        hsl(120 100% 60%),
        transparent);
}

[data-theme="source-code"] .card-gm {
    border-color: hsl(45 100% 50% / 0.35);
    box-shadow: 0 0 12px hsla(45 100% 50% / 0.2);
}

[data-theme="source-code"] .card-glass {
    background: hsl(120 8% 4% / 0.6);
    border-color: hsla(120 100% 50% / 0.15);
}

/* Character Card */
[data-theme="source-code"] .character-card {
    background: hsl(120 10% 4% / 0.96);
    border: 1px solid hsla(120 100% 50% / 0.2);
    position: relative;
}

[data-theme="source-code"] .character-card::before {
    content: '';
    position: absolute;
    top: 0; left: 20%; right: 20%;
    height: 1px;
    background: linear-gradient(90deg,
        transparent, hsl(120 100% 50% / 0.55), transparent);
    pointer-events: none;
}

[data-theme="source-code"] .character-card:hover {
    border-color: hsla(120 100% 50% / 0.45);
    box-shadow: 0 0 18px hsla(120 100% 50% / 0.18);
}

[data-theme="source-code"] .character-card-avatar {
    border: 2px solid hsla(120 100% 50% / 0.35);
    box-shadow:
        0 0 0 1px hsla(120 100% 50% / 0.15),
        0 0 10px hsla(120 100% 50% / 0.2);
    filter: saturate(0%) brightness(0.9) sepia(20%) hue-rotate(80deg);
}

[data-theme="source-code"] .character-card:hover .character-card-avatar {
    border-color: hsl(120 100% 50% / 0.65);
    box-shadow:
        0 0 0 1px hsla(120 100% 50% / 0.3),
        0 0 18px hsla(120 100% 50% / 0.4);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – FORMS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .input,
[data-theme="source-code"] .select,
[data-theme="source-code"] .textarea {
    border-color: hsla(120 100% 50% / 0.25);
    background: hsl(120 8% 4% / 0.85);
    color: hsl(120 85% 55%);
    font-family: var(--font-mono);
    caret-color: hsl(120 100% 55%);
}

[data-theme="source-code"] .input:hover:not(:disabled):not(:focus),
[data-theme="source-code"] .select:hover:not(:disabled):not(:focus) {
    border-color: hsla(120 100% 50% / 0.45);
}

[data-theme="source-code"] .input:focus,
[data-theme="source-code"] .select:focus,
[data-theme="source-code"] .textarea:focus {
    border-color: hsl(120 100% 50%);
    background: hsla(120 100% 50% / 0.05);
    box-shadow:
        0 0 12px hsla(120 100% 50% / 0.25),
        inset 0 0 8px hsla(120 100% 50% / 0.03);
    color: hsl(120 100% 65%);
}

[data-theme="source-code"] .input-error {
    border-color: hsl(0 100% 45%);
}

[data-theme="source-code"] .input-error:focus {
    box-shadow: 0 0 12px hsla(0 100% 45% / 0.3);
}

[data-theme="source-code"] .checkbox:checked,
[data-theme="source-code"] .radio:checked {
    background: hsl(120 100% 50%);
    border-color: hsl(120 100% 50%);
    box-shadow: 0 0 8px hsla(120 100% 50% / 0.5);
}

[data-theme="source-code"] .toggle:checked {
    background: hsl(120 100% 50%);
    border-color: hsl(120 100% 50%);
}

[data-theme="source-code"] .range {
    background: hsla(120 100% 50% / 0.12);
}

[data-theme="source-code"] .range::-webkit-slider-thumb {
    background: hsl(120 100% 50%);
    box-shadow: 0 0 8px hsla(120 100% 50% / 0.6);
    border-radius: 0;
}

[data-theme="source-code"] .range::-moz-range-thumb {
    background: hsl(120 100% 50%);
    box-shadow: 0 0 8px hsla(120 100% 50% / 0.6);
    border-radius: 0;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – TABLES
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] table {
    background: hsl(120 8% 3% / 0.92);
    border: 1px solid hsla(120 100% 50% / 0.18);
}

[data-theme="source-code"] th {
    background: hsla(120 100% 50% / 0.1);
    border-bottom: 1px solid hsla(120 100% 50% / 0.3);
    color: hsl(120 100% 58%);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-family: var(--font-mono);
    font-size: 0.78em;
    text-shadow: 0 0 6px hsl(120 100% 50% / 0.5);
}

[data-theme="source-code"] tr:hover {
    background: hsla(120 100% 50% / 0.06);
}

[data-theme="source-code"] td {
    border-bottom: 1px solid hsla(120 100% 50% / 0.08);
    font-family: var(--font-mono);
    color: hsl(120 70% 52%);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – WIDGETS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .widget-tile {
    background: hsl(120 8% 4% / 0.88);
    border: 1px solid hsla(120 100% 50% / 0.18);
    box-shadow: 0 0 8px hsla(120 100% 50% / 0.05);
    position: relative;
}

/* L-Bracket oben rechts */
[data-theme="source-code"] .widget-tile::after {
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 10px; height: 10px;
    border-top:   1px solid hsl(120 100% 50% / 0.5);
    border-right: 1px solid hsl(120 100% 50% / 0.5);
    pointer-events: none;
    transition: border-color var(--duration-150);
}

[data-theme="source-code"] .widget-tile:hover {
    border-color: hsla(120 100% 50% / 0.45);
    box-shadow:
        0 0 16px hsla(120 100% 50% / 0.18),
        inset 0 0 14px hsla(120 100% 50% / 0.04);
}

[data-theme="source-code"] .widget-tile:hover::after {
    border-color: hsl(120 100% 60% / 0.9);
    box-shadow: 2px -2px 6px hsl(120 100% 50% / 0.4);
}

[data-theme="source-code"] .widget-tile[data-widget-type="attack"] {
    background: hsla(0 80% 15% / 0.2);
    border-color: hsla(0 100% 45% / 0.25);
}

[data-theme="source-code"] .widget-tile[data-widget-type="attack"]:hover {
    box-shadow: 0 0 16px hsla(0 100% 45% / 0.25);
}

[data-theme="source-code"] .widget-title {
    color: hsl(120 100% 55%);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-family: var(--font-mono);
    font-size: 0.75em;
    text-shadow: 0 0 6px hsl(120 100% 50% / 0.4);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – NAVIGATION
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .navigation-bar {
    background: hsl(120 10% 3% / 0.99);
    border-bottom: 1px solid hsla(120 100% 50% / 0.3);
    animation: matrixNavPulse 4s ease-in-out infinite;
}

[data-theme="source-code"] .tab_btn {
    background: hsl(120 8% 5% / 0.85);
    border-color: hsla(120 100% 50% / 0.2);
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

[data-theme="source-code"] .tab_btn:hover {
    background: hsl(120 10% 8% / 0.9);
    border-color: hsla(120 100% 50% / 0.5);
    box-shadow: 0 0 12px hsla(120 100% 50% / 0.25);
}

[data-theme="source-code"] .navigation-bar .icon {
    filter: var(--icon-filter)
            drop-shadow(0 0 3px hsl(120 100% 50% / 0.4));
}

[data-theme="source-code"] .tab_btn:hover .icon,
[data-theme="source-code"] .tab-btn:hover .icon {
    filter: var(--icon-filter) drop-shadow(0 0 5px hsl(120 100% 50% / 0.8));
}

[data-theme="source-code"] .tab-btn.active .icon,
[data-theme="source-code"] .tab_btn.active .icon {
    filter: var(--icon-filter) drop-shadow(0 0 6px hsl(120 100% 55%));
    animation: matrixIconFlicker 6s linear infinite;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – BADGES & CHIPS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .badge,
[data-theme="source-code"] .chip,
[data-theme="source-code"] .tag {
    background: hsla(120 100% 50% / 0.08);
    border: 1px solid hsla(120 100% 50% / 0.35);
    color: hsl(120 100% 60%);
    font-family: var(--font-mono);
    font-size: 0.7em;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border-radius: 0;
    text-shadow: 0 0 4px hsl(120 100% 50% / 0.4);
}

[data-theme="source-code"] .badge-primary,
[data-theme="source-code"] .chip-primary {
    background: hsla(120 100% 50% / 0.14);
    border-color: hsla(120 100% 50% / 0.55);
    color: hsl(120 100% 68%);
}

[data-theme="source-code"] .badge-danger,
[data-theme="source-code"] .chip-danger {
    background: hsla(0 100% 45% / 0.1);
    border-color: hsla(0 100% 45% / 0.45);
    color: hsl(0 100% 60%);
    text-shadow: 0 0 4px hsl(0 100% 45% / 0.4);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – PROGRESS BARS (HP / MP / ED)
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .progress-container,
[data-theme="source-code"] .progress,
[data-theme="source-code"] progress {
    background: hsl(120 8% 3% / 0.9);
    border: 1px solid hsl(120 100% 50% / 0.45);
    box-shadow:
        0 0 6px  hsla(120 100% 50% / 0.2),
        inset 0 0 5px hsla(0 0% 0% / 0.5);
    border-radius: 0;
}

[data-theme="source-code"] #healthText,
[data-theme="source-code"] #magicText,
[data-theme="source-code"] #enduranceText {
    color: hsl(120 100% 72%);
    text-shadow:
        0 0 5px hsl(120 100% 50% / 0.9),
        0 0 12px hsl(120 100% 50% / 0.5);
    font-family: var(--font-mono);
    font-weight: 700;
    letter-spacing: 0.05em;
}

[data-theme="source-code"] .progress-fill,
[data-theme="source-code"] .bar-fill {
    background: linear-gradient(90deg,
        hsl(120 100% 30%),
        hsl(120 100% 50%));
    box-shadow: 0 0 8px hsla(120 100% 50% / 0.5);
}

[data-theme="source-code"] .health-bar {
    background: linear-gradient(90deg,
        hsl(120 100% 28%),
        hsl(120 100% 48%));
    box-shadow: 0 0 8px hsla(120 100% 50% / 0.55);
}

[data-theme="source-code"] .magic-bar {
    background: linear-gradient(90deg,
        hsl(120 60% 22%),
        hsl(120 80% 40%));
    box-shadow: 0 0 8px hsla(120 80% 42% / 0.5);
}

[data-theme="source-code"] .endurance-bar {
    background: linear-gradient(90deg,
        hsl(45 100% 28%),
        hsl(45 100% 48%));
    box-shadow: 0 0 8px hsla(45 100% 48% / 0.55);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – TOOLTIPS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .tooltip,
[data-theme="source-code"] .unified-tooltip,
[data-theme="source-code"] .basic-tooltip,
[data-theme="source-code"] .tooltiptext,
[data-theme="source-code"] .itooltip,
[data-theme="source-code"] .skilltooltip,
[data-theme="source-code"] .attrtooltip,
[data-theme="source-code"] .stattooltip,
[data-theme="source-code"] #item-tooltip {
    background-color: var(--color-tooltip-bg);
    border: 1px solid hsl(120 100% 50% / 0.4);
    color: var(--color-tooltip-text);
    font-family: var(--font-mono);
    border-radius: 0;
    box-shadow:
        0 0 16px hsla(120 100% 50% / 0.15),
        0 0 40px hsla(120 100% 50% / 0.04),
        inset 0 0 12px hsla(120 100% 50% / 0.02);
    position: relative;
    overflow: hidden;
    /* Scan-Animation via background-position */
    background-image: linear-gradient(180deg,
        transparent                0%,
        hsla(120 100% 55% / 0.06)  20%,
        hsla(120 100% 70% / 0.35)  48%,
        hsl(120 100% 85% / 0.55)   50%,
        hsla(120 100% 70% / 0.35)  52%,
        hsla(120 100% 55% / 0.06)  80%,
        transparent                100%
    );
    background-size: 100% 60px;
    background-repeat: no-repeat;
    background-position: 0 -60px;
    animation: matrixScanPos 7s linear infinite;
}

/* L-Bracket oben links */
[data-theme="source-code"] .tooltip::before,
[data-theme="source-code"] .unified-tooltip::before,
[data-theme="source-code"] .itooltip::before,
[data-theme="source-code"] .skilltooltip::before,
[data-theme="source-code"] .attrtooltip::before,
[data-theme="source-code"] .stattooltip::before,
[data-theme="source-code"] #item-tooltip::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 10px; height: 10px;
    border-top:  2px solid hsl(120 100% 55%);
    border-left: 2px solid hsl(120 100% 55%);
    pointer-events: none;
    z-index: 1;
}

/* L-Bracket unten rechts */
[data-theme="source-code"] .tooltip::after,
[data-theme="source-code"] .unified-tooltip::after,
[data-theme="source-code"] .itooltip::after,
[data-theme="source-code"] .skilltooltip::after,
[data-theme="source-code"] .attrtooltip::after,
[data-theme="source-code"] .stattooltip::after,
[data-theme="source-code"] #item-tooltip::after {
    content: '';
    position: absolute;
    bottom: 0; right: 0;
    width: 10px; height: 10px;
    border-bottom: 2px solid hsl(120 100% 55%);
    border-right:  2px solid hsl(120 100% 55%);
    pointer-events: none;
    z-index: 1;
}

/* Tooltip Titel */
[data-theme="source-code"] .tooltip-title,
[data-theme="source-code"] .itooltip-title,
[data-theme="source-code"] .skilltooltip-title,
[data-theme="source-code"] .attrtooltip-title,
[data-theme="source-code"] .stattooltip-title,
[data-theme="source-code"] .unified-tooltip .tooltip-title {
    color: var(--color-tooltip-highlight) !important;
    text-shadow:
        0 0 8px  hsl(120 100% 50% / 0.8),
        0 0 20px hsl(120 100% 50% / 0.35);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-family: var(--font-mono);
    font-weight: 700;
}

/* Tooltip Beschreibung */
[data-theme="source-code"] .itooltip-description,
[data-theme="source-code"] .skilltooltip-description,
[data-theme="source-code"] .attrtooltip-description,
[data-theme="source-code"] .unified-tooltip .tooltip-description,
[data-theme="source-code"] #item-tooltip div[style*="font-size: 14px"] {
    color: var(--color-tooltip-muted);
    font-family: var(--font-mono);
    font-size: 0.75rem !important;
    line-height: 1.4 !important;
}

/* TT-Zeilen */
[data-theme="source-code"] .tt-section {
    background: var(--color-tooltip-section-bg);
    border-left: 2px solid hsl(120 100% 50% / 0.35);
    font-family: var(--font-mono);
    font-size: 0.8rem;
}

[data-theme="source-code"] .tt-row {
    color: var(--color-tooltip-text);
    font-family: var(--font-mono);
    font-size: 0.8rem;
}

[data-theme="source-code"] .tt-row-sm {
    color: var(--color-tooltip-label);
    font-family: var(--font-mono);
    font-size: 0.73rem;
}

[data-theme="source-code"] .tt-dim {
    color: var(--color-tooltip-dim);
    font-family: var(--font-mono);
    font-size: 0.7rem;
}

[data-theme="source-code"] .tt-total-label {
    color: var(--color-tooltip-highlight);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: var(--font-mono);
}

[data-theme="source-code"] .tt-total-value {
    color: var(--color-tooltip-highlight);
    text-shadow: 0 0 8px hsl(120 100% 50% / 0.6);
    font-family: var(--font-mono);
    font-weight: 700;
}

[data-theme="source-code"] .tt-sep-accent {
    border-top: 1px solid hsl(120 100% 50% / 0.28);
    box-shadow: 0 0 5px hsla(120 100% 50% / 0.15);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – CHARACTER ITEM
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .character-item {
    background: hsl(120 8% 4% / 0.88);
    border-color: hsla(120 100% 50% / 0.18);
    font-family: var(--font-mono);
}

[data-theme="source-code"] .character-item:hover {
    border-color: hsla(120 100% 50% / 0.4);
    box-shadow: 0 0 14px hsla(120 100% 50% / 0.16);
}

[data-theme="source-code"] .character-info h3 {
    color: hsl(120 100% 58%);
    text-shadow: 0 0 6px hsla(120 100% 50% / 0.4);
    font-family: var(--font-mono);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – LOGIN CONTAINER
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .login-container {
    background: hsl(120 10% 3% / 0.98);
    border: 1px solid hsla(120 100% 50% / 0.4);
    box-shadow:
        0 0 30px hsla(120 100% 50% / 0.1),
        0 0 80px hsla(120 100% 50% / 0.04),
        inset 0 0 20px hsla(120 100% 50% / 0.03);
    animation: phosphorPulse 4s ease-in-out infinite;
    position: relative;
    overflow: hidden;
}

/* Scan-Linie über Login */
[data-theme="source-code"] .login-container::before {
    content: '';
    position: absolute;
    left: 0; right: 0; top: -3px;
    height: 3px;
    background: linear-gradient(90deg,
        transparent,
        hsl(120 100% 60% / 0.9),
        transparent);
    animation: matrixScanDown 6s linear infinite;
    pointer-events: none;
    z-index: 1;
}

/* L-Bracket oben rechts */
[data-theme="source-code"] .login-container::after {
    content: '';
    position: absolute;
    top: 8px; right: 8px;
    width: 18px; height: 18px;
    border-top:   2px solid hsl(120 100% 55%);
    border-right: 2px solid hsl(120 100% 55%);
    box-shadow: 3px -3px 8px hsl(120 100% 50% / 0.4);
    pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – SCROLLBARS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] ::-webkit-scrollbar-track {
    background: hsl(120 8% 3% / 0.6);
}

[data-theme="source-code"] ::-webkit-scrollbar-thumb {
    background: hsla(120 100% 50% / 0.25);
    border: 1px solid hsla(120 100% 50% / 0.4);
    border-radius: 0;
}

[data-theme="source-code"] ::-webkit-scrollbar-thumb:hover {
    background: hsla(120 100% 50% / 0.5);
    box-shadow: 0 0 8px hsla(120 100% 50% / 0.4);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – TEXT HIGHLIGHTS & SELECTION
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] ::selection {
    background: hsla(120 100% 50% / 0.3);
    color: hsl(120 100% 90%);
}

[data-theme="source-code"] ::-moz-selection {
    background: hsla(120 100% 50% / 0.3);
    color: hsl(120 100% 90%);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – ATTRIBUTE CARDS & SUBSKILLS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .attribute-cards-container {
    background: hsl(120 8% 3% / 0.5);
}

[data-theme="source-code"] .attribute-card {
    background: hsl(120 8% 4% / 0.92);
    border: 1px solid hsla(120 100% 50% / 0.18);
    position: relative;
}

/* L-Bracket unten rechts */
[data-theme="source-code"] .attribute-card::before {
    content: '';
    position: absolute;
    bottom: 0; right: 0;
    width: 0; height: 0;
    border-style: solid;
    border-width: 0 0 8px 8px;
    border-color: transparent transparent hsl(120 100% 50% / 0.25) transparent;
    pointer-events: none;
    transition: border-color var(--duration-150);
}

[data-theme="source-code"] .attribute-card:hover {
    border-color: hsla(120 100% 50% / 0.42);
    box-shadow:
        0 0 16px hsla(120 100% 50% / 0.16),
        inset 0 0 10px hsla(120 100% 50% / 0.03);
}

[data-theme="source-code"] .attribute-card:hover::before {
    border-color: transparent transparent hsl(120 100% 55% / 0.55) transparent;
}

[data-theme="source-code"] .attribute-name {
    color: hsl(120 100% 55%);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: var(--font-mono);
    font-size: 0.8em;
    text-shadow: 0 0 5px hsl(120 100% 50% / 0.4);
}

[data-theme="source-code"] .attribute-icon-container {
    background: hsla(120 100% 50% / 0.1);
    color: hsl(120 100% 55%);
    border: 1px solid hsla(120 100% 50% / 0.28);
    border-radius: 0;
    box-shadow:
        0 0 6px hsla(120 100% 50% / 0.25),
        inset 0 0 4px hsla(120 100% 50% / 0.08);
    animation: phosphorPulse 5s ease-in-out infinite;
}

[data-theme="source-code"] .attribute-value {
    color: hsl(120 100% 58%);
    text-shadow: 0 0 8px hsl(120 100% 50% / 0.55);
    font-family: var(--font-mono);
    animation: valueGlowGreen 3.5s ease-in-out infinite;
}

[data-theme="source-code"] .attribute-bonus {
    background: hsla(120 100% 50% / 0.1);
    color: hsl(120 100% 60%);
    font-family: var(--font-mono);
    border-radius: 0;
}

[data-theme="source-code"] .attribute-subskills {
    background: hsl(120 8% 5% / 0.85);
    border: 1px solid hsla(120 100% 50% / 0.18);
}

[data-theme="source-code"] .subskill-item {
    border-bottom-color: hsla(120 100% 50% / 0.12);
}

[data-theme="source-code"] .subskill-name {
    color: hsl(120 100% 58%);
    font-family: var(--font-mono);
    font-size: 0.85em;
    text-shadow: 0 0 5px hsl(120 100% 50% / 0.3);
}

[data-theme="source-code"] .subskill-effect {
    color: hsl(120 70% 50%);
    font-family: var(--font-mono);
}

[data-theme="source-code"] .roll-button {
    background: transparent;
    border: 1px solid hsl(120 100% 50% / 0.6);
    border-radius: 0;
    color: hsl(120 100% 60%);
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 700;
}

[data-theme="source-code"] .roll-button:hover {
    background: hsla(120 100% 50% / 0.1);
    border-color: hsl(120 100% 65%);
    box-shadow: 0 0 14px hsla(120 100% 50% / 0.5);
}

[data-theme="source-code"] .roll-result {
    background: hsl(120 8% 4% / 0.88);
    color: hsl(120 100% 62%);
    border: 1px solid hsla(120 100% 50% / 0.3);
    font-family: var(--font-mono);
    text-shadow: 0 0 7px hsl(120 100% 50% / 0.5);
    border-radius: 0;
}

[data-theme="source-code"] .roll-result:not(:empty) {
    box-shadow:
        0 0 12px hsla(120 100% 50% / 0.35),
        0 0 35px hsla(120 100% 50% / 0.12),
        inset 0 0 10px hsla(120 100% 50% / 0.06);
    animation: valueGlowGreen 2.5s ease-in-out infinite;
}

/* Attribute-Kategorien mit Farbakzent */
[data-theme="source-code"] .attribute-card.physical {
    border-left: 2px solid hsl(120 100% 50%);
}

[data-theme="source-code"] .attribute-card.mental {
    border-left: 2px solid hsl(120 70% 42%);
}

[data-theme="source-code"] .attribute-card.social {
    border-left: 2px solid hsl(45 100% 50%);
}

[data-theme="source-code"] .attribute-card.special {
    border-left: 2px solid hsl(0 100% 45%);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – CHAR-NAME PHOSPHOR-DECAY
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] #charNameLabel,
[data-theme="source-code"] .character-info h3,
[data-theme="source-code"] .character-name,
[data-theme="source-code"] .char-name,
[data-theme="source-code"] .character-card .name,
[data-theme="source-code"] .character-card h3,
[data-theme="source-code"] .character-card h4 {
    color: hsl(120 100% 62%);
    text-shadow:
        0 0 8px  hsl(120 100% 50% / 0.65),
        0 0 22px hsl(120 100% 50% / 0.28);
    animation: charNameDecay 5s linear infinite;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-family: var(--font-mono);
}

/* Versetzt damit sie nicht synchron feuern */
[data-theme="source-code"] .character-item:nth-child(2) .character-info h3,
[data-theme="source-code"] .character-item:nth-child(2) .character-name {
    animation-delay: -1.8s;
}

[data-theme="source-code"] .character-item:nth-child(3) .character-info h3,
[data-theme="source-code"] .character-item:nth-child(3) .character-name {
    animation-delay: -3.4s;
}

[data-theme="source-code"] .character-item:nth-child(4) .character-info h3,
[data-theme="source-code"] .character-item:nth-child(4) .character-name {
    animation-delay: -0.7s;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – GLOW UTILITIES
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .glow-primary {
    box-shadow: 0 0 18px hsla(120 100% 50% / 0.5);
}

[data-theme="source-code"] .glow-accent {
    box-shadow: 0 0 18px hsla(120 100% 50% / 0.5);
}

[data-theme="source-code"] .glow-danger {
    box-shadow: 0 0 18px hsla(0 100% 45% / 0.5);
}

[data-theme="source-code"] .glow-gm {
    box-shadow: 0 0 18px hsla(45 100% 50% / 0.45);
}

[data-theme="source-code"] .neon-green,
[data-theme="source-code"] .text-neon {
    color: hsl(120 100% 60%);
    text-shadow:
        0 0 7px  hsl(120 100% 50% / 0.7),
        0 0 18px hsl(120 100% 50% / 0.35);
}

[data-theme="source-code"] .neon-amber {
    color: hsl(45 100% 58%);
    text-shadow:
        0 0 7px  hsl(45 100% 50% / 0.7),
        0 0 18px hsl(45 100% 50% / 0.35);
}

/* Avatar/Portrait: desaturiert und grün eingefärbt */
[data-theme="source-code"] .character-card-avatar,
[data-theme="source-code"] .avatar,
[data-theme="source-code"] .portrait {
    filter: saturate(0%) brightness(0.85) sepia(30%) hue-rotate(75deg);
    box-shadow:
        0 0 0 1px hsla(120 100% 50% / 0.35),
        0 0 10px hsla(120 100% 50% / 0.25);
}

[data-theme="source-code"] .character-card:hover .character-card-avatar,
[data-theme="source-code"] .character-card:hover .avatar,
[data-theme="source-code"] .character-card:hover .portrait {
    filter: saturate(10%) brightness(1) sepia(40%) hue-rotate(75deg);
    box-shadow:
        0 0 0 1px hsl(120 100% 50% / 0.55),
        0 0 18px hsla(120 100% 50% / 0.45);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – SCAN-ANIMATIONEN
   Hover-triggered auf Karten/Widgets.
   Tooltips: immer aktiv mit 5s Pause zwischen Scans.
   ═══════════════════════════════════════════════════════════════ */

/* ── HOVER-SCAN: Attribute Cards (::after frei) ──────────────── */

[data-theme="source-code"] .attribute-card {
    overflow: hidden;
}

[data-theme="source-code"] .attribute-card::after {
    content: '';
    position: absolute;
    left: 0; right: 0; top: -60px; height: 60px;
    background: linear-gradient(180deg,
        transparent                0%,
        hsla(120 100% 55% / 0.03)  30%,
        hsla(120 100% 65% / 0.3)   49%,
        hsl(120 100% 80% / 0.55)   50%,
        hsla(120 100% 65% / 0.3)   51%,
        hsla(120 100% 55% / 0.03)  70%,
        transparent                100%);
    opacity: 0;
    pointer-events: none;
    z-index: 2;
}

[data-theme="source-code"] .attribute-card:hover::after {
    animation: matrixScanBeam 1.5s linear 1 forwards;
}

/* ── HOVER-SCAN: Widget Tiles (::before frei) ────────────────── */

[data-theme="source-code"] .widget-tile {
    overflow: hidden;
}

[data-theme="source-code"] .widget-tile::before {
    content: '';
    position: absolute;
    left: 0; right: 0; top: -55px; height: 55px;
    background: linear-gradient(180deg,
        transparent                0%,
        hsla(120 100% 55% / 0.03)  30%,
        hsla(120 100% 65% / 0.28)  49%,
        hsl(120 100% 80% / 0.5)    50%,
        hsla(120 100% 65% / 0.28)  51%,
        hsla(120 100% 55% / 0.03)  70%,
        transparent                100%);
    opacity: 0;
    pointer-events: none;
    z-index: 2;
}

[data-theme="source-code"] .widget-tile:hover::before {
    animation: matrixScanBeam 1.5s linear 1 forwards;
}

/* ── HOVER-SCAN: Character Cards (::after frei) ──────────────── */

[data-theme="source-code"] .character-card {
    overflow: hidden;
}

[data-theme="source-code"] .character-card::after {
    content: '';
    position: absolute;
    left: 0; right: 0; top: -65px; height: 65px;
    background: linear-gradient(180deg,
        transparent                0%,
        hsla(120 100% 55% / 0.03)  30%,
        hsla(120 100% 65% / 0.28)  49%,
        hsl(120 100% 80% / 0.5)    50%,
        hsla(120 100% 65% / 0.28)  51%,
        hsla(120 100% 55% / 0.03)  70%,
        transparent                100%);
    opacity: 0;
    pointer-events: none;
    z-index: 2;
}

[data-theme="source-code"] .character-card:hover::after {
    animation: matrixScanBeam 1.8s linear 1 forwards;
}

/* ── HOVER-SCAN: Character Items ─────────────────────────────── */

[data-theme="source-code"] .character-item {
    position: relative;
    overflow: hidden;
}

[data-theme="source-code"] .character-item::after {
    content: '';
    position: absolute;
    left: 0; right: 0; top: -50px; height: 50px;
    background: linear-gradient(180deg,
        transparent                0%,
        hsla(120 100% 55% / 0.03)  30%,
        hsla(120 100% 65% / 0.25)  49%,
        hsl(120 100% 80% / 0.45)   50%,
        hsla(120 100% 65% / 0.25)  51%,
        hsla(120 100% 55% / 0.03)  70%,
        transparent                100%);
    opacity: 0;
    pointer-events: none;
    z-index: 2;
}

[data-theme="source-code"] .character-item:hover::after {
    animation: matrixScanBeam 1.4s linear 1 forwards;
}

/* Pseudo-zufällige Verzögerungen für Character Items */
[data-theme="source-code"] .character-item:nth-child(2):hover::after {
    animation-delay: 0.05s;
}
[data-theme="source-code"] .character-item:nth-child(3):hover::after {
    animation-delay: 0.12s;
}
[data-theme="source-code"] .character-item:nth-child(4):hover::after {
    animation-delay: 0.03s;
}

/* ── TERMINAL CURSOR KLASSE ──────────────────────────────────── */

[data-theme="source-code"] .blink-cursor::after {
    content: '█';
    animation: terminalBlink 1s step-end infinite;
    color: hsl(120 100% 55%);
    text-shadow: 0 0 6px hsl(120 100% 50% / 0.8);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – LOAD_INFO / STATS PANEL
   ═══════════════════════════════════════════════════════════════ */

/* ── Kategorie-Header (Statuswerte / Kampf / etc.) ───────────── */

[data-theme="source-code"] .info-category-header {
    background: hsl(120 10% 4%);
    border: 1px solid hsl(120 100% 50% / 0.35);
    border-left: 3px solid hsl(120 100% 50% / 0.8);
    color: hsl(120 100% 62%) !important;
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.8em;
    text-shadow:
        0 0 6px  hsl(120 100% 50% / 0.6),
        0 0 14px hsl(120 100% 50% / 0.2);
    border-radius: 0;
}

[data-theme="source-code"] .info-category-header:hover {
    background: hsl(120 10% 6%);
    border-color: hsl(120 100% 50% / 0.65);
    border-left-color: hsl(120 100% 60%);
    box-shadow: 0 0 10px hsla(120 100% 50% / 0.15);
}

/* ── Subkategorie-Header (Offensiv / Defensiv / etc.) ────────── */

[data-theme="source-code"] .info-subcategory-header {
    background: hsl(120 8% 3%);
    border: 1px solid hsl(120 100% 50% / 0.2);
    border-left: 2px solid hsl(120 100% 50% / 0.5);
    color: hsl(120 85% 52%) !important;
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.75em;
    border-radius: 0;
}

[data-theme="source-code"] .info-subcategory-header:hover {
    background: hsl(120 8% 5%);
    border-color: hsl(120 100% 50% / 0.4);
}

/* ── Stat-Items (einzelne Werte) ─────────────────────────────── */

[data-theme="source-code"] .stat-item {
    background: hsl(120 8% 4% / 0.8);
    border: 1px solid hsl(120 100% 50% / 0.12);
    border-radius: 0;
    position: relative;
}

[data-theme="source-code"] .stat-item:hover {
    background: hsl(120 10% 7% / 0.9);
    border-color: hsl(120 100% 50% / 0.35);
    box-shadow: 0 0 8px hsla(120 100% 50% / 0.12);
}

/* L-Bracket unten rechts auf jedem Stat-Item */
[data-theme="source-code"] .stat-item::after {
    content: '';
    position: absolute;
    bottom: 0; right: 0;
    width: 5px; height: 5px;
    border-bottom: 1px solid hsl(120 100% 50% / 0.35);
    border-right:  1px solid hsl(120 100% 50% / 0.35);
    pointer-events: none;
}

[data-theme="source-code"] .stat-label {
    color: hsl(120 60% 45%);
    font-family: var(--font-mono);
    font-size: 0.72em;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

[data-theme="source-code"] .stat-value,
[data-theme="source-code"] .info-value {
    font-family: var(--font-mono);
    font-weight: 700;
    text-shadow: 0 0 6px currentColor;
}

/* ── Talent-Items ────────────────────────────────────────────── */

[data-theme="source-code"] .talent-item {
    background: hsl(120 8% 4% / 0.85);
    border: 1px solid hsl(120 100% 50% / 0.15);
    border-radius: 0;
}

[data-theme="source-code"] .talent-item:hover {
    border-color: hsl(120 100% 50% / 0.4);
    box-shadow: 0 0 10px hsla(120 100% 50% / 0.12);
}

/* ── ARMORY ──────────────────────────────────────────────────── */

[data-theme="source-code"] .equipment-table {
    width: 100%;
    border-collapse: collapse;
    background: hsl(120 12% 2%);
    border: 1px solid hsl(120 100% 50% / 0.2);
}

[data-theme="source-code"] .equipment-table th {
    background: hsl(120 12% 3%);
    color: hsl(120 100% 55%);
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-size: 0.68rem;
    font-family: var(--font-mono);
    border-bottom: 1px solid hsl(120 100% 50% / 0.35);
    padding: 0.5rem var(--space-sm);
    text-shadow: 0 0 8px hsl(120 100% 50% / 0.6);
}

[data-theme="source-code"] .equipment-table td {
    border-bottom: 1px solid hsl(120 100% 50% / 0.07);
}

[data-theme="source-code"] .equipment-table tr:hover td {
    background: hsl(120 100% 50% / 0.04);
}

/* Alle Select-Elemente im Matrix-Theme */
[data-theme="source-code"] select,
[data-theme="source-code"] .select,
[data-theme="source-code"] .form-select,
[data-theme="source-code"] .equipment-select {
    appearance: none;
    -webkit-appearance: none;
    background-color: hsl(120 12% 2%);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2300ff00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
    background-size: 14px;
    border: 1px solid hsl(120 100% 50% / 0.3);
    border-radius: 0;
    color: hsl(120 100% 55%);
    font-family: var(--font-mono);
    font-size: 0.8rem;
    padding: 0.3rem 1.8rem 0.3rem 0.5rem;
    outline: none;
    cursor: pointer;
    text-shadow: 0 0 5px hsl(120 100% 50% / 0.35);
    transition: border-color 0.08s steps(2, end), box-shadow 0.08s steps(2, end);
}

[data-theme="source-code"] select:hover:not(:disabled),
[data-theme="source-code"] .select:hover:not(:disabled),
[data-theme="source-code"] .form-select:hover:not(:disabled),
[data-theme="source-code"] .equipment-select:hover:not(:disabled) {
    border-color: hsl(120 100% 50% / 0.6);
}

[data-theme="source-code"] select:focus,
[data-theme="source-code"] .select:focus,
[data-theme="source-code"] .form-select:focus,
[data-theme="source-code"] .equipment-select:focus {
    border-color: hsl(120 100% 50%);
    box-shadow: 0 0 10px hsl(120 100% 50% / 0.35), inset 0 0 4px hsl(120 100% 50% / 0.1);
}

[data-theme="source-code"] select:disabled,
[data-theme="source-code"] .select:disabled,
[data-theme="source-code"] .form-select:disabled,
[data-theme="source-code"] .equipment-select:disabled {
    background-color: hsl(120 12% 2%);
    color: hsl(120 100% 50% / 0.15);
    border-color: hsl(120 100% 50% / 0.06);
    cursor: not-allowed;
}

/* Option-Elemente (Chromium/Firefox) */
[data-theme="source-code"] select option {
    background-color: hsl(120 12% 3%);
    color: hsl(120 100% 55%);
    font-family: var(--font-mono);
    font-size: 0.8rem;
}

[data-theme="source-code"] select option:checked,
[data-theme="source-code"] select option:hover {
    background-color: hsl(120 100% 50% / 0.12);
    color: hsl(120 100% 75%);
}

[data-theme="source-code"] .twohanded-toggle {
    background: hsl(120 12% 2%);
    border: 2px solid hsl(120 100% 50% / 0.4);
    border-radius: 0;
}

[data-theme="source-code"] .twohanded-toggle:hover {
    border-color: hsl(120 100% 50%);
    box-shadow: 0 0 10px hsl(120 100% 50% / 0.4);
}

[data-theme="source-code"] .twohanded-toggle.active {
    background: hsl(120 100% 50% / 0.15);
    border-color: hsl(120 100% 55%);
    box-shadow:
        0 0 10px hsl(120 100% 50% / 0.5),
        inset 0 0 8px hsl(120 100% 50% / 0.2);
}

[data-theme="source-code"] .twohanded-tooltip {
    background: hsl(120 12% 2%);
    border: 1px solid hsl(120 100% 50% / 0.25);
    color: hsl(120 100% 55%);
    font-family: var(--font-mono);
    font-size: 0.68rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-shadow: 0 0 6px hsl(120 100% 50% / 0.5);
    border-radius: 0;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – ACTIVITY ICONS (important override)
   Überschreibt spezifischere drop-shadow-Regel in widgets-style.css
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .skill-icon-container img,
[data-theme="source-code"] .activity-icon-container img,
[data-theme="source-code"] .activity-icon,
[data-theme="source-code"] .widget-icon,
[data-theme="source-code"] .widget-tile .activity-icon,
[data-theme="source-code"] .widget-tile:hover .activity-icon {
    filter: var(--icon-filter) !important;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – SPELL TILES
   Phosphor-Grün für alle Elemente (Single-Color Aesthetic)
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] {
    /* Alle Elemente: einheitliches Phosphor-Grün */
    --element-fire-bg:      hsl(120 12% 2%); --element-fire-border:    hsl(120 100% 50% / 0.45); --element-fire-hover:    hsl(120 10% 6%); --element-fire-glow:    hsl(120 100% 50% / 0.15);
    --element-water-bg:     hsl(120 12% 2%); --element-water-border:   hsl(120 100% 50% / 0.45); --element-water-hover:   hsl(120 10% 6%); --element-water-glow:   hsl(120 100% 50% / 0.15);
    --element-earth-bg:     hsl(120 12% 2%); --element-earth-border:   hsl(120 100% 50% / 0.45); --element-earth-hover:   hsl(120 10% 6%); --element-earth-glow:   hsl(120 100% 50% / 0.15);
    --element-wind-bg:      hsl(120 12% 2%); --element-wind-border:    hsl(120 100% 50% / 0.45); --element-wind-hover:    hsl(120 10% 6%); --element-wind-glow:    hsl(120 100% 50% / 0.15);
    --element-light-bg:     hsl(120 12% 2%); --element-light-border:   hsl(120 100% 50% / 0.45); --element-light-hover:   hsl(120 10% 6%); --element-light-glow:   hsl(120 100% 50% / 0.15);
    --element-shadow-bg:    hsl(120 12% 2%); --element-shadow-border:  hsl(120 100% 50% / 0.45); --element-shadow-hover:  hsl(120 10% 6%); --element-shadow-glow:  hsl(120 100% 50% / 0.15);
    --element-death-bg:     hsl(120 12% 2%); --element-death-border:   hsl(120 100% 50% / 0.45); --element-death-hover:   hsl(120 10% 6%); --element-death-glow:   hsl(120 100% 50% / 0.15);
    --element-life-bg:      hsl(120 12% 2%); --element-life-border:    hsl(120 100% 50% / 0.55); --element-life-hover:    hsl(120 10% 6%); --element-life-glow:    hsl(120 100% 50% / 0.2);
    --element-arcane-bg:    hsl(120 12% 2%); --element-arcane-border:  hsl(120 100% 50% / 0.45); --element-arcane-hover:  hsl(120 10% 6%); --element-arcane-glow:  hsl(120 100% 50% / 0.15);
    --element-mind-bg:      hsl(120 12% 2%); --element-mind-border:    hsl(120 100% 50% / 0.45); --element-mind-hover:    hsl(120 10% 6%); --element-mind-glow:    hsl(120 100% 50% / 0.15);
    --element-physical-bg:  hsl(120 12% 2%); --element-physical-border:hsl(120 100% 50% / 0.45); --element-physical-hover:hsl(120 10% 6%); --element-physical-glow:hsl(120 100% 50% / 0.15);
    /* Temporäre Zauber */
    --spell-temp-bg:              hsl(120 12% 2%);
    --spell-temp-border:          hsl(120 100% 50% / 0.65);
    --spell-temp-hover-bg:        hsl(120 10% 6%);
    --spell-temp-hover-glow:      hsl(120 100% 50% / 0.2);
    --spell-temp-badge-bg:        hsl(120 100% 50%);
    --spell-temp-header-bg:       hsl(120 10% 4%);
    --spell-temp-header-hover-bg: hsl(120 10% 7%);
    --spell-tile-hover-bg:        hsl(120 10% 6%);
}

[data-theme="source-code"] .spell-icon {
    filter: var(--icon-filter);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – RESISTANCES
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .resistance-icon {
    filter: var(--icon-filter);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – INVENTORY & WEIGHT
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] {
    --item-tile-base:             hsl(120 10% 4%);
    --item-tile-border:           hsl(120 100% 50% / 0.3);
    --item-tile-add-bg:           hsl(120 10% 4%);
    --item-tile-add-border:       hsl(120 100% 50% / 0.25);
    --item-tile-add-hover:        hsl(120 10% 8%);
    --item-tile-add-border-hover: hsl(120 100% 50% / 0.55);
    --weight-display-bg:          hsl(120 12% 2%);
    --weight-ok-color:            hsl(120 100% 50%);
    --weight-warn-color:          hsl(120 70%  30%);
    --weight-crit-color:          hsl(120 40%  15%);
    --weight-bar-track-bg:        hsl(120 8% 6%);
    --color-heal:                 hsl(120 100% 50%);
}

[data-theme="source-code"] .weight-progress-container {
    background-color: hsl(120 8% 4%);
    border: 1px solid hsl(120 100% 50% / 0.3);
    border-radius: 3px;
    align-self: center;
}

[data-theme="source-code"] .weight-progress-bar.weight-ok {
    background-color: hsl(120 100% 50%) !important;
    box-shadow: 0 0 6px hsl(120 100% 50% / 0.5);
}

[data-theme="source-code"] .weight-progress-bar.weight-warn {
    background-color: hsl(120 70% 30%) !important;
    box-shadow: 0 0 4px hsl(120 70% 30% / 0.4);
}

[data-theme="source-code"] .weight-progress-bar.weight-crit {
    background-color: hsl(120 40% 15%) !important;
    box-shadow: none;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – CURRENCY TILES
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] {
    --currency-tile-bg:           hsl(120 10% 4%);
    --currency-tile-border:       hsl(120 100% 50% / 0.3);
    --currency-tile-hover-bg:     hsl(120 10% 8%);
    --currency-tile-hover-shadow: hsl(120 100% 50% / 0.2);
    --currency-quantity-bg:       hsl(120 100% 50% / 0.15);
    --currency-add-bg:            hsl(120 10% 4%);
    --currency-add-border:        hsl(120 100% 50% / 0.3);
    --currency-add-hover-bg:      hsl(120 10% 8%);
    --currency-add-hover-border:  hsl(120 100% 50% / 0.6);
    --color-gold:                 hsl(120 100% 50%);
}

[data-theme="source-code"] .currency-icon {
    filter: var(--icon-filter);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – ACTIVE BUFFS
   Buff=hellgrün, Debuff=dunkelgrün, Neutral=sehr subtil
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] {
    --color-buff-tile-bg:        hsl(120 10% 4%);
    --color-buff-tile-border:    hsl(120 100% 50% / 0.45);
    --color-buff-tile-hover:     hsl(120 10% 8%);
    --color-buff-tile-glow:      hsl(120 100% 50% / 0.15);
    --color-debuff-tile-bg:      hsl(120 10% 4%);
    --color-debuff-tile-border:  hsl(120 35%  25% / 0.6);
    --color-debuff-tile-hover:   hsl(120 10% 8%);
    --color-debuff-tile-glow:    hsl(120 35%  25% / 0.1);
    --color-neutral-tile-bg:     hsl(120 10% 4%);
    --color-neutral-tile-border: hsl(120 100% 50% / 0.2);
    --color-neutral-tile-hover:  hsl(120 10% 8%);
    --color-neutral-tile-glow:   hsl(120 100% 50% / 0.08);
    --color-buff-indicator:      hsl(120 100% 50%);
    --color-debuff-indicator:    hsl(120 35%  25%);
}

[data-theme="source-code"] .buff-icon {
    filter: var(--icon-filter);
}

[data-theme="source-code"] .buff-duration {
    background-color: hsl(120 100% 50% / 0.2);
    color: hsl(120 100% 65%);
    border: 1px solid hsl(120 100% 50% / 0.5);
    text-shadow: 0 0 6px hsl(120 100% 50% / 0.7);
}

[data-theme="source-code"] .remove-buff-btn {
    background: hsl(120 10% 6%) !important;
    color: hsl(120 60% 45%) !important;
    border: 1px solid hsl(120 50% 25% / 0.5) !important;
    box-shadow: none !important;
}

[data-theme="source-code"] .remove-buff-btn:hover {
    background: hsl(120 10% 10%) !important;
    border-color: hsl(120 80% 35% / 0.7) !important;
    box-shadow: 0 0 6px hsl(120 100% 50% / 0.15) !important;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – STORY NOTES TAB
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] #sn-tab-btn-notes,
[data-theme="source-code"] #sn-tab-btn-npcs {
    color: hsl(120 80% 50%) !important;
    border-bottom-color: transparent !important;
}

[data-theme="source-code"] .story-note-item {
    background: hsl(120 10% 4%);
    border-color: hsl(120 100% 50% / 0.25);
    color: hsl(120 85% 55%);
    box-shadow: none;
}

[data-theme="source-code"] .story-note-item:hover {
    background: hsl(120 10% 7%);
    border-color: hsl(120 100% 50% / 0.5);
    box-shadow: 0 0 8px hsl(120 100% 50% / 0.1);
}

[data-theme="source-code"] .story-description,
[data-theme="source-code"] .story-description-only {
    color: hsl(120 70% 50%);
}

[data-theme="source-code"] .story-note-icon {
    filter: var(--icon-filter);
    border-color: hsl(120 100% 50% / 0.3);
}

[data-theme="source-code"] .newspaper-icon {
    filter: var(--icon-filter);
}

[data-theme="source-code"] .edit-story-note-btn,
[data-theme="source-code"] .delete-story-note-btn {
    background: hsl(120 10% 4%);
    border-color: hsl(120 100% 50% / 0.3);
    color: hsl(120 85% 55%);
}

[data-theme="source-code"] .edit-story-note-btn:hover,
[data-theme="source-code"] .delete-story-note-btn:hover {
    background: hsl(120 100% 50% / 0.1);
    border-color: hsl(120 100% 50% / 0.6);
    box-shadow: 0 0 8px hsl(120 100% 50% / 0.25);
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – NOTES SAVE BUTTON
   ═══════════════════════════════════════════════════════════════ */

[data-theme="source-code"] .save-note-btn {
    background: hsl(120 10% 4%);
    border: 1px solid hsl(120 100% 50% / 0.4);
    box-shadow: 0 0 8px hsl(120 100% 50% / 0.15);
}

[data-theme="source-code"] .save-note-btn img {
    filter: var(--icon-filter);
}

[data-theme="source-code"] .save-note-btn:hover {
    background: hsl(120 100% 50% / 0.12);
    border-color: hsl(120 100% 55%);
    box-shadow: 0 0 16px hsl(120 100% 50% / 0.4);
}

/* ── TWOHANDED-TOGGLE ICON ───────────────────────────────────── */

[data-theme="source-code"] .twohanded-toggle .twohanded-toggle-icon {
    filter: var(--icon-filter);
}

[data-theme="source-code"] .twohanded-toggle.active .twohanded-toggle-icon {
    filter: var(--icon-filter) drop-shadow(0 0 4px hsl(120 100% 50% / 0.8));
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – TEXT FARBEN (weiße Texte → Phosphor-Grün)
   ═══════════════════════════════════════════════════════════════ */

/* Spell-Tiles */
[data-theme="source-code"] .spell-tile {
    color: hsl(120 85% 55%);
}

[data-theme="source-code"] .spell-name,
[data-theme="source-code"] .spell-progress {
    color: hsl(120 85% 55%);
}

[data-theme="source-code"] .spell-cost {
    background-color: hsl(120 100% 50% / 0.15);
    color: hsl(120 100% 65%);
    border: 1px solid hsl(120 100% 50% / 0.4);
    text-shadow: 0 0 4px hsl(120 100% 50% / 0.5);
    box-shadow: none;
}

[data-theme="source-code"] .discipline-header {
    background: hsl(120 10% 4%);
    color: hsl(120 100% 55%);
    border: 1px solid hsl(120 100% 50% / 0.25);
    text-shadow: 0 0 6px hsl(120 100% 50% / 0.4);
}

[data-theme="source-code"] .discipline-header:hover {
    background: hsl(120 10% 7%);
    border-color: hsl(120 100% 50% / 0.5);
}

[data-theme="source-code"] .temp-badge {
    background-color: hsl(120 100% 50%);
    color: hsl(120 12% 2%);
    box-shadow: 0 0 6px hsl(120 100% 50% / 0.4);
}

[data-theme="source-code"] .delete-spell-btn {
    background: hsl(120 10% 6%) !important;
    color: hsl(120 60% 45%) !important;
    box-shadow: none !important;
}

[data-theme="source-code"] .delete-spell-btn:hover {
    background: hsl(120 10% 10%) !important;
    border-color: hsl(120 80% 35% / 0.6) !important;
    box-shadow: 0 0 6px hsl(120 100% 50% / 0.15) !important;
}

/* Inventory */
[data-theme="source-code"] .item-tile {
    color: hsl(120 85% 55%);
}

[data-theme="source-code"] .item-name {
    color: hsl(120 85% 55%);
}

[data-theme="source-code"] .item-quantity {
    background-color: hsl(120 100% 50% / 0.2);
    color: hsl(120 100% 65%);
    border: 1px solid hsl(120 100% 50% / 0.4);
}

[data-theme="source-code"] .equipped-indicator-icon {
    background-color: hsl(120 100% 50%);
    filter: none;
}

/* Currency */
[data-theme="source-code"] .currency-name {
    color: hsl(120 85% 55%);
}

[data-theme="source-code"] .currency-quantity {
    color: hsl(120 100% 65%);
}

/* Buffs */
[data-theme="source-code"] .buff-tile {
    color: hsl(120 85% 55%);
}

[data-theme="source-code"] .buff-name,
[data-theme="source-code"] .buff-description {
    color: hsl(120 80% 50%);
}

/* Story Notes */
[data-theme="source-code"] .story-note-title {
    color: hsl(120 100% 55%);
    text-shadow: 0 0 5px hsl(120 100% 50% / 0.4);
}

/* Info-Werte (PHP setzt inline style → !important nötig) */
[data-theme="source-code"] .info-value {
    color: hsl(120 100% 55%) !important;
    text-shadow: 0 0 6px hsl(120 100% 50% / 0.4) !important;
}

/* ═══════════════════════════════════════════════════════════════
   MATRIX THEME – WORLD VIEWS (Globe / Flat-World)
   Three.js-Canvas: Phosphor-Monochrom + Scan-Overlay
   ═══════════════════════════════════════════════════════════════ */

/* Canvas: gleicher Phosphor-Grün-Filter wie Bilder */
[data-theme="source-code"] canvas {
    filter: grayscale(100%) sepia(80%) hue-rotate(75deg) saturate(600%) brightness(0.9) contrast(1.25);
}
[data-theme="source-code"] .toxicity-container {
    border-color: var(--color-toxicity) !important;
}

[data-theme="source-code"] .toxicity-bar {
    background: var(--gradient-toxicity-resource) !important;
    box-shadow: var(--shadow-glow-toxicity) !important;
}

[data-theme="source-code"] #toxicityText {
    color: var(--text-light);
}