/* ==========================================================================
   RUNIC THEME: Forest Kingdom Reforged
   Sunstruck pines, deep trunks, vivid moss, bright clearings, and living gold.
   ========================================================================= */

[data-theme="forest-kingdom"] {
    /* Core hue system */
    --hue-primary: 114;
    --hue-accent: 52;
    --hue-gm: 18;
    --hue-danger: 4;
    --hue-warning: 42;
    --hue-success: 122;
    --hue-toxicity: 92;
    --hue-neutral: 100;

    --sat-primary: 58%;
    --lit-primary: 32%;
    --lit-primary-hover: 38%;

    --sat-accent: 90%;
    --lit-accent: 60%;
    --lit-accent-hover: 54%;

    --sat-gm: 54%;
    --lit-gm: 44%;
    --lit-gm-text: 95%;

    --sat-danger: 58%;
    --lit-danger: 44%;
    --lit-danger-hover: 38%;

    --sat-warning: 84%;
    --lit-warning: 56%;

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

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

    --lightness-bg: 90%;

    /* Form and timing */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --radius-xl: 22px;
    --radius-2xl: 28px;

    --font-sans: 'Cormorant Garamond', 'Libre Baskerville', 'Georgia', serif;
    --font-mono: 'IBM Plex Mono', 'Consolas', monospace;

    --duration-75: 90ms;
    --duration-150: 180ms;
    --duration-250: 300ms;
    --duration-300: 400ms;
    --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 */
    --pine-night: hsl(126 50% 10%);
    --pine-deep: hsl(118 46% 16%);
    --pine-rich: hsl(112 58% 30%);
    --fern-bright: hsl(102 72% 46%);
    --moss-light: hsl(88 84% 58%);
    --sunbeam-core: hsl(56 100% 82%);
    --sunbeam-gold: hsl(50 100% 62%);
    --clearing-lime: hsl(92 100% 66%);
    --trunk-dark: hsl(28 24% 16%);
    --trunk-mid: hsl(32 26% 24%);
    --bark-warm: hsl(34 30% 34%);
    --mist-pale: hsl(84 42% 90%);
    --dew-glass: hsl(154 34% 84%);

    /* Surfaces */
    --bg-page: hsl(90 60% 89%);
    --bg-primary: hsl(88 58% 91%);
    --bg-secondary: hsl(92 52% 88% / 0.92);
    --bg-tertiary: hsl(94 48% 84% / 0.96);
    --bg-card: hsl(86 58% 90% / 0.94);
    --bg-hover: hsl(96 64% 80% / 0.72);
    --bg-input: hsl(78 68% 93%);

    --surface-elevated: hsl(88 52% 90%);
    --surface-overlay: hsl(86 46% 92% / 0.98);
    --surface-panel: hsl(88 46% 86% / 0.96);

    /* Text */
    --text-primary: hsl(122 42% 14%);
    --text-secondary: hsl(118 28% 22%);
    --text-label: hsl(34 42% 24%);
    --text-light: hsl(60 56% 97%);
    --text-muted: hsl(112 14% 32% / 0.82);

    /* Borders and shadows */
    --border-color: hsl(102 40% 34% / 0.38);
    --border-subtle: hsl(92 26% 58% / 0.34);
    --border-strong: hsl(116 54% 24% / 0.78);

    --shadow-glow-primary:
        0 16px 34px hsl(122 46% 18% / 0.18),
        0 0 34px hsl(88 100% 58% / 0.14);
    --shadow-glow-accent:
        0 12px 28px hsl(52 100% 58% / 0.2);
    --shadow-glow-danger:
        0 10px 24px hsl(4 60% 48% / 0.14);
    --shadow-glow-gold:
        0 0 24px hsl(56 100% 70% / 0.24);

    /* Icons */
    --icon-color: hsl(56 96% 70%);
    --icon-filter: brightness(0) saturate(100%) invert(91%) sepia(38%)
        saturate(1238%) hue-rotate(353deg) brightness(106%) contrast(93%);

    /* Focus and tooltip */
    --color-focus-ring: hsl(54 100% 58% / 0.3);

    --color-tooltip-bg: hsl(88 60% 92% / 0.98);
    --color-tooltip-highlight: hsl(120 38% 20%);
    --color-tooltip-effect-bg: hsl(54 100% 62% / 0.14);
    --color-tooltip-text: hsl(122 26% 14%);
    --color-tooltip-label: hsl(114 18% 26%);
    --color-tooltip-muted: hsl(110 10% 38%);
    --color-tooltip-dim: hsl(108 8% 48%);
    --color-tooltip-pos: hsl(122 40% 28%);
    --color-tooltip-neg: hsl(4 48% 40%);
    --color-tooltip-separator: hsl(98 28% 48% / 0.5);
    --color-tooltip-section-bg: hsl(84 42% 86% / 0.88);

    /* Quality colors */
    --quality-0-color1: rgb(122, 116, 102);
    --quality-0-color2: rgb(82, 76, 66);
    --quality-1-color1: rgb(235, 232, 198);
    --quality-1-color2: rgb(186, 172, 102);
    --quality-2-color1: rgb(126, 194, 90);
    --quality-2-color2: rgb(76, 136, 52);
    --quality-3-color1: rgb(122, 181, 161);
    --quality-3-color2: rgb(72, 128, 112);
    --quality-4-color1: rgb(144, 126, 180);
    --quality-4-color2: rgb(98, 82, 130);
    --quality-5-color1: rgb(232, 204, 76);
    --quality-5-color2: rgb(176, 135, 30);
    --quality-6-color1: rgb(188, 87, 70);
    --quality-6-color2: rgb(136, 53, 39);
    --quality-7-color1: rgb(248, 247, 178);
    --quality-7-color2: rgb(225, 208, 72);

    /* Spell / element system */
    --element-fire-bg: hsl(28 78% 90% / 0.74);
    --element-fire-border: hsl(18 58% 52% / 0.56);
    --element-fire-hover: hsl(24 82% 86% / 0.9);
    --element-fire-glow: hsl(18 66% 56% / 0.16);

    --element-water-bg: hsl(174 42% 90% / 0.72);
    --element-water-border: hsl(178 32% 52% / 0.54);
    --element-water-hover: hsl(174 48% 86% / 0.88);
    --element-water-glow: hsl(178 38% 58% / 0.14);

    --element-earth-bg: hsl(96 50% 86% / 0.76);
    --element-earth-border: hsl(96 30% 42% / 0.58);
    --element-earth-hover: hsl(94 58% 80% / 0.92);
    --element-earth-glow: hsl(92 42% 52% / 0.16);

    --element-wind-bg: hsl(150 32% 90% / 0.72);
    --element-wind-border: hsl(150 22% 54% / 0.5);
    --element-wind-hover: hsl(150 38% 86% / 0.88);
    --element-wind-glow: hsl(150 30% 60% / 0.14);

    --element-light-bg: hsl(58 100% 88% / 0.76);
    --element-light-border: hsl(54 74% 56% / 0.64);
    --element-light-hover: hsl(58 100% 84% / 0.92);
    --element-light-glow: hsl(56 100% 64% / 0.22);

    --element-shadow-bg: hsl(264 26% 90% / 0.72);
    --element-shadow-border: hsl(262 28% 54% / 0.54);
    --element-shadow-hover: hsl(264 34% 86% / 0.88);
    --element-shadow-glow: hsl(264 34% 60% / 0.14);

    --element-death-bg: hsl(356 28% 90% / 0.72);
    --element-death-border: hsl(356 36% 54% / 0.54);
    --element-death-hover: hsl(356 42% 86% / 0.88);
    --element-death-glow: hsl(356 42% 58% / 0.14);

    --element-life-bg: hsl(112 60% 86% / 0.76);
    --element-life-border: hsl(116 34% 44% / 0.58);
    --element-life-hover: hsl(110 66% 80% / 0.92);
    --element-life-glow: hsl(112 46% 54% / 0.2);

    --element-arcane-bg: hsl(282 28% 92% / 0.72);
    --element-arcane-border: hsl(280 34% 56% / 0.52);
    --element-arcane-hover: hsl(280 40% 88% / 0.88);
    --element-arcane-glow: hsl(282 40% 62% / 0.14);

    --element-mind-bg: hsl(214 28% 92% / 0.72);
    --element-mind-border: hsl(214 28% 56% / 0.52);
    --element-mind-hover: hsl(214 34% 88% / 0.88);
    --element-mind-glow: hsl(214 34% 62% / 0.14);

    --element-physical-bg: hsl(42 36% 90% / 0.74);
    --element-physical-border: hsl(38 28% 50% / 0.52);
    --element-physical-hover: hsl(42 44% 84% / 0.88);
    --element-physical-glow: hsl(40 34% 58% / 0.14);

    --spell-temp-bg: hsl(90 40% 84%);
    --spell-temp-border: hsl(102 28% 42% / 0.78);
    --spell-temp-hover-bg: hsl(92 48% 78%);
    --spell-temp-hover-glow: hsl(56 90% 64% / 0.16);
    --spell-temp-badge-bg: hsl(112 42% 34%);
    --spell-temp-header-bg: hsl(92 36% 82%);
    --spell-temp-header-hover-bg: hsl(94 42% 76%);
    --spell-tile-hover-bg: hsl(94 46% 78%);

    /* Inventory / currency / buffs */
    --item-tile-base: hsl(92 42% 84%);
    --item-tile-border: hsl(100 20% 48% / 0.62);
    --item-tile-add-bg: hsl(90 36% 82%);
    --item-tile-add-border: hsl(98 20% 50% / 0.72);
    --item-tile-add-hover: hsl(92 50% 76%);
    --item-tile-add-border-hover: hsl(102 28% 40% / 0.84);

    --weight-display-bg: hsl(92 36% 82%);
    --weight-ok-color: hsl(118 34% 30%);
    --weight-warn-color: hsl(42 58% 40%);
    --weight-crit-color: hsl(4 46% 42%);
    --weight-bar-track-bg: hsl(88 24% 68%);

    --currency-tile-bg: hsl(92 42% 84%);
    --currency-tile-border: hsl(100 20% 46% / 0.66);
    --currency-tile-hover-bg: hsl(92 52% 78%);
    --currency-tile-hover-shadow: hsl(56 100% 64% / 0.18);
    --currency-quantity-bg: hsl(56 74% 74%);
    --currency-add-bg: hsl(90 36% 82%);
    --currency-add-border: hsl(100 18% 50% / 0.72);
    --currency-add-hover-bg: hsl(92 50% 76%);
    --currency-add-hover-border: hsl(102 28% 40% / 0.84);

    --color-buff-tile-bg: hsl(112 48% 84%);
    --color-buff-tile-border: hsl(118 28% 46% / 0.56);
    --color-buff-tile-hover: hsl(112 58% 78%);
    --color-buff-tile-glow: hsl(114 38% 54% / 0.14);
    --color-debuff-tile-bg: hsl(8 40% 88%);
    --color-debuff-tile-border: hsl(8 34% 52% / 0.56);
    --color-debuff-tile-hover: hsl(8 46% 82%);
    --color-debuff-tile-glow: hsl(8 40% 56% / 0.14);
    --color-neutral-tile-bg: hsl(92 34% 84%);
    --color-neutral-tile-border: hsl(98 18% 48% / 0.56);
    --color-neutral-tile-hover: hsl(94 48% 78%);
    --color-neutral-tile-glow: hsl(56 90% 64% / 0.12);
    --color-buff-indicator: hsl(118 34% 32%);
    --color-debuff-indicator: hsl(6 46% 42%);

    /* Common status colors */
    --color-heal: hsl(118 34% 32%);
    --color-gold: hsl(48 74% 46%);
}

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

