/* ==========================================================================
   RUNIC THEME: Sanctum Reforged
   White marble, gilded metal, sacred daylight, and ceremonial splendor.
   ========================================================================= */

[data-theme="sanctum"] {
    /* Core hue system */
    --hue-primary: 42;
    --hue-accent: 214;
    --hue-gm: 350;
    --hue-danger: 2;
    --hue-warning: 34;
    --hue-success: 142;
    --hue-toxicity: 102;
    --hue-neutral: 222;

    --sat-primary: 74%;
    --lit-primary: 48%;
    --lit-primary-hover: 42%;

    --sat-accent: 28%;
    --lit-accent: 56%;
    --lit-accent-hover: 50%;

    --sat-gm: 52%;
    --lit-gm: 42%;
    --lit-gm-text: 34%;

    --sat-danger: 60%;
    --lit-danger: 42%;
    --lit-danger-hover: 36%;

    --sat-warning: 70%;
    --lit-warning: 46%;

    --sat-success: 34%;
    --lit-success: 36%;

    --sat-toxicity: 38%;
    --lit-toxicity: 38%;

    --lightness-bg: 97%;

    /* Form and timing */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-2xl: 22px;

    --font-sans: 'Cormorant Garamond', 'Cinzel', 'Palatino Linotype', serif;
    --font-mono: 'IBM Plex Mono', 'Consolas', monospace;

    --duration-75: 90ms;
    --duration-150: 170ms;
    --duration-250: 280ms;
    --duration-300: 360ms;
    --duration-400: 620ms;

    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

    /* Identity */
    --gold-metal: hsl(42 68% 48%);
    --gold-bright: hsl(47 96% 78%);
    --gold-shadow: hsl(34 62% 28%);
    --gold-deep: hsl(38 72% 34%);
    --gold-coin: hsl(44 86% 56%);
    --gold-flare: hsl(49 100% 86%);
    --champagne: hsl(40 40% 90%);
    --ivory: hsl(41 36% 97%);
    --marble-cool: hsl(212 18% 92%);
    --marble-warm: hsl(36 30% 95%);
    --ink-deep: hsl(228 22% 18%);
    --royal-shadow: hsl(226 26% 26%);
    --ruby-deep: hsl(352 42% 42%);

    /* Surfaces */
    --bg-page: hsl(40 34% 97%);
    --bg-primary: hsl(39 28% 95%);
    --bg-secondary: hsl(40 24% 93% / 0.92);
    --bg-tertiary: hsl(40 20% 91% / 0.95);
    --bg-card: hsl(42 46% 99% / 0.95);
    --bg-hover: hsl(43 38% 92% / 0.85);
    --bg-input: hsl(42 42% 99%);

    --surface-elevated: hsl(40 26% 94%);
    --surface-overlay: hsl(40 20% 92% / 0.98);
    --surface-panel: hsl(40 24% 95% / 0.96);

    /* Text */
    --text-primary: hsl(224 20% 16%);
    --text-secondary: hsl(223 14% 30%);
    --text-label: hsl(39 44% 34%);
    --text-light: hsl(40 60% 26%);
    --text-muted: hsl(222 10% 46% / 0.85);

    /* Borders and shadows */
    --border-color: hsl(42 58% 50% / 0.62);
    --border-subtle: hsl(42 36% 66% / 0.52);
    --border-strong: hsl(40 72% 38% / 0.9);

    --shadow-glow-primary:
        0 12px 30px hsl(40 72% 42% / 0.24),
        0 0 38px hsl(48 100% 78% / 0.22);
    --shadow-glow-accent:
        0 10px 26px hsl(214 22% 72% / 0.12);
    --shadow-glow-danger:
        0 10px 26px hsl(352 44% 52% / 0.14);
    --shadow-glow-gold:
        0 10px 34px hsl(43 92% 62% / 0.34),
        0 0 22px hsl(49 100% 86% / 0.24);

    /* Icons */
    --icon-color: hsl(40 66% 38%);
    --icon-filter: brightness(0) saturate(100%) invert(48%) sepia(72%)
        saturate(827%) hue-rotate(6deg) brightness(93%) contrast(92%);

    /* Focus and tooltip */
    --color-focus-ring: hsl(43 90% 56% / 0.36);

    --color-tooltip-bg: hsl(42 40% 98% / 0.98);
    --color-tooltip-highlight: hsl(39 48% 34%);
    --color-tooltip-effect-bg: hsl(43 72% 66% / 0.12);
    --color-tooltip-text: hsl(224 18% 20%);
    --color-tooltip-label: hsl(222 14% 32%);
    --color-tooltip-muted: hsl(222 10% 48%);
    --color-tooltip-dim: hsl(222 8% 58%);
    --color-tooltip-pos: hsl(142 30% 34%);
    --color-tooltip-neg: hsl(2 46% 40%);
    --color-tooltip-separator: hsl(42 34% 72% / 0.6);
    --color-tooltip-section-bg: hsl(41 30% 95% / 0.92);

    /* Quality colors */
    --quality-0-color1: rgb(164, 156, 145);
    --quality-0-color2: rgb(112, 106, 97);
    --quality-1-color1: rgb(228, 222, 210);
    --quality-1-color2: rgb(184, 174, 158);
    --quality-2-color1: rgb(108, 154, 126);
    --quality-2-color2: rgb(74, 112, 90);
    --quality-3-color1: rgb(110, 146, 192);
    --quality-3-color2: rgb(70, 104, 148);
    --quality-4-color1: rgb(154, 124, 194);
    --quality-4-color2: rgb(103, 79, 142);
    --quality-5-color1: rgb(206, 168, 92);
    --quality-5-color2: rgb(148, 110, 42);
    --quality-6-color1: rgb(180, 78, 78);
    --quality-6-color2: rgb(130, 48, 48);
    --quality-7-color1: rgb(255, 247, 221);
    --quality-7-color2: rgb(224, 191, 103);

    /* Spell / element system */
    --element-fire-bg: hsl(16 74% 95% / 0.7);
    --element-fire-border: hsl(15 56% 58% / 0.56);
    --element-fire-hover: hsl(16 78% 92% / 0.88);
    --element-fire-glow: hsl(15 58% 62% / 0.18);

    --element-water-bg: hsl(210 64% 95% / 0.72);
    --element-water-border: hsl(210 48% 62% / 0.56);
    --element-water-hover: hsl(210 70% 92% / 0.88);
    --element-water-glow: hsl(210 52% 64% / 0.16);

    --element-earth-bg: hsl(90 42% 94% / 0.72);
    --element-earth-border: hsl(90 28% 52% / 0.54);
    --element-earth-hover: hsl(90 48% 90% / 0.88);
    --element-earth-glow: hsl(90 34% 56% / 0.14);

    --element-wind-bg: hsl(196 28% 95% / 0.72);
    --element-wind-border: hsl(196 24% 62% / 0.5);
    --element-wind-hover: hsl(196 32% 91% / 0.88);
    --element-wind-glow: hsl(196 26% 68% / 0.14);

    --element-light-bg: hsl(50 88% 95% / 0.74);
    --element-light-border: hsl(46 64% 58% / 0.62);
    --element-light-hover: hsl(50 92% 92% / 0.9);
    --element-light-glow: hsl(46 70% 66% / 0.22);

    --element-shadow-bg: hsl(258 32% 94% / 0.72);
    --element-shadow-border: hsl(258 34% 58% / 0.54);
    --element-shadow-hover: hsl(258 38% 90% / 0.88);
    --element-shadow-glow: hsl(258 40% 62% / 0.16);

    --element-death-bg: hsl(350 34% 94% / 0.72);
    --element-death-border: hsl(350 40% 56% / 0.54);
    --element-death-hover: hsl(350 40% 90% / 0.88);
    --element-death-glow: hsl(350 44% 62% / 0.16);

    --element-life-bg: hsl(142 44% 94% / 0.72);
    --element-life-border: hsl(142 34% 52% / 0.54);
    --element-life-hover: hsl(142 48% 90% / 0.88);
    --element-life-glow: hsl(142 40% 58% / 0.16);

    --element-arcane-bg: hsl(278 34% 95% / 0.72);
    --element-arcane-border: hsl(278 42% 58% / 0.54);
    --element-arcane-hover: hsl(278 40% 91% / 0.88);
    --element-arcane-glow: hsl(278 46% 62% / 0.16);

    --element-mind-bg: hsl(224 36% 95% / 0.72);
    --element-mind-border: hsl(224 34% 58% / 0.52);
    --element-mind-hover: hsl(224 42% 91% / 0.88);
    --element-mind-glow: hsl(224 36% 64% / 0.15);

    --element-physical-bg: hsl(39 36% 95% / 0.72);
    --element-physical-border: hsl(39 32% 60% / 0.5);
    --element-physical-hover: hsl(39 40% 91% / 0.88);
    --element-physical-glow: hsl(39 38% 66% / 0.14);

    --spell-temp-bg: hsl(40 30% 94%);
    --spell-temp-border: hsl(42 36% 62% / 0.82);
    --spell-temp-hover-bg: hsl(41 32% 91%);
    --spell-temp-hover-glow: hsl(43 62% 68% / 0.16);
    --spell-temp-badge-bg: hsl(42 48% 52%);
    --spell-temp-header-bg: hsl(41 32% 94%);
    --spell-temp-header-hover-bg: hsl(41 34% 91%);
    --spell-tile-hover-bg: hsl(41 34% 92%);

    /* Inventory / currency / buffs */
    --item-tile-base: hsl(42 40% 98%);
    --item-tile-border: hsl(42 28% 70% / 0.7);
    --item-tile-add-bg: hsl(40 34% 96%);
    --item-tile-add-border: hsl(42 24% 74% / 0.78);
    --item-tile-add-hover: hsl(42 40% 94%);
    --item-tile-add-border-hover: hsl(42 40% 60% / 0.88);

    --weight-display-bg: hsl(40 30% 94%);
    --weight-ok-color: hsl(142 30% 36%);
    --weight-warn-color: hsl(36 54% 42%);
    --weight-crit-color: hsl(2 46% 42%);
    --weight-bar-track-bg: hsl(41 20% 84%);

    --currency-tile-bg: hsl(42 40% 97%);
    --currency-tile-border: hsl(42 30% 68% / 0.7);
    --currency-tile-hover-bg: hsl(42 48% 94%);
    --currency-tile-hover-shadow: hsl(43 70% 70% / 0.22);
    --currency-quantity-bg: hsl(42 36% 86%);
    --currency-add-bg: hsl(40 34% 96%);
    --currency-add-border: hsl(42 26% 74% / 0.78);
    --currency-add-hover-bg: hsl(42 44% 93%);
    --currency-add-hover-border: hsl(42 40% 62% / 0.88);

    --color-buff-tile-bg: hsl(142 36% 95%);
    --color-buff-tile-border: hsl(142 28% 62% / 0.56);
    --color-buff-tile-hover: hsl(142 42% 91%);
    --color-buff-tile-glow: hsl(142 34% 60% / 0.14);
    --color-debuff-tile-bg: hsl(2 40% 95%);
    --color-debuff-tile-border: hsl(2 36% 62% / 0.58);
    --color-debuff-tile-hover: hsl(2 44% 91%);
    --color-debuff-tile-glow: hsl(2 42% 58% / 0.14);
    --color-neutral-tile-bg: hsl(40 34% 96%);
    --color-neutral-tile-border: hsl(42 24% 72% / 0.56);
    --color-neutral-tile-hover: hsl(42 40% 92%);
    --color-neutral-tile-glow: hsl(42 36% 68% / 0.12);
    --color-buff-indicator: hsl(142 30% 36%);
    --color-debuff-indicator: hsl(2 46% 42%);

    /* Common status colors */
    --color-heal: hsl(142 30% 36%);
    --color-gold: hsl(42 78% 45%);
}

