@font-face {
    font-family: "China Numerals";
    src: url("fonts/ChinaNumerals.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0030-0039;
}

* { box-sizing: border-box; }

:root {
    --bg: #02050a;
    --surface: #062138;
    --surface-soft: #021426;
    --surface-hover: #082c47;
    --surface-glow: #2b0e66;
    --text: #f4fbff;
    --muted: #8fb4c5;
    --label: #00be67;
    --field-text: #b388ff;
    --placeholder: #63879a;
    --line: rgba(0, 161, 213, .34);
    --accent: #00a1d5;
    --accent-dark: #007ba5;
    --accent-contrast: #fff6fc;
    --accent-soft: rgba(0, 161, 213, .16);
    --warn: #ff86c9;
    --shadow: 0 24px 70px rgba(0, 0, 0, .64), 0 0 42px rgba(245, 0, 189, .08);
    --page-bg: linear-gradient(180deg, #010308 0%, #020711 48%, #03020b 100%);
    --topbar-bg: linear-gradient(135deg, rgba(1, 7, 15, .97) 0%, rgba(32, 10, 82, .90) 100%);
    --tabs-bg: rgba(0, 161, 213, .08);
    --tab-color: #00a1d5;
    --tab-hover-bg: rgba(245, 0, 189, .16);
    --tab-hover-color: #ff86c9;
    --accent-gradient: #f500bd;
    --accent-gradient-hover: #ff86c9;
    --secondary-bg: rgba(0, 161, 213, .08);
    --secondary-hover: rgba(245, 0, 189, .14);
    --panel-bg: rgba(0, 18, 31, .92);
    --cat-menu-bg: #00121f;
    --ok-color: #00be67;
    --accent-shadow: 0 0 0 1px rgba(255, 134, 201, .28), 0 0 24px rgba(245, 0, 189, .34), 0 14px 38px rgba(0, 161, 213, .12);
    --button-shadow: 0 0 0 1px rgba(255, 134, 201, .14), 0 0 8px rgba(245, 0, 189, .12), 0 6px 14px rgba(43, 14, 102, .10);
    --button-shadow-hover: 0 0 0 1px rgba(255, 134, 201, .22), 0 0 12px rgba(255, 134, 201, .16), 0 8px 18px rgba(245, 0, 189, .10);
    --result-primary: #00769d;
    --result-primary-hover: #007ca3;
    --result-site: #00784d;
    --result-site-hover: #008858;
    --result-secondary: rgba(0, 161, 213, .13);
    --result-secondary-hover: rgba(0, 161, 213, .22);
    --result-secondary-text: #42d3ff;
    --result-secondary-border: rgba(66, 211, 255, .42);
    --result-action-shadow: 0 0 0 1px rgba(0, 161, 213, .20), 0 0 22px rgba(0, 161, 213, .24), 0 12px 28px rgba(0, 91, 122, .18);
    --neon-grid: linear-gradient(rgba(0, 161, 213, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(245, 0, 189, .035) 1px, transparent 1px);
    --neon-grid-opacity: .56;
    --matrix-opacity: .30;
    --sakura-opacity: 0;
    --syntax-tag: #42d3ff;
    --syntax-attribute: #ff86c9;
    --syntax-value: #a8e66b;
    --syntax-punctuation: #93a9ff;
    --syntax-comment: #6f91a3;
    --syntax-doctype: #f2c66d;
    --syntax-entity: #ffb86c;
    --code-text: #d8e6f0;
    --code-selection: #0b3852;
}

:root[data-theme="spring"] {
    --bg: #dff4ff;
    --surface: #ffffff;
    --surface-soft: rgba(255, 255, 255, .74);
    --surface-hover: #ffffff;
    --surface-glow: #f6fcff;
    --text: #1d3954;
    --muted: #51718a;
    --label: #2f6f8f;
    --field-text: #6d52a8;
    --placeholder: #8aa8ba;
    --line: rgba(47, 155, 216, .28);
    --accent: #2f9bd8;
    --accent-dark: #1f78b0;
    --accent-contrast: #ffffff;
    --accent-soft: rgba(47, 155, 216, .18);
    --warn: #d85f9f;
    --shadow: 0 20px 52px rgba(70, 140, 190, .18);
    --page-bg: #8fd8f5;
    --topbar-bg: linear-gradient(135deg, rgba(255, 255, 255, .90) 0%, rgba(223, 246, 255, .84) 58%, rgba(255, 237, 247, .88) 100%);
    --tabs-bg: rgba(255, 255, 255, .58);
    --tab-color: #2f6f8f;
    --tab-hover-bg: rgba(216, 95, 159, .14);
    --tab-hover-color: #b94087;
    --accent-gradient: #d85f9f;
    --accent-gradient-hover: #f28abf;
    --secondary-bg: rgba(255, 255, 255, .56);
    --secondary-hover: rgba(216, 95, 159, .16);
    --panel-bg: rgba(255, 255, 255, .82);
    --cat-menu-bg: #ffffff;
    --ok-color: #2f7c72;
    --accent-shadow: 0 12px 30px rgba(216, 95, 159, .22);
    --button-shadow: 0 12px 28px rgba(216, 95, 159, .22);
    --button-shadow-hover: 0 16px 34px rgba(216, 95, 159, .28);
    --result-primary: #1f78b0;
    --result-primary-hover: #176a9c;
    --result-site: #267a68;
    --result-site-hover: #1f6c5c;
    --result-secondary: rgba(47, 155, 216, .10);
    --result-secondary-hover: rgba(47, 155, 216, .18);
    --result-secondary-text: #1f6f9e;
    --result-secondary-border: rgba(47, 155, 216, .36);
    --result-action-shadow: 0 12px 26px rgba(47, 155, 216, .20);
    --neon-grid: none;
    --neon-grid-opacity: 0;
    --matrix-opacity: 0;
    --sakura-opacity: .72;
    --syntax-tag: #087eae;
    --syntax-attribute: #b94087;
    --syntax-value: #397c35;
    --syntax-punctuation: #6655a5;
    --syntax-comment: #7892a3;
    --syntax-doctype: #9b6c13;
    --syntax-entity: #b75b19;
    --code-text: #29475e;
    --code-selection: #cfe8f6;
}

:root[data-theme="terraria"] {
    --bg: #101824;
    --surface: #29435a;
    --surface-soft: #1c3449;
    --surface-hover: #35556c;
    --surface-glow: #4e6738;
    --text: #fff2bd;
    --muted: #c9b987;
    --label: #9fe263;
    --field-text: #ffe7a6;
    --placeholder: #9aa982;
    --line: #8d6538;
    --accent: #86d451;
    --accent-dark: #4f9638;
    --accent-contrast: #14200f;
    --accent-soft: rgba(134, 212, 81, .18);
    --warn: #ff806a;
    --shadow: 5px 5px 0 rgba(9, 12, 11, .72), inset 0 0 0 2px rgba(255, 242, 189, .07);
    --page-bg: #294f49 url("terraria-flower-forest.png") center / 100% 100% no-repeat fixed;
    --topbar-bg: linear-gradient(180deg, #345a73 0%, #1e3a50 100%);
    --tabs-bg: #342519;
    --tab-color: #f0d39a;
    --tab-hover-bg: #49351f;
    --tab-hover-color: #b7ef78;
    --accent-gradient: #6fbd47;
    --accent-gradient-hover: #88d65a;
    --secondary-bg: #263f52;
    --secondary-hover: #35576c;
    --panel-bg: #243c50;
    --cat-menu-bg: #263f52;
    --ok-color: #a9eb70;
    --accent-shadow: inset 0 -4px 0 rgba(42, 91, 35, .66), 3px 3px 0 #11190d;
    --button-shadow: inset 0 -4px 0 rgba(42, 91, 35, .66), 3px 3px 0 #11190d;
    --button-shadow-hover: inset 0 -3px 0 rgba(42, 91, 35, .52), 2px 2px 0 #11190d;
    --result-primary: #477da0;
    --result-primary-hover: #5592b8;
    --result-site: #55983b;
    --result-site-hover: #68b94a;
    --result-secondary: #2c485d;
    --result-secondary-hover: #3a5c72;
    --result-secondary-text: #ffe4a3;
    --result-secondary-border: #8d6538;
    --result-action-shadow: inset 0 -3px 0 rgba(16, 42, 58, .62), 3px 3px 0 #11191f;
    --neon-grid: none;
    --neon-grid-opacity: 0;
    --matrix-opacity: 0;
    --sakura-opacity: 0;
    --syntax-tag: #8ed9ff;
    --syntax-attribute: #ffca70;
    --syntax-value: #a8e878;
    --syntax-punctuation: #ddd29c;
    --syntax-comment: #8fa487;
    --syntax-doctype: #f3ad5d;
    --syntax-entity: #ff8a65;
    --code-text: #fff0bd;
    --code-selection: #3b5f70;
    --pixel-frame-dark: #241706;
    --pixel-frame-mid: #735016;
    --pixel-frame-gold: #c3942f;
    --pixel-frame-light: #f0cc62;
}

:root[data-theme="glass-neon"] {
    --bg: #030409;
    --surface: rgba(20, 22, 38, .82);
    --surface-soft: rgba(20, 25, 43, .60);
    --surface-hover: rgba(42, 44, 76, .78);
    --surface-glow: rgba(139, 76, 255, .34);
    --text: #f8f9ff;
    --muted: #a5adc2;
    --label: #c3d9ff;
    --field-text: #f6f7ff;
    --placeholder: #70788f;
    --line: rgba(207, 217, 255, .32);
    --accent: #9264ff;
    --accent-dark: #6936ef;
    --accent-contrast: #ffffff;
    --accent-soft: rgba(146, 74, 255, .28);
    --warn: #ff7d78;
    --shadow: 0 28px 70px rgba(0, 0, 0, .58), inset 0 1px 0 rgba(255, 255, 255, .15), 0 0 42px rgba(109, 74, 255, .17);
    --page-bg:
        radial-gradient(circle at 9% 7%, rgba(33, 135, 255, .28), transparent 29%),
        radial-gradient(circle at 91% 17%, rgba(153, 49, 255, .27), transparent 31%),
        radial-gradient(circle at 88% 78%, rgba(255, 105, 28, .16), transparent 27%),
        radial-gradient(circle at 38% 100%, rgba(44, 238, 141, .16), transparent 32%),
        linear-gradient(155deg, #010207 0%, #080719 48%, #020306 100%);
    --topbar-bg: linear-gradient(145deg, rgba(39, 76, 126, .48), rgba(75, 39, 119, .40) 55%, rgba(8, 10, 18, .74));
    --tabs-bg: rgba(16, 18, 28, .72);
    --tab-color: #d1deff;
    --tab-hover-bg: rgba(148, 60, 255, .26);
    --tab-hover-color: #ffffff;
    --accent-gradient: #a13cff;
    --accent-gradient-hover: #cf52ff;
    --secondary-bg: rgba(71, 142, 255, .09);
    --secondary-hover: rgba(116, 76, 255, .22);
    --panel-bg: rgba(10, 13, 25, .70);
    --cat-menu-bg: rgba(11, 13, 22, .90);
    --ok-color: #6ff0ae;
    --accent-shadow: inset 0 1px 0 rgba(255, 255, 255, .48), inset 0 -14px 26px rgba(116, 45, 255, .28), 0 0 0 1px rgba(215, 190, 255, .34), 0 0 34px rgba(144, 66, 255, .55), 0 16px 38px rgba(0, 0, 0, .44);
    --button-shadow: inset 0 1px 0 rgba(255, 255, 255, .48), inset 0 -13px 24px rgba(102, 49, 255, .25), 0 0 0 1px rgba(218, 197, 255, .28), 0 0 30px rgba(133, 70, 255, .42), 0 14px 32px rgba(0, 0, 0, .42);
    --button-shadow-hover: inset 0 1px 0 rgba(255, 255, 255, .58), inset 0 -15px 28px rgba(123, 53, 255, .34), 0 0 0 1px rgba(236, 220, 255, .44), 0 0 44px rgba(165, 83, 255, .62), 0 18px 40px rgba(0, 0, 0, .48);
    --result-primary: rgba(112, 95, 222, .72);
    --result-primary-hover: rgba(138, 116, 255, .82);
    --result-site: rgba(69, 149, 116, .68);
    --result-site-hover: rgba(79, 184, 139, .78);
    --result-secondary: rgba(88, 135, 196, .13);
    --result-secondary-hover: rgba(112, 156, 218, .22);
    --result-secondary-text: #b9d7ff;
    --result-secondary-border: rgba(166, 205, 255, .30);
    --result-action-shadow: inset 0 1px 0 rgba(255, 255, 255, .30), 0 0 28px rgba(107, 123, 255, .24), 0 14px 30px rgba(0, 0, 0, .36);
    --neon-grid: none;
    --neon-grid-opacity: 0;
    --matrix-opacity: 0;
    --sakura-opacity: 0;
    --syntax-tag: #9ed8ff;
    --syntax-attribute: #c9a8ff;
    --syntax-value: #a7f2ce;
    --syntax-punctuation: #bec8ff;
    --syntax-comment: #78839b;
    --syntax-doctype: #ffe0a3;
    --syntax-entity: #ffb4c9;
    --code-text: #eef1ff;
    --code-selection: #29284b;
}

:root[data-theme="corporat"] {
    --bg: #05080c;
    --surface: #0a1017;
    --surface-soft: #0b111a;
    --surface-hover: #111b24;
    --surface-glow: #351317;
    --text: #d9f7f8;
    --muted: #76939c;
    --label: #ff5d61;
    --field-text: #64e7ef;
    --placeholder: #526970;
    --line: rgba(255, 69, 74, .38);
    --accent: #56e9f1;
    --accent-dark: #28aab5;
    --accent-contrast: #071015;
    --accent-soft: rgba(86, 233, 241, .13);
    --warn: #ffdb45;
    --shadow: 0 22px 52px rgba(0, 0, 0, .58), inset 3px 0 0 rgba(255, 65, 69, .13);
    --page-bg:
        radial-gradient(ellipse at 22% -12%, rgba(149, 31, 36, .34), transparent 48%),
        radial-gradient(ellipse at 92% 18%, rgba(81, 18, 24, .20), transparent 35%),
        linear-gradient(155deg, #09090d 0%, #05090e 48%, #02070a 100%);
    --topbar-bg:
        linear-gradient(90deg, rgba(89, 23, 29, .32), transparent 36%),
        rgba(8, 11, 16, .94);
    --tabs-bg: rgba(6, 10, 15, .97);
    --tab-color: #58e8ef;
    --tab-hover-bg: rgba(255, 65, 69, .13);
    --tab-hover-color: #ffffff;
    --accent-gradient: #ff4c51;
    --accent-gradient-hover: #ff666a;
    --secondary-bg: rgba(9, 16, 23, .92);
    --secondary-hover: rgba(86, 233, 241, .10);
    --panel-bg: rgba(7, 11, 17, .92);
    --cat-menu-bg: #080d13;
    --ok-color: #63e9ef;
    --accent-shadow: inset 3px 0 0 #ff4145, 0 0 0 1px rgba(255, 65, 69, .24), 0 10px 24px rgba(0, 0, 0, .38);
    --button-shadow: inset 3px 0 0 rgba(255, 255, 255, .17), 0 8px 18px rgba(0, 0, 0, .34);
    --button-shadow-hover: inset 3px 0 0 rgba(255, 255, 255, .26), 0 0 18px rgba(255, 76, 81, .16), 0 10px 24px rgba(0, 0, 0, .38);
    --result-primary: #b93439;
    --result-primary-hover: #d54247;
    --result-site: #c8bd2c;
    --result-site-hover: #e3d631;
    --result-secondary: rgba(86, 233, 241, .07);
    --result-secondary-hover: rgba(86, 233, 241, .13);
    --result-secondary-text: #64e7ef;
    --result-secondary-border: rgba(86, 233, 241, .42);
    --result-action-shadow: 0 0 0 1px rgba(255, 76, 81, .24), 0 10px 24px rgba(0, 0, 0, .38);
    --neon-grid:
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 4px),
        linear-gradient(90deg, transparent 0 24%, rgba(255, 65, 69, .035) 24% 24.08%, transparent 24.08% 76%, rgba(86, 233, 241, .025) 76% 76.08%, transparent 76.08%);
    --neon-grid-opacity: .78;
    --matrix-opacity: 0;
    --sakura-opacity: 0;
    --syntax-tag: #56e9f1;
    --syntax-attribute: #ff5d61;
    --syntax-value: #e7dc49;
    --syntax-punctuation: #a7f6f8;
    --syntax-comment: #617980;
    --syntax-doctype: #ff995c;
    --syntax-entity: #ff5d61;
    --code-text: #70ecf2;
    --code-selection: #28363d;
}

html {
    min-height: 100%;
    background-color: var(--bg);
}

body {
    position: relative;
    min-height: 100%;
    margin: 0;
    background: var(--page-bg);
    color: var(--text);
    font-family: Inter, "Segoe UI", Arial, Helvetica, sans-serif;
}

html::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    pointer-events: none;
    background-color: var(--bg);
    opacity: 0;
}

html.is-page-leaving::after {
    opacity: 1;
    transition: opacity 140ms ease-in;
}

html.is-page-entering::after {
    animation: app-page-curtain-out 200ms ease-out both;
}

@keyframes app-page-curtain-out {
    from { opacity: 1; }
    to { opacity: 0; }
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image: var(--neon-grid);
    background-size: 36px 36px;
    opacity: var(--neon-grid-opacity);
}

p { margin: 0; }

.matrix-rain,
.sakura-petals {
    position: fixed;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    transition: opacity .2s ease;
}

.matrix-rain {
    opacity: var(--matrix-opacity);
    mix-blend-mode: screen;
}

.sakura-petals { opacity: var(--sakura-opacity); }

.shell {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
        "topbar"
        "content";
    gap: 18px;
    align-items: start;
    width: min(1420px, calc(100% - 40px));
    margin: 0 auto;
    padding: 32px 0;
    transform-origin: 50% 20%;
}

html.is-page-leaving .shell {
    pointer-events: none;
    transform: translate3d(0, -3px, 0) scale(.999);
    transition: transform 160ms cubic-bezier(.4, 0, 1, 1);
}

html.is-page-entering .shell {
    animation: app-page-fallback-in 220ms cubic-bezier(.22, 1, .36, 1) both;
}

html.is-menu-pinned.is-page-leaving::after,
html.is-menu-pinned.is-page-entering::after {
    z-index: 1600;
}

html.is-menu-pinned.is-page-leaving .shell,
html.is-menu-pinned.is-page-entering .shell {
    pointer-events: auto;
    transform: none;
    animation: none;
    transition: none;
}

@keyframes app-page-fallback-in {
    from {
        transform: translate3d(0, 5px, 0) scale(1.001);
    }
}

@media (prefers-reduced-motion: reduce) {
    html.is-page-leaving .shell,
    html.is-page-entering .shell {
        animation: none;
        transition: none;
    }

    html.is-page-leaving::after,
    html.is-page-entering::after {
        display: none;
        animation: none;
        transition: none;
    }
}

.topbar {
    grid-area: topbar;
    position: relative;
    z-index: 10;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: center;
    margin-bottom: 0;
    padding: 20px 22px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--topbar-bg);
    box-shadow: var(--shadow);
}

.topbar.is-cat-running { overflow: hidden; }

.topbar__intro {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 16px;
}

.menu-toggle,
.tabs__home,
.tabs__close {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--secondary-bg);
    color: var(--tab-color);
    padding: 0;
    box-shadow: none;
    text-decoration: none;
}

.menu-toggle {
    flex-direction: column;
    gap: 5px;
    padding: 0;
}

.menu-toggle span {
    display: block;
    width: 19px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    transition: transform .22s ease, width .22s ease;
}

.menu-toggle:hover,
.menu-toggle:focus-visible,
.tabs__home:hover,
.tabs__home:focus-visible,
.tabs__close:hover,
.tabs__close:focus-visible {
    border-color: var(--accent);
    background: var(--tab-hover-bg);
    color: var(--tab-hover-color);
    box-shadow: none;
    outline: none;
}

.menu-toggle:hover span:nth-child(2),
.menu-toggle:focus-visible span:nth-child(2) {
    width: 14px;
}

.tabs__home svg,
.tabs__close svg {
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-width: 2.2;
}

.tabs__home[aria-current="page"] {
    border-color: color-mix(in srgb, var(--accent) 64%, var(--line));
    background: var(--accent-soft);
    color: var(--accent);
}

.tabs__home {
    transform-origin: 50% 58%;
    transition:
        border-color .2s ease,
        background .2s ease,
        color .2s ease,
        box-shadow .2s ease,
        transform .24s cubic-bezier(.22, 1, .36, 1);
}

.tabs__home svg {
    transform-origin: 50% 64%;
    transition: transform .32s cubic-bezier(.22, 1, .36, 1);
}

.tabs__home:hover,
.tabs__home:focus-visible {
    transform: translateY(-2px);
}

.tabs__home:hover svg,
.tabs__home:focus-visible svg {
    transform: translateY(-1px) scale(1.08);
}

.tabs__home:active {
    transform: translateY(1px) scale(.94);
}

.tabs__home.is-home-launching {
    animation: tabs-home-launch .34s cubic-bezier(.22, 1, .36, 1) both;
}

.tabs__home.is-home-launching svg {
    animation: tabs-home-icon-launch .34s cubic-bezier(.22, 1, .36, 1) both;
}

@keyframes tabs-home-launch {
    0% { transform: scale(1); }
    38% {
        transform: scale(.88);
        box-shadow: 0 0 0 5px color-mix(in srgb, var(--accent) 18%, transparent);
    }
    100% { transform: scale(1); }
}

@keyframes tabs-home-icon-launch {
    0% { transform: translateY(0) scale(1); }
    42% { transform: translateY(3px) scale(.88); }
    72% { transform: translateY(-2px) scale(1.1); }
    100% { transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    .tabs__home,
    .tabs__home svg {
        animation: none;
        transition: none;
    }
}

.theme-cluster {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 18px;
}

.cat-secret {
    position: relative;
    display: block;
    flex: 0 0 auto;
    width: 82px;
    height: 82px;
    isolation: isolate;
}

.topbar:has(.cat-secret.is-menu-open) {
    z-index: 1000;
    overflow: visible;
}

.cat-secret.is-menu-open {
    z-index: 20;
}

.pixel-cat {
    position: relative;
    display: block;
    flex: 0 0 auto;
    width: 82px;
    height: 82px;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    box-shadow: none;
    cursor: default;
    pointer-events: auto;
    touch-action: manipulation;
    user-select: none;
    filter: drop-shadow(0 4px 0 rgba(10, 3, 16, .18)) drop-shadow(0 0 8px rgba(245, 135, 22, .16));
    transform-origin: 50% 88%;
    transition: filter .16s ease, transform .12s ease;
}

.pixel-cat:hover {
    background: transparent;
    box-shadow: none;
    filter: drop-shadow(0 4px 0 rgba(10, 3, 16, .18)) drop-shadow(0 0 8px rgba(245, 135, 22, .16));
    outline: none;
}

.pixel-cat:focus-visible {
    background: transparent;
    box-shadow: none;
    filter: drop-shadow(0 4px 0 rgba(10, 3, 16, .18)) drop-shadow(0 0 13px rgba(245, 135, 22, .32));
    outline: none;
}

.pixel-cat:focus-visible::after {
    content: "";
    position: absolute;
    inset: 8px;
    border: 1px dashed var(--accent);
    border-radius: 8px;
}

.pixel-cat:active {
    background: transparent;
    box-shadow: none;
    transform: translateY(1px) scale(.97);
}

.cat-secret.is-running .pixel-cat {
    z-index: 3;
    pointer-events: none;
    filter: none;
    will-change: transform, opacity;
}

.cat-secret.is-running .pixel-cat__frame {
    visibility: hidden;
    opacity: 0;
    animation: none;
}

.cat-secret.is-revealed .pixel-cat {
    visibility: hidden;
    pointer-events: none;
}

.pixel-cat__frame {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    opacity: 0;
    image-rendering: pixelated;
    image-rendering: crisp-edges;
    animation-duration: 6s;
    animation-timing-function: step-end;
    animation-iteration-count: infinite;
}

.pixel-cat__frame--1 {
    opacity: 1;
    animation-name: pixelCatFrameOne;
}

.pixel-cat__frame--2 { animation-name: pixelCatFrameTwo; }
.pixel-cat__frame--3 { animation-name: pixelCatFrameThree; }
.pixel-cat__frame--4 { animation-name: pixelCatFrameFour; }
.pixel-cat__frame--5 { animation-name: pixelCatFrameFive; }
.pixel-cat__frame--6 { animation-name: pixelCatFrameSix; }

.pixel-cat__leap {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    width: 144px;
    height: 96px;
    object-fit: contain;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -50%);
    image-rendering: pixelated;
    image-rendering: crisp-edges;
}

.cat-secret.is-running .pixel-cat__leap {
    visibility: visible;
    opacity: 1;
}

@keyframes pixelCatFrameOne {
    0%, 44.99% { opacity: 1; }
    45%, 100% { opacity: 0; }
}

@keyframes pixelCatFrameTwo {
    0%, 44.99% { opacity: 0; }
    45%, 51.99% { opacity: 1; }
    52%, 57.99% { opacity: 0; }
    58%, 63.99% { opacity: 1; }
    64%, 100% { opacity: 0; }
}

@keyframes pixelCatFrameThree {
    0%, 51.99% { opacity: 0; }
    52%, 57.99% { opacity: 1; }
    58%, 63.99% { opacity: 0; }
    64%, 69.99% { opacity: 1; }
    70%, 100% { opacity: 0; }
}

@keyframes pixelCatFrameFour {
    0%, 69.99% { opacity: 0; }
    70%, 80.99% { opacity: 1; }
    81%, 100% { opacity: 0; }
}

@keyframes pixelCatFrameFive {
    0%, 80.99% { opacity: 0; }
    81%, 90.99% { opacity: 1; }
    91%, 100% { opacity: 0; }
}

@keyframes pixelCatFrameSix {
    0%, 90.99% { opacity: 0; }
    91%, 100% { opacity: 1; }
}

:root[data-theme="spring"] .pixel-cat {
    filter: drop-shadow(0 5px 5px rgba(129, 80, 32, .14));
}

.cat-secret-menu {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    width: 180px;
    height: 164px;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -20px) scale(.72);
    transform-origin: 50% 22px;
    transition: opacity .2s ease, transform .24s cubic-bezier(.2, .78, .2, 1), visibility 0s linear .24s;
}

.cat-secret.is-menu-open .cat-secret-menu {
    z-index: 30;
}

.cat-secret.is-revealed .cat-secret-menu {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, -20px) scale(1);
    transition-delay: 0s;
}

.cat-secret-menu__surface {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: block;
    width: 180px;
    height: 164px;
    overflow: visible;
    pointer-events: none;
    filter: drop-shadow(0 12px 22px rgba(0, 0, 0, .28)) drop-shadow(0 0 12px rgba(0, 161, 213, .10));
    transition: filter .2s ease;
}

.cat-secret-menu__surface-shape {
    fill: var(--cat-menu-bg);
    stroke: var(--line);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
    transition: fill .2s ease, stroke .2s ease;
}

.cat-secret-menu:focus-within .cat-secret-menu__surface,
.cat-secret-menu:has(.cat-secret-menu__toggle:hover) .cat-secret-menu__surface,
.cat-secret.is-menu-open .cat-secret-menu__surface {
    filter: drop-shadow(0 14px 26px rgba(0, 0, 0, .34)) drop-shadow(0 0 16px rgba(0, 161, 213, .18));
}

.cat-secret-menu:focus-within .cat-secret-menu__surface-shape,
.cat-secret-menu:has(.cat-secret-menu__toggle:hover) .cat-secret-menu__surface-shape {
    stroke: var(--accent);
}

.cat-secret-menu__toggle {
    position: absolute;
    top: 2px;
    left: 70px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--tab-color);
    box-shadow: none;
    cursor: pointer;
    transition: color .18s ease, transform .18s ease;
}

.cat-secret-menu__toggle:hover,
.cat-secret-menu__toggle:focus-visible {
    background: transparent;
    color: var(--tab-hover-color);
    box-shadow: none;
    outline: none;
}

.cat-secret-menu__toggle:active { transform: translateY(1px) scale(.98); }

.cat-secret-menu__smile {
    position: relative;
    z-index: 2;
    display: block;
    width: 28px;
    height: 28px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
    transition: transform .18s ease;
}

.cat-secret-menu__smile-eye {
    fill: currentColor;
    stroke: none;
}

.cat-secret-menu__toggle:hover .cat-secret-menu__smile,
.cat-secret-menu__toggle:focus-visible .cat-secret-menu__smile {
    transform: translateY(-1px) scale(1.06);
}

.cat-secret-menu__panel {
    position: absolute;
    z-index: 2;
    top: 48px;
    left: 4px;
    width: 172px;
    height: 112px;
    min-height: 112px;
    border: 0;
    border-radius: 18px;
    background: transparent;
    box-shadow: none;
    transform-origin: 50% 0;
}

.cat-secret-menu__panel[hidden] { display: none; }

.cat-theme-list {
    display: grid;
    grid-template-rows: 13px repeat(2, 40px);
    gap: 1px;
    height: 100%;
    padding: 4px 8px 6px;
}

.cat-theme-list__question {
    overflow: hidden;
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    line-height: 13px;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cat-theme-option {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    width: 100%;
    min-height: 40px;
    border: 1px solid rgba(225, 235, 255, .30);
    border-radius: 9px;
    background: transparent;
    color: var(--text);
    box-shadow: none;
    padding: 4px 7px;
    text-align: left;
}

.cat-theme-option:hover,
.cat-theme-option:focus-visible {
    border-color: var(--line);
    background: var(--secondary-bg);
    box-shadow: none;
    outline: none;
}

.cat-theme-option.is-active {
    border-color: var(--accent);
    background: var(--accent-soft);
    box-shadow: inset 3px 0 0 var(--accent);
}

.cat-theme-option__swatch {
    display: block;
    width: 24px;
    height: 24px;
    border: 1px solid var(--line);
    border-radius: 50%;
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .08);
}

.cat-theme-option__swatch--dark {
    background: linear-gradient(135deg, #071423 0 52%, #f500bd 52% 70%, #00a1d5 70% 100%);
}

.cat-theme-option__swatch--spring {
    background: linear-gradient(135deg, #8fd8f5 0 52%, #ffffff 52% 70%, #e986b8 70% 100%);
}

.cat-theme-option__swatch--terraria {
    border-radius: 2px;
    background: linear-gradient(180deg, #82cf4d 0 28%, #3f7c31 28% 40%, #79502d 40% 72%, #4b2f22 72% 100%);
    box-shadow: inset 3px 0 0 rgba(255, 241, 159, .16), inset -3px 0 0 rgba(34, 24, 16, .24);
    image-rendering: pixelated;
}

.cat-theme-option__swatch--glass-neon {
    border-color: rgba(226, 232, 255, .48);
    background:
        radial-gradient(circle at 24% 18%, rgba(255, 255, 255, .62), transparent 24%),
        linear-gradient(145deg, rgba(102, 174, 255, .42), rgba(135, 83, 255, .32) 58%, rgba(104, 255, 200, .34));
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, .72),
        inset 0 -5px 9px rgba(119, 70, 255, .32),
        0 0 8px rgba(105, 172, 255, .60),
        0 0 13px rgba(158, 91, 255, .44);
}

.cat-theme-option__swatch--corporat {
    border-color: #ff4c51;
    border-radius: 0;
    background:
        linear-gradient(135deg, transparent 0 48%, #56e9f1 48% 57%, transparent 57%),
        linear-gradient(90deg, #111820 0 58%, #8f252b 58% 100%);
    box-shadow:
        inset 3px 0 0 #ff4c51,
        inset -2px 0 0 rgba(86, 233, 241, .58),
        0 0 9px rgba(255, 76, 81, .28);
    clip-path: polygon(0 0, calc(100% - 5px) 0, 100% 5px, 100% 100%, 5px 100%, 0 calc(100% - 5px));
}

.cat-theme-option__copy {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.cat-theme-option__copy strong,
.cat-theme-option__copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cat-theme-option__copy strong {
    color: inherit;
    font-size: 11px;
    line-height: 1.1;
}

.cat-theme-option__copy small {
    color: var(--muted);
    font-size: 8px;
    line-height: 1.1;
}

@media (prefers-reduced-motion: reduce) {
    .pixel-cat__frame {
        animation: none;
        opacity: 0;
    }

    .pixel-cat__frame--1 { opacity: 1; }

    .cat-secret-menu,
    .cat-secret-menu__surface,
    .cat-secret-menu__surface-shape,
    .cat-secret-menu__toggle,
    .cat-secret-menu__smile,
    .animated-select__trigger,
    .animated-select__check { transition: none; }
}

h1 {
    margin: 0 0 6px;
    color: var(--text);
    font-size: clamp(26px, 3vw, 36px);
    font-weight: 800;
    letter-spacing: 0;
}

h2 {
    margin: 0 0 10px;
    color: var(--text);
    font-size: 18px;
}

.heading-accent {
    color: var(--accent-gradient);
    text-shadow: 0 0 14px rgba(245, 0, 189, .52), 0 0 24px rgba(0, 161, 213, .20);
}

.muted {
    color: var(--muted);
    line-height: 1.55;
}

.tabs {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1601;
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: min(330px, calc(100vw - 24px));
    max-width: 100%;
    margin: 0;
    padding: 14px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 0;
    border-right: 1px solid var(--line);
    border-radius: 0 12px 12px 0;
    background: color-mix(in srgb, var(--panel-bg) 96%, var(--bg));
    box-shadow: 22px 0 55px rgba(0, 0, 0, .48);
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translate3d(calc(-100% - 32px), 0, 0);
    will-change: transform, opacity;
    transition:
        transform .52s cubic-bezier(.22, 1, .36, 1),
        opacity .34s cubic-bezier(.22, .65, .3, 1),
        visibility 0s linear .52s;
}

.tabs:focus {
    outline: none;
}

body.is-menu-open {
    overflow: hidden;
}

body.is-menu-open .tabs {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transform: translate3d(0, 0, 0);
    transition-delay: 0s;
}

html.is-menu-syncing .tabs,
html.is-menu-syncing .tabs__head,
html.is-menu-syncing .tabs__list,
html.is-menu-syncing .tabs__footer,
html.is-menu-syncing .tabs__edge-toggle {
    animation: none !important;
    transition: none !important;
}

.menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1600;
    width: auto;
    min-width: 0;
    min-height: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: rgba(0, 4, 10, .68);
    box-shadow: none;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    cursor: default;
    backdrop-filter: blur(3px);
    transition:
        opacity .42s cubic-bezier(.22, .65, .3, 1),
        visibility 0s linear .52s;
}

body.is-menu-open .menu-backdrop {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transition-delay: 0s;
}

.menu-backdrop:hover,
.menu-backdrop:focus {
    background: rgba(0, 4, 10, .68);
    box-shadow: none;
}

.tabs__head {
    position: sticky;
    top: -14px;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    margin: -14px -14px 0;
    padding: 12px 14px 8px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--panel-bg) 98%, var(--bg)) 72%, transparent);
    opacity: 0;
    transform: translateY(-8px);
    transition:
        opacity .26s ease,
        transform .38s cubic-bezier(.22, 1, .36, 1);
}

.tabs__list {
    display: grid;
    gap: 8px;
    opacity: 0;
    transform: translateX(-12px);
    transition:
        opacity .3s ease,
        transform .42s cubic-bezier(.22, 1, .36, 1);
}

body.is-menu-open .tabs__head {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .1s;
}

body.is-menu-open .tabs__list {
    opacity: 1;
    transform: translateX(0);
    transition-delay: .14s;
}

.tab-group {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: color-mix(in srgb, var(--surface-soft) 76%, transparent);
    transition: border-color .2s ease, background .2s ease;
}

.tab-group__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-height: 44px;
    border: 0;
    border-radius: 0;
    padding: 9px 12px;
    color: var(--text);
    background: var(--surface-soft);
    box-shadow: none;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    list-style: none;
    transition: background .2s ease, color .2s ease;
    user-select: none;
}

.tab-group__summary::-webkit-details-marker { display: none; }
.tab-group__summary::marker { content: ""; }

.tab-group__summary:hover,
.tab-group__summary:focus-visible {
    color: var(--tab-hover-color);
    background: var(--tab-hover-bg);
    outline: none;
}

.tab-group__summary svg {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
    transition: transform .46s cubic-bezier(.2, .72, .24, 1);
}

.tab-group.is-open > .tab-group__summary svg {
    transform: rotate(180deg);
}

.tab-group__items {
    display: grid;
    height: 0;
    overflow: hidden;
    border-top: 1px solid transparent;
    opacity: 0;
    transform: translateY(-4px);
    transform-origin: top;
    interpolate-size: allow-keywords;
    transition:
        height .5s cubic-bezier(.4, 0, .2, 1),
        border-color .36s ease,
        opacity .4s ease,
        transform .5s cubic-bezier(.4, 0, .2, 1);
}

.tab-group__items-inner {
    display: grid;
    gap: 5px;
    min-height: 0;
    overflow: hidden;
    padding: 6px;
}

.tab-group.is-open > .tab-group__items {
    height: auto;
    border-top-color: var(--line);
    opacity: 1;
    transform: translateY(0);
}

.tab {
    display: inline-flex;
    align-items: center;
    width: 100%;
    min-height: 40px;
    border: 0;
    border-radius: 7px;
    padding: 9px 12px;
    color: var(--tab-color);
    background: var(--surface-soft);
    box-shadow: none;
    font-weight: 700;
    line-height: 1.35;
    text-decoration: none;
    transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.tab:hover,
.tab:focus-visible {
    background: var(--tab-hover-bg);
    color: var(--tab-hover-color);
    box-shadow: inset 3px 0 0 currentColor;
    transform: translateX(2px);
    outline: none;
}

.tab.active {
    background: var(--accent-gradient);
    color: var(--accent-contrast);
    box-shadow: var(--accent-shadow);
}

@media (prefers-reduced-motion: reduce) {
    .tabs,
    .menu-backdrop,
    .menu-toggle span,
    .tabs__head,
    .tabs__list,
    .tab-group__summary svg,
    .tab-group__items,
    .tab {
        transition: none;
    }
}

.workspace {
    grid-area: content;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 18px;
    align-items: start;
}

.page-dashboard .shell {
    width: min(1560px, calc(100% - 40px));
}

.dashboard-catalog {
    grid-area: content;
    display: grid;
    gap: 18px;
    min-width: 0;
}

.dashboard-hero {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 12px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: clamp(34px, 5vw, 68px) 24px 28px;
    background:
        radial-gradient(circle at 16% 0%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 34%),
        radial-gradient(circle at 88% 100%, color-mix(in srgb, var(--accent-gradient) 16%, transparent), transparent 38%),
        color-mix(in srgb, var(--panel-bg) 94%, transparent);
    box-shadow: var(--shadow);
    text-align: center;
    isolation: isolate;
}

.dashboard-hero::before,
.dashboard-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 260px;
    height: 260px;
    border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent);
    border-radius: 42% 58% 68% 32% / 48% 38% 62% 52%;
    opacity: .38;
    transform: rotate(24deg);
}

.dashboard-hero::before {
    top: -188px;
    left: -70px;
}

.dashboard-hero::after {
    right: -92px;
    bottom: -204px;
    border-color: color-mix(in srgb, var(--accent-gradient) 24%, transparent);
    transform: rotate(-18deg);
}

.dashboard-hero h2 {
    max-width: 900px;
    margin: 0;
    font-size: clamp(28px, 4.2vw, 52px);
    line-height: 1.04;
    letter-spacing: -.035em;
}

.dashboard-hero > p {
    max-width: 720px;
    color: var(--muted);
    font-size: clamp(15px, 1.5vw, 18px);
    line-height: 1.55;
}

.dashboard-filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 12px;
}

.dashboard-filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    min-height: 38px;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 8px 14px;
    background: var(--secondary-bg);
    color: var(--muted);
    box-shadow: none;
    font-size: 13px;
    font-weight: 800;
}

.dashboard-filter span {
    display: inline-grid;
    place-items: center;
    min-width: 20px;
    height: 20px;
    border-radius: 999px;
    padding: 0 5px;
    background: color-mix(in srgb, currentColor 12%, transparent);
    font-size: 11px;
}

.dashboard-filter:hover,
.dashboard-filter:focus-visible {
    border-color: color-mix(in srgb, var(--accent) 68%, var(--line));
    background: var(--secondary-hover);
    color: var(--text);
    box-shadow: none;
    transform: translateY(-1px);
}

.dashboard-filter.is-active {
    border-color: transparent;
    background: var(--text);
    color: var(--bg);
}

.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(238px, 1fr));
    gap: 14px;
}

.tool-card {
    --tool-accent: var(--accent);
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-height: 250px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 13px;
    padding: 22px;
    background: color-mix(in srgb, var(--panel-bg) 96%, var(--tool-accent) 4%);
    box-shadow: 0 16px 42px rgba(0, 0, 0, .20);
    color: var(--text);
    text-decoration: none;
    transform: translateY(0);
    transition:
        border-color .22s ease,
        box-shadow .22s ease,
        transform .22s ease,
        background .22s ease;
}

.tool-card[hidden] {
    display: none;
}

.tool-card::after {
    content: "";
    position: absolute;
    top: -72px;
    right: -66px;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: var(--tool-accent);
    opacity: .07;
    transition: opacity .22s ease, transform .3s ease;
}

.tool-card--cyan { --tool-accent: #36c7f0; }
.tool-card--green { --tool-accent: #43d690; }
.tool-card--violet { --tool-accent: #a77aff; }
.tool-card--amber { --tool-accent: #ffc857; }
.tool-card--rose { --tool-accent: #ff72b6; }

.tool-card:hover,
.tool-card:focus-visible {
    border-color: color-mix(in srgb, var(--tool-accent) 72%, var(--line));
    background: color-mix(in srgb, var(--panel-bg) 92%, var(--tool-accent) 8%);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--tool-accent) 20%, transparent),
        0 22px 54px rgba(0, 0, 0, .28);
    transform: translateY(-4px);
    outline: none;
}

.tool-card:hover::after,
.tool-card:focus-visible::after {
    opacity: .14;
    transform: scale(1.08);
}

.tool-card__topline {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.tool-card__icon {
    position: relative;
    z-index: 1;
    display: inline-grid;
    place-items: center;
    min-width: 48px;
    height: 48px;
    border: 1px solid color-mix(in srgb, var(--tool-accent) 44%, transparent);
    border-radius: 11px;
    padding: 0 8px;
    background: color-mix(in srgb, var(--tool-accent) 18%, var(--surface-soft));
    color: var(--tool-accent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    font-size: 13px;
    font-weight: 950;
    letter-spacing: -.02em;
}

.tool-card__group {
    overflow: hidden;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    line-height: 1.3;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tool-card__copy {
    display: grid;
    gap: 9px;
}

.tool-card__copy strong {
    color: var(--text);
    font-size: 19px;
    line-height: 1.22;
}

.tool-card__copy > span {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.52;
}

.tool-card__action {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: auto;
    color: var(--tool-accent);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.tool-card__action span {
    font-size: 17px;
    transition: transform .2s ease;
}

.tool-card:hover .tool-card__action span,
.tool-card:focus-visible .tool-card__action span {
    transform: translateX(4px);
}

.dashboard-empty {
    border: 1px dashed var(--line);
    border-radius: 13px;
    padding: 40px 20px;
    color: var(--muted);
    text-align: center;
}

@media (max-width: 720px) {
    .page-dashboard .shell {
        width: min(100% - 24px, 1560px);
    }

    .dashboard-hero {
        padding: 34px 16px 20px;
    }

    .dashboard-filters {
        justify-content: flex-start;
        width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding: 2px 0 6px;
        scrollbar-width: thin;
    }

    .dashboard-filter {
        flex: 0 0 auto;
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .tool-card {
        min-height: 220px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dashboard-filter,
    .tool-card,
    .tool-card::after,
    .tool-card__action span {
        transition: none;
    }
}

@media (min-width: 961px) {
    .workspace { margin-top: 0; }
}

.page-site-generator .workspace {
    grid-template-columns: minmax(0, 1fr) 340px;
}

.page-gar-tz .workspace {
    grid-template-columns: minmax(0, 1fr);
}

.page-transliteration .workspace {
    grid-template-columns: minmax(0, 1fr);
}

.page-domain-extraction .workspace {
    grid-template-columns: minmax(0, 1fr);
}

.page-gluing .workspace {
    grid-template-columns: minmax(0, 1fr);
}

.gluing-mode-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.gluing-mode-switch {
    position: relative;
    display: inline-flex;
    grid-template-columns: none;
    flex-direction: row;
    align-items: center;
    gap: 11px;
    min-height: 36px;
    cursor: pointer;
    user-select: none;
}

.gluing-mode-switch__label {
    color: var(--text);
    font-size: 14px;
    font-weight: 800;
}

.gluing-mode-switch input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    opacity: 0;
    pointer-events: none;
}

.gluing-mode-switch__track {
    position: relative;
    display: block;
    width: 54px;
    height: 30px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface-soft);
    box-shadow: inset 0 2px 7px rgba(0, 0, 0, .20);
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.gluing-mode-switch__thumb {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--muted);
    box-shadow: 0 2px 7px rgba(0, 0, 0, .34);
    transition: transform .2s ease, background .18s ease;
}

.gluing-mode-switch input:checked + .gluing-mode-switch__track {
    border-color: var(--accent);
    background: var(--accent-soft);
    box-shadow: 0 0 0 1px var(--accent-soft), inset 0 2px 7px rgba(0, 0, 0, .14);
}

.gluing-mode-switch input:checked + .gluing-mode-switch__track .gluing-mode-switch__thumb {
    transform: translateX(24px);
    background: var(--accent);
}

.gluing-mode-switch input:focus-visible + .gluing-mode-switch__track {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
}

[data-gluing-target-field][hidden] {
    display: none;
}

.gluing-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.gluing-card {
    align-content: start;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    padding: 18px;
}

.gluing-grid > .gluing-card:first-child {
    border-top: 1px solid var(--line);
    padding-top: 18px;
}

.gluing-result-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
}

.gluing-copy-hint {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.4;
}

.gluing-copy-hint.is-error {
    color: var(--warn);
}

form,
.panel {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-bg);
    box-shadow: var(--shadow);
}

form {
    display: grid;
    gap: 18px;
    padding: 22px;
}

.form-toolbar,
.section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.form-toolbar h2,
.section-head h2 {
    margin: 0;
}

.section-tools {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.panel {
    position: sticky;
    top: 18px;
    padding: 20px;
}

.grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.section {
    display: grid;
    gap: 12px;
    border-top: 1px solid var(--line);
    padding-top: 18px;
}

.section:first-child {
    border-top: 0;
    padding-top: 0;
}

label {
    display: grid;
    gap: 7px;
}

label span {
    color: var(--label);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .01em;
}

input,
textarea,
select {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--field-text);
    outline: none;
    padding: 11px 12px;
    line-height: 1.45;
    font: inherit;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

input::placeholder,
textarea::placeholder { color: var(--placeholder); }

input:hover,
textarea:hover,
select:hover { background: var(--surface-hover); }

input:focus,
textarea:focus,
select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 4px var(--accent-soft);
    background: var(--surface-hover);
}

select option {
    background: var(--surface);
    color: var(--text);
}

textarea { resize: vertical; }

.code-area {
    min-height: 280px;
    font-family: Consolas, "Courier New", monospace;
    font-size: 14px;
}

.page-site-generator .code-area { min-height: 320px; }

.page-gar-tz .code-area { min-height: 460px; }

.short-code {
    min-height: 150px;
    font-family: Consolas, "Courier New", monospace;
    font-size: 14px;
}

.page-site-generator .short-code { min-height: 180px; }

.transliteration-form {
    gap: 14px;
    border: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
}

.transliteration-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-bg);
    box-shadow: var(--shadow);
    padding: 16px 18px;
}

.transliteration-options {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 14px;
}

.transliteration-options select {
    min-width: 180px;
}

.transliteration-domain-option {
    display: inline-flex;
    align-items: flex-end;
    gap: 8px;
}

.transliteration-domain-option select {
    min-width: 100px;
}

.transliteration-domain-option .animated-select:has(.animated-select__trigger:disabled) {
    opacity: .48;
    pointer-events: none;
}

.transliteration-domain-option .animated-select__trigger:disabled {
    cursor: default;
}

.transliteration-checkbox {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--secondary-bg);
    padding: 0 14px;
    cursor: pointer;
}

.transliteration-checkbox input {
    width: 17px;
    min-width: 17px;
    height: 17px;
    margin: 0;
    padding: 0;
    accent-color: var(--accent-gradient);
}

.transliteration-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
}

.transliteration-column {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 10px;
    min-width: 0;
    height: 230px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-bg);
    box-shadow: var(--shadow);
    padding: 16px;
}

.transliteration-column__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 36px;
}

.transliteration-column__head h2 {
    margin: 0;
    font-size: 16px;
}

.transliteration-column__head button {
    min-height: 34px;
    padding: 0 12px;
    font-size: 13px;
}

.transliteration-count {
    color: var(--muted);
    font-size: 12px;
    white-space: nowrap;
}

.transliteration-column textarea {
    min-width: 0;
    min-height: 0;
    height: 100%;
    resize: none;
    font-family: Consolas, "Courier New", monospace;
    font-size: 15px;
    line-height: 1.55;
}

.transliteration-column textarea[readonly] {
    background: var(--surface-soft);
}

.domain-extraction-form {
    gap: 14px;
}

.domain-extraction-editor {
    display: grid;
    gap: 10px;
}

.domain-extraction-editor__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.domain-extraction-editor__head h2 {
    margin: 0;
    font-size: 18px;
}

.domain-extraction-count {
    color: var(--muted);
    font-size: 13px;
    white-space: nowrap;
}

.domain-extraction-editor textarea {
    min-height: 460px;
    resize: vertical;
    font-family: Consolas, "Courier New", monospace;
    font-size: 15px;
    line-height: 1.55;
}

.domain-extraction-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.domain-extraction-actions button {
    min-height: 42px;
}

.domain-extraction-status {
    min-height: 20px;
    color: var(--ok-color);
    font-size: 13px;
    line-height: 1.45;
}

.domain-extraction-status.is-error {
    color: var(--warn);
}

.actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.page-site-generator .generator-connection-button {
    margin-left: auto;
}

button,
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    border: 0;
    border-radius: 8px;
    background: var(--accent-gradient);
    color: var(--accent-contrast);
    box-shadow: var(--button-shadow);
    padding: 0 18px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    font: inherit;
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}

button:hover,
.button:hover {
    background: var(--accent-gradient-hover);
    box-shadow: var(--button-shadow-hover);
}

button:active,
.button:active { transform: translateY(1px); }

button.no-glow,
.button.no-glow {
    box-shadow: none;
}

button.no-glow:hover,
.button.no-glow:hover {
    box-shadow: none;
}

.button.secondary,
button.secondary {
    border: 1px solid var(--line);
    background: var(--secondary-bg);
    color: var(--tab-color);
    box-shadow: none;
}

.button.secondary:hover,
button.secondary:hover { background: var(--secondary-hover); }

button.danger {
    border: 1px solid rgba(233, 140, 118, .35);
    background: rgba(233, 140, 118, .10);
    color: var(--warn);
    box-shadow: none;
}

button.danger:hover { background: rgba(233, 140, 118, .16); }

button.button-green,
.button.button-green {
    background: #00be67;
    color: #f4fff9;
    box-shadow: 0 0 0 1px rgba(0, 190, 103, .28), 0 0 22px rgba(0, 190, 103, .30), 0 14px 34px rgba(0, 90, 48, .18);
}

button.button-green:hover,
.button.button-green:hover {
    background: #00d878;
    box-shadow: 0 0 0 1px rgba(0, 216, 120, .36), 0 0 30px rgba(0, 216, 120, .34), 0 18px 40px rgba(0, 90, 48, .20);
}

.animated-select {
    position: relative;
    z-index: 1;
    width: 100%;
    min-width: 0;
}

.animated-select.is-open { z-index: 140; }

.animated-select > .animated-select__native {
    position: absolute !important;
    width: 1px !important;
    min-width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    clip-path: inset(50%) !important;
}

.animated-select__trigger {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 22px;
    gap: 10px;
    align-items: center;
    justify-content: stretch;
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--field-text);
    box-shadow: none;
    padding: 10px 11px 10px 13px;
    text-align: left;
    transform: none;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, color .18s ease;
}

.animated-select__trigger:hover,
.animated-select__trigger:focus-visible,
.animated-select.is-open .animated-select__trigger {
    border-color: var(--accent);
    background: var(--surface-hover);
    color: var(--text);
    box-shadow: 0 0 0 3px var(--accent-soft);
    outline: none;
    transform: none;
}

.animated-select__value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.animated-select__chevron {
    display: block;
    width: 20px;
    height: 20px;
    overflow: visible;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transform-origin: 50% 50%;
}

.animated-select__panel {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 150;
    width: max-content;
    min-width: 100%;
    max-width: min(380px, calc(100vw - 24px));
    overflow: visible;
    overscroll-behavior: contain;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--cat-menu-bg);
    box-shadow: 0 18px 42px rgba(0, 0, 0, .34), 0 0 0 1px var(--accent-soft);
    padding: 7px;
    transform-origin: 50% 0;
    scrollbar-width: thin;
    scrollbar-color: var(--accent) transparent;
}

.animated-select.is-upward .animated-select__panel {
    top: auto;
    bottom: calc(100% + 8px);
    transform-origin: 50% 100%;
}

.animated-select__panel[hidden] { display: none; }

.animated-select__scroll-roll { display: none; }

.animated-select__listbox {
    display: grid;
    gap: 4px;
    max-height: min(256px, calc(100vh - 72px));
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--accent) transparent;
}

.animated-select__option {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 20px;
    gap: 10px;
    align-items: center;
    justify-content: stretch;
    width: 100%;
    min-height: 38px;
    border: 1px solid transparent;
    border-radius: 7px;
    background: transparent;
    color: var(--text);
    box-shadow: none;
    padding: 7px 9px 7px 11px;
    text-align: left;
    transform: none;
}

.animated-select__option:hover,
.animated-select__option:focus-visible {
    border-color: var(--line);
    background: var(--secondary-hover);
    color: var(--tab-hover-color);
    box-shadow: none;
    outline: none;
    transform: none;
}

.animated-select__option.is-selected {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--text);
}

.animated-select__option-label {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

.animated-select__check {
    color: var(--accent);
    font-weight: 900;
    text-align: center;
    opacity: 0;
    transform: scale(.6) rotate(-18deg);
    transition: opacity .16s ease, transform .2s cubic-bezier(.2, .8, .2, 1);
}

.animated-select__option.is-selected .animated-select__check {
    opacity: 1;
    transform: scale(1) rotate(0);
}

.transliteration-options .animated-select { min-width: 180px; }

.page-site-generator .generator-create-button {
    background: #8a3f72;
    color: #ffffff;
    box-shadow: 0 8px 20px rgba(138, 63, 114, .24);
}

.page-site-generator .generator-create-button:hover,
.page-site-generator .generator-create-button:focus-visible {
    background: #98477e;
    box-shadow: 0 10px 24px rgba(138, 63, 114, .30);
}

.page-site-generator .generator-deploy-button {
    background: #176b4b;
    color: #ffffff;
    box-shadow: 0 8px 20px rgba(23, 107, 75, .24);
}

.page-site-generator .generator-deploy-button:hover,
.page-site-generator .generator-deploy-button:focus-visible {
    background: #1d7855;
    box-shadow: 0 10px 24px rgba(23, 107, 75, .30);
}

:root[data-theme="spring"] .page-site-generator .generator-create-button {
    background: #bc4384;
    color: #ffffff;
    box-shadow: 0 8px 20px rgba(188, 67, 132, .24);
}

:root[data-theme="spring"] .page-site-generator .generator-create-button:hover,
:root[data-theme="spring"] .page-site-generator .generator-create-button:focus-visible {
    background: #b83c7e;
    color: #ffffff;
}

:root[data-theme="spring"] .page-site-generator .generator-deploy-button {
    background: #247b58;
    color: #ffffff;
    box-shadow: 0 8px 20px rgba(36, 123, 88, .24);
}

:root[data-theme="spring"] .page-site-generator .generator-deploy-button:hover,
:root[data-theme="spring"] .page-site-generator .generator-deploy-button:focus-visible {
    background: #207653;
    color: #ffffff;
}

.result-action-button {
    display: flex;
    width: fit-content;
    min-width: 210px;
    margin-top: 12px;
}

.result-download-button {
    margin-top: 14px;
    border: 1px solid var(--result-secondary-border);
    background: var(--result-secondary);
    color: var(--result-secondary-text);
    box-shadow: none;
}

.result-download-button:hover,
.result-download-button:focus-visible {
    background: var(--result-secondary-hover);
    color: var(--result-secondary-text);
    box-shadow: 0 0 0 3px var(--accent-soft);
}

.result-site-button {
    background: var(--result-site);
    color: #ffffff;
    box-shadow: 0 0 0 1px rgba(0, 190, 103, .20), 0 0 20px rgba(0, 190, 103, .20);
}

.result-site-button:hover,
.result-site-button:focus-visible {
    background: var(--result-site-hover);
    box-shadow: 0 0 0 1px rgba(0, 190, 103, .26), 0 0 26px rgba(0, 190, 103, .24);
}

.result-check-button {
    background: var(--result-primary);
    color: #ffffff;
    box-shadow: var(--result-action-shadow);
}

.result-check-button:hover,
.result-check-button:focus-visible {
    background: var(--result-primary-hover);
    color: #ffffff;
    box-shadow: var(--result-action-shadow);
}

.account-select {
    margin: 18px 0;
}

.account-select__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 12px;
}

.account-select__head h2 {
    margin: 0;
}

button.hosting-provider-toggle {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 9px;
    min-height: 32px;
    padding: 3px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--muted);
    box-shadow: none;
}

button.hosting-provider-toggle:hover,
button.hosting-provider-toggle:focus-visible {
    border: 0;
    background: transparent;
    box-shadow: none;
    transform: none;
}

.hosting-provider-toggle__label {
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    transition: color .2s ease, opacity .2s ease;
}

.hosting-provider-toggle__label--spaceweb,
.hosting-provider-toggle[aria-checked="true"] .hosting-provider-toggle__label--beget {
    color: var(--muted);
    opacity: .62;
}

.hosting-provider-toggle__label--beget,
.hosting-provider-toggle[aria-checked="true"] .hosting-provider-toggle__label--spaceweb {
    color: var(--field-text);
    opacity: 1;
}

.hosting-provider-toggle__switch {
    position: relative;
    display: block;
    width: 42px;
    height: 24px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: color-mix(in srgb, var(--surface) 88%, var(--bg));
    transition: border-color .2s ease, background .2s ease;
}

.hosting-provider-toggle__switch > span {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--muted);
    transition: transform .22s cubic-bezier(.22, 1, .36, 1), background .2s ease;
}

.hosting-provider-toggle[aria-checked="true"] .hosting-provider-toggle__switch {
    border-color: var(--accent);
    background: var(--accent);
}

.hosting-provider-toggle[aria-checked="true"] .hosting-provider-toggle__switch > span {
    background: var(--accent-contrast);
    transform: translateX(18px);
}

.account-select__buttons {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.account-select__button {
    min-height: 46px;
    border: 1px solid var(--line);
    background: rgba(0, 161, 213, .04);
    color: var(--field-text);
    box-shadow: none;
}

.account-select__button[hidden] {
    display: none;
}

.account-select__button:hover {
    background: rgba(0, 190, 103, .10);
    box-shadow: 0 0 0 1px rgba(0, 190, 103, .18);
}

.account-select__button.is-active {
    border-color: rgba(0, 216, 120, .70);
    background: rgba(0, 190, 103, .18);
    color: var(--field-text);
    box-shadow: 0 0 0 1px rgba(0, 216, 120, .36), 0 0 24px rgba(0, 216, 120, .32);
}

.box {
    margin: 14px 0;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--muted);
    padding: 13px;
    line-height: 1.45;
    word-break: break-word;
}

.box.ok {
    border-color: var(--line);
    color: var(--ok-color);
    background: var(--accent-soft);
}

.box.error {
    border-color: rgba(233, 140, 118, .35);
    color: var(--warn);
    background: rgba(233, 140, 118, .10);
    white-space: pre-line;
}

.history-panel {
    margin-top: 20px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-soft);
    overflow: hidden;
    transition: border-color .2s ease, background .2s ease;
}

.history-panel:hover,
.history-panel.is-open {
    border-color: var(--accent);
}

.history-panel__toggle {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 52px;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--field-text);
    padding: 12px 14px;
    text-align: left;
    box-shadow: none;
    cursor: pointer;
}

.history-panel__toggle:hover,
.history-panel__toggle:focus-visible {
    background: var(--surface-hover);
    box-shadow: none;
}

.history-panel__toggle:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: -2px;
}

.history-panel__title {
    font-size: 18px;
    font-weight: 800;
}

.history-panel__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 26px;
    height: 26px;
    margin-left: 10px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent);
    padding: 0 8px;
    font-size: 13px;
    font-weight: 800;
}

.history-panel__chevron {
    width: 20px;
    height: 20px;
    margin-left: auto;
    transition: transform .25s ease;
}

.history-panel__chevron svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.history-panel.is-open .history-panel__chevron {
    transform: rotate(180deg);
}

.history-panel__content {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows .28s ease, opacity .2s ease;
}

.history-panel.is-open .history-panel__content {
    grid-template-rows: 1fr;
    opacity: 1;
}

.history-panel__inner {
    min-height: 0;
    overflow: hidden;
}

.history {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0 12px 12px;
}

.history-item {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    padding: 10px;
    transition: border-color .16s ease, background .16s ease;
}

.history-item:hover {
    border-color: var(--accent);
    background: var(--surface-hover);
}

.history-item strong,
.history-item span {
    display: block;
    margin-bottom: 6px;
}

.history-item span {
    color: var(--muted);
    font-size: 13px;
}

.history-item a {
    color: var(--accent);
    font-weight: 700;
    text-decoration: none;
}

.article-block {
    display: grid;
    gap: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    padding: 12px;
}

.article-block + .article-block { margin-top: 12px; }

.page-text-html .workspace {
    grid-template-columns: minmax(0, 1fr);
}

.page-text-html .shell {
    width: min(1840px, calc(100% - 40px));
}

.text-html-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.editor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    min-width: 0;
    align-items: start;
}

.editor-pane {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 7px;
    min-width: 0;
    max-width: 100%;
    height: clamp(760px, calc(100vh - 240px), 980px);
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-bg);
    box-shadow: var(--shadow);
    padding: 18px;
}

.editor-pane__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.editor-pane__tools {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.editor-pane__tools button {
    min-height: 34px;
    padding: 0 12px;
    font-size: 13px;
}

.editor-pane .code-area,
.rich-editor {
    min-width: 0;
    min-height: 0;
    height: 100%;
    max-height: 100%;
}

.CodeMirror {
    min-width: 0;
    min-height: 0;
    height: 280px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--field-text);
    font-family: Consolas, "Courier New", monospace;
    font-size: 14px;
    line-height: 1.45;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.CodeMirror.CodeMirror-focused {
    border-color: var(--accent);
    box-shadow: 0 0 0 4px var(--accent-soft);
}

.CodeMirror.CodeMirror-invalid {
    border-color: var(--warn);
    box-shadow: 0 0 0 4px rgba(233, 140, 118, .14);
}

.CodeMirror-scroll { min-height: 0; }
.CodeMirror-lines { padding: 11px 0; }
.CodeMirror pre.CodeMirror-line,
.CodeMirror pre.CodeMirror-line-like { padding: 0 12px; }
.CodeMirror-cursor { border-left-color: var(--field-text); }
.CodeMirror-placeholder { color: var(--placeholder) !important; }
.CodeMirror-selected,
.CodeMirror-focused .CodeMirror-selected { background: var(--code-selection); }

.code-editor--short { height: 150px; }
.page-site-generator .code-editor--code {
    height: 320px;
    min-height: 320px;
}
.page-site-generator .code-editor--short {
    height: 180px;
    min-height: 180px;
}
.page-site-generator .code-editor--code,
.page-site-generator .code-editor--short {
    overflow: hidden;
    resize: vertical;
}
.page-site-generator .CodeMirror {
    color: var(--code-text);
    font-size: 15px;
    line-height: 1.65;
}
.page-site-generator .CodeMirror-lines { padding: 14px 0; }
.page-site-generator .CodeMirror pre.CodeMirror-line,
.page-site-generator .CodeMirror pre.CodeMirror-line-like { padding: 0 16px; }

/* Caption styles from `label span` must not leak into CodeMirror tokens. */
:where(.page-site-generator) .CodeMirror span {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
}
.editor-pane .CodeMirror { height: 100%; }

.CodeMirror .cm-tag { color: var(--syntax-tag); font-weight: 700; }
.CodeMirror .cm-bracket { color: var(--syntax-punctuation); }
.CodeMirror .cm-attribute,
.CodeMirror .cm-property { color: var(--syntax-attribute); }
.CodeMirror .cm-string,
.CodeMirror .cm-string-2 { color: var(--syntax-value); }
.CodeMirror .cm-comment { color: var(--syntax-comment); font-style: italic; }
.CodeMirror .cm-meta,
.CodeMirror .cm-qualifier { color: var(--syntax-doctype); }
.CodeMirror .cm-atom,
.CodeMirror .cm-number { color: var(--syntax-entity); }
.CodeMirror .cm-keyword,
.CodeMirror .cm-operator { color: var(--syntax-punctuation); }
.CodeMirror .cm-variable,
.CodeMirror .cm-variable-2,
.CodeMirror .cm-def { color: var(--field-text); }

.rich-editor {
    width: 100%;
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--field-text);
    outline: none;
    padding: 14px 15px;
    line-height: 1.45;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.rich-editor:empty::before {
    content: attr(data-placeholder);
    color: var(--placeholder);
    white-space: pre-line;
}

.rich-editor:hover {
    background: var(--surface-hover);
}

.rich-editor:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 4px var(--accent-soft);
    background: var(--surface-hover);
}

.rich-editor h1,
.rich-editor h2,
.rich-editor h3,
.rich-editor h4,
.rich-editor h5,
.rich-editor h6 {
    margin: 18px 0 10px;
    color: var(--text);
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 700;
    line-height: 1.2;
}

.rich-editor h1 { font-size: 26px; }
.rich-editor h2 { font-size: 22px; }
.rich-editor h3 { font-size: 19px; }

.rich-editor p {
    margin: 0 0 13px;
    overflow-wrap: anywhere;
}

.rich-editor ul,
.rich-editor ol {
    margin: 0 0 14px 26px;
    padding: 0 0 0 18px;
}

.rich-editor li {
    margin: 4px 0;
    overflow-wrap: anywhere;
}

.rich-editor img,
.rich-editor video,
.rich-editor iframe {
    max-width: 100%;
    height: auto;
}

.rich-editor table {
    width: 100%;
    max-width: 100%;
    margin: 14px 0;
    border-collapse: collapse;
    table-layout: fixed;
}

.rich-editor th,
.rich-editor td {
    border: 1px solid #9ea7b0;
    padding: 7px 9px;
    vertical-align: top;
    overflow-wrap: anywhere;
}

.rich-editor th {
    background: #edf2f7;
    font-weight: 700;
}

.options-panel {
    position: static;
    display: grid;
    gap: 12px;
    padding: 14px 16px;
}

.options-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.options-panel__head h2 {
    margin: 0;
}

.options-panel__head button {
    min-height: 36px;
    padding: 0 16px;
}

.check-grid {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.check-option {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    padding: 8px 10px;
    color: var(--field-text);
    cursor: pointer;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.check-option:hover {
    border-color: var(--accent);
    background: var(--surface-hover);
    box-shadow: 0 0 0 4px var(--accent-soft);
}

.check-option input {
    width: 17px;
    min-width: 17px;
    height: 17px;
    margin: 0;
    accent-color: var(--accent-gradient);
}

.check-option span {
    color: var(--field-text);
    font-size: 13px;
    line-height: 1.25;
}

.page-image-converter .workspace {
    grid-template-columns: minmax(0, 1fr);
}

.page-netcat-upload .workspace {
    grid-template-columns: minmax(0, 1fr);
}

.page-netcat-upload form > .section:first-of-type {
    border-top: 0;
    padding-top: 0;
}

:root[data-theme="dark"] .page-netcat-upload {
    --button-shadow: 0 0 0 1px rgba(255, 134, 201, .14), 0 0 9px rgba(245, 0, 189, .14), 0 7px 16px rgba(43, 14, 102, .12);
    --button-shadow-hover: 0 0 0 1px rgba(255, 134, 201, .22), 0 0 14px rgba(255, 134, 201, .18), 0 9px 20px rgba(245, 0, 189, .12);
}

:root[data-theme="spring"] .page-netcat-upload {
    --button-shadow: 0 8px 18px rgba(216, 95, 159, .14);
    --button-shadow-hover: 0 10px 22px rgba(216, 95, 159, .18);
}

.page-netcat-upload button.button-green {
    box-shadow: 0 0 0 1px rgba(0, 190, 103, .18), 0 0 9px rgba(0, 190, 103, .14), 0 7px 16px rgba(0, 90, 48, .10);
}

.page-netcat-upload button.button-green:hover {
    box-shadow: 0 0 0 1px rgba(0, 216, 120, .24), 0 0 14px rgba(0, 216, 120, .18), 0 9px 20px rgba(0, 90, 48, .12);
}

.netcat-upload-note {
    margin: 0;
}

.netcat-upload-site-select {
    max-width: 100%;
}

.netcat-site-editor {
    display: grid;
    gap: 14px;
    border-top: 1px solid var(--line);
    padding-top: 16px;
}

.netcat-site-editor[hidden] {
    display: none;
}

.netcat-upload-advanced {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    padding: 12px 14px;
}

.netcat-upload-advanced summary {
    color: var(--label);
    cursor: pointer;
    font-weight: 800;
}

.netcat-upload-advanced[open] summary {
    margin-bottom: 14px;
}

.netcat-upload-queue {
    display: grid;
    gap: 10px;
    min-height: 92px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    padding: 12px;
}

.netcat-upload-empty {
    display: grid;
    place-items: center;
    min-height: 66px;
    color: var(--muted);
    text-align: center;
}

.netcat-upload-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-bg);
    padding: 11px 13px;
}

.netcat-upload-item__copy {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.netcat-upload-item__copy strong {
    overflow: hidden;
    color: var(--field-text);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.netcat-upload-item__copy span,
.netcat-upload-item__status {
    color: var(--muted);
    font-size: 13px;
}

.netcat-upload-item__remove {
    display: grid;
    width: 38px;
    height: 38px;
    min-width: 38px;
    min-height: 38px;
    aspect-ratio: 1 / 1;
    place-items: center;
    justify-self: end;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--surface-soft);
    box-shadow: none;
    color: var(--muted);
    padding: 0 0 3px;
    font: inherit;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;
    cursor: pointer;
    transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease;
}

.netcat-upload-item__remove:hover {
    border-color: rgba(231, 89, 89, .55);
    background: rgba(231, 89, 89, .12);
    color: #e75959;
    box-shadow: none;
    transform: scale(1.06);
}

.netcat-upload-item__remove:focus-visible {
    border-color: #e75959;
    outline: 3px solid rgba(231, 89, 89, .22);
    color: #e75959;
}

.netcat-upload-item__remove[hidden],
.netcat-upload-item__status[hidden] {
    display: none;
}

.netcat-upload-item__status {
    max-width: 420px;
    text-align: right;
}

.netcat-upload-item[data-state="loading"] .netcat-upload-item__status {
    color: var(--accent);
}

.netcat-upload-item[data-state="success"] {
    border-color: rgba(55, 190, 120, .6);
}

.netcat-upload-item[data-state="success"] .netcat-upload-item__status {
    color: #38b979;
    font-weight: 800;
}

.netcat-upload-item[data-state="error"] {
    border-color: rgba(231, 89, 89, .7);
}

.netcat-upload-item[data-state="error"] .netcat-upload-item__status {
    color: #e75959;
    font-weight: 700;
}

.netcat-upload-paths {
    display: grid;
    gap: 10px;
    min-height: 92px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    padding: 12px;
}

.netcat-upload-path {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-bg);
    padding: 10px 12px;
}

.netcat-upload-path code {
    overflow-wrap: anywhere;
    color: var(--field-text);
    font-family: var(--font-mono);
    font-size: 14px;
}

.netcat-upload-path button {
    min-width: 124px;
}

@media (max-width: 680px) {
    .netcat-upload-item {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .netcat-upload-item__status {
        grid-column: 1 / -1;
        max-width: none;
        text-align: left;
    }

    .netcat-upload-path {
        grid-template-columns: minmax(0, 1fr);
    }

    .netcat-upload-path button {
        width: 100%;
    }
}

.image-dropzone {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
}

.image-dropzone__label {
    flex: 0 0 100%;
    color: var(--label);
    font-size: 14px;
    font-weight: 800;
}

.image-dropzone input[type="file"] {
    display: none;
}

.image-dropzone__box {
    display: grid;
    place-items: center;
    gap: 10px;
    min-height: 220px;
    border: 1px dashed var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    padding: 26px;
    text-align: center;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.image-dropzone__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    width: auto;
    border-radius: 8px;
    background: var(--accent-gradient);
    color: var(--accent-contrast);
    box-shadow: var(--button-shadow);
    padding: 0 26px;
    font-weight: 800;
}

.image-dropzone__button:hover,
.image-dropzone.is-dragover .image-dropzone__button,
.image-dropzone__button:focus-visible {
    background: var(--accent-gradient-hover);
    box-shadow: var(--button-shadow-hover);
}

.image-dropzone__hint,
.image-dropzone__name {
    color: var(--muted);
    line-height: 1.35;
}

.image-dropzone__name {
    color: var(--field-text);
    font-size: 15px;
    font-weight: 800;
}

.image-dropzone.has-file .image-dropzone__name {
    color: var(--field-text);
}

.image-preview-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: flex-start;
    width: 100%;
    min-height: 292px;
    margin-top: 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-bg);
    padding: 20px;
    text-align: left;
}

.image-preview-grid.is-empty {
    display: grid;
    place-items: center;
    min-height: 160px;
}

.image-preview {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 36px;
    grid-template-rows: auto 148px auto;
    grid-template-areas:
        "head tools"
        "thumb tools"
        "download tools";
    gap: 10px 12px;
    align-items: start;
    width: 242px;
    min-height: 266px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    padding: 12px;
}

.image-preview__head {
    grid-area: head;
    display: grid;
    gap: 2px;
    min-width: 0;
}

.image-preview__thumb {
    grid-area: thumb;
    display: grid;
    place-items: center;
    width: 100%;
    height: 148px;
    overflow: hidden;
    border-radius: 7px;
    background: var(--secondary-bg);
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.image-preview__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.image-preview__head strong,
.image-preview__head span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.image-preview__head strong {
    color: var(--text);
    font-size: 14px;
    line-height: 1.2;
}

.image-preview__head span {
    color: var(--muted);
    font-size: 12px;
}

.image-preview__tools {
    grid-area: tools;
    display: grid;
    gap: 8px;
    justify-items: center;
}

.image-preview__tools button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    min-width: 36px;
    min-height: 36px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: var(--secondary-bg);
    color: var(--accent);
    box-shadow: none;
    font-size: 19px;
    line-height: 1;
}

.image-preview__tools button:hover,
.image-preview__tools button:focus-visible {
    background: var(--surface-hover);
    color: var(--tab-hover-color);
    box-shadow: 0 0 0 4px var(--accent-soft);
}

.image-preview__tools span {
    color: var(--ok-color);
    font-size: 15px;
    font-weight: 900;
}

.image-preview__download {
    grid-area: download;
    width: 100%;
    min-height: 40px;
    padding: 0 14px;
}

.range-field input[type="range"] {
    padding: 0;
    accent-color: var(--accent-gradient);
}

.converter-settings-grid {
    grid-template-columns: minmax(150px, .8fr) repeat(2, minmax(150px, 1fr)) minmax(210px, 1.15fr);
    align-items: end;
}

.converter-aspect-option {
    min-height: 44px;
}

.image-settings-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: none;
    place-items: center;
    overflow-y: auto;
    background: rgba(5, 8, 18, .72);
    padding: 24px;
    backdrop-filter: blur(8px);
}

.image-settings-modal.is-open {
    display: grid;
}

.image-settings-modal__dialog {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(320px, .9fr);
    grid-template-areas:
        "head head"
        "preview controls"
        "actions actions";
    gap: 18px;
    width: min(900px, 100%);
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--panel-bg);
    box-shadow: var(--shadow);
    padding: 20px;
}

.image-settings-modal__head {
    grid-area: head;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    min-width: 0;
}

.image-settings-modal__head > div {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.image-settings-modal__head strong,
.image-settings-modal__head span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.image-settings-modal__head strong {
    color: var(--text);
    font-size: 18px;
}

.image-settings-modal__head span {
    color: var(--muted);
    font-size: 13px;
}

.image-settings-modal__head > button {
    width: 38px;
    min-width: 38px;
    min-height: 38px;
    border-radius: 50%;
    padding: 0;
    font-size: 22px;
    line-height: 1;
}

.image-settings-modal__preview {
    grid-area: preview;
    display: grid;
    place-items: center;
    min-height: 360px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--secondary-bg);
    padding: 18px;
}

.image-settings-modal__preview img {
    display: block;
    max-width: 100%;
    max-height: 420px;
    object-fit: contain;
}

.image-settings-modal__controls {
    grid-area: controls;
    display: grid;
    align-content: start;
    gap: 18px;
}

.image-settings-modal__fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.image-settings-modal__fields .image-settings-modal__name,
.image-settings-modal__fields .check-option {
    grid-column: 1 / -1;
}

.image-settings-modal__quality {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: end;
    gap: 12px;
}

.image-settings-modal__quality > button {
    width: 44px;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    font-size: 22px;
}

.image-settings-modal__actions {
    grid-area: actions;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

@media (max-width: 760px) {
    .converter-settings-grid,
    .image-settings-modal__dialog {
        grid-template-columns: 1fr;
    }

    .image-settings-modal__dialog {
        grid-template-areas:
            "head"
            "preview"
            "controls"
            "actions";
    }

    .image-settings-modal {
        padding: 12px;
    }

    .image-settings-modal__preview {
        min-height: 240px;
    }
}

.converter-results {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

.converter-result {
    display: grid;
    gap: 6px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    padding: 10px;
}

.converter-result strong {
    color: var(--text);
}

.converter-result span {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.35;
    word-break: break-word;
}

.converter-result a {
    color: var(--accent);
    font-weight: 700;
    text-decoration: none;
}

.converter-result.is-error {
    border-color: rgba(233, 140, 118, .35);
    background: rgba(233, 140, 118, .10);
}

.converter-result.is-error span {
    color: var(--warn);
}

.file-upload {
    position: relative;
    gap: 8px;
    cursor: pointer;
}

.file-upload input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.file-upload__box {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 56px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--field-text);
    padding: 12px 14px;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease, transform .16s ease;
}

.file-upload:hover .file-upload__box {
    border-color: var(--accent);
    background: var(--surface-hover);
    box-shadow: 0 0 0 4px var(--accent-soft);
}

.file-upload input[type="file"]:focus-visible + .file-upload__box {
    border-color: var(--accent);
    box-shadow: 0 0 0 4px var(--accent-soft);
    outline: none;
}

.file-upload__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    min-width: 34px;
    height: 34px;
    border-radius: 8px;
    background: var(--secondary-bg);
    color: var(--tab-color);
}

.file-upload__icon svg {
    width: 19px;
    height: 19px;
    stroke: currentColor;
    stroke-width: 2;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.file-upload__text {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.file-upload__action {
    color: var(--text);
    font-weight: 800;
    line-height: 1.2;
}

.file-upload__name {
    color: var(--muted);
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-upload.has-file .file-upload__box { border-color: var(--accent); }
.file-upload.has-file .file-upload__name { color: var(--field-text); }

.theme-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    min-width: 46px;
    min-height: 46px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--tab-color);
    box-shadow: none;
    cursor: pointer;
    overflow: hidden;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}

.theme-toggle::before {
    content: "";
    position: absolute;
    inset: 7px;
    border-radius: 50%;
    border: 1px solid transparent;
    border-top-color: var(--accent);
    border-right-color: var(--warn);
    opacity: 0;
    transform: rotate(0deg) scale(.82);
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
    background: var(--secondary-bg);
    color: var(--tab-hover-color);
    box-shadow: 0 0 22px rgba(0, 161, 213, .18);
    outline: none;
}

.theme-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    display: inline-flex;
    width: 24px;
    height: 24px;
    opacity: 0;
    transform: translate(-50%, -50%);
}

.theme-icon svg {
    width: 24px;
    height: 24px;
    stroke: currentColor;
    stroke-width: 2;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

:root[data-theme="spring"] .theme-icon-sun { opacity: 1; }
:root:not([data-theme="spring"]) .theme-icon-moon { opacity: 1; }

.theme-toggle.is-switching-to-dark .theme-icon-sun {
    opacity: 1;
    animation: themeSunSet .68s cubic-bezier(.45, 0, .2, 1) forwards;
}

.theme-toggle.is-switching-to-dark .theme-icon-moon {
    opacity: 1;
    animation: themeMoonRise .68s cubic-bezier(.2, .72, .2, 1) forwards;
}

.theme-toggle.is-switching-to-light .theme-icon-moon {
    opacity: 1;
    animation: themeMoonSet .68s cubic-bezier(.45, 0, .2, 1) forwards;
}

.theme-toggle.is-switching-to-light .theme-icon-sun {
    opacity: 1;
    animation: themeSunRise .68s cubic-bezier(.2, .72, .2, 1) forwards;
}

.theme-toggle.is-switching-to-dark::before,
.theme-toggle.is-switching-to-light::before {
    animation: themeDiskSpin .68s cubic-bezier(.2, .72, .2, 1) forwards;
}

@keyframes themeDiskSpin {
    0% { opacity: 0; transform: rotate(-90deg) scale(.72); }
    18% { opacity: .85; }
    100% { opacity: 0; transform: rotate(270deg) scale(1.1); }
}

@keyframes themeSunSet {
    0% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(0); }
    100% { opacity: 0; transform: translate(calc(-50% - 18px), calc(-50% + 26px)) scale(.72) rotate(-42deg); }
}

@keyframes themeMoonRise {
    0% { opacity: 0; transform: translate(calc(-50% + 20px), calc(-50% + 28px)) scale(.74) rotate(42deg); }
    100% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(0); }
}

@keyframes themeMoonSet {
    0% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(0); }
    100% { opacity: 0; transform: translate(calc(-50% - 18px), calc(-50% + 26px)) scale(.72) rotate(-42deg); }
}

@keyframes themeSunRise {
    0% { opacity: 0; transform: translate(calc(-50% + 20px), calc(-50% + 28px)) scale(.74) rotate(42deg); }
    100% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(0); }
}

:root[data-theme="terraria"] body {
    background-attachment: fixed;
    font-family: Consolas, "Courier New", monospace;
    image-rendering: pixelated;
}

:root[data-theme="terraria"] body::before {
    inset: 0;
    height: auto;
    background: rgba(8, 22, 18, .10);
    opacity: 1;
    -webkit-mask-image: none;
    mask-image: none;
}

:root[data-theme="terraria"] body::after {
    display: none;
}

:root[data-theme="terraria"] h1,
:root[data-theme="terraria"] h2,
:root[data-theme="terraria"] .tabs__title {
    letter-spacing: -.04em;
    text-shadow: 2px 2px 0 #11180f;
}

:root[data-theme="terraria"] .muted,
:root[data-theme="terraria"] label span,
:root[data-theme="terraria"] .history-item span {
    text-shadow: 1px 1px 0 rgba(17, 24, 15, .66);
}

:root[data-theme="terraria"] .topbar,
:root[data-theme="terraria"] .tabs,
:root[data-theme="terraria"] form:not(.transliteration-form):not(.text-html-form),
:root[data-theme="terraria"] .panel,
:root[data-theme="terraria"] .transliteration-toolbar,
:root[data-theme="terraria"] .transliteration-column,
:root[data-theme="terraria"] .editor-pane,
:root[data-theme="terraria"] .image-preview-grid {
    border-width: 2px;
    border-radius: 2px;
    box-shadow: var(--shadow);
}

:root[data-theme="terraria"] form:not(.transliteration-form):not(.text-html-form),
:root[data-theme="terraria"] .panel,
:root[data-theme="terraria"] .transliteration-toolbar,
:root[data-theme="terraria"] .transliteration-column,
:root[data-theme="terraria"] .editor-pane,
:root[data-theme="terraria"] .image-preview-grid {
    background: var(--panel-bg);
}

:root[data-theme="terraria"] .topbar {
    border-color: #83a9bd;
    background: var(--topbar-bg);
    box-shadow: 5px 5px 0 rgba(7, 13, 16, .78), inset 0 0 0 2px rgba(206, 237, 246, .10);
}

:root[data-theme="terraria"] .tabs {
    border-color: #8d6538;
    background: var(--tabs-bg);
    box-shadow: 5px 5px 0 rgba(15, 11, 8, .76), inset 0 0 0 2px rgba(235, 193, 117, .07);
}

:root[data-theme="terraria"] .tab-group {
    border: 2px solid #6d4b2a;
    border-radius: 2px;
    background: rgba(20, 39, 48, .72);
    box-shadow: 3px 3px 0 rgba(16, 11, 8, .62);
}

:root[data-theme="terraria"] .tab-group__summary {
    background: rgba(59, 42, 27, .92);
    text-shadow: 1px 1px 0 #16110c;
}

:root[data-theme="terraria"] .tab-group__summary:hover,
:root[data-theme="terraria"] .tab-group__summary:focus-visible {
    background: #553a24;
}

:root[data-theme="terraria"] .tab-group__items {
    border-top-color: #6d4b2a;
}

:root[data-theme="terraria"] .tab {
    min-height: 52px;
    border: 2px solid #6d4b2a;
    border-radius: 2px;
    box-shadow: inset 0 -3px 0 rgba(8, 20, 25, .30), 3px 3px 0 rgba(16, 11, 8, .74);
    text-shadow: 1px 1px 0 #16110c;
}

:root[data-theme="terraria"] .tab:hover,
:root[data-theme="terraria"] .tab:focus-visible {
    border-color: #a8793e;
    box-shadow: inset 0 -2px 0 rgba(8, 20, 25, .22), 2px 2px 0 rgba(16, 11, 8, .72);
    transform: translate(1px, 1px);
}

:root[data-theme="terraria"] .tab.active {
    border-color: #b9e77c;
    box-shadow: var(--accent-shadow);
    text-shadow: 1px 1px 0 rgba(20, 32, 15, .72);
}

:root[data-theme="terraria"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
:root[data-theme="terraria"] textarea,
:root[data-theme="terraria"] select:not(.animated-select__native),
:root[data-theme="terraria"] .CodeMirror,
:root[data-theme="terraria"] .rich-editor {
    border: 4px solid transparent;
    border-image-source: url("terraria-field-frame.png?v=2");
    border-image-slice: 10;
    border-image-width: 8px;
    border-image-outset: 2px;
    border-image-repeat: stretch;
    border-radius: 2px;
    box-shadow: 2px 3px 0 rgba(19, 11, 6, .34);
    image-rendering: pixelated;
}

:root[data-theme="terraria"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
:root[data-theme="terraria"] textarea:focus,
:root[data-theme="terraria"] select:not(.animated-select__native):focus,
:root[data-theme="terraria"] .CodeMirror.CodeMirror-focused,
:root[data-theme="terraria"] .rich-editor:focus {
    box-shadow:
        2px 3px 0 rgba(19, 11, 6, .34),
        0 0 0 2px #6d9b45;
}

:root[data-theme="terraria"] .animated-select__trigger,
:root[data-theme="terraria"] .animated-select__panel {
    border: 2px solid #4b2b12;
    border-image: none;
    border-radius: 2px;
    background:
        linear-gradient(90deg, rgba(91, 55, 21, .16), transparent 18%, transparent 82%, rgba(91, 55, 21, .18)),
        repeating-linear-gradient(0deg, rgba(255, 244, 184, .10) 0 2px, rgba(104, 66, 27, .06) 2px 4px),
        #d7b76d;
    color: #3b260f;
    image-rendering: pixelated;
}

:root[data-theme="terraria"] .animated-select__trigger {
    position: relative;
    z-index: 5;
    overflow: visible;
    border-radius: 4px;
    background:
        linear-gradient(180deg,
            #6b3b15 0 6%,
            #b97835 8% 18%,
            #f0d895 20% 39%,
            #e4c476 41% 60%,
            #b37331 62% 80%,
            #603310 82% 100%);
    box-shadow:
        inset 0 2px 0 rgba(255, 235, 157, .54),
        inset 0 -3px 0 rgba(103, 61, 23, .28),
        2px 3px 0 rgba(19, 11, 6, .38);
    font-family: Consolas, "Courier New", monospace;
    font-weight: 800;
    text-shadow: 1px 1px 0 rgba(255, 232, 153, .58);
}

:root[data-theme="terraria"] .animated-select__trigger:hover,
:root[data-theme="terraria"] .animated-select__trigger:focus-visible,
:root[data-theme="terraria"] .animated-select.is-open .animated-select__trigger {
    border-color: #74471e;
    background:
        linear-gradient(180deg,
            #744319 0 6%,
            #ca8b40 8% 18%,
            #f8e4a7 20% 39%,
            #edcf83 41% 60%,
            #c08239 62% 80%,
            #693916 82% 100%);
    color: #2c1b0b;
    box-shadow:
        inset 0 2px 0 rgba(255, 241, 181, .64),
        inset 0 -3px 0 rgba(103, 61, 23, .24),
        2px 3px 0 rgba(19, 11, 6, .34),
        0 0 0 2px rgba(159, 199, 101, .56);
}

:root[data-theme="terraria"] .animated-select__trigger::before,
:root[data-theme="terraria"] .animated-select__trigger::after {
    content: "";
    position: absolute;
    top: -5px;
    bottom: -5px;
    z-index: 0;
    width: 14px;
    border: 2px solid #2b1809;
    border-radius: 45%;
    background:
        linear-gradient(90deg, #8d5b28 0 20%, #e2c477 22% 58%, #aa7135 60% 82%, #5c3517 84% 100%);
    box-shadow: inset 0 1px 0 rgba(255, 237, 170, .48), 1px 2px 0 rgba(20, 11, 5, .28);
    pointer-events: none;
}

:root[data-theme="terraria"] .animated-select__trigger::before { left: -10px; }
:root[data-theme="terraria"] .animated-select__trigger::after { right: -10px; }

:root[data-theme="terraria"] .animated-select__value,
:root[data-theme="terraria"] .animated-select__chevron {
    position: relative;
    z-index: 1;
}

:root[data-theme="terraria"] .animated-select__value {
    color: #2f1b09;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: .01em;
    text-shadow: 1px 1px 0 rgba(255, 235, 162, .42);
}

:root[data-theme="terraria"] .animated-select__chevron {
    color: #2f1b09;
}

:root[data-theme="terraria"] .animated-select__panel {
    top: calc(100% - 2px);
    z-index: 4;
    border: 0;
    background: transparent;
    color: #3b260f;
    box-shadow: none;
    padding: 0 5px 12px;
}

:root[data-theme="terraria"] .animated-select__panel::before,
:root[data-theme="terraria"] .animated-select__panel::after {
    content: none;
}

:root[data-theme="terraria"] .animated-select__scroll-roll {
    position: absolute;
    left: -9px;
    right: -9px;
    z-index: 4;
    display: block;
    height: 20px;
    border: 2px solid #4a2910;
    border-radius: 3px;
    background:
        linear-gradient(180deg,
            #704018 0 6%,
            #bb7b37 8% 18%,
            #f1d590 20% 38%,
            #e7c477 40% 58%,
            #b67a37 60% 78%,
            #6b3c16 80% 100%);
    box-shadow:
        inset 0 2px 0 rgba(255, 240, 178, .54),
        inset 0 -3px 0 rgba(74, 39, 13, .46),
        2px 3px 0 rgba(20, 11, 5, .38);
    pointer-events: none;
}

:root[data-theme="terraria"] .animated-select__scroll-roll::before,
:root[data-theme="terraria"] .animated-select__scroll-roll::after {
    content: "";
    position: absolute;
    top: -5px;
    bottom: -5px;
    z-index: 1;
    width: 15px;
    border: 2px solid #2b1809;
    border-radius: 45%;
    background:
        linear-gradient(90deg, #2c1809 0 14%, #754219 16% 36%, #b97934 38% 60%, #6c3b16 62% 82%, #241306 84% 100%);
    box-shadow:
        inset 2px 0 0 rgba(224, 157, 72, .30),
        1px 2px 0 rgba(20, 11, 5, .42);
    pointer-events: none;
}

:root[data-theme="terraria"] .animated-select__scroll-roll::before { left: -8px; }
:root[data-theme="terraria"] .animated-select__scroll-roll::after { right: -8px; }
:root[data-theme="terraria"] .animated-select__scroll-roll--top { display: none; }
:root[data-theme="terraria"] .animated-select__scroll-roll--bottom { bottom: 1px; }

:root[data-theme="terraria"] .animated-select__listbox {
    position: relative;
    z-index: 1;
    border-left: 2px solid #8b5927;
    border-right: 2px solid #765020;
    background:
        linear-gradient(90deg, rgba(105, 62, 22, .26), transparent 12%, transparent 86%, rgba(105, 62, 22, .30)),
        linear-gradient(180deg, rgba(117, 70, 25, .22), transparent 16%, transparent 83%, rgba(117, 70, 25, .28)),
        repeating-linear-gradient(0deg, rgba(255, 246, 197, .08) 0 2px, rgba(112, 67, 24, .045) 2px 4px),
        #e7cf91;
    box-shadow:
        inset 6px 0 0 rgba(105, 62, 22, .08),
        inset -6px 0 0 rgba(105, 62, 22, .10);
    padding: 12px 11px 17px;
    clip-path: polygon(
        2% 0, 98% 0,
        99% 7%, 98% 15%, 100% 24%, 98% 34%, 99% 44%, 97% 54%, 100% 65%, 98% 76%, 99% 87%, 97% 100%,
        3% 100%, 2% 91%, 3% 82%, 1% 72%, 2% 62%, 0 51%, 2% 41%, 1% 31%, 3% 21%, 1% 11%
    );
    scrollbar-color: #7a4a20 rgba(102, 64, 27, .10);
}

:root[data-theme="terraria"] .page-transliteration .transliteration-toolbar {
    z-index: 20;
}

:root[data-theme="terraria"] .page-transliteration .animated-select__panel {
    width: 100%;
    min-width: 100%;
    max-width: none;
}

:root[data-theme="terraria"] .animated-select__option {
    min-height: 40px;
    border-radius: 2px;
    color: #3b260f;
    font-family: Consolas, "Courier New", monospace;
    text-shadow: 1px 1px 0 rgba(255, 233, 158, .56);
}

:root[data-theme="terraria"] .animated-select__option-label {
    color: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: .01em;
}

:root[data-theme="terraria"] .animated-select__option:hover,
:root[data-theme="terraria"] .animated-select__option:focus-visible {
    border-color: #7c4b20;
    background: rgba(116, 71, 30, .14);
    color: #251608;
}

:root[data-theme="terraria"] .animated-select__option.is-selected {
    border-color: #6f431c;
    background: rgba(119, 72, 29, .20);
    color: #271707;
    box-shadow: inset 3px 0 0 #7f4d20;
}

:root[data-theme="terraria"] .animated-select__check { color: #70431b; }

@media (prefers-reduced-motion: reduce) {
    .animated-select__trigger,
    .animated-select__check { transition: none; }
}

:root[data-theme="terraria"] button:where(:not(.pixel-cat):not(.cat-secret-menu__toggle):not(.theme-toggle):not(.cat-theme-option):not(.animated-select__trigger):not(.animated-select__option)),
:root[data-theme="terraria"] .button {
    position: relative;
    isolation: isolate;
    overflow: visible;
    border: 4px solid transparent;
    border-radius: 0;
    background:
        repeating-linear-gradient(0deg,
            rgba(255, 222, 160, .07) 0 1px,
            rgba(40, 20, 8, .08) 1px 3px,
            transparent 3px 7px) padding-box,
        linear-gradient(180deg,
            #765035 0%,
            #52331f 48%,
            #352014 50%,
            #5d3b24 54%,
            #3b2518 100%) padding-box,
        linear-gradient(180deg,
            #dad3bb 0%,
            #898a80 20%,
            #4d514f 54%,
            #8d8d80 78%,
            #d2c9ad 100%) border-box;
    clip-path: polygon(
        8px 0,
        calc(100% - 8px) 0,
        100% 8px,
        100% calc(100% - 8px),
        calc(100% - 8px) 100%,
        8px 100%,
        0 calc(100% - 8px),
        0 8px
    );
    box-shadow:
        inset 0 1px 0 rgba(255, 225, 170, .16),
        inset 0 -2px 0 rgba(22, 11, 5, .48);
    filter: drop-shadow(3px 3px 0 rgba(14, 18, 12, .72));
    color: #ffe7ad;
    font-family: Consolas, "Courier New", monospace;
    text-shadow: 1px 2px 0 rgba(22, 11, 5, .82);
}

:root[data-theme="terraria"] button:where(:not(.pixel-cat):not(.cat-secret-menu__toggle):not(.theme-toggle):not(.cat-theme-option):not(.animated-select__trigger):not(.animated-select__option))::before,
:root[data-theme="terraria"] button:where(:not(.pixel-cat):not(.cat-secret-menu__toggle):not(.theme-toggle):not(.cat-theme-option):not(.animated-select__trigger):not(.animated-select__option))::after,
:root[data-theme="terraria"] .button::before,
:root[data-theme="terraria"] .button::after {
    content: "";
    position: absolute;
    top: 1px;
    bottom: 1px;
    z-index: 2;
    width: 9px;
    background:
        radial-gradient(circle at 50% 5px,
            #eee5cb 0 1px,
            #aaa99c 1.2px 2.2px,
            #555a58 2.4px 3.3px,
            #252a29 3.5px 4px,
            transparent 4.2px),
        radial-gradient(circle at 50% calc(100% - 5px),
            #eee5cb 0 1px,
            #aaa99c 1.2px 2.2px,
            #555a58 2.4px 3.3px,
            #252a29 3.5px 4px,
            transparent 4.2px);
    image-rendering: pixelated;
    pointer-events: none;
}

:root[data-theme="terraria"] button:where(:not(.pixel-cat):not(.cat-secret-menu__toggle):not(.theme-toggle):not(.cat-theme-option):not(.animated-select__trigger):not(.animated-select__option))::before,
:root[data-theme="terraria"] .button::before { left: 2px; }

:root[data-theme="terraria"] button:where(:not(.pixel-cat):not(.cat-secret-menu__toggle):not(.theme-toggle):not(.cat-theme-option):not(.animated-select__trigger):not(.animated-select__option))::after,
:root[data-theme="terraria"] .button::after { right: 2px; }

:root[data-theme="terraria"] button:where(:not(.pixel-cat):not(.cat-secret-menu__toggle):not(.theme-toggle):not(.cat-theme-option):not(.animated-select__trigger):not(.animated-select__option)):hover,
:root[data-theme="terraria"] .button:hover {
    border-color: transparent;
    background:
        repeating-linear-gradient(0deg,
            rgba(255, 230, 174, .10) 0 1px,
            rgba(40, 20, 8, .07) 1px 3px,
            transparent 3px 7px) padding-box,
        linear-gradient(180deg,
            #896044 0%,
            #65432b 48%,
            #422819 50%,
            #70492d 54%,
            #4a2d1c 100%) padding-box,
        linear-gradient(180deg,
            #f0e8ce 0%,
            #aaa99a 20%,
            #626765 54%,
            #a4a394 78%,
            #e5dcc0 100%) border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 230, 180, .20),
        inset 0 -2px 0 rgba(22, 11, 5, .42);
    filter: drop-shadow(2px 2px 0 rgba(14, 18, 12, .68));
    transform: translate(1px, 1px);
}

:root[data-theme="terraria"] .page-site-generator .generator-create-button,
:root[data-theme="terraria"] .page-site-generator .generator-deploy-button,
:root[data-theme="terraria"] button.button-green,
:root[data-theme="terraria"] .button.button-green {
    border-color: #694019;
    background:
        repeating-linear-gradient(0deg,
            rgba(255, 222, 160, .07) 0 1px,
            rgba(40, 20, 8, .08) 1px 3px,
            transparent 3px 7px) padding-box,
        linear-gradient(180deg, #765035 0%, #52331f 48%, #352014 50%, #5d3b24 54%, #3b2518 100%) padding-box,
        linear-gradient(180deg, #dad3bb 0%, #898a80 20%, #4d514f 54%, #8d8d80 78%, #d2c9ad 100%) border-box;
    border-color: transparent;
    color: #ffe7ad;
    box-shadow:
        inset 0 1px 0 rgba(255, 225, 170, .16),
        inset 0 -2px 0 rgba(22, 11, 5, .48);
    filter: drop-shadow(3px 3px 0 rgba(14, 18, 12, .72));
}

:root[data-theme="terraria"] .account-select__button.is-active {
    background:
        repeating-linear-gradient(0deg,
            rgba(255, 240, 194, .14) 0 1px,
            rgba(73, 39, 13, .07) 1px 3px,
            transparent 3px 7px) padding-box,
        linear-gradient(180deg,
            #ad8258 0%,
            #89613d 48%,
            #604023 50%,
            #956a43 54%,
            #674329 100%) padding-box,
        linear-gradient(180deg,
            #fff0a3 0%,
            #d6ad43 22%,
            #8d651c 52%,
            #d1a83d 78%,
            #f6df81 100%) border-box;
    color: #fff0c2;
    box-shadow:
        inset 0 0 0 1px rgba(255, 226, 130, .64),
        inset 0 1px 0 rgba(255, 246, 204, .34),
        inset 0 -2px 0 rgba(76, 45, 12, .48);
    filter: drop-shadow(3px 3px 0 rgba(14, 18, 12, .72));
    text-shadow: 1px 2px 0 rgba(30, 20, 6, .88);
    transform: translateY(-1px);
}

:root[data-theme="terraria"] .account-select__button.is-active::before,
:root[data-theme="terraria"] .account-select__button.is-active::after {
    background:
        radial-gradient(circle at 50% 5px,
            #fff3b1 0 1px,
            #d4ad4f 1.2px 2.2px,
            #8b641e 2.4px 3.3px,
            #49320e 3.5px 4px,
            transparent 4.2px),
        radial-gradient(circle at 50% calc(100% - 5px),
            #fff3b1 0 1px,
            #d4ad4f 1.2px 2.2px,
            #8b641e 2.4px 3.3px,
            #49320e 3.5px 4px,
            transparent 4.2px);
    filter: none;
}

:root[data-theme="terraria"] .box,
:root[data-theme="terraria"] .history-item,
:root[data-theme="terraria"] .article-block,
:root[data-theme="terraria"] .check-option,
:root[data-theme="terraria"] .image-preview,
:root[data-theme="terraria"] .converter-result {
    border-width: 2px;
    border-radius: 2px;
    box-shadow: inset 2px 2px 0 rgba(8, 18, 25, .24);
}

:root[data-theme="terraria"] .file-upload__box {
    position: relative;
    min-height: 64px;
    border: 6px solid transparent;
    border-image: none;
    border-radius: 0;
    background:
        linear-gradient(90deg, rgba(69, 103, 54, .08), transparent 18%, transparent 82%, rgba(69, 103, 54, .08)),
        var(--surface-soft);
    background-clip: padding-box;
    box-shadow: none;
    padding: 9px 14px;
    image-rendering: pixelated;
    transition: none;
}

:root[data-theme="terraria"] .file-upload__box::after {
    content: "";
    position: absolute;
    top: -10px;
    right: -10px;
    bottom: -38px;
    left: -10px;
    z-index: 3;
    background: url("terraria-file-upload-jungle.png?v=2") center top / 100% 100% no-repeat;
    image-rendering: pixelated;
    pointer-events: none;
}

:root[data-theme="terraria"] .file-upload:hover .file-upload__box {
    border-color: transparent;
    background:
        linear-gradient(90deg, rgba(69, 103, 54, .08), transparent 18%, transparent 82%, rgba(69, 103, 54, .08)),
        var(--surface-soft);
    box-shadow: none;
    filter: none;
    transform: none;
}

:root[data-theme="terraria"] .file-upload:hover .file-upload__icon,
:root[data-theme="terraria"] .file-upload:hover .file-upload__action,
:root[data-theme="terraria"] .file-upload:hover .file-upload__name {
    filter: none;
    transform: none;
}

:root[data-theme="terraria"] .file-upload input[type="file"]:focus-visible + .file-upload__box {
    border-color: transparent;
    box-shadow: 0 0 0 1px rgba(240, 204, 98, .62);
    filter: none;
}

:root[data-theme="terraria"] .file-upload.has-file .file-upload__box {
    border-color: transparent;
    box-shadow: none;
}

:root[data-theme="terraria"] .page-gar-tz .file-upload {
    width: min(100%, 440px);
    padding-bottom: 30px;
}

:root[data-theme="terraria"] .page-gar-tz .file-upload__box {
    margin-inline: 10px;
}

:root[data-theme="terraria"] .page-image-converter .image-dropzone__button {
    min-height: 46px;
    border-radius: 0;
    padding-inline: 28px;
}

:root[data-theme="terraria"] .page-image-converter .image-preview-grid {
    border: 4px solid transparent;
    border-image-source: url("terraria-field-frame.png?v=2");
    border-image-slice: 10;
    border-image-width: 8px;
    border-image-outset: 2px;
    border-image-repeat: stretch;
    border-radius: 2px;
    background: var(--panel-bg);
    box-shadow: 2px 3px 0 rgba(19, 11, 6, .34);
    image-rendering: pixelated;
}

:root[data-theme="terraria"] .page-image-converter .range-field strong {
    display: inline-block;
    min-width: 36px;
    color: #ffe6a0;
    text-align: center;
    text-shadow: 1px 2px 0 rgba(45, 24, 7, .82);
}

:root[data-theme="terraria"] .page-image-converter .range-field input[type="range"] {
    width: 100%;
    height: 32px;
    margin: 2px 0 0;
    border: 0;
    border-image: none;
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    box-shadow: none;
    filter: none;
    cursor: ew-resize;
}

:root[data-theme="terraria"] .page-image-converter .range-field input[type="range"]::-webkit-slider-runnable-track {
    height: 12px;
    border: 3px solid #555a58;
    border-radius: 2px;
    background:
        repeating-linear-gradient(90deg, rgba(255, 225, 166, .08) 0 2px, transparent 2px 12px),
        linear-gradient(180deg, #8a603c 0%, #5a371f 45%, #342015 52%, #694329 100%);
    box-shadow:
        inset 0 2px 0 rgba(255, 221, 160, .16),
        inset 0 -2px 0 rgba(20, 11, 5, .52),
        2px 3px 0 rgba(13, 10, 7, .48);
}

:root[data-theme="terraria"] .page-image-converter .range-field input[type="range"]::-webkit-slider-thumb {
    width: 24px;
    height: 28px;
    margin-top: -11px;
    border: 4px solid #72501a;
    border-radius: 2px;
    appearance: none;
    -webkit-appearance: none;
    background:
        radial-gradient(circle at 50% 50%, #fff1a0 0 2px, #c9972f 3px 6px, transparent 7px),
        linear-gradient(135deg, #ffe58a 0%, #b98220 48%, #6e4912 52%, #d1a23a 100%);
    box-shadow:
        inset 2px 2px 0 rgba(255, 245, 183, .42),
        inset -2px -2px 0 rgba(74, 45, 10, .56),
        2px 3px 0 rgba(15, 10, 5, .56);
    image-rendering: pixelated;
}

:root[data-theme="terraria"] .page-image-converter .range-field input[type="range"]::-moz-range-track {
    height: 8px;
    border: 3px solid #555a58;
    border-radius: 2px;
    background:
        repeating-linear-gradient(90deg, rgba(255, 225, 166, .08) 0 2px, transparent 2px 12px),
        linear-gradient(180deg, #8a603c 0%, #5a371f 45%, #342015 52%, #694329 100%);
    box-shadow:
        inset 0 2px 0 rgba(255, 221, 160, .16),
        inset 0 -2px 0 rgba(20, 11, 5, .52),
        2px 3px 0 rgba(13, 10, 7, .48);
}

:root[data-theme="terraria"] .page-image-converter .range-field input[type="range"]::-moz-range-thumb {
    width: 18px;
    height: 22px;
    border: 4px solid #72501a;
    border-radius: 2px;
    background:
        radial-gradient(circle at 50% 50%, #fff1a0 0 2px, #c9972f 3px 6px, transparent 7px),
        linear-gradient(135deg, #ffe58a 0%, #b98220 48%, #6e4912 52%, #d1a23a 100%);
    box-shadow:
        inset 2px 2px 0 rgba(255, 245, 183, .42),
        inset -2px -2px 0 rgba(74, 45, 10, .56),
        2px 3px 0 rgba(15, 10, 5, .56);
}

:root[data-theme="terraria"] .page-image-converter .range-field input[type="range"]:focus-visible {
    outline: 2px solid #d2aa42;
    outline-offset: 3px;
}

:root[data-theme="terraria"] .check-option,
:root[data-theme="terraria"] .transliteration-checkbox {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 48px;
    border: 4px solid transparent;
    border-radius: 0;
    background:
        repeating-linear-gradient(0deg,
            rgba(255, 222, 160, .06) 0 1px,
            rgba(42, 21, 8, .08) 1px 3px,
            transparent 3px 7px) padding-box,
        linear-gradient(180deg, #68452d 0%, #4e301d 48%, #322015 51%, #5b3923 55%, #3b2518 100%) padding-box,
        linear-gradient(180deg, #d8d2bd 0%, #92938a 22%, #505553 52%, #8d8e84 78%, #d0c8b2 100%) border-box;
    clip-path: polygon(
        7px 0,
        calc(100% - 7px) 0,
        100% 7px,
        100% calc(100% - 7px),
        calc(100% - 7px) 100%,
        7px 100%,
        0 calc(100% - 7px),
        0 7px
    );
    box-shadow:
        inset 0 1px 0 rgba(255, 225, 170, .14),
        inset 0 -2px 0 rgba(21, 11, 5, .48);
    filter: drop-shadow(2px 3px 0 rgba(14, 18, 12, .58));
    transition: none;
}

:root[data-theme="terraria"] .check-option::before,
:root[data-theme="terraria"] .check-option::after,
:root[data-theme="terraria"] .transliteration-checkbox::before,
:root[data-theme="terraria"] .transliteration-checkbox::after {
    content: "";
    position: absolute;
    top: 1px;
    bottom: 1px;
    z-index: 0;
    width: 9px;
    background:
        radial-gradient(circle at 50% 5px,
            #eee7d1 0 1px,
            #aaa99e 1.2px 2.2px,
            #555a58 2.4px 3.3px,
            #252a29 3.5px 4px,
            transparent 4.2px),
        radial-gradient(circle at 50% calc(100% - 5px),
            #eee7d1 0 1px,
            #aaa99e 1.2px 2.2px,
            #555a58 2.4px 3.3px,
            #252a29 3.5px 4px,
            transparent 4.2px);
    pointer-events: none;
}

:root[data-theme="terraria"] .check-option::before,
:root[data-theme="terraria"] .transliteration-checkbox::before { left: 1px; }

:root[data-theme="terraria"] .check-option::after,
:root[data-theme="terraria"] .transliteration-checkbox::after { right: 1px; }

:root[data-theme="terraria"] .check-option:hover,
:root[data-theme="terraria"] .transliteration-checkbox:hover {
    border-color: transparent;
    background:
        repeating-linear-gradient(0deg,
            rgba(255, 230, 174, .08) 0 1px,
            rgba(42, 21, 8, .07) 1px 3px,
            transparent 3px 7px) padding-box,
        linear-gradient(180deg, #745038 0%, #593822 48%, #382318 51%, #654029 55%, #432a1b 100%) padding-box,
        linear-gradient(180deg, #e4deca 0%, #a0a198 22%, #5c615f 52%, #999a90 78%, #ddd5bf 100%) border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 230, 180, .18),
        inset 0 -2px 0 rgba(21, 11, 5, .44);
    filter: drop-shadow(2px 3px 0 rgba(14, 18, 12, .58));
}

:root[data-theme="terraria"] .check-option:has(input:checked),
:root[data-theme="terraria"] .transliteration-checkbox:has(input:checked) {
    background:
        repeating-linear-gradient(0deg,
            rgba(255, 240, 194, .11) 0 1px,
            rgba(73, 39, 13, .06) 1px 3px,
            transparent 3px 7px) padding-box,
        linear-gradient(180deg, #a77d52 0%, #825a38 48%, #5b3b22 51%, #916440 55%, #624129 100%) padding-box,
        linear-gradient(180deg, #fff0a3 0%, #d6ad43 22%, #8d651c 52%, #d1a83d 78%, #f6df81 100%) border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 246, 204, .28),
        inset 0 -2px 0 rgba(76, 45, 12, .44);
}

:root[data-theme="terraria"] .check-option input[type="checkbox"],
:root[data-theme="terraria"] .transliteration-checkbox input[type="checkbox"] {
    position: relative;
    z-index: 1;
    width: 20px;
    min-width: 20px;
    height: 20px;
    margin: 0;
    padding: 0;
    border: 3px solid #8f9189;
    border-radius: 2px;
    appearance: none;
    -webkit-appearance: none;
    background: linear-gradient(135deg, #25302d, #111917);
    box-shadow:
        inset 2px 2px 0 rgba(0, 0, 0, .36),
        1px 2px 0 rgba(18, 10, 5, .40);
    cursor: pointer;
}

:root[data-theme="terraria"] .check-option input[type="checkbox"]::after,
:root[data-theme="terraria"] .transliteration-checkbox input[type="checkbox"]::after {
    content: "";
    position: absolute;
    left: 4px;
    top: 1px;
    width: 5px;
    height: 9px;
    border: solid #3b2308;
    border-width: 0 3px 3px 0;
    opacity: 0;
    transform: rotate(45deg) scale(.6);
    transform-origin: 50% 50%;
}

:root[data-theme="terraria"] .check-option input[type="checkbox"]:checked,
:root[data-theme="terraria"] .transliteration-checkbox input[type="checkbox"]:checked {
    border-color: #8b641e;
    background: linear-gradient(135deg, #ffe58a 0%, #d3a23a 48%, #9a6c1b 52%, #efcb62 100%);
    box-shadow:
        inset 1px 1px 0 rgba(255, 248, 198, .52),
        inset -1px -1px 0 rgba(90, 55, 10, .42),
        1px 2px 0 rgba(18, 10, 5, .40);
}

:root[data-theme="terraria"] .check-option input[type="checkbox"]:checked::after,
:root[data-theme="terraria"] .transliteration-checkbox input[type="checkbox"]:checked::after {
    opacity: 1;
    transform: rotate(45deg) scale(1);
}

:root[data-theme="terraria"] .check-option input[type="checkbox"]:focus-visible,
:root[data-theme="terraria"] .transliteration-checkbox input[type="checkbox"]:focus-visible {
    outline: 2px solid #f0cc62;
    outline-offset: 2px;
}

:root[data-theme="terraria"] .check-option span,
:root[data-theme="terraria"] .transliteration-checkbox span {
    position: relative;
    z-index: 1;
    color: #ffe7ad;
    font-family: Consolas, "Courier New", monospace;
    font-weight: 800;
    text-shadow: 1px 2px 0 rgba(22, 11, 5, .82);
}

@keyframes terrariaMagicCirclePulse {
    0%, 100% {
        filter:
            drop-shadow(0 0 1px rgba(255, 65, 18, .95))
            drop-shadow(0 0 4px rgba(255, 74, 18, .78))
            drop-shadow(0 0 8px rgba(255, 38, 10, .42));
    }
    50% {
        filter:
            drop-shadow(0 0 2px rgba(255, 226, 112, 1))
            drop-shadow(0 0 7px rgba(255, 84, 18, .96))
            drop-shadow(0 0 13px rgba(255, 35, 8, .66));
    }
}

:root[data-theme="terraria"] .check-option input[type="checkbox"],
:root[data-theme="terraria"] .transliteration-checkbox input[type="checkbox"] {
    width: 32px;
    min-width: 32px;
    height: 32px;
    border: 0;
    border-radius: 0;
    background: #f1efe6;
    box-shadow: none;
    filter: none;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='16' cy='16' r='14.2' stroke-width='1.5'/%3E%3Ccircle cx='16' cy='16' r='11.3' stroke-width='1'/%3E%3Ccircle cx='16' cy='16' r='3.2' stroke-width='1'/%3E%3Cpath d='M16 4.7 23.1 26.1 4.7 12.9H27.3L8.9 26.1 16 4.7Z' stroke-width='1.2'/%3E%3Cpath d='M16 1.8v2M16 28.2v2M1.8 16h2M28.2 16h2' stroke-width='1.5'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='16' cy='16' r='14.2' stroke-width='1.5'/%3E%3Ccircle cx='16' cy='16' r='11.3' stroke-width='1'/%3E%3Ccircle cx='16' cy='16' r='3.2' stroke-width='1'/%3E%3Cpath d='M16 4.7 23.1 26.1 4.7 12.9H27.3L8.9 26.1 16 4.7Z' stroke-width='1.2'/%3E%3Cpath d='M16 1.8v2M16 28.2v2M1.8 16h2M28.2 16h2' stroke-width='1.5'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
}

:root[data-theme="terraria"] .check-option input[type="checkbox"]::after,
:root[data-theme="terraria"] .transliteration-checkbox input[type="checkbox"]::after {
    content: none;
}

:root[data-theme="terraria"] .check-option input[type="checkbox"]:checked,
:root[data-theme="terraria"] .transliteration-checkbox input[type="checkbox"]:checked {
    border: 0;
    background: #ff4a18;
    box-shadow: none;
    animation: terrariaMagicCirclePulse 1.65s ease-in-out infinite;
}

:root[data-theme="terraria"] .check-option input[type="checkbox"]:focus-visible,
:root[data-theme="terraria"] .transliteration-checkbox input[type="checkbox"]:focus-visible {
    outline: 0;
    filter:
        drop-shadow(0 0 2px #ffe79a)
        drop-shadow(0 0 6px rgba(255, 90, 24, .88));
}

@media (prefers-reduced-motion: reduce) {
    :root[data-theme="terraria"] .check-option input[type="checkbox"]:checked,
    :root[data-theme="terraria"] .transliteration-checkbox input[type="checkbox"]:checked {
        animation: none;
        filter:
            drop-shadow(0 0 2px rgba(255, 226, 112, 1))
            drop-shadow(0 0 7px rgba(255, 84, 18, .9));
    }
}

:root[data-theme="terraria"] .check-option,
:root[data-theme="terraria"] .transliteration-checkbox {
    border: 4px solid transparent;
    background:
        linear-gradient(133deg, transparent 0 46%, rgba(157, 172, 174, .12) 47% 48%, transparent 49% 100%) 0 0 / 42px 34px padding-box,
        linear-gradient(27deg, transparent 0 45%, rgba(7, 11, 13, .34) 46% 48%, transparent 49% 100%) 9px 4px / 58px 42px padding-box,
        radial-gradient(circle at 18% 24%, rgba(176, 190, 190, .10) 0 1px, transparent 2px) 0 0 / 31px 27px padding-box,
        linear-gradient(180deg, #505b5e 0%, #394246 44%, #20272a 49%, #313a3d 55%, #252c2f 100%) padding-box,
        linear-gradient(180deg, #aab4b2 0%, #626d6d 22%, #293133 52%, #667171 78%, #9ca7a5 100%) border-box;
    box-shadow:
        inset 0 1px 0 rgba(210, 226, 224, .15),
        inset 0 -2px 0 rgba(5, 8, 9, .50),
        inset 2px 0 0 rgba(164, 178, 178, .06);
    filter: drop-shadow(2px 3px 0 rgba(8, 11, 11, .66));
}

:root[data-theme="terraria"] .check-option::before,
:root[data-theme="terraria"] .check-option::after,
:root[data-theme="terraria"] .transliteration-checkbox::before,
:root[data-theme="terraria"] .transliteration-checkbox::after {
    top: 50%;
    bottom: auto;
    width: 11px;
    height: 17px;
    background: linear-gradient(135deg, #c0c9c6 0%, #737e7d 42%, #30393a 54%, #87918f 100%);
    clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
    box-shadow: none;
    opacity: .88;
    transform: translateY(-50%);
}

:root[data-theme="terraria"] .check-option:hover,
:root[data-theme="terraria"] .transliteration-checkbox:hover {
    border-color: transparent;
    background:
        linear-gradient(133deg, transparent 0 46%, rgba(185, 200, 201, .15) 47% 48%, transparent 49% 100%) 0 0 / 42px 34px padding-box,
        linear-gradient(27deg, transparent 0 45%, rgba(7, 11, 13, .30) 46% 48%, transparent 49% 100%) 9px 4px / 58px 42px padding-box,
        radial-gradient(circle at 18% 24%, rgba(200, 214, 212, .12) 0 1px, transparent 2px) 0 0 / 31px 27px padding-box,
        linear-gradient(180deg, #596568 0%, #414b4e 44%, #252d30 49%, #394346 55%, #2b3336 100%) padding-box,
        linear-gradient(180deg, #bac4c1 0%, #707b7a 22%, #333c3e 52%, #747f7e 78%, #abb5b2 100%) border-box;
    box-shadow:
        inset 0 1px 0 rgba(220, 234, 232, .18),
        inset 0 -2px 0 rgba(5, 8, 9, .46),
        inset 2px 0 0 rgba(176, 190, 190, .07);
    filter: drop-shadow(2px 3px 0 rgba(8, 11, 11, .66));
}

:root[data-theme="terraria"] .check-option:has(input:checked),
:root[data-theme="terraria"] .transliteration-checkbox:has(input:checked) {
    background:
        linear-gradient(133deg, transparent 0 46%, rgba(255, 91, 30, .30) 47% 48%, transparent 49% 100%) 0 0 / 42px 34px padding-box,
        linear-gradient(27deg, transparent 0 45%, rgba(255, 177, 70, .16) 46% 48%, transparent 49% 100%) 9px 4px / 58px 42px padding-box,
        radial-gradient(circle at 18% 24%, rgba(255, 120, 42, .28) 0 1px, transparent 2px) 0 0 / 31px 27px padding-box,
        linear-gradient(180deg, #5b5e5d 0%, #414647 44%, #24292b 49%, #3e4242 55%, #2b3031 100%) padding-box,
        linear-gradient(180deg, #ffb14b 0%, #b65a20 24%, #5b2715 52%, #c86c27 78%, #ffc25b 100%) border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 205, 126, .18),
        inset 0 -2px 0 rgba(25, 8, 4, .52),
        inset 2px 0 0 rgba(255, 103, 34, .10);
    filter: drop-shadow(2px 3px 0 rgba(8, 11, 11, .68));
}

:root[data-theme="terraria"] .check-option:has(input:checked)::before,
:root[data-theme="terraria"] .check-option:has(input:checked)::after,
:root[data-theme="terraria"] .transliteration-checkbox:has(input:checked)::before,
:root[data-theme="terraria"] .transliteration-checkbox:has(input:checked)::after {
    background: linear-gradient(135deg, #ffd36d 0%, #d16b25 42%, #6f2a13 54%, #f29a3c 100%);
}

:root[data-theme="terraria"] .check-option span,
:root[data-theme="terraria"] .transliteration-checkbox span {
    color: #e8e4d2;
    text-shadow: 1px 2px 0 rgba(4, 7, 8, .88);
}

:root[data-theme="terraria"] .check-option,
:root[data-theme="terraria"] .transliteration-checkbox,
:root[data-theme="terraria"] .check-option:hover,
:root[data-theme="terraria"] .transliteration-checkbox:hover,
:root[data-theme="terraria"] .check-option:has(input:checked),
:root[data-theme="terraria"] .transliteration-checkbox:has(input:checked) {
    border: 0;
    border-radius: 0;
    background:
        linear-gradient(118deg, rgba(5, 8, 9, .18) 0 16%, transparent 16.5% 100%) padding-box,
        linear-gradient(242deg, transparent 0 84%, rgba(4, 7, 8, .24) 84.5% 100%) padding-box,
        repeating-linear-gradient(17deg, rgba(255, 255, 255, .012) 0 1px, rgba(0, 0, 0, .018) 1px 3px, transparent 3px 7px) padding-box,
        linear-gradient(180deg, #292f31 0%, #242a2c 48%, #1b2022 52%, #22282a 100%) padding-box;
    clip-path: polygon(
        16px 0,
        calc(100% - 16px) 0,
        100% 50%,
        calc(100% - 16px) 100%,
        16px 100%,
        0 50%
    );
    box-shadow:
        inset 0 -3px 0 rgba(3, 6, 7, .42),
        inset -10px 0 14px rgba(2, 5, 6, .12);
    filter: drop-shadow(3px 4px 0 rgba(5, 8, 9, .70));
}

:root[data-theme="terraria"] .check-option::before,
:root[data-theme="terraria"] .check-option::after,
:root[data-theme="terraria"] .transliteration-checkbox::before,
:root[data-theme="terraria"] .transliteration-checkbox::after,
:root[data-theme="terraria"] .check-option:has(input:checked)::before,
:root[data-theme="terraria"] .check-option:has(input:checked)::after,
:root[data-theme="terraria"] .transliteration-checkbox:has(input:checked)::before,
:root[data-theme="terraria"] .transliteration-checkbox:has(input:checked)::after {
    content: none;
}

:root[data-theme="terraria"] .theme-toggle {
    width: 42px;
    min-width: 42px;
    min-height: 42px;
    border: 2px solid var(--line);
    border-radius: 2px;
    background: var(--secondary-bg);
    box-shadow: 3px 3px 0 rgba(10, 14, 12, .62);
}

:root[data-theme="terraria"] .theme-toggle:hover,
:root[data-theme="terraria"] .theme-toggle:focus-visible {
    border-color: var(--accent);
    background: var(--secondary-hover);
    box-shadow: 2px 2px 0 rgba(10, 14, 12, .62);
    transform: translate(1px, 1px);
}

:root[data-theme="terraria"] .cat-secret-menu__surface {
    filter: drop-shadow(4px 5px 0 rgba(10, 14, 12, .62));
}

:root[data-theme="terraria"] .cat-secret-menu__surface-shape {
    stroke-width: 2;
}

:root[data-theme="terraria"] .cat-theme-option {
    border-radius: 2px;
    font-family: Consolas, "Courier New", monospace;
}

:root[data-theme="terraria"] .cat-theme-option:hover,
:root[data-theme="terraria"] .cat-theme-option:focus-visible,
:root[data-theme="terraria"] .cat-theme-option.is-active {
    box-shadow: inset 3px 0 0 var(--accent), 2px 2px 0 rgba(10, 14, 12, .42);
}

:root[data-theme="terraria"] .topbar,
:root[data-theme="terraria"] .tabs,
:root[data-theme="terraria"] form:not(.transliteration-form):not(.text-html-form),
:root[data-theme="terraria"] .panel,
:root[data-theme="terraria"] .transliteration-toolbar,
:root[data-theme="terraria"] .transliteration-column,
:root[data-theme="terraria"] .editor-pane {
    border: 2px solid var(--pixel-frame-dark);
    box-shadow:
        inset 0 0 0 1px rgba(240, 204, 98, .24),
        6px 7px 0 rgba(10, 8, 5, .60);
}

:root[data-theme="terraria"] .tabs,
:root[data-theme="terraria"] form:not(.transliteration-form):not(.text-html-form),
:root[data-theme="terraria"] .options-panel,
:root[data-theme="terraria"] .transliteration-toolbar,
:root[data-theme="terraria"] .transliteration-column,
:root[data-theme="terraria"] .editor-pane {
    position: relative;
}

:root[data-theme="terraria"] .topbar::after,
:root[data-theme="terraria"] .tabs::after,
:root[data-theme="terraria"] form:not(.transliteration-form):not(.text-html-form)::after,
:root[data-theme="terraria"] .panel::after,
:root[data-theme="terraria"] .transliteration-toolbar::after,
:root[data-theme="terraria"] .transliteration-column::after,
:root[data-theme="terraria"] .editor-pane::after {
    content: "";
    position: absolute;
    inset: -7px;
    z-index: 4;
    border: 12px solid transparent;
    border-image-source: url("terraria-ui-frame.png");
    border-image-slice: 24;
    border-image-width: 12px;
    border-image-outset: 0;
    border-image-repeat: stretch;
    pointer-events: none;
    background: none;
    image-rendering: pixelated;
    filter: drop-shadow(2px 3px 0 rgba(14, 9, 3, .58));
}

/* Theme-aware calendar */
.date-picker {
    position: relative;
    z-index: 1;
    width: 100%;
}

.date-picker.is-open { z-index: 180; }

.date-picker__input {
    padding-right: 50px;
    cursor: pointer;
}

.date-picker__input::-webkit-calendar-picker-indicator {
    width: 0;
    margin: 0;
    opacity: 0;
    pointer-events: none;
}

.date-picker .date-picker__toggle,
.date-picker .date-picker__nav,
.date-picker .date-picker__day,
.date-picker .date-picker__footer-button {
    border: 0;
    background: transparent;
    box-shadow: none;
    color: inherit;
    font: inherit;
    text-shadow: none;
    filter: none;
    clip-path: none;
    transform: none;
}

.date-picker .date-picker__toggle::before,
.date-picker .date-picker__toggle::after,
.date-picker .date-picker__nav::before,
.date-picker .date-picker__nav::after,
.date-picker .date-picker__day::before,
.date-picker .date-picker__day::after,
.date-picker .date-picker__footer-button::before,
.date-picker .date-picker__footer-button::after {
    content: none;
}

.date-picker .date-picker__toggle {
    position: absolute;
    top: 50%;
    right: 7px;
    z-index: 2;
    width: 36px;
    min-height: 36px;
    border-radius: 7px;
    padding: 0;
    color: var(--accent);
    translate: 0 -50%;
}

.date-picker .date-picker__toggle:hover,
.date-picker .date-picker__toggle:focus-visible,
.date-picker.is-open .date-picker__toggle {
    background: var(--accent-soft);
    color: var(--accent-gradient-hover);
}

.date-picker__toggle svg,
.date-picker__nav svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.date-picker__panel {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 190;
    width: min(336px, calc(100vw - 40px));
    border: 1px solid var(--line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    box-shadow: var(--shadow), 0 0 0 1px var(--accent-soft);
    padding: 12px;
    color: var(--text);
    backdrop-filter: blur(18px);
    transform-origin: top left;
    animation: datePickerOpen .16s ease-out both;
}

.date-picker__panel[hidden] { display: none; }

.date-picker__header,
.date-picker__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.date-picker__header {
    min-height: 44px;
    margin-bottom: 4px;
    padding: 0 4px 0 8px;
}

.date-picker__month {
    color: var(--text);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .01em;
}

.date-picker__navigation { display: flex; gap: 2px; }

.date-picker .date-picker__nav {
    width: 38px;
    min-height: 38px;
    border-radius: 9px;
    padding: 0;
    color: var(--muted);
}

.date-picker .date-picker__nav:hover,
.date-picker .date-picker__nav:focus-visible {
    background: var(--accent-soft);
    color: var(--accent);
}

.date-picker__weekdays,
.date-picker__days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.date-picker__weekdays {
    margin-bottom: 3px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-align: center;
    text-transform: uppercase;
}

.date-picker__weekdays span {
    display: grid;
    place-items: center;
    min-height: 30px;
}

.date-picker__days { gap: 2px; }

.date-picker .date-picker__day {
    position: relative;
    isolation: isolate;
    min-width: 0;
    min-height: 38px;
    border-radius: 9px;
    padding: 0;
    color: var(--text);
    font-size: 13px;
    font-weight: 700;
}

.date-picker .date-picker__day:hover:not(:disabled),
.date-picker .date-picker__day:focus-visible {
    background: var(--accent-soft);
    color: var(--accent-gradient-hover);
    outline: none;
    box-shadow: inset 0 0 0 1px var(--line);
}

.date-picker .date-picker__day.is-outside {
    color: var(--muted);
    opacity: .48;
}

.date-picker .date-picker__day.is-today::after {
    content: "";
    position: absolute;
    right: 50%;
    bottom: 5px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--accent-gradient-hover);
    translate: 50% 0;
}

.date-picker .date-picker__day.is-selected,
.date-picker .date-picker__day.is-selected:hover,
.date-picker .date-picker__day.is-selected:focus-visible {
    background: linear-gradient(135deg, var(--accent), var(--accent-gradient));
    color: var(--accent-contrast);
    box-shadow: var(--button-shadow);
}

.date-picker .date-picker__day.is-selected::after { background: currentColor; }

.date-picker .date-picker__day:disabled {
    opacity: .2;
    cursor: not-allowed;
}

.date-picker__footer {
    margin-top: 8px;
    border-top: 1px solid var(--line);
    padding: 9px 4px 0;
}

.date-picker .date-picker__footer-button {
    min-height: 34px;
    border-radius: 8px;
    padding: 0 9px;
    color: var(--accent);
    font-size: 12px;
    font-weight: 800;
}

.date-picker .date-picker__footer-button:hover,
.date-picker .date-picker__footer-button:focus-visible {
    background: var(--accent-soft);
    color: var(--accent-gradient-hover);
}

:root[data-theme="spring"] .date-picker__panel {
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 20px 52px rgba(70, 140, 190, .24), 0 0 0 1px rgba(255, 255, 255, .65);
}

:root[data-theme="terraria"] .date-picker__panel {
    width: min(276px, calc(100vw - 28px));
    border: 4px solid #20282d;
    border-radius: 0;
    border-image: none;
    background:
        radial-gradient(circle at 13% 18%, rgba(255, 255, 255, .10) 0 1px, transparent 1.4px),
        radial-gradient(circle at 78% 32%, rgba(12, 17, 20, .22) 0 1px, transparent 1.6px),
        radial-gradient(circle at 35% 76%, rgba(255, 255, 255, .07) 0 1px, transparent 1.5px),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, .025) 0 2px, transparent 2px 7px),
        linear-gradient(155deg, #5d6870 0%, #465159 42%, #343e45 100%);
    box-shadow:
        inset 0 0 0 2px #7f898f,
        inset 0 0 0 4px #30383e,
        inset 0 -5px 0 #252d32,
        3px 4px 0 rgba(9, 12, 11, .76),
        0 10px 22px rgba(5, 8, 9, .40);
    padding: 10px;
    color: #f4e5bd;
    font-family: Consolas, "Courier New", monospace;
    clip-path: polygon(7px 0, calc(100% - 7px) 0, 100% 7px, 100% calc(100% - 7px), calc(100% - 7px) 100%, 7px 100%, 0 calc(100% - 7px), 0 7px);
    image-rendering: pixelated;
}

:root[data-theme="terraria"] .date-picker__panel::before {
    content: "";
    position: absolute;
    inset: 4px;
    z-index: 0;
    border: 1px solid rgba(210, 219, 218, .22);
    box-shadow: inset 0 0 0 1px rgba(20, 27, 31, .65);
    pointer-events: none;
}

:root[data-theme="terraria"] .date-picker__header {
    min-height: 34px;
    margin-bottom: 1px;
    padding: 0 1px 0 5px;
}

:root[data-theme="terraria"] .date-picker__month {
    color: #fff0c4;
    font-size: 13px;
    letter-spacing: 0;
    text-shadow: 1px 2px 0 #20272c;
}

:root[data-theme="terraria"] .date-picker__navigation { gap: 4px; }

:root[data-theme="terraria"] .date-picker .date-picker__day,
:root[data-theme="terraria"] .date-picker .date-picker__nav,
:root[data-theme="terraria"] .date-picker .date-picker__footer-button,
:root[data-theme="terraria"] .date-picker .date-picker__toggle {
    border-radius: 0;
    font-family: Consolas, "Courier New", monospace;
}

/* Keep the calendar trigger inside the date field instead of the global button flow. */
:root[data-theme="terraria"] .date-picker .date-picker__toggle {
    position: absolute;
    top: 50%;
    right: 7px;
    bottom: auto;
    left: auto;
    z-index: 3;
    isolation: auto;
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
    overflow: hidden;
    border: 0;
    background: transparent;
    box-shadow: none;
    filter: none;
    clip-path: none;
    padding: 0;
    color: #f5dfac;
    text-shadow: none;
    translate: 0 -50%;
    transform: none;
}

:root[data-theme="terraria"] .date-picker .date-picker__toggle:hover,
:root[data-theme="terraria"] .date-picker .date-picker__toggle:focus-visible,
:root[data-theme="terraria"] .date-picker.is-open .date-picker__toggle {
    border: 0;
    background: rgba(169, 235, 112, .12);
    box-shadow: inset 0 0 0 1px rgba(169, 235, 112, .28);
    filter: none;
    color: #c9f591;
    translate: 0 -50%;
    transform: none;
}

:root[data-theme="terraria"] .date-picker .date-picker__toggle:active {
    box-shadow: inset 0 2px 4px rgba(9, 13, 15, .62);
    translate: 0 -50%;
    transform: none;
}

:root[data-theme="terraria"] .date-picker .date-picker__nav {
    width: 28px;
    min-height: 27px;
    border: 1px solid #20272c;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .14), transparent 42%),
        linear-gradient(155deg, #778189, #4a555c 64%, #353e44);
    box-shadow:
        inset 1px 1px 0 #a1a9ad,
        inset -2px -2px 0 #2a3237,
        0 2px 0 #1b2226;
    color: #f5dfac;
    padding: 0;
    text-shadow: 1px 1px 0 #20272c;
    clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% calc(100% - 5px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 5px), 0 5px);
}

:root[data-theme="terraria"] .date-picker__nav svg {
    width: 16px;
    height: 16px;
    stroke-width: 2.2;
}

:root[data-theme="terraria"] .date-picker__weekdays {
    margin-bottom: 3px;
    color: #a9eb70;
    font-size: 10px;
    letter-spacing: .03em;
    text-shadow: 1px 1px 0 #253026;
}

:root[data-theme="terraria"] .date-picker__weekdays span { min-height: 24px; }

:root[data-theme="terraria"] .date-picker__days { gap: 3px; }

:root[data-theme="terraria"] .date-picker .date-picker__day {
    min-height: 30px;
    border: 1px solid #1f272c;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .12), transparent 38%),
        linear-gradient(155deg, #7d878e 0%, #5b666d 38%, #424b52 72%, #343c42 100%);
    box-shadow:
        inset 1px 1px 0 #aeb6b8,
        inset -2px -2px 0 #293136,
        0 3px 0 #1c2327,
        0 4px 3px rgba(6, 9, 10, .48);
    color: #222b30;
    padding: 0;
    font-family: "China Numerals", Consolas, "Courier New", monospace;
    font-size: 16px;
    font-weight: 400;
    line-height: .9;
    text-shadow:
        1px 1px 0 rgba(218, 225, 222, .34),
        0 0 1px rgba(7, 10, 11, .82);
    clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% calc(100% - 5px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 5px), 0 5px);
    transform: translateY(0);
    transition: transform .09s ease, filter .09s ease, box-shadow .09s ease, color .09s ease;
}

:root[data-theme="terraria"] .date-picker .date-picker__day:hover:not(:disabled),
:root[data-theme="terraria"] .date-picker .date-picker__day:focus-visible {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .18), transparent 40%),
        linear-gradient(155deg, #929ca2 0%, #69747b 42%, #485259 100%);
    color: #20292e;
    box-shadow:
        inset 1px 1px 0 #c1c7c8,
        inset -2px -2px 0 #30383d,
        0 4px 0 #1c2327,
        0 5px 4px rgba(6, 9, 10, .54);
    text-shadow:
        1px 1px 0 rgba(233, 238, 233, .40),
        0 0 1px rgba(7, 10, 11, .86);
    transform: translateY(-1px);
}

:root[data-theme="terraria"] .date-picker .date-picker__day:active:not(:disabled) {
    box-shadow:
        inset 0 3px 5px rgba(9, 13, 15, .78),
        inset 1px 1px 0 #262e33,
        0 1px 0 #171c20;
    transform: translateY(3px);
}

:root[data-theme="terraria"] .date-picker .date-picker__day.is-outside {
    color: #9aa3a3;
    filter: brightness(.64) saturate(.55);
    opacity: .64;
}

:root[data-theme="terraria"] .date-picker .date-picker__day.is-selected,
:root[data-theme="terraria"] .date-picker .date-picker__day.is-selected:hover,
:root[data-theme="terraria"] .date-picker .date-picker__day.is-selected:focus-visible {
    border-color: #252c2a;
    background:
        linear-gradient(160deg, #3e4943 0%, #303a35 54%, #28312d 100%);
    color: #82ad62;
    box-shadow:
        inset 0 4px 7px rgba(7, 11, 9, .86),
        inset 2px 2px 0 #222a26,
        inset -1px -1px 0 #657068,
        0 1px 0 #151b18;
    text-shadow:
        -1px -1px 0 rgba(8, 13, 10, .88),
        1px 1px 0 rgba(204, 233, 186, .20);
    transform: translateY(3px);
}

:root[data-theme="terraria"] .date-picker .date-picker__day.is-today::after {
    right: 4px;
    bottom: 4px;
    width: 3px;
    height: 3px;
    background: #f0c35a;
    box-shadow: 0 0 0 1px #5a4318;
    translate: 0 0;
}

:root[data-theme="terraria"] .date-picker__footer {
    margin-top: 8px;
    border-top-color: #252d32;
    box-shadow: inset 0 1px 0 rgba(197, 207, 208, .18);
    padding: 8px 1px 1px;
}

:root[data-theme="terraria"] .date-picker .date-picker__footer-button {
    min-height: 28px;
    border: 1px solid #20272c;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .12), transparent 42%),
        linear-gradient(155deg, #747f86, #505a61 62%, #363f45);
    box-shadow:
        inset 1px 1px 0 #a9b1b3,
        inset -2px -2px 0 #293136,
        0 3px 0 #1b2226;
    color: #f7e6b9;
    padding: 0 8px;
    font-size: 10px;
    text-shadow: 1px 1px 0 #20272c;
    clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% calc(100% - 5px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 5px), 0 5px);
}

:root[data-theme="terraria"] .date-picker .date-picker__nav:hover,
:root[data-theme="terraria"] .date-picker .date-picker__nav:focus-visible,
:root[data-theme="terraria"] .date-picker .date-picker__footer-button:hover,
:root[data-theme="terraria"] .date-picker .date-picker__footer-button:focus-visible {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .18), transparent 42%),
        linear-gradient(155deg, #89939a, #5b666d 62%, #3d464c);
    color: #c9f591;
    box-shadow:
        inset 1px 1px 0 #bec5c6,
        inset -2px -2px 0 #30383d,
        0 3px 0 #1b2226;
    transform: translateY(-1px);
}

:root[data-theme="terraria"] .date-picker .date-picker__nav:active,
:root[data-theme="terraria"] .date-picker .date-picker__footer-button:active {
    box-shadow: inset 0 3px 5px rgba(9, 13, 15, .78), 0 1px 0 #171c20;
    transform: translateY(2px);
}

/* The global Terraria button frame adds riveted side plates via pseudo-elements. */
:root[data-theme="terraria"] .date-picker button::before,
:root[data-theme="terraria"] .date-picker button::after,
:root[data-theme="terraria"] .date-picker .date-picker__day.is-today::after,
:root[data-theme="terraria"] .date-picker .date-picker__day.is-selected::after {
    content: none !important;
    display: none !important;
    background: none !important;
    box-shadow: none !important;
}

@keyframes datePickerOpen {
    from { opacity: 0; transform: translateY(-5px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    .date-picker__panel { animation: none; }
}

@media (max-width: 960px) {
    .shell {
        grid-template-columns: 1fr;
        grid-template-areas:
            "topbar"
            "content";
    }

    .tabs {
        position: fixed;
    }

    .workspace,
    .page-site-generator .workspace,
    .page-text-html .workspace,
    .page-image-converter .workspace { grid-template-columns: 1fr; }
    .text-html-form,
    .editor-grid { grid-template-columns: 1fr; }
    .gluing-grid { grid-template-columns: 1fr; }
    .check-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .editor-pane { height: 720px; }
    .account-select__buttons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .panel { position: static; }
}

@media (max-width: 640px) {
    .shell {
        width: min(100% - 20px, 1360px);
        padding: 16px 0;
    }

    .grid { grid-template-columns: 1fr; }
    .check-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .options-panel__head { align-items: stretch; flex-direction: column; }
    .options-panel__head button { width: 100%; }
    .editor-pane { height: 620px; padding: 12px; }
    .account-select__buttons { grid-template-columns: 1fr; }
    .account-select__head { align-items: flex-start; flex-direction: column; }
    .domain-extraction-editor__head { align-items: flex-start; }
    .domain-extraction-editor textarea { min-height: 380px; }
    .domain-extraction-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }
    .domain-extraction-actions button { width: 100%; }
    .topbar { display: block; }
    .theme-cluster {
        justify-content: flex-end;
        margin-top: 12px;
    }
    .pixel-cat {
        width: 72px;
        height: 72px;
    }
    .pixel-cat__leap {
        width: 132px;
        height: 88px;
    }
    .cat-secret {
        width: 72px;
        height: 72px;
    }
    .form-toolbar,
    .section-head { display: grid; }
    .section-tools { justify-content: flex-start; }
    .transliteration-toolbar {
        align-items: stretch;
        flex-direction: column;
    }
    .transliteration-options { display: grid; }
    .transliteration-options select { min-width: 0; }
    .transliteration-domain-option { align-items: stretch; }
    .transliteration-column { height: 220px; }
}

:root[data-theme="terraria"] .menu-backdrop {
    inset: 0;
    width: auto;
    min-width: 0;
    min-height: 0;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: rgba(5, 12, 10, .68);
    box-shadow: none;
    clip-path: none;
}

:root[data-theme="terraria"] .menu-backdrop:hover,
:root[data-theme="terraria"] .menu-backdrop:focus {
    border: 0;
    background: rgba(5, 12, 10, .68);
    box-shadow: none;
    transform: none;
}

:root[data-theme="terraria"] .menu-backdrop::before,
:root[data-theme="terraria"] .menu-backdrop::after,
:root[data-theme="terraria"] .menu-toggle::before,
:root[data-theme="terraria"] .menu-toggle::after,
:root[data-theme="terraria"] .tabs__home::before,
:root[data-theme="terraria"] .tabs__home::after,
:root[data-theme="terraria"] .tabs__close::before,
:root[data-theme="terraria"] .tabs__close::after,
:root[data-theme="terraria"] .tab-group__summary::before,
:root[data-theme="terraria"] .tab-group__summary::after {
    content: none;
    display: none;
}

:root[data-theme="terraria"] .menu-toggle,
:root[data-theme="terraria"] .tabs__home,
:root[data-theme="terraria"] .tabs__close {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    border: 2px solid #6d4b2a;
    padding: 0;
    box-shadow: 2px 2px 0 rgba(16, 11, 8, .62);
    clip-path: none;
}

:root[data-theme="terraria"] .tab-group__summary {
    width: 100%;
    min-height: 44px;
    border: 0;
    padding: 9px 12px;
    box-shadow: none;
    clip-path: none;
}

/* Glass-neon theme */
:root[data-theme="glass-neon"] body {
    background-attachment: fixed;
}

:root[data-theme="glass-neon"] body::before {
    background:
        radial-gradient(circle at 7% 16%, rgba(42, 151, 255, .22), transparent 25%),
        radial-gradient(circle at 92% 23%, rgba(171, 63, 255, .23), transparent 27%),
        radial-gradient(circle at 91% 82%, rgba(255, 105, 34, .13), transparent 24%),
        radial-gradient(circle at 42% 100%, rgba(48, 255, 151, .14), transparent 30%);
    opacity: 1;
}

:root[data-theme="glass-neon"] body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(115deg, transparent 0 31%, rgba(44, 147, 255, .055) 39%, transparent 47%),
        linear-gradient(245deg, transparent 0 38%, rgba(184, 64, 255, .045) 46%, transparent 55%),
        radial-gradient(ellipse at 50% -12%, rgba(255, 255, 255, .085), transparent 42%);
    opacity: .9;
}

:root[data-theme="glass-neon"] h1,
:root[data-theme="glass-neon"] h2,
:root[data-theme="glass-neon"] h3,
:root[data-theme="glass-neon"] .tabs__title {
    text-shadow: 0 1px 0 rgba(255, 255, 255, .14), 0 0 22px rgba(145, 130, 255, .12);
}

:root[data-theme="glass-neon"] .topbar,
:root[data-theme="glass-neon"] .tabs,
:root[data-theme="glass-neon"] form:not(.transliteration-form):not(.text-html-form),
:root[data-theme="glass-neon"] .panel,
:root[data-theme="glass-neon"] .transliteration-toolbar,
:root[data-theme="glass-neon"] .transliteration-column,
:root[data-theme="glass-neon"] .editor-pane,
:root[data-theme="glass-neon"] .image-preview-grid,
:root[data-theme="glass-neon"] .image-settings-modal__dialog {
    border: 1px solid rgba(222, 229, 255, .23);
    border-radius: 22px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .095), rgba(255, 255, 255, .025) 42%, rgba(10, 12, 21, .58) 100%),
        var(--panel-bg);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .16),
        inset 0 -1px 0 rgba(142, 112, 255, .12),
        0 28px 70px rgba(0, 0, 0, .48),
        0 0 36px rgba(102, 94, 255, .10);
    backdrop-filter: blur(24px) saturate(138%);
}

:root[data-theme="glass-neon"] .topbar {
    border-color: rgba(231, 236, 255, .28);
    background:
        radial-gradient(circle at 4% 20%, rgba(48, 151, 255, .20), transparent 31%),
        radial-gradient(circle at 92% 30%, rgba(164, 58, 255, .22), transparent 32%),
        linear-gradient(145deg, rgba(255, 255, 255, .14), rgba(38, 41, 56, .33) 38%, rgba(6, 8, 15, .72)),
        var(--topbar-bg);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .20),
        0 28px 70px rgba(0, 0, 0, .48),
        -12px 0 42px rgba(31, 135, 255, .14),
        12px 0 46px rgba(158, 54, 255, .16);
}

:root[data-theme="glass-neon"] .tabs {
    border-right-color: rgba(221, 228, 255, .24);
    border-radius: 0 24px 24px 0;
    background:
        linear-gradient(150deg, rgba(255, 255, 255, .085), rgba(8, 10, 18, .82) 54%),
        var(--tabs-bg);
    box-shadow: 24px 0 70px rgba(0, 0, 0, .58), 0 0 38px rgba(120, 100, 255, .12);
    backdrop-filter: blur(28px) saturate(145%);
}

:root[data-theme="glass-neon"] .tabs__head {
    background: linear-gradient(180deg, rgba(17, 19, 29, .96) 68%, transparent);
}

:root[data-theme="glass-neon"] .tab-group,
:root[data-theme="glass-neon"] .history-panel {
    border-color: rgba(221, 228, 255, .18);
    border-radius: 16px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .065), rgba(255, 255, 255, .018)),
        rgba(12, 15, 24, .54);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 28px rgba(0, 0, 0, .24);
}

:root[data-theme="glass-neon"] .tab-group__summary,
:root[data-theme="glass-neon"] .history-panel__toggle {
    border-radius: 15px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(22, 26, 39, .42));
}

:root[data-theme="glass-neon"] .tab-group__summary:hover,
:root[data-theme="glass-neon"] .tab-group__summary:focus-visible,
:root[data-theme="glass-neon"] .history-panel__toggle:hover,
:root[data-theme="glass-neon"] .history-panel__toggle:focus-visible {
    background: linear-gradient(145deg, rgba(255, 255, 255, .12), rgba(128, 101, 255, .16));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 0 22px rgba(131, 105, 255, .13);
}

:root[data-theme="glass-neon"] .tab-group.is-open > .tab-group__summary {
    border-radius: 15px 15px 8px 8px;
}

:root[data-theme="glass-neon"] .tab {
    border: 1px solid transparent;
    border-radius: 12px;
    background: rgba(255, 255, 255, .035);
}

:root[data-theme="glass-neon"] .tab:hover,
:root[data-theme="glass-neon"] .tab:focus-visible {
    border-color: rgba(200, 211, 255, .22);
    background: linear-gradient(135deg, rgba(91, 165, 255, .12), rgba(142, 91, 255, .15));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .13), 0 0 20px rgba(111, 117, 255, .15);
}

:root[data-theme="glass-neon"] .tab.active {
    border-color: rgba(231, 226, 255, .38);
    background:
        radial-gradient(circle at 15% 0%, rgba(255, 255, 255, .24), transparent 36%),
        linear-gradient(145deg, rgba(88, 151, 255, .28), rgba(136, 79, 255, .52) 64%, rgba(194, 94, 255, .30));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .48),
        inset 0 -10px 18px rgba(103, 54, 212, .22),
        0 0 0 1px rgba(214, 199, 255, .20),
        0 0 26px rgba(145, 90, 255, .36);
}

:root[data-theme="glass-neon"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
:root[data-theme="glass-neon"] textarea,
:root[data-theme="glass-neon"] select:not(.animated-select__native),
:root[data-theme="glass-neon"] .CodeMirror,
:root[data-theme="glass-neon"] .rich-editor {
    border-color: rgba(211, 221, 255, .22);
    border-radius: 14px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .015)),
        rgba(7, 10, 18, .58);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .10),
        inset 0 -12px 28px rgba(64, 72, 116, .07),
        0 8px 22px rgba(0, 0, 0, .20);
    backdrop-filter: blur(14px);
}

:root[data-theme="glass-neon"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):hover,
:root[data-theme="glass-neon"] textarea:hover,
:root[data-theme="glass-neon"] select:not(.animated-select__native):hover {
    border-color: rgba(196, 207, 255, .32);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .075), rgba(109, 94, 179, .055)),
        rgba(11, 14, 24, .68);
}

:root[data-theme="glass-neon"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
:root[data-theme="glass-neon"] textarea:focus,
:root[data-theme="glass-neon"] select:not(.animated-select__native):focus,
:root[data-theme="glass-neon"] .CodeMirror.CodeMirror-focused,
:root[data-theme="glass-neon"] .rich-editor:focus {
    border-color: rgba(175, 169, 255, .68);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .085), rgba(118, 94, 203, .07)),
        rgba(10, 13, 23, .76);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .16),
        0 0 0 3px rgba(134, 121, 255, .13),
        0 0 24px rgba(126, 105, 255, .24);
}

:root[data-theme="glass-neon"] button:where(
    :not(.pixel-cat)
    :not(.cat-secret-menu__toggle)
    :not(.cat-theme-option)
    :not(.theme-toggle)
    :not(.menu-toggle)
    :not(.tabs__close)
    :not(.menu-backdrop)
    :not(.animated-select__trigger)
    :not(.animated-select__option)
    :not(.date-picker__toggle)
    :not(.date-picker__nav)
    :not(.date-picker__day)
    :not(.date-picker__footer-button)
),
:root[data-theme="glass-neon"] .button {
    border: 1px solid rgba(226, 221, 255, .30);
    border-radius: 14px;
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .30), transparent 38%),
        linear-gradient(145deg, rgba(113, 169, 255, .28), rgba(128, 89, 255, .42) 58%, rgba(179, 82, 255, .24));
    color: #ffffff;
    box-shadow: var(--button-shadow);
    text-shadow: 0 1px 2px rgba(0, 0, 0, .34);
    backdrop-filter: blur(16px) saturate(145%);
}

:root[data-theme="glass-neon"] button:where(
    :not(.pixel-cat)
    :not(.cat-secret-menu__toggle)
    :not(.cat-theme-option)
    :not(.theme-toggle)
    :not(.menu-toggle)
    :not(.tabs__close)
    :not(.menu-backdrop)
    :not(.animated-select__trigger)
    :not(.animated-select__option)
    :not(.date-picker__toggle)
    :not(.date-picker__nav)
    :not(.date-picker__day)
    :not(.date-picker__footer-button)
):hover,
:root[data-theme="glass-neon"] .button:hover {
    border-color: rgba(239, 234, 255, .48);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .40), transparent 40%),
        linear-gradient(145deg, rgba(123, 183, 255, .36), rgba(145, 104, 255, .54) 58%, rgba(196, 96, 255, .32));
    box-shadow: var(--button-shadow-hover);
    transform: translateY(-1px);
}

:root[data-theme="glass-neon"] button:where(
    :not(.pixel-cat)
    :not(.cat-secret-menu__toggle)
    :not(.cat-theme-option)
    :not(.theme-toggle)
    :not(.menu-toggle)
    :not(.tabs__close)
    :not(.menu-backdrop)
    :not(.animated-select__trigger)
    :not(.animated-select__option)
    :not(.date-picker__toggle)
    :not(.date-picker__nav)
    :not(.date-picker__day)
    :not(.date-picker__footer-button)
):active,
:root[data-theme="glass-neon"] .button:active {
    transform: translateY(1px) scale(.995);
}

:root[data-theme="glass-neon"] .button.secondary,
:root[data-theme="glass-neon"] button.secondary {
    border-color: rgba(186, 211, 255, .26);
    background:
        radial-gradient(circle at 16% 0%, rgba(255, 255, 255, .22), transparent 38%),
        linear-gradient(145deg, rgba(76, 151, 217, .18), rgba(32, 42, 63, .52));
    color: #dceaff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .25),
        inset 0 -10px 20px rgba(73, 142, 218, .08),
        0 0 0 1px rgba(159, 205, 255, .08),
        0 0 20px rgba(75, 156, 255, .12),
        0 12px 26px rgba(0, 0, 0, .30);
}

:root[data-theme="glass-neon"] .button.secondary:hover,
:root[data-theme="glass-neon"] button.secondary:hover {
    border-color: rgba(202, 220, 255, .40);
    background:
        radial-gradient(circle at 16% 0%, rgba(255, 255, 255, .30), transparent 40%),
        linear-gradient(145deg, rgba(84, 166, 240, .26), rgba(59, 56, 102, .54));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .34),
        0 0 26px rgba(88, 166, 255, .20),
        0 14px 30px rgba(0, 0, 0, .34);
}

:root[data-theme="glass-neon"] button.button-green,
:root[data-theme="glass-neon"] .button.button-green {
    border-color: rgba(205, 255, 233, .34);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .34), transparent 40%),
        linear-gradient(145deg, rgba(101, 207, 178, .24), rgba(62, 139, 111, .42) 62%, rgba(125, 255, 196, .20));
    color: #f4fff9;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .44),
        inset 0 -12px 22px rgba(50, 151, 111, .16),
        0 0 0 1px rgba(178, 255, 220, .16),
        0 0 27px rgba(101, 255, 191, .26),
        0 14px 32px rgba(0, 0, 0, .38);
}

:root[data-theme="glass-neon"] button.button-green:hover,
:root[data-theme="glass-neon"] .button.button-green:hover {
    border-color: rgba(220, 255, 239, .52);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .44), transparent 40%),
        linear-gradient(145deg, rgba(116, 231, 198, .34), rgba(69, 160, 126, .52) 62%, rgba(143, 255, 207, .28));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .52),
        0 0 38px rgba(100, 255, 192, .38),
        0 16px 36px rgba(0, 0, 0, .42);
}

:root[data-theme="glass-neon"] button.danger {
    border-color: rgba(255, 183, 205, .30);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .25), transparent 38%),
        linear-gradient(145deg, rgba(255, 116, 155, .18), rgba(127, 49, 79, .42));
    color: #ffdce8;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 0 24px rgba(255, 91, 143, .16);
}

:root[data-theme="glass-neon"] .page-site-generator .generator-create-button {
    border-color: rgba(235, 216, 255, .38);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .36), transparent 40%),
        linear-gradient(145deg, rgba(121, 153, 255, .26), rgba(151, 83, 255, .50) 62%, rgba(216, 92, 255, .27));
    color: #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .48),
        inset 0 -12px 22px rgba(132, 62, 218, .20),
        0 0 0 1px rgba(225, 204, 255, .18),
        0 0 30px rgba(171, 91, 255, .34),
        0 14px 32px rgba(0, 0, 0, .40);
}

:root[data-theme="glass-neon"] .page-site-generator .generator-create-button:hover,
:root[data-theme="glass-neon"] .page-site-generator .generator-create-button:focus-visible {
    border-color: rgba(243, 228, 255, .55);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .46), transparent 40%),
        linear-gradient(145deg, rgba(136, 174, 255, .34), rgba(169, 100, 255, .60) 62%, rgba(226, 108, 255, .34));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .56),
        0 0 42px rgba(177, 99, 255, .45),
        0 16px 36px rgba(0, 0, 0, .44);
}

:root[data-theme="glass-neon"] .page-site-generator .generator-deploy-button {
    border-color: rgba(204, 255, 232, .38);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .37), transparent 40%),
        linear-gradient(145deg, rgba(107, 224, 191, .26), rgba(53, 154, 112, .48) 62%, rgba(119, 255, 190, .24));
    color: #f4fff9;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .48),
        inset 0 -12px 22px rgba(38, 137, 97, .18),
        0 0 0 1px rgba(181, 255, 220, .17),
        0 0 30px rgba(95, 255, 187, .30),
        0 14px 32px rgba(0, 0, 0, .40);
}

:root[data-theme="glass-neon"] .page-site-generator .generator-deploy-button:hover,
:root[data-theme="glass-neon"] .page-site-generator .generator-deploy-button:focus-visible {
    border-color: rgba(219, 255, 239, .56);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .47), transparent 40%),
        linear-gradient(145deg, rgba(125, 240, 207, .36), rgba(63, 176, 127, .58) 62%, rgba(139, 255, 204, .32));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .57),
        0 0 42px rgba(98, 255, 190, .42),
        0 16px 36px rgba(0, 0, 0, .44);
}

:root[data-theme="glass-neon"] .account-select__button {
    border-color: rgba(201, 214, 255, .20);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .065), rgba(255, 255, 255, .018)),
        rgba(9, 12, 20, .58);
    color: #e6ebff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), 0 10px 24px rgba(0, 0, 0, .22);
}

:root[data-theme="glass-neon"] .account-select__button:hover {
    border-color: rgba(187, 181, 255, .42);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .10), rgba(132, 101, 224, .10)),
        rgba(12, 15, 25, .68);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 0 23px rgba(128, 105, 255, .15);
}

:root[data-theme="glass-neon"] .account-select__button.is-active {
    border-color: rgba(167, 255, 214, .46);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .22), transparent 38%),
        linear-gradient(145deg, rgba(94, 219, 181, .17), rgba(43, 116, 90, .34));
    color: #effff8;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .30),
        inset 0 -10px 18px rgba(46, 153, 113, .11),
        0 0 0 1px rgba(161, 255, 211, .15),
        0 0 28px rgba(88, 255, 184, .28);
}

:root[data-theme="glass-neon"] .menu-toggle,
:root[data-theme="glass-neon"] .tabs__home,
:root[data-theme="glass-neon"] .tabs__close,
:root[data-theme="glass-neon"] .theme-toggle {
    border: 1px solid rgba(215, 225, 255, .26);
    background:
        radial-gradient(circle at 24% 12%, rgba(255, 255, 255, .26), transparent 34%),
        linear-gradient(145deg, rgba(95, 160, 226, .14), rgba(126, 84, 224, .18));
    color: #dce7ff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .32),
        inset 0 -8px 15px rgba(94, 69, 188, .10),
        0 0 18px rgba(111, 128, 255, .13);
    backdrop-filter: blur(14px);
}

:root[data-theme="glass-neon"] .menu-toggle:hover,
:root[data-theme="glass-neon"] .menu-toggle:focus-visible,
:root[data-theme="glass-neon"] .tabs__home:hover,
:root[data-theme="glass-neon"] .tabs__home:focus-visible,
:root[data-theme="glass-neon"] .tabs__close:hover,
:root[data-theme="glass-neon"] .tabs__close:focus-visible,
:root[data-theme="glass-neon"] .theme-toggle:hover,
:root[data-theme="glass-neon"] .theme-toggle:focus-visible {
    border-color: rgba(226, 221, 255, .48);
    background:
        radial-gradient(circle at 24% 12%, rgba(255, 255, 255, .36), transparent 36%),
        linear-gradient(145deg, rgba(104, 173, 245, .23), rgba(145, 96, 255, .30));
    color: #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .42),
        0 0 28px rgba(131, 103, 255, .28);
}

:root[data-theme="glass-neon"] .animated-select__trigger,
:root[data-theme="glass-neon"] .animated-select__panel {
    border-color: rgba(211, 221, 255, .23);
    border-radius: 14px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .018)),
        rgba(8, 11, 19, .80);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .12),
        0 18px 38px rgba(0, 0, 0, .40),
        0 0 26px rgba(117, 98, 255, .13);
    backdrop-filter: blur(22px) saturate(145%);
}

:root[data-theme="glass-neon"] .animated-select__trigger:hover,
:root[data-theme="glass-neon"] .animated-select__trigger:focus-visible,
:root[data-theme="glass-neon"] .animated-select.is-open .animated-select__trigger {
    border-color: rgba(178, 171, 255, .58);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .11), rgba(130, 102, 223, .10)),
        rgba(11, 14, 23, .86);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .18),
        0 0 0 3px rgba(136, 121, 255, .12),
        0 0 25px rgba(131, 107, 255, .22);
}

:root[data-theme="glass-neon"] .animated-select__option {
    border-radius: 10px;
}

:root[data-theme="glass-neon"] .animated-select__option:hover,
:root[data-theme="glass-neon"] .animated-select__option:focus-visible {
    border-color: rgba(201, 211, 255, .24);
    background: linear-gradient(135deg, rgba(88, 160, 255, .12), rgba(145, 91, 255, .15));
}

:root[data-theme="glass-neon"] .animated-select__option.is-selected {
    border-color: rgba(192, 179, 255, .44);
    background:
        radial-gradient(circle at 12% 0%, rgba(255, 255, 255, .16), transparent 34%),
        linear-gradient(135deg, rgba(88, 159, 255, .17), rgba(143, 88, 255, .24));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 18px rgba(130, 102, 255, .12);
}

:root[data-theme="glass-neon"] .check-option,
:root[data-theme="glass-neon"] .transliteration-checkbox,
:root[data-theme="glass-neon"] .box,
:root[data-theme="glass-neon"] .history-item,
:root[data-theme="glass-neon"] .article-block,
:root[data-theme="glass-neon"] .converter-result,
:root[data-theme="glass-neon"] .image-preview,
:root[data-theme="glass-neon"] .gluing-card {
    border-color: rgba(210, 220, 255, .19);
    border-radius: 14px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .014)),
        rgba(10, 13, 22, .54);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 10px 24px rgba(0, 0, 0, .18);
    backdrop-filter: blur(14px);
}

:root[data-theme="glass-neon"] .check-option:hover,
:root[data-theme="glass-neon"] .transliteration-checkbox:hover,
:root[data-theme="glass-neon"] .history-item:hover {
    border-color: rgba(176, 170, 255, .46);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(126, 99, 216, .09)),
        rgba(13, 16, 27, .66);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .14),
        0 0 0 3px rgba(130, 115, 255, .08),
        0 0 22px rgba(126, 103, 255, .13);
}

:root[data-theme="glass-neon"] .check-option input[type="checkbox"],
:root[data-theme="glass-neon"] .transliteration-checkbox input[type="checkbox"] {
    accent-color: #9d82ff;
    filter: drop-shadow(0 0 6px rgba(147, 117, 255, .46));
}

:root[data-theme="glass-neon"] .file-upload__box {
    border-color: rgba(207, 219, 255, .23);
    border-radius: 16px;
    background:
        radial-gradient(circle at 6% 0%, rgba(255, 255, 255, .10), transparent 30%),
        linear-gradient(145deg, rgba(93, 164, 239, .08), rgba(132, 86, 225, .075)),
        rgba(9, 12, 20, .62);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .11), 0 12px 28px rgba(0, 0, 0, .22);
    backdrop-filter: blur(16px);
}

:root[data-theme="glass-neon"] .file-upload:hover .file-upload__box,
:root[data-theme="glass-neon"] .file-upload input[type="file"]:focus-visible + .file-upload__box,
:root[data-theme="glass-neon"] .file-upload.has-file .file-upload__box {
    border-color: rgba(178, 170, 255, .54);
    background:
        radial-gradient(circle at 6% 0%, rgba(255, 255, 255, .16), transparent 32%),
        linear-gradient(145deg, rgba(96, 174, 250, .13), rgba(143, 91, 244, .13)),
        rgba(11, 14, 24, .70);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .17),
        0 0 0 3px rgba(131, 115, 255, .10),
        0 0 28px rgba(126, 103, 255, .18);
}

:root[data-theme="glass-neon"] .file-upload__icon {
    border: 1px solid rgba(205, 217, 255, .20);
    border-radius: 12px;
    background: linear-gradient(145deg, rgba(96, 174, 250, .14), rgba(144, 91, 245, .17));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .19), 0 0 18px rgba(118, 113, 255, .14);
}

:root[data-theme="glass-neon"] .date-picker__panel {
    border-color: rgba(218, 225, 255, .26);
    border-radius: 18px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .025)),
        rgba(9, 11, 19, .90);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .16),
        0 24px 54px rgba(0, 0, 0, .54),
        0 0 30px rgba(126, 103, 255, .17);
    backdrop-filter: blur(26px) saturate(145%);
}

:root[data-theme="glass-neon"] .date-picker .date-picker__day,
:root[data-theme="glass-neon"] .date-picker .date-picker__nav,
:root[data-theme="glass-neon"] .date-picker .date-picker__footer-button,
:root[data-theme="glass-neon"] .date-picker .date-picker__toggle {
    border-radius: 11px;
}

:root[data-theme="glass-neon"] .date-picker .date-picker__day:hover:not(:disabled),
:root[data-theme="glass-neon"] .date-picker .date-picker__day:focus-visible,
:root[data-theme="glass-neon"] .date-picker .date-picker__nav:hover,
:root[data-theme="glass-neon"] .date-picker .date-picker__nav:focus-visible,
:root[data-theme="glass-neon"] .date-picker .date-picker__footer-button:hover,
:root[data-theme="glass-neon"] .date-picker .date-picker__footer-button:focus-visible {
    background: linear-gradient(135deg, rgba(89, 160, 255, .14), rgba(146, 91, 255, .17));
    box-shadow: inset 0 0 0 1px rgba(209, 217, 255, .16), 0 0 16px rgba(128, 105, 255, .13);
}

:root[data-theme="glass-neon"] .date-picker .date-picker__day.is-selected,
:root[data-theme="glass-neon"] .date-picker .date-picker__day.is-selected:hover,
:root[data-theme="glass-neon"] .date-picker .date-picker__day.is-selected:focus-visible {
    border: 1px solid rgba(232, 226, 255, .36);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .27), transparent 38%),
        linear-gradient(145deg, rgba(96, 166, 255, .30), rgba(143, 90, 255, .52));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .44),
        0 0 24px rgba(139, 102, 255, .34);
}

:root[data-theme="glass-neon"] .cat-secret-menu__surface {
    filter: drop-shadow(0 16px 30px rgba(0, 0, 0, .48)) drop-shadow(0 0 20px rgba(129, 104, 255, .20));
}

:root[data-theme="glass-neon"] .cat-secret-menu__surface-shape {
    fill: rgba(10, 12, 20, .91);
    stroke: rgba(222, 228, 255, .30);
}

:root[data-theme="glass-neon"] .cat-theme-option {
    border-radius: 11px;
}

:root[data-theme="glass-neon"] .cat-theme-option:hover,
:root[data-theme="glass-neon"] .cat-theme-option:focus-visible,
:root[data-theme="glass-neon"] .cat-theme-option.is-active {
    border-color: rgba(193, 183, 255, .40);
    background: linear-gradient(135deg, rgba(91, 163, 255, .13), rgba(145, 91, 255, .17));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 18px rgba(128, 104, 255, .14);
}

:root[data-theme="glass-neon"] .menu-backdrop,
:root[data-theme="glass-neon"] .menu-backdrop:hover,
:root[data-theme="glass-neon"] .menu-backdrop:focus {
    background: rgba(1, 2, 6, .72);
    box-shadow: none;
    backdrop-filter: blur(7px);
}

:root[data-theme="glass-neon"] .netcat-article-status {
    border-color: rgba(198, 211, 255, .24);
    border-radius: 15px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .018)),
        rgba(8, 11, 19, .70);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .11), 0 14px 32px rgba(0, 0, 0, .30);
    backdrop-filter: blur(18px);
}

:root[data-theme="glass-neon"] .netcat-article-status.is-success {
    border-color: rgba(157, 255, 211, .34);
    background:
        linear-gradient(145deg, rgba(166, 255, 218, .09), rgba(255, 255, 255, .018)),
        rgba(8, 18, 15, .72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 26px rgba(98, 255, 190, .12);
}

:root[data-theme="glass-neon"] .netcat-article-status.is-error {
    border-color: rgba(255, 165, 193, .34);
    background:
        linear-gradient(145deg, rgba(255, 132, 171, .09), rgba(255, 255, 255, .018)),
        rgba(22, 8, 14, .72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .11), 0 0 26px rgba(255, 91, 143, .11);
}

:root[data-theme="glass-neon"] .workspace > form {
    background:
        radial-gradient(circle at 0 8%, rgba(32, 139, 255, .16), transparent 25%),
        radial-gradient(circle at 98% 30%, rgba(151, 48, 255, .14), transparent 27%),
        radial-gradient(circle at 95% 82%, rgba(255, 102, 28, .08), transparent 22%),
        radial-gradient(circle at 14% 100%, rgba(42, 235, 137, .08), transparent 24%),
        linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(9, 12, 23, .76));
}

:root[data-theme="glass-neon"] .workspace > .panel {
    background:
        radial-gradient(circle at 90% 8%, rgba(163, 55, 255, .19), transparent 34%),
        radial-gradient(circle at 10% 82%, rgba(255, 110, 32, .10), transparent 31%),
        linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(9, 11, 21, .78));
}

:root[data-theme="glass-neon"] .netcat-article-section {
    border-color: rgba(209, 218, 255, .27);
    border-radius: 17px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .015)),
        rgba(10, 13, 24, .62);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), 0 12px 28px rgba(0, 0, 0, .20);
}

:root[data-theme="glass-neon"] .netcat-article-section:nth-of-type(4n + 1) {
    border-color: rgba(76, 164, 255, .38);
    background:
        radial-gradient(circle at 0 0, rgba(35, 141, 255, .18), transparent 34%),
        linear-gradient(145deg, rgba(255, 255, 255, .07), rgba(9, 14, 27, .72));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 26px rgba(31, 132, 255, .10);
}

:root[data-theme="glass-neon"] .netcat-article-section:nth-of-type(4n + 1) .netcat-article-section__title {
    color: #7ac2ff;
}

:root[data-theme="glass-neon"] .netcat-article-section:nth-of-type(4n + 2) {
    border-color: rgba(171, 89, 255, .40);
    background:
        radial-gradient(circle at 100% 0, rgba(154, 52, 255, .19), transparent 36%),
        linear-gradient(145deg, rgba(255, 255, 255, .07), rgba(17, 9, 29, .72));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 28px rgba(151, 48, 255, .11);
}

:root[data-theme="glass-neon"] .netcat-article-section:nth-of-type(4n + 2) .netcat-article-section__title {
    color: #c18cff;
}

:root[data-theme="glass-neon"] .netcat-article-section:nth-of-type(4n + 3) {
    border-color: rgba(255, 130, 49, .38);
    background:
        radial-gradient(circle at 100% 0, rgba(255, 101, 24, .17), transparent 36%),
        linear-gradient(145deg, rgba(255, 255, 255, .07), rgba(27, 13, 8, .70));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 27px rgba(255, 93, 20, .09);
}

:root[data-theme="glass-neon"] .netcat-article-section:nth-of-type(4n + 3) .netcat-article-section__title {
    color: #ffad70;
}

:root[data-theme="glass-neon"] .netcat-article-section:nth-of-type(4n) {
    border-color: rgba(73, 224, 137, .36);
    background:
        radial-gradient(circle at 0 0, rgba(39, 213, 121, .16), transparent 35%),
        linear-gradient(145deg, rgba(255, 255, 255, .07), rgba(7, 24, 17, .70));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 27px rgba(35, 213, 118, .09);
}

:root[data-theme="glass-neon"] .netcat-article-section:nth-of-type(4n) .netcat-article-section__title {
    color: #7de4a7;
}

:root[data-theme="glass-neon"] .tab-group:nth-child(4n + 1) > .tab-group__summary {
    border-left: 2px solid #399cff;
    color: #9acfff;
}

:root[data-theme="glass-neon"] .tab-group:nth-child(4n + 2) > .tab-group__summary {
    border-left: 2px solid #a849ff;
    color: #d0a2ff;
}

:root[data-theme="glass-neon"] .tab-group:nth-child(4n + 3) > .tab-group__summary {
    border-left: 2px solid #ff792e;
    color: #ffb27d;
}

:root[data-theme="glass-neon"] .tab-group:nth-child(4n) > .tab-group__summary {
    border-left: 2px solid #38d77e;
    color: #8cebb3;
}

:root[data-theme="glass-neon"] button:where(
    :not(.pixel-cat)
    :not(.cat-secret-menu__toggle)
    :not(.cat-theme-option)
    :not(.theme-toggle)
    :not(.menu-toggle)
    :not(.tabs__close)
    :not(.menu-backdrop)
    :not(.animated-select__trigger)
    :not(.animated-select__option)
    :not(.date-picker__toggle)
    :not(.date-picker__nav)
    :not(.date-picker__day)
    :not(.date-picker__footer-button)
),
:root[data-theme="glass-neon"] .button {
    background:
        radial-gradient(circle at 17% 0%, rgba(255, 255, 255, .42), transparent 38%),
        linear-gradient(145deg, rgba(46, 145, 255, .48), rgba(130, 48, 255, .68) 58%, rgba(220, 46, 255, .38));
}

:root[data-theme="glass-neon"] button:where(
    :not(.pixel-cat)
    :not(.cat-secret-menu__toggle)
    :not(.cat-theme-option)
    :not(.theme-toggle)
    :not(.menu-toggle)
    :not(.tabs__close)
    :not(.menu-backdrop)
    :not(.animated-select__trigger)
    :not(.animated-select__option)
    :not(.date-picker__toggle)
    :not(.date-picker__nav)
    :not(.date-picker__day)
    :not(.date-picker__footer-button)
):hover,
:root[data-theme="glass-neon"] .button:hover {
    background:
        radial-gradient(circle at 17% 0%, rgba(255, 255, 255, .56), transparent 40%),
        linear-gradient(145deg, rgba(55, 163, 255, .60), rgba(151, 62, 255, .80) 58%, rgba(233, 61, 255, .48));
}

:root[data-theme="glass-neon"] .button.secondary,
:root[data-theme="glass-neon"] button.secondary {
    background:
        radial-gradient(circle at 15% 0%, rgba(255, 255, 255, .30), transparent 38%),
        linear-gradient(145deg, rgba(35, 142, 255, .34), rgba(24, 67, 128, .56) 66%, rgba(93, 54, 189, .35));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .35),
        inset 0 -11px 22px rgba(21, 92, 180, .16),
        0 0 0 1px rgba(138, 200, 255, .16),
        0 0 28px rgba(36, 140, 255, .27),
        0 13px 28px rgba(0, 0, 0, .34);
}

:root[data-theme="glass-neon"] button.button-green,
:root[data-theme="glass-neon"] .button.button-green {
    background:
        radial-gradient(circle at 17% 0%, rgba(255, 255, 255, .43), transparent 39%),
        linear-gradient(145deg, rgba(43, 229, 148, .42), rgba(25, 143, 88, .66) 62%, rgba(109, 255, 177, .34));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .52),
        inset 0 -13px 24px rgba(14, 119, 67, .22),
        0 0 0 1px rgba(159, 255, 207, .22),
        0 0 34px rgba(31, 228, 132, .40),
        0 15px 34px rgba(0, 0, 0, .42);
}

:root[data-theme="glass-neon"] button.danger {
    background:
        radial-gradient(circle at 17% 0%, rgba(255, 255, 255, .40), transparent 39%),
        linear-gradient(145deg, rgba(255, 137, 37, .44), rgba(214, 64, 42, .62) 62%, rgba(255, 74, 125, .33));
    color: #fff4ed;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .48),
        inset 0 -12px 22px rgba(178, 42, 28, .22),
        0 0 0 1px rgba(255, 196, 143, .20),
        0 0 32px rgba(255, 91, 34, .35),
        0 14px 32px rgba(0, 0, 0, .40);
}

:root[data-theme="glass-neon"] .history-panel__count {
    background: linear-gradient(145deg, rgba(157, 63, 255, .46), rgba(91, 46, 209, .62));
    color: #f7eaff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .30), 0 0 17px rgba(151, 55, 255, .32);
}

/* Liquid Glass layer */
:root[data-theme="glass-neon"] {
    --liquid-white: rgba(244, 248, 255, .78);
    --liquid-edge: rgba(213, 226, 255, .52);
    --liquid-inner-edge: rgba(255, 255, 255, .22);
    --liquid-dark-edge: rgba(34, 40, 69, .82);
}

:root[data-theme="glass-neon"] .topbar,
:root[data-theme="glass-neon"] .tabs,
:root[data-theme="glass-neon"] form:not(.transliteration-form):not(.text-html-form),
:root[data-theme="glass-neon"] .panel,
:root[data-theme="glass-neon"] .transliteration-toolbar,
:root[data-theme="glass-neon"] .transliteration-column,
:root[data-theme="glass-neon"] .editor-pane,
:root[data-theme="glass-neon"] .image-preview-grid,
:root[data-theme="glass-neon"] .image-settings-modal__dialog {
    border-width: 2px;
    border-color: rgba(211, 222, 255, .40);
    background-clip: padding-box;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .13),
        inset 0 3px 3px rgba(255, 255, 255, .17),
        inset 0 -7px 14px rgba(77, 67, 144, .15),
        0 2px 0 rgba(255, 255, 255, .10),
        0 30px 72px rgba(0, 0, 0, .58),
        0 0 44px rgba(111, 74, 255, .18);
}

:root[data-theme="glass-neon"] .topbar {
    border-radius: 28px;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .16),
        inset 0 4px 4px rgba(255, 255, 255, .20),
        inset 0 -9px 17px rgba(91, 50, 160, .16),
        -16px 8px 48px rgba(30, 138, 255, .20),
        16px 10px 52px rgba(164, 51, 255, .22),
        0 30px 68px rgba(0, 0, 0, .54);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary,
        .account-select__button
    ),
    .button
) {
    --liquid-a: rgba(38, 142, 255, .72);
    --liquid-b: rgba(126, 44, 255, .80);
    --liquid-c: rgba(221, 47, 255, .52);
    --liquid-glow: rgba(143, 66, 255, .58);
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 48px;
    border: 2px solid rgba(224, 223, 255, .56);
    border-radius: 999px;
    background:
        radial-gradient(ellipse at 23% 3%, rgba(255, 255, 255, .62), transparent 34%),
        radial-gradient(ellipse at 76% 106%, var(--liquid-c), transparent 48%),
        linear-gradient(160deg, var(--liquid-a), var(--liquid-b) 58%, rgba(20, 18, 39, .84));
    background-clip: padding-box;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .24),
        inset 0 4px 5px rgba(255, 255, 255, .34),
        inset 0 -8px 12px rgba(18, 15, 40, .46),
        inset 0 -15px 26px color-mix(in srgb, var(--liquid-c) 44%, transparent),
        0 2px 0 rgba(255, 255, 255, .15),
        0 9px 0 rgba(8, 8, 17, .30),
        0 18px 30px rgba(0, 0, 0, .46),
        0 0 34px var(--liquid-glow);
    color: #ffffff;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .58);
    transform: translateZ(0);
    transition:
        transform .22s cubic-bezier(.2, .8, .2, 1),
        border-color .22s ease,
        box-shadow .24s ease,
        filter .24s ease;
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary,
        .account-select__button
    ),
    .button
)::before {
    content: "";
    position: absolute;
    top: -48%;
    bottom: -48%;
    left: -54%;
    z-index: 0;
    width: 34%;
    border-radius: 50%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .50), transparent);
    filter: blur(5px);
    pointer-events: none;
    rotate: 18deg;
    transform: translateX(0);
    opacity: 0;
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary,
        .account-select__button
    ),
    .button
)::after {
    content: "";
    position: absolute;
    right: 13%;
    bottom: 2px;
    left: 13%;
    z-index: -1;
    height: 5px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, var(--liquid-c), transparent);
    box-shadow: 0 0 11px var(--liquid-c), 0 4px 17px var(--liquid-glow);
    pointer-events: none;
    opacity: .92;
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary,
        .account-select__button
    ),
    .button
):hover {
    border-color: rgba(244, 240, 255, .78);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .32),
        inset 0 5px 6px rgba(255, 255, 255, .43),
        inset 0 -9px 14px rgba(18, 15, 40, .48),
        inset 0 -17px 29px color-mix(in srgb, var(--liquid-c) 54%, transparent),
        0 2px 0 rgba(255, 255, 255, .20),
        0 10px 0 rgba(8, 8, 17, .28),
        0 22px 38px rgba(0, 0, 0, .50),
        0 0 48px var(--liquid-glow);
    filter: saturate(1.18) brightness(1.08);
    transform: translateY(-2px) scale(1.008);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary,
        .account-select__button
    ),
    .button
):hover::before {
    animation: liquidGlassSweep .82s cubic-bezier(.2, .72, .2, 1);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary,
        .account-select__button
    ),
    .button
):active {
    transform: translateY(2px) scale(.992);
    box-shadow:
        inset 0 2px 10px rgba(0, 0, 0, .34),
        inset 0 -7px 15px color-mix(in srgb, var(--liquid-c) 38%, transparent),
        0 2px 0 rgba(255, 255, 255, .10),
        0 5px 0 rgba(7, 7, 14, .34),
        0 10px 20px rgba(0, 0, 0, .40),
        0 0 26px var(--liquid-glow);
}

:root[data-theme="glass-neon"] :is(.button.secondary, button.secondary) {
    --liquid-a: rgba(29, 146, 255, .66);
    --liquid-b: rgba(29, 83, 182, .72);
    --liquid-c: rgba(49, 202, 255, .58);
    --liquid-glow: rgba(28, 151, 255, .52);
}

:root[data-theme="glass-neon"] :is(button.button-green, .button.button-green, .generator-deploy-button) {
    --liquid-a: rgba(33, 229, 143, .64);
    --liquid-b: rgba(19, 130, 76, .76);
    --liquid-c: rgba(78, 255, 166, .62);
    --liquid-glow: rgba(29, 232, 130, .50);
}

:root[data-theme="glass-neon"] :is(button.danger, .button.danger) {
    --liquid-a: rgba(255, 146, 31, .70);
    --liquid-b: rgba(208, 58, 36, .78);
    --liquid-c: rgba(255, 72, 119, .60);
    --liquid-glow: rgba(255, 88, 33, .50);
}

:root[data-theme="glass-neon"] .page-site-generator .generator-create-button,
:root[data-theme="glass-neon"] .page-site-generator .generator-deploy-button {
    background:
        radial-gradient(ellipse at 23% 3%, rgba(255, 255, 255, .62), transparent 34%),
        radial-gradient(ellipse at 76% 106%, var(--liquid-c), transparent 48%),
        linear-gradient(160deg, var(--liquid-a), var(--liquid-b) 58%, rgba(20, 18, 39, .84));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .24),
        inset 0 4px 5px rgba(255, 255, 255, .34),
        inset 0 -8px 12px rgba(18, 15, 40, .46),
        inset 0 -15px 26px color-mix(in srgb, var(--liquid-c) 44%, transparent),
        0 2px 0 rgba(255, 255, 255, .15),
        0 9px 0 rgba(8, 8, 17, .30),
        0 18px 30px rgba(0, 0, 0, .46),
        0 0 34px var(--liquid-glow);
}

:root[data-theme="glass-neon"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
:root[data-theme="glass-neon"] textarea,
:root[data-theme="glass-neon"] select:not(.animated-select__native),
:root[data-theme="glass-neon"] .animated-select__trigger,
:root[data-theme="glass-neon"] .CodeMirror,
:root[data-theme="glass-neon"] .rich-editor {
    border-width: 2px;
    border-color: rgba(204, 219, 255, .42);
    border-radius: 20px;
    background:
        radial-gradient(ellipse at 18% -8%, rgba(255, 255, 255, .13), transparent 34%),
        linear-gradient(160deg, rgba(18, 24, 40, .78), rgba(6, 8, 15, .82));
    background-clip: padding-box;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .10),
        inset 0 4px 5px rgba(255, 255, 255, .10),
        inset 0 -7px 12px rgba(55, 58, 103, .13),
        0 2px 0 rgba(255, 255, 255, .07),
        0 9px 20px rgba(0, 0, 0, .26),
        0 0 20px rgba(60, 138, 255, .10);
}

:root[data-theme="glass-neon"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
:root[data-theme="glass-neon"] textarea:focus,
:root[data-theme="glass-neon"] select:not(.animated-select__native):focus,
:root[data-theme="glass-neon"] .animated-select.is-open .animated-select__trigger,
:root[data-theme="glass-neon"] .CodeMirror.CodeMirror-focused,
:root[data-theme="glass-neon"] .rich-editor:focus {
    border-color: rgba(200, 186, 255, .72);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .18),
        inset 0 5px 6px rgba(255, 255, 255, .14),
        inset 0 -8px 14px rgba(112, 62, 207, .15),
        0 2px 0 rgba(255, 255, 255, .10),
        0 0 0 4px rgba(132, 91, 255, .13),
        0 0 32px rgba(126, 76, 255, .28);
}

:root[data-theme="glass-neon"] .animated-select__panel,
:root[data-theme="glass-neon"] .date-picker__panel {
    border-width: 2px;
    border-color: rgba(215, 226, 255, .46);
    border-radius: 22px;
    background:
        radial-gradient(ellipse at 20% 0, rgba(255, 255, 255, .15), transparent 32%),
        linear-gradient(155deg, rgba(23, 27, 44, .94), rgba(6, 8, 15, .95));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .13),
        inset 0 4px 5px rgba(255, 255, 255, .14),
        inset 0 -9px 16px rgba(83, 52, 151, .16),
        0 3px 0 rgba(255, 255, 255, .08),
        0 24px 48px rgba(0, 0, 0, .54),
        0 0 38px rgba(126, 75, 255, .23);
}

:root[data-theme="glass-neon"] .check-option,
:root[data-theme="glass-neon"] .transliteration-checkbox,
:root[data-theme="glass-neon"] .history-item,
:root[data-theme="glass-neon"] .article-block,
:root[data-theme="glass-neon"] .converter-result,
:root[data-theme="glass-neon"] .image-preview,
:root[data-theme="glass-neon"] .gluing-card,
:root[data-theme="glass-neon"] .file-upload__box {
    border-width: 2px;
    border-color: rgba(206, 220, 255, .38);
    border-radius: 20px;
    background:
        radial-gradient(ellipse at 18% 0, rgba(255, 255, 255, .13), transparent 35%),
        linear-gradient(155deg, rgba(28, 34, 53, .72), rgba(7, 9, 17, .72));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .10),
        inset 0 4px 5px rgba(255, 255, 255, .12),
        inset 0 -7px 13px rgba(69, 63, 127, .13),
        0 2px 0 rgba(255, 255, 255, .07),
        0 12px 24px rgba(0, 0, 0, .30);
}

:root[data-theme="glass-neon"] .check-option:hover,
:root[data-theme="glass-neon"] .transliteration-checkbox:hover,
:root[data-theme="glass-neon"] .history-item:hover,
:root[data-theme="glass-neon"] .file-upload:hover .file-upload__box {
    border-color: rgba(198, 181, 255, .64);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .17),
        inset 0 5px 6px rgba(255, 255, 255, .17),
        inset 0 -8px 14px rgba(116, 63, 218, .17),
        0 2px 0 rgba(255, 255, 255, .10),
        0 15px 28px rgba(0, 0, 0, .34),
        0 0 30px rgba(132, 80, 255, .22);
}

:root[data-theme="glass-neon"] .check-option input[type="checkbox"],
:root[data-theme="glass-neon"] .transliteration-checkbox input[type="checkbox"] {
    position: relative;
    display: inline-grid;
    flex: 0 0 25px;
    width: 25px;
    min-width: 25px;
    height: 25px;
    margin: 0;
    appearance: none;
    place-items: center;
    border: 2px solid rgba(207, 221, 255, .55);
    border-radius: 50%;
    background:
        radial-gradient(circle at 28% 14%, rgba(255, 255, 255, .24), transparent 34%),
        linear-gradient(145deg, rgba(39, 50, 78, .84), rgba(8, 10, 18, .88));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .10),
        inset 0 3px 4px rgba(255, 255, 255, .14),
        inset 0 -5px 8px rgba(45, 42, 82, .24),
        0 5px 10px rgba(0, 0, 0, .30),
        0 0 13px rgba(74, 147, 255, .15);
}

:root[data-theme="glass-neon"] .check-option input[type="checkbox"]::after,
:root[data-theme="glass-neon"] .transliteration-checkbox input[type="checkbox"]::after {
    content: none;
    display: none;
}

:root[data-theme="glass-neon"] .check-option input[type="checkbox"]:checked,
:root[data-theme="glass-neon"] .transliteration-checkbox input[type="checkbox"]:checked {
    border-color: rgba(190, 255, 222, .74);
    background:
        radial-gradient(circle at 28% 12%, rgba(255, 255, 255, .44), transparent 34%),
        linear-gradient(145deg, rgba(50, 232, 151, .84), rgba(29, 126, 76, .92));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .44),
        inset 0 -6px 9px rgba(10, 94, 54, .28),
        0 6px 12px rgba(0, 0, 0, .28),
        0 0 20px rgba(44, 238, 143, .52);
}

:root[data-theme="glass-neon"] .check-option input[type="checkbox"]:checked::after,
:root[data-theme="glass-neon"] .transliteration-checkbox input[type="checkbox"]:checked::after {
    content: none;
    display: none;
}

:root[data-theme="glass-neon"] .gluing-mode-switch__track {
    border: 2px solid rgba(201, 217, 255, .52);
    background:
        radial-gradient(ellipse at 25% 0, rgba(255, 255, 255, .18), transparent 38%),
        linear-gradient(145deg, rgba(33, 42, 67, .86), rgba(7, 9, 16, .90));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .10),
        inset 0 5px 8px rgba(0, 0, 0, .38),
        0 6px 14px rgba(0, 0, 0, .32);
}

:root[data-theme="glass-neon"] .gluing-mode-switch__thumb {
    border: 1px solid rgba(255, 255, 255, .70);
    background:
        radial-gradient(circle at 30% 22%, white, rgba(231, 235, 255, .84) 35%, rgba(137, 150, 198, .82) 100%);
    box-shadow:
        inset 0 1px 2px white,
        0 3px 8px rgba(0, 0, 0, .40),
        0 0 14px rgba(132, 152, 255, .42);
}

:root[data-theme="glass-neon"] .gluing-mode-switch input:checked + .gluing-mode-switch__track {
    border-color: rgba(170, 166, 255, .76);
    background:
        radial-gradient(ellipse at 70% 0, rgba(255, 255, 255, .25), transparent 40%),
        linear-gradient(145deg, rgba(36, 98, 255, .88), rgba(111, 45, 225, .92));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .18),
        inset 0 5px 9px rgba(16, 23, 87, .36),
        0 0 25px rgba(88, 82, 255, .54);
}

:root[data-theme="glass-neon"] .tab-group,
:root[data-theme="glass-neon"] .history-panel,
:root[data-theme="glass-neon"] .netcat-article-section {
    border-width: 2px;
    border-radius: 21px;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .10),
        inset 0 3px 4px rgba(255, 255, 255, .11),
        inset 0 -7px 13px rgba(62, 55, 116, .12),
        0 3px 0 rgba(255, 255, 255, .05),
        0 14px 28px rgba(0, 0, 0, .30);
}

:root[data-theme="glass-neon"] .tab-group__summary,
:root[data-theme="glass-neon"] .history-panel__toggle {
    border-radius: 18px;
    background:
        radial-gradient(ellipse at 20% 0, rgba(255, 255, 255, .16), transparent 35%),
        linear-gradient(155deg, rgba(33, 39, 59, .80), rgba(9, 11, 20, .78));
    box-shadow: inset 0 3px 4px rgba(255, 255, 255, .10), inset 0 -6px 10px rgba(45, 43, 82, .13);
}

:root[data-theme="glass-neon"] .tab {
    border: 1px solid rgba(205, 218, 255, .20);
    border-radius: 15px;
    background:
        radial-gradient(ellipse at 18% 0, rgba(255, 255, 255, .12), transparent 36%),
        linear-gradient(150deg, rgba(31, 38, 58, .72), rgba(8, 10, 18, .76));
    box-shadow: inset 0 2px 3px rgba(255, 255, 255, .08), 0 7px 14px rgba(0, 0, 0, .20);
}

:root[data-theme="glass-neon"] .tab.active {
    border-width: 2px;
    border-color: rgba(228, 217, 255, .68);
    border-radius: 17px;
    background:
        radial-gradient(ellipse at 20% 0, rgba(255, 255, 255, .48), transparent 36%),
        radial-gradient(ellipse at 76% 105%, rgba(219, 52, 255, .50), transparent 47%),
        linear-gradient(155deg, rgba(38, 139, 255, .66), rgba(126, 42, 255, .78) 62%, rgba(21, 16, 42, .90));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .22),
        inset 0 4px 5px rgba(255, 255, 255, .30),
        inset 0 -10px 16px rgba(82, 25, 164, .30),
        0 2px 0 rgba(255, 255, 255, .12),
        0 8px 0 rgba(9, 8, 18, .24),
        0 15px 28px rgba(0, 0, 0, .38),
        0 0 32px rgba(139, 57, 255, .46);
}

:root[data-theme="glass-neon"] .account-select__button {
    border-width: 2px;
    border-radius: 999px;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .10),
        inset 0 3px 4px rgba(255, 255, 255, .12),
        inset 0 -6px 10px rgba(52, 52, 96, .15),
        0 8px 16px rgba(0, 0, 0, .26);
}

:root[data-theme="glass-neon"] .account-select__button.is-active {
    border-color: rgba(174, 255, 217, .70);
    background:
        radial-gradient(ellipse at 22% 0, rgba(255, 255, 255, .42), transparent 36%),
        radial-gradient(ellipse at 72% 108%, rgba(70, 255, 165, .45), transparent 48%),
        linear-gradient(155deg, rgba(34, 211, 132, .68), rgba(20, 112, 68, .86));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .20),
        inset 0 4px 5px rgba(255, 255, 255, .28),
        inset 0 -9px 15px rgba(10, 88, 49, .28),
        0 2px 0 rgba(255, 255, 255, .11),
        0 8px 0 rgba(8, 18, 12, .25),
        0 15px 26px rgba(0, 0, 0, .34),
        0 0 30px rgba(36, 225, 132, .46);
}

:root[data-theme="glass-neon"] :is(button, .button):disabled,
:root[data-theme="glass-neon"] :is(button, .button)[aria-disabled="true"],
:root[data-theme="glass-neon"] .animated-select__trigger:disabled {
    border-color: rgba(184, 197, 226, .28);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .14),
        inset 0 -6px 10px rgba(37, 39, 64, .20),
        0 6px 12px rgba(0, 0, 0, .24);
    cursor: not-allowed;
    filter: saturate(.42) brightness(.72);
    opacity: .54;
    transform: none;
}

:root[data-theme="glass-neon"] :is(button, .button):disabled::before,
:root[data-theme="glass-neon"] :is(button, .button):disabled::after,
:root[data-theme="glass-neon"] :is(button, .button)[aria-disabled="true"]::before,
:root[data-theme="glass-neon"] :is(button, .button)[aria-disabled="true"]::after {
    animation: none;
    opacity: .18;
}

:root[data-theme="glass-neon"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
    textarea,
    select
):disabled {
    filter: saturate(.48);
    opacity: .56;
}

@keyframes liquidGlassSweep {
    0% {
        opacity: 0;
        transform: translateX(0);
    }
    18% { opacity: .82; }
    82% { opacity: .55; }
    100% {
        opacity: 0;
        transform: translateX(520%);
    }
}

@media (prefers-reduced-motion: reduce) {
    :root[data-theme="glass-neon"] :is(button, .button)::before {
        animation: none !important;
    }
}

/* Refined Liquid Glass: dark optical glass with restrained chromatic refraction */
:root[data-theme="glass-neon"] {
    --lg-panel: rgba(8, 11, 19, .66);
    --lg-panel-deep: rgba(5, 7, 13, .78);
    --lg-line: rgba(230, 238, 255, .26);
    --lg-highlight: rgba(255, 255, 255, .54);
    --lg-shadow: rgba(0, 0, 0, .56);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

:root[data-theme="glass-neon"] .topbar,
:root[data-theme="glass-neon"] .tabs,
:root[data-theme="glass-neon"] form:not(.transliteration-form):not(.text-html-form),
:root[data-theme="glass-neon"] .panel,
:root[data-theme="glass-neon"] .transliteration-toolbar,
:root[data-theme="glass-neon"] .transliteration-column,
:root[data-theme="glass-neon"] .editor-pane,
:root[data-theme="glass-neon"] .image-preview-grid,
:root[data-theme="glass-neon"] .image-settings-modal__dialog {
    border: 1px solid transparent;
    background:
        radial-gradient(120% 90% at 12% -16%, rgba(255, 255, 255, .10), transparent 42%),
        linear-gradient(145deg, rgba(15, 19, 31, .70), rgba(5, 7, 13, .78)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .44), rgba(103, 164, 255, .14) 32%, rgba(209, 92, 255, .28) 68%, rgba(255, 255, 255, .12)) border-box;
    backdrop-filter: blur(28px) saturate(1.28);
    -webkit-backdrop-filter: blur(28px) saturate(1.28);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .14),
        inset 0 -1px 0 rgba(255, 255, 255, .035),
        0 24px 64px rgba(0, 0, 0, .42);
}

:root[data-theme="glass-neon"] .topbar {
    border-radius: 26px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .19),
        inset 0 -1px 0 rgba(255, 255, 255, .04),
        -24px 18px 70px rgba(24, 130, 255, .12),
        24px 20px 74px rgba(185, 55, 255, .13),
        0 28px 70px rgba(0, 0, 0, .48);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
) {
    --lg-accent: rgba(154, 91, 255, .86);
    --lg-accent-soft: rgba(201, 91, 255, .30);
    --lg-accent-faint: rgba(139, 74, 255, .12);
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 50px;
    padding-right: 25px;
    padding-left: 25px;
    border: 1px solid transparent;
    border-radius: 999px;
    background:
        radial-gradient(90% 105% at 50% -28%, rgba(255, 255, 255, .22), transparent 48%),
        radial-gradient(72% 100% at 78% 118%, var(--lg-accent-faint), transparent 62%),
        linear-gradient(180deg, rgba(22, 27, 39, .82), rgba(5, 7, 12, .91)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .68), rgba(255, 255, 255, .13) 24%, var(--lg-accent) 52%, rgba(255, 255, 255, .14) 75%, var(--lg-accent-soft)) border-box;
    background-clip: padding-box, padding-box, padding-box, border-box;
    color: rgba(255, 255, 255, .96);
    font-weight: 600;
    letter-spacing: -.01em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .72);
    backdrop-filter: blur(20px) saturate(1.22);
    -webkit-backdrop-filter: blur(20px) saturate(1.22);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .28),
        inset 0 -1px 0 rgba(255, 255, 255, .08),
        inset 14px 0 24px rgba(70, 154, 255, .045),
        inset -14px 0 25px var(--lg-accent-faint),
        0 1px 0 rgba(255, 255, 255, .09),
        0 13px 26px rgba(0, 0, 0, .42),
        0 18px 34px var(--lg-accent-faint);
    filter: none;
    transform: translateZ(0);
    transition:
        transform .32s cubic-bezier(.2, .8, .2, 1),
        box-shadow .34s ease,
        filter .34s ease;
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
)::before {
    content: "";
    position: absolute;
    top: 4px;
    right: 9px;
    left: 9px;
    z-index: -1;
    width: auto;
    height: 44%;
    border-top: 1px solid rgba(255, 255, 255, .54);
    border-radius: 999px 999px 54% 54%;
    background:
        linear-gradient(100deg, transparent 8%, rgba(255, 255, 255, .05) 28%, rgba(255, 255, 255, .20) 48%, rgba(255, 255, 255, .04) 70%, transparent 92%);
    filter: blur(.15px);
    opacity: .76;
    pointer-events: none;
    rotate: 0deg;
    transform: translateX(0);
    transition: opacity .34s ease, transform .55s cubic-bezier(.2, .75, .25, 1);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
)::after {
    content: "";
    position: absolute;
    right: 16%;
    bottom: 3px;
    left: 16%;
    z-index: -1;
    height: 1px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, var(--lg-accent), rgba(255, 255, 255, .70), var(--lg-accent), transparent);
    box-shadow: 0 3px 10px var(--lg-accent-soft);
    opacity: .78;
    pointer-events: none;
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
):hover {
    border-color: transparent;
    filter: brightness(1.10) saturate(1.08);
    transform: translateY(-2px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .36),
        inset 0 -1px 0 rgba(255, 255, 255, .10),
        inset 18px 0 30px rgba(66, 164, 255, .07),
        inset -18px 0 30px var(--lg-accent-faint),
        0 1px 0 rgba(255, 255, 255, .12),
        0 17px 32px rgba(0, 0, 0, .48),
        0 22px 42px var(--lg-accent-soft);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
):hover::before {
    animation: none;
    opacity: 1;
    transform: translateX(2.5%);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
):active {
    filter: brightness(.94);
    transform: translateY(1px);
    box-shadow:
        inset 0 3px 9px rgba(0, 0, 0, .42),
        inset 0 -1px 0 rgba(255, 255, 255, .08),
        0 7px 15px rgba(0, 0, 0, .38),
        0 10px 24px var(--lg-accent-faint);
}

:root[data-theme="glass-neon"] :is(.button.secondary, button.secondary) {
    --lg-accent: rgba(45, 183, 255, .90);
    --lg-accent-soft: rgba(35, 168, 255, .28);
    --lg-accent-faint: rgba(35, 143, 255, .11);
}

:root[data-theme="glass-neon"] :is(button.button-green, .button.button-green, .generator-deploy-button) {
    --lg-accent: rgba(61, 255, 176, .88);
    --lg-accent-soft: rgba(38, 227, 145, .26);
    --lg-accent-faint: rgba(38, 227, 145, .10);
}

:root[data-theme="glass-neon"] :is(button.danger, .button.danger) {
    --lg-accent: rgba(255, 126, 56, .92);
    --lg-accent-soft: rgba(255, 92, 45, .27);
    --lg-accent-faint: rgba(255, 92, 45, .11);
}

:root[data-theme="glass-neon"] :is(
    .button.secondary,
    button.secondary,
    .button.button-green,
    button.button-green,
    .button.danger,
    button.danger
) {
    border: 1px solid transparent;
    background:
        radial-gradient(90% 105% at 50% -28%, rgba(255, 255, 255, .22), transparent 48%),
        radial-gradient(72% 100% at 78% 118%, var(--lg-accent-faint), transparent 62%),
        linear-gradient(180deg, rgba(22, 27, 39, .82), rgba(5, 7, 12, .91)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .68), rgba(255, 255, 255, .13) 24%, var(--lg-accent) 52%, rgba(255, 255, 255, .14) 75%, var(--lg-accent-soft)) border-box;
    background-clip: padding-box, padding-box, padding-box, border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .28),
        inset 0 -1px 0 rgba(255, 255, 255, .08),
        inset 14px 0 24px rgba(70, 154, 255, .045),
        inset -14px 0 25px var(--lg-accent-faint),
        0 1px 0 rgba(255, 255, 255, .09),
        0 13px 26px rgba(0, 0, 0, .42),
        0 18px 34px var(--lg-accent-faint);
}

:root[data-theme="glass-neon"] .page-site-generator .generator-create-button,
:root[data-theme="glass-neon"] .page-site-generator .generator-deploy-button {
    border: 1px solid transparent;
    background:
        radial-gradient(90% 105% at 50% -28%, rgba(255, 255, 255, .22), transparent 48%),
        radial-gradient(72% 100% at 78% 118%, var(--lg-accent-faint), transparent 62%),
        linear-gradient(180deg, rgba(22, 27, 39, .82), rgba(5, 7, 12, .91)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .68), rgba(255, 255, 255, .13) 24%, var(--lg-accent) 52%, rgba(255, 255, 255, .14) 75%, var(--lg-accent-soft)) border-box;
    background-clip: padding-box, padding-box, padding-box, border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .28),
        inset 0 -1px 0 rgba(255, 255, 255, .08),
        inset 14px 0 24px rgba(70, 154, 255, .045),
        inset -14px 0 25px var(--lg-accent-faint),
        0 1px 0 rgba(255, 255, 255, .09),
        0 13px 26px rgba(0, 0, 0, .42),
        0 18px 34px var(--lg-accent-faint);
}

:root[data-theme="glass-neon"] .account-select__button {
    --lg-accent: rgba(154, 91, 255, .70);
    --lg-accent-soft: rgba(154, 91, 255, .20);
    --lg-accent-faint: rgba(154, 91, 255, .075);
    min-height: 50px;
    border: 1px solid transparent;
    border-radius: 999px;
    background:
        radial-gradient(90% 105% at 50% -30%, rgba(255, 255, 255, .18), transparent 48%),
        linear-gradient(180deg, rgba(21, 26, 38, .84), rgba(6, 8, 13, .92)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, .10) 42%, rgba(112, 129, 166, .28)) border-box;
    background-clip: padding-box, padding-box, border-box;
    color: rgba(238, 243, 255, .86);
    font-weight: 600;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .20),
        inset 0 -1px 0 rgba(255, 255, 255, .05),
        0 12px 22px rgba(0, 0, 0, .34);
    transition: transform .32s cubic-bezier(.2, .8, .2, 1), box-shadow .34s ease, filter .34s ease;
}

:root[data-theme="glass-neon"] .account-select__button:hover {
    border-color: transparent;
    filter: brightness(1.10);
    transform: translateY(-1px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .28),
        inset 0 -1px 0 rgba(255, 255, 255, .07),
        0 15px 28px rgba(0, 0, 0, .42),
        0 16px 30px var(--lg-accent-faint);
}

:root[data-theme="glass-neon"] .account-select__button.is-active {
    --lg-accent: rgba(57, 255, 176, .90);
    --lg-accent-soft: rgba(35, 225, 143, .28);
    --lg-accent-faint: rgba(35, 225, 143, .11);
    border: 1px solid transparent;
    background:
        radial-gradient(90% 105% at 50% -30%, rgba(255, 255, 255, .24), transparent 48%),
        radial-gradient(75% 100% at 77% 118%, var(--lg-accent-faint), transparent 62%),
        linear-gradient(180deg, rgba(20, 29, 35, .84), rgba(5, 10, 10, .92)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .68), rgba(255, 255, 255, .12) 25%, var(--lg-accent) 57%, rgba(255, 255, 255, .14)) border-box;
    background-clip: padding-box, padding-box, padding-box, border-box;
    color: #fff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .28),
        inset 0 -1px 0 rgba(255, 255, 255, .07),
        inset -18px -5px 30px rgba(35, 225, 143, .07),
        0 1px 0 rgba(255, 255, 255, .08),
        0 13px 27px rgba(0, 0, 0, .40),
        0 17px 34px var(--lg-accent-faint);
}

:root[data-theme="glass-neon"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
:root[data-theme="glass-neon"] textarea,
:root[data-theme="glass-neon"] select:not(.animated-select__native),
:root[data-theme="glass-neon"] .animated-select__trigger,
:root[data-theme="glass-neon"] .CodeMirror,
:root[data-theme="glass-neon"] .rich-editor {
    border: 1px solid transparent;
    border-radius: 17px;
    background:
        radial-gradient(100% 80% at 50% -22%, rgba(255, 255, 255, .105), transparent 50%),
        linear-gradient(180deg, rgba(13, 17, 27, .84), rgba(4, 6, 11, .91)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .40), rgba(255, 255, 255, .08) 44%, rgba(117, 93, 201, .25)) border-box;
    background-clip: padding-box, padding-box, border-box;
    backdrop-filter: blur(18px) saturate(1.15);
    -webkit-backdrop-filter: blur(18px) saturate(1.15);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .12),
        inset 0 -1px 0 rgba(255, 255, 255, .035),
        0 9px 20px rgba(0, 0, 0, .25);
}

:root[data-theme="glass-neon"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
:root[data-theme="glass-neon"] textarea:focus,
:root[data-theme="glass-neon"] select:not(.animated-select__native):focus,
:root[data-theme="glass-neon"] .animated-select.is-open .animated-select__trigger,
:root[data-theme="glass-neon"] .CodeMirror.CodeMirror-focused,
:root[data-theme="glass-neon"] .rich-editor:focus {
    border-color: transparent;
    background:
        radial-gradient(100% 80% at 50% -22%, rgba(255, 255, 255, .13), transparent 50%),
        linear-gradient(180deg, rgba(14, 18, 29, .86), rgba(4, 6, 11, .93)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .55), rgba(74, 173, 255, .34) 46%, rgba(188, 85, 255, .56)) border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .15),
        inset 0 -1px 0 rgba(255, 255, 255, .045),
        0 0 0 3px rgba(132, 91, 255, .08),
        0 12px 28px rgba(0, 0, 0, .30),
        0 10px 30px rgba(129, 73, 255, .15);
}

:root[data-theme="glass-neon"] .check-option,
:root[data-theme="glass-neon"] .transliteration-checkbox,
:root[data-theme="glass-neon"] .history-item,
:root[data-theme="glass-neon"] .article-block,
:root[data-theme="glass-neon"] .converter-result,
:root[data-theme="glass-neon"] .image-preview,
:root[data-theme="glass-neon"] .gluing-card,
:root[data-theme="glass-neon"] .file-upload__box,
:root[data-theme="glass-neon"] .tab-group,
:root[data-theme="glass-neon"] .history-panel,
:root[data-theme="glass-neon"] .netcat-article-section {
    border: 1px solid transparent;
    background:
        radial-gradient(100% 80% at 20% -18%, rgba(255, 255, 255, .09), transparent 48%),
        linear-gradient(150deg, rgba(16, 20, 31, .72), rgba(5, 7, 13, .79)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .31), rgba(83, 147, 255, .10) 42%, rgba(178, 74, 255, .20)) border-box;
    background-clip: padding-box, padding-box, border-box;
    backdrop-filter: blur(20px) saturate(1.20);
    -webkit-backdrop-filter: blur(20px) saturate(1.20);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .10),
        0 13px 30px rgba(0, 0, 0, .28);
}

:root[data-theme="glass-neon"] .tab.active {
    border: 1px solid transparent;
    background:
        radial-gradient(90% 100% at 50% -25%, rgba(255, 255, 255, .20), transparent 50%),
        linear-gradient(180deg, rgba(22, 23, 37, .86), rgba(7, 7, 13, .94)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .62), rgba(51, 166, 255, .46) 38%, rgba(203, 70, 255, .72)) border-box;
    background-clip: padding-box, padding-box, border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .24),
        inset 0 -1px 0 rgba(255, 255, 255, .06),
        0 13px 27px rgba(0, 0, 0, .38),
        0 16px 34px rgba(148, 64, 255, .16);
}

:root[data-theme="glass-neon"] :is(button, .button):disabled,
:root[data-theme="glass-neon"] :is(button, .button)[aria-disabled="true"],
:root[data-theme="glass-neon"] .animated-select__trigger:disabled {
    border-color: transparent;
    filter: saturate(.42) brightness(.72);
    opacity: .46;
    transform: none;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .11),
        0 8px 18px rgba(0, 0, 0, .24);
}

/* Optical Liquid Glass v3 */
@property --glass-field-angle {
    syntax: "<angle>";
    inherits: false;
    initial-value: 220deg;
}

:root[data-theme="glass-neon"] {
    --glass-white: rgba(255, 255, 255, .92);
    --glass-ice: rgba(209, 226, 255, .72);
    --glass-void: rgba(2, 4, 9, .96);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
) {
    --glass-a: rgba(24, 221, 255, .96);
    --glass-b: rgba(229, 48, 255, .96);
    --glass-a-soft: rgba(20, 202, 255, .22);
    --glass-b-soft: rgba(222, 34, 255, .24);
    --glass-button-background:
        radial-gradient(92% 82% at 16% -18%, rgba(255, 255, 255, .44) 0%, rgba(255, 255, 255, .10) 31%, transparent 56%),
        radial-gradient(64% 118% at 104% 66%, var(--glass-b-soft) 0%, transparent 58%),
        radial-gradient(82% 78% at 14% 112%, var(--glass-a-soft) 0%, transparent 60%),
        linear-gradient(180deg, rgba(25, 29, 40, .90) 0%, rgba(8, 10, 16, .95) 55%, rgba(2, 4, 8, .98) 100%) padding-box,
        conic-gradient(
            from 214deg at 50% 50%,
            var(--glass-a),
            rgba(255, 255, 255, .78) 13%,
            rgba(255, 255, 255, .16) 28%,
            var(--glass-b) 47%,
            rgba(255, 255, 255, .66) 64%,
            rgba(255, 255, 255, .12) 78%,
            var(--glass-a)
        ) border-box;
    --glass-button-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .16),
        inset 0 3px 3px rgba(255, 255, 255, .32),
        inset 0 -2px 2px rgba(255, 255, 255, .09),
        inset 0 -15px 22px var(--glass-b-soft),
        0 1px 0 rgba(255, 255, 255, .32),
        0 3px 0 color-mix(in srgb, var(--glass-b) 38%, transparent),
        0 6px 0 rgba(3, 5, 10, .68),
        0 12px 17px rgba(0, 0, 0, .52),
        0 24px 42px var(--glass-b-soft),
        -9px 17px 32px var(--glass-a-soft);
    isolation: isolate;
    overflow: visible;
    min-height: 58px;
    padding-right: 30px;
    padding-left: 30px;
    border: 2px solid transparent;
    border-radius: 999px;
    background: var(--glass-button-background);
    background-clip: padding-box, padding-box, padding-box, padding-box, border-box;
    color: rgba(255, 255, 255, .97);
    font-size: 16px;
    font-weight: 550;
    letter-spacing: -.018em;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .90);
    backdrop-filter: blur(24px) saturate(1.32);
    -webkit-backdrop-filter: blur(24px) saturate(1.32);
    box-shadow: var(--glass-button-shadow);
    filter: none;
    transform: translateZ(0);
    transition:
        transform .36s cubic-bezier(.16, .84, .22, 1),
        box-shadow .38s ease,
        filter .38s ease;
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
)::before {
    content: "";
    position: absolute;
    inset: 3px;
    z-index: -1;
    width: auto;
    height: auto;
    border: 1px solid rgba(255, 255, 255, .13);
    border-top-color: rgba(255, 255, 255, .62);
    border-right-color: rgba(255, 255, 255, .22);
    border-bottom-color: color-mix(in srgb, var(--glass-b) 42%, rgba(255, 255, 255, .08));
    border-radius: inherit;
    background:
        radial-gradient(70% 38% at 24% -2%, rgba(255, 255, 255, .64), rgba(255, 255, 255, .13) 38%, transparent 70%),
        linear-gradient(112deg, transparent 8%, rgba(255, 255, 255, .055) 24%, rgba(255, 255, 255, .28) 39%, transparent 55%);
    filter: none;
    opacity: .92;
    pointer-events: none;
    rotate: 0deg;
    transform: none;
    transition: opacity .36s ease, background-position .55s cubic-bezier(.2, .76, .2, 1);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
)::after {
    content: "";
    position: absolute;
    right: 13%;
    bottom: -13px;
    left: 13%;
    z-index: -2;
    height: 23px;
    border-radius: 50%;
    background:
        linear-gradient(90deg, var(--glass-a-soft), var(--glass-a), var(--glass-white) 49%, var(--glass-b), var(--glass-b-soft));
    box-shadow:
        0 3px 13px var(--glass-a-soft),
        0 8px 23px var(--glass-b-soft);
    filter: blur(9px) saturate(1.65);
    opacity: .66;
    pointer-events: none;
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
):hover {
    border-color: transparent;
    filter: brightness(1.12) saturate(1.10);
    transform: translateY(-3px);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .19),
        inset 0 4px 4px rgba(255, 255, 255, .28),
        inset 0 -2px 2px rgba(255, 255, 255, .10),
        inset 0 -17px 25px var(--glass-b-soft),
        0 1px 0 rgba(255, 255, 255, .38),
        0 3px 0 color-mix(in srgb, var(--glass-b) 48%, transparent),
        0 7px 0 rgba(3, 5, 10, .68),
        0 15px 21px rgba(0, 0, 0, .55),
        0 27px 48px var(--glass-b-soft),
        -10px 18px 34px var(--glass-a-soft);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
):hover::before {
    animation: none;
    opacity: 1;
    transform: none;
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary
    ),
    .button
):active {
    filter: brightness(.91);
    transform: translateY(2px) scale(.995);
    box-shadow:
        inset 0 4px 11px rgba(0, 0, 0, .52),
        inset 0 -8px 16px var(--glass-b-soft),
        0 1px 0 rgba(255, 255, 255, .18),
        0 3px 0 color-mix(in srgb, var(--glass-b) 28%, transparent),
        0 6px 13px rgba(0, 0, 0, .46),
        0 12px 25px var(--glass-b-soft);
}

:root[data-theme="glass-neon"] :is(.button.secondary, button.secondary) {
    --glass-a: rgba(18, 228, 255, .98);
    --glass-b: rgba(75, 72, 255, .96);
    --glass-a-soft: rgba(12, 211, 255, .23);
    --glass-b-soft: rgba(68, 48, 255, .21);
}

:root[data-theme="glass-neon"] :is(button.button-green, .button.button-green, .generator-deploy-button) {
    --glass-a: rgba(33, 255, 171, .98);
    --glass-b: rgba(255, 207, 32, .96);
    --glass-a-soft: rgba(24, 248, 151, .23);
    --glass-b-soft: rgba(255, 191, 17, .18);
}

:root[data-theme="glass-neon"] :is(button.danger, .button.danger) {
    --glass-a: rgba(255, 178, 25, .98);
    --glass-b: rgba(255, 40, 121, .97);
    --glass-a-soft: rgba(255, 144, 15, .22);
    --glass-b-soft: rgba(255, 23, 102, .23);
}

:root[data-theme="glass-neon"] :is(
    .button.secondary,
    button.secondary,
    .button.button-green,
    button.button-green,
    .button.danger,
    button.danger,
    .page-site-generator .generator-create-button,
    .page-site-generator .generator-deploy-button
) {
    border: 2px solid transparent;
    background: var(--glass-button-background);
    background-clip: padding-box, padding-box, padding-box, padding-box, border-box;
    box-shadow: var(--glass-button-shadow);
}

:root[data-theme="glass-neon"] .account-select {
    gap: 22px 14px;
}

:root[data-theme="glass-neon"] .account-select__button {
    --glass-a: rgba(67, 198, 255, .90);
    --glass-b: rgba(213, 53, 255, .95);
    --glass-a-soft: rgba(41, 183, 255, .17);
    --glass-b-soft: rgba(204, 35, 255, .21);
    min-height: 58px;
    border: 2px solid transparent;
    background: var(--glass-button-background);
    background-clip: padding-box, padding-box, padding-box, padding-box, border-box;
    color: rgba(255, 255, 255, .94);
    box-shadow: var(--glass-button-shadow);
}

:root[data-theme="glass-neon"] .account-select__button.is-active {
    --glass-a: rgba(29, 255, 171, .99);
    --glass-b: rgba(21, 215, 255, .97);
    --glass-a-soft: rgba(18, 249, 149, .24);
    --glass-b-soft: rgba(14, 205, 255, .21);
    border: 2px solid transparent;
    background: var(--glass-button-background);
    background-clip: padding-box, padding-box, padding-box, padding-box, border-box;
    color: #fff;
    box-shadow: var(--glass-button-shadow);
}

:root[data-theme="glass-neon"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
:root[data-theme="glass-neon"] textarea,
:root[data-theme="glass-neon"] select:not(.animated-select__native),
:root[data-theme="glass-neon"] .animated-select__trigger,
:root[data-theme="glass-neon"] .CodeMirror,
:root[data-theme="glass-neon"] .rich-editor {
    border: 2px solid transparent;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .055), transparent 38%),
        radial-gradient(80% 100% at 102% 65%, rgba(170, 73, 255, .055), transparent 58%),
        linear-gradient(180deg, #151925 0%, #080b13 58%, #03050a 100%) padding-box,
        conic-gradient(
            from var(--glass-field-angle),
            rgba(20, 220, 255, .82),
            rgba(255, 255, 255, .60),
            rgba(255, 255, 255, .10),
            rgba(224, 42, 255, .80),
            rgba(255, 255, 255, .16),
            rgba(20, 220, 255, .82)
        ) border-box;
    background-clip: padding-box, padding-box, padding-box, border-box;
    animation: glassFieldBorderFlow 11s linear infinite;
    transition: box-shadow .32s ease, filter .32s ease;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .19),
        inset 0 -2px 2px rgba(255, 255, 255, .045),
        inset 0 -12px 22px rgba(112, 52, 190, .055),
        0 1px 0 rgba(255, 255, 255, .18),
        0 5px 0 rgba(3, 5, 10, .50),
        0 12px 22px rgba(0, 0, 0, .35);
}

:root[data-theme="glass-neon"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
:root[data-theme="glass-neon"] textarea:focus,
:root[data-theme="glass-neon"] select:not(.animated-select__native):focus,
:root[data-theme="glass-neon"] .animated-select.is-open .animated-select__trigger,
:root[data-theme="glass-neon"] .CodeMirror.CodeMirror-focused,
:root[data-theme="glass-neon"] .rich-editor:focus {
    border-color: transparent;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .075), transparent 38%),
        radial-gradient(80% 100% at 102% 65%, rgba(170, 73, 255, .075), transparent 58%),
        linear-gradient(180deg, #171b28 0%, #090c16 58%, #03050a 100%) padding-box,
        conic-gradient(
            from var(--glass-field-angle),
            rgba(8, 231, 255, .96),
            rgba(255, 255, 255, .76),
            rgba(255, 255, 255, .14),
            rgba(235, 42, 255, .95),
            rgba(255, 255, 255, .20),
            rgba(8, 231, 255, .96)
        ) border-box;
    background-clip: padding-box, padding-box, padding-box, border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .23),
        inset 0 -2px 2px rgba(255, 255, 255, .055),
        inset 0 -14px 25px rgba(135, 60, 218, .08),
        0 1px 0 rgba(255, 255, 255, .21),
        0 5px 0 rgba(3, 5, 10, .48),
        0 14px 27px rgba(0, 0, 0, .39),
        0 17px 36px rgba(122, 69, 255, .16);
}

:root[data-theme="glass-neon"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
    textarea,
    select:not(.animated-select__native),
    .animated-select__trigger,
    .CodeMirror,
    .rich-editor
):hover {
    filter: brightness(1.055) saturate(1.08);
}

@keyframes glassFieldBorderFlow {
    to {
        --glass-field-angle: 580deg;
    }
}

:root[data-theme="glass-neon"] .gluing-mode-switch__track {
    border: 2px solid transparent;
    background:
        radial-gradient(100% 80% at 50% -28%, rgba(255, 255, 255, .23), transparent 53%),
        linear-gradient(180deg, rgba(21, 25, 35, .92), rgba(3, 5, 9, .98)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .68), rgba(255, 255, 255, .13) 38%, rgba(97, 137, 255, .62)) border-box;
    background-clip: padding-box, padding-box, border-box;
    box-shadow:
        inset 0 2px 5px rgba(0, 0, 0, .46),
        inset 0 1px 0 rgba(255, 255, 255, .16),
        0 2px 0 rgba(255, 255, 255, .14),
        0 6px 0 rgba(3, 5, 10, .52),
        0 13px 24px rgba(0, 0, 0, .40);
}

:root[data-theme="glass-neon"] .gluing-mode-switch__thumb {
    border: 2px solid rgba(255, 255, 255, .72);
    background:
        radial-gradient(circle at 32% 22%, #fff 0%, rgba(244, 247, 255, .95) 31%, rgba(188, 198, 228, .94) 68%, rgba(111, 126, 174, .96) 100%);
    box-shadow:
        inset 0 2px 3px #fff,
        inset 0 -3px 5px rgba(78, 88, 130, .38),
        0 3px 0 rgba(255, 255, 255, .18),
        0 8px 15px rgba(0, 0, 0, .48),
        0 0 22px rgba(111, 142, 255, .42);
}

:root[data-theme="glass-neon"] .gluing-mode-switch input:checked + .gluing-mode-switch__track {
    border-color: transparent;
    background:
        radial-gradient(100% 80% at 50% -28%, rgba(255, 255, 255, .27), transparent 53%),
        linear-gradient(180deg, rgba(26, 31, 58, .94), rgba(5, 7, 18, .98)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .75), rgba(47, 182, 255, .72) 43%, rgba(177, 61, 255, .90)) border-box;
    background-clip: padding-box, padding-box, border-box;
    box-shadow:
        inset 0 2px 6px rgba(0, 0, 0, .42),
        inset 0 -12px 20px rgba(100, 54, 255, .14),
        0 2px 0 rgba(255, 255, 255, .17),
        0 6px 0 rgba(3, 5, 12, .52),
        0 14px 28px rgba(0, 0, 0, .42),
        0 18px 35px rgba(96, 68, 255, .25);
}

:root[data-theme="glass-neon"] :is(button, .button):disabled,
:root[data-theme="glass-neon"] :is(button, .button)[aria-disabled="true"],
:root[data-theme="glass-neon"] .animated-select__trigger:disabled {
    filter: grayscale(.28) brightness(.62);
    opacity: .48;
    transform: none;
}

@media (max-width: 720px) {
    :root[data-theme="glass-neon"] :is(
        button:not(.pixel-cat, .cat-secret-menu__toggle, .cat-theme-option, .theme-toggle, .menu-toggle, .tabs__close, .menu-backdrop),
        .button
    ) {
        min-height: 52px;
        padding-right: 22px;
        padding-left: 22px;
        font-size: 15px;
    }
}

@media (prefers-reduced-motion: reduce) {
    :root[data-theme="glass-neon"] :is(
        input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
        textarea,
        select:not(.animated-select__native),
        .animated-select__trigger,
        .CodeMirror,
        .rich-editor
    ) {
        animation: none;
    }
}

:root[data-theme="glass-neon"] :is(
    .workspace > .panel,
    .workspace > form,
    .topbar,
    .tabs,
    .panel,
    form:not(.transliteration-form):not(.text-html-form),
    .netcat-article-section,
    .article-block,
    .history-panel,
    .tab-group
) {
    border: 1px solid transparent;
    background:
        radial-gradient(100% 62% at 20% -18%, rgba(255, 255, 255, .105), transparent 52%),
        radial-gradient(75% 100% at 102% 62%, rgba(167, 72, 255, .075), transparent 58%),
        linear-gradient(145deg, rgba(16, 20, 31, .78), rgba(4, 6, 11, .88)) padding-box,
        conic-gradient(
            from 220deg,
            rgba(61, 177, 255, .40),
            rgba(255, 255, 255, .42),
            rgba(255, 255, 255, .08),
            rgba(188, 73, 255, .40),
            rgba(255, 255, 255, .11),
            rgba(61, 177, 255, .40)
        ) border-box;
    background-clip: padding-box, padding-box, padding-box, border-box;
    backdrop-filter: blur(30px) saturate(1.24);
    -webkit-backdrop-filter: blur(30px) saturate(1.24);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .14),
        inset 0 -1px 0 rgba(255, 255, 255, .035),
        0 1px 0 rgba(255, 255, 255, .10),
        0 18px 48px rgba(0, 0, 0, .40);
}

:root[data-theme="glass-neon"] :is(
    .menu-toggle,
    .tabs__home,
    .tabs__close,
    .theme-toggle,
    .history-panel__toggle,
    .tab-group__summary,
    .animated-select__trigger,
    .date-picker__toggle,
    .date-picker__nav,
    .date-picker__footer-button
) {
    border: 1px solid transparent;
    background:
        radial-gradient(105% 76% at 50% -25%, rgba(255, 255, 255, .22), transparent 53%),
        linear-gradient(180deg, rgba(23, 27, 39, .89), rgba(4, 6, 11, .96)) padding-box,
        conic-gradient(
            from 220deg,
            rgba(50, 187, 255, .58),
            rgba(255, 255, 255, .62),
            rgba(255, 255, 255, .10),
            rgba(187, 72, 255, .62),
            rgba(255, 255, 255, .12),
            rgba(50, 187, 255, .58)
        ) border-box;
    background-clip: padding-box, padding-box, border-box;
    backdrop-filter: blur(22px) saturate(1.25);
    -webkit-backdrop-filter: blur(22px) saturate(1.25);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .22),
        inset 0 -1px 0 rgba(255, 255, 255, .055),
        0 1px 0 rgba(255, 255, 255, .14),
        0 4px 0 rgba(3, 5, 10, .46),
        0 10px 22px rgba(0, 0, 0, .36);
}

:root[data-theme="glass-neon"] :is(
    .menu-toggle,
    .tabs__home,
    .tabs__close,
    .theme-toggle,
    .history-panel__toggle,
    .tab-group__summary,
    .animated-select__trigger,
    .date-picker__toggle,
    .date-picker__nav,
    .date-picker__footer-button
):hover {
    border-color: transparent;
    filter: brightness(1.10) saturate(1.08);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .29),
        inset 0 -1px 0 rgba(255, 255, 255, .07),
        0 1px 0 rgba(255, 255, 255, .17),
        0 4px 0 rgba(3, 5, 10, .46),
        0 13px 27px rgba(0, 0, 0, .40),
        0 16px 31px rgba(137, 67, 255, .13);
}

:root[data-theme="glass-neon"] .history-panel__count {
    border: 1px solid rgba(255, 255, 255, .24);
    background:
        radial-gradient(circle at 30% 18%, rgba(255, 255, 255, .35), transparent 34%),
        linear-gradient(145deg, rgba(148, 70, 255, .78), rgba(73, 37, 154, .90));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .32),
        inset 0 -4px 8px rgba(44, 18, 100, .30),
        0 5px 13px rgba(0, 0, 0, .32),
        0 0 19px rgba(146, 65, 255, .30);
}

:root[data-theme="glass-neon"] :is(
    button:not(.pixel-cat, .cat-secret-menu__toggle, .cat-theme-option),
    .button,
    .account-select__button
) {
    font-weight: 500;
}

/* Solid Glass-neon background and secret palette */
:root[data-theme="glass-neon"] {
    --page-bg: var(--glass-page-color, hsl(210 86% 17%));
}

:root[data-theme="glass-neon"] body {
    background-color: var(--glass-page-color, hsl(210 86% 17%));
    background-image: none;
}

:root[data-theme="glass-neon"] body::before,
:root[data-theme="glass-neon"] body::after {
    background: none;
    opacity: 0;
}

.cat-secret-menu {
    height: 208px;
}

.cat-secret-menu__surface {
    height: 208px;
}

.cat-secret-menu__panel {
    height: 156px;
    min-height: 156px;
}

.cat-theme-list {
    grid-template-rows: 13px repeat(2, 40px) 48px;
}

.cat-background-palette {
    display: grid;
    grid-template-columns: 31px minmax(0, 1fr);
    gap: 5px;
    align-items: center;
    min-height: 48px;
    padding: 5px 7px 3px;
    border-top: 1px solid color-mix(in srgb, var(--line) 68%, transparent);
}

.cat-background-palette__label {
    overflow: hidden;
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cat-background-palette__options {
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: flex-end;
}

.cat-background-option {
    position: relative;
    display: block;
    flex: 0 0 20px;
    width: 20px;
    min-width: 20px;
    height: 20px;
    min-height: 20px;
    margin: 0;
    padding: 0;
    overflow: visible;
    border: 1px solid rgba(225, 234, 255, .30);
    border-radius: 50%;
    background: var(--palette-color);
    color: transparent;
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, .20),
        0 3px 7px rgba(0, 0, 0, .28);
    cursor: pointer;
    filter: none;
    transform: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.cat-background-option:nth-child(1) { --palette-color: #071423; }
.cat-background-option:nth-child(2) { --palette-color: #11151d; }
.cat-background-option:nth-child(3) { --palette-color: #160d24; }
.cat-background-option:nth-child(4) { --palette-color: #081a17; }
.cat-background-option:nth-child(5) { --palette-color: #1c100c; }

.cat-background-option::before,
.cat-background-option::after {
    display: none;
    content: none;
}

.cat-background-option:hover,
.cat-background-option:focus-visible {
    border-color: rgba(255, 255, 255, .78);
    background: var(--palette-color);
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, .30),
        0 0 0 3px color-mix(in srgb, var(--palette-color) 56%, rgba(255, 255, 255, .26)),
        0 5px 10px rgba(0, 0, 0, .34);
    outline: none;
    filter: none;
    transform: translateY(-1px) scale(1.06);
}

.cat-background-option.is-active {
    border-color: #ffffff;
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, .36),
        0 0 0 2px var(--cat-menu-bg),
        0 0 0 4px var(--accent),
        0 5px 11px rgba(0, 0, 0, .36);
}

:root[data-theme="glass-neon"] .cat-background-option,
:root[data-theme="glass-neon"] .cat-background-option:hover,
:root[data-theme="glass-neon"] .cat-background-option:focus-visible,
:root[data-theme="glass-neon"] .cat-background-option:active {
    width: 20px;
    min-width: 20px;
    height: 20px;
    min-height: 20px;
    padding: 0;
    border-radius: 50%;
    background: var(--palette-color);
}

.cat-secret .cat-secret-menu .cat-background-palette .cat-background-option {
    display: block;
    flex: 0 0 20px;
    width: 20px;
    min-width: 20px;
    height: 20px;
    min-height: 20px;
    padding: 0;
    overflow: visible;
    border: 1px solid rgba(225, 234, 255, .30);
    border-radius: 50%;
    background: var(--palette-color);
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, .20),
        0 3px 7px rgba(0, 0, 0, .28);
    filter: none;
    transform: none;
}

.cat-secret .cat-secret-menu .cat-background-palette .cat-background-option::before,
.cat-secret .cat-secret-menu .cat-background-palette .cat-background-option::after {
    display: none;
    content: none;
}

.cat-secret .cat-secret-menu .cat-background-palette .cat-background-option:hover,
.cat-secret .cat-secret-menu .cat-background-palette .cat-background-option:focus-visible {
    border-color: rgba(255, 255, 255, .78);
    background: var(--palette-color);
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, .30),
        0 0 0 3px color-mix(in srgb, var(--palette-color) 56%, rgba(255, 255, 255, .26)),
        0 5px 10px rgba(0, 0, 0, .34);
    filter: none;
    transform: translateY(-1px) scale(1.06);
}

.cat-secret .cat-secret-menu .cat-background-palette .cat-background-option.is-active {
    border-color: #ffffff;
    background: var(--palette-color);
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, .36),
        0 0 0 2px var(--cat-menu-bg),
        0 0 0 4px var(--accent),
        0 5px 11px rgba(0, 0, 0, .36);
}

/* Continuous Glass-neon background hue control */
.cat-secret-menu,
.cat-secret-menu__surface {
    height: 224px;
}

.cat-secret-menu__panel {
    height: 172px;
    min-height: 172px;
}

.cat-theme-list {
    grid-template-rows: 13px 40px 40px 64px;
}

.cat-theme-option--glass-neon {
    border-radius: 9px 9px 5px 5px;
}

.cat-background-palette {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 14px 26px;
    gap: 4px;
    min-height: 64px;
    margin-top: -2px;
    padding: 6px 8px 7px;
    border: 1px solid color-mix(in srgb, var(--accent) 58%, var(--line));
    border-top-color: color-mix(in srgb, var(--accent) 78%, white);
    border-radius: 4px 4px 10px 10px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--accent-soft) 50%, transparent), transparent 52%),
        color-mix(in srgb, var(--cat-menu-bg) 94%, black);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .08),
        0 6px 12px rgba(0, 0, 0, .20);
}

.cat-background-palette::before {
    content: "";
    position: absolute;
    top: -5px;
    left: 18px;
    width: 1px;
    height: 5px;
    background: color-mix(in srgb, var(--accent) 72%, white);
    box-shadow: 126px 0 0 color-mix(in srgb, var(--accent) 72%, white);
    opacity: .7;
}

.cat-background-palette__head {
    display: flex;
    gap: 6px;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
}

.cat-background-palette__label {
    color: var(--text);
    font-size: 9px;
    font-weight: 750;
    line-height: 14px;
}

.cat-background-palette__value {
    color: var(--muted);
    font-size: 8px;
    font-variant-numeric: tabular-nums;
    line-height: 14px;
}

.cat-background-palette__slider {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 20px;
    gap: 7px;
    align-items: center;
    min-width: 0;
}

:root[data-theme="glass-neon"] .cat-secret .cat-secret-menu .cat-background-palette input[type="range"] {
    display: block;
    width: 100%;
    min-width: 0;
    height: 10px;
    min-height: 10px;
    margin: 0;
    padding: 0;
    appearance: none;
    border: 1px solid rgba(226, 235, 255, .38);
    border-radius: 999px;
    background:
        linear-gradient(
            90deg,
            #ff3b57 0%,
            #ffbf39 16.66%,
            #54e36d 33.33%,
            #2bdcff 50%,
            #5570ff 66.66%,
            #cf56ff 83.33%,
            #ff3b57 100%
        );
    background-clip: border-box;
    box-shadow:
        inset 0 1px 2px rgba(0, 0, 0, .38),
        0 1px 0 rgba(255, 255, 255, .10);
    animation: none;
    filter: none;
    cursor: pointer;
}

:root[data-theme="glass-neon"] .cat-secret .cat-secret-menu .cat-background-palette input[type="range"]:focus {
    border-color: rgba(255, 255, 255, .70);
    background:
        linear-gradient(
            90deg,
            #ff3b57 0%,
            #ffbf39 16.66%,
            #54e36d 33.33%,
            #2bdcff 50%,
            #5570ff 66.66%,
            #cf56ff 83.33%,
            #ff3b57 100%
        );
    box-shadow:
        0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent),
        0 1px 0 rgba(255, 255, 255, .14);
    outline: none;
}

:root[data-theme="glass-neon"] .cat-secret .cat-secret-menu .cat-background-palette input[type="range"]::-webkit-slider-thumb {
    width: 18px;
    height: 18px;
    appearance: none;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: hsl(var(--glass-background-hue, 210) 70% 48%);
    box-shadow:
        0 0 0 2px rgba(7, 10, 17, .78),
        0 0 10px hsl(var(--glass-background-hue, 210) 78% 56% / .68);
}

:root[data-theme="glass-neon"] .cat-secret .cat-secret-menu .cat-background-palette input[type="range"]::-moz-range-thumb {
    width: 14px;
    height: 14px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: hsl(var(--glass-background-hue, 210) 70% 48%);
    box-shadow:
        0 0 0 2px rgba(7, 10, 17, .78),
        0 0 10px hsl(var(--glass-background-hue, 210) 78% 56% / .68);
}

.cat-background-palette__preview {
    display: block;
    width: 18px;
    height: 18px;
    border: 1px solid rgba(255, 255, 255, .72);
    border-radius: 50%;
    background: var(--palette-preview-color, hsl(210 70% 46%));
    box-shadow:
        inset 0 1px 2px rgba(255, 255, 255, .28),
        0 0 9px color-mix(in srgb, var(--palette-preview-color, #2877c2) 62%, transparent);
}

/* Glass-neon background palette: secret floating control */
.cat-secret-menu,
.cat-secret-menu__surface {
    height: 164px;
}

.cat-secret-menu__panel {
    height: 112px;
    min-height: 112px;
}

.cat-theme-list {
    grid-template-rows: 13px repeat(2, 40px);
}

.cat-theme-option--glass-neon {
    border-radius: 9px;
}

.glass-background-panel {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1200;
    display: grid;
    width: min(330px, calc(100vw - 32px));
    gap: 13px;
    padding: 17px 18px 15px;
    overflow: hidden;
    border: 1px solid rgba(187, 211, 255, .32);
    border-radius: 24px;
    background:
        linear-gradient(145deg, rgba(39, 55, 83, .72), rgba(8, 12, 24, .91) 46%, rgba(24, 12, 42, .88)),
        rgba(8, 12, 23, .88);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .22),
        inset 1px 0 0 rgba(91, 220, 255, .16),
        inset -1px 0 0 rgba(211, 82, 255, .16),
        0 18px 50px rgba(0, 0, 0, .48),
        0 0 28px hsl(var(--glass-background-hue, 210) 86% 58% / .18);
    opacity: 0;
    transform: translate3d(0, 18px, 0) scale(.96);
    transform-origin: 100% 100%;
    transition:
        opacity .22s ease,
        transform .28s cubic-bezier(.2, .75, .25, 1);
    backdrop-filter: blur(24px) saturate(150%);
    -webkit-backdrop-filter: blur(24px) saturate(150%);
}

.glass-background-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    background:
        linear-gradient(105deg, rgba(255, 255, 255, .18), transparent 24%),
        radial-gradient(circle at 7% 12%, rgba(82, 225, 255, .20), transparent 32%),
        radial-gradient(circle at 94% 88%, rgba(214, 75, 255, .17), transparent 34%);
}

.glass-background-panel[hidden] {
    display: none;
}

.glass-background-panel.is-open {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}

:root:not([data-theme="glass-neon"]) .glass-background-panel {
    display: none !important;
}

.glass-background-panel__head,
.glass-background-panel__slider,
.glass-background-panel__hint {
    position: relative;
    z-index: 1;
}

.glass-background-panel__head,
.glass-background-panel__actions,
.glass-background-panel__control {
    display: flex;
    align-items: center;
}

.glass-background-panel__head {
    justify-content: space-between;
    gap: 16px;
}

.glass-background-panel__title,
.glass-background-panel__subtitle {
    display: block;
}

.glass-background-panel__title {
    color: #f7f9ff;
    font-size: 15px;
    line-height: 1.25;
}

.glass-background-panel__subtitle {
    margin-top: 2px;
    color: rgba(201, 211, 232, .66);
    font-size: 11px;
    line-height: 1.2;
}

.glass-background-panel__actions {
    gap: 9px;
}

.glass-background-panel__value {
    min-width: 34px;
    color: hsl(var(--glass-background-hue, 210) 90% 78%);
    font-size: 12px;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

:root[data-theme="glass-neon"] .glass-background-panel .glass-background-panel__close {
    display: grid;
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
    margin: 0;
    padding: 0;
    place-items: center;
    border: 1px solid rgba(211, 223, 255, .34);
    border-radius: 50%;
    background: rgba(7, 12, 24, .58);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .16),
        0 5px 14px rgba(0, 0, 0, .28);
}

:root[data-theme="glass-neon"] .glass-background-panel .glass-background-panel__close::before,
:root[data-theme="glass-neon"] .glass-background-panel .glass-background-panel__close::after {
    display: none;
}

.glass-background-panel__close svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: #eef3ff;
    stroke-width: 1.8;
    stroke-linecap: round;
}

:root[data-theme="glass-neon"] .glass-background-panel .glass-background-panel__close:hover {
    border-color: rgba(255, 255, 255, .65);
    background: rgba(53, 65, 91, .66);
    transform: translateY(-1px);
}

.glass-background-panel__slider {
    display: grid;
    gap: 7px;
}

.glass-background-panel__rainbow-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: rgba(221, 229, 245, .80);
    font-size: 11px;
    font-weight: 700;
}

.glass-background-panel__rainbow-label output {
    color: rgba(220, 229, 248, .72);
    font-size: 10px;
    font-variant-numeric: tabular-nums;
}

.glass-background-panel__control {
    gap: 11px;
}

:root[data-theme="glass-neon"] .glass-background-panel input[type="range"] {
    display: block;
    width: 100%;
    min-width: 0;
    height: 13px;
    min-height: 13px;
    margin: 0;
    padding: 0;
    appearance: none;
    border: 1px solid rgba(238, 243, 255, .48);
    border-radius: 999px;
    background: linear-gradient(
        90deg,
        #ff3158 0%,
        #ffb52f 16.66%,
        #42e26d 33.33%,
        #21d9ff 50%,
        #5262ff 66.66%,
        #cc46ff 83.33%,
        #ff3158 100%
    );
    box-shadow:
        inset 0 1px 3px rgba(0, 0, 0, .42),
        0 1px 0 rgba(255, 255, 255, .13),
        0 0 14px hsl(var(--glass-background-hue, 210) 80% 58% / .22);
    animation: none;
    filter: none;
    cursor: pointer;
}

:root[data-theme="glass-neon"] .glass-background-panel input[type="range"]:focus {
    outline: none;
    box-shadow:
        0 0 0 3px hsl(var(--glass-background-hue, 210) 85% 65% / .22),
        0 0 18px hsl(var(--glass-background-hue, 210) 80% 58% / .28);
}

:root[data-theme="glass-neon"] .glass-background-panel input.glass-background-panel__brightness {
    background:
        linear-gradient(
            90deg,
            hsl(var(--glass-background-hue, 210) 50% 5%),
            hsl(var(--glass-background-hue, 210) 86% 28%)
        );
}

:root[data-theme="glass-neon"] .glass-background-panel input[type="range"]::-webkit-slider-thumb {
    width: 21px;
    height: 21px;
    appearance: none;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: hsl(var(--glass-background-hue, 210) 74% 48%);
    box-shadow:
        0 0 0 3px rgba(6, 10, 19, .82),
        0 0 14px hsl(var(--glass-background-hue, 210) 88% 62% / .82);
}

:root[data-theme="glass-neon"] .glass-background-panel input[type="range"]::-moz-range-thumb {
    width: 17px;
    height: 17px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: hsl(var(--glass-background-hue, 210) 74% 48%);
    box-shadow:
        0 0 0 3px rgba(6, 10, 19, .82),
        0 0 14px hsl(var(--glass-background-hue, 210) 88% 62% / .82);
}

.glass-background-panel__preview {
    display: block;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    border: 1px solid rgba(255, 255, 255, .78);
    border-radius: 50%;
    background: var(--palette-preview-color, hsl(210 70% 46%));
    box-shadow:
        inset 0 1px 3px rgba(255, 255, 255, .34),
        0 0 14px color-mix(in srgb, var(--palette-preview-color, #2877c2) 72%, transparent);
}

.glass-background-panel__preview--lava {
    background:
        linear-gradient(135deg, #00e2ff, #6539ff 46%, #ef2cff 72%, #18ffad);
    filter: hue-rotate(var(--glass-lava-preview-rotation, 0deg));
}

.glass-background-panel__hint {
    color: rgba(190, 201, 222, .56);
    font-size: 10px;
    line-height: 1.25;
}

@media (max-width: 640px) {
    .glass-background-panel {
        right: 12px;
        bottom: 12px;
        width: min(330px, calc(100vw - 24px));
    }
}

@media (prefers-reduced-motion: reduce) {
    .glass-background-panel {
        transition-duration: .01ms;
    }
}

/* Glass fields keep a stable surface on hover; focus remains clearly visible. */
:root[data-theme="glass-neon"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
    textarea,
    select:not(.animated-select__native),
    .rich-editor
):hover:not(:focus) {
    border-color: transparent;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .055), transparent 38%),
        radial-gradient(80% 100% at 102% 65%, rgba(170, 73, 255, .055), transparent 58%),
        linear-gradient(180deg, #151925 0%, #080b13 58%, #03050a 100%) padding-box,
        conic-gradient(
            from var(--glass-field-angle),
            rgba(20, 220, 255, .82),
            rgba(255, 255, 255, .60),
            rgba(255, 255, 255, .10),
            rgba(224, 42, 255, .80),
            rgba(255, 255, 255, .16),
            rgba(20, 220, 255, .82)
        ) border-box;
    background-clip: padding-box, padding-box, padding-box, border-box;
    filter: none;
}

:root[data-theme="glass-neon"] :is(
    .animated-select__trigger,
    .CodeMirror
):hover {
    filter: none;
}

/* Transparent liquid-glass surfaces with a softly refracted perimeter. */
:root[data-theme="glass-neon"] :is(
    .workspace > .panel,
    .workspace > form,
    .topbar,
    .tabs,
    .panel,
    form:not(.transliteration-form):not(.text-html-form),
    .netcat-article-section,
    .article-block,
    .history-panel,
    .tab-group
) {
    position: relative;
    isolation: isolate;
    border: 1px solid transparent;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .105) 0%,
            rgba(255, 255, 255, .025) 26%,
            rgba(7, 10, 17, .10) 58%,
            rgba(164, 83, 255, .045) 100%
        ),
        linear-gradient(rgba(7, 10, 17, .20), rgba(7, 10, 17, .20));
    background-clip: padding-box, padding-box;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .29),
        inset 1px 0 0 rgba(24, 226, 255, .17),
        inset -1px 0 0 rgba(237, 55, 255, .16),
        inset 0 -1px 0 rgba(255, 255, 255, .075),
        inset 0 0 22px rgba(255, 255, 255, .025),
        0 1px 0 rgba(255, 255, 255, .12),
        0 18px 44px rgba(0, 0, 0, .31);
}

:root[data-theme="glass-neon"] :is(
    .workspace > .panel,
    .workspace > form,
    .topbar,
    .tabs
) {
    -webkit-backdrop-filter: blur(16px) saturate(1.28);
    backdrop-filter: blur(16px) saturate(1.28);
}

:root[data-theme="glass-neon"] :is(
    .workspace > .panel,
    .workspace > form,
    .topbar,
    .panel,
    form:not(.transliteration-form):not(.text-html-form),
    .netcat-article-section,
    .article-block,
    .history-panel,
    .tab-group
)::before {
    content: "";
    position: absolute;
    inset: 2px;
    z-index: 0;
    border-radius: inherit;
    border: 3px solid rgba(255, 255, 255, .022);
    background: none;
    box-shadow:
        inset 5px 0 12px -12px rgba(8, 230, 255, .74),
        inset -5px 0 12px -12px rgba(238, 43, 255, .68),
        inset 0 5px 12px -12px rgba(255, 255, 255, .66),
        inset 0 -6px 13px -13px rgba(255, 255, 255, .26);
    opacity: .52;
    pointer-events: none;
}

:root[data-theme="glass-neon"] :is(
    .workspace > .panel,
    .workspace > form,
    .topbar,
    .panel,
    form:not(.transliteration-form):not(.text-html-form),
    .netcat-article-section,
    .article-block,
    .history-panel,
    .tab-group
)::after {
    content: "";
    position: absolute;
    inset: 2px;
    z-index: 0;
    border-radius: inherit;
    border-top: 1px solid rgba(255, 255, 255, .24);
    border-right: 1px solid rgba(239, 61, 255, .16);
    border-bottom: 1px solid rgba(255, 255, 255, .045);
    border-left: 1px solid rgba(19, 230, 255, .19);
    box-shadow:
        inset 0 8px 16px -15px rgba(255, 255, 255, .80),
        inset 8px 0 15px -16px rgba(10, 231, 255, .86),
        inset -8px 0 15px -16px rgba(238, 42, 255, .78),
        inset 0 -9px 18px -17px rgba(255, 255, 255, .34);
    opacity: .66;
    pointer-events: none;
}

/* The scrollable drawer uses the same material without overlay pseudo-elements. */
:root[data-theme="glass-neon"] .tabs {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .095), rgba(7, 10, 17, .16) 56%, rgba(152, 72, 255, .045)),
        rgba(7, 10, 17, .24);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    :root[data-theme="glass-neon"] :is(
        .workspace > .panel,
        .workspace > form,
        .topbar,
        .tabs,
        .panel,
        form:not(.transliteration-form):not(.text-html-form),
        .netcat-article-section,
        .article-block,
        .history-panel,
        .tab-group
    ) {
        background-color: rgba(9, 12, 21, .78);
    }
}

/* The drawer must stay viewport-bound in every theme. */
:root[data-theme] .shell .tabs {
    position: fixed !important;
    inset: 0 auto 0 0;
}

/* Slow lava-lamp light behind the Glass-neon surfaces. */
:root[data-theme="glass-neon"] body::before,
:root[data-theme="glass-neon"] body::after {
    content: "";
    position: fixed;
    inset: -22%;
    z-index: 0;
    pointer-events: none;
    will-change: transform;
}

:root[data-theme="glass-neon"] body::before {
    background:
        radial-gradient(ellipse 24% 34% at 18% 24%, rgba(0, 225, 255, .55), transparent 72%),
        radial-gradient(ellipse 29% 25% at 78% 20%, rgba(224, 33, 255, .52), transparent 73%),
        radial-gradient(ellipse 24% 31% at 72% 78%, rgba(255, 57, 150, .36), transparent 72%),
        radial-gradient(ellipse 28% 23% at 27% 82%, rgba(19, 255, 171, .30), transparent 74%);
    opacity: .78;
    mix-blend-mode: screen;
    animation: glassLavaDriftA 23s cubic-bezier(.45, .05, .55, .95) infinite alternate;
}

:root[data-theme="glass-neon"] body::after {
    background:
        radial-gradient(ellipse 18% 28% at 48% 18%, rgba(70, 94, 255, .46), transparent 74%),
        radial-gradient(ellipse 22% 19% at 88% 58%, rgba(255, 111, 24, .27), transparent 73%),
        radial-gradient(ellipse 19% 27% at 42% 73%, rgba(177, 38, 255, .38), transparent 75%),
        radial-gradient(ellipse 18% 18% at 12% 62%, rgba(0, 213, 255, .30), transparent 74%);
    opacity: .60;
    mix-blend-mode: screen;
    animation: glassLavaDriftB 29s cubic-bezier(.42, .08, .58, .92) infinite alternate;
}

@keyframes glassLavaDriftA {
    0% {
        transform: translate3d(-4%, -2%, 0) rotate(-4deg) scale(1);
    }
    35% {
        transform: translate3d(5%, 3%, 0) rotate(3deg) scale(1.08, .96);
    }
    68% {
        transform: translate3d(-1%, 7%, 0) rotate(7deg) scale(.97, 1.08);
    }
    100% {
        transform: translate3d(6%, -4%, 0) rotate(-1deg) scale(1.07);
    }
}

@keyframes glassLavaDriftB {
    0% {
        transform: translate3d(5%, 4%, 0) rotate(5deg) scale(1.05);
    }
    42% {
        transform: translate3d(-5%, -3%, 0) rotate(-5deg) scale(.96, 1.09);
    }
    76% {
        transform: translate3d(3%, -7%, 0) rotate(2deg) scale(1.08, .97);
    }
    100% {
        transform: translate3d(-4%, 5%, 0) rotate(8deg) scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    :root[data-theme="glass-neon"] body::before,
    :root[data-theme="glass-neon"] body::after {
        animation: none;
        transform: none;
    }
}

/* Organic lava blobs replace the flat radial-gradient spots. */
:root[data-theme="glass-neon"] body::before,
:root[data-theme="glass-neon"] body::after {
    background: none;
    opacity: 0;
    animation: none;
}

.glass-lava-lamp {
    display: none;
}

:root[data-theme="glass-neon"] .glass-lava-lamp {
    position: fixed;
    inset: 0;
    z-index: 0;
    display: block;
    overflow: hidden;
    pointer-events: none;
}

.glass-lava-lamp__canvas {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    filter:
        blur(8px)
        saturate(1.16);
    opacity: .70;
    transform: scale(1.025);
}

.glass-lava-lamp__filters {
    position: absolute;
    overflow: hidden;
}

.glass-lava-lamp__field {
    position: absolute;
    inset: -12%;
    opacity: .82;
    transform: translateZ(0);
}

.glass-lava-lamp__blob {
    position: absolute;
    display: block;
    border-radius: 48% 52% 55% 45% / 58% 43% 57% 42%;
    filter: saturate(1.28);
    mix-blend-mode: screen;
    will-change: transform;
}

.glass-lava-lamp__blob--1 {
    left: -5%;
    bottom: -22%;
    width: 36vw;
    min-width: 360px;
    height: 48vw;
    min-height: 480px;
    background: linear-gradient(145deg, #08e9ff, #087bff 76%);
    animation: glassLavaBlobOne 24s ease-in-out infinite alternate;
}

.glass-lava-lamp__blob--2 {
    top: -30%;
    left: 18%;
    width: 28vw;
    min-width: 300px;
    height: 38vw;
    min-height: 410px;
    background: linear-gradient(155deg, #13dfff, #5141ff 78%);
    animation: glassLavaBlobTwo 29s ease-in-out infinite alternate;
}

.glass-lava-lamp__blob--3 {
    top: -12%;
    right: -9%;
    width: 42vw;
    min-width: 430px;
    height: 39vw;
    min-height: 400px;
    background: linear-gradient(145deg, #f02cff, #8b21ff 72%);
    animation: glassLavaBlobThree 27s ease-in-out infinite alternate;
}

.glass-lava-lamp__blob--4 {
    right: 11%;
    bottom: -35%;
    width: 31vw;
    min-width: 340px;
    height: 44vw;
    min-height: 470px;
    background: linear-gradient(155deg, #ff278f, #e72aff 74%);
    animation: glassLavaBlobFour 32s ease-in-out infinite alternate;
}

.glass-lava-lamp__blob--5 {
    top: 34%;
    left: 43%;
    width: 19vw;
    min-width: 230px;
    height: 24vw;
    min-height: 280px;
    background: linear-gradient(145deg, #8a38ff, #df2cff);
    animation: glassLavaBlobFive 20s ease-in-out infinite alternate;
}

.glass-lava-lamp__blob--6 {
    bottom: -24%;
    left: 24%;
    width: 25vw;
    min-width: 290px;
    height: 36vw;
    min-height: 390px;
    background: linear-gradient(155deg, #16ffad, #02c7df 78%);
    animation: glassLavaBlobSix 31s ease-in-out infinite alternate;
}

@keyframes glassLavaBlobOne {
    0% {
        transform: translate3d(-8vw, 16vh, 0) rotate(-13deg) scale(.76, 1.14);
        border-radius: 44% 56% 61% 39% / 58% 38% 62% 42%;
    }
    48% {
        transform: translate3d(13vw, -20vh, 0) rotate(8deg) scale(1.09, .88);
        border-radius: 59% 41% 43% 57% / 39% 62% 38% 61%;
    }
    100% {
        transform: translate3d(23vw, -48vh, 0) rotate(19deg) scale(.87, 1.18);
        border-radius: 39% 61% 55% 45% / 66% 36% 64% 34%;
    }
}

@keyframes glassLavaBlobTwo {
    0% {
        transform: translate3d(-5vw, -16vh, 0) rotate(15deg) scale(.88, 1.12);
        border-radius: 61% 39% 47% 53% / 43% 58% 42% 57%;
    }
    55% {
        transform: translate3d(12vw, 26vh, 0) rotate(-9deg) scale(1.14, .83);
        border-radius: 42% 58% 63% 37% / 61% 35% 65% 39%;
    }
    100% {
        transform: translate3d(-1vw, 51vh, 0) rotate(-18deg) scale(.92, 1.10);
        border-radius: 56% 44% 38% 62% / 35% 66% 34% 65%;
    }
}

@keyframes glassLavaBlobThree {
    0% {
        transform: translate3d(12vw, -12vh, 0) rotate(-11deg) scale(1.12, .82);
        border-radius: 38% 62% 57% 43% / 62% 42% 58% 38%;
    }
    46% {
        transform: translate3d(-13vw, 18vh, 0) rotate(10deg) scale(.84, 1.17);
        border-radius: 62% 38% 41% 59% / 37% 64% 36% 63%;
    }
    100% {
        transform: translate3d(-22vw, 43vh, 0) rotate(17deg) scale(1.08, .89);
        border-radius: 47% 53% 66% 34% / 58% 34% 66% 42%;
    }
}

@keyframes glassLavaBlobFour {
    0% {
        transform: translate3d(7vw, 18vh, 0) rotate(12deg) scale(.82, 1.16);
        border-radius: 57% 43% 37% 63% / 41% 63% 37% 59%;
    }
    52% {
        transform: translate3d(-10vw, -19vh, 0) rotate(-7deg) scale(1.13, .85);
        border-radius: 39% 61% 58% 42% / 65% 37% 63% 35%;
    }
    100% {
        transform: translate3d(-19vw, -46vh, 0) rotate(-16deg) scale(.91, 1.12);
        border-radius: 64% 36% 45% 55% / 36% 59% 41% 64%;
    }
}

@keyframes glassLavaBlobFive {
    0% {
        transform: translate3d(-15vw, 8vh, 0) rotate(-18deg) scale(.76, 1.18);
        border-radius: 43% 57% 65% 35% / 60% 35% 65% 40%;
    }
    50% {
        transform: translate3d(5vw, -17vh, 0) rotate(5deg) scale(1.20, .78);
        border-radius: 66% 34% 40% 60% / 38% 62% 38% 62%;
    }
    100% {
        transform: translate3d(17vw, 10vh, 0) rotate(21deg) scale(.86, 1.13);
        border-radius: 37% 63% 53% 47% / 67% 39% 61% 33%;
    }
}

@keyframes glassLavaBlobSix {
    0% {
        transform: translate3d(-7vw, 14vh, 0) rotate(9deg) scale(.89, 1.10);
        border-radius: 63% 37% 48% 52% / 37% 61% 39% 63%;
    }
    47% {
        transform: translate3d(10vw, -22vh, 0) rotate(-12deg) scale(1.16, .81);
        border-radius: 41% 59% 62% 38% / 64% 36% 64% 36%;
    }
    100% {
        transform: translate3d(20vw, -49vh, 0) rotate(-20deg) scale(.84, 1.15);
        border-radius: 58% 42% 36% 64% / 43% 66% 34% 57%;
    }
}

@media (max-width: 700px) {
    .glass-lava-lamp__field {
        inset: -18%;
        opacity: .72;
    }

    .glass-lava-lamp__blob {
        min-width: 270px;
        min-height: 340px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .glass-lava-lamp__blob {
        animation-play-state: paused;
    }
}

/* Palette sliders keep their semantic tracks over the animated field styling. */
:root[data-theme="glass-neon"] body .glass-background-panel input[type="range"] {
    background: linear-gradient(
        90deg,
        #ff3158 0%,
        #ffb52f 16.66%,
        #42e26d 33.33%,
        #21d9ff 50%,
        #5262ff 66.66%,
        #cc46ff 83.33%,
        #ff3158 100%
    ) !important;
}

:root[data-theme="glass-neon"] body .glass-background-panel input.glass-background-panel__brightness {
    background: linear-gradient(
        90deg,
        hsl(var(--glass-background-hue, 210) 50% 5%),
        hsl(var(--glass-background-hue, 210) 86% 28%)
    ) !important;
}

/* Reference-inspired liquid-glass buttons: clean lens, chromatic rim, soft underlight. */
:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary,
        .glass-background-panel__close
    ),
    .button
) {
    border: 2px solid transparent;
    background:
        radial-gradient(85% 72% at 18% -18%, rgba(255, 255, 255, .38), transparent 54%),
        linear-gradient(
            112deg,
            color-mix(in srgb, var(--glass-a, #18ddff) 52%, #102238),
            color-mix(in srgb, var(--glass-b, #e530ff) 50%, #32143f)
        ) padding-box,
        linear-gradient(
            112deg,
            var(--glass-a, rgba(20, 226, 255, .96)),
            rgba(255, 255, 255, .72) 24%,
            rgba(91, 103, 255, .72) 51%,
            var(--glass-b, rgba(234, 44, 255, .96))
        ) border-box;
    background-clip: padding-box, padding-box, border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .35),
        inset 0 -1px 0 rgba(255, 255, 255, .075),
        inset 13px 0 25px var(--glass-a-soft, rgba(20, 202, 255, .22)),
        inset -13px 0 25px var(--glass-b-soft, rgba(222, 34, 255, .23)),
        0 9px 20px rgba(0, 0, 0, .43),
        -5px 10px 24px var(--glass-a-soft, rgba(20, 202, 255, .21)),
        5px 10px 26px var(--glass-b-soft, rgba(222, 34, 255, .23));
    filter: none;
    transform: translateZ(0);
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary,
        .glass-background-panel__close
    ),
    .button
)::before {
    inset: 2px;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, .58);
    border-radius: inherit;
    background:
        linear-gradient(
            118deg,
            rgba(255, 255, 255, .42) 0%,
            rgba(255, 255, 255, .11) 16%,
            transparent 34%,
            transparent 72%,
            rgba(255, 255, 255, .08) 100%
        );
    opacity: .78;
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary,
        .glass-background-panel__close
    ),
    .button
)::after {
    right: 18%;
    bottom: -8px;
    left: 18%;
    height: 14px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--glass-a, rgba(20, 226, 255, .96)),
        rgba(109, 91, 255, .86),
        var(--glass-b, rgba(234, 44, 255, .96)),
        transparent
    );
    box-shadow: none;
    filter: blur(9px) saturate(1.45);
    opacity: .54;
}

:root[data-theme="glass-neon"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle,
        .tab-group__summary,
        .glass-background-panel__close
    ),
    .button
):hover {
    filter: brightness(1.08) saturate(1.08);
    transform: translateY(-2px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .43),
        inset 0 -1px 0 rgba(255, 255, 255, .09),
        inset 14px 0 26px var(--glass-a-soft, rgba(20, 202, 255, .22)),
        inset -14px 0 26px var(--glass-b-soft, rgba(222, 34, 255, .23)),
        0 12px 24px rgba(0, 0, 0, .46),
        -7px 13px 30px var(--glass-a-soft, rgba(20, 202, 255, .22)),
        7px 13px 32px var(--glass-b-soft, rgba(222, 34, 255, .24));
}

:root[data-theme="glass-neon"] :is(
    button.button-green,
    .button.button-green,
    .generator-deploy-button,
    .account-select__button.is-active
) {
    background:
        radial-gradient(82% 72% at 18% -16%, rgba(255, 255, 255, .42), transparent 55%),
        linear-gradient(
            112deg,
            color-mix(in srgb, var(--glass-a, #20ffad) 82%, #052019),
            color-mix(in srgb, var(--glass-b, #16d8ff) 76%, #082238)
        ) padding-box,
        linear-gradient(
            112deg,
            rgba(255, 255, 255, .82),
            var(--glass-a, #20ffad) 34%,
            var(--glass-b, #16d8ff) 76%,
            rgba(255, 255, 255, .64)
        ) border-box;
    background-clip: padding-box, padding-box, border-box;
    color: #ffffff;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .58);
}

/* Keep flat navigation links readable against the glass drawer. */
:root[data-theme="glass-neon"] .tabs__list {
    --menu-group-rgb: 54 174 255;
    gap: 12px;
}

:root[data-theme="glass-neon"] .tab-group {
    --menu-group-rgb: 54 174 255;
    overflow: hidden;
    border-color: rgb(var(--menu-group-rgb) / .24);
    background:
        linear-gradient(160deg, rgb(var(--menu-group-rgb) / .08), transparent 42%),
        rgba(4, 7, 14, .43);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .08),
        0 8px 20px rgba(0, 0, 0, .22);
}

:root[data-theme="glass-neon"] .tab-group:nth-child(4n + 2) {
    --menu-group-rgb: 184 82 255;
}

:root[data-theme="glass-neon"] .tab-group:nth-child(4n + 3) {
    --menu-group-rgb: 255 126 54;
}

:root[data-theme="glass-neon"] .tab-group:nth-child(4n) {
    --menu-group-rgb: 49 224 139;
}

:root[data-theme="glass-neon"] .tab-group > .tab-group__summary {
    min-height: 46px;
    border: 0;
    border-left: 3px solid rgb(var(--menu-group-rgb) / .94);
    border-radius: 17px;
    color: rgb(var(--menu-group-rgb) / 1);
    background:
        radial-gradient(90% 120% at 4% 0%, rgb(var(--menu-group-rgb) / .20), transparent 56%),
        linear-gradient(180deg, rgba(31, 36, 52, .82), rgba(7, 9, 17, .91));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .22),
        inset 0 -1px 0 rgb(var(--menu-group-rgb) / .20),
        0 5px 13px rgba(0, 0, 0, .24);
    letter-spacing: .01em;
}

:root[data-theme="glass-neon"] .tab-group.is-open > .tab-group__summary {
    border-radius: 17px 17px 8px 8px;
    background:
        radial-gradient(100% 140% at 3% 0%, rgb(var(--menu-group-rgb) / .27), transparent 60%),
        linear-gradient(180deg, rgba(33, 38, 55, .88), rgba(7, 9, 17, .94));
}

:root[data-theme="glass-neon"] .tab-group > .tab-group__summary:hover,
:root[data-theme="glass-neon"] .tab-group > .tab-group__summary:focus-visible {
    color: color-mix(in srgb, rgb(var(--menu-group-rgb)) 74%, white);
    background:
        radial-gradient(100% 140% at 3% 0%, rgb(var(--menu-group-rgb) / .32), transparent 60%),
        linear-gradient(180deg, rgba(35, 41, 59, .90), rgba(7, 9, 17, .94));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .26),
        0 7px 18px rgba(0, 0, 0, .27),
        0 0 16px rgb(var(--menu-group-rgb) / .13);
}

:root[data-theme="glass-neon"] .tab-group__items {
    border-top-color: rgb(var(--menu-group-rgb) / .18);
    background: rgba(2, 5, 11, .22);
}

:root[data-theme="glass-neon"] .tab-group__items-inner {
    gap: 3px;
    padding: 7px 6px 8px;
}

:root[data-theme="glass-neon"] .tabs__list .tab {
    position: relative;
    min-height: 39px;
    border: 1px solid transparent;
    border-radius: 9px;
    padding: 8px 11px 8px 22px;
    color: rgba(224, 231, 255, .84);
    background: rgba(10, 14, 25, .48);
    box-shadow: none;
}

:root[data-theme="glass-neon"] .tabs__list .tab::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 9px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgb(var(--menu-group-rgb) / .52);
    box-shadow: 0 0 8px rgb(var(--menu-group-rgb) / .28);
    transform: translateY(-50%);
    transition: height .24s ease, border-radius .24s ease, opacity .24s ease;
}

:root[data-theme="glass-neon"] .tabs__list .tab:hover,
:root[data-theme="glass-neon"] .tabs__list .tab:focus-visible {
    border-color: rgb(var(--menu-group-rgb) / .18);
    color: #ffffff;
    background: rgb(var(--menu-group-rgb) / .09);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
    transform: translateX(2px);
}

:root[data-theme="glass-neon"] .tabs__list .tab.active {
    border-color: rgb(var(--menu-group-rgb) / .48);
    color: #ffffff;
    background:
        linear-gradient(90deg, rgb(var(--menu-group-rgb) / .23), rgb(var(--menu-group-rgb) / .07)),
        rgba(8, 11, 20, .74);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .12),
        0 0 16px rgb(var(--menu-group-rgb) / .11);
}

:root[data-theme="glass-neon"] .tabs__list .tab.active::before {
    width: 3px;
    height: 19px;
    border-radius: 3px;
    background: rgb(var(--menu-group-rgb) / 1);
    box-shadow: 0 0 10px rgb(var(--menu-group-rgb) / .70);
}

/* Translucent form glass: the ambient colour remains visible through fields. */
:root[data-theme="glass-neon"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
    textarea,
    select:not(.animated-select__native),
    .animated-select__trigger,
    .CodeMirror,
    .rich-editor
) {
    border: 1px solid rgba(226, 234, 255, .24);
    background: rgba(15, 20, 32, .54);
    -webkit-backdrop-filter: blur(18px) saturate(.82);
    backdrop-filter: blur(18px) saturate(.82);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .12),
        inset 0 -1px 0 rgba(255, 255, 255, .025),
        0 7px 18px rgba(0, 0, 0, .18);
    animation: none;
    filter: none;
    transition:
        background .3s ease,
        box-shadow .3s ease,
        border-color .3s ease,
        transform .3s ease;
}

:root[data-theme="glass-neon"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
    textarea
)::placeholder {
    color: rgba(218, 226, 247, .68);
    opacity: 1;
}

:root[data-theme="glass-neon"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
    textarea,
    select:not(.animated-select__native),
    .animated-select__trigger,
    .CodeMirror,
    .rich-editor
):hover:not(:focus) {
    border-color: rgba(232, 239, 255, .34);
    background: rgba(20, 26, 40, .59);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .16),
        0 8px 20px rgba(0, 0, 0, .20);
    filter: none;
}

:root[data-theme="glass-neon"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
    textarea,
    select:not(.animated-select__native)
):focus,
:root[data-theme="glass-neon"] .animated-select.is-open .animated-select__trigger,
:root[data-theme="glass-neon"] .CodeMirror.CodeMirror-focused,
:root[data-theme="glass-neon"] .rich-editor:focus {
    border-color: rgba(126, 210, 255, .72);
    background: rgba(22, 29, 44, .64);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .19),
        0 0 0 3px rgba(83, 184, 255, .09),
        0 9px 23px rgba(0, 0, 0, .22);
}

:root[data-theme="glass-neon"] .file-upload__box {
    border: 1px solid rgba(220, 230, 255, .20);
    background: rgba(15, 20, 32, .50);
    -webkit-backdrop-filter: blur(18px) saturate(.82);
    backdrop-filter: blur(18px) saturate(.82);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .17),
        0 7px 18px rgba(0, 0, 0, .18);
}

:root[data-theme="glass-neon"] .file-upload:hover .file-upload__box,
:root[data-theme="glass-neon"] .file-upload input[type="file"]:focus-visible + .file-upload__box,
:root[data-theme="glass-neon"] .file-upload.has-file .file-upload__box {
    border-color: rgba(126, 210, 255, .50);
    background: rgba(20, 26, 40, .58);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .16),
        0 8px 22px rgba(0, 0, 0, .20);
}

/* These tool forms are layout wrappers; their children already provide the glass panels. */
:root[data-theme="glass-neon"] .workspace > :is(
    .text-html-form,
    .transliteration-form
) {
    border: 0 !important;
    background: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
    isolation: auto !important;
}

:root[data-theme="glass-neon"] .workspace > :is(
    .text-html-form,
    .transliteration-form
)::before,
:root[data-theme="glass-neon"] .workspace > :is(
    .text-html-form,
    .transliteration-form
)::after {
    content: none !important;
    display: none !important;
}

/* Keep custom select menus above the following glass columns. */
:root[data-theme="glass-neon"] .transliteration-toolbar {
    position: relative;
    z-index: 20;
    overflow: visible;
}

:root[data-theme="glass-neon"] .transliteration-grid {
    position: relative;
    z-index: 1;
}

:root[data-theme="glass-neon"] .transliteration-toolbar .animated-select.is-open {
    z-index: 30;
}

/* Image quality uses a bare frosted-glass rail without the field shell. */
:root[data-theme="glass-neon"] .page-image-converter .range-field input[type="range"] {
    width: 100%;
    height: 24px;
    margin: 2px 0 0;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    border-radius: 0;
    outline: none;
    background: transparent;
    box-shadow: none;
    filter: none;
    cursor: ew-resize;
}

:root[data-theme="glass-neon"] .page-image-converter .range-field input[type="range"]:hover,
:root[data-theme="glass-neon"] .page-image-converter .range-field input[type="range"]:focus {
    border: 0;
    outline: none;
    background: transparent;
    box-shadow: none;
    filter: none;
}

:root[data-theme="glass-neon"] .page-image-converter .range-field input[type="range"]::-webkit-slider-runnable-track {
    height: 10px;
    border: 1px solid rgba(231, 239, 255, .28);
    border-radius: 999px;
    background: linear-gradient(
        90deg,
        rgba(33, 218, 255, .90) 0%,
        rgba(174, 57, 255, .92) var(--range-progress, 50%),
        rgba(218, 230, 255, .16) var(--range-progress, 50%),
        rgba(218, 230, 255, .16) 100%
    );
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, .22),
        inset 0 -2px 4px rgba(2, 6, 16, .30),
        0 4px 12px rgba(0, 0, 0, .16);
}

:root[data-theme="glass-neon"] .page-image-converter .range-field input[type="range"]::-webkit-slider-thumb {
    width: 20px;
    height: 20px;
    margin-top: -6px;
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid rgba(244, 248, 255, .68);
    border-radius: 50%;
    background: rgba(179, 82, 245, .92);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .42),
        0 3px 8px rgba(0, 0, 0, .28),
        0 0 13px rgba(186, 66, 255, .42);
}

:root[data-theme="glass-neon"] .page-image-converter .range-field input[type="range"]::-moz-range-track {
    height: 8px;
    border: 1px solid rgba(231, 239, 255, .28);
    border-radius: 999px;
    background: rgba(218, 230, 255, .16);
    box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, .22),
        inset 0 -2px 4px rgba(2, 6, 16, .30),
        0 4px 12px rgba(0, 0, 0, .16);
}

:root[data-theme="glass-neon"] .page-image-converter .range-field input[type="range"]::-moz-range-progress {
    height: 8px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(33, 218, 255, .90), rgba(174, 57, 255, .92));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20);
}

:root[data-theme="glass-neon"] .page-image-converter .range-field input[type="range"]::-moz-range-thumb {
    width: 18px;
    height: 18px;
    border: 1px solid rgba(244, 248, 255, .68);
    border-radius: 50%;
    background: rgba(179, 82, 245, .92);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .42),
        0 3px 8px rgba(0, 0, 0, .28),
        0 0 13px rgba(186, 66, 255, .42);
}

/*
 * Button hierarchy for Glass-neon:
 * utility and selection controls share one neutral lens; only the active
 * account and explicit launch/deploy actions keep the bright accent.
 */
:root[data-theme="glass-neon"] :is(
    .button.secondary,
    button.secondary,
    .account-select__button:not(.is-active),
    .page-site-generator .generator-create-button
) {
    --glass-a: rgba(18, 228, 255, .98);
    --glass-b: rgba(75, 72, 255, .96);
    --glass-a-soft: rgba(12, 211, 255, .23);
    --glass-b-soft: rgba(68, 48, 255, .21);
    border: 2px solid transparent;
    background: var(--glass-button-background);
    background-clip: padding-box, padding-box, padding-box, padding-box, border-box;
    color: rgba(255, 255, 255, .97);
    box-shadow: var(--glass-button-shadow);
}

/*
 * Keep compact controls out of the global liquid-glass button treatment.
 * These rules intentionally come last because some tools render their
 * calendars and animated selects inside forms with stronger button styles.
 */
:root[data-theme="glass-neon"] .date-picker .date-picker__day {
    min-width: 0;
    min-height: 38px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: var(--text);
    box-shadow: none;
    padding: 0;
    filter: none;
    transform: none;
}

:root[data-theme="glass-neon"] .date-picker .date-picker__day::before,
:root[data-theme="glass-neon"] .date-picker .date-picker__day::after {
    content: none;
}

:root[data-theme="glass-neon"] .date-picker .date-picker__day:hover:not(:disabled),
:root[data-theme="glass-neon"] .date-picker .date-picker__day:focus-visible {
    border: 0;
    background: linear-gradient(135deg, rgba(89, 160, 255, .14), rgba(146, 91, 255, .17));
    color: var(--accent-gradient-hover);
    box-shadow: inset 0 0 0 1px rgba(209, 217, 255, .16), 0 0 16px rgba(128, 105, 255, .13);
    outline: none;
    filter: none;
    transform: none;
}

:root[data-theme="glass-neon"] .date-picker .date-picker__day.is-outside {
    color: var(--muted);
    opacity: .48;
}

:root[data-theme="glass-neon"] .date-picker .date-picker__day.is-selected,
:root[data-theme="glass-neon"] .date-picker .date-picker__day.is-selected:hover,
:root[data-theme="glass-neon"] .date-picker .date-picker__day.is-selected:focus-visible {
    border: 1px solid rgba(232, 226, 255, .36);
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .27), transparent 38%),
        linear-gradient(145deg, rgba(96, 166, 255, .30), rgba(143, 90, 255, .52));
    color: #fff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .44),
        0 0 24px rgba(139, 102, 255, .34);
}

:root[data-theme="glass-neon"] .date-picker .date-picker__day.is-today::after {
    content: "";
    position: absolute;
    right: 50%;
    bottom: 5px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--accent-gradient-hover);
    translate: 50% 0;
}

:root[data-theme="glass-neon"] .date-picker .date-picker__day.is-selected::after {
    background: currentColor;
}

:root[data-theme="glass-neon"] .animated-select .animated-select__option {
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: var(--text);
    box-shadow: none;
    filter: none;
    transform: none;
}

:root[data-theme="glass-neon"] .animated-select .animated-select__option::before,
:root[data-theme="glass-neon"] .animated-select .animated-select__option::after {
    content: none;
}

:root[data-theme="glass-neon"] .animated-select .animated-select__option:hover,
:root[data-theme="glass-neon"] .animated-select .animated-select__option:focus-visible {
    border-color: rgba(201, 211, 255, .24);
    background: linear-gradient(135deg, rgba(88, 160, 255, .12), rgba(145, 91, 255, .15));
    color: var(--tab-hover-color);
    box-shadow: none;
    outline: none;
    filter: none;
    transform: none;
}

:root[data-theme="glass-neon"] .animated-select .animated-select__option.is-selected {
    border-color: rgba(192, 179, 255, .44);
    background:
        radial-gradient(circle at 12% 0%, rgba(255, 255, 255, .16), transparent 34%),
        linear-gradient(135deg, rgba(88, 159, 255, .17), rgba(143, 88, 255, .24));
    color: var(--text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 18px rgba(130, 102, 255, .12);
}

/* Let the Gluing cards participate in the coloured glass surface. */
:root[data-theme="glass-neon"] .page-gluing .gluing-card {
    border: 1px solid transparent;
    background:
        radial-gradient(115% 125% at 0% 0%, rgba(31, 202, 255, .16), transparent 58%),
        radial-gradient(105% 130% at 100% 100%, rgba(195, 62, 255, .14), transparent 60%),
        linear-gradient(145deg, rgba(24, 43, 63, .52), rgba(31, 18, 49, .48)) padding-box,
        linear-gradient(
            135deg,
            rgba(255, 255, 255, .42),
            rgba(63, 190, 255, .24) 42%,
            rgba(196, 79, 255, .34)
        ) border-box;
    background-clip: padding-box, padding-box, padding-box, border-box;
    backdrop-filter: blur(24px) saturate(1.22);
    -webkit-backdrop-filter: blur(24px) saturate(1.22);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .14),
        inset 0 -1px 0 rgba(255, 255, 255, .04),
        0 14px 30px rgba(0, 0, 0, .22),
        0 0 24px rgba(107, 105, 255, .08);
}

/* Match the large working panes to the same coloured glass treatment. */
:root[data-theme="glass-neon"] :is(
    .page-transliteration .transliteration-column,
    .page-text-html .editor-pane
) {
    border: 1px solid transparent;
    background:
        radial-gradient(115% 125% at 0% 0%, rgba(31, 202, 255, .16), transparent 58%),
        radial-gradient(105% 130% at 100% 100%, rgba(195, 62, 255, .14), transparent 60%),
        linear-gradient(145deg, rgba(24, 43, 63, .52), rgba(31, 18, 49, .48)) padding-box,
        linear-gradient(
            135deg,
            rgba(255, 255, 255, .42),
            rgba(63, 190, 255, .24) 42%,
            rgba(196, 79, 255, .34)
        ) border-box;
    background-clip: padding-box, padding-box, padding-box, border-box;
    backdrop-filter: blur(24px) saturate(1.22);
    -webkit-backdrop-filter: blur(24px) saturate(1.22);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .14),
        inset 0 -1px 0 rgba(255, 255, 255, .04),
        0 14px 30px rgba(0, 0, 0, .22),
        0 0 24px rgba(107, 105, 255, .08);
}

/* Text/HTML panes use the same transparent surface density as the top panels. */
:root[data-theme="glass-neon"] .page-text-html .editor-pane {
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, .105) 0%,
            rgba(255, 255, 255, .025) 26%,
            rgba(7, 10, 17, .10) 58%,
            rgba(164, 83, 255, .045) 100%
    ),
        linear-gradient(rgba(7, 10, 17, .20), rgba(7, 10, 17, .20));
    background-clip: padding-box, padding-box;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .29),
        inset 1px 0 0 rgba(24, 226, 255, .17),
        inset -1px 0 0 rgba(237, 55, 255, .16),
        inset 0 -1px 0 rgba(255, 255, 255, .075),
        0 1px 0 rgba(255, 255, 255, .12),
        0 18px 44px rgba(0, 0, 0, .31);
}

/* Nested content panels must not inherit the sticky panel offset. */
:root[data-theme="glass-neon"] .text-html-form > .options-panel {
    position: relative;
    inset: auto;
}

/* Preserve sidebar geometry after the Glass-neon surface reset. */
@media (min-width: 1181px) {
    :root[data-theme="glass-neon"] body .workspace > aside.panel {
        position: sticky;
        top: 18px;
        right: auto;
        bottom: auto;
        left: auto;
        align-self: start;
    }
}

@media (max-width: 1180px) {
    :root[data-theme="glass-neon"] body .workspace > aside.panel {
        position: static;
        inset: auto;
    }
}

/* Corporat: a red/cyan technical interface inspired by dystopian corporate HUDs. */
:root[data-theme="corporat"] body {
    min-height: 100vh;
    background-color: #05080c;
    background-attachment: fixed;
}

:root[data-theme="corporat"] body::before {
    background-size: auto, 100% 100%;
}

:root[data-theme="corporat"] body::after {
    content: "";
    position: fixed;
    inset: 10px;
    z-index: 0;
    border: 1px solid rgba(255, 65, 69, .13);
    border-top-color: rgba(255, 65, 69, .32);
    border-bottom-color: rgba(86, 233, 241, .12);
    box-shadow:
        inset 5px 0 0 rgba(255, 65, 69, .05),
        inset -2px 0 0 rgba(86, 233, 241, .04);
    pointer-events: none;
}

:root[data-theme="corporat"] .glass-lava-lamp,
:root[data-theme="corporat"] .glass-background-panel {
    display: none !important;
}

:root[data-theme="corporat"] .shell {
    gap: 14px;
}

:root[data-theme="corporat"] :is(
    h1,
    h2,
    h3,
    .tabs__title,
    .tab-group__summary,
    button,
    .button,
    label span
) {
    font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", Arial, sans-serif;
}

:root[data-theme="corporat"] :is(h1, h2, h3) {
    letter-spacing: .025em;
}

:root[data-theme="corporat"] h1 {
    color: #edfefe;
    text-transform: uppercase;
    text-shadow: 2px 0 0 rgba(255, 65, 69, .30);
}

:root[data-theme="corporat"] :is(h2, h3, label > span, .section-head strong) {
    color: #ff6266;
}

:root[data-theme="corporat"] .muted {
    color: #7d9ba3;
}

:root[data-theme="corporat"] :is(
    .topbar,
    .tabs,
    form:not(.transliteration-form):not(.text-html-form),
    .panel,
    .transliteration-toolbar,
    .transliteration-column,
    .editor-pane,
    .image-preview-grid,
    .netcat-article-section,
    .article-block,
    .history-panel
) {
    border: 1px solid rgba(255, 65, 69, .32);
    border-top-color: rgba(255, 88, 92, .55);
    border-radius: 0;
    background:
        linear-gradient(90deg, rgba(255, 65, 69, .11), transparent 22%),
        linear-gradient(135deg, rgba(255, 255, 255, .025), transparent 30%),
        rgba(6, 10, 15, .93);
    box-shadow:
        inset 3px 0 0 rgba(255, 65, 69, .18),
        inset 0 -1px 0 rgba(86, 233, 241, .07),
        0 18px 40px rgba(0, 0, 0, .40);
}

:root[data-theme="corporat"] .topbar {
    border-right-color: rgba(86, 233, 241, .24);
    border-bottom-color: rgba(255, 65, 69, .68);
    padding-block: 18px;
    background:
        linear-gradient(90deg, rgba(117, 27, 33, .38), transparent 42%),
        rgba(7, 10, 15, .95);
    box-shadow:
        inset 4px 0 0 #ff4145,
        inset 0 -2px 0 rgba(255, 65, 69, .22),
        0 16px 38px rgba(0, 0, 0, .42);
}

:root[data-theme="corporat"] .topbar__intro::after {
    content: "CORP_NET // SECURE TERMINAL";
    align-self: flex-end;
    margin: 0 0 3px 8px;
    color: rgba(86, 233, 241, .46);
    font-family: Consolas, "Courier New", monospace;
    font-size: 9px;
    letter-spacing: .12em;
    white-space: nowrap;
}

:root[data-theme="corporat"] :is(
    form:not(.transliteration-form):not(.text-html-form),
    .panel,
    .transliteration-toolbar,
    .transliteration-column,
    .editor-pane,
    .image-preview-grid,
    .netcat-article-section,
    .article-block,
    .history-panel
) {
    position: relative;
}

:root[data-theme="corporat"] :is(
    form:not(.transliteration-form):not(.text-html-form),
    .panel,
    .transliteration-toolbar,
    .transliteration-column,
    .editor-pane,
    .image-preview-grid,
    .netcat-article-section,
    .article-block,
    .history-panel
)::before {
    content: "";
    position: absolute;
    top: -1px;
    right: 18px;
    width: 44px;
    height: 3px;
    background: #56e9f1;
    box-shadow: -50px 0 0 rgba(255, 65, 69, .72);
    pointer-events: none;
}

:root[data-theme="corporat"] .workspace > :is(
    .text-html-form,
    .transliteration-form
) {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0;
}

:root[data-theme="corporat"] .workspace > :is(
    .text-html-form,
    .transliteration-form
)::before,
:root[data-theme="corporat"] .workspace > :is(
    .text-html-form,
    .transliteration-form
)::after {
    content: none !important;
}

:root[data-theme="corporat"] .section {
    border-top-color: rgba(86, 233, 241, .30);
}

:root[data-theme="corporat"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
    textarea,
    select:not(.animated-select__native),
    .animated-select__trigger,
    .CodeMirror,
    .rich-editor
) {
    border: 1px solid rgba(255, 65, 69, .34);
    border-left: 3px solid rgba(255, 65, 69, .72);
    border-radius: 0;
    background:
        linear-gradient(90deg, rgba(255, 65, 69, .06), transparent 24%),
        #090f17;
    color: #70ecf2;
    box-shadow: inset 0 -1px 0 rgba(86, 233, 241, .07);
    clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 7px 100%, 0 calc(100% - 7px));
}

:root[data-theme="corporat"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
    textarea,
    select:not(.animated-select__native),
    .animated-select__trigger,
    .CodeMirror,
    .rich-editor
):hover {
    border-color: rgba(86, 233, 241, .48);
    border-left-color: #56e9f1;
    background:
        linear-gradient(90deg, rgba(86, 233, 241, .07), transparent 24%),
        #0d151e;
}

:root[data-theme="corporat"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
    textarea,
    select:not(.animated-select__native)
):focus,
:root[data-theme="corporat"] .animated-select.is-open .animated-select__trigger,
:root[data-theme="corporat"] .CodeMirror.CodeMirror-focused,
:root[data-theme="corporat"] .rich-editor:focus {
    border-color: #56e9f1;
    border-left-color: #ff4c51;
    background: #0d161e;
    box-shadow:
        inset 3px 0 0 rgba(255, 76, 81, .34),
        0 0 0 2px rgba(86, 233, 241, .08),
        0 0 20px rgba(86, 233, 241, .08);
}

:root[data-theme="corporat"] :is(input, textarea)::placeholder {
    color: #536b72;
    opacity: 1;
}

:root[data-theme="corporat"] select option {
    background: #080d13;
    color: #d9f7f8;
}

:root[data-theme="corporat"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle
    ),
    .button
) {
    min-height: 42px;
    border: 1px solid rgba(255, 79, 83, .72);
    border-left-width: 4px;
    border-radius: 0;
    background:
        linear-gradient(90deg, rgba(255, 106, 109, .20), transparent 36%),
        #a92f35;
    color: #fff6f6;
    box-shadow:
        inset 0 -1px 0 rgba(0, 0, 0, .32),
        0 8px 18px rgba(0, 0, 0, .30);
    text-transform: uppercase;
    letter-spacing: .035em;
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 8px 100%, 0 calc(100% - 8px));
}

:root[data-theme="corporat"] :is(
    button:not(
        .pixel-cat,
        .cat-secret-menu__toggle,
        .cat-theme-option,
        .theme-toggle,
        .menu-toggle,
        .tabs__close,
        .menu-backdrop,
        .animated-select__trigger,
        .animated-select__option,
        .date-picker__toggle,
        .date-picker__nav,
        .date-picker__day,
        .date-picker__footer-button,
        .history-panel__toggle
    ),
    .button
):hover {
    border-color: #56e9f1;
    background:
        linear-gradient(90deg, rgba(86, 233, 241, .12), transparent 38%),
        #bd373d;
    box-shadow:
        inset 4px 0 0 #56e9f1,
        0 0 18px rgba(255, 76, 81, .16),
        0 10px 22px rgba(0, 0, 0, .34);
    transform: translateX(2px);
}

:root[data-theme="corporat"] :is(.button.secondary, button.secondary) {
    border-color: rgba(86, 233, 241, .44);
    border-left-color: #ff4c51;
    background:
        linear-gradient(90deg, rgba(255, 65, 69, .07), transparent 34%),
        #090f16;
    color: #63e9ef;
    box-shadow: none;
}

:root[data-theme="corporat"] :is(.button.secondary, button.secondary):hover {
    border-color: #56e9f1;
    background: rgba(86, 233, 241, .09);
}

:root[data-theme="corporat"] :is(
    button.button-green,
    .button.button-green,
    .generator-deploy-button,
    .account-select__button.is-active
) {
    border-color: #f2e84b;
    border-left-color: #fff86a;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, .18), transparent 34%),
        #d7cc32;
    color: #091014;
    box-shadow:
        inset 0 -2px 0 rgba(96, 84, 0, .34),
        0 0 18px rgba(242, 232, 75, .12);
}

:root[data-theme="corporat"] :is(
    button.button-green,
    .button.button-green,
    .generator-deploy-button,
    .account-select__button.is-active
):hover {
    border-color: #56e9f1;
    background: #eee34b;
    color: #071014;
}

:root[data-theme="corporat"] :is(
    .menu-toggle,
    .tabs__home,
    .tabs__close,
    .theme-toggle,
    .history-panel__toggle
) {
    border: 1px solid rgba(86, 233, 241, .52);
    border-radius: 0;
    background: #090f16;
    color: #62eaf0;
    box-shadow: inset 3px 0 0 #ff4c51;
    clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 7px 100%, 0 calc(100% - 7px));
}

:root[data-theme="corporat"] :is(
    .menu-toggle,
    .tabs__home,
    .tabs__close,
    .theme-toggle,
    .history-panel__toggle
):hover,
:root[data-theme="corporat"] :is(
    .menu-toggle,
    .tabs__home,
    .tabs__close,
    .theme-toggle,
    .history-panel__toggle
):focus-visible {
    border-color: #ff5d61;
    background: rgba(255, 65, 69, .13);
    color: #ffffff;
}

:root[data-theme="corporat"] .tabs {
    width: min(430px, calc(100vw - 18px));
    gap: 0;
    border: 0;
    border-right: 1px solid rgba(255, 76, 81, .34);
    border-radius: 0;
    padding: 16px 12px 24px;
    background:
        repeating-linear-gradient(90deg, rgba(255, 76, 81, .035) 0 1px, transparent 1px 7px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .016) 0 1px, transparent 1px 4px),
        linear-gradient(90deg, rgba(83, 12, 17, .90), rgba(35, 10, 15, .94) 62%, rgba(7, 10, 15, .96));
    box-shadow:
        inset -1px 0 0 rgba(86, 233, 241, .08),
        24px 0 64px rgba(0, 0, 0, .54);
    backdrop-filter: blur(9px);
}

:root[data-theme="corporat"] .tabs__list {
    gap: 0;
    padding: 6px 0 0;
}

:root[data-theme="corporat"] .tab-group {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

:root[data-theme="corporat"] .tab-group__summary {
    display: none;
}

:root[data-theme="corporat"] .tab-group__items {
    display: block;
    height: auto !important;
    overflow: visible;
    border-top: 0;
    background: transparent;
    opacity: 1 !important;
    transform: none !important;
}

:root[data-theme="corporat"] .tab-group__items-inner {
    gap: 2px;
    overflow: visible;
    padding: 0;
}

:root[data-theme="corporat"] .tabs__list .tab {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 54px;
    border: 1px solid transparent;
    border-radius: 0;
    padding: 8px 16px;
    color: #ff5d61;
    background: transparent;
    box-shadow: none;
    font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", Arial, sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.15;
    text-transform: uppercase;
    letter-spacing: .018em;
    transition:
        border-color .16s ease,
        background .16s ease,
        color .16s ease,
        padding-left .16s ease;
}

/* Side-menu pinning and the larger invisible target around the menu button. */
:root {
    --app-side-menu-width: 330px;
}

:root[data-theme="corporat"] {
    --app-side-menu-width: 430px;
}

.menu-toggle-zone {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    margin: -8px;
    cursor: pointer;
}

:root body .menu-toggle {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
}

.tabs {
    width: min(var(--app-side-menu-width), calc(100vw - 24px));
}

.tabs__list {
    flex: 0 0 auto;
    align-content: start;
}

.tabs__footer {
    position: sticky;
    bottom: -14px;
    z-index: 2;
    margin: auto -14px -14px;
    padding: 10px 14px 14px;
    background: linear-gradient(0deg, color-mix(in srgb, var(--panel-bg) 98%, var(--bg)) 76%, transparent);
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .26s ease, transform .38s cubic-bezier(.22, 1, .36, 1);
}

body.is-menu-open .tabs__footer,
html.is-menu-pinned .tabs__footer {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .18s;
}

:root body .tabs__pin {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    width: 100%;
    min-height: 62px;
    margin: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 8px 10px;
    background: color-mix(in srgb, var(--surface-soft) 88%, transparent);
    color: var(--text);
    box-shadow: none;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

:root body .tabs__pin:hover,
:root body .tabs__pin:focus-visible {
    border-color: var(--accent);
    background: var(--tab-hover-bg);
    color: var(--tab-hover-color);
    box-shadow: none;
    outline: none;
}

.tabs__pin-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: var(--accent-soft);
    color: var(--accent);
}

.tabs__pin-icon svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
    transition: transform .22s ease;
}

.tabs__pin-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.tabs__pin-copy strong,
.tabs__pin-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tabs__pin-copy strong {
    font-size: 13px;
    line-height: 1.25;
}

.tabs__pin-copy small {
    color: var(--muted);
    font-size: 10px;
    line-height: 1.25;
}

.tabs__pin-switch {
    position: relative;
    display: block;
    width: 42px;
    height: 24px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: color-mix(in srgb, var(--surface) 88%, var(--bg));
    transition: border-color .2s ease, background .2s ease;
}

.tabs__pin-switch > span {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--muted);
    transition: transform .22s cubic-bezier(.22, 1, .36, 1), background .2s ease;
}

.tabs__pin[aria-checked="true"] {
    border-color: color-mix(in srgb, var(--accent) 68%, var(--line));
    background: var(--accent-soft);
}

.tabs__pin[aria-checked="true"] .tabs__pin-icon svg {
    transform: rotate(36deg);
}

.tabs__pin[aria-checked="true"] .tabs__pin-switch {
    border-color: var(--accent);
    background: var(--accent);
}

.tabs__pin[aria-checked="true"] .tabs__pin-switch > span {
    background: var(--accent-contrast);
    transform: translateX(18px);
}

@media (min-width: 960px) {
    html.is-menu-pinned body {
        padding-left: 0;
        overflow: auto;
    }

    html.is-menu-pinned.is-menu-pinned-needs-space body {
        padding-left: var(--app-pinned-menu-width, var(--app-side-menu-width));
    }

    :root.is-menu-pinned[data-theme] .shell .tabs {
        width: min(var(--app-pinned-menu-width, var(--app-side-menu-width)), calc(100vw - 24px));
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
        transform: translate3d(0, 0, 0);
        border: 0;
        border-radius: 0;
        box-shadow: 10px 0 30px rgba(0, 0, 0, .24);
        transition-delay: 0s;
    }

    html.is-menu-pinned .tabs__head,
    html.is-menu-pinned .tabs__list {
        opacity: 1;
        transform: none;
        transition-delay: 0s;
    }

    html.is-menu-pinned .menu-backdrop,
    html.is-menu-pinned .tabs__close,
    html.is-menu-pinned .menu-toggle-zone,
    html.is-menu-pinned .menu-toggle {
        display: none;
    }
}

@media (max-width: 959px) {
    .tabs__footer {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tabs__footer,
    .tabs__pin-icon svg,
    .tabs__pin-switch,
    .tabs__pin-switch > span {
        transition: none;
    }
}

:root[data-theme="corporat"] .tabs__list .tab:hover,
:root[data-theme="corporat"] .tabs__list .tab:focus-visible {
    border-color: rgba(255, 76, 81, .54);
    color: #ffffff;
    background:
        linear-gradient(90deg, rgba(255, 76, 81, .15), transparent 82%),
        rgba(53, 12, 17, .32);
    outline: none;
    padding-left: 21px;
    transform: none;
}

:root[data-theme="corporat"] .tabs__list .tab.active {
    border: 2px solid #f2e84b;
    padding-right: 55px;
    color: #f6ec4b;
    background:
        linear-gradient(90deg, rgba(115, 59, 18, .23), transparent 76%),
        rgba(40, 10, 14, .60);
    box-shadow:
        inset 0 0 18px rgba(242, 232, 75, .025),
        0 0 12px rgba(242, 232, 75, .05);
    padding-left: 14px;
    clip-path: polygon(0 0, calc(100% - 11px) 0, 100% 11px, 100% calc(100% - 11px), calc(100% - 11px) 100%, 0 100%);
}

:root[data-theme="corporat"] .tabs__list .tab.active::before {
    content: "";
    position: absolute;
    top: 12px;
    right: 13px;
    width: 34px;
    height: 16px;
    background: center / 34px 16px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 22'%3E%3Cg fill='%23e7af32'%3E%3Cpath d='M0 0h18v3H0zM0 5h30v3H0zM0 10h18v3H0zM0 15h30v3H0zM0 20h18v2H0z'/%3E%3Cpath d='M32 0h14v3H32zM25 5h21v3H25zM32 10h14v3H32zM25 15h21v3H25zM32 20h14v2H32z'/%3E%3C/g%3E%3C/svg%3E");
    filter: drop-shadow(0 0 3px rgba(231, 175, 50, .28));
    opacity: .96;
}

:root[data-theme="corporat"] .tabs__list .tab.active::after {
    content: "PROTOCOL\A 4620-A44";
    position: absolute;
    top: 30px;
    right: 11px;
    width: 39px;
    color: #e7af32;
    font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
    font-size: 4px;
    font-weight: 900;
    line-height: .98;
    text-align: center;
    white-space: pre;
    letter-spacing: .12em;
    text-shadow: 0 0 3px rgba(231, 175, 50, .24);
    opacity: .96;
}

:root[data-theme="corporat"] .animated-select__panel {
    border: 1px solid rgba(255, 65, 69, .55);
    border-radius: 0;
    background: #070c12;
    box-shadow:
        inset 3px 0 0 rgba(255, 65, 69, .25),
        0 18px 36px rgba(0, 0, 0, .52);
    padding: 5px;
}

:root[data-theme="corporat"] .animated-select__listbox {
    gap: 2px;
}

:root[data-theme="corporat"] .animated-select__option {
    border-radius: 0;
    color: #9ab1b6;
}

:root[data-theme="corporat"] .animated-select__option:hover,
:root[data-theme="corporat"] .animated-select__option:focus-visible {
    border-color: rgba(86, 233, 241, .32);
    background: rgba(86, 233, 241, .07);
    color: #6cecf2;
}

:root[data-theme="corporat"] .animated-select__option.is-selected {
    border-color: #ff4c51;
    border-left-width: 4px;
    background: rgba(137, 34, 40, .58);
    color: #72edf2;
}

:root[data-theme="corporat"] :is(
    .check-option,
    .transliteration-checkbox
) {
    border: 1px solid rgba(255, 65, 69, .30);
    border-radius: 0;
    background: #090f16;
    color: #a6bcc0;
    clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 6px 100%, 0 calc(100% - 6px));
}

:root[data-theme="corporat"] :is(
    .check-option,
    .transliteration-checkbox
):has(input:checked) {
    border-color: #56e9f1;
    background:
        linear-gradient(90deg, rgba(86, 233, 241, .10), transparent 45%),
        #0a1219;
    color: #dffeff;
}

:root[data-theme="corporat"] :is(
    .check-option input[type="checkbox"],
    .transliteration-checkbox input[type="checkbox"]
) {
    accent-color: #56e9f1;
}

:root[data-theme="corporat"] .gluing-mode-switch__track {
    border: 1px solid rgba(255, 65, 69, .52);
    border-radius: 0;
    background: #090e15;
    box-shadow: inset 3px 0 0 rgba(255, 65, 69, .25);
    clip-path: polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 6px 100%, 0 calc(100% - 6px));
}

:root[data-theme="corporat"] .gluing-mode-switch__thumb {
    border-radius: 0;
    background: #ff5257;
    box-shadow: none;
}

:root[data-theme="corporat"] .gluing-mode-switch input:checked + .gluing-mode-switch__track {
    border-color: #56e9f1;
    background: rgba(86, 233, 241, .12);
    box-shadow: inset -3px 0 0 rgba(86, 233, 241, .28);
}

:root[data-theme="corporat"] .gluing-mode-switch input:checked + .gluing-mode-switch__track .gluing-mode-switch__thumb {
    background: #56e9f1;
}

:root[data-theme="corporat"] .file-upload__box {
    border: 1px dashed rgba(86, 233, 241, .45);
    border-radius: 0;
    background:
        linear-gradient(90deg, rgba(255, 65, 69, .06), transparent 24%),
        #090f16;
    clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 9px 100%, 0 calc(100% - 9px));
}

:root[data-theme="corporat"] .file-upload:hover .file-upload__box,
:root[data-theme="corporat"] .file-upload input[type="file"]:focus-visible + .file-upload__box,
:root[data-theme="corporat"] .file-upload.has-file .file-upload__box {
    border-color: #ff4c51;
    background: rgba(255, 65, 69, .08);
}

:root[data-theme="corporat"] .page-image-converter .range-field {
    position: relative;
    display: block;
    width: 100%;
    min-height: 44px;
    overflow: hidden;
    border: 1px solid rgba(255, 76, 81, .66);
    background:
        linear-gradient(180deg, rgba(255, 65, 69, .028), transparent 55%),
        #090e16;
    box-shadow:
        inset 0 -1px 0 rgba(86, 233, 241, .04),
        0 0 10px rgba(255, 65, 69, .04);
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
}

:root[data-theme="corporat"] .page-image-converter .range-field > span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

:root[data-theme="corporat"] .page-image-converter .range-field::before,
:root[data-theme="corporat"] .page-image-converter .range-field::after {
    position: absolute;
    top: 50%;
    z-index: 4;
    color: #56e9f1;
    font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", Arial, sans-serif;
    font-size: 32px;
    font-weight: 300;
    line-height: 1;
    pointer-events: none;
    text-shadow: 0 0 8px rgba(86, 233, 241, .20);
    transform: translateY(-54%);
}

:root[data-theme="corporat"] .page-image-converter .range-field::before {
    content: "〈";
    left: 8px;
}

:root[data-theme="corporat"] .page-image-converter .range-field::after {
    content: "〉";
    right: 8px;
}

:root[data-theme="corporat"] .page-image-converter .range-field input[type="range"] {
    position: absolute;
    top: 0;
    left: 84px;
    z-index: 2;
    width: calc(100% - 168px);
    height: 44px;
    margin: 0;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    border-radius: 0;
    outline: none;
    background: transparent;
    box-shadow: none;
    cursor: ew-resize;
    clip-path: none;
}

:root[data-theme="corporat"] .page-image-converter .range-field input[type="range"]::-webkit-slider-runnable-track {
    height: 3px;
    border: 0;
    border-radius: 0;
    background: rgba(132, 38, 44, .76);
    box-shadow: none;
}

:root[data-theme="corporat"] .page-image-converter .range-field input[type="range"]::-webkit-slider-thumb {
    width: 84px;
    height: 38px;
    margin-top: -18px;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    clip-path: none;
}

:root[data-theme="corporat"] .page-image-converter .range-field input[type="range"]::-moz-range-track {
    height: 3px;
    border: 0;
    border-radius: 0;
    background: rgba(132, 38, 44, .76);
    box-shadow: none;
}

:root[data-theme="corporat"] .page-image-converter .range-field input[type="range"]::-moz-range-progress {
    height: 3px;
    background: transparent;
}

:root[data-theme="corporat"] .page-image-converter .range-field input[type="range"]::-moz-range-thumb {
    width: 84px;
    height: 38px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

:root[data-theme="corporat"] .page-image-converter .range-field__corporat-value {
    position: absolute;
    top: 3px;
    bottom: 3px;
    left: var(--corporat-range-position, 50%);
    z-index: 3;
    display: grid;
    place-items: center;
    width: 84px;
    border: 1px solid rgba(255, 83, 87, .86);
    background:
        linear-gradient(90deg, rgba(255, 65, 69, .15), transparent 52%),
        rgba(67, 19, 24, .46);
    color: #56e9f1;
    font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", Arial, sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 1;
    text-shadow: 0 0 8px rgba(86, 233, 241, .24);
    pointer-events: none;
    transform: translateX(-50%);
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%);
}

:root[data-theme="corporat"] .page-image-converter .range-field input[type="range"]:focus-visible {
    filter: drop-shadow(0 0 4px rgba(86, 233, 241, .26));
}

:root[data-theme="corporat"] .page-image-converter .range-field:focus-within {
    border-color: rgba(255, 76, 81, .78);
    box-shadow:
        inset 0 -1px 0 rgba(86, 233, 241, .05),
        0 0 8px rgba(255, 65, 69, .10);
}

:root[data-theme="corporat"] .date-picker__panel {
    border: 1px solid rgba(255, 65, 69, .62);
    border-radius: 0;
    background:
        linear-gradient(90deg, rgba(255, 65, 69, .08), transparent 35%),
        #070c12;
    box-shadow:
        inset 3px 0 0 rgba(255, 65, 69, .24),
        0 20px 42px rgba(0, 0, 0, .58);
    backdrop-filter: none;
}

:root[data-theme="corporat"] .date-picker__month,
:root[data-theme="corporat"] .date-picker__weekdays {
    color: #63e9ef;
    text-transform: uppercase;
}

:root[data-theme="corporat"] .date-picker .date-picker__nav {
    border: 1px solid rgba(86, 233, 241, .32);
    border-radius: 0;
    color: #62e8ef;
}

:root[data-theme="corporat"] .date-picker .date-picker__day {
    border-radius: 0;
    color: #b8ced2;
}

:root[data-theme="corporat"] .date-picker .date-picker__day:hover:not(:disabled),
:root[data-theme="corporat"] .date-picker .date-picker__day:focus-visible {
    background: rgba(86, 233, 241, .09);
    color: #6cecf2;
    box-shadow: inset 0 0 0 1px rgba(86, 233, 241, .32);
}

:root[data-theme="corporat"] .date-picker .date-picker__day.is-selected,
:root[data-theme="corporat"] .date-picker .date-picker__day.is-selected:hover,
:root[data-theme="corporat"] .date-picker .date-picker__day.is-selected:focus-visible {
    background: #a72f35;
    color: #ffffff;
    box-shadow:
        inset 3px 0 0 #56e9f1,
        inset 0 -2px 0 rgba(255, 255, 255, .10);
}

:root[data-theme="corporat"] .date-picker__footer {
    border-top-color: rgba(255, 65, 69, .32);
}

:root[data-theme="corporat"] .date-picker .date-picker__footer-button {
    border-radius: 0;
    color: #62e8ef;
}

:root[data-theme="corporat"] .history-item,
:root[data-theme="corporat"] .account-select__button {
    border-radius: 0;
}

:root[data-theme="corporat"] .history-item:hover {
    border-color: rgba(86, 233, 241, .34);
    background: rgba(86, 233, 241, .05);
}

:root[data-theme="corporat"] .cat-secret-menu__panel {
    color: #d9f7f8;
}

:root[data-theme="corporat"] .cat-theme-option {
    border-radius: 0;
}

:root[data-theme="corporat"] .cat-theme-option.is-active {
    border-color: #56e9f1;
    background: rgba(86, 233, 241, .09);
    box-shadow: inset 3px 0 0 #ff4c51;
}

:root[data-theme="corporat"] ::selection {
    background: #9d3036;
    color: #ffffff;
}

:root[data-theme="corporat"] * {
    scrollbar-color: #ff4c51 #080d13;
}

.cat-secret-menu,
.cat-secret-menu__surface {
    height: 208px;
}

.cat-secret-menu__panel {
    height: 156px;
    min-height: 156px;
}

.cat-theme-list {
    grid-template-rows: 13px repeat(3, 40px);
}

:root[data-theme="corporat"] .text-html-form > .options-panel {
    position: relative;
    inset: auto;
}

@media (min-width: 1181px) {
    :root[data-theme="corporat"] body .workspace > aside.panel {
        position: sticky;
        top: 18px;
        right: auto;
        bottom: auto;
        left: auto;
        align-self: start;
    }
}

@media (max-width: 1180px) {
    :root[data-theme="corporat"] body .workspace > aside.panel {
        position: static;
        inset: auto;
    }
}

@media (max-width: 760px) {
    :root[data-theme="corporat"] .topbar__intro::after {
        display: none;
    }

    :root[data-theme="corporat"] body::after {
        inset: 5px;
    }
}

/* Dashboard: Terraria */
:root[data-theme="terraria"] .page-dashboard .dashboard-hero {
    border: 3px solid #79532d;
    border-radius: 5px;
    padding-top: clamp(34px, 5vw, 62px);
    background:
        linear-gradient(rgba(35, 66, 78, .91), rgba(29, 55, 68, .94)),
        #243f50;
    box-shadow:
        inset 2px 2px 0 rgba(255, 231, 164, .24),
        inset -3px -3px 0 rgba(20, 26, 24, .58),
        0 5px 0 #17251f,
        0 8px 0 rgba(118, 79, 40, .72);
    clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
}

:root[data-theme="terraria"] .page-dashboard .dashboard-hero::before,
:root[data-theme="terraria"] .page-dashboard .dashboard-hero::after {
    width: 230px;
    height: 150px;
    border: 1px solid rgba(159, 226, 99, .13);
    border-radius: 0;
    background:
        linear-gradient(90deg, transparent 49%, rgba(159, 226, 99, .08) 50% 51%, transparent 52%),
        linear-gradient(transparent 49%, rgba(159, 226, 99, .08) 50% 51%, transparent 52%);
    background-size: 16px 16px;
    opacity: .6;
    transform: none;
}

:root[data-theme="terraria"] .page-dashboard .dashboard-hero::before {
    top: 0;
    left: 0;
}

:root[data-theme="terraria"] .page-dashboard .dashboard-hero::after {
    right: 0;
    bottom: 0;
}

:root[data-theme="terraria"] .page-dashboard .dashboard-hero h2,
:root[data-theme="terraria"] .page-dashboard .dashboard-hero > p,
:root[data-theme="terraria"] .page-dashboard .tool-card {
    font-family: Consolas, "Courier New", monospace;
}

:root[data-theme="terraria"] .page-dashboard .dashboard-hero h2 {
    color: #fff0b0;
    letter-spacing: -.02em;
    text-shadow:
        3px 3px 0 #5c452b,
        0 0 2px #111a17;
}

:root[data-theme="terraria"] .page-dashboard .dashboard-hero > p {
    color: #d9c98d;
    text-shadow: 1px 1px 0 #243128;
}

:root[data-theme="terraria"] .page-dashboard .dashboard-filter {
    min-height: 40px;
    border: 2px solid #684421;
    border-radius: 2px;
    background:
        linear-gradient(180deg, rgba(255, 239, 190, .16), transparent 34%),
        linear-gradient(180deg, #81552c, #53331d);
    color: #ffe5a1;
    box-shadow:
        inset 2px 2px 0 rgba(255, 221, 147, .22),
        inset -2px -2px 0 #2b1b12,
        2px 3px 0 rgba(17, 23, 19, .76);
    font-family: Consolas, "Courier New", monospace;
    text-shadow: 1px 1px 0 #352013;
    clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% calc(100% - 5px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 5px), 0 5px);
    transform: none;
}

:root[data-theme="terraria"] .page-dashboard .dashboard-filter:hover,
:root[data-theme="terraria"] .page-dashboard .dashboard-filter:focus-visible {
    border-color: #b88a47;
    background:
        linear-gradient(180deg, rgba(255, 244, 194, .22), transparent 38%),
        linear-gradient(180deg, #95683a, #654022);
    color: #fff3bf;
    filter: brightness(1.05);
    transform: translateY(-1px);
}

:root[data-theme="terraria"] .page-dashboard .dashboard-filter.is-active {
    border-color: #567d35;
    background:
        linear-gradient(180deg, rgba(222, 255, 176, .18), transparent 38%),
        linear-gradient(180deg, #5f903e, #355b2c);
    color: #f4ffd4;
    box-shadow:
        inset 2px 2px 0 rgba(221, 255, 178, .24),
        inset -2px -2px 0 #1d3b20,
        2px 3px 0 rgba(17, 23, 19, .76);
}

:root[data-theme="terraria"] .page-dashboard .tool-card {
    min-height: 264px;
    border: 2px solid #76502d;
    border-radius: 0;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .07), transparent 35%),
        linear-gradient(160deg, #304f61, #243b4c 74%);
    box-shadow:
        inset 2px 2px 0 rgba(232, 226, 176, .10),
        inset -3px -3px 0 rgba(19, 27, 30, .38),
        0 4px 0 #192c31,
        3px 7px 0 rgba(52, 36, 23, .48);
    clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
    transition: transform .1s ease, filter .1s ease, border-color .1s ease;
}

:root[data-theme="terraria"] .page-dashboard .tool-card::after {
    top: -48px;
    right: -48px;
    width: 126px;
    height: 126px;
    border-radius: 0;
    background: var(--tool-accent);
    opacity: .08;
    transform: rotate(45deg);
}

:root[data-theme="terraria"] .page-dashboard .tool-card:hover,
:root[data-theme="terraria"] .page-dashboard .tool-card:focus-visible {
    border-color: color-mix(in srgb, var(--tool-accent) 55%, #a47742);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .10), transparent 38%),
        linear-gradient(160deg, #385a6d, #294457 74%);
    box-shadow:
        inset 2px 2px 0 rgba(255, 242, 193, .13),
        inset -3px -3px 0 rgba(19, 27, 30, .42),
        0 5px 0 #192c31,
        3px 8px 0 rgba(52, 36, 23, .52);
    filter: brightness(1.05);
    transform: translateY(-2px);
}

:root[data-theme="terraria"] .page-dashboard .tool-card__icon {
    border: 2px solid color-mix(in srgb, var(--tool-accent) 48%, #7d6337);
    border-radius: 3px;
    background: color-mix(in srgb, var(--tool-accent) 13%, #244357);
    box-shadow:
        inset 1px 1px 0 rgba(255, 255, 255, .13),
        2px 2px 0 rgba(18, 27, 26, .56);
}

:root[data-theme="terraria"] .page-dashboard .tool-card__group {
    color: #c5b777;
}

:root[data-theme="terraria"] .page-dashboard .tool-card__copy strong {
    color: #ffefb2;
    text-shadow: 2px 2px 0 #2f382e;
}

:root[data-theme="terraria"] .page-dashboard .tool-card__copy > span {
    color: #d1c28a;
}

/* Dashboard: Glass-neon */
:root[data-theme="glass-neon"] .page-dashboard .dashboard-hero {
    border: 1px solid transparent;
    border-radius: 34px;
    background:
        radial-gradient(75% 115% at 10% -18%, rgba(78, 182, 255, .26), transparent 55%),
        radial-gradient(66% 110% at 92% 118%, rgba(201, 74, 255, .24), transparent 56%),
        linear-gradient(145deg, rgba(17, 24, 41, .65), rgba(5, 7, 14, .78)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .55), rgba(84, 169, 255, .18) 35%, rgba(211, 88, 255, .40) 70%, rgba(255, 255, 255, .16)) border-box;
    box-shadow:
        inset 0 2px 2px rgba(255, 255, 255, .16),
        inset 0 -9px 20px rgba(100, 55, 180, .13),
        -18px 14px 58px rgba(24, 148, 255, .16),
        20px 18px 62px rgba(178, 52, 255, .17),
        0 28px 74px rgba(0, 0, 0, .48);
    backdrop-filter: blur(32px) saturate(1.3);
    -webkit-backdrop-filter: blur(32px) saturate(1.3);
}

:root[data-theme="glass-neon"] .page-dashboard .dashboard-hero::before,
:root[data-theme="glass-neon"] .page-dashboard .dashboard-hero::after {
    border: 0;
    border-radius: 50%;
    filter: blur(18px);
    opacity: .32;
}

:root[data-theme="glass-neon"] .page-dashboard .dashboard-hero::before {
    background: rgba(70, 190, 255, .52);
}

:root[data-theme="glass-neon"] .page-dashboard .dashboard-hero::after {
    background: rgba(196, 76, 255, .52);
}

:root[data-theme="glass-neon"] .page-dashboard .dashboard-hero h2 {
    background: linear-gradient(105deg, #ffffff, #bfe8ff 43%, #e7c8ff 78%, #ffffff);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    text-shadow: 0 12px 38px rgba(110, 117, 255, .22);
}

:root[data-theme="glass-neon"] .page-dashboard .dashboard-hero > p {
    color: rgba(221, 230, 252, .72);
}

:root[data-theme="glass-neon"] .page-dashboard .dashboard-filter {
    min-height: 42px;
    border: 1px solid transparent;
    border-radius: 999px;
    background:
        radial-gradient(90% 100% at 50% -35%, rgba(255, 255, 255, .30), transparent 54%),
        linear-gradient(155deg, rgba(21, 30, 48, .76), rgba(7, 9, 17, .82)) padding-box,
        linear-gradient(130deg, rgba(255, 255, 255, .42), rgba(88, 177, 255, .22), rgba(194, 83, 255, .30)) border-box;
    color: rgba(220, 231, 255, .76);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .18),
        0 8px 24px rgba(0, 0, 0, .28);
    backdrop-filter: blur(18px) saturate(1.22);
    -webkit-backdrop-filter: blur(18px) saturate(1.22);
}

:root[data-theme="glass-neon"] .page-dashboard .dashboard-filter:hover,
:root[data-theme="glass-neon"] .page-dashboard .dashboard-filter:focus-visible {
    color: #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .27),
        0 0 28px rgba(99, 152, 255, .20),
        0 10px 28px rgba(0, 0, 0, .34);
}

:root[data-theme="glass-neon"] .page-dashboard .dashboard-filter.is-active {
    border-color: rgba(235, 239, 255, .56);
    background:
        radial-gradient(90% 100% at 50% -25%, rgba(255, 255, 255, .42), transparent 52%),
        linear-gradient(135deg, rgba(65, 156, 255, .82), rgba(139, 72, 255, .82) 58%, rgba(210, 66, 255, .68));
    color: #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .40),
        0 0 30px rgba(113, 103, 255, .38),
        0 12px 30px rgba(0, 0, 0, .34);
}

:root[data-theme="glass-neon"] .page-dashboard .tool-card {
    min-height: 260px;
    border: 1px solid transparent;
    border-radius: 24px;
    background:
        radial-gradient(110% 80% at 18% -15%, color-mix(in srgb, var(--tool-accent) 18%, transparent), transparent 52%),
        linear-gradient(145deg, rgba(18, 24, 39, .70), rgba(6, 8, 15, .80)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .42), color-mix(in srgb, var(--tool-accent) 34%, transparent) 46%, rgba(180, 83, 255, .25)) border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .14),
        inset 0 -1px 0 rgba(255, 255, 255, .035),
        0 20px 52px rgba(0, 0, 0, .38);
    backdrop-filter: blur(26px) saturate(1.25);
    -webkit-backdrop-filter: blur(26px) saturate(1.25);
}

:root[data-theme="glass-neon"] .page-dashboard .tool-card::after {
    top: -58px;
    right: -54px;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: var(--tool-accent);
    filter: blur(14px);
    opacity: .12;
}

:root[data-theme="glass-neon"] .page-dashboard .tool-card:hover,
:root[data-theme="glass-neon"] .page-dashboard .tool-card:focus-visible {
    border-color: transparent;
    background:
        radial-gradient(110% 80% at 18% -15%, color-mix(in srgb, var(--tool-accent) 26%, transparent), transparent 54%),
        linear-gradient(145deg, rgba(24, 32, 52, .76), rgba(7, 9, 18, .84)) padding-box,
        linear-gradient(135deg, rgba(255, 255, 255, .62), color-mix(in srgb, var(--tool-accent) 52%, transparent) 46%, rgba(196, 94, 255, .40)) border-box;
    box-shadow:
        inset 0 2px 1px rgba(255, 255, 255, .18),
        0 0 32px color-mix(in srgb, var(--tool-accent) 18%, transparent),
        0 28px 68px rgba(0, 0, 0, .48);
    transform: translateY(-6px) scale(1.008);
}

:root[data-theme="glass-neon"] .page-dashboard .tool-card__icon {
    border: 1px solid color-mix(in srgb, var(--tool-accent) 50%, rgba(255, 255, 255, .30));
    border-radius: 15px;
    background:
        radial-gradient(circle at 28% 12%, rgba(255, 255, 255, .30), transparent 34%),
        color-mix(in srgb, var(--tool-accent) 20%, rgba(8, 12, 22, .76));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .24),
        0 0 22px color-mix(in srgb, var(--tool-accent) 20%, transparent);
}

:root[data-theme="glass-neon"] .page-dashboard .tool-card__group {
    color: rgba(207, 220, 248, .60);
}

:root[data-theme="glass-neon"] .page-dashboard .tool-card__copy strong {
    color: #f5f8ff;
}

:root[data-theme="glass-neon"] .page-dashboard .tool-card__copy > span {
    color: rgba(207, 219, 244, .68);
}

/* Dashboard: Corporat */
:root[data-theme="corporat"] .page-dashboard .dashboard-hero {
    border: 1px solid rgba(86, 233, 241, .34);
    border-left: 5px solid #ff4c51;
    border-radius: 0;
    background:
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .016) 0 1px, transparent 1px 5px),
        linear-gradient(90deg, rgba(91, 19, 25, .24), transparent 30%),
        linear-gradient(145deg, rgba(10, 15, 22, .96), rgba(3, 8, 12, .98));
    box-shadow:
        inset 0 1px 0 rgba(86, 233, 241, .12),
        inset -2px 0 0 rgba(86, 233, 241, .10),
        0 22px 48px rgba(0, 0, 0, .52);
    clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));
}

:root[data-theme="corporat"] .page-dashboard .dashboard-hero::before,
:root[data-theme="corporat"] .page-dashboard .dashboard-hero::after {
    width: 220px;
    height: 1px;
    border: 0;
    border-radius: 0;
    opacity: .72;
    transform: none;
}

:root[data-theme="corporat"] .page-dashboard .dashboard-hero::before {
    top: 18px;
    left: 18px;
    background: linear-gradient(90deg, #ff4c51, transparent);
    box-shadow: 0 6px 0 rgba(255, 76, 81, .18);
}

:root[data-theme="corporat"] .page-dashboard .dashboard-hero::after {
    right: 18px;
    bottom: 18px;
    background: linear-gradient(90deg, transparent, #56e9f1);
    box-shadow: 0 -6px 0 rgba(86, 233, 241, .12);
}

:root[data-theme="corporat"] .page-dashboard .dashboard-hero h2 {
    max-width: 980px;
    color: #f0feff;
    font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", Arial, sans-serif;
    letter-spacing: .015em;
    text-transform: uppercase;
    text-shadow:
        3px 0 0 rgba(255, 76, 81, .28),
        -2px 0 0 rgba(86, 233, 241, .14);
}

:root[data-theme="corporat"] .page-dashboard .dashboard-hero > p {
    color: #829da4;
}

:root[data-theme="corporat"] .page-dashboard .dashboard-filter {
    min-height: 40px;
    border: 1px solid rgba(86, 233, 241, .34);
    border-radius: 0;
    background:
        linear-gradient(90deg, rgba(255, 76, 81, .10), transparent 46%),
        #090f16;
    color: #83adb3;
    box-shadow: inset 3px 0 0 rgba(255, 76, 81, .56);
    font-family: Consolas, "Courier New", monospace;
    letter-spacing: .03em;
    text-transform: uppercase;
    clip-path: polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 7px 100%, 0 calc(100% - 7px));
}

:root[data-theme="corporat"] .page-dashboard .dashboard-filter:hover,
:root[data-theme="corporat"] .page-dashboard .dashboard-filter:focus-visible {
    border-color: #56e9f1;
    background:
        linear-gradient(90deg, rgba(255, 76, 81, .18), transparent 52%),
        #0d1720;
    color: #dffeff;
    box-shadow:
        inset 4px 0 0 #ff4c51,
        0 0 18px rgba(86, 233, 241, .10);
}

:root[data-theme="corporat"] .page-dashboard .dashboard-filter.is-active {
    border-color: #ff5d61;
    background:
        linear-gradient(90deg, rgba(86, 233, 241, .16), transparent 54%),
        #7f252b;
    color: #ffffff;
    box-shadow:
        inset 4px 0 0 #56e9f1,
        0 0 20px rgba(255, 76, 81, .16);
}

:root[data-theme="corporat"] .page-dashboard .tool-card {
    min-height: 264px;
    border: 1px solid rgba(86, 233, 241, .26);
    border-left: 4px solid #ff4c51;
    border-radius: 0;
    background:
        linear-gradient(135deg, transparent 0 76%, rgba(86, 233, 241, .045) 76% 100%),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 4px),
        linear-gradient(150deg, #0c141d, #060b11 76%);
    box-shadow:
        inset -1px 0 0 rgba(86, 233, 241, .12),
        8px 10px 0 rgba(0, 0, 0, .22);
    clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
}

:root[data-theme="corporat"] .page-dashboard .tool-card::after {
    inset: 0;
    width: auto;
    height: auto;
    border-radius: 0;
    background:
        linear-gradient(90deg, transparent 0 70%, color-mix(in srgb, var(--tool-accent) 5%, transparent)),
        repeating-linear-gradient(90deg, transparent 0 24px, rgba(86, 233, 241, .018) 24px 25px);
    opacity: .7;
    transform: none;
}

:root[data-theme="corporat"] .page-dashboard .tool-card:hover,
:root[data-theme="corporat"] .page-dashboard .tool-card:focus-visible {
    border-color: color-mix(in srgb, var(--tool-accent) 68%, #56e9f1);
    border-left-color: #ff5d61;
    background:
        linear-gradient(135deg, transparent 0 76%, color-mix(in srgb, var(--tool-accent) 8%, transparent) 76% 100%),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 4px),
        linear-gradient(150deg, #111d28, #080e15 76%);
    box-shadow:
        inset -1px 0 0 rgba(86, 233, 241, .20),
        0 0 20px color-mix(in srgb, var(--tool-accent) 10%, transparent),
        10px 12px 0 rgba(0, 0, 0, .26);
    transform: translate(3px, -3px);
}

:root[data-theme="corporat"] .page-dashboard .tool-card__icon {
    border: 1px solid color-mix(in srgb, var(--tool-accent) 62%, #56e9f1);
    border-radius: 0;
    background: #0b141d;
    box-shadow:
        inset 3px 0 0 #ff4c51,
        0 0 15px color-mix(in srgb, var(--tool-accent) 12%, transparent);
    clip-path: polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 7px 100%, 0 calc(100% - 7px));
}

:root[data-theme="corporat"] .page-dashboard .tool-card__group {
    color: #718f96;
    font-family: Consolas, "Courier New", monospace;
    letter-spacing: .08em;
    text-transform: uppercase;
}

:root[data-theme="corporat"] .page-dashboard .tool-card__copy strong {
    color: #f1feff;
    font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", Arial, sans-serif;
    letter-spacing: .02em;
    text-transform: uppercase;
}

:root[data-theme="corporat"] .page-dashboard .tool-card__copy > span {
    color: #829da4;
}

:root[data-theme="corporat"] .page-dashboard .tool-card__action {
    font-family: Consolas, "Courier New", monospace;
    letter-spacing: .08em;
}

@media (max-width: 720px) {
    :root[data-theme="terraria"] .page-dashboard .dashboard-hero,
    :root[data-theme="glass-neon"] .page-dashboard .dashboard-hero,
    :root[data-theme="corporat"] .page-dashboard .dashboard-hero {
        padding-top: 34px;
    }

    :root[data-theme="glass-neon"] .page-dashboard .dashboard-hero {
        border-radius: 24px;
    }
}

/* The hosting switch keeps the compact side-menu-switch shape in every theme. */
:root[data-theme] .page-site-generator button.hosting-provider-toggle,
:root[data-theme] .page-site-generator button.hosting-provider-toggle:hover,
:root[data-theme] .page-site-generator button.hosting-provider-toggle:focus-visible {
    min-height: 32px;
    padding: 3px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--muted);
    box-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    clip-path: none;
    transform: none;
}

:root[data-theme] .page-site-generator button.hosting-provider-toggle::before,
:root[data-theme] .page-site-generator button.hosting-provider-toggle::after {
    display: none;
}

/* Application navigation. */
.tabs__title {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: var(--text);
    font-size: 14px;
    letter-spacing: .02em;
}

.tabs__footer {
    display: grid;
    grid-template-columns: 44px;
    justify-content: center;
    gap: 8px;
}

:root body .tabs__footer-action,
:root body .tabs__pin {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    min-width: 0;
    height: 44px;
    min-height: 44px;
    margin: 0;
    border: 1px solid var(--line);
    border-radius: 9px;
    padding: 0 10px;
    background: color-mix(in srgb, var(--surface-soft) 88%, transparent);
    color: var(--tab-color);
    box-shadow: none;
    font: inherit;
    text-decoration: none;
    cursor: pointer;
}

:root body .tabs__pin {
    padding: 0;
}

:root body .tabs__footer-action:hover,
:root body .tabs__footer-action:focus-visible,
:root body .tabs__pin:hover,
:root body .tabs__pin:focus-visible {
    border-color: var(--accent);
    background: var(--tab-hover-bg);
    color: var(--tab-hover-color);
    outline: none;
}

.tabs__footer-action > svg,
.tabs__pin-icon svg {
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.9;
}

.tabs__footer-action > span {
    overflow: hidden;
    font-size: 12px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tabs__pin-icon {
    width: auto;
    height: auto;
    border-radius: 0;
    background: transparent;
    color: inherit;
}

.tabs__pin[aria-checked="true"] {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
}

@media (min-width: 960px) {
    :root.is-menu-pinned .shell .tabs::after {
        display: none;
    }
}

/* Branded flat navigation and compact pinned side-menu mode. */
.tabs__head {
    align-items: center;
    gap: 12px;
}

.tabs__brand {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
    color: var(--text);
    text-decoration: none;
}

.tabs__brand img {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
}

.tabs__brand .tabs__title {
    min-height: 0;
    font-size: 18px;
    letter-spacing: .01em;
    white-space: nowrap;
}

.tabs__head-actions {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 7px;
}

.tabs__head .tabs__pin {
    flex: 0 0 44px;
    width: 44px;
    min-width: 44px;
}

:root[data-theme] body .tabs__edge-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 20px;
    min-width: 20px;
    height: 100vh;
    min-height: 100vh;
    margin: 0;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
    color: var(--accent);
    box-shadow: none;
    clip-path: none;
    cursor: col-resize;
}

:root[data-theme] body .tabs__edge-toggle:hover,
:root[data-theme] body .tabs__edge-toggle:focus-visible {
    border: 0;
    background: linear-gradient(90deg, transparent 9px, color-mix(in srgb, var(--accent) 68%, transparent) 9px 11px, transparent 11px);
    color: var(--tab-hover-color);
    box-shadow: none;
    clip-path: none;
    outline: none;
}

.tabs__edge-toggle svg {
    flex: 0 0 14px;
    width: 14px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.5;
    filter: drop-shadow(0 0 5px color-mix(in srgb, var(--accent) 60%, transparent));
    transition: transform .24s ease;
}

.tab {
    gap: 10px;
}

.tab__icon {
    display: none;
    flex: 0 0 34px;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid color-mix(in srgb, var(--tab-icon-color, var(--accent)) 38%, var(--line));
    border-radius: 10px;
    background: color-mix(in srgb, var(--tab-icon-color, var(--accent)) 15%, var(--surface-soft));
    color: var(--tab-icon-color, var(--accent));
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.02em;
}

.tab__label {
    min-width: 0;
}

.tab--green { --tab-icon-color: #00be67; }
.tab--rose { --tab-icon-color: #ff5d75; }
.tab--amber { --tab-icon-color: #ffb020; }
.tab--cyan { --tab-icon-color: #16c8e8; }
.tab--violet { --tab-icon-color: #a879ff; }

.tab.active .tab__icon {
    border-color: color-mix(in srgb, currentColor 55%, transparent);
    background: color-mix(in srgb, currentColor 16%, transparent);
    color: inherit;
}

.tabs__pin-slash {
    opacity: 0;
    stroke-width: 2.4;
    transition: opacity .18s ease;
}

.tabs__pin[aria-checked="true"] .tabs__pin-icon svg {
    transform: rotate(25deg);
}

.tabs__pin[aria-checked="true"] .tabs__pin-slash {
    opacity: 1;
}

@media (min-width: 960px) {
    :root.is-menu-pinned .shell .tabs {
        transition: none;
        border-top: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
        border-right: 1px solid var(--line);
        border-radius: 0 14px 14px 0;
        padding-right: 20px;
        box-shadow: 16px 0 42px rgba(0, 0, 0, .32);
        transform: none;
        will-change: auto;
    }

    :root.is-menu-pinned .tabs__list {
        transform: none;
    }

    :root.is-menu-pinned .tabs__head {
        margin-right: -20px;
        padding-right: 20px;
    }

    :root.is-menu-pinned .tabs__footer {
        margin-right: -20px;
        padding-right: 20px;
    }

    :root.is-menu-pinned body .tabs__edge-toggle {
        position: fixed;
        z-index: 1602;
        top: 0;
        bottom: 0;
        right: auto;
        left: calc(var(--app-pinned-menu-width, var(--app-side-menu-width)) - 20px);
        display: inline-flex;
        background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--panel-bg) 96%, var(--bg)) 72%);
        box-shadow: inset -1px 0 0 color-mix(in srgb, var(--accent) 32%, var(--line));
        transform: none !important;
    }

    :root.is-menu-pinned body .tabs__edge-toggle:hover,
    :root.is-menu-pinned body .tabs__edge-toggle:focus-visible {
        background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 5%, transparent), color-mix(in srgb, var(--panel-bg) 88%, var(--accent) 12%) 72%);
        box-shadow: inset -2px 0 0 color-mix(in srgb, var(--accent) 76%, var(--line));
    }

    :root.is-menu-compact .tabs__edge-toggle svg {
        transform: rotate(180deg);
    }

    :root.is-menu-compact {
        --app-compact-menu-width: 86px;
    }

    :root.is-menu-compact .shell .tabs {
        width: var(--app-compact-menu-width) !important;
        padding-right: 20px;
        padding-left: 6px;
    }

    :root.is-menu-compact .tabs__head {
        flex-direction: column;
        justify-content: center;
        gap: 8px;
        margin-right: -20px;
        margin-left: 0;
        padding-right: 20px;
        padding-left: 0;
    }

    :root.is-menu-compact .tabs__brand {
        justify-content: center;
    }

    :root.is-menu-compact .tabs__head-actions {
        justify-content: center;
        width: 44px;
    }

    :root.is-menu-compact .tabs__brand img {
        flex-basis: 36px;
        width: 36px;
        height: 36px;
    }

    :root.is-menu-compact .tabs__brand .tabs__title,
    :root.is-menu-compact .tabs__close,
    :root.is-menu-compact .tab__label,
    :root.is-menu-compact .tabs__footer-action > span {
        display: none;
    }

    :root.is-menu-compact .tabs__list {
        gap: 8px;
    }

    :root.is-menu-compact .shell .tabs .tab {
        justify-content: center;
        width: 44px;
        min-height: 48px;
        margin-inline: auto;
        border-radius: 14px;
        padding: 0 !important;
        clip-path: none;
        transform: none;
    }

    :root.is-menu-compact .shell .tabs .tab::before,
    :root.is-menu-compact .shell .tabs .tab::after {
        display: none;
    }

    :root.is-menu-compact .tab__icon {
        display: inline-flex;
        flex-basis: 36px;
        width: 36px;
        height: 36px;
        border-color: color-mix(in srgb, var(--accent) 32%, var(--line));
        border-radius: 11px;
        background: color-mix(in srgb, var(--accent) 11%, var(--surface-soft));
        color: color-mix(in srgb, var(--accent) 72%, var(--text));
    }

    :root.is-menu-compact .tab.active .tab__icon {
        border-color: color-mix(in srgb, var(--accent) 60%, var(--line));
        background: var(--accent-soft);
        color: var(--accent);
    }

    :root.is-menu-compact .tabs__footer {
        grid-template-columns: 1fr;
        width: 44px;
        margin-inline: auto;
        padding-inline: 0;
    }

    :root.is-menu-compact .tabs__footer {
        margin-inline: auto;
        padding-inline: 0;
    }

    :root.is-menu-compact .tabs__footer-action,
    :root.is-menu-compact .tabs__pin {
        width: 40px;
        margin-inline: auto;
        padding: 0;
    }

}

@media (prefers-reduced-motion: reduce) {
    .tabs__edge-toggle svg,
    .tabs__pin-slash {
        transition: none;
    }
}

@media (max-width: 959px) {
    .tabs__footer {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tabs__pin {
        display: none !important;
    }

}

/* Keep long HTML content neutral and readable after theme-specific field styles. */
:root .page-site-generator .CodeMirror {
    color: var(--code-text) !important;
}

:root[data-theme="corporat"] .page-site-generator .CodeMirror {
    letter-spacing: .02em;
}

:root[data-theme="corporat"] .page-site-generator .CodeMirror :is(span:not([class]), span[class=""]) {
    color: var(--label);
    font-weight: 700;
}