@keyframes forestPulse {
    0%, 100% {
        box-shadow:
            0 0 0 1px hsl(102 34% 36% / 0.18),
            0 12px 26px hsl(122 36% 24% / 0.12),
            0 0 22px hsl(56 100% 68% / 0.08);
    }
    50% {
        box-shadow:
            0 0 0 1px hsl(102 42% 40% / 0.26),
            0 14px 28px hsl(122 40% 26% / 0.14),
            0 0 28px hsl(56 100% 72% / 0.14);
    }
}

@keyframes sunPath {
    0%, 100% {
        opacity: 0.24;
        transform: translateX(-2%) scaleX(1);
    }
    50% {
        opacity: 0.42;
        transform: translateX(2%) scaleX(1.03);
    }
}

@keyframes pollenDrift {
    0%, 100% {
        opacity: 0.1;
        transform: translateY(0) scale(1);
    }
    50% {
        opacity: 0.18;
        transform: translateY(-6px) scale(1.04);
    }
}

@keyframes canopyShine {
    0% {
        transform: translateX(-140%) skewX(-18deg);
        opacity: 0;
    }
    18% {
        opacity: 0.55;
    }
    100% {
        transform: translateX(280%) skewX(-18deg);
        opacity: 0;
    }
}

/* ==========================================================================
   Foundation
   ========================================================================= */