/* ==========================================================================
   Animations
   ========================================================================= */

@keyframes gildedPulse {
    0%, 100% {
        box-shadow:
            0 0 0 1px hsl(42 30% 70% / 0.46),
            0 8px 20px hsl(43 64% 64% / 0.14);
    }
    50% {
        box-shadow:
            0 0 0 1px hsl(42 42% 58% / 0.72),
            0 12px 28px hsl(43 74% 70% / 0.24),
            0 0 42px hsl(46 90% 88% / 0.2);
    }
}

@keyframes auricText {
    0%, 100% {
        text-shadow:
            0 1px 0 hsl(41 24% 88% / 0.4),
            0 0 0 hsl(44 80% 78% / 0);
    }
    50% {
        text-shadow:
            0 1px 0 hsl(44 34% 92% / 0.7),
            0 0 14px hsl(44 78% 78% / 0.26),
            0 0 28px hsl(48 88% 88% / 0.18);
    }
}

@keyframes prismShine {
    0% {
        transform: translateX(-130%) skewX(-18deg);
        opacity: 0;
    }
    14% {
        opacity: 0.95;
    }
    100% {
        transform: translateX(240%) skewX(-18deg);
        opacity: 0;
    }
}

@keyframes glitterFloat {
    0%, 100% {
        opacity: 0.35;
        transform: translateY(0);
    }
    50% {
        opacity: 0.8;
        transform: translateY(-1px);
    }
}

@keyframes haloBreath {
    0%, 100% {
        box-shadow:
            0 0 14px hsl(43 74% 70% / 0.14),
            0 0 30px hsl(47 90% 88% / 0.08);
    }
    50% {
        box-shadow:
            0 0 22px hsl(43 78% 72% / 0.22),
            0 0 42px hsl(47 92% 90% / 0.14);
    }
}

/* ==========================================================================
   Global background and media
   ========================================================================= */

