/* ==========================================================================
   RUNIC THEME: Crimson Wine Reforged
   Aristocratic gothic vampire manor, moonlit velvet, old wine lacquer, ivory bone, and candlelit gold.
   ========================================================================= */

[data-theme="crimson-wine"] {
    /* Core hue system */
    --hue-primary: 349;
    --hue-accent: 38;
    --hue-gm: 320;
    --hue-danger: 356;
    --hue-warning: 28;
    --hue-success: 150;
    --hue-toxicity: 118;
    --hue-neutral: 240;

    --sat-primary: 54%;
    --lit-primary: 54%;
    --lit-primary-hover: 60%;

    --sat-accent: 58%;
    --lit-accent: 67%;
    --lit-accent-hover: 73%;

    --sat-gm: 42%;
    --lit-gm: 58%;
    --lit-gm-text: 92%;

    --sat-danger: 66%;
    --lit-danger: 56%;
    --lit-danger-hover: 62%;

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

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

    --sat-toxicity: 44%;
    --lit-toxicity: 54%;

    --lightness-bg: 7%;

    /* Form and timing */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 14px;
    --radius-xl: 20px;
    --radius-2xl: 28px;

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

    --duration-75: 100ms;
    --duration-150: 180ms;
    --duration-250: 300ms;
    --duration-300: 420ms;
    --duration-400: 760ms;

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

    /* Identity */
    --velvet-black: hsl(252 16% 7%);
    --gothic-plum: hsl(324 24% 14%);
    --claret-wine: hsl(348 46% 24%);
    --oxblood: hsl(352 54% 34%);
    --rose-blood: hsl(348 64% 56%);
    --moon-ivory: hsl(36 26% 90%);
    --bone-ivory: hsl(36 22% 84%);
    --candle-gold: hsl(38 68% 66%);
    --antique-gold: hsl(34 44% 52%);
    --silver-mist: hsl(238 18% 76%);
    --dust-lilac: hsl(318 14% 66%);
    --mahogany: hsl(10 34% 18%);
    --shadow-ink: hsl(252 18% 12%);

    /* Surfaces */
    --bg-page: hsl(252 18% 7%);
    --bg-primary: hsl(252 18% 9%);
    --bg-secondary: hsl(258 16% 12% / 0.92);
    --bg-tertiary: hsl(322 18% 14% / 0.96);
    --bg-card: hsl(320 16% 13% / 0.94);
    --bg-hover: hsl(344 24% 22% / 0.52);
    --bg-input: hsl(318 16% 14%);

    --surface-elevated: hsl(322 18% 17%);
    --surface-overlay: hsl(252 20% 12% / 0.98);
    --surface-panel: hsl(320 18% 15% / 0.96);

    /* Text */
    --text-primary: hsl(34 22% 90%);
    --text-secondary: hsl(30 16% 76%);
    --text-label: hsl(38 58% 68%);
    --text-light: hsl(34 32% 96%);
    --text-muted: hsl(320 10% 68% / 0.82);

    /* Borders and shadows */
    --border-color: hsl(38 30% 58% / 0.22);
    --border-subtle: hsl(36 18% 62% / 0.12);
    --border-strong: hsl(38 48% 70% / 0.52);

    --shadow-glow-primary:
        0 18px 36px hsl(252 26% 4% / 0.44),
        0 0 24px hsl(348 64% 56% / 0.12);
    --shadow-glow-accent:
        0 10px 24px hsl(38 68% 66% / 0.18);
    --shadow-glow-danger:
        0 10px 22px hsl(352 54% 34% / 0.2);
    --shadow-glow-gold:
        0 0 24px hsl(38 68% 66% / 0.24);

    /* Icons */
    --icon-color: hsl(38 62% 70%);
    --icon-filter: brightness(0) saturate(100%) invert(86%) sepia(14%)
        saturate(764%) hue-rotate(335deg) brightness(95%) contrast(90%);

    /* Focus and tooltip */
    --color-focus-ring: hsl(348 64% 56% / 0.22);

    --color-tooltip-bg: hsl(252 18% 10% / 0.98);
    --color-tooltip-highlight: hsl(38 70% 72%);
    --color-tooltip-effect-bg: hsl(348 54% 44% / 0.12);
    --color-tooltip-text: hsl(34 22% 90%);
    --color-tooltip-label: hsl(38 52% 68%);
    --color-tooltip-muted: hsl(320 10% 68%);
    --color-tooltip-dim: hsl(318 8% 56%);
    --color-tooltip-pos: hsl(150 34% 58%);
    --color-tooltip-neg: hsl(352 60% 62%);
    --color-tooltip-separator: hsl(38 34% 58% / 0.3);
    --color-tooltip-section-bg: hsl(320 16% 16% / 0.88);

    /* Quality colors */
    --quality-0-color1: rgb(104, 94, 96);
    --quality-0-color2: rgb(72, 62, 64);
    --quality-1-color1: rgb(228, 216, 204);
    --quality-1-color2: rgb(188, 170, 154);
    --quality-2-color1: rgb(154, 202, 172);
    --quality-2-color2: rgb(108, 154, 128);
    --quality-3-color1: rgb(196, 118, 158);
    --quality-3-color2: rgb(148, 76, 118);
    --quality-4-color1: rgb(188, 122, 224);
    --quality-4-color2: rgb(140, 78, 182);
    --quality-5-color1: rgb(244, 206, 108);
    --quality-5-color2: rgb(208, 154, 62);
    --quality-6-color1: rgb(226, 96, 118);
    --quality-6-color2: rgb(170, 52, 70);
    --quality-7-color1: rgb(244, 226, 188);
    --quality-7-color2: rgb(216, 118, 162);

    /* Spell / element system */
    --element-fire-bg: hsl(10 30% 18% / 0.82);
    --element-fire-border: hsl(16 50% 56% / 0.56);
    --element-fire-hover: hsl(10 34% 22% / 0.92);
    --element-fire-glow: hsl(16 50% 56% / 0.16);

    --element-water-bg: hsl(236 20% 18% / 0.82);
    --element-water-border: hsl(234 30% 56% / 0.5);
    --element-water-hover: hsl(236 24% 22% / 0.92);
    --element-water-glow: hsl(234 36% 60% / 0.14);

    --element-earth-bg: hsl(24 18% 18% / 0.82);
    --element-earth-border: hsl(28 26% 48% / 0.48);
    --element-earth-hover: hsl(24 22% 22% / 0.92);
    --element-earth-glow: hsl(28 34% 56% / 0.12);

    --element-wind-bg: hsl(264 18% 18% / 0.82);
    --element-wind-border: hsl(270 26% 56% / 0.48);
    --element-wind-hover: hsl(264 22% 22% / 0.92);
    --element-wind-glow: hsl(270 34% 60% / 0.14);

    --element-light-bg: hsl(40 22% 20% / 0.84);
    --element-light-border: hsl(38 58% 62% / 0.6);
    --element-light-hover: hsl(40 28% 24% / 0.94);
    --element-light-glow: hsl(38 68% 66% / 0.2);

    --element-shadow-bg: hsl(320 18% 18% / 0.84);
    --element-shadow-border: hsl(324 32% 58% / 0.54);
    --element-shadow-hover: hsl(320 22% 22% / 0.94);
    --element-shadow-glow: hsl(324 38% 62% / 0.16);

    --element-death-bg: hsl(346 22% 18% / 0.82);
    --element-death-border: hsl(348 40% 56% / 0.56);
    --element-death-hover: hsl(346 28% 22% / 0.92);
    --element-death-glow: hsl(348 44% 60% / 0.16);

    --element-life-bg: hsl(148 16% 18% / 0.82);
    --element-life-border: hsl(150 24% 48% / 0.5);
    --element-life-hover: hsl(148 20% 22% / 0.92);
    --element-life-glow: hsl(150 32% 56% / 0.14);

    --element-arcane-bg: hsl(294 18% 18% / 0.84);
    --element-arcane-border: hsl(296 34% 60% / 0.54);
    --element-arcane-hover: hsl(294 24% 22% / 0.94);
    --element-arcane-glow: hsl(296 38% 66% / 0.18);

    --element-mind-bg: hsl(248 18% 18% / 0.82);
    --element-mind-border: hsl(248 26% 54% / 0.5);
    --element-mind-hover: hsl(248 22% 22% / 0.92);
    --element-mind-glow: hsl(248 34% 60% / 0.14);

    --element-physical-bg: hsl(16 18% 18% / 0.84);
    --element-physical-border: hsl(22 22% 46% / 0.46);
    --element-physical-hover: hsl(16 22% 22% / 0.94);
    --element-physical-glow: hsl(22 30% 54% / 0.12);

    --spell-temp-bg: hsl(320 18% 16%);
    --spell-temp-border: hsl(38 44% 60% / 0.72);
    --spell-temp-hover-bg: hsl(324 22% 20%);
    --spell-temp-hover-glow: hsl(348 64% 56% / 0.16);
    --spell-temp-badge-bg: hsl(38 54% 50%);
    --spell-temp-header-bg: hsl(320 18% 18%);
    --spell-temp-header-hover-bg: hsl(324 22% 22%);
    --spell-tile-hover-bg: hsl(324 18% 20%);

    /* Inventory / currency / buffs */
    --item-tile-base: hsl(320 16% 16%);
    --item-tile-border: hsl(38 22% 50% / 0.38);
    --item-tile-add-bg: hsl(318 16% 14%);
    --item-tile-add-border: hsl(36 18% 46% / 0.34);
    --item-tile-add-hover: hsl(324 20% 18%);
    --item-tile-add-border-hover: hsl(38 42% 68% / 0.6);

    --weight-display-bg: hsl(320 16% 14%);
    --weight-ok-color: hsl(150 34% 58%);
    --weight-warn-color: hsl(28 70% 62%);
    --weight-crit-color: hsl(348 58% 58%);
    --weight-bar-track-bg: hsl(320 12% 22%);

    --currency-tile-bg: hsl(320 16% 16%);
    --currency-tile-border: hsl(38 24% 50% / 0.42);
    --currency-tile-hover-bg: hsl(324 20% 18%);
    --currency-tile-hover-shadow: hsl(38 68% 66% / 0.14);
    --currency-quantity-bg: hsl(322 16% 22%);
    --currency-add-bg: hsl(318 16% 14%);
    --currency-add-border: hsl(36 18% 46% / 0.34);
    --currency-add-hover-bg: hsl(324 20% 18%);
    --currency-add-hover-border: hsl(38 44% 70% / 0.64);

    --color-buff-tile-bg: hsl(150 14% 18%);
    --color-buff-tile-border: hsl(150 24% 48% / 0.42);
    --color-buff-tile-hover: hsl(150 18% 22%);
    --color-buff-tile-glow: hsl(150 32% 56% / 0.12);
    --color-debuff-tile-bg: hsl(348 18% 18%);
    --color-debuff-tile-border: hsl(348 34% 52% / 0.46);
    --color-debuff-tile-hover: hsl(348 22% 22%);
    --color-debuff-tile-glow: hsl(348 42% 58% / 0.14);
    --color-neutral-tile-bg: hsl(320 14% 18%);
    --color-neutral-tile-border: hsl(320 18% 42% / 0.38);
    --color-neutral-tile-hover: hsl(322 18% 22%);
    --color-neutral-tile-glow: hsl(320 28% 60% / 0.08);
    --color-buff-indicator: hsl(150 34% 58%);
    --color-debuff-indicator: hsl(348 58% 58%);

    /* Common status colors */
    --color-heal: hsl(150 34% 58%);
    --color-gold: hsl(38 64% 66%);
    --color-amber: hsl(28 68% 58%);
    --color-amber-ui: hsl(28 68% 58%);
    --color-crit: hsl(348 58% 58%);
    --border-gold: hsl(38 48% 66% / 0.38);

    /* Overlays */
    --overlay-heavy: hsl(252 30% 4% / 0.82);
    --overlay-dark: hsl(252 20% 8% / 0.56);
    --overlay-medium: hsl(318 14% 10% / 0.3);
    --overlay-light: hsl(320 12% 12% / 0.14);
    --overlay-subtle: hsl(322 10% 12% / 0.08);
}

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