body[data-theme="forest-kingdom"] {
    color: var(--text-primary);
    background:
        radial-gradient(circle at 50% 18%, hsl(56 100% 86% / 0.86) 0%, transparent 16%),
        radial-gradient(circle at 28% 48%, hsl(88 100% 52% / 0.24) 0%, transparent 24%),
        radial-gradient(circle at 78% 34%, hsl(104 78% 46% / 0.18) 0%, transparent 26%),
        linear-gradient(180deg, hsl(122 42% 12%) 0%, hsl(116 40% 18%) 18%, hsl(96 60% 58%) 44%, hsl(88 48% 82%) 100%);
}

body[data-theme="forest-kingdom"]::before,
body[data-theme="forest-kingdom"]::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -2;
}

body[data-theme="forest-kingdom"]::before {
    background:
        linear-gradient(112deg,
            transparent 0%,
            hsl(56 100% 84% / 0.48) 18%,
            hsl(56 100% 74% / 0.18) 30%,
            transparent 46%),
        linear-gradient(98deg,
            transparent 0%,
            hsl(54 100% 78% / 0.14) 58%,
            transparent 78%);
    mix-blend-mode: screen;
    animation: sunPath 15s ease-in-out infinite;
}

body[data-theme="forest-kingdom"]::after {
    background:
        radial-gradient(circle at 24% 18%, hsl(60 100% 86% / 0.14) 0 2px, transparent 2px 100%),
        radial-gradient(circle at 62% 28%, hsl(88 100% 62% / 0.1) 0 2px, transparent 2px 100%),
        radial-gradient(circle at 74% 44%, hsl(54 100% 84% / 0.14) 0 1.5px, transparent 1.5px 100%);
    background-size: 180px 180px, 220px 220px, 260px 260px;
    opacity: 0.5;
    animation: pollenDrift 12s ease-in-out infinite;
}