[data-theme="sanctum"] body {
    background-color: var(--bg-page);
    background-image:
        radial-gradient(circle at 18% 12%, hsl(46 80% 90% / 0.44), transparent 28%),
        radial-gradient(circle at 82% 18%, hsl(212 30% 92% / 0.36), transparent 30%),
        radial-gradient(circle at 50% 70%, hsl(42 52% 90% / 0.3), transparent 36%),
        linear-gradient(180deg, hsl(39 40% 98%) 0%, hsl(40 32% 96%) 48%, hsl(36 28% 94%) 100%);
    background-attachment: fixed;
}

[data-theme="sanctum"] body::before {
    content: '';
    position: fixed;
    inset: 0;
    background:
        linear-gradient(115deg, transparent 0 30%, hsl(43 100% 92% / 0.18) 48%, transparent 66%),
        repeating-linear-gradient(
            25deg,
            transparent 0 48px,
            hsl(220 8% 74% / 0.05) 48px 49px,
            transparent 49px 96px
        );
    pointer-events: none;
    z-index: var(--z-base, 0);
}

[data-theme="sanctum"] body::after {
    content: '';
    position: fixed;
    inset: 0;
    background:
        radial-gradient(circle at 50% 0%, hsl(48 100% 96% / 0.38), transparent 34%),
        radial-gradient(circle at 50% 50%, transparent 60%, hsl(224 18% 28% / 0.08) 100%);
    pointer-events: none;
    z-index: var(--z-max, 9999);
}

[data-theme="sanctum"] img {
    filter: saturate(0.94) brightness(1.02) contrast(1.02);
}

[data-theme="sanctum"] .icon-themed,
[data-theme="sanctum"] .icon,
[data-theme="sanctum"] .spell-icon,
[data-theme="sanctum"] .resistance-icon,
[data-theme="sanctum"] .currency-icon,
[data-theme="sanctum"] .buff-icon,
[data-theme="sanctum"] .action-btn,
[data-theme="sanctum"] .newspaper-icon {
    filter: var(--icon-filter);
}

[data-theme="sanctum"] .tab-btn .icon,
[data-theme="sanctum"] .tab_btn .icon,
[data-theme="sanctum"] .navigation-bar .icon,
[data-theme="sanctum"] .action-btn,
[data-theme="sanctum"] .modal-close .icon,
[data-theme="sanctum"] .save-note-btn img,
[data-theme="sanctum"] .twohanded-toggle .twohanded-toggle-icon {
    filter: var(--icon-filter);
}

[data-theme="sanctum"] .logo,
[data-theme="sanctum"] img[src*="logo"] {
    filter:
        brightness(1.02)
        saturate(0.92)
        drop-shadow(0 0 14px hsl(43 72% 70% / 0.24))
        drop-shadow(0 0 34px hsl(47 90% 88% / 0.18));
}

/* ==========================================================================
   Typography
   ========================================================================= */

[data-theme="sanctum"] h1,
[data-theme="sanctum"] h2,
[data-theme="sanctum"] h3 {
    color: hsl(40 42% 30%);
    font-family: var(--font-sans);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    animation: auricText 7s ease-in-out infinite;
}

[data-theme="sanctum"] h4,
[data-theme="sanctum"] h5,
[data-theme="sanctum"] h6 {
    color: hsl(39 34% 36%);
    font-family: var(--font-sans);
    letter-spacing: 0.04em;
}

[data-theme="sanctum"] .character-info h3,
[data-theme="sanctum"] .character-name,
[data-theme="sanctum"] .story-note-title,
[data-theme="sanctum"] .widget-title,
[data-theme="sanctum"] .attribute-name,
[data-theme="sanctum"] .discipline-header,
[data-theme="sanctum"] .modal-title {
    font-family: var(--font-sans);
}

/* ==========================================================================
   Core surfaces
   ========================================================================= */

[data-theme="sanctum"] .card,
[data-theme="sanctum"] .card-glass,
[data-theme="sanctum"] .character-card,
[data-theme="sanctum"] .widget-tile,
[data-theme="sanctum"] .attribute-card,
[data-theme="sanctum"] .character-item,
[data-theme="sanctum"] .login-container,
[data-theme="sanctum"] .modal,
[data-theme="sanctum"] .story-note-item,
[data-theme="sanctum"] .spell-tile,
[data-theme="sanctum"] .buff-tile,
[data-theme="sanctum"] .item-tile,
[data-theme="sanctum"] .currency-tile {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(180deg, hsl(0 0% 100% / 0.72), hsl(42 38% 98% / 0.96)),
        linear-gradient(135deg, hsl(41 34% 97% / 0.96), hsl(36 26% 93% / 0.98));
    border: 1px solid var(--border-color);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.92),
        inset 0 -18px 28px hsl(220 12% 62% / 0.06),
        0 14px 28px hsl(220 18% 40% / 0.08),
        0 0 24px hsl(44 88% 88% / 0.08);
}

[data-theme="sanctum"] .card::before,
[data-theme="sanctum"] .card-glass::before,
[data-theme="sanctum"] .character-card::before,
[data-theme="sanctum"] .widget-tile::before,
[data-theme="sanctum"] .attribute-card::before,
[data-theme="sanctum"] .character-item::before,
[data-theme="sanctum"] .login-container::before,
[data-theme="sanctum"] .modal::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, transparent 0 2.6%, hsl(43 54% 72% / 0.26) 2.6% 3.1%, transparent 3.1% 96.9%, hsl(43 54% 72% / 0.26) 96.9% 97.4%, transparent 97.4% 100%),
        linear-gradient(180deg, transparent 0 3.4%, hsl(43 40% 82% / 0.18) 3.4% 3.9%, transparent 3.9% 96.1%, hsl(43 40% 82% / 0.18) 96.1% 96.6%, transparent 96.6% 100%);
    pointer-events: none;
}

[data-theme="sanctum"] .card::after,
[data-theme="sanctum"] .character-card::after,
[data-theme="sanctum"] .widget-tile::after,
[data-theme="sanctum"] .btn-primary::after,
[data-theme="sanctum"] .roll-button::after {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 40%;
    background: linear-gradient(
        90deg,
        transparent,
        hsl(0 0% 100% / 0.18) 28%,
        hsl(48 100% 96% / 0.72) 50%,
        hsl(43 92% 84% / 0.26) 62%,
        transparent
    );
    transform: translateX(-140%) skewX(-18deg);
    pointer-events: none;
    opacity: 0;
}

[data-theme="sanctum"] .card:hover,
[data-theme="sanctum"] .card-glass:hover,
[data-theme="sanctum"] .character-card:hover,
[data-theme="sanctum"] .widget-tile:hover,
[data-theme="sanctum"] .attribute-card:hover,
[data-theme="sanctum"] .character-item:hover,
[data-theme="sanctum"] .story-note-item:hover,
[data-theme="sanctum"] .spell-tile:hover,
[data-theme="sanctum"] .buff-tile:hover,
[data-theme="sanctum"] .item-tile:hover,
[data-theme="sanctum"] .currency-tile:hover {
    border-color: var(--border-strong);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.96),
        inset 0 -18px 28px hsl(220 12% 62% / 0.08),
        0 18px 34px hsl(220 18% 40% / 0.1),
        0 0 30px hsl(46 96% 88% / 0.18);
}