@keyframes moonDrift {
    0%, 100% { transform: translateX(-50%) scale(1); opacity: 0.5; }
    50% { transform: translateX(-50%) scale(1.04); opacity: 0.72; }
}

@keyframes candlePulse {
    0%, 100% { opacity: 0.48; transform: scale(1); }
    50% { opacity: 0.9; transform: scale(1.07); }
}

@keyframes velvetBreath {
    0%, 100% {
        box-shadow:
            0 0 0 1px hsl(38 24% 56% / 0.14),
            0 16px 34px hsl(252 26% 4% / 0.42);
    }
    50% {
        box-shadow:
            0 0 0 1px hsl(348 54% 46% / 0.24),
            0 20px 42px hsl(252 26% 4% / 0.52),
            0 0 24px hsl(38 68% 66% / 0.12);
    }
}

/* ==========================================================================
   Global Atmosphere
   ========================================================================= */

[data-theme="crimson-wine"] body,
[data-theme="crimson-wine"] .page-content,
[data-theme="crimson-wine"] .main-content,
[data-theme="crimson-wine"] .content-wrapper {
    background:
        radial-gradient(circle at 50% 0%, hsl(348 54% 24% / 0.3), transparent 20%),
        radial-gradient(circle at 18% 72%, hsl(38 22% 22% / 0.08), transparent 16%),
        radial-gradient(circle at 84% 20%, hsl(320 24% 20% / 0.12), transparent 18%),
        linear-gradient(180deg, hsl(252 18% 9%), hsl(252 22% 6%) 46%, hsl(320 18% 7%) 100%);
    color: var(--text-primary);
}