[data-theme="forest-kingdom"] h1,
[data-theme="forest-kingdom"] h2,
[data-theme="forest-kingdom"] h3,
[data-theme="forest-kingdom"] h4,
[data-theme="forest-kingdom"] h5,
[data-theme="forest-kingdom"] h6,
[data-theme="forest-kingdom"] .widget-title,
[data-theme="forest-kingdom"] .attribute-name,
[data-theme="forest-kingdom"] .modal-title {
    color: hsl(122 46% 16%);
    font-family: var(--font-sans);
    letter-spacing: 0.05em;
    text-shadow: 0 1px 0 hsl(60 82% 94% / 0.84);
}

[data-theme="forest-kingdom"] .title,
[data-theme="forest-kingdom"] .section-title,
[data-theme="forest-kingdom"] .modal-header h3,
[data-theme="forest-kingdom"] .edit-modal-title {
    color: hsl(122 48% 16%);
    letter-spacing: 0.08em;
}

[data-theme="forest-kingdom"] strong,
[data-theme="forest-kingdom"] b,
[data-theme="forest-kingdom"] label,
[data-theme="forest-kingdom"] .label {
    color: var(--text-label);
}

[data-theme="forest-kingdom"] a {
    color: hsl(122 52% 28%);
}

[data-theme="forest-kingdom"] a:hover {
    color: hsl(50 86% 40%);
}

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

[data-theme="forest-kingdom"] .card,
[data-theme="forest-kingdom"] .card-glass,
[data-theme="forest-kingdom"] .character-card,
[data-theme="forest-kingdom"] .widget-tile,
[data-theme="forest-kingdom"] .attribute-card,
[data-theme="forest-kingdom"] .character-item,
[data-theme="forest-kingdom"] .login-container,
[data-theme="forest-kingdom"] .modal,
[data-theme="forest-kingdom"] .story-note-item,
[data-theme="forest-kingdom"] .spell-tile,
[data-theme="forest-kingdom"] .buff-tile,
[data-theme="forest-kingdom"] .item-tile,
[data-theme="forest-kingdom"] .currency-tile,
[data-theme="forest-kingdom"] .inventory-section,
[data-theme="forest-kingdom"] .equipment-section,
[data-theme="forest-kingdom"] .spellbook-section,
[data-theme="forest-kingdom"] .rule-section,
[data-theme="forest-kingdom"] .desktop-window,
[data-theme="forest-kingdom"] .window-content,
[data-theme="forest-kingdom"] .window-panel,
[data-theme="forest-kingdom"] .resource-panel,
[data-theme="forest-kingdom"] .notes-box {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(180deg, hsl(86 76% 94% / 0.96) 0%, hsl(84 44% 84% / 0.98) 100%);
    border: 1px solid var(--border-color);
    box-shadow:
        inset 0 1px 0 hsl(60 86% 96% / 0.52),
        inset 0 -18px 32px hsl(112 28% 42% / 0.06),
        0 18px 36px hsl(122 28% 18% / 0.14),
        0 0 30px hsl(56 100% 84% / 0.08);
    color: var(--text-primary);
}

[data-theme="forest-kingdom"] .card::before,
[data-theme="forest-kingdom"] .card-glass::before,
[data-theme="forest-kingdom"] .character-card::before,
[data-theme="forest-kingdom"] .widget-tile::before,
[data-theme="forest-kingdom"] .attribute-card::before,
[data-theme="forest-kingdom"] .character-item::before,
[data-theme="forest-kingdom"] .login-container::before,
[data-theme="forest-kingdom"] .modal::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, transparent 0 2.8%, hsl(100 38% 42% / 0.08) 2.8% 3.3%, transparent 3.3% 96.7%, hsl(100 38% 42% / 0.08) 96.7% 97.2%, transparent 97.2% 100%),
        linear-gradient(180deg, transparent 0 3.6%, hsl(56 100% 74% / 0.12) 3.6% 4.1%, transparent 4.1% 95.9%, hsl(56 100% 74% / 0.1) 95.9% 96.4%, transparent 96.4% 100%);
    pointer-events: none;
}

[data-theme="forest-kingdom"] .card::after,
[data-theme="forest-kingdom"] .character-card::after,
[data-theme="forest-kingdom"] .widget-tile::after,
[data-theme="forest-kingdom"] .btn-primary::after,
[data-theme="forest-kingdom"] .roll-button::after {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 38%;
    background: linear-gradient(
        90deg,
        transparent,
        hsl(60 100% 96% / 0.2) 28%,
        hsl(58 100% 92% / 0.72) 50%,
        hsl(56 100% 78% / 0.28) 62%,
        transparent
    );
    transform: translateX(-140%) skewX(-18deg);
    pointer-events: none;
    opacity: 0;
}