[data-theme="sanctum"] .card:hover::after,
[data-theme="sanctum"] .character-card:hover::after,
[data-theme="sanctum"] .widget-tile:hover::after {
    animation: prismShine 1.15s ease-out forwards;
}

[data-theme="sanctum"] .card-gm,
[data-theme="sanctum"] .modal-gm {
    border-color: hsl(352 34% 52% / 0.74);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.92),
        0 14px 28px hsl(220 18% 40% / 0.08),
        0 0 24px hsl(352 54% 68% / 0.12);
}

/* ==========================================================================
   Buttons, tabs, toggles
   ========================================================================= */

[data-theme="sanctum"] .btn-primary,
[data-theme="sanctum"] .roll-button,
[data-theme="sanctum"] .save-note-btn {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 24% 0%, hsl(50 100% 90% / 0.92), transparent 34%),
        linear-gradient(180deg, hsl(49 100% 83%), hsl(44 86% 56%) 42%, hsl(38 72% 34%) 100%);
    color: hsl(34 62% 18%);
    border: 1px solid hsl(37 74% 32% / 0.96);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.92),
        inset 0 -2px 0 hsl(34 62% 26% / 0.32),
        0 12px 26px hsl(40 72% 42% / 0.28),
        0 0 24px hsl(49 100% 82% / 0.22);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 700;
}

[data-theme="sanctum"] .btn-primary:hover,
[data-theme="sanctum"] .roll-button:hover,
[data-theme="sanctum"] .save-note-btn:hover {
    border-color: hsl(37 82% 28%);
    background:
        radial-gradient(circle at 24% 0%, hsl(50 100% 92% / 0.98), transparent 36%),
        linear-gradient(180deg, hsl(49 100% 86%), hsl(44 90% 59%) 42%, hsl(38 76% 36%) 100%);
    transform: translateY(-1px);
    animation: haloBreath 2.6s ease-in-out infinite;
}

[data-theme="sanctum"] .btn-primary:hover::after,
[data-theme="sanctum"] .roll-button:hover::after {
    animation: prismShine 0.95s ease-out forwards;
}

[data-theme="sanctum"] .btn-secondary,
[data-theme="sanctum"] .btn-ghost,
[data-theme="sanctum"] .tab-btn,
[data-theme="sanctum"] .tab_btn,
[data-theme="sanctum"] .twohanded-toggle {
    background:
        linear-gradient(180deg, hsl(42 30% 98%), hsl(38 22% 92%));
    color: hsl(39 36% 34%);
    border: 1px solid hsl(42 48% 58% / 0.84);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.92),
        0 10px 20px hsl(220 18% 40% / 0.06);
}

[data-theme="sanctum"] .btn-secondary:hover,
[data-theme="sanctum"] .btn-ghost:hover,
[data-theme="sanctum"] .tab-btn:hover,
[data-theme="sanctum"] .tab_btn:hover,
[data-theme="sanctum"] .twohanded-toggle:hover {
    border-color: hsl(40 72% 40% / 0.95);
    color: hsl(38 68% 24%);
    background:
        linear-gradient(180deg, hsl(48 78% 96%), hsl(42 52% 86%));
}

[data-theme="sanctum"] .tab-btn.active,
[data-theme="sanctum"] .tab_btn.active,
[data-theme="sanctum"] .twohanded-toggle.active {
    color: hsl(34 62% 18%);
    border-color: hsl(37 74% 32% / 0.96);
    background:
        radial-gradient(circle at 26% 0%, hsl(50 100% 90% / 0.86), transparent 34%),
        linear-gradient(180deg, hsl(49 100% 83%), hsl(44 84% 58%) 46%, hsl(38 68% 38%));
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.9),
        inset 0 -1px 0 hsl(34 62% 26% / 0.28),
        0 10px 22px hsl(40 72% 42% / 0.24),
        0 0 22px hsl(49 100% 82% / 0.18);
    animation: gildedPulse 4.2s ease-in-out infinite;
}

[data-theme="sanctum"] .tab-btn.active .icon,
[data-theme="sanctum"] .tab_btn.active .icon,
[data-theme="sanctum"] .twohanded-toggle.active .twohanded-toggle-icon {
    filter:
        brightness(0) saturate(100%) invert(33%) sepia(16%) saturate(1271%)
        hue-rotate(9deg) brightness(98%) contrast(91%);
}

[data-theme="sanctum"] .tab-btn.active .icon,
[data-theme="sanctum"] .tab_btn.active .icon,
[data-theme="sanctum"] .twohanded-toggle.active .twohanded-toggle-icon,
[data-theme="sanctum"] .action-btn.active,
[data-theme="sanctum"] .active > .icon,
[data-theme="sanctum"] .active > img.icon-themed {
    background: linear-gradient(180deg, hsl(50 100% 86%), hsl(44 86% 56%) 48%, hsl(38 72% 34%));
    border-radius: 999px;
    padding: 0.28rem;
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.86),
        0 0 0 1px hsl(37 74% 32% / 0.9),
        0 8px 18px hsl(43 90% 58% / 0.28);
    filter:
        brightness(0) saturate(100%) invert(100%) sepia(0%)
        saturate(0%) hue-rotate(338deg) brightness(108%) contrast(102%);
}

[data-theme="sanctum"] .action-btn.active,
[data-theme="sanctum"] .tab-btn.active,
[data-theme="sanctum"] .tab_btn.active,
[data-theme="sanctum"] .twohanded-toggle.active {
    position: relative;
}

[data-theme="sanctum"] .action-btn.active {
    background: linear-gradient(180deg, hsl(50 100% 86%), hsl(44 86% 56%) 48%, hsl(38 72% 34%));
    border: 1px solid hsl(37 74% 32% / 0.96);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.9),
        0 10px 22px hsl(40 72% 42% / 0.26),
        0 0 22px hsl(49 100% 82% / 0.2);
}

[data-theme="sanctum"] .tab-btn.combat-active {
    border-color: hsl(352 38% 46% / 0.94) !important;
    background:
        linear-gradient(180deg, hsl(350 46% 94%), hsl(350 28% 84%)) !important;
    color: hsl(352 46% 28%) !important;
}

[data-theme="sanctum"] .btn-danger,
[data-theme="sanctum"] .btn-gm,
[data-theme="sanctum"] .delete-spell-btn,
[data-theme="sanctum"] .remove-buff-btn,
[data-theme="sanctum"] .delete-story-note-btn {
    background: linear-gradient(180deg, hsl(0 52% 96%), hsl(352 36% 84%));
    color: hsl(352 40% 30%);
    border: 1px solid hsl(352 34% 56% / 0.82);
    box-shadow: 0 10px 20px hsl(352 42% 68% / 0.12);
}