[data-theme="crimson-wine"] body::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 50%, hsl(38 48% 72% / 0.05) 0 1px, transparent 2px),
        radial-gradient(circle at 14% 18%, hsl(320 20% 72% / 0.05) 0 1px, transparent 2px),
        radial-gradient(circle at 84% 72%, hsl(348 44% 56% / 0.05) 0 1px, transparent 2px);
    background-size: 280px 280px, 220px 220px, 320px 320px;
    opacity: 0.42;
    z-index: 0;
}

[data-theme="crimson-wine"] body::after {
    content: '';
    position: fixed;
    left: 50%;
    top: 10%;
    width: 32rem;
    height: 32rem;
    transform: translateX(-50%);
    border-radius: 50%;
    pointer-events: none;
    background:
        radial-gradient(circle at 45% 40%, hsl(36 40% 94% / 0.9), hsl(36 20% 82% / 0.4) 28%, hsl(348 54% 34% / 0.1) 62%, transparent 74%),
        radial-gradient(circle, transparent 58%, hsl(348 44% 50% / 0.08) 60% 64%, transparent 66%);
    filter: blur(1px);
    animation: moonDrift 11s ease-in-out infinite;
    opacity: 0.62;
    z-index: 0;
}

[data-theme="crimson-wine"] .navigation-bar,
[data-theme="crimson-wine"] .content-box,
[data-theme="crimson-wine"] .dashboard-panel,
[data-theme="crimson-wine"] .modal-content,
[data-theme="crimson-wine"] .character-sheet-panel,
[data-theme="crimson-wine"] .inventory-section {
    position: relative;
    z-index: 1;
}