[data-theme="forest-kingdom"] .card:hover,
[data-theme="forest-kingdom"] .card-glass:hover,
[data-theme="forest-kingdom"] .character-card:hover,
[data-theme="forest-kingdom"] .widget-tile:hover,
[data-theme="forest-kingdom"] .attribute-card:hover,
[data-theme="forest-kingdom"] .character-item:hover,
[data-theme="forest-kingdom"] .story-note-item:hover,
[data-theme="forest-kingdom"] .spell-tile:hover,
[data-theme="forest-kingdom"] .buff-tile:hover,
[data-theme="forest-kingdom"] .item-tile:hover,
[data-theme="forest-kingdom"] .currency-tile:hover {
    border-color: var(--border-strong);
    box-shadow:
        inset 0 1px 0 hsl(60 92% 97% / 0.62),
        inset 0 -18px 32px hsl(112 28% 42% / 0.08),
        0 22px 40px hsl(122 28% 18% / 0.16),
        0 0 32px hsl(56 100% 82% / 0.16);
}

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

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

[data-theme="forest-kingdom"] .btn-primary,
[data-theme="forest-kingdom"] .roll-button,
[data-theme="forest-kingdom"] .save-note-btn,
[data-theme="forest-kingdom"] button,
[data-theme="forest-kingdom"] .btn,
[data-theme="forest-kingdom"] .btn-modal,
[data-theme="forest-kingdom"] .modal button {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(180deg, hsl(108 64% 44%), hsl(122 48% 30%));
    color: hsl(60 58% 97%);
    border: 1px solid hsl(114 42% 22% / 0.92);
    box-shadow:
        inset 0 1px 0 hsl(60 82% 88% / 0.22),
        inset 0 -1px 0 hsl(118 34% 18% / 0.22),
        0 10px 20px hsl(122 34% 16% / 0.22),
        0 0 18px hsl(54 94% 66% / 0.1);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
    transition:
        transform var(--duration-150) var(--ease-out),
        box-shadow var(--duration-250) var(--ease-out),
        border-color var(--duration-150) var(--ease-out),
        background var(--duration-250) var(--ease-out);
}

[data-theme="forest-kingdom"] .btn-primary:hover,
[data-theme="forest-kingdom"] .roll-button:hover,
[data-theme="forest-kingdom"] .save-note-btn:hover,
[data-theme="forest-kingdom"] button:hover,
[data-theme="forest-kingdom"] .btn:hover,
[data-theme="forest-kingdom"] .btn-modal:hover,
[data-theme="forest-kingdom"] .modal button:hover {
    border-color: hsl(46 50% 34% / 0.96);
    box-shadow:
        inset 0 1px 0 hsl(60 100% 90% / 0.34),
        0 14px 24px hsl(120 30% 16% / 0.22),
        0 0 24px hsl(56 100% 72% / 0.22);
    transform: translateY(-1px);
    background:
        linear-gradient(180deg, hsl(58 100% 74%), hsl(50 92% 54%));
    color: hsl(38 48% 16%);
}

[data-theme="forest-kingdom"] .btn-secondary,
[data-theme="forest-kingdom"] .btn-ghost,
[data-theme="forest-kingdom"] .tab-btn,
[data-theme="forest-kingdom"] .tab_btn,
[data-theme="forest-kingdom"] .tab_btn_vertical,
[data-theme="forest-kingdom"] .twohanded-toggle,
[data-theme="forest-kingdom"] .nav-icon-btn {
    background:
        linear-gradient(180deg, hsl(102 48% 42%), hsl(120 38% 28%));
    color: hsl(60 44% 94%);
    border: 1px solid hsl(104 28% 34% / 0.76);
    box-shadow:
        inset 0 1px 0 hsl(60 76% 86% / 0.12),
        0 8px 16px hsl(122 30% 16% / 0.18);
}

[data-theme="forest-kingdom"] .btn-secondary:hover,
[data-theme="forest-kingdom"] .btn-ghost:hover,
[data-theme="forest-kingdom"] .tab-btn:hover,
[data-theme="forest-kingdom"] .tab_btn:hover,
[data-theme="forest-kingdom"] .tab_btn_vertical:hover,
[data-theme="forest-kingdom"] .twohanded-toggle:hover,
[data-theme="forest-kingdom"] .nav-icon-btn:hover {
    color: hsl(40 50% 18%);
    border-color: hsl(56 76% 54% / 0.82);
    background:
        linear-gradient(180deg, hsl(58 100% 74%), hsl(50 90% 54%));
}