[data-theme="sanctum"] .btn-danger:hover,
[data-theme="sanctum"] .btn-gm:hover,
[data-theme="sanctum"] .delete-spell-btn:hover,
[data-theme="sanctum"] .remove-buff-btn:hover,
[data-theme="sanctum"] .delete-story-note-btn:hover {
    border-color: hsl(352 40% 46%);
    box-shadow: 0 0 20px hsl(352 56% 72% / 0.18);
}

[data-theme="sanctum"] .edit-story-note-btn {
    background: linear-gradient(180deg, hsl(214 44% 97%), hsl(212 26% 88%));
    color: hsl(214 28% 34%);
    border: 1px solid hsl(214 24% 64% / 0.82);
}

[data-theme="sanctum"] .edit-story-note-btn:hover {
    border-color: hsl(214 30% 54%);
    box-shadow: 0 0 18px hsl(214 36% 78% / 0.14);
}

/* ==========================================================================
   Forms and selects
   ========================================================================= */

[data-theme="sanctum"] .input,
[data-theme="sanctum"] .select,
[data-theme="sanctum"] .textarea,
[data-theme="sanctum"] select,
[data-theme="sanctum"] .form-select,
[data-theme="sanctum"] .equipment-select {
    appearance: none;
    -webkit-appearance: none;
    background:
        linear-gradient(180deg, hsl(0 0% 100%), hsl(42 34% 97%));
    color: var(--text-primary);
    border: 1px solid var(--border-subtle);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.96),
        0 4px 10px hsl(220 18% 40% / 0.04);
}

[data-theme="sanctum"] select,
[data-theme="sanctum"] .select,
[data-theme="sanctum"] .form-select,
[data-theme="sanctum"] .equipment-select {
    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='%239d7b35' 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.6rem center;
    background-size: 14px;
    padding-right: 1.9rem;
}

[data-theme="sanctum"] .input:hover:not(:disabled):not(:focus),
[data-theme="sanctum"] .select:hover:not(:disabled):not(:focus),
[data-theme="sanctum"] .textarea:hover:not(:disabled):not(:focus),
[data-theme="sanctum"] select:hover:not(:disabled),
[data-theme="sanctum"] .form-select:hover:not(:disabled),
[data-theme="sanctum"] .equipment-select:hover:not(:disabled) {
    border-color: hsl(42 34% 60% / 0.86);
}

[data-theme="sanctum"] .input:focus,
[data-theme="sanctum"] .select:focus,
[data-theme="sanctum"] .textarea:focus,
[data-theme="sanctum"] select:focus,
[data-theme="sanctum"] .form-select:focus,
[data-theme="sanctum"] .equipment-select:focus {
    border-color: hsl(41 44% 48%);
    box-shadow:
        0 0 0 3px var(--color-focus-ring),
        0 0 18px hsl(46 92% 90% / 0.2);
    outline: none;
}

[data-theme="sanctum"] .input-error {
    border-color: hsl(2 42% 56%);
}

[data-theme="sanctum"] .input-success {
    border-color: hsl(142 28% 50%);
}

[data-theme="sanctum"] .checkbox:checked,
[data-theme="sanctum"] .radio:checked,
[data-theme="sanctum"] .toggle:checked {
    background: linear-gradient(180deg, hsl(46 88% 92%), hsl(40 44% 54%));
    border-color: hsl(40 38% 46%);
    box-shadow: 0 0 16px hsl(46 92% 90% / 0.18);
}

[data-theme="sanctum"] .toggle:checked::after {
    background: hsl(42 42% 98%);
}

[data-theme="sanctum"] .range {
    background: linear-gradient(90deg, hsl(42 24% 82%), hsl(44 38% 74%));
}

[data-theme="sanctum"] .range::-webkit-slider-thumb,
[data-theme="sanctum"] .range::-moz-range-thumb {
    background: linear-gradient(180deg, hsl(48 100% 94%), hsl(40 42% 54%));
    box-shadow: 0 0 16px hsl(46 92% 90% / 0.18);
}

[data-theme="sanctum"] select option {
    background-color: hsl(41 30% 97%);
    color: var(--text-primary);
}

/* ==========================================================================
   Modal and tooltip
   ========================================================================= */

[data-theme="sanctum"] .modal {
    background:
        radial-gradient(circle at top, hsl(48 88% 92% / 0.42), transparent 26%),
        linear-gradient(135deg, hsl(42 42% 98% / 0.98), hsl(36 28% 93% / 0.98));
    border-color: hsl(42 34% 62% / 0.84);
    box-shadow:
        0 24px 48px hsl(220 18% 36% / 0.16),
        0 0 30px hsl(47 92% 90% / 0.2);
}

[data-theme="sanctum"] .modal-header,
[data-theme="sanctum"] .modal-footer {
    background: linear-gradient(180deg, hsl(43 44% 96% / 0.92), hsl(40 22% 92% / 0.64));
    border-color: var(--border-subtle);
}

[data-theme="sanctum"] .modal-close {
    color: var(--text-secondary);
}

[data-theme="sanctum"] .modal-close:hover {
    color: hsl(39 48% 28%);
    background: hsl(43 36% 90% / 0.7);
}

[data-theme="sanctum"] .modal-danger {
    border-color: hsl(352 34% 58% / 0.84);
}

[data-theme="sanctum"] .tooltip,
[data-theme="sanctum"] .unified-tooltip,
[data-theme="sanctum"] .basic-tooltip,
[data-theme="sanctum"] .itooltip,
[data-theme="sanctum"] .skilltooltip,
[data-theme="sanctum"] .attrtooltip,
[data-theme="sanctum"] .stattooltip,
[data-theme="sanctum"] #item-tooltip,
[data-theme="sanctum"] .buff-tooltip,
[data-theme="sanctum"] .twohanded-tooltip {
    background:
        linear-gradient(180deg, hsl(0 0% 100% / 0.76), hsl(42 42% 98% / 0.98)),
        linear-gradient(135deg, var(--color-tooltip-bg), hsl(40 26% 95% / 0.98));
    color: var(--color-tooltip-text);
    border: 1px solid var(--color-tooltip-separator);
    box-shadow:
        0 16px 34px hsl(220 18% 36% / 0.12),
        0 0 24px hsl(47 92% 90% / 0.14);
}

[data-theme="sanctum"] .tooltip h3,
[data-theme="sanctum"] .buff-tooltip h3 {
    color: var(--color-tooltip-highlight);
}

/* ==========================================================================
   Tables, navigation, generic layout
   ========================================================================= */

[data-theme="sanctum"] table,
[data-theme="sanctum"] .equipment-table {
    width: 100%;
    border-collapse: collapse;
    background: linear-gradient(180deg, hsl(42 40% 98%), hsl(38 24% 94%));
    border: 1px solid var(--border-color);
}