/* ==========================================================================
   Shared Panels
   ========================================================================= */

[data-theme="crimson-wine"] .content-box,
[data-theme="crimson-wine"] .dashboard-panel,
[data-theme="crimson-wine"] .modal-content,
[data-theme="crimson-wine"] .equipment-panel,
[data-theme="crimson-wine"] .inventory-section,
[data-theme="crimson-wine"] .spell-tooltip,
[data-theme="crimson-wine"] .login-container,
[data-theme="crimson-wine"] .widget-tile,
[data-theme="crimson-wine"] .character-item,
[data-theme="crimson-wine"] .attribute-card,
[data-theme="crimson-wine"] .bereich-tile,
[data-theme="crimson-wine"] .spell-tile,
[data-theme="crimson-wine"] .resistance-tile {
    background:
        linear-gradient(180deg, hsl(320 18% 16% / 0.96), hsl(252 20% 10% / 0.96));
    border: 1px solid var(--border-color);
    border-radius: var(--radius-xl);
    box-shadow:
        0 18px 38px hsl(252 26% 4% / 0.46),
        inset 0 1px 0 hsl(36 24% 96% / 0.06);
}

[data-theme="crimson-wine"] .content-box::before,
[data-theme="crimson-wine"] .dashboard-panel::before,
[data-theme="crimson-wine"] .modal-content::before,
[data-theme="crimson-wine"] .widget-tile::before,
[data-theme="crimson-wine"] .character-item::before,
[data-theme="crimson-wine"] .attribute-card::before,
[data-theme="crimson-wine"] .login-container::before {
    content: '';
    position: absolute;
    inset: 10px;
    border-radius: calc(var(--radius-xl) - 8px);
    border: 1px solid hsl(38 24% 56% / 0.08);
    pointer-events: none;
}

[data-theme="crimson-wine"] .content-box:hover,
[data-theme="crimson-wine"] .dashboard-panel:hover,
[data-theme="crimson-wine"] .widget-tile:hover,
[data-theme="crimson-wine"] .character-item:hover,
[data-theme="crimson-wine"] .attribute-card:hover,
[data-theme="crimson-wine"] .bereich-tile:hover,
[data-theme="crimson-wine"] .spell-tile:hover {
    border-color: var(--border-strong);
    animation: velvetBreath 3.2s ease-in-out infinite;
}

/* ==========================================================================
   Typography and Icons
   ========================================================================= */

[data-theme="crimson-wine"] h1,
[data-theme="crimson-wine"] h2,
[data-theme="crimson-wine"] h3,
[data-theme="crimson-wine"] .widget-title,
[data-theme="crimson-wine"] .character-info h3,
[data-theme="crimson-wine"] .bereich-title,
[data-theme="crimson-wine"] .attribute-name,
[data-theme="crimson-wine"] #charNameLabel {
    color: hsl(38 64% 74%);
    text-shadow:
        0 0 10px hsl(38 48% 66% / 0.18),
        0 0 26px hsl(348 54% 46% / 0.1);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-variant: small-caps;
}

[data-theme="crimson-wine"] .icon-themed,
[data-theme="crimson-wine"] .spell-icon,
[data-theme="crimson-wine"] .resistance-icon,
[data-theme="crimson-wine"] .currency-icon,
[data-theme="crimson-wine"] .buff-icon,
[data-theme="crimson-wine"] .tab_Icon,
[data-theme="crimson-wine"] .tab_btn img,
[data-theme="crimson-wine"] .nav-icon-btn img,
[data-theme="crimson-wine"] #div_iconbar_left img,
[data-theme="crimson-wine"] #div_iconbar_right img {
    filter: var(--icon-filter);
}

/* ==========================================================================
   Headers and Category Bars
   ========================================================================= */

[data-theme="crimson-wine"] .discipline-header,
[data-theme="crimson-wine"] .info-category-header,
[data-theme="crimson-wine"] .info-subcategory-header,
[data-theme="crimson-wine"] .itemtype-header {
    background:
        linear-gradient(135deg, hsl(348 34% 22%), hsl(320 20% 14%));
    color: hsl(38 62% 74%) !important;
    border: 1px solid hsl(38 32% 56% / 0.24);
    border-radius: var(--radius-lg);
    box-shadow: inset 0 1px 0 hsl(36 24% 96% / 0.08);
}

[data-theme="crimson-wine"] .discipline-header:hover,
[data-theme="crimson-wine"] .info-category-header:hover,
[data-theme="crimson-wine"] .itemtype-header:hover {
    background:
        linear-gradient(135deg, hsl(348 38% 26%), hsl(322 22% 16%));
}