[data-theme="forest-kingdom"] .tab-btn.active,
[data-theme="forest-kingdom"] .tab_btn.active,
[data-theme="forest-kingdom"] .tab_btn.active-tab,
[data-theme="forest-kingdom"] .tab_btn_vertical.active,
[data-theme="forest-kingdom"] .twohanded-toggle.active,
[data-theme="forest-kingdom"] .nav-icon-btn.active,
[data-theme="forest-kingdom"] #navi-btn-combat.tab_btn.combat-active,
[data-theme="forest-kingdom"] #edit_btn_nav.active {
    color: hsl(38 48% 16%);
    border-color: hsl(42 44% 30% / 0.88);
    background:
        radial-gradient(circle at 30% 24%, hsl(60 100% 88% / 0.42) 0%, transparent 34%),
        linear-gradient(180deg, hsl(58 100% 74%) 0%, hsl(50 92% 54%) 100%);
    box-shadow:
        0 1px 0 hsl(62 100% 92% / 0.42) inset,
        0 0 0 1px hsl(58 90% 68% / 0.18),
        0 14px 24px hsl(52 74% 42% / 0.22),
        0 0 28px hsl(58 100% 74% / 0.18);
    animation: forestPulse 5.4s ease-in-out infinite;
}

[data-theme="forest-kingdom"] .tab_Icon,
[data-theme="forest-kingdom"] .tab_btn img,
[data-theme="forest-kingdom"] .nav-icon-btn img,
[data-theme="forest-kingdom"] #div_iconbar_left img,
[data-theme="forest-kingdom"] #div_iconbar_right img,
[data-theme="forest-kingdom"] .icon-themed {
    filter: var(--icon-filter) drop-shadow(0 0 4px hsl(56 100% 72% / 0.28));
}

[data-theme="forest-kingdom"] .tab_btn.active-tab .tab_Icon,
[data-theme="forest-kingdom"] .tab_btn.active-tab img,
[data-theme="forest-kingdom"] .nav-icon-btn.active img {
    filter: var(--icon-filter)
        drop-shadow(0 0 3px hsl(40 64% 36% / 0.34))
        drop-shadow(0 0 8px hsl(58 100% 74% / 0.22));
}

[data-theme="forest-kingdom"] button:focus-visible,
[data-theme="forest-kingdom"] .btn:focus-visible,
[data-theme="forest-kingdom"] input:focus-visible,
[data-theme="forest-kingdom"] select:focus-visible,
[data-theme="forest-kingdom"] textarea:focus-visible {
    outline: none;
    box-shadow:
        0 0 0 2px hsl(62 100% 96% / 0.92),
        0 0 0 5px var(--color-focus-ring);
}

/* ==========================================================================
   Inputs and navigation
   ========================================================================= */

[data-theme="forest-kingdom"] input,
[data-theme="forest-kingdom"] select,
[data-theme="forest-kingdom"] textarea,
[data-theme="forest-kingdom"] .modal-input,
[data-theme="forest-kingdom"] .edit-modal-container input,
[data-theme="forest-kingdom"] .edit-modal-container select,
[data-theme="forest-kingdom"] .edit-modal-container textarea {
    background:
        linear-gradient(180deg, hsl(82 68% 94%) 0%, hsl(80 40% 86%) 100%);
    border: 1px solid hsl(102 28% 40% / 0.68);
    color: var(--text-primary);
    box-shadow:
        0 1px 0 hsl(60 74% 94% / 0.5) inset,
        0 6px 14px hsl(116 18% 34% / 0.06);
}

[data-theme="forest-kingdom"] input::placeholder,
[data-theme="forest-kingdom"] textarea::placeholder {
    color: hsl(108 10% 42% / 0.78);
}

[data-theme="forest-kingdom"] #div_top_navigation,
[data-theme="forest-kingdom"] #div_right_navigation {
    background:
        linear-gradient(180deg, hsl(120 46% 20% / 0.96) 0%, hsl(124 42% 14% / 0.96) 100%);
    border-color: hsl(98 34% 40% / 0.42);
    box-shadow:
        0 1px 0 hsl(56 72% 70% / 0.08) inset,
        0 18px 34px hsl(128 40% 10% / 0.22);
}

[data-theme="forest-kingdom"] #div_iconbar_left,
[data-theme="forest-kingdom"] #div_iconbar_right {
    background:
        linear-gradient(180deg, hsl(118 42% 22% / 0.94) 0%, hsl(124 38% 16% / 0.96) 100%);
    border: 1px solid hsl(98 28% 38% / 0.44);
    box-shadow:
        0 1px 0 hsl(56 72% 68% / 0.08) inset,
        0 16px 30px hsl(126 34% 12% / 0.2);
}

/* ==========================================================================
   Tables, widgets, lists
   ========================================================================= */

[data-theme="forest-kingdom"] table,
[data-theme="forest-kingdom"] .equipment-table {
    background: hsl(90 50% 86% / 0.94);
    border: 1px solid hsl(104 28% 38% / 0.42);
    box-shadow:
        0 1px 0 hsl(60 72% 94% / 0.38) inset,
        0 14px 28px hsl(122 18% 28% / 0.08);
}