[data-theme="sanctum"] th,
[data-theme="sanctum"] .equipment-table th {
    background:
        linear-gradient(90deg, hsl(49 100% 84% / 0.38), transparent 42%),
        linear-gradient(180deg, hsl(48 90% 90%), hsl(43 68% 70%) 48%, hsl(38 56% 48%));
    color: hsl(34 62% 18%);
    border-bottom: 1px solid hsl(37 74% 32% / 0.92);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.86),
        inset 0 -1px 0 hsl(34 62% 26% / 0.22);
    font-family: var(--font-mono);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

[data-theme="sanctum"] td,
[data-theme="sanctum"] .equipment-table td {
    border-bottom: 1px solid hsl(42 22% 80% / 0.62);
}

[data-theme="sanctum"] tr:hover td,
[data-theme="sanctum"] .equipment-table tr:hover td {
    background: hsl(43 36% 93% / 0.72);
}

[data-theme="sanctum"] .navigation-bar {
    background:
        linear-gradient(90deg, hsl(44 86% 56% / 0.34), transparent 34%),
        linear-gradient(180deg, hsl(0 0% 100% / 0.98), hsl(40 30% 91% / 0.98));
    border-bottom: 1px solid hsl(40 72% 38% / 0.56);
    box-shadow:
        inset 0 -2px 0 hsl(44 86% 56% / 0.26),
        0 12px 24px hsl(220 18% 36% / 0.08),
        0 0 24px hsl(49 100% 82% / 0.12);
}

[data-theme="sanctum"] .navigation-bar .icon {
    filter: var(--icon-filter);
}

[data-theme="sanctum"] #div_iconbar_left,
[data-theme="sanctum"] #div_iconbar_right {
    background:
        linear-gradient(90deg, hsl(44 86% 56% / 0.22), transparent 28%),
        linear-gradient(180deg, hsl(44 44% 91% / 0.96), hsl(38 26% 82% / 0.96));
    border: 1px solid hsl(40 72% 38% / 0.48);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.86),
        inset 3px 0 0 hsl(44 84% 50% / 0.42),
        0 10px 24px hsl(220 18% 36% / 0.1);
}

[data-theme="sanctum"] #div_iconbar_left .tab_btn,
[data-theme="sanctum"] #div_iconbar_right .tab_btn,
[data-theme="sanctum"] .navigation-bar .tab_btn {
    background:
        linear-gradient(180deg, hsl(0 0% 100% / 0.98), hsl(41 26% 93% / 0.98)) !important;
    border: 2px solid hsl(42 48% 58% / 0.74) !important;
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.96),
        0 6px 16px hsl(220 18% 36% / 0.08) !important;
}

[data-theme="sanctum"] #div_iconbar_left .tab_btn:hover,
[data-theme="sanctum"] #div_iconbar_right .tab_btn:hover,
[data-theme="sanctum"] .navigation-bar .tab_btn:hover {
    background:
        linear-gradient(180deg, hsl(47 62% 97%), hsl(42 32% 90%)) !important;
    border-color: hsl(40 72% 40% / 0.98) !important;
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.96),
        0 10px 20px hsl(43 66% 62% / 0.18),
        0 0 18px hsl(47 92% 90% / 0.14) !important;
}

[data-theme="sanctum"] #div_iconbar_left .tab_btn .tab_Icon,
[data-theme="sanctum"] #div_iconbar_right .tab_btn .tab_Icon,
[data-theme="sanctum"] #div_iconbar_left .tab_btn img,
[data-theme="sanctum"] #div_iconbar_right .tab_btn img,
[data-theme="sanctum"] .navigation-bar .tab_btn img,
[data-theme="sanctum"] .navigation-bar .tab_btn .navi-icon {
    filter: var(--icon-filter) !important;
    opacity: 1 !important;
}

[data-theme="sanctum"] #div_iconbar_left .tab_btn.active-tab,
[data-theme="sanctum"] #div_iconbar_right .tab_btn.active-tab,
[data-theme="sanctum"] .navigation-bar .tab_btn.active-tab {
    background:
        radial-gradient(circle at 24% 0%, hsl(50 100% 90% / 0.86), transparent 34%),
        linear-gradient(180deg, hsl(49 100% 84%), hsl(44 86% 56%) 48%, hsl(38 72% 34%)) !important;
    border: 2px solid hsl(37 74% 32% / 0.98) !important;
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.86),
        0 0 0 3px hsl(46 100% 82% / 0.32),
        0 10px 22px hsl(40 72% 42% / 0.3),
        0 0 24px hsl(49 100% 82% / 0.24) !important;
    transform: scale(1.08);
}

[data-theme="sanctum"] #div_iconbar_left .tab_btn.active-tab .tab_Icon,
[data-theme="sanctum"] #div_iconbar_right .tab_btn.active-tab .tab_Icon,
[data-theme="sanctum"] #div_iconbar_left .tab_btn.active-tab img,
[data-theme="sanctum"] #div_iconbar_right .tab_btn.active-tab img,
[data-theme="sanctum"] .navigation-bar .tab_btn.active-tab img,
[data-theme="sanctum"] .navigation-bar .tab_btn.active-tab .navi-icon {
    filter:
        brightness(0) saturate(100%) invert(100%) sepia(0%)
        saturate(0%) hue-rotate(338deg) brightness(108%) contrast(102%) !important;
}

[data-theme="sanctum"] .attribute-cards-container {
    background: linear-gradient(180deg, hsl(42 22% 96% / 0.82), hsl(38 18% 94% / 0.44));
}

[data-theme="sanctum"] .attribute-subskills {
    background: linear-gradient(180deg, hsl(42 34% 98%), hsl(38 22% 95%));
    border: 1px solid var(--border-subtle);
}

[data-theme="sanctum"] .subskill-item {
    border-bottom: 1px solid hsl(42 22% 82% / 0.72);
}

[data-theme="sanctum"] .subskill-name {
    color: hsl(214 20% 34%);
}

[data-theme="sanctum"] .subskill-effect,
[data-theme="sanctum"] .story-description,
[data-theme="sanctum"] .story-description-only {
    color: var(--text-secondary);
}

[data-theme="sanctum"] .attribute-icon-container {
    background:
        radial-gradient(circle at 30% 24%, hsl(0 0% 100% / 0.8), transparent 42%),
        linear-gradient(180deg, hsl(46 96% 94%), hsl(41 34% 84%));
    color: hsl(39 50% 32%);
    box-shadow:
        inset 0 0 0 1px hsl(42 30% 62% / 0.56),
        0 0 18px hsl(46 92% 90% / 0.16);
    animation: haloBreath 4.6s ease-in-out infinite;
}

[data-theme="sanctum"] .attribute-value,
[data-theme="sanctum"] .info-value,
[data-theme="sanctum"] .roll-result {
    color: hsl(39 46% 28%) !important;
}