[data-theme="crimson-wine"] .subskill-item.passive {
    background: hsl(320 18% 18% / 0.6) !important;
}

/* ==========================================================================
   Navigation
   ========================================================================= */

[data-theme="crimson-wine"] .navigation-bar,
[data-theme="crimson-wine"] .tab-top-navigation {
    background:
        linear-gradient(180deg, hsl(320 18% 14% / 0.98), hsl(252 20% 8% / 0.98));
    border-bottom: 1px solid hsl(38 24% 56% / 0.18);
    box-shadow:
        0 14px 30px hsl(252 26% 4% / 0.46),
        inset 0 1px 0 hsl(36 24% 96% / 0.06);
}

[data-theme="crimson-wine"] .tab_btn,
[data-theme="crimson-wine"] .tab_btn_vertical,
[data-theme="crimson-wine"] .tab-buttons .tab-btn,
[data-theme="crimson-wine"] .tab-navigation .tab-btn,
[data-theme="crimson-wine"] .tab_btn_horizontal,
[data-theme="crimson-wine"] .tab_btn_original {
    background:
        linear-gradient(180deg, hsl(320 22% 18%), hsl(252 20% 10%)) !important;
    border: 1px solid hsl(38 20% 52% / 0.2) !important;
    color: hsl(38 46% 74%) !important;
    box-shadow:
        inset 0 1px 0 hsl(36 24% 96% / 0.06),
        0 8px 18px hsl(252 26% 4% / 0.28);
}

[data-theme="crimson-wine"] .tab_btn:hover,
[data-theme="crimson-wine"] .tab_btn_vertical:hover,
[data-theme="crimson-wine"] .tab-buttons .tab-btn:hover,
[data-theme="crimson-wine"] .tab-navigation .tab-btn:hover,
[data-theme="crimson-wine"] .tab_btn_horizontal:hover,
[data-theme="crimson-wine"] .tab_btn_original:hover {
    background:
        linear-gradient(180deg, hsl(348 28% 24%), hsl(320 22% 14%)) !important;
    border-color: hsl(38 40% 66% / 0.4) !important;
    box-shadow:
        0 10px 22px hsl(252 26% 4% / 0.32),
        0 0 16px hsl(348 54% 46% / 0.08);
}

[data-theme="crimson-wine"] .tab_btn.active,
[data-theme="crimson-wine"] .tab_btn.active-tab,
[data-theme="crimson-wine"] .tab_btn_vertical.active,
[data-theme="crimson-wine"] .tab-buttons .tab-btn.active,
[data-theme="crimson-wine"] .tab-navigation .tab-btn.active,
[data-theme="crimson-wine"] .tab_btn_horizontal.active,
[data-theme="crimson-wine"] .tab_btn_horizontal.main-tab,
[data-theme="crimson-wine"] .tab_btn_horizontal.main-tab.active,
[data-theme="crimson-wine"] .tab_btn_original.active,
[data-theme="crimson-wine"] #navi-btn-combat.tab_btn.combat-active {
    background:
        linear-gradient(135deg, hsl(348 54% 42%), hsl(12 34% 28%)) !important;
    border-color: hsl(38 54% 74%) !important;
    color: hsl(34 32% 96%) !important;
    box-shadow:
        0 0 0 3px hsl(348 54% 42% / 0.16),
        0 14px 28px hsl(252 26% 4% / 0.34),
        0 0 22px hsl(38 68% 66% / 0.14) !important;
}

[data-theme="crimson-wine"] .tab_btn.active-tab .tab_Icon,
[data-theme="crimson-wine"] .tab_btn.active-tab img,
[data-theme="crimson-wine"] .tab_btn_vertical.active img,
[data-theme="crimson-wine"] .tab-buttons .tab-btn.active .tab_Icon,
[data-theme="crimson-wine"] .tab-navigation .tab-btn.active .tab_Icon,
[data-theme="crimson-wine"] .tab_btn_horizontal.active img,
[data-theme="crimson-wine"] .tab_btn_horizontal.main-tab img,
[data-theme="crimson-wine"] .tab_btn_original.active img,
[data-theme="crimson-wine"] #navi-btn-combat.tab_btn.combat-active img {
    filter:
        brightness(0) saturate(100%) invert(97%) sepia(8%)
        saturate(423%) hue-rotate(314deg) brightness(108%) contrast(93%) !important;
}

/* ==========================================================================
   Buttons and Inputs
   ========================================================================= */

[data-theme="crimson-wine"] button,
[data-theme="crimson-wine"] .btn,
[data-theme="crimson-wine"] .roll-button,
[data-theme="crimson-wine"] input[type="button"],
[data-theme="crimson-wine"] input[type="submit"] {
    background:
        linear-gradient(135deg, hsl(348 52% 44%), hsl(10 34% 30%));
    color: hsl(34 30% 94%);
    border: 1px solid hsl(38 30% 58% / 0.3);
    border-radius: var(--radius-lg);
    box-shadow:
        0 10px 22px hsl(252 26% 4% / 0.34),
        inset 0 1px 0 hsl(36 24% 96% / 0.12);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
}