[data-theme="forest-kingdom"] th,
[data-theme="forest-kingdom"] .equipment-table th {
    background:
        linear-gradient(180deg, hsl(108 58% 36%) 0%, hsl(122 40% 26%) 100%);
    color: hsl(60 56% 94%);
    border-color: hsl(104 24% 24% / 0.42);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

[data-theme="forest-kingdom"] td,
[data-theme="forest-kingdom"] .equipment-table td {
    border-color: hsl(98 18% 54% / 0.28);
    color: var(--text-primary);
}

[data-theme="forest-kingdom"] tr:nth-child(even) td {
    background: hsl(96 48% 80% / 0.28);
}

[data-theme="forest-kingdom"] tr:hover td {
    background: hsl(86 80% 78% / 0.36);
}

[data-theme="forest-kingdom"] .tab,
[data-theme="forest-kingdom"] .sheet-tab,
[data-theme="forest-kingdom"] .wiki-tab {
    background: hsl(90 44% 86%);
    border: 1px solid hsl(100 24% 46% / 0.58);
    color: var(--text-secondary);
}

[data-theme="forest-kingdom"] .tab.active,
[data-theme="forest-kingdom"] .sheet-tab.active,
[data-theme="forest-kingdom"] .wiki-tab.active {
    background:
        linear-gradient(180deg, hsl(58 100% 74%) 0%, hsl(50 92% 54%) 100%);
    color: hsl(38 48% 16%);
    border-color: hsl(42 42% 30% / 0.8);
}

[data-theme="forest-kingdom"] .widget-tile {
    min-height: 120px;
}

[data-theme="forest-kingdom"] .widget-tile .dice-result,
[data-theme="forest-kingdom"] .widget-tile .attack-result,
[data-theme="forest-kingdom"] .widget-tile .skill-result,
[data-theme="forest-kingdom"] .widget-tile .activity-display {
    background: transparent;
    border: none;
    box-shadow: none;
    color: var(--text-primary);
}

[data-theme="forest-kingdom"] .widget-tile .dice-value,
[data-theme="forest-kingdom"] .widget-tile .attack-damage-value,
[data-theme="forest-kingdom"] .widget-tile .attack-roll-value,
[data-theme="forest-kingdom"] .widget-tile .skill-total-value {
    color: hsl(122 38% 18%);
    text-shadow:
        0 0 12px hsl(56 100% 72% / 0.26),
        0 1px 0 hsl(60 80% 94% / 0.72);
}

[data-theme="forest-kingdom"] .widget-tile .dice-sides,
[data-theme="forest-kingdom"] .widget-tile .attack-damage-label,
[data-theme="forest-kingdom"] .widget-tile .attack-roll-label,
[data-theme="forest-kingdom"] .widget-tile .activity-name {
    color: hsl(34 34% 30%);
}

[data-theme="forest-kingdom"] .widget-tile .activity-icon,
[data-theme="forest-kingdom"] .widget-icon,
[data-theme="forest-kingdom"] .skill-widget-icon {
    filter:
        brightness(0) saturate(100%) invert(22%) sepia(35%) saturate(1014%)
        hue-rotate(86deg) brightness(95%) contrast(88%)
        drop-shadow(0 0 8px hsl(56 100% 74% / 0.18));
}

/* ==========================================================================
   Tooltips and modals
   ========================================================================= */

[data-theme="forest-kingdom"] .itooltip,
[data-theme="forest-kingdom"] .skilltooltip,
[data-theme="forest-kingdom"] .attrtooltip,
[data-theme="forest-kingdom"] #item-tooltip,
[data-theme="forest-kingdom"] #resistanceTooltip,
[data-theme="forest-kingdom"] #currencyTooltip,
[data-theme="forest-kingdom"] .basic-tooltip,
[data-theme="forest-kingdom"] .tooltiptext,
[data-theme="forest-kingdom"] .unified-tooltip,
[data-theme="forest-kingdom"] .stattooltip,
[data-theme="forest-kingdom"] .twohanded-tooltip {
    background:
        linear-gradient(180deg, hsl(90 60% 92% / 0.98) 0%, hsl(86 38% 84% / 0.98) 100%) !important;
    border: 1px solid hsl(102 28% 40% / 0.6) !important;
    color: var(--color-tooltip-text) !important;
    box-shadow:
        0 1px 0 hsl(60 72% 94% / 0.44) inset,
        0 18px 30px hsl(122 18% 24% / 0.16),
        0 0 0 1px hsl(56 86% 66% / 0.08);
    backdrop-filter: blur(8px);
}

[data-theme="forest-kingdom"] .itooltip-title,
[data-theme="forest-kingdom"] .skilltooltip-title,
[data-theme="forest-kingdom"] .attrtooltip-title,
[data-theme="forest-kingdom"] .stattooltip-title,
[data-theme="forest-kingdom"] .tooltip-title {
    color: var(--color-tooltip-highlight);
}

[data-theme="forest-kingdom"] .itooltip-effects,
[data-theme="forest-kingdom"] .skilltooltip-value-details,
[data-theme="forest-kingdom"] .attrtooltip-value-details,
[data-theme="forest-kingdom"] .tooltip-content {
    background: var(--color-tooltip-section-bg);
    border-color: var(--color-tooltip-separator);
}

[data-theme="forest-kingdom"] .modal,
[data-theme="forest-kingdom"] .gm-image-modal,
[data-theme="forest-kingdom"] .combat-modal,
[data-theme="forest-kingdom"] .edit-modal-container {
    background:
        linear-gradient(180deg, hsl(88 62% 94% / 0.98) 0%, hsl(84 38% 86% / 0.98) 100%);
    border: 1px solid hsl(102 28% 40% / 0.62);
    box-shadow:
        0 1px 0 hsl(60 86% 96% / 0.54) inset,
        0 28px 54px hsl(122 24% 16% / 0.2),
        0 0 0 1px hsl(56 100% 74% / 0.08);
}

[data-theme="forest-kingdom"] .modal-header,
[data-theme="forest-kingdom"] .edit-modal-header {
    background:
        linear-gradient(180deg, hsl(90 54% 88% / 0.8), hsl(84 40% 82% / 0.92));
    border-bottom: 1px solid hsl(102 24% 42% / 0.38);
}

[data-theme="forest-kingdom"] #combat-overlay,
[data-theme="forest-kingdom"] .edit-modal-overlay {
    background:
        radial-gradient(circle at 50% 20%, hsl(56 100% 82% / 0.12), transparent 34%),
        hsl(122 26% 10% / 0.5);
    backdrop-filter: blur(8px);
}

/* ==========================================================================
   Inventory and status
   ========================================================================= */

[data-theme="forest-kingdom"] .inventory-slot,
[data-theme="forest-kingdom"] .item-slot,
[data-theme="forest-kingdom"] .inventory-item,
[data-theme="forest-kingdom"] .resource-tile,
[data-theme="forest-kingdom"] .level-badge,
[data-theme="forest-kingdom"] .resource-badge,
[data-theme="forest-kingdom"] .stat-badge {
    background:
        linear-gradient(180deg, hsl(88 58% 92%) 0%, hsl(84 38% 84%) 100%);
    border: 1px solid hsl(100 22% 48% / 0.62);
    box-shadow:
        0 1px 0 hsl(60 90% 96% / 0.46) inset,
        0 10px 20px hsl(122 18% 22% / 0.08);
}

[data-theme="forest-kingdom"] .weight-fill,
[data-theme="forest-kingdom"] .encumbrance-fill,
[data-theme="forest-kingdom"] .hp-bar-fill {
    background: linear-gradient(90deg, hsl(110 58% 34%) 0%, hsl(88 84% 58%) 100%);
}

[data-theme="forest-kingdom"] .mana-bar-fill,
[data-theme="forest-kingdom"] .energy-bar-fill {
    background: linear-gradient(90deg, hsl(156 34% 42%) 0%, hsl(180 36% 64%) 100%);
}

[data-theme="forest-kingdom"] .stamina-bar-fill {
    background: linear-gradient(90deg, hsl(46 84% 58%) 0%, hsl(58 100% 76%) 100%);
}

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

[data-theme="forest-kingdom"] hr,
[data-theme="forest-kingdom"] .divider {
    border: none;
    height: 1px;
    background:
        linear-gradient(90deg,
            transparent 0%,
            hsl(100 20% 54% / 0.14) 14%,
            hsl(56 96% 70% / 0.58) 50%,
            hsl(100 20% 54% / 0.14) 86%,
            transparent 100%);
}

[data-theme="forest-kingdom"] .highlight,
[data-theme="forest-kingdom"] .text-highlight,
[data-theme="forest-kingdom"] .rarity-legendary {
    color: hsl(48 78% 40%);
    text-shadow: 0 0 14px hsl(56 100% 72% / 0.22);
}

[data-theme="forest-kingdom"] .muted,
[data-theme="forest-kingdom"] .secondary-text,
[data-theme="forest-kingdom"] .hint {
    color: var(--text-muted);
}

[data-theme="forest-kingdom"] ::-webkit-scrollbar-track {
    background: hsl(92 34% 82%);
}

[data-theme="forest-kingdom"] ::-webkit-scrollbar-thumb {
    background:
        linear-gradient(180deg, hsl(108 56% 38%), hsl(52 92% 60%));
}

@media (max-width: 768px) {
    [data-theme="forest-kingdom"] #div_top_navigation,
    [data-theme="forest-kingdom"] #div_right_navigation,
    [data-theme="forest-kingdom"] #div_iconbar_left,
    [data-theme="forest-kingdom"] #div_iconbar_right {
        background:
            linear-gradient(180deg, hsl(120 46% 18% / 0.96) 0%, hsl(124 42% 12% / 0.96) 100%);
    }
}
[data-theme="forest-kingdom"] .toxicity-container {
    border-color: var(--color-toxicity) !important;
}

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

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