[data-theme="sanctum"] .attribute-bonus {
    background: hsl(43 40% 90%);
    color: hsl(39 42% 28%);
}

[data-theme="sanctum"] .attribute-card.physical {
    border-left: 3px solid hsl(42 46% 48%);
}

[data-theme="sanctum"] .attribute-card.mental {
    border-left: 3px solid hsl(224 24% 54%);
}

[data-theme="sanctum"] .attribute-card.social {
    border-left: 3px solid hsl(26 44% 52%);
}

[data-theme="sanctum"] .attribute-card.special {
    border-left: 3px solid hsl(352 34% 50%);
}

[data-theme="sanctum"] .roll-result:not(:empty) {
    background:
        radial-gradient(circle at 50% 40%, hsl(46 100% 94% / 0.72), transparent 60%),
        linear-gradient(180deg, hsl(0 0% 100%), hsl(42 40% 96%));
    border: 1px solid hsl(42 34% 62% / 0.82);
    animation: gildedPulse 3.2s ease-in-out infinite;
}

/* ==========================================================================
   Character cards and login
   ========================================================================= */

[data-theme="sanctum"] .character-card-avatar,
[data-theme="sanctum"] .portrait {
    border: 1px solid hsl(42 28% 70% / 0.82);
    box-shadow:
        inset 0 0 0 1px hsl(0 0% 100% / 0.56),
        0 10px 22px hsl(220 18% 36% / 0.1),
        0 0 18px hsl(46 92% 90% / 0.1);
    filter: saturate(0.92) brightness(1.02) contrast(1.02);
}

[data-theme="sanctum"] .character-card:hover .character-card-avatar,
[data-theme="sanctum"] .character-card:hover .portrait {
    border-color: hsl(42 38% 58%);
    box-shadow:
        inset 0 0 0 1px hsl(0 0% 100% / 0.68),
        0 12px 26px hsl(220 18% 36% / 0.12),
        0 0 22px hsl(46 92% 90% / 0.18);
}

[data-theme="sanctum"] .character-item::after,
[data-theme="sanctum"] .character-card .name::after,
[data-theme="sanctum"] .attribute-card::after {
    background-image:
        radial-gradient(circle, hsl(46 100% 84% / 0.88) 1px, transparent 1px),
        radial-gradient(circle, hsl(0 0% 100% / 0.92) 1px, transparent 1px),
        radial-gradient(circle, hsl(43 88% 68% / 0.76) 1px, transparent 1px);
    background-size: 90px 70px, 120px 80px, 100px 90px;
    background-position: 12% 28%, 74% 18%, 52% 76%;
    background-repeat: repeat;
    opacity: 0.22;
    animation: glitterFloat 5.4s ease-in-out infinite;
}

[data-theme="sanctum"] .login-container {
    background:
        radial-gradient(circle at 50% 0, hsl(47 100% 92% / 0.5), transparent 24%),
        linear-gradient(135deg, hsl(42 42% 98% / 0.98), hsl(36 28% 93% / 0.98));
}

/* ==========================================================================
   Widgets and stats
   ========================================================================= */

[data-theme="sanctum"] .widget-tile[data-widget-type="attack"] {
    border-color: hsl(352 28% 66% / 0.84);
    background:
        linear-gradient(180deg, hsl(352 46% 95% / 0.58), transparent 36%),
        linear-gradient(135deg, hsl(42 42% 98%), hsl(36 28% 93%));
}

[data-theme="sanctum"] .widget-tile[data-widget-type="skill"] {
    border-color: hsl(214 28% 68% / 0.84);
    background:
        linear-gradient(180deg, hsl(214 48% 95% / 0.58), transparent 36%),
        linear-gradient(135deg, hsl(42 42% 98%), hsl(36 28% 93%));
}

[data-theme="sanctum"] .widget-tile[data-widget-type="activity"] {
    border-color: hsl(42 34% 62% / 0.84);
    background:
        linear-gradient(180deg, hsl(46 76% 94% / 0.58), transparent 36%),
        linear-gradient(135deg, hsl(42 42% 98%), hsl(36 28% 93%));
}

[data-theme="sanctum"] .stat-item {
    background: linear-gradient(180deg, hsl(0 0% 100%), hsl(41 32% 96%)) !important;
    border: 1px solid var(--border-subtle);
}

[data-theme="sanctum"] .stat-item:hover {
    background: linear-gradient(180deg, hsl(46 56% 98%), hsl(41 36% 94%)) !important;
}

[data-theme="sanctum"] .talent-item {
    background-color: hsl(41 34% 97%) !important;
    border-left-color: hsl(42 38% 54%) !important;
}

[data-theme="sanctum"] .talent-item > div:last-child {
    background-color: hsl(42 18% 86%) !important;
}

[data-theme="sanctum"] .talent-item > div:last-child > div {
    background: linear-gradient(90deg, hsl(46 84% 80%), hsl(40 40% 52%)) !important;
}

/* ==========================================================================
   Inventory, currency, weight
   ========================================================================= */

[data-theme="sanctum"] .item-tile {
    background: linear-gradient(180deg, hsl(0 0% 100%), hsl(41 34% 97%));
    color: var(--text-primary);
}

[data-theme="sanctum"] .item-tile.quality-0,
[data-theme="sanctum"] .quality-0 {
    border-color: hsl(42 16% 70% / 0.74);
}

[data-theme="sanctum"] .quality-1 {
    border-color: hsl(42 24% 76% / 0.78);
}

[data-theme="sanctum"] .quality-2 {
    border-color: hsl(142 24% 62% / 0.8);
}

[data-theme="sanctum"] .quality-3 {
    border-color: hsl(214 28% 64% / 0.8);
}

[data-theme="sanctum"] .quality-4 {
    border-color: hsl(272 28% 64% / 0.82);
}

[data-theme="sanctum"] .quality-5 {
    border-color: hsl(40 76% 40% / 0.92);
    box-shadow:
        inset 0 0 0 1px hsl(49 100% 84% / 0.28),
        0 0 24px hsl(43 92% 62% / 0.26);
}

[data-theme="sanctum"] .quality-6 {
    border-color: hsl(352 34% 58% / 0.84);
}

[data-theme="sanctum"] .quality-7 {
    border-color: hsl(44 92% 54% / 0.96);
    box-shadow:
        inset 0 0 0 1px hsl(50 100% 88% / 0.38),
        0 0 28px hsl(49 100% 78% / 0.34);
}

[data-theme="sanctum"] .icon-quality-0,
[data-theme="sanctum"] .icon-quality-1,
[data-theme="sanctum"] .icon-quality-2,
[data-theme="sanctum"] .icon-quality-3,
[data-theme="sanctum"] .icon-quality-4,
[data-theme="sanctum"] .icon-quality-5,
[data-theme="sanctum"] .icon-quality-6,
[data-theme="sanctum"] .icon-quality-7,
[data-theme="sanctum"] .equipped-indicator-icon {
    background: linear-gradient(180deg, hsl(50 100% 82%), hsl(44 82% 52%) 52%, hsl(38 66% 34%));
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.76),
        0 0 14px hsl(49 100% 82% / 0.18);
}