[data-theme="crimson-wine"] button:hover,
[data-theme="crimson-wine"] .btn:hover,
[data-theme="crimson-wine"] .roll-button:hover,
[data-theme="crimson-wine"] input[type="button"]:hover,
[data-theme="crimson-wine"] input[type="submit"]:hover {
    background:
        linear-gradient(135deg, hsl(348 58% 50%), hsl(18 38% 36%));
    box-shadow:
        0 14px 28px hsl(252 26% 4% / 0.38),
        0 0 18px hsl(38 68% 66% / 0.12);
}

[data-theme="crimson-wine"] input,
[data-theme="crimson-wine"] textarea,
[data-theme="crimson-wine"] select,
[data-theme="crimson-wine"] .select,
[data-theme="crimson-wine"] .form-select,
[data-theme="crimson-wine"] .equipment-select {
    background:
        linear-gradient(180deg, hsl(320 16% 16%), hsl(252 18% 12%));
    border: 1px solid hsl(38 18% 52% / 0.2);
    border-radius: var(--radius-lg);
    color: var(--text-primary);
    box-shadow: inset 0 1px 0 hsl(36 24% 96% / 0.05);
}

[data-theme="crimson-wine"] input:focus,
[data-theme="crimson-wine"] textarea:focus,
[data-theme="crimson-wine"] select:focus,
[data-theme="crimson-wine"] .select:focus,
[data-theme="crimson-wine"] .form-select:focus,
[data-theme="crimson-wine"] .equipment-select:focus {
    border-color: hsl(348 54% 50%);
    box-shadow:
        0 0 0 4px var(--color-focus-ring),
        0 0 18px hsl(348 54% 46% / 0.12);
    outline: none;
}

[data-theme="crimson-wine"] select,
[data-theme="crimson-wine"] .select,
[data-theme="crimson-wine"] .form-select,
[data-theme="crimson-wine"] .equipment-select {
    appearance: none;
    -webkit-appearance: none;
    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='%23d4b27a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.7rem center;
    background-size: 14px;
    padding-right: 2rem;
}

/* ==========================================================================
   Tables
   ========================================================================= */

[data-theme="crimson-wine"] table {
    background: hsl(320 16% 12% / 0.96);
    border: 1px solid hsl(38 18% 46% / 0.14);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

[data-theme="crimson-wine"] th {
    background: hsl(348 26% 24% / 0.3);
    color: hsl(38 56% 74%);
}

[data-theme="crimson-wine"] td {
    background: hsl(320 14% 13% / 0.92);
    color: var(--text-primary);
    border-bottom: 1px solid hsl(38 14% 40% / 0.08);
}

[data-theme="crimson-wine"] tr:hover td {
    background: hsl(324 16% 17% / 0.96);
}

/* ==========================================================================
   Cards, Widgets, Login
   ========================================================================= */

[data-theme="crimson-wine"] .widget-tile,
[data-theme="crimson-wine"] .character-item {
    overflow: hidden;
}

[data-theme="crimson-wine"] .character-item:hover,
[data-theme="crimson-wine"] .widget-tile:hover {
    transform: translateY(-3px);
}

[data-theme="crimson-wine"] .character-item::after,
[data-theme="crimson-wine"] .widget-tile::after,
[data-theme="crimson-wine"] .login-container::after {
    content: '';
    position: absolute;
    top: 14px;
    right: 16px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 35% 35%, hsl(36 36% 96%), hsl(38 58% 68%) 46%, hsl(348 54% 46%) 100%);
    box-shadow:
        18px 0 0 -4px hsl(320 22% 72% / 0.6),
        0 18px 0 -4px hsl(38 68% 66% / 0.6);
    animation: candlePulse 4s ease-in-out infinite;
}

[data-theme="crimson-wine"] .login-container {
    border-radius: var(--radius-2xl);
}

/* ==========================================================================
   Attribute Cards and Stats
   ========================================================================= */

[data-theme="crimson-wine"] .attribute-cards-container {
    background:
        linear-gradient(180deg, hsl(320 14% 12% / 0.42), hsl(252 18% 10% / 0.42));
    border-radius: var(--radius-2xl);
}

[data-theme="crimson-wine"] .attribute-card {
    position: relative;
}

[data-theme="crimson-wine"] .attribute-card::after {
    content: '';
    position: absolute;
    inset: 12px auto auto 12px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid hsl(38 30% 58% / 0.2);
    box-shadow: 0 0 0 5px hsl(348 54% 46% / 0.04);
    pointer-events: none;
}

[data-theme="crimson-wine"] .attribute-icon-container {
    background:
        linear-gradient(135deg, hsl(348 36% 28%), hsl(20 28% 22%));
    color: hsl(38 62% 74%);
}

[data-theme="crimson-wine"] .attribute-value,
[data-theme="crimson-wine"] .stat-value,
[data-theme="crimson-wine"] .tt-total-label,
[data-theme="crimson-wine"] .tt-total-value {
    color: hsl(348 58% 72%);
}

[data-theme="crimson-wine"] .attribute-bonus {
    background: hsl(150 14% 18%);
    color: hsl(150 34% 64%);
}

[data-theme="crimson-wine"] .attribute-subskills,
[data-theme="crimson-wine"] .roll-result {
    background: hsl(320 14% 13% / 0.88);
    border: 1px solid hsl(38 18% 46% / 0.14);
    border-radius: var(--radius-lg);
}

[data-theme="crimson-wine"] .subskill-item {
    border-bottom-color: hsl(38 14% 40% / 0.08);
}

[data-theme="crimson-wine"] .subskill-name {
    color: hsl(38 52% 72%);
}

[data-theme="crimson-wine"] .subskill-effect,
[data-theme="crimson-wine"] .stat-label {
    color: hsl(30 16% 76%);
}

[data-theme="crimson-wine"] .attribute-card.physical {
    border-left-color: hsl(150 34% 58%);
}

[data-theme="crimson-wine"] .attribute-card.mental {
    border-left-color: hsl(320 28% 62%);
}

[data-theme="crimson-wine"] .attribute-card.social {
    border-left-color: hsl(38 68% 66%);
}

[data-theme="crimson-wine"] .attribute-card.special {
    border-left-color: hsl(348 58% 58%);
}

[data-theme="crimson-wine"] .stat-item {
    background: hsl(320 14% 14% / 0.9);
    border: 1px solid hsl(38 14% 40% / 0.12);
    border-radius: var(--radius-lg);
}

[data-theme="crimson-wine"] .stat-item:hover {
    background: hsl(324 16% 18% / 0.94);
}

/* ==========================================================================
   Inventory, Spellbook, Resistances
   ========================================================================= */

[data-theme="crimson-wine"] .currency-tile,
[data-theme="crimson-wine"] .resistance-tile,
[data-theme="crimson-wine"] .buff-tile,
[data-theme="crimson-wine"] .inventory-slot,
[data-theme="crimson-wine"] .inventory-item {
    border-radius: var(--radius-lg);
    box-shadow: inset 0 1px 0 hsl(36 24% 96% / 0.04);
}

[data-theme="crimson-wine"] .currency-add-icon {
    color: hsl(38 62% 72%);
}

[data-theme="crimson-wine"] .buff-duration {
    background-color: hsl(320 16% 20% / 0.72);
    color: hsl(34 22% 86%);
}

[data-theme="crimson-wine"] .no-buffs-message,
[data-theme="crimson-wine"] .resistance-stat-label {
    color: hsl(320 10% 68%);
}

[data-theme="crimson-wine"] .equipped-indicator-icon {
    background-color: hsl(38 50% 50%);
    filter: drop-shadow(0 0 6px hsl(38 68% 66% / 0.34));
}

[data-theme="crimson-wine"] .spell-tile.temp-spell {
    border-color: var(--spell-temp-border) !important;
    background:
        linear-gradient(180deg, var(--spell-temp-bg), hsl(252 18% 12%)) !important;
}

[data-theme="crimson-wine"] .spell-tile.temp-spell:hover {
    background:
        linear-gradient(180deg, var(--spell-temp-hover-bg), hsl(320 18% 16%)) !important;
}

[data-theme="crimson-wine"] .spell-name,
[data-theme="crimson-wine"] .spell-progress {
    color: hsl(34 22% 90%);
}

[data-theme="crimson-wine"] .spell-cost {
    color: hsl(38 58% 70%);
}

/* ==========================================================================
   Bars and Progress
   ========================================================================= */

[data-theme="crimson-wine"] .progress-container,
[data-theme="crimson-wine"] .bar-track,
[data-theme="crimson-wine"] .resource-bar,
[data-theme="crimson-wine"] .weight-bar-container {
    background:
        linear-gradient(180deg, hsl(320 12% 12%), hsl(252 18% 8%)) !important;
    border: 1px solid hsl(38 14% 40% / 0.14) !important;
    border-radius: 999px !important;
    box-shadow:
        inset 0 2px 6px hsl(252 26% 4% / 0.44),
        inset 0 1px 0 hsl(36 24% 96% / 0.03);
}

[data-theme="crimson-wine"] #healthText,
[data-theme="crimson-wine"] #magicText,
[data-theme="crimson-wine"] #enduranceText {
    color: hsl(34 32% 96%);
    text-shadow: 0 0 10px hsl(252 26% 4% / 0.6);
}

[data-theme="crimson-wine"] .progress-bar,
[data-theme="crimson-wine"] .progress-fill,
[data-theme="crimson-wine"] .bar-fill {
    border-radius: 999px !important;
    overflow: hidden;
}

[data-theme="crimson-wine"] .health-bar,
[data-theme="crimson-wine"] .hp-bar-fill {
    background:
        linear-gradient(90deg, hsl(346 36% 30%) 0%, hsl(352 58% 48%) 58%, hsl(8 50% 58%) 100%) !important;
    box-shadow: 0 0 14px hsl(352 58% 48% / 0.14) !important;
}