[data-theme="sanctum"] .item-name,
[data-theme="sanctum"] .currency-name,
[data-theme="sanctum"] .spell-name,
[data-theme="sanctum"] .buff-name {
    color: hsl(224 20% 18%);
}

[data-theme="sanctum"] .item-quantity,
[data-theme="sanctum"] .currency-quantity,
[data-theme="sanctum"] .spell-cost,
[data-theme="sanctum"] .buff-duration {
    background: linear-gradient(180deg, hsl(50 100% 88%), hsl(44 80% 60%) 48%, hsl(38 60% 42%));
    color: hsl(34 62% 18%);
    border: 1px solid hsl(37 74% 32% / 0.82);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.88),
        0 6px 14px hsl(40 72% 42% / 0.16);
}

[data-theme="sanctum"] .action-buttons {
    background: hsl(42 36% 98% / 0.98);
    border: 1px solid var(--border-subtle);
    box-shadow: 0 14px 24px hsl(220 18% 36% / 0.08);
}

[data-theme="sanctum"] .weight-progress-container {
    background: hsl(41 24% 88%);
    border: 1px solid hsl(42 24% 72% / 0.76);
}

[data-theme="sanctum"] .weight-progress-bar.weight-ok {
    background: linear-gradient(90deg, hsl(142 24% 58%), hsl(142 30% 38%)) !important;
}

[data-theme="sanctum"] .weight-progress-bar.weight-warn {
    background: linear-gradient(90deg, hsl(42 56% 62%), hsl(36 54% 42%)) !important;
}

[data-theme="sanctum"] .weight-progress-bar.weight-crit {
    background: linear-gradient(90deg, hsl(2 42% 62%), hsl(2 46% 42%)) !important;
}

[data-theme="sanctum"] .weight-value.weight-ok {
    color: var(--weight-ok-color);
}

[data-theme="sanctum"] .weight-value.weight-warn {
    color: var(--weight-warn-color);
}

[data-theme="sanctum"] .weight-value.weight-crit {
    color: var(--weight-crit-color);
}

/* ==========================================================================
   Spells and buffs
   ========================================================================= */

[data-theme="sanctum"] .spell-tile {
    background: linear-gradient(180deg, hsl(0 0% 100%), hsl(41 34% 97%));
}

[data-theme="sanctum"] .spell-tile.temp-spell {
    border-color: var(--spell-temp-border) !important;
    background:
        linear-gradient(180deg, hsl(46 76% 94% / 0.44), transparent 38%),
        linear-gradient(180deg, var(--spell-temp-bg), hsl(41 30% 95%)) !important;
}

[data-theme="sanctum"] .spell-tile.temp-spell:hover {
    background:
        linear-gradient(180deg, hsl(46 80% 92% / 0.5), transparent 38%),
        linear-gradient(180deg, var(--spell-temp-hover-bg), hsl(41 30% 94%)) !important;
}

[data-theme="sanctum"] .discipline-header,
[data-theme="sanctum"] .info-category-header,
[data-theme="sanctum"] .info-subcategory-header,
[data-theme="sanctum"] .itemtype-header {
    background:
        radial-gradient(circle at 20% 0%, hsl(50 100% 88% / 0.72), transparent 36%),
        linear-gradient(180deg, hsl(49 92% 88%), hsl(43 68% 68%) 48%, hsl(38 54% 46%)) !important;
    color: hsl(34 62% 18%) !important;
    border: 1px solid hsl(37 74% 32% / 0.86) !important;
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.86),
        inset 0 -1px 0 hsl(34 62% 26% / 0.24),
        0 10px 18px hsl(40 72% 42% / 0.14),
        0 0 18px hsl(49 100% 82% / 0.16) !important;
}

[data-theme="sanctum"] .temp-badge {
    background: linear-gradient(180deg, hsl(50 100% 86%), hsl(44 86% 56%) 48%, hsl(38 72% 34%));
    color: hsl(34 62% 18%);
    border: 1px solid hsl(37 74% 32% / 0.76);
    box-shadow:
        inset 0 1px 0 hsl(0 0% 100% / 0.84),
        0 0 18px hsl(49 100% 82% / 0.24);
}

[data-theme="sanctum"] .spell-progress,
[data-theme="sanctum"] .buff-description {
    color: var(--text-secondary);
}

[data-theme="sanctum"] .buff-tile {
    color: var(--text-primary);
}

[data-theme="sanctum"] .buff-tile.buff,
[data-theme="sanctum"] .buff-tile[data-type="buff"] {
    border-color: var(--color-buff-tile-border);
}

[data-theme="sanctum"] .buff-tile.debuff,
[data-theme="sanctum"] .buff-tile[data-type="debuff"] {
    border-color: var(--color-debuff-tile-border);
}

/* ==========================================================================
   Story notes and notes button
   ========================================================================= */

[data-theme="sanctum"] #sn-tab-btn-notes,
[data-theme="sanctum"] #sn-tab-btn-npcs {
    color: hsl(39 40% 32%) !important;
    border-bottom-color: transparent !important;
}

[data-theme="sanctum"] .story-note-icon {
    filter: var(--icon-filter);
    border-color: var(--border-color);
}

[data-theme="sanctum"] .story-image {
    filter: saturate(0.95) brightness(1.02) contrast(1.01);
    border-color: var(--border-color);
}

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

/* ==========================================================================
   Utility effects
   ========================================================================= */

[data-theme="sanctum"] .glow-primary,
[data-theme="sanctum"] .bonfire-glow {
    animation: haloBreath 3s ease-in-out infinite;
}

[data-theme="sanctum"] .glow-accent,
[data-theme="sanctum"] .dark-aura {
    box-shadow: 0 0 22px hsl(214 28% 80% / 0.16);
}

[data-theme="sanctum"] .glow-danger,
[data-theme="sanctum"] .glow-gm {
    box-shadow: 0 0 20px hsl(352 54% 72% / 0.16);
}

[data-theme="sanctum"] ::selection,
[data-theme="sanctum"] ::-moz-selection {
    background: hsl(46 88% 78% / 0.36);
    color: hsl(39 46% 24%);
}

[data-theme="sanctum"] ::-webkit-scrollbar-track {
    background: hsl(40 24% 90%);
}

[data-theme="sanctum"] ::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, hsl(46 74% 82%), hsl(40 34% 56%));
    border: 1px solid hsl(41 30% 52% / 0.78);
}

[data-theme="sanctum"] ::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, hsl(46 80% 86%), hsl(40 38% 50%));
}

[data-theme="sanctum"] canvas {
    filter: saturate(1.02) brightness(1.02) contrast(1.02);
}
[data-theme="sanctum"] .toxicity-container {
    border-color: var(--color-toxicity) !important;
}

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

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