[data-theme="crimson-wine"] .magic-bar,
[data-theme="crimson-wine"] .mana-bar-fill,
[data-theme="crimson-wine"] .energy-bar-fill {
    background:
        linear-gradient(90deg, hsl(250 26% 34%) 0%, hsl(318 28% 48%) 58%, hsl(332 26% 64%) 100%) !important;
    box-shadow: 0 0 16px hsl(320 26% 64% / 0.14) !important;
}

[data-theme="crimson-wine"] .endurance-bar,
[data-theme="crimson-wine"] .stamina-bar-fill {
    background:
        linear-gradient(90deg, hsl(24 42% 36%) 0%, hsl(38 64% 56%) 58%, hsl(48 70% 70%) 100%) !important;
    box-shadow: 0 0 14px hsl(38 64% 56% / 0.14) !important;
}

[data-theme="crimson-wine"] .weight-progress-bar.weight-ok,
[data-theme="crimson-wine"] .weight-fill,
[data-theme="crimson-wine"] .encumbrance-fill {
    background:
        linear-gradient(90deg, hsl(150 24% 40%) 0%, hsl(150 34% 58%) 100%) !important;
}

[data-theme="crimson-wine"] .weight-progress-bar.weight-warn {
    background:
        linear-gradient(90deg, hsl(24 42% 36%) 0%, hsl(38 64% 56%) 100%) !important;
}

[data-theme="crimson-wine"] .weight-progress-bar.weight-crit {
    background:
        linear-gradient(90deg, hsl(346 36% 30%) 0%, hsl(352 58% 48%) 100%) !important;
}

/* ==========================================================================
   Tooltips
   ========================================================================= */

[data-theme="crimson-wine"] .unified-tooltip,
[data-theme="crimson-wine"] .spell-tooltip,
[data-theme="crimson-wine"] #item-tooltip {
    background:
        linear-gradient(180deg, hsl(320 16% 14% / 0.98), hsl(252 18% 10% / 0.98));
    border: 1px solid hsl(38 24% 56% / 0.2);
    border-radius: var(--radius-xl);
    color: var(--color-tooltip-text);
    box-shadow:
        0 18px 40px hsl(252 26% 4% / 0.5),
        0 0 18px hsl(38 68% 66% / 0.08);
}

[data-theme="crimson-wine"] .itooltip-title,
[data-theme="crimson-wine"] .skilltooltip-title,
[data-theme="crimson-wine"] .attrtooltip-title,
[data-theme="crimson-wine"] .stattooltip-title,
[data-theme="crimson-wine"] .unified-tooltip .tooltip-title {
    color: hsl(38 64% 74%) !important;
}

[data-theme="crimson-wine"] .tt-section {
    background: hsl(320 16% 16% / 0.72);
    border-radius: var(--radius-md);
}

[data-theme="crimson-wine"] .tt-sep-accent {
    border-top-color: hsl(38 44% 68%);
}

/* ==========================================================================
   Toggles and Controls
   ========================================================================= */

[data-theme="crimson-wine"] .twohanded-toggle {
    background: transparent !important;
    border: 2px solid hsl(38 18% 48%);
    border-radius: 999px;
    box-shadow: inset 0 1px 0 hsl(36 24% 96% / 0.04);
}

[data-theme="crimson-wine"] .twohanded-toggle:hover {
    background: hsl(324 18% 18% / 0.34) !important;
    border-color: hsl(38 44% 68%);
    box-shadow: 0 0 12px hsl(38 68% 66% / 0.08);
}

[data-theme="crimson-wine"] .twohanded-toggle.active {
    background:
        linear-gradient(135deg, hsl(348 54% 42%), hsl(12 34% 30%)) !important;
    border-color: hsl(38 50% 72%);
}

/* ==========================================================================
   Scrollbar and Selection
   ========================================================================= */

[data-theme="crimson-wine"] ::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

[data-theme="crimson-wine"] ::-webkit-scrollbar-track {
    background: hsl(252 18% 10%);
}

[data-theme="crimson-wine"] ::-webkit-scrollbar-thumb {
    background:
        linear-gradient(180deg, hsl(348 42% 32%), hsl(320 18% 22%));
    border-radius: 999px;
    border: 2px solid hsl(252 18% 10%);
}

[data-theme="crimson-wine"] ::-webkit-scrollbar-thumb:hover {
    background:
        linear-gradient(180deg, hsl(348 54% 42%), hsl(320 20% 26%));
    box-shadow: 0 0 12px hsl(348 54% 46% / 0.24);
}

[data-theme="crimson-wine"] ::selection {
    background: hsl(348 54% 46% / 0.32);
    color: hsl(34 32% 96%);
}

[data-theme="crimson-wine"] ::-moz-selection {
    background: hsl(348 54% 46% / 0.32);
    color: hsl(34 32% 96%);
}
[data-theme="crimson-wine"] .toxicity-container {
    border-color: var(--color-toxicity) !important;
}

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

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