/* Perf: pause every CSS animation + transition when the tab is hidden.
   Paired with `document.visibilityState` toggle in global.js. Compositor skips work,
   browser still resumes instantly when tab becomes visible. */
html[data-anim-paused="1"],
html[data-anim-paused="1"] *,
html[data-anim-paused="1"] *::before,
html[data-anim-paused="1"] *::after {
    animation-play-state: paused !important;
    transition: none !important;
}

/* --- GLOBAL THEME & RESET --- */
html {
    --win98-desktop: #008080;
    --win98-desktop-text: #ffffff;
    --win98-title-start: #000080;
    --win98-title-end: #1084d0;
    --win98-title-bg: linear-gradient(90deg, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0));
    --win98-inactive-title-text: #ffffff;
    --win98-accent: #000080;
    --win98-status-dot: #008000;
    --win98-panel-bg: rgba(192, 192, 192, 1);
    --win98-page-tint-color: transparent;
    --win98-page-tint-opacity: 0;
    --win98-page-tint-blend: multiply;
    --win98-page-tint-display: none;
    --win98-desktop-blur: 0px;
    --win98-title-blur: 0px;
    --win98-panel-blur: 0px;
    --win98-sub-blur: 0px;
    --win98-player-blur: 0px;
    --win98-selection-bg: #000080;
    --win98-selection-bg-image: none;
    --win98-selection-bg-size: auto;
    --win98-selection-bg-animation: none;
    --win98-selection-outline: #000080;
    --win98-selection-text: #ffffff;
    --win98-link: #000080;
    --win98-link-hover: #00005a;
    --win98-cursor-default: url("/data/assets/win98/cursors/default.png") 3 2, default;
    --win98-cursor-pointer: url("/data/assets/win98/cursors/pointer.png") 12 5, pointer;
    --win98-cursor-text: url("/data/assets/win98/cursors/text.png") 15 16, text;
    --win98-cursor-wait: url("/data/assets/win98/cursors/wait.png") 15 15, wait;
    --win98-cursor-progress: url("/data/assets/win98/cursors/progress.png") 5 5, progress;
    --win98-cursor-help: url("/data/assets/win98/cursors/help.png") 5 6, help;
    --win98-cursor-move: url("/data/assets/win98/cursors/move.png") 15 15, move;
    --win98-cursor-grab: url("/data/assets/win98/cursors/grab.png") 8 8, grab;
    --win98-cursor-grabbing: url("/data/assets/win98/cursors/grabbing.png") 7 8, grabbing;
    --win98-cursor-crosshair: url("/data/assets/win98/cursors/crosshair.png") 15 15, crosshair;
    --win98-cursor-not-allowed: url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed;
    --win98-cursor-resize-ns: url("/data/assets/win98/cursors/ns-resize.png") 15 15, ns-resize;
    --win98-cursor-resize-ew: url("/data/assets/win98/cursors/ew-resize.png") 15 15, ew-resize;
    --win98-cursor-resize-nwse: url("/data/assets/win98/cursors/nwse-resize.png") 15 15, nwse-resize;
    --win98-cursor-resize-nesw: url("/data/assets/win98/cursors/nesw-resize.png") 15 15, nesw-resize;
    --win98-scrollbar-face: #c0c0c0;
    --win98-scrollbar-track: #c0c0c0;
    --win98-scrollbar-track-light: #ffffff;
    --win98-scrollbar-active: #404040;
    --win98-sb-sprite: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="64" height="32" fill="rgb(0 0 0)"><g id="g"><path id="a" d="M7 6h1v1h1v1h1v1h1v1h-7v-1h1v-1h1v-1h1z"/><use transform="translate(15) rotate(180 8 8)" href="%23a"/><use transform="translate(30) rotate(-90 8 7)" href="%23a"/><use transform="translate(48) rotate(90 8 8)" href="%23a"/></g><use y="16" style="filter: drop-shadow(1px 1px 0 rgb(255 255 255));fill: rgb(128 128 128);" href="%23g"/></svg>');
    --win98-sb-bdi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='7'%3E%3Cpath fill='%23dfdfdf' d='M0 0h6v1H1v5H0Z'/%3E%3Cpath fill='%23ffffff' d='M1 1h4v1H2v3H1Z'/%3E%3Cpath fill='%23808080' d='M5 1h1v5H1V5h4z'/%3E%3Cpath fill='%23404040' d='M6 0h1v7H0V6h6z'/%3E%3C/svg%3E") 2 / 2px;
    background-color: #030303; 
    height: 100%; 
    scroll-behavior: smooth;
}

body { 
    background-color: transparent; 
    color: white; 
    font-family: 'Inter', sans-serif; 
    overflow-x: hidden; 
    width: 100%; 
    min-height: 100vh;
    margin: 0;
    position: relative; 
}

#theme-backdrop {
    position: fixed;
    inset: 0;
    z-index: -3;
    pointer-events: none;
    opacity: 0;
    background-color: #031414;
    background-image: url("https://i.ibb.co/LYhqxwq/ss175.gif");
    background-position: 0 0;
    background-repeat: repeat;
    background-size: 373px 224px;
    image-rendering: pixelated;
    transition: opacity 0.28s ease;
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    min-height: 2.35rem;
    min-width: 5.25rem;
    padding: 0.55rem 0.9rem;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.04);
    color: white;
    cursor: default;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(255,255,255,0.22);
    box-shadow: 0 0 18px rgba(255,255,255,0.12);
    outline: none;
}

.theme-toggle-kicker {
    font-size: 0.55rem;
    font-weight: 900;
    opacity: 0.65;
}

.theme-toggle-value {
    font-size: 0.72rem;
    font-weight: 900;
}

.site-control-dock {
    position: fixed;
    top: clamp(7.25rem, 14vh, 9.5rem);
    right: clamp(0.7rem, 1.8vw, 1.35rem);
    transform: none;
    z-index: 9200;
    pointer-events: none;
}

.site-control-dock-inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.6rem;
    width: 10.6rem;
    max-width: calc(100vw - 1.4rem);
    pointer-events: auto;
}

.site-dock-menu-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-end;
    width: 2.6rem;
    height: 2.6rem;
    padding: 0;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(8, 10, 10, 0.78);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    color: #fff;
    cursor: default;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.site-dock-menu-button:hover,
.site-dock-menu-button:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(255, 255, 255, 0.35);
    box-shadow: 0 0 18px rgba(255, 255, 255, 0.18);
    outline: none;
}

.site-dock-menu-button[aria-expanded="true"] {
    border-color: rgba(255, 255, 255, 0.35);
}

.site-dock-burger {
    display: block;
    width: 18px;
    height: 12px;
    position: relative;
    pointer-events: none;
}

.site-dock-burger::before,
.site-dock-burger::after,
.site-dock-burger span {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.site-dock-burger::before { top: 0; }
.site-dock-burger span { top: 50%; transform: translateY(-50%); }
.site-dock-burger::after { bottom: 0; }

.site-dock-menu-button[aria-expanded="true"] .site-dock-burger::before {
    transform: translateY(5px) rotate(45deg);
}

.site-dock-menu-button[aria-expanded="true"] .site-dock-burger span {
    opacity: 0;
}

.site-dock-menu-button[aria-expanded="true"] .site-dock-burger::after {
    transform: translateY(-5px) rotate(-45deg);
}

.site-control-dock[data-dock-collapsed="1"] .site-dock-buttons {
    display: none;
}

.site-dock-buttons {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

/* Corner-control proxy (Show Music Player relocated into dock) */
body[data-playlist-place="dock"] #gp-show-toggle {
    display: none !important;
}
.site-dock-proxy[data-active="0"] {
    display: none !important;
}

.site-dock-extras {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.55rem;
    padding-top: 0.6rem;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}
.site-dock-divider {
    order: 99;
    height: 1px;
    margin: 0.2rem 0;
    background: rgba(255, 255, 255, 0.16);
}
.site-dock-layout {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-top: 0.15rem;
    width: 100%;
}
.site-dock-layout-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.25rem;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
}
.site-dock-layout-label {
    display: block;
    min-width: 0;
    overflow: hidden;
    font-weight: 700;
    font-size: 9px;
    letter-spacing: 0.045em;
    text-overflow: clip;
    white-space: nowrap;
}
.site-dock-layout-switch {
    display: inline-flex;
    justify-self: end;
    max-width: 100%;
    min-width: 0;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.18);
}
.site-dock-layout-option {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    background: transparent;
    color: inherit;
    font: 700 10px/1 'Inter', system-ui, sans-serif;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    min-width: 34px;
    padding: 4px 4px;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease;
}
.site-dock-layout-option[aria-pressed="true"] {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
}
.site-dock-layout-option:hover:not([aria-pressed="true"]) {
    background: rgba(255, 255, 255, 0.08);
}

html[data-site-theme="neon"] .site-dock-layout-option[aria-pressed="true"] {
    background: color-mix(in srgb, var(--glow-color, #fc00e3) 38%, rgba(0, 0, 0, 0.5));
    box-shadow: inset 0 0 12px color-mix(in srgb, var(--glow-color, #fc00e3) 30%, transparent);
}
html[data-site-theme="vaporwave"] .site-dock-layout-option[aria-pressed="true"] {
    background: linear-gradient(135deg, var(--vapor-magenta, #ff2bd6), var(--vapor-cyan, #00eaff));
    color: #100021;
}
html[data-site-theme="win98"] .site-dock-layout-switch {
    flex: 0 0 auto;
    border-radius: 0;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    background: #c0c0c0;
}
html[data-site-theme="win98"] .site-dock-layout-row {
    gap: 4px;
    letter-spacing: 0;
}
html[data-site-theme="win98"] .site-dock-layout-label {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    letter-spacing: 0;
}
html[data-site-theme="win98"] .site-dock-layout-option {
    color: #000;
    font-family: Tahoma, 'MS Sans Serif', sans-serif;
    min-width: 36px;
    padding: 3px 4px;
    letter-spacing: 0;
}
html[data-site-theme="win98"] .site-dock-layout-option[aria-pressed="true"] {
    background: linear-gradient(90deg, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0));
    color: #fff;
    box-shadow: none;
}
html[data-site-theme="win98"] .site-dock-extras {
    border-top: 1px solid #808080;
}
html[data-site-theme="win98"] .site-dock-divider {
    background: #808080;
}

.site-retro-widgets {
    position: fixed;
    left: clamp(0.7rem, 1.8vw, 1.35rem);
    top: clamp(4.75rem, 10vh, 7rem);
    z-index: 9100;
    width: min(7.9rem, calc(100vw - 1.4rem));
    display: grid;
    gap: 0.6rem;
    pointer-events: none;
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    line-height: 1.35;
}

.site-widget-card {
    box-sizing: border-box;
    min-height: 2.7rem;
    overflow: visible;
    pointer-events: auto;
    color: #ffffff;
    background: rgba(8, 10, 10, 0.78);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 1rem;
    box-shadow: none;
    padding: 7px 9px;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

:is(body.home-page, body.shared-home-controls) .site-control-dock,
:is(body.home-page, body.shared-home-controls) .site-retro-widgets {
    top: clamp(8.5rem, 15vh, 10.25rem);
}

:is(body.home-page, body.shared-home-controls) .auth-launcher {
    top: clamp(0.9rem, 2.2vh, 1.4rem);
}

:is(body.home-page, body.shared-home-controls) .auth-launcher:not(.is-authed) .auth-launcher-label {
    text-transform: uppercase;
}

:is(body.home-page, body.shared-home-controls) .site-retro-widgets {
    width: min(12.8rem, calc(100vw - 1.4rem));
    gap: 0.9rem;
    font-size: 14px;
}

:is(body.home-page, body.shared-home-controls) .site-widget-card {
    min-height: 3.6rem;
    padding: 10px 12px;
}

:is(body.home-page, body.shared-home-controls) .site-widget-title {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    margin: -4px -5px 11px;
    padding: 5px 9px;
    font-size: 12px;
    line-height: 13px;
}

:is(body.home-page, body.shared-home-controls) .site-hit-counter {
    min-height: 24px;
    padding: 3px 8px;
}

:is(body.home-page, body.shared-home-controls) .site-hit-counter-digit {
    min-width: 13px;
    font: 900 16px/17px "Courier New", Courier, monospace;
}

@media (max-width: 1180px) {
    :is(body.home-page, body.shared-home-controls) .site-retro-widgets {
        top: auto;
        width: min(92vw, 720px);
        gap: 0.75rem;
        font-size: 13px;
    }

    :is(body.home-page, body.shared-home-controls) .site-widget-card {
        min-height: 2.75rem;
        padding: 7px 9px;
    }

    :is(body.home-page, body.shared-home-controls) .site-widget-title {
        margin: -3px -4px 8px;
        padding: 4px 7px;
        font-size: 11px;
        line-height: 12px;
    }

    :is(body.home-page, body.shared-home-controls) .site-hit-counter {
        min-height: 18px;
        padding: 2px 6px;
    }

    :is(body.home-page, body.shared-home-controls) .site-hit-counter-digit {
        min-width: 11px;
        font: 900 13px/14px "Courier New", Courier, monospace;
    }
}

@media (max-width: 767px) {
    :is(body.home-page, body.shared-home-controls) .site-control-dock {
        top: auto;
    }
}

.site-widget-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: -3px -4px 8px;
    padding: 4px 7px;
    color: rgba(255,255,255,0.72);
    background: rgba(255, 255, 255, 0.08);
    border-radius: 0.7rem 0.7rem 0.25rem 0.25rem;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 12px;
    text-transform: uppercase;
    white-space: nowrap;
}

.site-retro-widgets .site-widget-title {
    background: transparent !important;
    border-bottom-color: transparent !important;
    box-shadow: none !important;
}

.site-hit-counter {
    display: flex;
    justify-content: center;
    gap: 1px;
    min-height: 18px;
    padding: 2px 6px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 0.8rem;
    box-shadow: inset 0 0 14px rgba(255,255,255,0.04);
}

.site-hit-counter-digit {
    min-width: 11px;
    padding: 0 1px;
    text-align: center;
    color: #ffffff;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.14);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.12);
    font: 900 13px/14px "Courier New", Courier, monospace;
    font-variant-numeric: tabular-nums;
    text-shadow: none;
}

.site-hit-counter.is-unavailable {
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,0.68);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.site-currently-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 9px;
}

.site-currently-list li {
    position: relative;
    padding-left: 17px;
    color: rgba(255,255,255,0.88);
    overflow-wrap: anywhere;
    line-height: 1.35;
}

.site-currently-list li::before {
    content: "";
    position: absolute;
    left: 1px;
    top: 0.55em;
    width: 7px;
    height: 7px;
    background: rgba(255,255,255,0.82);
    box-shadow: 0 0 8px rgba(255,255,255,0.18);
}

.site-currently-updated {
    display: block;
    margin-top: 8px;
    padding-top: 5px;
    color: rgba(255,255,255,0.52);
    font: 700 7px/1.2 var(--site-guestbook-font, "Inter", sans-serif);
    letter-spacing: 0.03em;
    text-align: right;
}

.site-currently-updated[hidden] {
    display: none;
}

.site-widget-currently .site-widget-title {
    margin: -3px -4px 8px;
}

.site-guestbook-section {
    --site-guestbook-content-width: 100%;
    --site-guestbook-accent: #0011ff;
    --site-guestbook-font: "Inter", sans-serif;
    position: relative;
    z-index: 2;
    width: 100%;
    margin: 6rem 0 0;
    color: #e9fff8;
    font-family: var(--site-guestbook-font);
    font-size: 13px;
    line-height: 1.45;
    min-height: 292px;
    box-sizing: border-box;
    clear: both;
}

.site-guestbook-section + .site-inspiration-section {
    margin-top: 2.5rem;
}

.site-inspiration-section {
    position: relative;
    z-index: 10;
    width: 100%;
    margin: 6rem 0 2.5rem;
    padding: 0 1.5rem;
    text-align: center;
}

.site-inspiration-inner {
    max-width: 36rem;
    margin: 0 auto;
}

.site-inspiration-line {
    height: 1px;
    width: 100%;
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.1), transparent);
}

.site-inspiration-line:first-child {
    margin-bottom: 2rem;
}

.site-inspiration-line:not(:first-child) {
    margin-top: 2rem;
}

.site-inspiration-section #daily-quote {
    margin-bottom: 1rem;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    font-style: italic;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.site-inspiration-section #daily-scripture {
    color: #6b7280;
    font-size: 10px;
    font-weight: 500;
    font-style: italic;
    letter-spacing: 0.1em;
}

.site-inspiration-credit {
    margin-top: 1rem;
    color: rgba(255, 255, 255, 0.4);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0.5em;
    text-transform: uppercase;
}

.site-footer {
    position: relative;
    z-index: 10;
    width: 100%;
    padding-bottom: 5rem;
    text-align: center;
    color: rgba(255, 255, 255, 0.3);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 1em;
    text-transform: uppercase;
}

html[data-site-theme="win98"] .site-footer {
    color: rgba(17, 17, 17, 0.32);
}

.site-guestbook-section .site-guestbook-shell {
    --site-guestbook-accent: var(--glow-color, #0011ff);
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: 1.5rem 1.8rem 1.8rem;
    overflow: hidden;
}

.site-guestbook-hero-heading {
    color: color-mix(in srgb, var(--site-guestbook-accent) 64%, #ffffff);
    font: 900 10px/1 "Inter", sans-serif;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    text-shadow: 0 0 8px color-mix(in srgb, var(--site-guestbook-accent) 42%, transparent);
}

.site-guestbook-viewport {
    display: grid;
    gap: 28px;
    height: auto;
    min-height: 0;
    padding: 22px 18px;
    overflow: visible;
    background: color-mix(in srgb, var(--site-guestbook-accent) 7%, rgba(0, 14, 11, 0.72));
    border: 1px solid color-mix(in srgb, var(--site-guestbook-accent) 26%, transparent);
    border-radius: 8px;
    box-shadow: inset 0 0 24px color-mix(in srgb, var(--site-guestbook-accent) 10%, transparent);
    box-sizing: border-box;
}

.site-guestbook-form {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 7px 12px;
    width: var(--site-guestbook-content-width);
    margin: 0 auto;
    padding: 18px 20px 20px;
    color: color-mix(in srgb, var(--site-guestbook-accent) 72%, #ffffff);
    background: transparent;
    border: 2px solid color-mix(in srgb, var(--site-guestbook-accent) 78%, #ffffff);
    border-radius: 8px;
    box-shadow: none;
    box-sizing: border-box;
    font: 700 12px/1.3 var(--site-guestbook-font);
}

.site-guestbook-form h3 {
    grid-column: 1 / -1;
    margin: 0 0 10px;
    color: color-mix(in srgb, var(--site-guestbook-accent) 78%, #ffffff);
    font: 700 18px/1.2 var(--site-guestbook-font);
}

.site-guestbook-field {
    display: contents;
}

.site-guestbook-field > span:first-child {
    align-self: start;
    padding-top: 4px;
}

.site-guestbook-field input,
.site-guestbook-field select,
.site-guestbook-field textarea {
    width: 100%;
    min-width: 0;
    color: color-mix(in srgb, var(--site-guestbook-accent) 42%, #ffffff);
    background: color-mix(in srgb, var(--site-guestbook-accent) 10%, rgba(0, 0, 0, 0.82));
    border: 1px solid color-mix(in srgb, var(--site-guestbook-accent) 70%, #ffffff);
    border-radius: 5px;
    box-shadow: inset 0 0 9px color-mix(in srgb, var(--site-guestbook-accent) 16%, transparent);
    box-sizing: border-box;
    font: 12px/16px var(--site-guestbook-font);
}

.site-guestbook-field input::placeholder,
.site-guestbook-field textarea::placeholder {
    color: color-mix(in srgb, var(--site-guestbook-accent) 38%, rgba(255, 255, 255, 0.48));
    opacity: 1;
}

.site-guestbook-field input,
.site-guestbook-field select {
    height: 22px;
    padding: 2px 5px;
}

.site-guestbook-field textarea {
    min-height: 110px;
    resize: vertical;
    padding: 5px;
}

.site-guestbook-verification-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.site-guestbook-verification-code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 92px;
    height: 24px;
    color: color-mix(in srgb, var(--site-guestbook-accent) 76%, #ffffff);
    background:
        repeating-linear-gradient(135deg, color-mix(in srgb, var(--site-guestbook-accent) 22%, transparent) 0 2px, transparent 2px 5px),
        rgba(0, 0, 0, 0.28);
    border: 1px solid color-mix(in srgb, var(--site-guestbook-accent) 72%, #ffffff);
    border-radius: 6px;
    box-shadow: inset 0 0 10px color-mix(in srgb, var(--site-guestbook-accent) 18%, transparent);
    box-sizing: border-box;
    font: 800 14px/1 var(--site-guestbook-font);
    letter-spacing: 0.12em;
    text-shadow: 0 0 8px color-mix(in srgb, var(--site-guestbook-accent) 58%, transparent);
}

.site-guestbook-verification-row input {
    flex: 1 1 140px;
}

.site-guestbook-actions,
.site-guestbook-status {
    grid-column: 2;
}

.site-guestbook-actions {
    display: flex;
    gap: 8px;
    margin-top: 6px;
}

.site-guestbook-actions button {
    padding: 3px 8px;
    color: color-mix(in srgb, var(--site-guestbook-accent) 78%, #ffffff);
    background: color-mix(in srgb, var(--site-guestbook-accent) 14%, rgba(0, 0, 0, 0.78));
    border: 1px solid color-mix(in srgb, var(--site-guestbook-accent) 82%, #ffffff);
    border-radius: 6px;
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--site-guestbook-accent) 22%, transparent),
        0 0 10px color-mix(in srgb, var(--site-guestbook-accent) 24%, transparent);
    font: 700 12px/16px var(--site-guestbook-font);
    text-shadow: 0 0 8px color-mix(in srgb, var(--site-guestbook-accent) 52%, transparent);
}

.site-guestbook-actions button:disabled {
    color: #777777;
}

.site-guestbook-actions button:active {
    transform: translate(1px, 1px);
}

.site-guestbook-status {
    min-height: 16px;
    margin: 2px 0 0;
    color: color-mix(in srgb, var(--site-guestbook-accent) 78%, #ffffff);
    font-size: 11px;
}

.site-guestbook-status.is-error {
    color: #ff76c8;
}

.site-guestbook-comments {
    display: grid;
    gap: 16px;
    width: var(--site-guestbook-content-width);
    margin: 0 auto;
}

.site-guestbook-comments-title {
    color: color-mix(in srgb, var(--site-guestbook-accent) 78%, #ffffff);
    font: 700 13px/1 var(--site-guestbook-font);
    text-transform: uppercase;
    letter-spacing: 0;
}

.site-guestbook-entries {
    display: grid;
    gap: 16px;
}

.site-guestbook-entry {
    width: 100%;
    box-sizing: border-box;
    color: color-mix(in srgb, var(--site-guestbook-accent) 72%, #ffffff);
    background: color-mix(in srgb, var(--site-guestbook-accent) 9%, rgba(0, 14, 11, 0.94));
    border: 1px solid color-mix(in srgb, var(--site-guestbook-accent) 70%, #ffffff);
    border-radius: 8px;
    box-shadow: 0 0 16px color-mix(in srgb, var(--site-guestbook-accent) 14%, transparent);
    font: 12px/1.35 var(--site-guestbook-font);
    overflow: hidden;
}

.site-guestbook-entry-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 6px 8px 8px;
    border-bottom: 1px solid color-mix(in srgb, var(--site-guestbook-accent) 58%, #ffffff);
    font-weight: 700;
}

.site-guestbook-entry-meta-name {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    line-height: 1.1;
}

.site-guestbook-entry-meta-sub {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.85em;
    opacity: 0.75;
    font-weight: 600;
}

.site-guestbook-entry-meta-sub > span + span::before {
    content: "\b7  ";
    margin-right: 2px;
    opacity: 0.6;
}

.site-guestbook-entry-site {
    color: inherit;
    text-decoration: underline;
}

.site-guestbook-entry-message {
    padding: 8px 6px 10px;
}

.site-guestbook-admin-reply {
    margin: 0 6px 10px;
    padding: 8px;
    color: color-mix(in srgb, var(--site-guestbook-accent) 76%, #ffffff);
    background: color-mix(in srgb, var(--site-guestbook-accent) 12%, rgba(0, 0, 0, 0.68));
    border: 1px solid color-mix(in srgb, var(--site-guestbook-accent) 52%, transparent);
    border-radius: 7px;
}

.site-guestbook-admin-reply-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    font-weight: 800;
    font-size: 10px;
    text-transform: uppercase;
}

.site-guestbook-admin-reply-name {
    display: inline-flex;
    align-items: center;
    font-size: 1.45em;
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: 0.02em;
    text-transform: none;
}

.site-guestbook-admin-reply-action {
    opacity: 0.7;
    font-size: 0.9em;
}

.site-guestbook-admin-name {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    border: 1px solid color-mix(in srgb, var(--site-guestbook-accent) 82%, #ffffff);
    border-radius: 999px;
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
    background:
        linear-gradient(90deg,
            color-mix(in srgb, var(--site-guestbook-accent) 82%, #ffdf7a),
            color-mix(in srgb, var(--site-guestbook-accent) 72%, #00eaff),
            color-mix(in srgb, var(--site-guestbook-accent) 88%, #ff5bd6));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.28),
        0 0 10px color-mix(in srgb, var(--site-guestbook-accent) 56%, transparent),
        0 0 18px color-mix(in srgb, var(--site-guestbook-accent) 28%, transparent);
    letter-spacing: 0.12em;
    text-shadow:
        0 1px 0 rgba(0, 0, 0, 0.65),
        0 0 8px color-mix(in srgb, var(--site-guestbook-accent) 85%, transparent);
}

.site-guestbook-admin-reply-message {
    overflow-wrap: anywhere;
}

.site-guestbook-reactions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    padding: 0 6px 8px;
}

.site-guestbook-reaction {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 44px;
    min-height: 34px;
    padding: 2px 6px;
    color: color-mix(in srgb, var(--site-guestbook-accent) 78%, #ffffff);
    background: color-mix(in srgb, var(--site-guestbook-accent) 10%, rgba(0, 0, 0, 0.72));
    border: 1px solid color-mix(in srgb, var(--site-guestbook-accent) 58%, #ffffff);
    border-radius: 999px;
    box-shadow: 0 0 10px color-mix(in srgb, var(--site-guestbook-accent) 14%, transparent);
    font: 800 11px/1 var(--site-guestbook-font);
    cursor: pointer;
}

.site-guestbook-reaction img {
    width: 26px;
    height: 26px;
    object-fit: contain;
    flex: 0 0 auto;
}

.site-guestbook-reaction span {
    min-width: 10px;
    text-align: center;
}

.site-guestbook-reaction:disabled {
    opacity: 0.58;
    cursor: wait;
}

.site-guestbook-entry-empty {
    padding: 8px 6px;
}

html[data-site-theme="neon"] .site-guestbook-shell.glass::before {
    border-left-color: var(--glow-color);
    box-shadow: inset 8px 0 14px -10px var(--glow-color);
    transition: border-left-width var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] .site-guestbook-shell.glass:hover::before,
html[data-site-theme="neon"] .site-guestbook-shell.glass:focus-within::before {
    border-left-color: var(--glow-color);
    box-shadow: inset 12px 0 18px -12px var(--glow-color);
}

html[data-site-theme="neon"] .site-guestbook-shell.glass {
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        --glow-color var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.site-guestbook-hero-heading, .game-rotation-heading, .glass > .box-title) {
    font: 900 2.25rem/0.9 "Inter", sans-serif !important;
    font-style: italic;
    letter-spacing: -0.05em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3))) 58%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3))) 58%, #ffffff) !important;
    text-shadow:
        0 0 12px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3))) 50%, transparent),
        0 0 22px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3))) 28%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] :is(.site-guestbook-hero-heading, .game-rotation-heading) {
    font: 900 2.25rem/0.9 "Inter", sans-serif !important;
    font-style: italic;
    letter-spacing: -0.05em;
    text-transform: uppercase;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) :is(.site-guestbook-hero-heading, .game-rotation-heading, .game-rotation-live, .glass > .box-title, .glass > .box-subtitle) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: none !important;
}

html[data-site-theme="vaporwave"] .site-widget-card {
    color: #fff7ff;
    background: linear-gradient(180deg, rgba(38, 0, 70, 0.6), rgba(9, 0, 31, 0.65));
    border: 2px solid var(--vapor-cyan, #00eaff);
    border-radius: 7px;
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.22),
        inset -2px -2px 0 rgba(0, 0, 0, 0.5),
        4px 4px 0 rgba(255, 43, 214, 0.45),
        0 0 18px rgba(0, 234, 255, 0.22);
}

html[data-site-theme="vaporwave"] .site-widget-title {
    color: #fff7ff;
    background: linear-gradient(90deg, rgba(0, 234, 255, 0.28), rgba(255, 43, 214, 0.3));
    border-bottom: 1px solid var(--vapor-cyan, #00eaff);
    text-shadow: 2px 2px 0 rgba(255, 43, 214, 0.8);
}

html[data-site-theme="vaporwave"] .site-hit-counter-digit {
    background: linear-gradient(180deg, rgba(38, 0, 70, 0.6), rgba(9, 0, 31, 0.65));
    color: #fff7ff;
    border-color: var(--vapor-cyan, #00eaff);
    box-shadow: inset 1px 1px 0 rgba(255,255,255,0.22), 2px 2px 0 rgba(255,43,214,0.4);
    text-shadow: none;
}

html[data-site-theme="vaporwave"] .site-hit-counter {
    background: linear-gradient(90deg, #2b1624, #3a2448);
    border: 2px solid var(--vapor-cyan, #00eaff);
    border-radius: 7px;
    box-shadow:
        inset 2px 2px 0 rgba(255,255,255,0.18),
        inset -2px -2px 0 rgba(0,0,0,0.45),
        3px 3px 0 rgba(255,43,214,0.35);
}

html[data-site-theme="vaporwave"] .site-currently-list li {
    color: #fff7ff;
}

html[data-site-theme="vaporwave"] .site-currently-list li::before {
    background: var(--vapor-cyan, #00eaff);
    box-shadow: 2px 2px 0 rgba(255,43,214,0.72), 0 0 8px rgba(0,234,255,0.45);
}

html[data-site-theme="vaporwave"] .site-guestbook-section {
    --site-guestbook-accent: var(--vapor-cyan, #00eaff);
    color: #ffd7ec;
}

html[data-site-theme="vaporwave"] .site-guestbook-shell {
    --site-guestbook-accent: var(--vapor-cyan, #00eaff);
    --glow-color: var(--vapor-cyan, #00eaff);
    --glow-rgb: 0, 234, 255;
    gap: 1.1rem;
    color: #fff7ff;
}

html[data-site-theme="vaporwave"] .site-guestbook-hero-heading {
    color: var(--vapor-gold, #fff38a);
    text-shadow: 2px 2px 0 #ff2bd6, -2px -1px 0 #00eaff;
}

html[data-site-theme="vaporwave"] .site-guestbook-viewport {
    background: #14001f;
    border: 2px solid var(--vapor-cyan, #00eaff);
    border-radius: 4px;
    box-shadow:
        inset 2px 2px 0 rgba(255,255,255,0.2),
        inset -2px -2px 0 rgba(0,0,0,0.5),
        4px 4px 0 rgba(255,43,214,0.45);
}

html[data-site-theme="vaporwave"] .site-guestbook-form {
    color: #fff7ff;
    background:
        linear-gradient(180deg, rgba(38, 0, 70, 0.22), rgba(9, 0, 31, 0.28));
    border-color: var(--vapor-cyan, #00eaff);
    box-shadow:
        inset 1px 1px 0 rgba(255, 255, 255, 0.14),
        inset -1px -1px 0 rgba(0, 0, 0, 0.48),
        0 0 16px rgba(0, 234, 255, 0.16);
}

html[data-site-theme="vaporwave"] .site-guestbook-auth-notice,
html[data-site-theme="vaporwave"] .site-guestbook-admin-reply {
    background:
        linear-gradient(180deg, rgba(38, 0, 70, 0.48), rgba(9, 0, 31, 0.54));
    border: 1px solid rgba(0, 234, 255, 0.52);
    color: #fff7ff;
    box-shadow:
        inset 1px 1px 0 rgba(255, 255, 255, 0.12),
        inset -1px -1px 0 rgba(0, 0, 0, 0.45),
        0 0 14px rgba(255, 43, 214, 0.16);
}

html[data-site-theme="vaporwave"] .site-guestbook-form h3,
html[data-site-theme="vaporwave"] .site-guestbook-comments-title {
    color: var(--vapor-gold, #ffd15c);
    -webkit-text-fill-color: var(--vapor-gold, #ffd15c);
    text-shadow: 2px 2px 0 #ff2bd6, -1px -1px 0 #00eaff;
}

html[data-site-theme="vaporwave"] .site-guestbook-field > span:first-child,
html[data-site-theme="vaporwave"] .site-guestbook-status,
html[data-site-theme="vaporwave"] .site-guestbook-entry-meta,
html[data-site-theme="vaporwave"] .site-guestbook-entry-site,
html[data-site-theme="vaporwave"] .site-guestbook-admin-reply-title {
    color: color-mix(in srgb, var(--vapor-pink, #ff2bd6) 58%, #fff7ff);
    -webkit-text-fill-color: color-mix(in srgb, var(--vapor-pink, #ff2bd6) 58%, #fff7ff);
    text-shadow: 0 0 10px rgba(255, 43, 214, 0.28);
}

html[data-site-theme="vaporwave"] .site-guestbook-entry-message,
html[data-site-theme="vaporwave"] .site-guestbook-entry-empty,
html[data-site-theme="vaporwave"] .site-guestbook-admin-reply-message {
    color: #fff7ff;
    -webkit-text-fill-color: #fff7ff;
}

html[data-site-theme="vaporwave"] .site-guestbook-field input,
html[data-site-theme="vaporwave"] .site-guestbook-field select,
html[data-site-theme="vaporwave"] .site-guestbook-field textarea,
html[data-site-theme="vaporwave"] .site-guestbook-verification-code {
    color: #fff7ff;
    -webkit-text-fill-color: #fff7ff;
    background:
        linear-gradient(180deg, rgba(9, 0, 31, 0.9), rgba(25, 0, 55, 0.82));
    border-color: rgba(0, 234, 255, 0.74);
    box-shadow:
        inset 1px 1px 0 rgba(255, 255, 255, 0.12),
        inset -1px -1px 0 rgba(0, 0, 0, 0.48),
        0 0 10px rgba(0, 234, 255, 0.16);
}

html[data-site-theme="vaporwave"] .site-guestbook-field input::placeholder,
html[data-site-theme="vaporwave"] .site-guestbook-field textarea::placeholder {
    color: rgba(255, 247, 255, 0.46);
}

html[data-site-theme="vaporwave"] .site-guestbook-verification-code {
    background:
        repeating-linear-gradient(135deg, rgba(255, 43, 214, 0.28) 0 2px, rgba(0, 234, 255, 0.12) 2px 5px),
        rgba(9, 0, 31, 0.86);
    color: var(--vapor-gold, #ffd15c);
    -webkit-text-fill-color: var(--vapor-gold, #ffd15c);
    text-shadow: 1px 1px 0 #ff2bd6, 0 0 10px rgba(0, 234, 255, 0.38);
}

html[data-site-theme="vaporwave"] .site-guestbook-comments-title {
    color: var(--vapor-gold, #ffd15c);
}

html[data-site-theme="vaporwave"] .site-guestbook-entry {
    color: #fff7ff;
    background:
        linear-gradient(180deg, rgba(38, 0, 70, 0.38), rgba(9, 0, 31, 0.48));
    border-color: var(--vapor-cyan, #00eaff);
    box-shadow:
        inset 1px 1px 0 rgba(255, 255, 255, 0.12),
        inset -1px -1px 0 rgba(0, 0, 0, 0.45),
        0 0 14px rgba(255, 43, 214, 0.18);
}

html[data-site-theme="vaporwave"] .site-guestbook-entry-meta {
    border-bottom-color: rgba(0, 234, 255, 0.52);
}

html[data-site-theme="vaporwave"] .site-guestbook-reaction {
    color: #fff7ff;
    -webkit-text-fill-color: #fff7ff;
    background: linear-gradient(180deg, rgba(38, 0, 70, 0.6), rgba(9, 0, 31, 0.65));
    border-color: var(--vapor-cyan, #00eaff);
    box-shadow:
        inset 1px 1px 0 rgba(255, 255, 255, 0.18),
        inset -1px -1px 0 rgba(0, 0, 0, 0.5),
        0 0 14px rgba(0, 234, 255, 0.18);
}

html[data-site-theme="vaporwave"] .site-guestbook-actions button:disabled {
    color: rgba(255, 247, 255, 0.42) !important;
    -webkit-text-fill-color: rgba(255, 247, 255, 0.42) !important;
    border-color: rgba(0, 234, 255, 0.34) !important;
    opacity: 0.72;
}

html[data-site-theme="vaporwave"] .site-guestbook-badge {
    border: 1px solid rgba(0, 234, 255, 0.7);
    border-radius: 4px;
    color: #fff7ff;
    -webkit-text-fill-color: #fff7ff;
    box-shadow: 2px 2px 0 rgba(255, 43, 214, 0.45);
}

html[data-site-theme="vaporwave"] .site-guestbook-badge-admin {
    background: var(--vapor-pink, #ff2bd6);
}

html[data-site-theme="vaporwave"] .site-guestbook-badge-user {
    background: var(--vapor-violet, #7c2cff);
}

html[data-site-theme="vaporwave"] .site-guestbook-badge-guest {
    background: rgba(0, 234, 255, 0.28);
}

html[data-site-theme="win98"] .site-retro-widgets {
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    width: 9.4rem;
    gap: 0.8rem;
}

html[data-site-theme="win98"] .site-widget-card {
    box-sizing: border-box;
    min-height: 2.7rem;
    overflow: visible;
    color: var(--win98-text, #111111);
    background: var(--win98-panel-bg, #c0c0c0);
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    border-radius: 0;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 7px 9px;
}

html[data-site-theme="win98"] .site-widget-title {
    position: relative;
    isolation: isolate;
    display: flex !important;
    width: auto !important;
    max-width: none !important;
    box-sizing: border-box;
    overflow: hidden;
    margin: -5px -7px 8px;
    padding: 4px 7px;
    color: var(--win98-inactive-title-text, #ffffff);
    -webkit-text-fill-color: var(--win98-inactive-title-text, #ffffff);
    background: linear-gradient(90deg, #808080, #c0c0c0) !important;
    border-radius: 0;
    font-size: 11px;
    line-height: 13px;
    letter-spacing: 0;
    white-space: nowrap;
}

html[data-site-theme="win98"] .site-widget-title > * {
    position: relative;
    z-index: 1;
}

html[data-site-theme="win98"] .site-widget-card:hover .site-widget-title,
html[data-site-theme="win98"] .site-widget-card:focus-within .site-widget-title {
    color: var(--win98-title-text, #ffffff);
    -webkit-text-fill-color: var(--win98-title-text, #ffffff);
    background: var(--win98-title-bg-local, var(--win98-title-bg, linear-gradient(90deg, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0)))) !important;
}

html[data-site-theme="win98"] .site-hit-counter-digit {
    min-width: 11px;
    padding: 0 1px;
    color: #000000;
    background: transparent;
    border: 0;
    box-shadow: none;
    font: 700 13px/14px "Courier New", Courier, monospace;
    text-shadow: none;
}

html[data-site-theme="win98"] .site-hit-counter {
    justify-content: flex-end;
    gap: 0;
    min-height: 18px;
    padding: 2px 6px;
    background: #ffffff;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    border-radius: 0;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf;
}

html[data-site-theme="win98"] .site-widget-currently .site-widget-title {
    margin: -5px -7px 8px;
}

html[data-site-theme="win98"] .site-hit-counter.is-unavailable {
    color: var(--win98-text-muted, #808080);
    font: 11px/14px Tahoma, "MS Sans Serif", sans-serif;
    text-transform: none;
    letter-spacing: 0;
}

html[data-site-theme="win98"] .site-currently-list li {
    color: var(--win98-text, #111111);
}

html[data-site-theme="win98"] .site-currently-list li::before {
    background: var(--win98-status-dot, #008000);
    box-shadow: none;
}

html[data-site-theme="win98"] .site-currently-updated {
    color: var(--win98-text-muted, #444444);
    -webkit-text-fill-color: var(--win98-text-muted, #444444);
    font: 700 8px/10px Tahoma, "MS Sans Serif", sans-serif;
    letter-spacing: 0;
}

html[data-site-theme="win98"] .site-guestbook-section {
    --site-guestbook-font: Tahoma, "MS Sans Serif", sans-serif;
    color: #111111;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
}

html[data-site-theme="win98"] .site-guestbook-shell {
    gap: 8px;
    border-radius: 0 !important;
}

html[data-site-theme="win98"] .site-guestbook-hero-heading {
    display: none;
}

html[data-site-theme="win98"] .site-guestbook-viewport {
    color: var(--win98-sub-text, var(--win98-text, #111111));
    background: var(--win98-sub-bg, #ffffff);
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    border-radius: 0;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf;
}

html[data-site-theme="win98"] .site-guestbook-form,
html[data-site-theme="win98"] .site-guestbook-entry {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    background: #c0c0c0;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    border-radius: 0;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
}

html[data-site-theme="win98"] .site-guestbook-form h3,
html[data-site-theme="win98"] .site-guestbook-comments-title,
html[data-site-theme="win98"] .site-guestbook-field > span:first-child,
html[data-site-theme="win98"] .site-guestbook-status,
html[data-site-theme="win98"] .site-guestbook-entry-empty {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
}

html[data-site-theme="win98"] .site-guestbook-field input,
html[data-site-theme="win98"] .site-guestbook-field select,
html[data-site-theme="win98"] .site-guestbook-field textarea {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    background: #ffffff;
    border: 1px solid #808080;
    border-radius: 0;
    box-shadow: none;
    outline: none;
    font: 11px/15px var(--site-guestbook-font);
}

html[data-site-theme="win98"] .site-guestbook-field input::placeholder,
html[data-site-theme="win98"] .site-guestbook-field textarea::placeholder {
    color: #808080 !important;
    -webkit-text-fill-color: #808080 !important;
}

html[data-site-theme="win98"] .site-guestbook-verification-code {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    background: #ffffff;
    border: 1px solid #808080;
    border-radius: 0;
    box-shadow: none;
    outline: none;
    font: 700 11px/16px var(--site-guestbook-font);
    letter-spacing: 0;
    text-shadow: none;
}

html[data-site-theme="win98"] .site-guestbook-admin-name {
    padding: 1px 5px;
    color: var(--win98-selection-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-selection-text, #ffffff) !important;
    background-color: var(--win98-selection-bg, #000080) !important;
    background-image: var(--win98-selection-bg-image, none) !important;
    background-size: var(--win98-selection-bg-size, auto) !important;
    animation: var(--win98-selection-bg-animation, none) !important;
    border: 1px solid #000000;
    border-radius: 0;
    box-shadow: none;
    letter-spacing: 0;
    text-shadow: none;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom {
    --admin-name-color: #ffffff;
    --admin-name-color-2: #ff2bd6;
    --admin-name-color-3: #00d9ff;
    --admin-name-color-4: #35ff80;
    --admin-name-color-5: #ffe94f;
    --admin-name-glow-color: var(--admin-name-color);
    --admin-name-effect-color: #ffffff;
    --admin-name-effect-opacity: 1;
    --admin-name-effect-blend: normal;
    --admin-name-effect-hue: 0deg;
    --admin-name-effect-saturation: 100%;
    --admin-name-effect-brightness: 100%;
    --admin-name-effect-image: none;
    --admin-name-effect-repeat: repeat;
    --admin-name-effect-position: center;
    --admin-name-effect-size: auto;
    --admin-name-effect-inset: -6px -5px;
    display: inline-block;
    position: relative;
    padding: 1px 4px;
    color: var(--admin-name-color) !important;
    -webkit-text-fill-color: var(--admin-name-color) !important;
    background: transparent !important;
    border-color: color-mix(in srgb, var(--admin-name-color) 45%, transparent) !important;
    border-radius: 4px;
    box-shadow: none;
    font-weight: 400;
    letter-spacing: 0;
    text-shadow: none;
}

@keyframes site-guestbook-name-text-gradient {
    from { background-position: 0 center; }
    to { background-position: calc(var(--admin-name-text-gradient-size, 12.94em) * -1) center; }
}

@keyframes site-guestbook-name-text-rainbow {
    from { background-position: 0 center; }
    to { background-position: -15.29em center; }
}

@keyframes site-guestbook-name-text-stripes {
    from {
        background-position: var(--admin-name-stripe-start-x, 0px) var(--admin-name-stripe-start-y, 0px);
    }
    to {
        background-position:
            calc(var(--admin-name-stripe-start-x, 0px) - var(--admin-name-stripe-period, 3.53em))
            var(--admin-name-stripe-start-y, 0px);
    }
}

@keyframes site-guestbook-name-text-stripes-diagonal {
    from {
        background-position: var(--admin-name-stripe-start-x, 0px) var(--admin-name-stripe-start-y, 0px);
    }
    to {
        background-position:
            calc(var(--admin-name-stripe-start-x, 0px) - var(--admin-name-stripe-diagonal-period, 5em))
            calc(var(--admin-name-stripe-start-y, 0px) - var(--admin-name-stripe-diagonal-period, 5em));
    }
}

@keyframes site-guestbook-name-text-color-shuffle {
    0%, 19% { background-image: linear-gradient(90deg, var(--admin-name-color), var(--admin-name-color)); }
    20%, 39% { background-image: linear-gradient(90deg, var(--admin-name-color-2), var(--admin-name-color-2)); }
    40%, 59% { background-image: linear-gradient(90deg, var(--admin-name-color-3), var(--admin-name-color-3)); }
    60%, 79% { background-image: linear-gradient(90deg, var(--admin-name-color-4), var(--admin-name-color-4)); }
    80%, 100% { background-image: linear-gradient(90deg, var(--admin-name-color-5), var(--admin-name-color-5)); }
}

@keyframes site-guestbook-name-text-color-random {
    0%, 14% { background-image: linear-gradient(90deg, var(--admin-name-color-3), var(--admin-name-color-3)); }
    15%, 31% { background-image: linear-gradient(90deg, var(--admin-name-color), var(--admin-name-color)); }
    32%, 48% { background-image: linear-gradient(90deg, var(--admin-name-color-5), var(--admin-name-color-5)); }
    49%, 66% { background-image: linear-gradient(90deg, var(--admin-name-color-2), var(--admin-name-color-2)); }
    67%, 83% { background-image: linear-gradient(90deg, var(--admin-name-color-4), var(--admin-name-color-4)); }
    84%, 100% { background-image: linear-gradient(90deg, var(--admin-name-color), var(--admin-name-color)); }
}

@keyframes site-guestbook-name-char-color-shuffle {
    0%, 19% { color: var(--admin-name-color); }
    20%, 39% { color: var(--admin-name-color-2); }
    40%, 59% { color: var(--admin-name-color-3); }
    60%, 79% { color: var(--admin-name-color-4); }
    80%, 100% { color: var(--admin-name-color-5); }
}

@keyframes site-guestbook-name-char-color-random {
    0%, 14% { color: var(--admin-name-color-3); }
    15%, 31% { color: var(--admin-name-color); }
    32%, 48% { color: var(--admin-name-color-5); }
    49%, 66% { color: var(--admin-name-color-2); }
    67%, 83% { color: var(--admin-name-color-4); }
    84%, 100% { color: var(--admin-name-color); }
}

@keyframes site-guestbook-name-stripe-pair-shuffle {
    0%, 19% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-1-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-1-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
    20%, 39% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-2-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-2-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
    40%, 59% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-3-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-3-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
    60%, 79% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-4-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-4-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
    80%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-5-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-5-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
}

@keyframes site-guestbook-name-stripe-pair-random {
    0%, 16% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-3-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-3-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
    17%, 33% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-1-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-1-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
    34%, 51% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-5-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-5-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
    52%, 69% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-2-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-2-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
    70%, 84% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-4-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-4-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
    85%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-1-a) 0 var(--admin-name-stripe-width), var(--admin-name-stripe-pair-1-b) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2)); }
}

@keyframes site-guestbook-name-stripe-accent-switch {
    0%, 19.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    20%, 39.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    40%, 59.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    60%, 79.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    80%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-5-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-5-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
}

@keyframes site-guestbook-name-stripe-accent-random {
    0%, 19.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    20%, 39.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    40%, 59.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-5-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-5-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    60%, 79.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    80%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
}

@keyframes site-guestbook-name-stripe-accent-switch-1 {
    0%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
}

@keyframes site-guestbook-name-stripe-accent-switch-2 {
    0%, 49.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    50%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
}

@keyframes site-guestbook-name-stripe-accent-switch-3 {
    0%, 33.32% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    33.33%, 66.65% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    66.66%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
}

@keyframes site-guestbook-name-stripe-accent-switch-4 {
    0%, 24.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    25%, 49.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    50%, 74.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    75%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
}

@keyframes site-guestbook-name-stripe-accent-random-1 {
    0%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
}

@keyframes site-guestbook-name-stripe-accent-random-2 {
    0%, 49.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    50%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
}

@keyframes site-guestbook-name-stripe-accent-random-3 {
    0%, 33.32% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    33.33%, 66.65% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    66.66%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
}

@keyframes site-guestbook-name-stripe-accent-random-4 {
    0%, 24.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    25%, 49.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    50%, 74.99% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
    75%, 100% { background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3)); }
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.is-bold {
    font-weight: 900;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.is-italic {
    font-style: italic;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.is-shaded {
    text-shadow:
        0 0 4px color-mix(in srgb, var(--admin-name-glow-color, var(--admin-name-color)) 80%, transparent),
        0 0 9px color-mix(in srgb, var(--admin-name-glow-color, var(--admin-name-color)) 62%, transparent);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom:is(.site-guestbook-admin-name-text-gradient, .site-guestbook-admin-name-text-rainbow, .site-guestbook-admin-name-text-stripes, .site-guestbook-admin-name-text-shuffle) {
    text-shadow: none;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom:is(.site-guestbook-admin-name-text-gradient, .site-guestbook-admin-name-text-rainbow, .site-guestbook-admin-name-text-stripes, .site-guestbook-admin-name-text-shuffle) .site-guestbook-admin-name-text {
    display: inline-block;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text;
    -webkit-background-clip: text;
    background-position: 0 center;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-gradient .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-gradient var(--admin-name-text-duration, 3.4s) linear infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-gradient.site-guestbook-admin-name-gradient-original .site-guestbook-admin-name-text {
    background-image: linear-gradient(90deg, var(--admin-name-color) 0%, var(--admin-name-color-2) 50%, var(--admin-name-color) 100%);
    background-size: var(--admin-name-text-gradient-size, 12.94em) 100%;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-gradient.site-guestbook-admin-name-gradient-colors-3 .site-guestbook-admin-name-text {
    background-image: linear-gradient(90deg, var(--admin-name-color) 0%, var(--admin-name-color-2) 33.333%, var(--admin-name-color-3) 66.666%, var(--admin-name-color) 100%);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-gradient.site-guestbook-admin-name-gradient-colors-4 .site-guestbook-admin-name-text {
    background-image: linear-gradient(90deg, var(--admin-name-color) 0%, var(--admin-name-color-2) 25%, var(--admin-name-color-3) 50%, var(--admin-name-color-4) 75%, var(--admin-name-color) 100%);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-gradient.site-guestbook-admin-name-gradient-colors-5 .site-guestbook-admin-name-text {
    background-image: linear-gradient(90deg, var(--admin-name-color) 0%, var(--admin-name-color-2) 20%, var(--admin-name-color-3) 40%, var(--admin-name-color-4) 60%, var(--admin-name-color-5) 80%, var(--admin-name-color) 100%);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-rainbow .site-guestbook-admin-name-text {
    background-image: linear-gradient(90deg, #ff244f 0%, #ff8a00 14.285%, #ffe94f 28.57%, #35ff80 42.855%, #00d9ff 57.14%, #7c4dff 71.425%, #ff2bd6 85.71%, #ff244f 100%);
    background-size: var(--admin-name-text-rainbow-size, 15.29em) 100%;
    animation: site-guestbook-name-text-rainbow var(--admin-name-text-duration, 4.2s) linear infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-shuffle .site-guestbook-admin-name-text {
    background-image: linear-gradient(90deg, var(--admin-name-color), var(--admin-name-color));
    background-size: 100% 100%;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-shuffle.site-guestbook-admin-name-shuffle-shuffle .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-color-shuffle var(--admin-name-text-duration, 3s) steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-shuffle.site-guestbook-admin-name-shuffle-random .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-color-random var(--admin-name-text-duration, 3.4s) steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle {
    text-shadow: none;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle .site-guestbook-admin-name-text {
    display: inline-flex;
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
    background: transparent;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle .site-guestbook-admin-name-char {
    display: inline-block;
    color: var(--admin-name-color);
    -webkit-text-fill-color: currentColor;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle .site-guestbook-admin-name-char-1 {
    color: var(--admin-name-color);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle .site-guestbook-admin-name-char-2 {
    color: var(--admin-name-color-2);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle .site-guestbook-admin-name-char-3 {
    color: var(--admin-name-color-3);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle .site-guestbook-admin-name-char-4 {
    color: var(--admin-name-color-4);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle .site-guestbook-admin-name-char-5 {
    color: var(--admin-name-color-5);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.site-guestbook-admin-name-shuffle-shuffle .site-guestbook-admin-name-char {
    animation: site-guestbook-name-char-color-shuffle var(--admin-name-text-duration, 3s) steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.site-guestbook-admin-name-shuffle-shuffle .site-guestbook-admin-name-char-2 {
    animation-delay: -0.6s;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.site-guestbook-admin-name-shuffle-shuffle .site-guestbook-admin-name-char-3 {
    animation-delay: -1.2s;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.site-guestbook-admin-name-shuffle-shuffle .site-guestbook-admin-name-char-4 {
    animation-delay: -1.8s;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.site-guestbook-admin-name-shuffle-shuffle .site-guestbook-admin-name-char-5 {
    animation-delay: -2.4s;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.site-guestbook-admin-name-shuffle-random .site-guestbook-admin-name-char {
    animation: site-guestbook-name-char-color-random var(--admin-name-text-duration, 3.4s) steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.site-guestbook-admin-name-shuffle-random .site-guestbook-admin-name-char-2 {
    animation-delay: -1.15s;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.site-guestbook-admin-name-shuffle-random .site-guestbook-admin-name-char-3 {
    animation-delay: -2.2s;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.site-guestbook-admin-name-shuffle-random .site-guestbook-admin-name-char-4 {
    animation-delay: -0.45s;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.site-guestbook-admin-name-shuffle-random .site-guestbook-admin-name-char-5 {
    animation-delay: -2.85s;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.is-shaded .site-guestbook-admin-name-char {
    text-shadow:
        0 0 4px currentColor,
        0 0 9px currentColor;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-char-shuffle.has-custom-glow.is-shaded .site-guestbook-admin-name-char {
    text-shadow:
        0 0 4px color-mix(in srgb, var(--admin-name-glow-color) 80%, transparent),
        0 0 9px color-mix(in srgb, var(--admin-name-glow-color) 62%, transparent);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes {
    --admin-name-stripe-width: 1.06em;
    --admin-name-stripe-count: 3;
    --admin-name-stripe-period: calc(var(--admin-name-stripe-width) * var(--admin-name-stripe-count));
    --admin-name-stripe-diagonal-period: 5em;
    --admin-name-stripe-accent-animation: site-guestbook-name-stripe-accent-switch-3;
    --admin-name-stripe-accent-random-animation: site-guestbook-name-stripe-accent-random-3;
    --admin-name-stripe-angle: 90deg;
    --admin-name-stripe-start-x: 0px;
    --admin-name-stripe-start-y: 0px;
    --admin-name-stripe-duration: 1.8s;
    --admin-name-stripe-opacity: 1;
    --admin-name-stripe-pair-1-a: #ff3018;
    --admin-name-stripe-pair-1-b: #ff3018;
    --admin-name-stripe-pair-2-a: #ff6a55;
    --admin-name-stripe-pair-2-b: #ff6a55;
    --admin-name-stripe-pair-3-a: #c90000;
    --admin-name-stripe-pair-3-b: #c90000;
    --admin-name-stripe-pair-4-a: #ff8a00;
    --admin-name-stripe-pair-4-b: #ff8a00;
    --admin-name-stripe-pair-5-a: #7d1206;
    --admin-name-stripe-pair-5-b: #7d1206;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-stripes-1 {
    --admin-name-stripe-count: 1;
    --admin-name-stripe-width: 2.2em;
    --admin-name-stripe-accent-animation: site-guestbook-name-stripe-accent-switch-1;
    --admin-name-stripe-accent-random-animation: site-guestbook-name-stripe-accent-random-1;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-stripes-2 {
    --admin-name-stripe-count: 2;
    --admin-name-stripe-width: 1.53em;
    --admin-name-stripe-accent-animation: site-guestbook-name-stripe-accent-switch-2;
    --admin-name-stripe-accent-random-animation: site-guestbook-name-stripe-accent-random-2;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-stripes-3 {
    --admin-name-stripe-count: 3;
    --admin-name-stripe-width: 1.18em;
    --admin-name-stripe-accent-animation: site-guestbook-name-stripe-accent-switch-3;
    --admin-name-stripe-accent-random-animation: site-guestbook-name-stripe-accent-random-3;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-stripes-4 {
    --admin-name-stripe-count: 4;
    --admin-name-stripe-width: 0.94em;
    --admin-name-stripe-accent-animation: site-guestbook-name-stripe-accent-switch-4;
    --admin-name-stripe-accent-random-animation: site-guestbook-name-stripe-accent-random-4;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-stripes-5 {
    --admin-name-stripe-count: 5;
    --admin-name-stripe-width: 0.76em;
    --admin-name-stripe-accent-animation: site-guestbook-name-stripe-accent-switch;
    --admin-name-stripe-accent-random-animation: site-guestbook-name-stripe-accent-random;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes .site-guestbook-admin-name-text {
    background-repeat: repeat;
    background-size: var(--admin-name-stripe-period, 3.53em) 100%;
    background-position: var(--admin-name-stripe-start-x, 0px) var(--admin-name-stripe-start-y, 0px);
    opacity: var(--admin-name-stripe-opacity, 1);
    will-change: background-position;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-mode-different {
    --admin-name-stripe-start-x: 0px;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes:is(.site-guestbook-admin-name-stripe-animation-move, .site-guestbook-admin-name-stripe-animation-smooth) .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes var(--admin-name-stripe-duration, 1.8s) linear infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-animation-moving .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes var(--admin-name-stripe-duration, 1.8s) var(--admin-name-stripe-cycle-timing, steps(3, end)) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-animation-cycle .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes var(--admin-name-stripe-duration, 1.8s) var(--admin-name-stripe-cycle-timing, steps(3, end)) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-animation-shuffle .site-guestbook-admin-name-text {
    animation: site-guestbook-name-stripe-pair-random var(--admin-name-stripe-duration, 1.8s) steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-vertical {
    --admin-name-stripe-angle: 90deg;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-diagonal {
    --admin-name-stripe-angle: 135deg;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-diagonal .site-guestbook-admin-name-text {
    background-size: var(--admin-name-stripe-diagonal-period, 5em) var(--admin-name-stripe-diagonal-period, 5em);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripes-1 .site-guestbook-admin-name-text {
    background-image: linear-gradient(var(--admin-name-color), var(--admin-name-color));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripes-2 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-color) 0 var(--admin-name-stripe-width), var(--admin-name-color-2) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripes-3 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-color) 0 var(--admin-name-stripe-width), var(--admin-name-color-2) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-color-3) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripes-4 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-color) 0 var(--admin-name-stripe-width), var(--admin-name-color-2) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-color-3) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), var(--admin-name-color-4) calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripes-5 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-color) 0 var(--admin-name-stripe-width), var(--admin-name-color-2) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-color-3) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), var(--admin-name-color-4) calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4), var(--admin-name-color-5) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 5));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-mode-different.site-guestbook-admin-name-stripes-2 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-color-2) 0 var(--admin-name-stripe-width), var(--admin-name-color) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-mode-different.site-guestbook-admin-name-stripes-3 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-color-3) 0 var(--admin-name-stripe-width), var(--admin-name-color) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-color-2) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-mode-different.site-guestbook-admin-name-stripes-4 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-color-3) 0 var(--admin-name-stripe-width), var(--admin-name-color) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-color-4) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), var(--admin-name-color-2) calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-mode-different.site-guestbook-admin-name-stripes-5 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-color-3) 0 var(--admin-name-stripe-width), var(--admin-name-color) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-color-5) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), var(--admin-name-color-2) calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4), var(--admin-name-color-4) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 5));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-accent-shuffle .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-accent-shuffle.site-guestbook-admin-name-stripes-2 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), #ffffff calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 5), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 5) calc(var(--admin-name-stripe-width) * 6));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-accent-shuffle.site-guestbook-admin-name-stripes-3 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), #ffffff calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 5), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 5) calc(var(--admin-name-stripe-width) * 6), #ffffff calc(var(--admin-name-stripe-width) * 6) calc(var(--admin-name-stripe-width) * 7), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) calc(var(--admin-name-stripe-width) * 7) calc(var(--admin-name-stripe-width) * 8), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 8) calc(var(--admin-name-stripe-width) * 9));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-accent-shuffle.site-guestbook-admin-name-stripes-4 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), #ffffff calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 5), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 5) calc(var(--admin-name-stripe-width) * 6), #ffffff calc(var(--admin-name-stripe-width) * 6) calc(var(--admin-name-stripe-width) * 7), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) calc(var(--admin-name-stripe-width) * 7) calc(var(--admin-name-stripe-width) * 8), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 8) calc(var(--admin-name-stripe-width) * 9), #ffffff calc(var(--admin-name-stripe-width) * 9) calc(var(--admin-name-stripe-width) * 10), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 70%, white) calc(var(--admin-name-stripe-width) * 10) calc(var(--admin-name-stripe-width) * 11), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 72%, black) calc(var(--admin-name-stripe-width) * 11) calc(var(--admin-name-stripe-width) * 12));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-accent-shuffle.site-guestbook-admin-name-stripes-5 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), #ffffff calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 5), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 5) calc(var(--admin-name-stripe-width) * 6), #ffffff calc(var(--admin-name-stripe-width) * 6) calc(var(--admin-name-stripe-width) * 7), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) calc(var(--admin-name-stripe-width) * 7) calc(var(--admin-name-stripe-width) * 8), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 8) calc(var(--admin-name-stripe-width) * 9), #ffffff calc(var(--admin-name-stripe-width) * 9) calc(var(--admin-name-stripe-width) * 10), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 70%, white) calc(var(--admin-name-stripe-width) * 10) calc(var(--admin-name-stripe-width) * 11), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 72%, black) calc(var(--admin-name-stripe-width) * 11) calc(var(--admin-name-stripe-width) * 12), #ffffff calc(var(--admin-name-stripe-width) * 12) calc(var(--admin-name-stripe-width) * 13), color-mix(in srgb, var(--admin-name-stripe-pair-5-a) 70%, white) calc(var(--admin-name-stripe-width) * 13) calc(var(--admin-name-stripe-width) * 14), color-mix(in srgb, var(--admin-name-stripe-pair-5-a) 72%, black) calc(var(--admin-name-stripe-width) * 14) calc(var(--admin-name-stripe-width) * 15));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-accent-shuffle.site-guestbook-admin-name-stripe-mode-different.site-guestbook-admin-name-stripes-2 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), #ffffff calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 5), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 5) calc(var(--admin-name-stripe-width) * 6));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-accent-shuffle.site-guestbook-admin-name-stripe-mode-different.site-guestbook-admin-name-stripes-3 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), #ffffff calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 5), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 5) calc(var(--admin-name-stripe-width) * 6), #ffffff calc(var(--admin-name-stripe-width) * 6) calc(var(--admin-name-stripe-width) * 7), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) calc(var(--admin-name-stripe-width) * 7) calc(var(--admin-name-stripe-width) * 8), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 8) calc(var(--admin-name-stripe-width) * 9));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-accent-shuffle.site-guestbook-admin-name-stripe-mode-different.site-guestbook-admin-name-stripes-4 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), #ffffff calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 5), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 5) calc(var(--admin-name-stripe-width) * 6), #ffffff calc(var(--admin-name-stripe-width) * 6) calc(var(--admin-name-stripe-width) * 7), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 70%, white) calc(var(--admin-name-stripe-width) * 7) calc(var(--admin-name-stripe-width) * 8), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 72%, black) calc(var(--admin-name-stripe-width) * 8) calc(var(--admin-name-stripe-width) * 9), #ffffff calc(var(--admin-name-stripe-width) * 9) calc(var(--admin-name-stripe-width) * 10), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) calc(var(--admin-name-stripe-width) * 10) calc(var(--admin-name-stripe-width) * 11), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 11) calc(var(--admin-name-stripe-width) * 12));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-accent-shuffle.site-guestbook-admin-name-stripe-mode-different.site-guestbook-admin-name-stripes-5 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ffffff 0 var(--admin-name-stripe-width), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 70%, white) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 2), color-mix(in srgb, var(--admin-name-stripe-pair-3-a) 72%, black) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 3), #ffffff calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 4), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 70%, white) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 5), color-mix(in srgb, var(--admin-name-stripe-pair-1-a) 72%, black) calc(var(--admin-name-stripe-width) * 5) calc(var(--admin-name-stripe-width) * 6), #ffffff calc(var(--admin-name-stripe-width) * 6) calc(var(--admin-name-stripe-width) * 7), color-mix(in srgb, var(--admin-name-stripe-pair-5-a) 70%, white) calc(var(--admin-name-stripe-width) * 7) calc(var(--admin-name-stripe-width) * 8), color-mix(in srgb, var(--admin-name-stripe-pair-5-a) 72%, black) calc(var(--admin-name-stripe-width) * 8) calc(var(--admin-name-stripe-width) * 9), #ffffff calc(var(--admin-name-stripe-width) * 9) calc(var(--admin-name-stripe-width) * 10), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 70%, white) calc(var(--admin-name-stripe-width) * 10) calc(var(--admin-name-stripe-width) * 11), color-mix(in srgb, var(--admin-name-stripe-pair-2-a) 72%, black) calc(var(--admin-name-stripe-width) * 11) calc(var(--admin-name-stripe-width) * 12), #ffffff calc(var(--admin-name-stripe-width) * 12) calc(var(--admin-name-stripe-width) * 13), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 70%, white) calc(var(--admin-name-stripe-width) * 13) calc(var(--admin-name-stripe-width) * 14), color-mix(in srgb, var(--admin-name-stripe-pair-4-a) 72%, black) calc(var(--admin-name-stripe-width) * 14) calc(var(--admin-name-stripe-width) * 15));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-shuffle.site-guestbook-admin-name-stripes-2 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-1-a) 0 calc(var(--admin-name-stripe-width) * 0.5), var(--admin-name-stripe-pair-1-b) calc(var(--admin-name-stripe-width) * 0.5) var(--admin-name-stripe-width), var(--admin-name-stripe-pair-2-a) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 1.5), var(--admin-name-stripe-pair-2-b) calc(var(--admin-name-stripe-width) * 1.5) calc(var(--admin-name-stripe-width) * 2));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-shuffle.site-guestbook-admin-name-stripes-3 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-1-a) 0 calc(var(--admin-name-stripe-width) * 0.5), var(--admin-name-stripe-pair-1-b) calc(var(--admin-name-stripe-width) * 0.5) var(--admin-name-stripe-width), var(--admin-name-stripe-pair-2-a) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 1.5), var(--admin-name-stripe-pair-2-b) calc(var(--admin-name-stripe-width) * 1.5) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-stripe-pair-3-a) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 2.5), var(--admin-name-stripe-pair-3-b) calc(var(--admin-name-stripe-width) * 2.5) calc(var(--admin-name-stripe-width) * 3));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-shuffle.site-guestbook-admin-name-stripes-4 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-1-a) 0 calc(var(--admin-name-stripe-width) * 0.5), var(--admin-name-stripe-pair-1-b) calc(var(--admin-name-stripe-width) * 0.5) var(--admin-name-stripe-width), var(--admin-name-stripe-pair-2-a) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 1.5), var(--admin-name-stripe-pair-2-b) calc(var(--admin-name-stripe-width) * 1.5) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-stripe-pair-3-a) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 2.5), var(--admin-name-stripe-pair-3-b) calc(var(--admin-name-stripe-width) * 2.5) calc(var(--admin-name-stripe-width) * 3), var(--admin-name-stripe-pair-4-a) calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 3.5), var(--admin-name-stripe-pair-4-b) calc(var(--admin-name-stripe-width) * 3.5) calc(var(--admin-name-stripe-width) * 4));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-shuffle.site-guestbook-admin-name-stripes-5 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-1-a) 0 calc(var(--admin-name-stripe-width) * 0.5), var(--admin-name-stripe-pair-1-b) calc(var(--admin-name-stripe-width) * 0.5) var(--admin-name-stripe-width), var(--admin-name-stripe-pair-2-a) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 1.5), var(--admin-name-stripe-pair-2-b) calc(var(--admin-name-stripe-width) * 1.5) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-stripe-pair-3-a) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 2.5), var(--admin-name-stripe-pair-3-b) calc(var(--admin-name-stripe-width) * 2.5) calc(var(--admin-name-stripe-width) * 3), var(--admin-name-stripe-pair-4-a) calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 3.5), var(--admin-name-stripe-pair-4-b) calc(var(--admin-name-stripe-width) * 3.5) calc(var(--admin-name-stripe-width) * 4), var(--admin-name-stripe-pair-5-a) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 4.5), var(--admin-name-stripe-pair-5-b) calc(var(--admin-name-stripe-width) * 4.5) calc(var(--admin-name-stripe-width) * 5));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-random.site-guestbook-admin-name-stripes-2 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-2-a) 0 calc(var(--admin-name-stripe-width) * 0.5), var(--admin-name-stripe-pair-2-b) calc(var(--admin-name-stripe-width) * 0.5) var(--admin-name-stripe-width), var(--admin-name-stripe-pair-1-a) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 1.5), var(--admin-name-stripe-pair-1-b) calc(var(--admin-name-stripe-width) * 1.5) calc(var(--admin-name-stripe-width) * 2));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-random.site-guestbook-admin-name-stripes-3 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-3-a) 0 calc(var(--admin-name-stripe-width) * 0.5), var(--admin-name-stripe-pair-3-b) calc(var(--admin-name-stripe-width) * 0.5) var(--admin-name-stripe-width), var(--admin-name-stripe-pair-1-a) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 1.5), var(--admin-name-stripe-pair-1-b) calc(var(--admin-name-stripe-width) * 1.5) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-stripe-pair-2-a) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 2.5), var(--admin-name-stripe-pair-2-b) calc(var(--admin-name-stripe-width) * 2.5) calc(var(--admin-name-stripe-width) * 3));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-random.site-guestbook-admin-name-stripes-4 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-3-a) 0 calc(var(--admin-name-stripe-width) * 0.5), var(--admin-name-stripe-pair-3-b) calc(var(--admin-name-stripe-width) * 0.5) var(--admin-name-stripe-width), var(--admin-name-stripe-pair-1-a) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 1.5), var(--admin-name-stripe-pair-1-b) calc(var(--admin-name-stripe-width) * 1.5) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-stripe-pair-4-a) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 2.5), var(--admin-name-stripe-pair-4-b) calc(var(--admin-name-stripe-width) * 2.5) calc(var(--admin-name-stripe-width) * 3), var(--admin-name-stripe-pair-2-a) calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 3.5), var(--admin-name-stripe-pair-2-b) calc(var(--admin-name-stripe-width) * 3.5) calc(var(--admin-name-stripe-width) * 4));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-random.site-guestbook-admin-name-stripes-5 .site-guestbook-admin-name-text {
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), var(--admin-name-stripe-pair-3-a) 0 calc(var(--admin-name-stripe-width) * 0.5), var(--admin-name-stripe-pair-3-b) calc(var(--admin-name-stripe-width) * 0.5) var(--admin-name-stripe-width), var(--admin-name-stripe-pair-1-a) var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 1.5), var(--admin-name-stripe-pair-1-b) calc(var(--admin-name-stripe-width) * 1.5) calc(var(--admin-name-stripe-width) * 2), var(--admin-name-stripe-pair-5-a) calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 2.5), var(--admin-name-stripe-pair-5-b) calc(var(--admin-name-stripe-width) * 2.5) calc(var(--admin-name-stripe-width) * 3), var(--admin-name-stripe-pair-2-a) calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 3.5), var(--admin-name-stripe-pair-2-b) calc(var(--admin-name-stripe-width) * 3.5) calc(var(--admin-name-stripe-width) * 4), var(--admin-name-stripe-pair-4-a) calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 4.5), var(--admin-name-stripe-pair-4-b) calc(var(--admin-name-stripe-width) * 4.5) calc(var(--admin-name-stripe-width) * 5));
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-rainbow .site-guestbook-admin-name-text {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background-image: repeating-linear-gradient(var(--admin-name-stripe-angle), #ff244f 0 calc(var(--admin-name-stripe-width) * 0.5), transparent calc(var(--admin-name-stripe-width) * 0.5) var(--admin-name-stripe-width), #ff8a00 var(--admin-name-stripe-width) calc(var(--admin-name-stripe-width) * 1.5), transparent calc(var(--admin-name-stripe-width) * 1.5) calc(var(--admin-name-stripe-width) * 2), #ffe94f calc(var(--admin-name-stripe-width) * 2) calc(var(--admin-name-stripe-width) * 2.5), transparent calc(var(--admin-name-stripe-width) * 2.5) calc(var(--admin-name-stripe-width) * 3), #35ff80 calc(var(--admin-name-stripe-width) * 3) calc(var(--admin-name-stripe-width) * 3.5), transparent calc(var(--admin-name-stripe-width) * 3.5) calc(var(--admin-name-stripe-width) * 4), #00d9ff calc(var(--admin-name-stripe-width) * 4) calc(var(--admin-name-stripe-width) * 4.5), transparent calc(var(--admin-name-stripe-width) * 4.5) calc(var(--admin-name-stripe-width) * 5), #7c4dff calc(var(--admin-name-stripe-width) * 5) calc(var(--admin-name-stripe-width) * 5.5), transparent calc(var(--admin-name-stripe-width) * 5.5) calc(var(--admin-name-stripe-width) * 6), #ff2bd6 calc(var(--admin-name-stripe-width) * 6) calc(var(--admin-name-stripe-width) * 6.5), transparent calc(var(--admin-name-stripe-width) * 6.5) calc(var(--admin-name-stripe-width) * 7));
    background-blend-mode: normal;
    background-size: var(--admin-name-stripe-period, 3.53em) 100%;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-rainbow .site-guestbook-admin-name-text::after {
    content: attr(data-admin-name);
    position: absolute;
    inset: 0;
    z-index: 3;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    background-image: inherit;
    background-repeat: inherit;
    background-position: inherit;
    background-size: inherit;
    background-clip: text;
    -webkit-background-clip: text;
    animation: inherit;
    pointer-events: none;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-diagonal.site-guestbook-admin-name-stripe-shuffle-rainbow .site-guestbook-admin-name-text {
    background-size: var(--admin-name-stripe-diagonal-period, 5em) var(--admin-name-stripe-diagonal-period, 5em);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-shuffle .site-guestbook-admin-name-text {
    animation: none;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-shuffle-random .site-guestbook-admin-name-text {
    animation: none;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-animation-moving.site-guestbook-admin-name-stripe-shuffle-accent-shuffle .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes var(--admin-name-stripe-duration, 1.8s) var(--admin-name-stripe-cycle-timing, steps(3, end)) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-animation-moving.site-guestbook-admin-name-stripe-mode-different.site-guestbook-admin-name-stripe-shuffle-accent-shuffle .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes var(--admin-name-stripe-duration, 1.8s) var(--admin-name-stripe-cycle-timing, steps(3, end)) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes:is(.site-guestbook-admin-name-stripe-animation-move, .site-guestbook-admin-name-stripe-animation-smooth).site-guestbook-admin-name-stripe-shuffle-shuffle .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes var(--admin-name-stripe-duration, 1.8s) linear infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes:is(.site-guestbook-admin-name-stripe-animation-move, .site-guestbook-admin-name-stripe-animation-smooth).site-guestbook-admin-name-stripe-shuffle-random .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes var(--admin-name-stripe-duration, 1.8s) linear infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-diagonal:is(.site-guestbook-admin-name-stripe-animation-move, .site-guestbook-admin-name-stripe-animation-smooth) .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes-diagonal var(--admin-name-stripe-duration, 1.8s) linear infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-diagonal.site-guestbook-admin-name-stripe-animation-moving .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes-diagonal var(--admin-name-stripe-duration, 1.8s) var(--admin-name-stripe-cycle-timing, steps(3, end)) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-diagonal.site-guestbook-admin-name-stripe-animation-cycle .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes-diagonal var(--admin-name-stripe-duration, 1.8s) var(--admin-name-stripe-cycle-timing, steps(3, end)) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-diagonal.site-guestbook-admin-name-stripe-animation-moving.site-guestbook-admin-name-stripe-shuffle-accent-shuffle .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes-diagonal var(--admin-name-stripe-duration, 1.8s) var(--admin-name-stripe-cycle-timing, steps(3, end)) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-diagonal.site-guestbook-admin-name-stripe-animation-moving.site-guestbook-admin-name-stripe-mode-different.site-guestbook-admin-name-stripe-shuffle-accent-shuffle .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes-diagonal var(--admin-name-stripe-duration, 1.8s) var(--admin-name-stripe-cycle-timing, steps(3, end)) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-diagonal:is(.site-guestbook-admin-name-stripe-animation-move, .site-guestbook-admin-name-stripe-animation-smooth).site-guestbook-admin-name-stripe-shuffle-shuffle .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes-diagonal var(--admin-name-stripe-duration, 1.8s) linear infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-stripes.site-guestbook-admin-name-stripe-diagonal:is(.site-guestbook-admin-name-stripe-animation-move, .site-guestbook-admin-name-stripe-animation-smooth).site-guestbook-admin-name-stripe-shuffle-random .site-guestbook-admin-name-text {
    animation: site-guestbook-name-text-stripes-diagonal var(--admin-name-stripe-duration, 1.8s) linear infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom:is(.site-guestbook-admin-name-text-gradient, .site-guestbook-admin-name-text-rainbow, .site-guestbook-admin-name-text-stripes, .site-guestbook-admin-name-text-shuffle).is-shaded .site-guestbook-admin-name-text::before {
    content: attr(data-admin-name);
    position: absolute;
    inset: 0;
    z-index: -1;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    background-image: inherit;
    background-clip: text;
    -webkit-background-clip: text;
    background-position: inherit;
    background-size: inherit;
    filter: blur(5px);
    opacity: 0.86;
    animation: inherit;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-gradient.site-guestbook-admin-name-gradient-original.is-shaded .site-guestbook-admin-name-text::before {
    background-image: linear-gradient(90deg, var(--admin-name-color) 0%, var(--admin-name-color-2) 50%, var(--admin-name-color) 100%);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-gradient.site-guestbook-admin-name-gradient-colors-3.is-shaded .site-guestbook-admin-name-text::before {
    background-image: linear-gradient(90deg, var(--admin-name-color) 0%, var(--admin-name-color-2) 33.333%, var(--admin-name-color-3) 66.666%, var(--admin-name-color) 100%);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-gradient.site-guestbook-admin-name-gradient-colors-4.is-shaded .site-guestbook-admin-name-text::before {
    background-image: linear-gradient(90deg, var(--admin-name-color) 0%, var(--admin-name-color-2) 25%, var(--admin-name-color-3) 50%, var(--admin-name-color-4) 75%, var(--admin-name-color) 100%);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-gradient.site-guestbook-admin-name-gradient-colors-5.is-shaded .site-guestbook-admin-name-text::before {
    background-image: linear-gradient(90deg, var(--admin-name-color) 0%, var(--admin-name-color-2) 20%, var(--admin-name-color-3) 40%, var(--admin-name-color-4) 60%, var(--admin-name-color-5) 80%, var(--admin-name-color) 100%);
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-rainbow.is-shaded .site-guestbook-admin-name-text::before {
    background-image: linear-gradient(90deg, #ff244f 0%, #ff8a00 14.285%, #ffe94f 28.57%, #35ff80 42.855%, #00d9ff 57.14%, #7c4dff 71.425%, #ff2bd6 85.71%, #ff244f 100%);
    background-size: var(--admin-name-text-rainbow-size, 15.29em) 100%;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-shuffle.site-guestbook-admin-name-shuffle-shuffle.is-shaded .site-guestbook-admin-name-text::before {
    animation: site-guestbook-name-text-color-shuffle var(--admin-name-text-duration, 3s) steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-text-shuffle.site-guestbook-admin-name-shuffle-random.is-shaded .site-guestbook-admin-name-text::before {
    animation: site-guestbook-name-text-color-random var(--admin-name-text-duration, 3.4s) steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-custom-glow:is(.site-guestbook-admin-name-text-gradient, .site-guestbook-admin-name-text-rainbow, .site-guestbook-admin-name-text-stripes, .site-guestbook-admin-name-text-shuffle).is-shaded .site-guestbook-admin-name-text::before {
    background-image: linear-gradient(90deg, var(--admin-name-glow-color), var(--admin-name-glow-color));
    animation: none;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom:not(.site-guestbook-admin-name-effect-none) {
    color: var(--admin-name-color) !important;
    -webkit-text-fill-color: var(--admin-name-color) !important;
    background: transparent !important;
    background-clip: padding-box !important;
    -webkit-background-clip: padding-box !important;
    border-color: color-mix(in srgb, var(--admin-name-color) 45%, transparent) !important;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom:not(.site-guestbook-admin-name-effect-none)::before {
    content: '';
    position: absolute;
    inset: var(--admin-name-effect-inset);
    pointer-events: none;
    background-color: transparent;
    background-image: var(--admin-name-effect-image);
    background-repeat: var(--admin-name-effect-repeat);
    background-position: var(--admin-name-effect-position);
    background-size: var(--admin-name-effect-size);
    filter:
        hue-rotate(var(--admin-name-effect-hue))
        saturate(var(--admin-name-effect-saturation))
        brightness(var(--admin-name-effect-brightness));
    z-index: 0;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom:not(.site-guestbook-admin-name-effect-none)::after {
    content: '';
    display: none;
    position: absolute;
    inset: var(--admin-name-effect-inset);
    pointer-events: none;
    background: var(--admin-name-effect-color);
    mix-blend-mode: var(--admin-name-effect-blend);
    opacity: var(--admin-name-effect-opacity);
    filter:
        hue-rotate(var(--admin-name-effect-hue))
        saturate(var(--admin-name-effect-saturation))
        brightness(var(--admin-name-effect-brightness));
    -webkit-mask-image: var(--admin-name-effect-image);
    mask-image: var(--admin-name-effect-image);
    -webkit-mask-repeat: var(--admin-name-effect-repeat);
    mask-repeat: var(--admin-name-effect-repeat);
    -webkit-mask-position: var(--admin-name-effect-position);
    mask-position: var(--admin-name-effect-position);
    -webkit-mask-size: var(--admin-name-effect-size);
    mask-size: var(--admin-name-effect-size);
    z-index: 1;
}

.site-guestbook-admin-name-text {
    position: relative;
    display: inline-block;
    padding-inline: 0.08em;
    margin-inline: -0.04em;
    z-index: 2;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-layer-front::before {
    z-index: 4;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-layer-front::after {
    z-index: 5;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-layer-behind::before {
    z-index: 0;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-layer-behind::after {
    z-index: 1;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-sparkle-1 {
    --admin-name-effect-image: url("../assets/name-effects/sparkle-1.gif");
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-sparkle-2 {
    --admin-name-effect-image: url("../assets/name-effects/sparkle-2.gif");
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-sparkle-3 {
    --admin-name-effect-image: url("../assets/name-effects/sparkle-3.gif");
    --admin-name-effect-repeat: no-repeat;
    --admin-name-effect-position: center;
    --admin-name-effect-size: 100% 100%;
    --admin-name-effect-inset: -2px -2px;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-sparkle-4 {
    --admin-name-effect-image: url("../assets/name-effects/sparkle-4.gif");
    --admin-name-effect-repeat: no-repeat;
    --admin-name-effect-position: center;
    --admin-name-effect-size: 100% 100%;
    --admin-name-effect-inset: -2px -2px;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-sparkle-5 {
    --admin-name-effect-image: url("../assets/name-effects/sparkle-5.gif");
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-fire-1 {
    --admin-name-effect-image: url("../assets/name-effects/fire-1.gif");
    --admin-name-effect-repeat: repeat-x;
    --admin-name-effect-position: center bottom;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-fire-2 {
    --admin-name-effect-image: url("../assets/name-effects/fire-2.gif");
    --admin-name-effect-repeat: no-repeat;
    --admin-name-effect-position: center bottom;
    --admin-name-effect-size: 100% 100%;
    --admin-name-effect-inset: -3px -6px;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-fire-3 {
    --admin-name-effect-image: url("../assets/name-effects/fire-3.gif");
    --admin-name-effect-repeat: no-repeat;
    --admin-name-effect-position: center bottom;
    --admin-name-effect-size: 100% 100%;
    --admin-name-effect-inset: -3px -6px;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-confetti {
    --admin-name-effect-image: url("../assets/name-effects/confetti.gif");
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-lightning {
    --admin-name-effect-image:
        url("../assets/name-effects/lightning-1.gif"),
        url("../assets/name-effects/lightning-2.gif"),
        url("../assets/name-effects/lightning-3.gif");
    --admin-name-effect-repeat: no-repeat, no-repeat, no-repeat;
    --admin-name-effect-position: left center, center center, right center;
    --admin-name-effect-size: 34% auto, 34% auto, 34% auto;
    --admin-name-effect-inset: -9px -16px;
}

@keyframes site-guestbook-name-lightning-bg-shuffle {
    0%, 19% {
        background-image:
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-2.gif"),
            url("../assets/name-effects/lightning-3.gif");
    }
    20%, 39% {
        background-image:
            url("../assets/name-effects/lightning-3.gif"),
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-2.gif");
    }
    40%, 59% {
        background-image:
            url("../assets/name-effects/lightning-2.gif"),
            url("../assets/name-effects/lightning-3.gif"),
            url("../assets/name-effects/lightning-1.gif");
    }
    60%, 79% {
        background-image:
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-3.gif"),
            url("../assets/name-effects/lightning-2.gif");
    }
    80%, 100% {
        background-image:
            url("../assets/name-effects/lightning-2.gif"),
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-3.gif");
    }
}

@keyframes site-guestbook-name-lightning-mask-shuffle {
    0%, 19% {
        -webkit-mask-image:
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-2.gif"),
            url("../assets/name-effects/lightning-3.gif");
        mask-image:
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-2.gif"),
            url("../assets/name-effects/lightning-3.gif");
    }
    20%, 39% {
        -webkit-mask-image:
            url("../assets/name-effects/lightning-3.gif"),
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-2.gif");
        mask-image:
            url("../assets/name-effects/lightning-3.gif"),
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-2.gif");
    }
    40%, 59% {
        -webkit-mask-image:
            url("../assets/name-effects/lightning-2.gif"),
            url("../assets/name-effects/lightning-3.gif"),
            url("../assets/name-effects/lightning-1.gif");
        mask-image:
            url("../assets/name-effects/lightning-2.gif"),
            url("../assets/name-effects/lightning-3.gif"),
            url("../assets/name-effects/lightning-1.gif");
    }
    60%, 79% {
        -webkit-mask-image:
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-3.gif"),
            url("../assets/name-effects/lightning-2.gif");
        mask-image:
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-3.gif"),
            url("../assets/name-effects/lightning-2.gif");
    }
    80%, 100% {
        -webkit-mask-image:
            url("../assets/name-effects/lightning-2.gif"),
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-3.gif");
        mask-image:
            url("../assets/name-effects/lightning-2.gif"),
            url("../assets/name-effects/lightning-1.gif"),
            url("../assets/name-effects/lightning-3.gif");
    }
}

@keyframes site-guestbook-name-lightning-depth-shuffle {
    0%, 18%, 32%, 52%, 67%, 100% {
        z-index: 0;
    }
    19%, 25%, 53%, 58%, 68%, 73% {
        z-index: 3;
    }
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-lightning::before {
    animation:
        site-guestbook-name-lightning-bg-shuffle 1.45s steps(1, end) infinite,
        site-guestbook-name-lightning-depth-shuffle 2.1s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-lightning::after {
    animation:
        site-guestbook-name-lightning-mask-shuffle 1.45s steps(1, end) infinite,
        site-guestbook-name-lightning-depth-shuffle 2.1s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-layer-behind.site-guestbook-admin-name-effect-lightning::before {
    z-index: 0;
    animation: site-guestbook-name-lightning-bg-shuffle 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-layer-behind.has-effect-color.site-guestbook-admin-name-effect-lightning::after {
    z-index: 1;
    animation: site-guestbook-name-lightning-mask-shuffle 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-layer-front.site-guestbook-admin-name-effect-lightning::before {
    z-index: 4;
    animation: site-guestbook-name-lightning-bg-shuffle 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-layer-front.has-effect-color.site-guestbook-admin-name-effect-lightning::after {
    z-index: 5;
    animation: site-guestbook-name-lightning-mask-shuffle 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color:not(.site-guestbook-admin-name-effect-none)::after {
    display: block;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-blend-normal:not(.site-guestbook-admin-name-effect-none)::before {
    opacity: 0;
}

@keyframes site-guestbook-name-effect-rainbow {
    from { background-position: 0 center; }
    to { background-position: -520px center; }
}

@keyframes site-guestbook-name-effect-color-shuffle {
    0%, 19% { background: var(--admin-name-effect-color-1); }
    20%, 39% { background: var(--admin-name-effect-color-2); }
    40%, 59% { background: var(--admin-name-effect-color-3); }
    60%, 79% { background: var(--admin-name-effect-color-4); }
    80%, 100% { background: var(--admin-name-effect-color-5); }
}

@keyframes site-guestbook-name-effect-color-random {
    0%, 14% { background: var(--admin-name-effect-color-3); }
    15%, 31% { background: var(--admin-name-effect-color-1); }
    32%, 48% { background: var(--admin-name-effect-color-5); }
    49%, 66% { background: var(--admin-name-effect-color-2); }
    67%, 83% { background: var(--admin-name-effect-color-4); }
    84%, 100% { background: var(--admin-name-effect-color-1); }
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-color-shuffle:not(.site-guestbook-admin-name-effect-none)::after,
.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-color-shuffle .site-guestbook-admin-name-layer:not(.has-layer-effect-color):not(.site-guestbook-admin-name-layer-effect-off)::after {
    animation: site-guestbook-name-effect-color-shuffle 3s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-color-random:not(.site-guestbook-admin-name-effect-none)::after,
.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-color-random .site-guestbook-admin-name-layer:not(.has-layer-effect-color):not(.site-guestbook-admin-name-layer-effect-off)::after {
    animation: site-guestbook-name-effect-color-random 3.4s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-color-shuffle.site-guestbook-admin-name-effect-lightning::after {
    animation:
        site-guestbook-name-effect-color-shuffle 3s steps(1, end) infinite,
        site-guestbook-name-lightning-mask-shuffle 1.45s steps(1, end) infinite,
        site-guestbook-name-lightning-depth-shuffle 2.1s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-color-random.site-guestbook-admin-name-effect-lightning::after {
    animation:
        site-guestbook-name-effect-color-random 3.4s steps(1, end) infinite,
        site-guestbook-name-lightning-mask-shuffle 1.45s steps(1, end) infinite,
        site-guestbook-name-lightning-depth-shuffle 2.1s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-layer-behind.has-effect-color:is(.site-guestbook-admin-name-effect-color-shuffle, .site-guestbook-admin-name-effect-color-random).site-guestbook-admin-name-effect-lightning::after,
.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-layer-front.has-effect-color:is(.site-guestbook-admin-name-effect-color-shuffle, .site-guestbook-admin-name-effect-color-random).site-guestbook-admin-name-effect-lightning::after {
    animation:
        var(--admin-name-effect-color-animation),
        site-guestbook-name-lightning-mask-shuffle 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-color-shuffle {
    --admin-name-effect-color-animation: site-guestbook-name-effect-color-shuffle 3s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-color-random {
    --admin-name-effect-color-animation: site-guestbook-name-effect-color-random 3.4s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color:is(.site-guestbook-admin-name-effect-color-rainbow, .site-guestbook-admin-name-effect-blend-rainbow):not(.site-guestbook-admin-name-effect-none)::after {
    background-image: linear-gradient(90deg, #ff244f 0%, #ff5a2a 8%, #ff9c00 16%, #ffe94f 25%, #8cff4f 34%, #35ff80 43%, #00eac2 52%, #00d9ff 61%, #4d8cff 70%, #7c4dff 79%, #d83cff 88%, #ff2bd6 94%, #ff244f 100%);
    background-repeat: repeat-x;
    background-position: 0 center;
    background-size: 520px 100%;
    animation: site-guestbook-name-effect-rainbow 4.8s linear infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-custom-layers::before,
.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-custom-layers::after {
    display: none !important;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.site-guestbook-admin-name-effect-custom-layers {
    overflow: visible;
}

.site-guestbook-admin-name-layer-clip {
    --admin-name-layer-origin-x: calc(0em - var(--admin-name-effect-bounds-left, -2.826em));
    --admin-name-layer-origin-y: calc(0em - var(--admin-name-effect-bounds-top, -0.978em));
    position: absolute;
    left: calc(50% + var(--admin-name-effect-bounds-left, -2.826em));
    top: calc(50% + var(--admin-name-effect-bounds-top, -0.978em));
    width: var(--admin-name-effect-bounds-width, 5.652em);
    height: var(--admin-name-effect-bounds-height, 1.956em);
    overflow: hidden;
    pointer-events: none;
}

.site-guestbook-admin-name-layer {
    --admin-name-layer-motion-distance: 0.28em;
    --admin-name-layer-position-animation: none;
    --admin-name-layer-depth-animation: none;
    --admin-name-layer-motion-animation: none;
    --admin-name-layer-x-safe: var(--admin-name-layer-x, 0px);
    --admin-name-layer-y-safe: var(--admin-name-layer-y, 0px);
    --admin-name-layer-canvas-width: 1;
    --admin-name-layer-canvas-height: 1;
    --admin-name-layer-crop-x: 0;
    --admin-name-layer-crop-y: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    width: var(--admin-name-layer-width, var(--admin-name-layer-size, 100%));
    height: var(--admin-name-layer-height, 1.7em);
    max-width: none;
    max-height: none;
    transform: translate(
        calc(-50% + var(--admin-name-layer-x-safe)),
        calc(-50% + var(--admin-name-layer-y-safe))
    ) rotate(var(--admin-name-layer-rotation, 0deg));
    animation:
        var(--admin-name-layer-position-animation),
        var(--admin-name-layer-depth-animation),
        var(--admin-name-layer-motion-animation);
    pointer-events: none;
    z-index: 0;
    transform-origin: center center;
    overflow: hidden;
}

.site-guestbook-admin-name-layer-clip .site-guestbook-admin-name-layer {
    top: var(--admin-name-layer-origin-y);
    left: var(--admin-name-layer-origin-x);
}

.site-guestbook-admin-name-layer::before,
.site-guestbook-admin-name-layer::after {
    content: '';
    position: absolute;
    left: calc(var(--admin-name-layer-crop-x, 0) * -100%);
    top: calc(var(--admin-name-layer-crop-y, 0) * -100%);
    width: calc(var(--admin-name-layer-canvas-width, 1) * 100%);
    height: calc(var(--admin-name-layer-canvas-height, 1) * 100%);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    filter:
        hue-rotate(var(--admin-name-effect-hue))
        saturate(var(--admin-name-effect-saturation))
        brightness(var(--admin-name-effect-brightness));
}

.site-guestbook-admin-name-layer::before {
    background-image: var(--admin-name-layer-image);
    opacity: var(--admin-name-layer-gif-opacity, 1);
    transform: scale(var(--admin-name-layer-flip-x, 1), var(--admin-name-layer-flip-y, 1));
    transform-origin: center center;
}

.site-guestbook-admin-name-layer::after {
    display: none;
    background: var(--admin-name-layer-effect-color, var(--admin-name-effect-color));
    mix-blend-mode: var(--admin-name-layer-effect-blend, var(--admin-name-effect-blend));
    opacity: var(--admin-name-layer-effect-opacity, var(--admin-name-effect-opacity));
    -webkit-mask-image: var(--admin-name-layer-image);
    mask-image: var(--admin-name-layer-image);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    transform: scale(var(--admin-name-layer-flip-x, 1), var(--admin-name-layer-flip-y, 1));
    transform-origin: center center;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color .site-guestbook-admin-name-layer::after {
    display: block;
}

.site-guestbook-admin-name-layer.has-layer-effect-color::after {
    display: block;
}

.site-guestbook-admin-name-layer.site-guestbook-admin-name-layer-effect-off::after {
    display: none !important;
}

.site-guestbook-admin-name-layer.has-layer-effect-color.site-guestbook-admin-name-layer-blend-normal::before,
.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-blend-normal .site-guestbook-admin-name-layer:not(.has-layer-effect-color):not(.site-guestbook-admin-name-layer-effect-off)::before {
    opacity: 0;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color:is(.site-guestbook-admin-name-effect-color-rainbow, .site-guestbook-admin-name-effect-blend-rainbow) .site-guestbook-admin-name-layer:not(.has-layer-effect-color):not(.site-guestbook-admin-name-layer-effect-off)::after,
.site-guestbook-admin-name-layer.site-guestbook-admin-name-layer-effect-rainbow::after {
    background-image: linear-gradient(90deg, #ff244f 0%, #ff5a2a 8%, #ff9c00 16%, #ffe94f 25%, #8cff4f 34%, #35ff80 43%, #00eac2 52%, #00d9ff 61%, #4d8cff 70%, #7c4dff 79%, #d83cff 88%, #ff2bd6 94%, #ff244f 100%);
    background-repeat: repeat-x;
    background-position: 0 center;
    background-size: 520px 100%;
    animation: site-guestbook-name-effect-rainbow 4.8s linear infinite;
}

.site-guestbook-admin-name-layer.site-guestbook-admin-name-layer-effect-shuffle::after {
    animation: site-guestbook-name-effect-color-shuffle 3s steps(1, end) infinite;
}

.site-guestbook-admin-name-layer.site-guestbook-admin-name-layer-effect-random::after {
    animation: site-guestbook-name-effect-color-random 3.4s steps(1, end) infinite;
}

.site-guestbook-admin-name-layer-asset-sparkle-1 { --admin-name-layer-image: url("../assets/name-effects/sparkle-1.gif"); }
.site-guestbook-admin-name-layer-asset-none { display: none !important; }
.site-guestbook-admin-name-layer-asset-sparkle-2 {
    --admin-name-layer-image: url("../assets/name-effects/sparkle-2.gif");
    --admin-name-layer-canvas-width: 1.1628;
    --admin-name-layer-canvas-height: 1.25;
    --admin-name-layer-crop-x: 0.093;
    --admin-name-layer-crop-y: 0.1;
}
.site-guestbook-admin-name-layer-asset-sparkle-3 {
    --admin-name-layer-image: url("../assets/name-effects/sparkle-3.gif");
    --admin-name-layer-canvas-width: 1.1911;
    --admin-name-layer-canvas-height: 1.2435;
    --admin-name-layer-crop-x: 0.1266;
    --admin-name-layer-crop-y: 0.1166;
}
.site-guestbook-admin-name-layer-asset-sparkle-4 {
    --admin-name-layer-image: url("../assets/name-effects/sparkle-4.gif");
    --admin-name-layer-canvas-width: 1.4243;
    --admin-name-layer-canvas-height: 1.9048;
    --admin-name-layer-crop-x: 0.181;
    --admin-name-layer-crop-y: 0.3571;
}
.site-guestbook-admin-name-layer-asset-sparkle-5 {
    --admin-name-layer-image: url("../assets/name-effects/sparkle-5.gif");
    --admin-name-layer-canvas-height: 1.2698;
}
.site-guestbook-admin-name-layer-asset-fire-1 {
    --admin-name-layer-image: url("../assets/name-effects/fire-1.gif");
    --admin-name-layer-canvas-height: 1.4286;
    --admin-name-layer-crop-y: 0.0714;
}
.site-guestbook-admin-name-layer-asset-fire-2 {
    --admin-name-layer-image: url("../assets/name-effects/fire-2.gif");
    --admin-name-layer-canvas-width: 1.1321;
    --admin-name-layer-canvas-height: 1.0665;
    --admin-name-layer-crop-x: 0.0684;
    --admin-name-layer-crop-y: 0.0462;
}
.site-guestbook-admin-name-layer-asset-fire-3 {
    --admin-name-layer-image: url("../assets/name-effects/fire-3.gif");
}
.site-guestbook-admin-name-layer-asset-confetti { --admin-name-layer-image: url("../assets/name-effects/confetti.gif"); }
.site-guestbook-admin-name-layer-asset-lightning-1 {
    --admin-name-layer-image: url("../assets/name-effects/lightning-1.gif");
    --admin-name-layer-canvas-width: 1.6667;
    --admin-name-layer-canvas-height: 1.2091;
    --admin-name-layer-crop-x: 0.2812;
    --admin-name-layer-crop-y: 0.1083;
}
.site-guestbook-admin-name-layer-asset-lightning-2 {
    --admin-name-layer-image: url("../assets/name-effects/lightning-2.gif");
    --admin-name-layer-canvas-width: 1.0323;
    --admin-name-layer-canvas-height: 1.0787;
    --admin-name-layer-crop-x: 0.0022;
    --admin-name-layer-crop-y: 0.0393;
}
.site-guestbook-admin-name-layer-asset-lightning-3 {
    --admin-name-layer-image: url("../assets/name-effects/lightning-3.gif");
    --admin-name-layer-canvas-width: 1.173;
    --admin-name-layer-canvas-height: 1.1511;
    --admin-name-layer-crop-x: 0.0723;
    --admin-name-layer-crop-y: 0.1103;
}
.site-guestbook-admin-name-layer-asset-lightning-random {
    --admin-name-layer-image: url("../assets/name-effects/lightning-1.gif");
    --admin-name-layer-canvas-width: 1.6667;
    --admin-name-layer-canvas-height: 1.2091;
    --admin-name-layer-crop-x: 0.2812;
    --admin-name-layer-crop-y: 0.1083;
}
.site-guestbook-admin-name-layer-asset-random {
    --admin-name-layer-image: url("../assets/name-effects/lightning-1.gif");
    --admin-name-layer-canvas-width: 1.6667;
    --admin-name-layer-canvas-height: 1.2091;
    --admin-name-layer-crop-x: 0.2812;
    --admin-name-layer-crop-y: 0.1083;
}

@keyframes site-guestbook-name-layer-lightning-random-bg {
    0%, 32% { background-image: url("../assets/name-effects/lightning-1.gif"); }
    33%, 65% { background-image: url("../assets/name-effects/lightning-2.gif"); }
    66%, 100% { background-image: url("../assets/name-effects/lightning-3.gif"); }
}

@keyframes site-guestbook-name-layer-lightning-random-mask {
    0%, 32% {
        -webkit-mask-image: url("../assets/name-effects/lightning-1.gif");
        mask-image: url("../assets/name-effects/lightning-1.gif");
    }
    33%, 65% {
        -webkit-mask-image: url("../assets/name-effects/lightning-2.gif");
        mask-image: url("../assets/name-effects/lightning-2.gif");
    }
    66%, 100% {
        -webkit-mask-image: url("../assets/name-effects/lightning-3.gif");
        mask-image: url("../assets/name-effects/lightning-3.gif");
    }
}

.site-guestbook-admin-name-layer-asset-lightning-random::before {
    animation: site-guestbook-name-layer-lightning-random-bg 1.2s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color .site-guestbook-admin-name-layer-asset-lightning-random::after {
    animation: site-guestbook-name-layer-lightning-random-mask 1.2s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color:is(.site-guestbook-admin-name-effect-color-rainbow, .site-guestbook-admin-name-effect-blend-rainbow) .site-guestbook-admin-name-layer-asset-lightning-random:not(.has-layer-effect-color):not(.site-guestbook-admin-name-layer-effect-off)::after,
.site-guestbook-admin-name-layer-asset-lightning-random.site-guestbook-admin-name-layer-effect-rainbow::after {
    animation:
        site-guestbook-name-effect-rainbow 4.8s linear infinite,
        site-guestbook-name-layer-lightning-random-mask 1.2s steps(1, end) infinite;
}

@keyframes site-guestbook-name-layer-gif-random-bg {
    0%, 11% { background-image: url("../assets/name-effects/lightning-1.gif"); }
    12%, 23% { background-image: url("../assets/name-effects/lightning-2.gif"); }
    24%, 35% { background-image: url("../assets/name-effects/lightning-3.gif"); }
    36%, 47% { background-image: url("../assets/name-effects/sparkle-1.gif"); }
    48%, 59% { background-image: url("../assets/name-effects/sparkle-3.gif"); }
    60%, 71% { background-image: url("../assets/name-effects/sparkle-4.gif"); }
    72%, 83% { background-image: url("../assets/name-effects/fire-2.gif"); }
    84%, 100% { background-image: url("../assets/name-effects/confetti.gif"); }
}

@keyframes site-guestbook-name-layer-gif-random-mask {
    0%, 11% {
        -webkit-mask-image: url("../assets/name-effects/lightning-1.gif");
        mask-image: url("../assets/name-effects/lightning-1.gif");
    }
    12%, 23% {
        -webkit-mask-image: url("../assets/name-effects/lightning-2.gif");
        mask-image: url("../assets/name-effects/lightning-2.gif");
    }
    24%, 35% {
        -webkit-mask-image: url("../assets/name-effects/lightning-3.gif");
        mask-image: url("../assets/name-effects/lightning-3.gif");
    }
    36%, 47% {
        -webkit-mask-image: url("../assets/name-effects/sparkle-1.gif");
        mask-image: url("../assets/name-effects/sparkle-1.gif");
    }
    48%, 59% {
        -webkit-mask-image: url("../assets/name-effects/sparkle-3.gif");
        mask-image: url("../assets/name-effects/sparkle-3.gif");
    }
    60%, 71% {
        -webkit-mask-image: url("../assets/name-effects/sparkle-4.gif");
        mask-image: url("../assets/name-effects/sparkle-4.gif");
    }
    72%, 83% {
        -webkit-mask-image: url("../assets/name-effects/fire-2.gif");
        mask-image: url("../assets/name-effects/fire-2.gif");
    }
    84%, 100% {
        -webkit-mask-image: url("../assets/name-effects/confetti.gif");
        mask-image: url("../assets/name-effects/confetti.gif");
    }
}

.site-guestbook-admin-name-layer-asset-random::before {
    animation: site-guestbook-name-layer-gif-random-bg 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color .site-guestbook-admin-name-layer-asset-random::after {
    animation: site-guestbook-name-layer-gif-random-mask 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color:is(.site-guestbook-admin-name-effect-color-rainbow, .site-guestbook-admin-name-effect-blend-rainbow) .site-guestbook-admin-name-layer-asset-random:not(.has-layer-effect-color):not(.site-guestbook-admin-name-layer-effect-off)::after,
.site-guestbook-admin-name-layer-asset-random.site-guestbook-admin-name-layer-effect-rainbow::after {
    animation:
        site-guestbook-name-effect-rainbow 4.8s linear infinite,
        site-guestbook-name-layer-gif-random-mask 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-color-shuffle .site-guestbook-admin-name-layer-asset-lightning-random:not(.has-layer-effect-color):not(.site-guestbook-admin-name-layer-effect-off)::after {
    animation:
        site-guestbook-name-effect-color-shuffle 3s steps(1, end) infinite,
        site-guestbook-name-layer-lightning-random-mask 1.2s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-color-random .site-guestbook-admin-name-layer-asset-lightning-random:not(.has-layer-effect-color):not(.site-guestbook-admin-name-layer-effect-off)::after {
    animation:
        site-guestbook-name-effect-color-random 3.4s steps(1, end) infinite,
        site-guestbook-name-layer-lightning-random-mask 1.2s steps(1, end) infinite;
}

.site-guestbook-admin-name-layer-asset-lightning-random.site-guestbook-admin-name-layer-effect-shuffle::after {
    animation:
        site-guestbook-name-effect-color-shuffle 3s steps(1, end) infinite,
        site-guestbook-name-layer-lightning-random-mask 1.2s steps(1, end) infinite;
}

.site-guestbook-admin-name-layer-asset-lightning-random.site-guestbook-admin-name-layer-effect-random::after {
    animation:
        site-guestbook-name-effect-color-random 3.4s steps(1, end) infinite,
        site-guestbook-name-layer-lightning-random-mask 1.2s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-color-shuffle .site-guestbook-admin-name-layer-asset-random:not(.has-layer-effect-color):not(.site-guestbook-admin-name-layer-effect-off)::after {
    animation:
        site-guestbook-name-effect-color-shuffle 3s steps(1, end) infinite,
        site-guestbook-name-layer-gif-random-mask 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name.site-guestbook-admin-name-custom.has-effect-color.site-guestbook-admin-name-effect-color-random .site-guestbook-admin-name-layer-asset-random:not(.has-layer-effect-color):not(.site-guestbook-admin-name-layer-effect-off)::after {
    animation:
        site-guestbook-name-effect-color-random 3.4s steps(1, end) infinite,
        site-guestbook-name-layer-gif-random-mask 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name-layer-asset-random.site-guestbook-admin-name-layer-effect-shuffle::after {
    animation:
        site-guestbook-name-effect-color-shuffle 3s steps(1, end) infinite,
        site-guestbook-name-layer-gif-random-mask 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name-layer-asset-random.site-guestbook-admin-name-layer-effect-random::after {
    animation:
        site-guestbook-name-effect-color-random 3.4s steps(1, end) infinite,
        site-guestbook-name-layer-gif-random-mask 1.45s steps(1, end) infinite;
}

.site-guestbook-admin-name-layer-position-left { left: 0%; }
.site-guestbook-admin-name-layer-position-center { left: 50%; }
.site-guestbook-admin-name-layer-position-right { left: 100%; }
.site-guestbook-admin-name-layer-clip .site-guestbook-admin-name-layer-position-left { left: 0%; }
.site-guestbook-admin-name-layer-clip .site-guestbook-admin-name-layer-position-center { left: var(--admin-name-layer-origin-x); }
.site-guestbook-admin-name-layer-clip .site-guestbook-admin-name-layer-position-right { left: 100%; }

@keyframes site-guestbook-name-layer-position-random {
    0%, 49% { left: 0%; }
    50%, 100% { left: 100%; }
}

@keyframes site-guestbook-name-layer-depth-random {
    0%, 18%, 42%, 64%, 100% { z-index: 0; }
    19%, 35%, 65%, 82% { z-index: 4; }
}

@keyframes site-guestbook-name-layer-motion-vertical {
    0%, 100% {
        transform: translate(
            calc(-50% + var(--admin-name-layer-x-safe)),
            calc(-50% + var(--admin-name-layer-y-safe) - var(--admin-name-layer-motion-distance))
        ) rotate(var(--admin-name-layer-rotation, 0deg));
    }
    50% {
        transform: translate(
            calc(-50% + var(--admin-name-layer-x-safe)),
            calc(-50% + var(--admin-name-layer-y-safe) + var(--admin-name-layer-motion-distance))
        ) rotate(var(--admin-name-layer-rotation, 0deg));
    }
}

@keyframes site-guestbook-name-layer-motion-horizontal {
    0%, 100% {
        transform: translate(
            calc(-50% + var(--admin-name-layer-x-safe) - var(--admin-name-layer-motion-distance)),
            calc(-50% + var(--admin-name-layer-y-safe))
        ) rotate(var(--admin-name-layer-rotation, 0deg));
    }
    50% {
        transform: translate(
            calc(-50% + var(--admin-name-layer-x-safe) + var(--admin-name-layer-motion-distance)),
            calc(-50% + var(--admin-name-layer-y-safe))
        ) rotate(var(--admin-name-layer-rotation, 0deg));
    }
}

@keyframes site-guestbook-name-layer-motion-around {
    0%, 100% {
        transform: translate(
            calc(-50% + var(--admin-name-layer-x-safe)),
            calc(-50% + var(--admin-name-layer-y-safe) - var(--admin-name-layer-motion-distance))
        ) rotate(var(--admin-name-layer-rotation, 0deg));
    }
    25% {
        transform: translate(
            calc(-50% + var(--admin-name-layer-x-safe) + var(--admin-name-layer-motion-distance)),
            calc(-50% + var(--admin-name-layer-y-safe))
        ) rotate(var(--admin-name-layer-rotation, 0deg));
    }
    50% {
        transform: translate(
            calc(-50% + var(--admin-name-layer-x-safe)),
            calc(-50% + var(--admin-name-layer-y-safe) + var(--admin-name-layer-motion-distance))
        ) rotate(var(--admin-name-layer-rotation, 0deg));
    }
    75% {
        transform: translate(
            calc(-50% + var(--admin-name-layer-x-safe) - var(--admin-name-layer-motion-distance)),
            calc(-50% + var(--admin-name-layer-y-safe))
        ) rotate(var(--admin-name-layer-rotation, 0deg));
    }
}

.site-guestbook-admin-name-layer-position-random {
    --admin-name-layer-position-animation: site-guestbook-name-layer-position-random 2.3s steps(1, end) infinite;
}

.site-guestbook-admin-name-layer-depth-behind { z-index: 0; }
.site-guestbook-admin-name-layer-depth-front { z-index: 4; }
.site-guestbook-admin-name-layer-depth-random {
    --admin-name-layer-depth-animation: site-guestbook-name-layer-depth-random 2.1s steps(1, end) infinite;
}

.site-guestbook-admin-name-layer-motion-vertical { --admin-name-layer-motion-animation: site-guestbook-name-layer-motion-vertical 1.9s ease-in-out infinite; }
.site-guestbook-admin-name-layer-motion-horizontal { --admin-name-layer-motion-animation: none; }
.site-guestbook-admin-name-layer-motion-around { --admin-name-layer-motion-animation: site-guestbook-name-layer-motion-around 2.4s ease-in-out infinite; }

html[data-site-theme="win98"] .site-guestbook-admin-name.site-guestbook-admin-name-custom {
    color: var(--admin-name-color) !important;
    -webkit-text-fill-color: var(--admin-name-color) !important;
    background: transparent !important;
    border-color: color-mix(in srgb, var(--admin-name-color) 45%, transparent) !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

html[data-site-theme="win98"] .site-guestbook-admin-name.site-guestbook-admin-name-custom:not(.site-guestbook-admin-name-effect-none) {
    color: var(--admin-name-color) !important;
    -webkit-text-fill-color: var(--admin-name-color) !important;
    background: transparent !important;
    text-shadow: none !important;
}

html[data-site-theme="win98"] .site-guestbook-admin-name.site-guestbook-admin-name-custom.is-shaded {
    text-shadow:
        0 0 4px color-mix(in srgb, var(--admin-name-glow-color, var(--admin-name-color)) 80%, transparent),
        0 0 9px color-mix(in srgb, var(--admin-name-glow-color, var(--admin-name-color)) 62%, transparent) !important;
}

html[data-site-theme="win98"] .site-guestbook-admin-name.site-guestbook-admin-name-custom:is(.site-guestbook-admin-name-text-gradient, .site-guestbook-admin-name-text-rainbow, .site-guestbook-admin-name-text-stripes, .site-guestbook-admin-name-text-shuffle).is-shaded {
    text-shadow: none !important;
}

html[data-site-theme="win98"] .site-guestbook-actions button {
    padding: 3px 8px;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    background: #d8d8d8;
    border: 2px solid;
    border-color: #ffffff #6d6d6d #6d6d6d #ffffff;
    border-radius: 0;
    box-shadow: inset 1px 1px 0 #f8f8f8, inset -1px -1px 0 #9a9a9a;
    font: 11px/16px var(--site-guestbook-font);
    text-shadow: none;
    transform: none;
}

html[data-site-theme="win98"] .site-guestbook-actions button:disabled {
    color: #808080 !important;
    -webkit-text-fill-color: #808080 !important;
}

html[data-site-theme="win98"] .site-guestbook-actions button:active {
    border-color: #6d6d6d #ffffff #ffffff #6d6d6d;
    padding: 4px 7px 2px 9px;
    transform: none;
}

html[data-site-theme="win98"] .site-guestbook-entry-meta,
html[data-site-theme="win98"] .site-guestbook-entry-meta * {
    color: var(--win98-title-text, #ffffff);
    -webkit-text-fill-color: var(--win98-title-text, #ffffff);
}

html[data-site-theme="win98"] .site-guestbook-entry-meta {
    background: var(--win98-title-bg-local, var(--win98-title-bg, linear-gradient(90deg, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0))));
    border-bottom: 0;
}

html[data-site-theme="win98"] .site-guestbook-entry-message {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    background: #ffffff;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    border-radius: 0;
}

html[data-site-theme="win98"] .site-guestbook-admin-reply {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    background: #ffffff;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    border-radius: 0;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf;
}

html[data-site-theme="win98"] .site-guestbook-reaction {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    background: #d8d8d8;
    border: 2px solid;
    border-color: #ffffff #6d6d6d #6d6d6d #ffffff;
    border-radius: 0;
    box-shadow: inset 1px 1px 0 #f8f8f8, inset -1px -1px 0 #9a9a9a;
    font: 700 11px/1 var(--site-guestbook-font);
    text-shadow: none;
}

html[data-site-theme="win98"] .site-guestbook-reaction:active {
    border-color: #6d6d6d #ffffff #ffffff #6d6d6d;
}

@media (max-width: 1180px) {
    .site-retro-widgets {
        position: static;
        width: min(92vw, 640px);
        margin: 18px auto;
        padding: 0 12px;
        grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
        box-sizing: border-box;
    }
}

@media (max-width: 720px) {
    .site-guestbook-section {
        width: 100%;
        margin-top: 3.5rem;
    }

    .site-guestbook-section + .site-inspiration-section {
        margin-top: 2rem;
    }

    .site-guestbook-shell {
        padding: 10px;
    }

    .site-guestbook-viewport {
        height: auto;
        min-height: 0;
        gap: 12px;
        padding: 8px;
    }

    .site-guestbook-form {
        grid-template-columns: 1fr;
        padding: 12px;
    }

    .site-guestbook-actions,
    .site-guestbook-status {
        grid-column: 1;
    }
}

html[data-site-theme="win98"] .site-dock-menu-button {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 0;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    background: #c0c0c0 !important;
    color: #111;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    transition: none !important;
    cursor: var(--win98-cursor-pointer) !important;
}

html[data-site-theme="win98"] .site-dock-menu-button:hover,
html[data-site-theme="win98"] .site-dock-menu-button:focus-visible {
    transform: none !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
}

html[data-site-theme="win98"] .site-dock-menu-button[aria-expanded="true"] {
    border-color: #808080 #ffffff #ffffff #808080 !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
}

.site-dock-dropdown {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.site-dock-dropdown-trigger {
    width: 100%;
}

.site-dock-caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 0.15rem;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid currentColor;
    opacity: 0.75;
    flex-shrink: 0;
}

html[data-site-theme="neon"] .site-dock-caret {
    opacity: 0.55;
}

.site-dock-menu {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 9300;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 4px;
    min-width: 100%;
    box-sizing: border-box;
}

html[data-site-theme="neon"] .site-dock-menu {
    background: rgba(8, 10, 10, 0.97);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
}

html[data-site-theme="neon"] .site-dock-menu-item {
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.45rem 0.55rem;
    cursor: pointer;
    text-align: left;
}

html[data-site-theme="neon"] .site-dock-menu-item:hover,
html[data-site-theme="neon"] .site-dock-menu-item:focus-visible {
    background: rgba(255, 255, 255, 0.08);
    outline: none;
}

html[data-site-theme="neon"] .site-dock-menu-item.is-active {
    color: #00ff88;
}

html[data-site-theme="win98"] .site-dock-menu {
    background: #c0c0c0;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
}

html[data-site-theme="win98"] .site-dock-menu-item {
    border: none;
    border-radius: 0;
    background: #c0c0c0;
    color: #111;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    padding: 4px 8px;
    text-align: left;
    cursor: var(--win98-cursor-pointer) !important;
}

html[data-site-theme="win98"] .site-dock-menu-item:hover,
html[data-site-theme="win98"] .site-dock-menu-item:focus-visible {
    background: #c0c0c0;
    color: #111111;
    outline: none;
}

html[data-site-theme="win98"] .site-dock-menu-item.is-active {
    font-weight: 700;
}

html[data-site-theme="win98"] .site-dock-menu-sep {
    height: 0;
    margin: 2px 0;
    border-top: 1px solid #808080;
    border-bottom: 1px solid #ffffff;
}

.win98-desktop-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 100070;
    background: rgba(0, 0, 0, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
    overscroll-behavior: auto;
}

.win98-desktop-dialog-backdrop[hidden] {
    display: none !important;
}

html.win98-dialog-scroll-lock,
html.win98-dialog-scroll-lock body,
body.win98-dialog-scroll-lock {
    overflow: auto !important;
    overscroll-behavior: auto;
}

.win98-desktop-dialog {
    width: min(1210px, calc(100vw - 4px));
    max-width: calc(100vw - 4px);
    max-height: calc(100vh - 2px);
    height: min(680px, calc(100vh - 2px));
    min-width: min(760px, calc(100vw - 32px));
    min-height: min(620px, calc(100vh - 2px));
    overflow: hidden;
    resize: none;
    container-type: inline-size;
    overscroll-behavior: contain;
    display: flex;
    flex-direction: column;
    background: #c0c0c0;
    border: 2px solid;
    border-color: #ffffff #404040 #404040 #ffffff;
    box-shadow: 4px 4px 0 #00000044;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    color: #111;
}

.win98-desktop-dialog-resize-handle {
    position: absolute;
    z-index: 6;
    display: block;
    background: transparent;
}

.win98-desktop-dialog-resize-handle.is-n,
.win98-desktop-dialog-resize-handle.is-s {
    left: 10px;
    right: 10px;
    height: 8px;
}

.win98-desktop-dialog-resize-handle.is-n {
    top: -2px;
}

.win98-desktop-dialog-resize-handle.is-s {
    bottom: -2px;
}

.win98-desktop-dialog-resize-handle.is-e,
.win98-desktop-dialog-resize-handle.is-w {
    top: 10px;
    bottom: 10px;
    width: 8px;
}

.win98-desktop-dialog-resize-handle.is-e {
    right: -2px;
}

.win98-desktop-dialog-resize-handle.is-w {
    left: -2px;
}

.win98-desktop-dialog-resize-handle.is-ne,
.win98-desktop-dialog-resize-handle.is-nw,
.win98-desktop-dialog-resize-handle.is-se,
.win98-desktop-dialog-resize-handle.is-sw {
    width: 14px;
    height: 14px;
}

.win98-desktop-dialog-resize-handle.is-ne {
    top: -2px;
    right: -2px;
}

.win98-desktop-dialog-resize-handle.is-nw {
    top: -2px;
    left: -2px;
}

.win98-desktop-dialog-resize-handle.is-se {
    right: -2px;
    bottom: -2px;
}

.win98-desktop-dialog::after {
    content: "";
    position: absolute;
    right: 3px;
    bottom: 3px;
    width: 12px;
    height: 12px;
    z-index: 5;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' shape-rendering='crispEdges'%3E%3Cpath stroke='%23fff' d='M11 4 4 11M11 8 8 11'/%3E%3Cpath stroke='%23808080' d='M10 4 4 10M10 8 8 10'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    image-rendering: pixelated;
    pointer-events: none;
}

.win98-desktop-dialog-resize-handle.is-sw {
    left: -2px;
    bottom: -2px;
}

html[data-site-theme="win98"] .win98-desktop-dialog-titlebar,
.win98-desktop-dialog-titlebar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 3px 4px 3px 6px;
    background: linear-gradient(90deg, #808080, #c0c0c0);
    color: var(--win98-inactive-title-text, #ffffff);
    -webkit-text-fill-color: var(--win98-inactive-title-text, #ffffff);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    cursor: var(--win98-cursor-grab) !important;
    user-select: none;
}

html[data-site-theme="win98"] .win98-desktop-dialog-titlebar:hover,
html[data-site-theme="win98"] .win98-desktop-dialog-titlebar:active,
.win98-desktop-dialog-titlebar:hover,
.win98-desktop-dialog-titlebar:active {
    background: var(--win98-title-bg-local, var(--win98-title-bg, linear-gradient(90deg, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0))));
    color: var(--win98-title-text, #ffffff);
    -webkit-text-fill-color: var(--win98-title-text, #ffffff);
}

.win98-desktop-dialog-body {
    padding: 12px 14px 14px;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(260px, 1fr);
    gap: 14px;
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
}

.win98-desktop-dialog-col-left {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.win98-desktop-dialog-col-right {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.win98-desktop-dialog-body.is-tabbed {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    gap: 0;
    padding: 8px;
    min-height: 0;
    overflow: hidden;
}

.win98-dialog-tabs {
    display: flex;
    align-items: flex-end;
    gap: 1px;
    min-height: 24px;
    padding-left: 4px;
    flex: 0 0 auto;
}

.win98-dialog-tab {
    min-width: 0;
    height: 23px;
    padding: 3px 10px 2px;
    margin: 0;
    background: #c0c0c0;
    color: #111;
    border: 1px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    border-radius: 0;
    box-shadow: none;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 14px;
    cursor: var(--win98-cursor-pointer) !important;
    position: relative;
    top: 1px;
}

.win98-dialog-tab[aria-selected="true"] {
    height: 25px;
    padding-top: 4px;
    border-bottom-color: #c0c0c0;
    z-index: 2;
    top: 0;
}

.win98-dialog-tab:focus-visible {
    outline: 1px dotted #000;
    outline-offset: -4px;
}

.win98-theme-saved-list {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
}

html[data-site-theme="win98"] .win98-desktop-dialog-fieldset:has(#win98-theme-save-name) > .field-row {
    display: flex !important;
    width: 100%;
    box-sizing: border-box;
    margin-right: 0 !important;
}

.win98-main-preset-row {
    align-items: center;
    gap: 4px;
    margin-top: 5px;
    flex-wrap: nowrap;
}

.win98-main-preset-row > span {
    flex: 0 0 auto;
}

.win98-main-preset-row select {
    flex: 1 1 auto;
    min-width: 120px;
}

.win98-main-preset-row button {
    flex: 0 0 auto;
}

.win98-theme-defaults-status {
    min-height: 14px;
    margin-top: 4px;
    color: #111;
    font: 11px Tahoma, "MS Sans Serif", sans-serif;
}

.win98-theme-saved-item,
.win98-theme-saved-empty {
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
}

.win98-theme-saved-item {
    min-height: 22px;
    padding: 2px 8px;
    background: #c0c0c0;
    color: #111;
    border: 1px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
}

.win98-theme-saved-item.is-active {
    outline: 1px dotted #000;
    outline-offset: -4px;
}

.win98-dialog-workarea {
    display: grid;
    grid-template-columns: minmax(260px, 0.92fr) minmax(300px, 1fr);
    gap: 10px;
    min-height: 0;
    flex: 1 1 0;
    padding: 8px;
    background: #c0c0c0;
    border: 1px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    overflow: hidden;
}

.win98-dialog-preview-pane,
.win98-dialog-settings-pane {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.win98-dialog-preview-pane {
    display: flex;
    flex-direction: column;
}

.win98-dialog-settings-pane {
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow: visible;
}

.win98-dialog-pages {
    width: 100%;
    box-sizing: border-box;
    padding-right: 10px;
    min-height: 0;
    flex: 1 1 0;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.win98-dialog-page {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 0;
}

.win98-dialog-page[hidden] {
    display: none !important;
}

.win98-desktop-dialog-body.is-tabbed .win98-desktop-preview-desk {
    height: 100%;
    min-height: 360px;
}

.win98-desktop-dialog-body.is-tabbed .win98-desktop-dialog-actions {
    flex: 0 0 auto;
    margin-top: 0;
}

@media (max-width: 720px) {
    .win98-desktop-dialog-body {
        grid-template-columns: 1fr;
    }

    .win98-desktop-dialog-body.is-tabbed {
        overflow: auto;
    }

    .win98-dialog-tabs {
        overflow-x: auto;
        padding-bottom: 1px;
    }

    .win98-dialog-workarea {
        grid-template-columns: 1fr;
        overflow: visible;
    }

    .win98-dialog-settings-pane,
    .win98-dialog-pages {
        overflow: visible;
    }

    .win98-dialog-pages {
        width: 100%;
        padding-right: 0;
    }

    .win98-desktop-dialog-body.is-tabbed .win98-desktop-preview-desk {
        min-height: 220px;
    }
}

.win98-desktop-preview-desk {
    height: 280px;
    min-height: 240px;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    background-color: var(--win98-desktop, #008080);
    background-repeat: repeat;
    background-size: auto;
    background-position: 0 0;
    image-rendering: pixelated;
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.win98-desktop-preview-saver {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    display: none;
    z-index: 1;
    image-rendering: pixelated;
    /* Own GPU layer — dialog preview repaints stay isolated from rest of dialog. */
    transform: translateZ(0);
    contain: strict;
}

.win98-desktop-preview-saver-tint {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-color: transparent;
    opacity: 0;
    mix-blend-mode: multiply;
    display: none;
    z-index: 2;
}

.win98-desktop-preview-grad {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: none;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    mix-blend-mode: normal;
    display: none;
    z-index: 3;
}

.win98-desktop-preview-rainbow {
    position: absolute;
    inset: -900px;
    pointer-events: none;
    display: none;
    background-image: linear-gradient(var(--win98-rainbow-desktop-pastel-overlay), var(--win98-rainbow-desktop-pastel-overlay)), var(--win98-rainbow-desktop-scroll-strip);
    background-repeat: no-repeat, repeat;
    background-size: 100% 100%, var(--win98-rainbow-desktop-bg-size, 800px 100%);
    background-position: 0 0, 0 0;
    mix-blend-mode: var(--win98-rainbow-desktop-blend, normal);
    filter: none;
    animation: var(--win98-rainbow-desktop-anim-name, win98-rainbow-desktop-h) var(--win98-rainbow-desktop-duration, 32s) linear infinite;
    animation-play-state: var(--win98-rainbow-desktop-play-state, running);
    will-change: background-position;
    z-index: 4;
}

.win98-desktop-preview-desk.win98-preview-desk-rainbow .win98-desktop-preview-rainbow {
    display: block;
}

.win98-desktop-preview-tint {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-color: transparent;
    opacity: 0;
    mix-blend-mode: multiply;
    display: none;
    z-index: 5;
}

.win98-desktop-preview-page-tint {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-color: transparent;
    opacity: 0;
    mix-blend-mode: multiply;
    display: none;
    z-index: 8;
}

.win98-desktop-preview-window {
    z-index: 6;
}

html[data-win98-starbg="1"] .win98-desktop-preview-desk {
    background-image: url("../assets/win98/backgrounds/Stars.gif");
    background-repeat: repeat;
    background-size: auto;
    image-rendering: pixelated;
}

.win98-desktop-preview-window {
    position: absolute;
    left: 18px;
    top: 38px;
    width: 64%;
    background: var(--win98-panel-bg, #c0c0c0);
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
}

.win98-desktop-preview-window.is-inactive {
    position: absolute;
    left: 36px;
    top: 18px;
    width: 60%;
    background: var(--win98-panel-bg, #c0c0c0);
    opacity: 0.95;
}

.win98-desktop-preview-window-title {
    margin: -2px -2px 4px -2px;
    padding: 3px 6px;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    background: var(--win98-title-bg-local, var(--win98-title-bg, linear-gradient(90deg, var(--win98-title-start), var(--win98-title-end))));
}

.win98-desktop-preview-window-title.is-inactive {
    color: #ffffff;
    background: linear-gradient(90deg, #808080, #c0c0c0) !important;
}

.win98-desktop-preview-window-body {
    padding: 6px 8px 10px;
    font-size: 10px;
}

.win98-desktop-preview-window-text {
    margin-bottom: 5px;
}

.win98-desktop-preview-inner-panel {
    min-height: 18px;
    padding: 5px 6px;
    background: var(--win98-sub-bg, #ffffff);
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    box-shadow: inset 1px 1px 0 #000000;
    font-size: 10px;
}

.win98-desktop-preview-player {
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 14px;
    z-index: 6;
    padding: 6px 8px;
    min-height: 56px;
    background: var(--win98-player-bg, #c0c0c0);
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
    color: var(--win98-player-text, #111111);
    font-size: 10px;
    overflow: hidden;
}

.win98-desktop-preview-player-title {
    font-weight: 700;
    margin-bottom: 4px;
}

.win98-desktop-preview-player-main {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.win98-desktop-preview-player-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 18px;
    background: var(--win98-sub-bg, #ffffff);
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
    font-size: 9px;
    line-height: 1;
}

.win98-desktop-preview-player-track {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.win98-desktop-preview-player-muted {
    margin-top: 4px;
    color: var(--win98-player-text-muted, #444444);
    font-size: 9px;
}

.win98-desktop-dialog-fieldset {
    border: 1px groove #ffffff;
    padding: 8px 10px 10px;
    margin: 0;
    min-width: 0;
}

.win98-desktop-dialog-fieldset legend {
    padding: 0 4px;
    font-size: 11px;
}

.win98-rainbow-fx-note {
    margin: 0 0 8px;
    padding: 4px 6px;
    background: #ffffe1;
    color: #111;
    border: 1px solid #808080;
    box-shadow: inset 1px 1px 0 #ffffff, inset -1px -1px 0 #c0c0c0;
    font-size: 11px;
    line-height: 1.35;
}

#win98-rainbow-fx-fieldset .win98-rainbow-fx-slider-row {
    display: grid !important;
    grid-template-columns: 70px minmax(128px, 1fr) 54px 28px;
    align-items: center;
    gap: 6px 8px !important;
    width: 100%;
    box-sizing: border-box;
    margin-right: 0 !important;
}

#win98-rainbow-fx-fieldset .win98-rainbow-fx-slider-row > label {
    min-width: 0 !important;
    text-align: right;
}

#win98-rainbow-fx-fieldset .win98-rainbow-fx-slider-row > input[type="range"] {
    width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
}

#win98-rainbow-fx-fieldset .win98-rainbow-fx-slider-row > input[type="number"] {
    width: 54px !important;
    text-align: right !important;
}

#win98-rainbow-fx-fieldset .win98-rainbow-fx-slider-row > span {
    min-width: 24px;
    font-variant-numeric: tabular-nums;
}

.win98-error-dialog {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 100100;
    width: min(330px, calc(100vw - 36px));
    background: #c0c0c0;
    color: #111111;
    -webkit-text-fill-color: #111111;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf, 2px 2px 0 rgba(0,0,0,0.35);
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
}

.win98-error-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 100090;
    display: block;
    background: rgba(0, 0, 0, 0.42);
    pointer-events: auto;
}

.win98-error-dialog-backdrop[hidden] {
    display: none !important;
}

.win98-error-dialog[hidden] {
    display: none !important;
}

.win98-error-dialog-titlebar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 2px;
    padding: 2px 5px;
    background: linear-gradient(90deg, #000080, #1084d0);
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
    font-weight: 700;
    user-select: none;
    cursor: move;
}

/* Unified Win98 close button: classic bevel with the Windows close glyph. */
.win98-error-dialog-close,
html[data-site-theme="win98"] .win98-desktop-dialog-titlebar .win98-desktop-dialog-close {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 16px;
    min-width: 16px;
    height: 14px;
    padding: 0;
    margin: 0;
    border: 1px solid;
    border-color: #ffffff #404040 #404040 #ffffff;
    border-radius: 0;
    background: #c0c0c0;
    color: transparent;
    -webkit-text-fill-color: transparent;
    box-shadow: inset 1px 1px 0 #dfdfdf, inset -1px -1px 0 #808080;
    font-size: 0;
    line-height: 0;
    text-shadow: none;
    text-transform: none;
    box-sizing: border-box;
    overflow: hidden;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}

.win98-error-dialog-close::before,
html[data-site-theme="win98"] .win98-desktop-dialog-titlebar .win98-desktop-dialog-close::before {
    content: "r";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-family: Marlett, "MS Sans Serif", Tahoma, sans-serif;
    font-size: 10px;
    font-weight: 400;
    line-height: 1;
    color: #000000;
    -webkit-text-fill-color: #000000;
    text-shadow: none;
    pointer-events: none;
}

.win98-error-dialog-close:hover,
.win98-error-dialog-close:focus-visible,
html[data-site-theme="win98"] .win98-desktop-dialog-titlebar .win98-desktop-dialog-close:hover,
html[data-site-theme="win98"] .win98-desktop-dialog-titlebar .win98-desktop-dialog-close:focus-visible {
    background: #c0c0c0;
    outline: none;
}

.win98-error-dialog-close:active,
html[data-site-theme="win98"] .win98-desktop-dialog-titlebar .win98-desktop-dialog-close:active {
    border-color: #404040 #ffffff #ffffff #404040;
    box-shadow: inset 1px 1px 0 #808080;
    transform: none;
}

.win98-error-dialog-close:active::before,
html[data-site-theme="win98"] .win98-desktop-dialog-titlebar .win98-desktop-dialog-close:active::before {
    transform: translate(calc(-50% + 1px), calc(-50% + 1px));
}

.win98-error-dialog-body {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    padding: 14px 18px 10px;
    color: #111111;
    -webkit-text-fill-color: #111111;
}

.win98-error-dialog-icon {
    position: relative;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 0;
    background: url("/data/assets/win98/icons/error.png") center / contain no-repeat;
    box-shadow: none;
}

.win98-error-dialog-icon::before,
.win98-error-dialog-icon::after {
    content: none;
}

.win98-error-dialog-message {
    line-height: 1.35;
    color: #111111;
    -webkit-text-fill-color: #111111;
}

.win98-error-dialog-actions {
    display: flex;
    justify-content: center;
    padding: 0 14px 14px;
}

.win98-error-dialog-actions button {
    min-width: 74px;
    padding: 3px 14px;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    background: #c0c0c0;
    color: #111111;
    -webkit-text-fill-color: #111111;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
}

.win98-error-dialog-actions button:active {
    border-color: #808080 #ffffff #ffffff #808080;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf;
}

.win98-desktop-dialog-row {
    display: grid;
    grid-template-columns: 7rem 1fr;
    gap: 8px;
    align-items: start;
    margin-bottom: 6px;
    font-size: 11px;
}

.win98-desktop-dialog-row:last-child {
    margin-bottom: 0;
}

.win98-desktop-dialog-fieldset[data-win98-group="theme"] .win98-desktop-dialog-row {
    grid-template-columns: 5rem minmax(0, 1fr);
    gap: 8px;
    padding: 5px 4px 6px;
    margin-bottom: 3px;
    border-top: 1px solid #dfdfdf;
    border-bottom: 1px solid #9a9a9a;
}

.win98-desktop-dialog-fieldset[data-win98-group="theme"] {
    container-type: inline-size;
}

.win98-desktop-dialog-fieldset[data-win98-group="theme"] .win98-desktop-dialog-row > span:first-child {
    padding-top: 3px;
}

.win98-desktop-dialog-fieldset[data-win98-group="theme"] .win98-inline-controls {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    gap: 4px 6px;
    align-items: center;
}

.win98-desktop-dialog-fieldset[data-win98-group="theme"] .win98-color-controls {
    display: grid;
    grid-template-columns: minmax(116px, 0.58fr) minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    min-width: 0;
}

.win98-desktop-dialog-fieldset[data-win98-group="theme"] .win98-color-primary {
    min-width: 0;
}

.win98-desktop-dialog-fieldset[data-win98-group="theme"] .win98-inline-controls input[type="color"] {
    grid-column: 1 / -1;
}

.win98-desktop-dialog-fieldset[data-win98-group="theme"] .win98-inline-controls .win98-rainbow-chip {
    grid-column: 2;
}

.win98-color-effect-grid {
    display: grid;
    grid-template-columns: 42px minmax(58px, 1fr) 50px 22px;
    gap: 5px 4px;
    align-items: center;
    min-width: 0;
}

.win98-color-effect-grid.is-no-blur {
    grid-template-columns: 42px minmax(58px, 1fr) 50px 22px;
}

.win98-color-effect-grid label {
    text-align: right;
    white-space: nowrap;
}

.win98-color-effect-range {
    width: 100%;
    min-width: 0;
}

.win98-color-effect-number {
    width: 50px;
    box-sizing: border-box;
}

@container (max-width: 560px) {
    .win98-desktop-dialog-fieldset[data-win98-group="theme"] .win98-color-controls {
        grid-template-columns: minmax(0, 1fr);
    }
}

@container (max-width: 430px) {
    .win98-color-effect-grid {
        grid-template-columns: 42px minmax(70px, 1fr) 50px 22px;
    }
}

.win98-color-overrides {
    margin-top: 7px;
    padding: 6px 5px 4px;
    border-top: 1px solid #808080;
    border-left: 1px solid #808080;
    border-right: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
}

.win98-color-override-row {
    display: grid;
    grid-template-columns: 16px 112px minmax(110px, 1fr);
    gap: 5px 6px;
    align-items: center;
    margin: 0 0 5px;
}

.win98-color-override-row:last-child {
    margin-bottom: 0;
}

.win98-color-override-row label {
    white-space: nowrap;
}

.win98-color-override-values {
    display: grid;
    grid-template-columns: minmax(110px, 1fr) 46px 18px;
    gap: 5px 6px;
    align-items: center;
    min-width: 0;
}

.win98-desktop-dialog-fieldset[data-win98-group="smart"].is-collapsed > :not(legend):not(.field-row:has(#win98-smart-theme)),
.win98-desktop-dialog-fieldset[data-win98-group="theme"].is-collapsed > :not(legend):not(.field-row:has(#win98-colors-enable)),
.win98-desktop-dialog-fieldset[data-win98-group="wallpaper"].is-collapsed > :not(legend):not(.field-row:has(#win98-wallpaper-enable)) {
    display: none !important;
}

.win98-desktop-dialog-fieldset[data-win98-group="smart"].is-collapsed,
.win98-desktop-dialog-fieldset[data-win98-group="theme"].is-collapsed,
.win98-desktop-dialog-fieldset[data-win98-group="wallpaper"].is-collapsed {
    padding-bottom: 8px;
}

.win98-desktop-dialog-row input[type="color"] {
    width: 100%;
    height: 28px;
    padding: 0;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    background: #fff;
    cursor: var(--win98-cursor-pointer) !important;
}

/* Auto text mode: native color control stays visibly-opaque when disabled (avoid “empty” swatch / hex). */
#win98-text-color-input:disabled {
    opacity: 1 !important;
    filter: none !important;
    cursor: var(--win98-cursor-not-allowed) !important;
}

.win98-wallpaper-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 8px;
    max-height: 240px;
    overflow: auto;
    padding: 6px;
    background: #fff;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
}

.win98-wallpaper-item {
    position: relative;
    height: 70px;
    background-color: #008080;
    background-repeat: repeat;
    background-size: auto;
    background-position: 0 0;
    image-rendering: pixelated;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    cursor: var(--win98-cursor-pointer) !important;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.win98-wallpaper-item span {
    width: 100%;
    padding: 2px 4px;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 10px;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.win98-wallpaper-item.is-active {
    border-color: #000080 !important;
    outline: 2px dashed #000080;
}

.win98-wallpaper-item.is-none {
    background-color: #c0c0c0 !important;
    background-image: linear-gradient(45deg, #888 25%, transparent 25%),
                      linear-gradient(-45deg, #888 25%, transparent 25%),
                      linear-gradient(45deg, transparent 75%, #888 75%),
                      linear-gradient(-45deg, transparent 75%, #888 75%);
    background-size: 8px 8px;
    background-position: 0 0, 0 4px, 4px -4px, -4px 0;
}

.win98-wallpaper-upload-row {
    display: grid;
    grid-template-columns: 92px auto minmax(0, 1fr) auto auto;
    gap: 6px;
    align-items: center;
    margin: 6px 0;
    font-size: 11px;
}

.win98-wallpaper-upload-button,
#win98-wallpaper-upload-clear,
#win98-wallpaper-upload-delete {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 2px 10px;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    background: #c0c0c0;
    color: #000;
    font-family: "MS Sans Serif", Tahoma, sans-serif;
    font-size: 11px;
    line-height: 1;
    cursor: var(--win98-cursor-pointer) !important;
}

.win98-wallpaper-upload-button:active,
#win98-wallpaper-upload-clear:active,
#win98-wallpaper-upload-delete:active {
    border-color: #808080 #ffffff #ffffff #808080;
    padding: 3px 9px 1px 11px;
}

.win98-wallpaper-delete-check-wrap {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 14px;
    height: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #c0c0c0;
    border: 1px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    z-index: 2;
}

.win98-wallpaper-delete-check {
    width: 11px;
    height: 11px;
    margin: 0;
}

.win98-wallpaper-upload-name {
    min-width: 0;
    padding: 3px 4px;
    overflow: hidden;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    background: #ffffff;
    color: #000;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.win98-wallpaper-mode-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 8px;
    font-size: 11px;
}

.win98-wallpaper-mode-row label {
    cursor: var(--win98-cursor-pointer) !important;
}

/* Stack row: a single labeled control row with a left "head" (toggle/label)
   and a right "body" (color chips, blend dropdown, opacity slider, etc.).
   Used by the Wallpaper / Screensaver fieldsets so every row lines up cleanly. */
.win98-stack-row {
    display: grid;
    grid-template-columns: minmax(110px, 130px) 1fr;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    font-size: 11px;
}

.win98-stack-row[hidden],
.win98-wallpaper-mode-row[hidden] {
    display: none !important;
}

.win98-screensaver-fieldset.win98-screensaver-collapsed > :not(legend):not(.win98-section-enable-row) {
    display: none !important;
}

.win98-titlebar-editor {
    display: grid;
    gap: 7px;
    font-size: 11px;
}

.win98-titlebar-enable-row {
    margin: 0;
}

.win98-titlebar-section {
    padding-top: 6px;
    border-top: 1px solid #808080;
    box-shadow: inset 0 1px 0 #ffffff;
}

.win98-titlebar-section-title {
    margin-bottom: 5px;
    font-size: 10px;
    font-weight: 700;
}

.win98-titlebar-stripe-colors {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.win98-titlebar-color-cell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 46px;
    align-items: center;
    gap: 6px;
    color: inherit;
}

.win98-titlebar-color-cell span {
    white-space: nowrap;
}

.win98-titlebar-color-cell input[type="color"] {
    width: 46px;
    height: 24px;
    padding: 2px;
}

.win98-titlebar-control-row {
    display: grid;
    grid-template-columns: 56px minmax(112px, 1fr) 48px 66px minmax(126px, 0.9fr);
    align-items: center;
    gap: 6px 8px;
    margin-top: 6px;
}

.win98-titlebar-control-row:first-of-type {
    margin-top: 0;
}

.win98-titlebar-control-row > label {
    white-space: nowrap;
}

.win98-titlebar-control-row input[type="range"] {
    width: 100%;
    min-width: 0;
}

.win98-titlebar-control-row .win98-select-wrap,
.win98-titlebar-control-row .win98-desktop-select {
    width: 100%;
    min-width: 0;
}

.win98-titlebar-control-row > .win98-num-input {
    width: 46px;
    text-align: right;
}

.win98-titlebar-range-combo {
    display: grid;
    grid-template-columns: minmax(62px, 1fr) 48px max-content;
    align-items: center;
    gap: 5px;
    min-width: 0;
}

.win98-titlebar-range-combo .win98-num-input {
    width: 48px;
    text-align: right;
}

.win98-titlebar-shuffle-row {
    margin: 0 0 6px;
    gap: 6px;
}

.win98-title-shuffle-controls {
    margin-top: 6px;
    padding-left: 64px;
}

.win98-stack-row-head {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.win98-stack-row-head label {
    cursor: var(--win98-cursor-pointer) !important;
    white-space: nowrap;
}

.win98-stack-row-body {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    min-width: 0;
}

.win98-ss-option-divider {
    display: grid;
    grid-template-columns: minmax(110px, 130px) 1fr;
    align-items: center;
    gap: 8px;
    margin: 9px 0 2px;
    padding-top: 5px;
    border-top: 1px solid #808080;
    box-shadow: inset 0 1px 0 #ffffff;
    font-size: 11px;
}

.win98-ss-option-divider[hidden] {
    display: none !important;
}

.win98-ss-option-divider span {
    font-weight: 700;
}

.win98-ss-option-divider em {
    font-style: normal;
    color: #333333;
}

.win98-bg-rainbow-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    align-items: stretch;
    padding-top: 1px;
}

.win98-bg-rainbow-controls label {
    white-space: nowrap;
}

.win98-rainbow-stack-row {
    align-items: start;
}

.win98-rainbow-stack-row > .win98-stack-row-head {
    align-items: flex-start;
    padding-top: 3px;
}

.win98-rainbow-stack-row > .win98-stack-row-head input {
    margin-top: 1px;
}

.win98-bg-rainbow-topline {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: start;
    gap: 6px 12px;
    padding: 0 0 5px;
    border-bottom: 1px solid #9a9a9a;
    box-shadow: 0 1px 0 #dfdfdf;
}

.win98-bg-rainbow-preview-wrap {
    grid-row: 1 / span 2;
    grid-column: 1;
}

.win98-bg-rainbow-motion {
    grid-row: 1;
    grid-column: 2;
}

.win98-bg-rainbow-direction {
    grid-row: 2;
    grid-column: 2;
}

.win98-bg-rainbow-preview-wrap,
.win98-bg-rainbow-motion,
.win98-bg-rainbow-direction {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
}

.win98-bg-rainbow-topline .field-row {
    gap: 4px;
    margin-right: 0;
}

.win98-bg-rainbow-preview-wrap .win98-rainbow-chip {
    flex: 0 0 58px;
    width: 58px;
}

.win98-bg-rainbow-preview-wrap .win98-blend-select {
    max-width: 96px;
}

.win98-bg-rainbow-line {
    display: grid;
    grid-template-columns: 70px minmax(84px, 1fr) 54px 24px;
    align-items: center;
    gap: 4px 6px;
    min-width: 0;
}

.win98-bg-rainbow-line > label {
    text-align: right;
}

.win98-bg-rainbow-label {
    white-space: nowrap;
    color: #222;
}

.win98-bg-rainbow-controls .win98-blend-opacity {
    width: 100%;
    min-width: 76px;
    max-width: 150px;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-settings {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    max-width: 540px;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-row {
    grid-template-columns: minmax(128px, 148px) minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    margin-top: 6px;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-stack-row-head {
    min-height: 20px;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-stack-row-head > :is(label, span) {
    white-space: nowrap;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    margin-top: 8px;
    padding-top: 7px;
    border-top: 1px solid #808080;
    box-shadow: inset 0 1px 0 #ffffff;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-section > .win98-player-row:first-child {
    margin-top: 0;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-slider-control {
    display: grid;
    grid-template-columns: minmax(128px, 1fr) 54px 22px;
    align-items: center;
    gap: 6px;
    width: 100%;
    flex-wrap: nowrap;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-slider-control.is-no-unit {
    grid-template-columns: minmax(128px, 1fr) 54px;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-slider-control input[type="range"] {
    width: 100%;
    min-width: 0;
    flex: none;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-slider-control .win98-num-input {
    width: 54px;
    text-align: right;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-slider-control .win98-num-suffix {
    min-width: 18px;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-radio-row {
    gap: 14px;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-radio-row .field-row,
.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-inline-check {
    gap: 4px;
    margin-right: 0;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-rainbow-chip {
    flex: 0 0 72px;
    width: 72px;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-color-chips {
    display: grid;
    grid-template-columns: repeat(5, 36px);
    gap: 6px;
    justify-content: start;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-stripe-colors {
    display: grid;
    grid-template-columns: repeat(3, minmax(72px, 1fr));
    gap: 8px;
    align-items: end;
    width: 100%;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-stripe-colors input[type="color"] {
    width: 50px;
    height: 22px;
    padding: 0;
}

.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-select-wrap,
.win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-desktop-select {
    min-width: 116px;
}

@media (max-width: 720px) {
    .win98-bg-rainbow-line {
        grid-template-columns: 70px minmax(84px, 1fr) 54px 24px;
    }

    .win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-row {
        grid-template-columns: minmax(118px, 138px) minmax(0, 1fr);
    }

    .win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-slider-control {
        grid-template-columns: minmax(96px, 1fr) 54px 22px;
    }

    .win98-desktop-dialog-fieldset[data-win98-group="player"] .win98-player-stripe-colors {
        grid-template-columns: repeat(3, minmax(60px, 1fr));
    }
}

.win98-color-chip {
    width: 36px;
    height: 20px;
    padding: 0;
    flex: 0 0 auto;
}

.win98-ss-palette-controls {
    gap: 4px;
}

.win98-ss-palette-controls .win98-color-chip,
.win98-ss-bg-shuffle-controls .win98-color-chip {
    width: 36px;
}

.win98-ss-bg-shuffle-speed-controls {
    display: grid;
    grid-template-columns: minmax(128px, 1fr) 54px 22px;
    align-items: center;
    gap: 6px;
    width: 100%;
    flex-wrap: nowrap;
}

.win98-ss-bg-shuffle-speed-controls input[type="range"] {
    width: 100%;
    min-width: 0;
    flex: none;
}

.win98-ss-bg-shuffle-speed-controls .win98-num-input {
    width: 54px;
    text-align: right;
}

.win98-ss-bg-shuffle-speed-controls .win98-num-suffix {
    min-width: 18px;
}

.win98-ss-season-icon-picker {
    position: relative;
    align-items: flex-start;
    gap: 4px;
}

.win98-desktop-dialog-fieldset .win98-ss-season-icon-toggle {
    min-width: 132px;
    padding-right: 22px;
    text-align: left;
    position: relative;
}

.win98-desktop-dialog-fieldset .win98-ss-season-icon-toggle::after {
    content: "\25BE";
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 9px;
    line-height: 1;
}

.win98-ss-season-icon-menu {
    flex: 1 1 100%;
    max-height: 178px;
    overflow: auto;
    margin-top: 2px;
    padding: 4px;
    background: #ffffff;
    color: #000000;
    border: 1px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf;
}

.win98-ss-season-icon-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(122px, 1fr));
    gap: 2px 10px;
    align-items: start;
    margin-bottom: 7px;
}

.win98-ss-season-icon-group-title {
    grid-column: 1 / -1;
    margin: 0 0 2px;
    font-weight: 700;
}

.win98-ss-season-icon-option {
    display: grid;
    grid-template-columns: 15px minmax(0, 1fr);
    align-items: center;
    gap: 4px;
    margin: 0;
    white-space: nowrap;
}

.win98-blend-select {
    width: auto;
    flex: 0 0 auto;
    min-width: 84px;
}

.win98-blend-opacity {
    flex: 1 1 110px;
    min-width: 90px;
}

.win98-num-input {
    width: 54px;
    text-align: right;
    flex: 0 0 auto;
}

html[data-site-theme="win98"] .win98-desktop-dialog .win98-num-input:focus,
html[data-site-theme="win98"] .win98-desktop-dialog .win98-num-input:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog :is(input, select, textarea):focus,
html[data-site-theme="win98"] .win98-desktop-dialog :is(input, select, textarea):focus-visible {
    outline: none !important;
}

.win98-num-suffix {
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
    white-space: nowrap;
}

.win98-inline-controls {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    flex-wrap: wrap;
}

.win98-cursor-row {
    grid-template-columns: minmax(80px, 120px) minmax(0, 1fr);
}

.win98-cursor-control {
    width: 100%;
}

.win98-cursor-native-select,
.win98-cursor-scheme-native-select {
    display: none !important;
}

.win98-cursor-picker,
.win98-cursor-scheme-picker {
    position: relative;
    display: block;
    flex: 1 1 270px;
    min-width: 0;
}

html[data-site-theme="win98"] .win98-cursor-picker-button,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-button,
.win98-cursor-picker-button,
.win98-cursor-scheme-picker-button {
    width: 100%;
    min-height: 22px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 2px 22px 2px 5px;
    border: 1px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    border-radius: 0;
    background-color: #ffffff;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf;
    color: #000000;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    text-align: left;
    position: relative;
}

html[data-site-theme="win98"] .win98-cursor-picker-button:hover,
html[data-site-theme="win98"] .win98-cursor-picker-button:focus-visible,
html[data-site-theme="win98"] .win98-cursor-picker-button:active {
    background-color: #ffffff;
    color: #000000;
    border-color: #808080 #ffffff #ffffff #808080;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf;
    transform: none;
    outline: none;
}

html[data-site-theme="win98"] .win98-cursor-scheme-picker-button:hover,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-button:focus-visible,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-button:active {
    background-color: #ffffff;
    color: #000000;
    border-color: #808080 #ffffff #ffffff #808080;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf;
    transform: none;
    outline: none;
}

html[data-site-theme="win98"] .win98-cursor-picker-button::after,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-button::after,
.win98-cursor-picker-button::after,
.win98-cursor-scheme-picker-button::after {
    content: "";
    position: absolute;
    right: 1px;
    top: 1px;
    width: 18px;
    height: calc(100% - 2px);
    background: #c0c0c0;
    border: 1px solid;
    border-color: #ffffff #404040 #404040 #ffffff;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf;
    box-sizing: border-box;
}

html[data-site-theme="win98"] .win98-cursor-picker-button::before,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-button::before,
.win98-cursor-picker-button::before,
.win98-cursor-scheme-picker-button::before {
    content: "";
    position: absolute;
    right: 6px;
    top: 50%;
    width: 8px;
    height: 5px;
    background: #000000;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    transform: translateY(-50%);
    z-index: 1;
}

html[data-site-theme="win98"] .win98-cursor-picker-menu,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-menu,
.win98-cursor-picker-menu,
.win98-cursor-scheme-picker-menu {
    display: none;
    position: absolute;
    z-index: 30;
    left: 0;
    right: 0;
    top: calc(100% - 1px);
    max-height: 168px;
    overflow: auto;
    padding: 1px;
    border: 1px solid #808080;
    background: #ffffff;
    box-shadow: 2px 2px 0 #00000055;
}

html[data-site-theme="win98"] .win98-cursor-picker.is-open .win98-cursor-picker-menu,
html[data-site-theme="win98"] .win98-cursor-scheme-picker.is-open .win98-cursor-scheme-picker-menu,
.win98-cursor-picker.is-open .win98-cursor-picker-menu,
.win98-cursor-scheme-picker.is-open .win98-cursor-scheme-picker-menu {
    display: block;
}

html[data-site-theme="win98"] .win98-cursor-picker-menu,
.win98-cursor-picker-menu {
    max-height: none;
    overflow: hidden;
    padding: 4px;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    background: #c0c0c0;
}

html[data-site-theme="win98"] .win98-cursor-picker.is-open .win98-cursor-picker-menu,
.win98-cursor-picker.is-open .win98-cursor-picker-menu {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

html[data-site-theme="win98"] .win98-cursor-picker-search-wrap,
.win98-cursor-picker-search-wrap {
    display: block;
    padding: 0;
    background: transparent;
}

html[data-site-theme="win98"] .win98-cursor-picker-search,
.win98-cursor-picker-search {
    width: 100%;
    min-height: 23px;
    box-sizing: border-box;
    padding: 0.18rem 0.38rem;
    border: 1px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    border-radius: 0;
    background: #ffffff;
    box-shadow: none;
    color: #000000;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    line-height: 14px;
}

html[data-site-theme="win98"] .win98-cursor-picker-search:focus,
.win98-cursor-picker-search:focus {
    outline: none;
}

html[data-site-theme="win98"] .win98-cursor-picker-options,
.win98-cursor-picker-options {
    display: block;
    max-height: 142px;
    overflow: auto;
    background: #ffffff;
    border: 1px solid #808080;
}

html[data-site-theme="win98"] .win98-cursor-picker-empty,
.win98-cursor-picker-empty {
    display: block;
    padding: 6px;
    background: #ffffff;
    color: #000000;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    line-height: 16px;
}

html[data-site-theme="win98"] .win98-cursor-picker-option,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-option,
.win98-cursor-picker-option,
.win98-cursor-scheme-picker-option {
    width: 100%;
    min-height: 22px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 2px 5px;
    border: 0;
    background: #ffffff;
    color: #000000;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    line-height: 16px;
    text-align: left;
}

html[data-site-theme="win98"] .win98-cursor-picker-option:hover,
html[data-site-theme="win98"] .win98-cursor-picker-option:focus-visible,
html[data-site-theme="win98"] .win98-cursor-picker-option[aria-selected="true"],
html[data-site-theme="win98"] .win98-cursor-picker-option:active,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-option:hover,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-option:focus-visible,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-option[aria-selected="true"],
html[data-site-theme="win98"] .win98-cursor-scheme-picker-option:active,
.win98-cursor-picker-option:hover,
.win98-cursor-picker-option:focus-visible,
.win98-cursor-picker-option[aria-selected="true"],
.win98-cursor-picker-option:active,
.win98-cursor-scheme-picker-option:hover,
.win98-cursor-scheme-picker-option:focus-visible,
.win98-cursor-scheme-picker-option[aria-selected="true"],
.win98-cursor-scheme-picker-option:active {
    background-color: var(--win98-selection-bg, #000080) !important;
    background-image: var(--win98-selection-bg-image, none) !important;
    background-size: var(--win98-selection-bg-size, auto) !important;
    animation: var(--win98-selection-bg-animation, none) !important;
    color: var(--win98-selection-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-selection-text, #ffffff) !important;
    outline: none;
}

html[data-site-theme="win98"] .win98-cursor-thumb,
.win98-cursor-thumb {
    width: 30px;
    height: 24px;
    flex: 0 0 auto;
    border: 1px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    background-color: #c0c0c0;
    background-image:
        linear-gradient(45deg, #a0a0a0 25%, transparent 25%),
        linear-gradient(-45deg, #a0a0a0 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, #a0a0a0 75%),
        linear-gradient(-45deg, transparent 75%, #a0a0a0 75%);
    background-position:
        0 0,
        0 4px,
        4px -4px,
        -4px 0;
    background-repeat: repeat, repeat, repeat, repeat;
    background-size: 8px 8px, 8px 8px, 8px 8px, 8px 8px;
    box-shadow: inset 1px 1px 0 #404040;
    display: grid;
    place-items: center;
    overflow: hidden;
}

html[data-site-theme="win98"] .win98-cursor-thumb-image,
.win98-cursor-thumb-image {
    width: 24px;
    height: 24px;
    object-fit: contain;
    image-rendering: pixelated;
    display: block;
}

html[data-site-theme="win98"] .win98-cursor-picker-button,
html[data-site-theme="win98"] .win98-cursor-picker-button *,
html[data-site-theme="win98"] .win98-cursor-picker-option,
html[data-site-theme="win98"] .win98-cursor-picker-option *,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-button,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-button *,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-option,
html[data-site-theme="win98"] .win98-cursor-scheme-picker-option * {
    cursor: var(--win98-cursor-pointer) !important;
}

html[data-site-theme="win98"] .win98-cursor-picker-search,
html[data-site-theme="win98"] .win98-cursor-picker-search * {
    cursor: var(--win98-cursor-text) !important;
}

.win98-scale-label {
    font-size: 10px;
    color: #333;
    flex: 0 0 auto;
    text-transform: lowercase;
}

/*
 * Win98 “rainbow” chrome:
 * Only cycles through fixed full-saturation stops (red→orange→yellow→green→cyan→blue→violet→magenta→red).
 * Animation = translate by exactly one tile. Always set background-size to 800px × 100%;
 * never "auto" — otherwise the painted period ≠ 800px and the loop hiccups / shows a seam.
 */
html[data-site-theme="win98"] {
    /* Dialog chip / static preview — direction follows --win98-rainbow-direction */
    --win98-rainbow-static-strip: linear-gradient(var(--win98-rainbow-direction, 90deg),
        hsl(0, 100%, 52%) 0%,
        hsl(33, 100%, 52%) 12.5%,
        hsl(58, 100%, 52%) 25%,
        hsl(120, 100%, 50%) 37.5%,
        hsl(180, 100%, 50%) 50%,
        hsl(225, 100%, 52%) 62.5%,
        hsl(270, 100%, 54%) 75%,
        hsl(300, 100%, 52%) 87.5%,
        hsl(0, 100%, 52%) 100%);
    /* One cycle = 800px wide; keyframes scroll by --win98-rainbow-bg-size in the matching axis */
    --win98-rainbow-scroll-strip: repeating-linear-gradient(
        var(--win98-rainbow-direction, 90deg),
        hsl(0, 100%, 52%) 0px,
        hsl(33, 100%, 52%) 100px,
        hsl(58, 100%, 52%) 200px,
        hsl(120, 100%, 50%) 300px,
        hsl(180, 100%, 50%) 400px,
        hsl(225, 100%, 52%) 500px,
        hsl(270, 100%, 54%) 600px,
        hsl(300, 100%, 52%) 700px,
        hsl(0, 100%, 52%) 800px
    );
    /* Animation controls — JS sets these via setProperty */
    --win98-rainbow-direction: 90deg;
    --win98-rainbow-bg-size: 800px 100%;
    --win98-rainbow-anim-name: win98-rainbow-h;
    --win98-rainbow-play-state: running;
    --win98-rainbow-opacity: 1;
    --win98-rainbow-blur: 0px;
    --win98-rainbow-filter-core: brightness(1) saturate(1) hue-rotate(0deg);
    --win98-rainbow-effect-filter: var(--win98-rainbow-filter-core);
    --win98-rainbow-pastel-overlay: transparent;
    --win98-rainbow-duration: 32s;
    --win98-rainbow-desktop-scroll-strip: var(--win98-rainbow-scroll-strip);
    --win98-rainbow-desktop-bg-size: var(--win98-rainbow-bg-size);
    --win98-rainbow-desktop-anim-name: win98-rainbow-desktop-h;
    --win98-rainbow-desktop-play-state: var(--win98-rainbow-play-state);
    --win98-rainbow-desktop-pastel-overlay: var(--win98-rainbow-pastel-overlay);
    --win98-rainbow-desktop-duration: 32s;
    --win98-rainbow-desktop-blend: normal;
    --win98-rainbow-desktop-blur: 0px;
    --win98-rainbow-desktop-shift-x: -800px;
    --win98-rainbow-desktop-shift-y: 0px;
    --win98-rainbow-panel-scroll-strip: var(--win98-rainbow-scroll-strip);
    --win98-rainbow-panel-bg-size: var(--win98-rainbow-bg-size);
    --win98-rainbow-panel-anim-name: var(--win98-rainbow-anim-name);
    --win98-rainbow-panel-play-state: var(--win98-rainbow-play-state);
    --win98-rainbow-panel-pastel-overlay: var(--win98-rainbow-pastel-overlay);
    --win98-rainbow-panel-duration: 20s;
    --win98-rainbow-sub-scroll-strip: var(--win98-rainbow-scroll-strip);
    --win98-rainbow-sub-bg-size: var(--win98-rainbow-bg-size);
    --win98-rainbow-sub-anim-name: var(--win98-rainbow-anim-name);
    --win98-rainbow-sub-play-state: var(--win98-rainbow-play-state);
    --win98-rainbow-sub-pastel-overlay: var(--win98-rainbow-pastel-overlay);
    --win98-rainbow-sub-duration: 22s;
    --win98-rainbow-title-scroll-strip: var(--win98-rainbow-scroll-strip);
    --win98-rainbow-title-bg-size: var(--win98-rainbow-bg-size);
    --win98-rainbow-title-anim-name: var(--win98-rainbow-anim-name);
    --win98-rainbow-title-play-state: var(--win98-rainbow-play-state);
    --win98-rainbow-title-pastel-overlay: var(--win98-rainbow-pastel-overlay);
    --win98-rainbow-title-duration: 28s;
    --win98-rainbow-text-scroll-strip: var(--win98-rainbow-scroll-strip);
    --win98-rainbow-text-bg-size: var(--win98-rainbow-bg-size);
    --win98-rainbow-text-anim-name: var(--win98-rainbow-anim-name);
    --win98-rainbow-text-play-state: var(--win98-rainbow-play-state);
    --win98-rainbow-text-pastel-overlay: var(--win98-rainbow-pastel-overlay);
    --win98-rainbow-text-duration: 24s;
    --win98-rainbow-player-scroll-strip: var(--win98-rainbow-scroll-strip);
    --win98-rainbow-player-bg-size: var(--win98-rainbow-bg-size);
    --win98-rainbow-player-anim-name: var(--win98-rainbow-anim-name);
    --win98-rainbow-player-play-state: var(--win98-rainbow-play-state);
    --win98-rainbow-player-pastel-overlay: var(--win98-rainbow-pastel-overlay);
    --win98-rainbow-player-duration: 20s;
    --win98-rainbow-selection-scroll-strip: var(--win98-rainbow-title-scroll-strip);
    --win98-rainbow-selection-bg-size: var(--win98-rainbow-title-bg-size);
    --win98-rainbow-selection-anim-name: win98-selection-rainbow-h;
    --win98-rainbow-selection-play-state: var(--win98-rainbow-title-play-state);
    --win98-rainbow-selection-duration: var(--win98-rainbow-title-duration);
    --win98-rainbow-selection-shift-x: var(--win98-rainbow-title-shift-x, -224px);
    --win98-rainbow-selection-shift-y: var(--win98-rainbow-title-shift-y, 0px);
    /* JS sets this to rgba(r,g,b,0.35) when accent is available; keeps transparent otherwise */
    --win98-rainbow-tint: transparent;
}

@keyframes win98-rainbow-h {
    from { background-position: 0 0; }
    to { background-position: var(--win98-rainbow-shift-x, -800px) 0; }
}

@keyframes win98-rainbow-v {
    from { background-position: 0 0; }
    to { background-position: 0 var(--win98-rainbow-shift-y, -800px); }
}

@keyframes win98-rainbow-d {
    from { background-position: 0 0; }
    to { background-position: var(--win98-rainbow-shift-x, -1131px) var(--win98-rainbow-shift-y, -1131px); }
}

@keyframes win98-rainbow-title-icon-h {
    from { background-position: 7px center, 0 0, 0 0, 0 0; }
    to { background-position: 7px center, 0 0, 0 0, var(--win98-rainbow-title-shift-x, -224px) 0; }
}

@keyframes win98-rainbow-title-icon-v {
    from { background-position: 7px center, 0 0, 0 0, 0 0; }
    to { background-position: 7px center, 0 0, 0 0, 0 var(--win98-rainbow-title-shift-y, -224px); }
}

@keyframes win98-rainbow-title-icon-d {
    from { background-position: 7px center, 0 0, 0 0, 0 0; }
    to { background-position: 7px center, 0 0, 0 0, var(--win98-rainbow-title-shift-x, -317px) var(--win98-rainbow-title-shift-y, -317px); }
}

@keyframes win98-rainbow-desktop-h {
    from { background-position: 0 0, 0 0; }
    to { background-position: 0 0, var(--win98-rainbow-desktop-shift-x, -800px) 0; }
}

@keyframes win98-rainbow-desktop-v {
    from { background-position: 0 0, 0 0; }
    to { background-position: 0 0, 0 var(--win98-rainbow-desktop-shift-y, -800px); }
}

@keyframes win98-rainbow-desktop-d {
    from { background-position: 0 0, 0 0; }
    to { background-position: 0 0, var(--win98-rainbow-desktop-shift-x, -1131px) var(--win98-rainbow-desktop-shift-y, -1131px); }
}

@keyframes win98-selection-rainbow-h {
    from { background-position: 0 0; }
    to { background-position: var(--win98-rainbow-selection-shift-x, -224px) 0; }
}

@keyframes win98-selection-rainbow-v {
    from { background-position: 0 0; }
    to { background-position: 0 var(--win98-rainbow-selection-shift-y, -224px); }
}

@keyframes win98-selection-rainbow-d {
    from { background-position: 0 0; }
    to { background-position: var(--win98-rainbow-selection-shift-x, -317px) var(--win98-rainbow-selection-shift-y, -317px); }
}

@keyframes win98-rainbow-text-scroll {
    from { background-position: 0 50%; }
    to { background-position: 800px 50%; }
}

html[data-site-theme="win98"][data-win98-panel-rainbow="1"] .title-container,
html[data-site-theme="win98"][data-win98-panel-rainbow="1"] .glass::before,
html[data-site-theme="win98"][data-win98-panel-rainbow="1"] .smp-hero-glass::before,
.win98-desktop-preview-window.win98-preview-rainbow-panel::before {
    --win98-rainbow-shift-x: var(--win98-rainbow-panel-shift-x, -224px);
    --win98-rainbow-shift-y: var(--win98-rainbow-panel-shift-y, 0px);
}

html[data-site-theme="win98"][data-win98-sub-rainbow="1"] .now-playing-card::before,
html[data-site-theme="win98"][data-win98-sub-rainbow="1"] .inner-entry::before,
html[data-site-theme="win98"][data-win98-sub-rainbow="1"] .carousel-viewport::before,
.win98-desktop-preview-window-body.win98-preview-rainbow-sub::before,
.win98-desktop-preview-inner-panel.win98-preview-rainbow-sub::before {
    --win98-rainbow-shift-x: var(--win98-rainbow-sub-shift-x, -224px);
    --win98-rainbow-shift-y: var(--win98-rainbow-sub-shift-y, 0px);
}

html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass > .win98-titlebar::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass > .box-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .smp-hero-glass > .box-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .title-container::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .site-widget-title::before,
html[data-win98-title-rainbow="1"] .win98-desktop-dialog-titlebar::before,
.win98-desktop-preview-window-title.win98-preview-title-rainbow:not(.is-inactive)::before {
    --win98-rainbow-shift-x: var(--win98-rainbow-title-shift-x, -224px);
    --win98-rainbow-shift-y: var(--win98-rainbow-title-shift-y, 0px);
}

html[data-site-theme="win98"][data-win98-player-rainbow="1"] .player-shell::before,
html[data-site-theme="win98"][data-win98-player-rainbow="1"] .global-player-inner::before,
html[data-site-theme="win98"][data-win98-player-rainbow="1"] .global-player-shell::before,
.win98-desktop-preview-player.win98-preview-rainbow-player::before {
    --win98-rainbow-shift-x: var(--win98-rainbow-player-shift-x, -224px);
    --win98-rainbow-shift-y: var(--win98-rainbow-player-shift-y, 0px);
}

/* Static sample next to checkboxes — not animated in-dialog */
.win98-rainbow-chip {
    width: 72px;
    height: 12px;
    border: 1px solid #808080;
    border-color: #808080 #ffffff #ffffff #808080;
    background: var(--win98-rainbow-static-strip);
    filter: var(--win98-rainbow-filter-core, none);
    display: inline-block;
}

.win98-rainbow-control-group[data-rainbow-active="false"] .win98-rainbow-chip,
.field-row:has(:is(input, button, select, textarea):disabled) .win98-rainbow-chip,
.win98-desktop-dialog-row[data-controls-disabled="true"] .win98-rainbow-chip,
.win98-stack-row:has(.win98-stack-row-head :is(input, button, select, textarea):disabled) .win98-rainbow-chip,
.win98-stack-row[data-controls-disabled="true"] .win98-rainbow-chip,
.win98-desktop-dialog-fieldset[data-win98-category-disabled] .win98-rainbow-chip {
    opacity: 0.35;
    filter: grayscale(1);
}

/* ─── Desktop (backdrop only; filter would distort ::before/::after wallpaper overlays) ─── */
html[data-site-theme="win98"][data-win98-desktop-rainbow="1"] {
    background-color: transparent !important;
}

/* Desktop: scroll spectrum tile; global Rainbow FX filter can shift the final color. */
html[data-site-theme="win98"][data-win98-desktop-rainbow="1"] #theme-backdrop {
    background-color: var(--win98-desktop) !important;
    filter: none;
}

/* Panel fill on homepage title strip + body: scroll strip on the container (title ::before keeps its own bg) */
html[data-site-theme="win98"][data-win98-panel-rainbow="1"] .title-container {
    background-image: linear-gradient(var(--win98-rainbow-panel-pastel-overlay), var(--win98-rainbow-panel-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-panel-scroll-strip) !important;
    background-color: transparent !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-panel-bg-size, 800px 100%) !important;
    filter: var(--win98-rainbow-filter-core, none);
    animation: var(--win98-rainbow-panel-anim-name, win98-rainbow-h) var(--win98-rainbow-panel-duration, 20s) linear infinite;
    animation-play-state: var(--win98-rainbow-panel-play-state, running);}

/* Box shells: animated spectrum under content (re-enable .glass::before; win98 normally hides it) */
html[data-site-theme="win98"][data-win98-panel-rainbow="1"] .glass,
html[data-site-theme="win98"][data-win98-panel-rainbow="1"] .smp-hero-glass {
    background: transparent !important;
    isolation: isolate !important;
}

html[data-site-theme="win98"][data-win98-panel-rainbow="1"] .glass::before,
html[data-site-theme="win98"][data-win98-panel-rainbow="1"] .smp-hero-glass::before {
    display: block !important;
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    pointer-events: none !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    border-left: none !important;
    background-color: transparent !important;
    background-image: linear-gradient(var(--win98-rainbow-panel-pastel-overlay), var(--win98-rainbow-panel-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-panel-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-panel-bg-size, 800px 100%) !important;
    animation: var(--win98-rainbow-panel-anim-name, win98-rainbow-h) var(--win98-rainbow-panel-duration, 20s) linear infinite;
    animation-play-state: var(--win98-rainbow-panel-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: var(--win98-rainbow-opacity, 1);}

/* Inner / sub surfaces */
html[data-site-theme="win98"][data-win98-sub-rainbow="1"] .now-playing-card,
html[data-site-theme="win98"][data-win98-sub-rainbow="1"] .inner-entry,
html[data-site-theme="win98"][data-win98-sub-rainbow="1"] .carousel-viewport {
    position: relative !important;
    isolation: isolate !important;
    background: transparent !important;
}

html[data-site-theme="win98"][data-win98-sub-rainbow="1"] .now-playing-card::before,
html[data-site-theme="win98"][data-win98-sub-rainbow="1"] .inner-entry::before,
html[data-site-theme="win98"][data-win98-sub-rainbow="1"] .carousel-viewport::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background-color: transparent !important;
    background-image: linear-gradient(var(--win98-rainbow-sub-pastel-overlay), var(--win98-rainbow-sub-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-sub-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-sub-bg-size, 800px 100%) !important;
    animation: var(--win98-rainbow-sub-anim-name, win98-rainbow-h) var(--win98-rainbow-sub-duration, 22s) linear infinite;
    animation-play-state: var(--win98-rainbow-sub-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: var(--win98-rainbow-opacity, 1);}

/* Player-only rainbow: separate from the Panel checkbox. */
html[data-site-theme="win98"][data-win98-player-rainbow="1"] .player-shell,
html[data-site-theme="win98"][data-win98-player-rainbow="1"] .global-player-inner,
html[data-site-theme="win98"][data-win98-player-rainbow="1"] .global-player-shell {
    position: relative !important;
    background: transparent !important;
    isolation: isolate !important;
}

html[data-site-theme="win98"][data-win98-player-rainbow="1"] .player-shell::before,
html[data-site-theme="win98"][data-win98-player-rainbow="1"] .global-player-inner::before,
html[data-site-theme="win98"][data-win98-player-rainbow="1"] .global-player-shell::before {
    display: block !important;
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    pointer-events: none !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    background-image: linear-gradient(var(--win98-rainbow-player-pastel-overlay), var(--win98-rainbow-player-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-player-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-player-bg-size, 800px 100%) !important;
    animation: var(--win98-rainbow-player-anim-name, win98-rainbow-h) var(--win98-rainbow-player-duration, 20s) linear infinite;
    animation-play-state: var(--win98-rainbow-player-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: var(--win98-rainbow-opacity, 1);
}

/* Title bars: spectrum behind labels (no filter on text) */
html[data-win98-title-rainbow="1"] .win98-desktop-dialog-titlebar {
    position: relative !important;
    isolation: isolate !important;
    background: transparent !important;
}

html[data-win98-title-rainbow="1"] .win98-desktop-dialog-titlebar::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background-color: transparent !important;
    background-image: linear-gradient(var(--win98-rainbow-title-pastel-overlay), var(--win98-rainbow-title-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-title-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-title-bg-size, 800px 100%) !important;
    animation: var(--win98-rainbow-title-anim-name, win98-rainbow-h) var(--win98-rainbow-title-duration, 28s) linear infinite;
    animation-play-state: var(--win98-rainbow-title-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: 0.42;
    transition: opacity 0.18s ease;}

html[data-win98-title-rainbow="1"] .win98-desktop-dialog-titlebar:hover::before,
html[data-win98-title-rainbow="1"] .win98-desktop-dialog-titlebar:active::before {
    opacity: var(--win98-rainbow-opacity, 1) !important;
}

html[data-win98-title-rainbow="1"] .win98-desktop-dialog-titlebar > * {
    position: relative !important;
    z-index: 1 !important;
}

html[data-site-theme="win98"][data-win98-title-rainbow="1"] .title-container::before {
    background-image: url("../assets/avatar.png"), linear-gradient(var(--win98-rainbow-title-pastel-overlay), var(--win98-rainbow-title-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-title-scroll-strip) !important;
    background-size: 16px 16px, auto, auto, var(--win98-rainbow-title-bg-size, 800px 100%) !important;
    background-position: 7px center, 0 0, 0 0, 0 0;
    background-repeat: no-repeat, no-repeat, no-repeat, repeat !important;
    color: var(--win98-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-title-text, #ffffff) !important;
    animation: var(--win98-rainbow-title-anim-name, win98-rainbow-h) var(--win98-rainbow-title-duration, 28s) linear infinite;
    animation-play-state: var(--win98-rainbow-title-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: var(--win98-rainbow-opacity, 1);
}

/* Keep position:absolute from base Win98 rules — only swap paint to ::before layer */
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass > .win98-titlebar,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass > .box-title,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .smp-hero-glass > .box-title,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .site-widget-title,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:hover > .win98-titlebar,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:focus-within > .win98-titlebar,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:hover > .box-title,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:focus-within > .box-title,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .smp-hero-glass:hover > .box-title,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .smp-hero-glass:focus-within > .box-title {
    background: transparent !important;
    isolation: isolate !important;
}

html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass > .win98-titlebar::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass > .box-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .smp-hero-glass > .box-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .site-widget-title::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background-color: transparent !important;
    background-image: linear-gradient(var(--win98-rainbow-title-pastel-overlay), var(--win98-rainbow-title-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-title-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-title-bg-size, 800px 100%) !important;
    animation: var(--win98-rainbow-title-anim-name, win98-rainbow-h) var(--win98-rainbow-title-duration, 28s) linear infinite;
    animation-play-state: var(--win98-rainbow-title-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: var(--win98-rainbow-opacity, 1);}

html[data-site-theme="win98"][data-win98-title-rainbow="1"] .site-widget-title::before {
    z-index: 0 !important;
}

/* Personalization mini-preview (classes toggled from JS; avoids fighting inline styles) */
.win98-desktop-preview-desk.win98-preview-desk-rainbow {
    filter: none;
}

.win98-desktop-preview-window.win98-preview-rainbow-panel {
    position: relative !important;
    isolation: isolate !important;
    background: transparent !important;
}

.win98-desktop-preview-window.win98-preview-rainbow-panel::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background-color: transparent !important;
    background-image: linear-gradient(var(--win98-rainbow-panel-pastel-overlay), var(--win98-rainbow-panel-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-panel-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-panel-bg-size, 800px 100%) !important;
    animation: var(--win98-rainbow-panel-anim-name, win98-rainbow-h) var(--win98-rainbow-panel-duration, 20s) linear infinite;
    animation-play-state: var(--win98-rainbow-panel-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: var(--win98-rainbow-opacity, 1);}

.win98-desktop-preview-window.win98-preview-rainbow-panel > * {
    position: relative !important;
    z-index: 1 !important;
}

.win98-desktop-preview-window-title.win98-preview-title-rainbow:not(.is-inactive) {
    position: relative !important;
    isolation: isolate !important;
    background: transparent !important;
    overflow: hidden !important;
}

.win98-desktop-preview-window-title.win98-preview-title-rainbow:not(.is-inactive)::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background-color: transparent !important;
    background-image: linear-gradient(var(--win98-rainbow-title-pastel-overlay), var(--win98-rainbow-title-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-title-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-title-bg-size, 800px 100%) !important;
    animation: var(--win98-rainbow-title-anim-name, win98-rainbow-h) var(--win98-rainbow-title-duration, 28s) linear infinite;
    animation-play-state: var(--win98-rainbow-title-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: var(--win98-rainbow-opacity, 1);}

.win98-desktop-preview-window-body.win98-preview-rainbow-sub,
.win98-desktop-preview-inner-panel.win98-preview-rainbow-sub {
    position: relative !important;
    isolation: isolate !important;
    background: transparent !important;
}

.win98-desktop-preview-window-body.win98-preview-rainbow-sub::before,
.win98-desktop-preview-inner-panel.win98-preview-rainbow-sub::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background-color: transparent !important;
    background-image: linear-gradient(var(--win98-rainbow-sub-pastel-overlay), var(--win98-rainbow-sub-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-sub-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-sub-bg-size, 800px 100%) !important;
    animation: var(--win98-rainbow-sub-anim-name, win98-rainbow-h) var(--win98-rainbow-sub-duration, 22s) linear infinite;
    animation-play-state: var(--win98-rainbow-sub-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: var(--win98-rainbow-opacity, 1);}

.win98-desktop-preview-player.win98-preview-rainbow-player {
    isolation: isolate !important;
    background: transparent !important;
}

.win98-desktop-preview-player.win98-preview-rainbow-player::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background-color: transparent !important;
    background-image: linear-gradient(var(--win98-rainbow-player-pastel-overlay), var(--win98-rainbow-player-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-player-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-player-bg-size, 800px 100%) !important;
    animation: var(--win98-rainbow-player-anim-name, win98-rainbow-h) var(--win98-rainbow-player-duration, 10s) linear infinite;
    animation-play-state: var(--win98-rainbow-player-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: var(--win98-rainbow-opacity, 1);}

.win98-desktop-preview-player.win98-preview-rainbow-player > * {
    position: relative !important;
    z-index: 1 !important;
}

html[data-site-theme="win98"] body .smp-hero-glass > .smp-hero-bar.box-title,
html[data-site-theme="win98"] body .smp-hero-glass > .smp-hero-bar.box-title * {
    color: var(--win98-inactive-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-inactive-title-text, #ffffff) !important;
}

html[data-site-theme="win98"] body .smp-hero-glass:hover > .smp-hero-bar.box-title,
html[data-site-theme="win98"] body .smp-hero-glass:focus-within > .smp-hero-bar.box-title,
html[data-site-theme="win98"] body .smp-hero-glass:hover > .smp-hero-bar.box-title *,
html[data-site-theme="win98"] body .smp-hero-glass:focus-within > .smp-hero-bar.box-title * {
    color: var(--win98-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-title-text, #ffffff) !important;
}

html[data-site-theme="win98"][data-win98-text-rainbow="1"] body .title-container :is(h1,h2,h3,h4,h5,h6,p,span,a,li,strong,em,code):not(.box-title):not(.win98-titlebar),
html[data-site-theme="win98"][data-win98-text-rainbow="1"] body .glass :is(h1,h2,h3,h4,h5,h6,p,span,a,li,strong,em,code):not(.box-title):not(.win98-titlebar),
html[data-site-theme="win98"][data-win98-text-rainbow="1"] body .smp-hero-glass :is(h1,h2,h3,h4,h5,h6,p,span,a,li,strong,em,code):not(.box-title):not(.win98-titlebar),
html[data-site-theme="win98"][data-win98-text-rainbow="1"] body .player-shell :is(h1,h2,h3,h4,h5,h6,p,span,a,li,strong,em,code):not(.box-title):not(.win98-titlebar),
html[data-site-theme="win98"][data-win98-text-rainbow="1"] body .global-player-inner :is(h1,h2,h3,h4,h5,h6,p,span,a,li,strong,em,code):not(.box-title):not(.win98-titlebar),
.win98-desktop-preview-desk[data-win98-text-rainbow="1"] .win98-desktop-preview-window-body,
.win98-desktop-preview-desk[data-win98-text-rainbow="1"] .win98-desktop-preview-player :is(.win98-desktop-preview-player-title,.win98-desktop-preview-player-track,.win98-desktop-preview-player-btn,.win98-desktop-preview-player-muted) {
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    background-image: var(--win98-rainbow-text-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-text-bg-size, 800px 100%) !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    filter: var(--win98-rainbow-filter-core, none);
    animation: var(--win98-rainbow-text-anim-name, win98-rainbow-h) var(--win98-rainbow-text-duration, 24s) linear infinite;
    animation-play-state: var(--win98-rainbow-text-play-state, running);
}

/* Grey out only inactive stack-row controls; the left toggle stays usable. */
.win98-stack-row[data-controls-disabled="true"] .win98-stack-row-body {
    opacity: 0.4;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

.win98-stack-row-body[data-controls-disabled="true"] {
    opacity: 0.4;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

.win98-stack-row[data-controls-disabled="true"] .win98-stack-row-head,
.win98-stack-row[data-controls-disabled="true"] .win98-stack-row-head *,
.win98-desktop-dialog-row[data-controls-disabled="true"] > span:first-child,
.win98-desktop-dialog-row[data-controls-disabled="true"] label,
.field-row[data-controls-disabled="true"] > label,
.field-row[data-controls-disabled="true"] > span {
    opacity: 0.45;
}

.win98-stack-row[data-controls-disabled="true"] .win98-stack-row-body *,
.win98-stack-row-body[data-controls-disabled="true"] * {
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

.win98-stack-row-body:has(:is(input, button, select, textarea):disabled),
.win98-stack-row-body:has(:is(input, button, select, textarea):disabled) *,
.win98-stack-row:has(.win98-stack-row-head :is(input, button, select, textarea):disabled) .win98-stack-row-body,
.win98-stack-row:has(.win98-stack-row-head :is(input, button, select, textarea):disabled) .win98-stack-row-body * {
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

.win98-stack-row-head:has(:is(input, button, select, textarea):disabled),
.win98-stack-row-head:has(:is(input, button, select, textarea):disabled) * {
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

.win98-desktop-dialog-row[data-controls-disabled="true"],
.win98-desktop-dialog-row[data-controls-disabled="true"] *,
.field-row[data-controls-disabled="true"],
.field-row[data-controls-disabled="true"] * {
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

.win98-desktop-dialog-row[data-controls-disabled="true"] > span:first-child,
.field-row[data-controls-disabled="true"] > label {
    opacity: 0.45;
}

.win98-desktop-dialog-row input[type="text"] {
    height: 22px;
    padding: 2px 4px;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
}

.win98-desktop-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 4px;
    position: relative;
    z-index: 3;
    background: #c0c0c0;
}

.win98-desktop-dialog-actions button {
    min-width: 72px;
    padding: 4px 12px;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    background: #c0c0c0;
    color: #000000;
    -webkit-text-fill-color: #000000;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
    cursor: var(--win98-cursor-pointer) !important;
}

.win98-desktop-dialog-actions button:active {
    border-color: #808080 #ffffff #ffffff #808080;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf;
}

.win98-desktop-dialog-fieldset button {
    padding: 3px 10px;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    background: #c0c0c0;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
    cursor: var(--win98-cursor-pointer) !important;
    white-space: nowrap;
}

.win98-desktop-dialog-fieldset button:active {
    border-color: #808080 #ffffff #ffffff #808080;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf;
}

.win98-desktop-dialog-fieldset .win98-cursor-picker-button,
.win98-desktop-dialog-fieldset .win98-cursor-scheme-picker-button {
    width: 100%;
    min-height: 22px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 2px 22px 2px 5px;
    border: 1px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    background-color: #ffffff;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf;
    color: #000000;
    text-align: left;
    position: relative;
}

.win98-desktop-dialog-fieldset .win98-cursor-picker-option,
.win98-desktop-dialog-fieldset .win98-cursor-scheme-picker-option {
    width: 100%;
    min-height: 22px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 2px 5px;
    border: 0;
    background: #ffffff;
    box-shadow: none;
    color: #000000;
    text-align: left;
}

.win98-desktop-dialog-fieldset .win98-cursor-picker-option:hover,
.win98-desktop-dialog-fieldset .win98-cursor-picker-option:focus-visible,
.win98-desktop-dialog-fieldset .win98-cursor-picker-option[aria-selected="true"],
.win98-desktop-dialog-fieldset .win98-cursor-picker-option:active,
.win98-desktop-dialog-fieldset .win98-cursor-scheme-picker-option:hover,
.win98-desktop-dialog-fieldset .win98-cursor-scheme-picker-option:focus-visible,
.win98-desktop-dialog-fieldset .win98-cursor-scheme-picker-option[aria-selected="true"],
.win98-desktop-dialog-fieldset .win98-cursor-scheme-picker-option:active {
    background-color: var(--win98-selection-bg, #000080) !important;
    background-image: var(--win98-selection-bg-image, none) !important;
    background-size: var(--win98-selection-bg-size, auto) !important;
    animation: var(--win98-selection-bg-animation, none) !important;
    color: var(--win98-selection-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-selection-text, #ffffff) !important;
    border: 0;
    box-shadow: none;
    outline: none;
}

.win98-desktop-dialog-fieldset input[type="text"] {
    height: 22px;
    padding: 2px 4px;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
}

html[data-site-theme="win98"] .win98-desktop-dialog-titlebar:active,
.win98-desktop-dialog-titlebar:active {
    cursor: var(--win98-cursor-grabbing) !important;
}

.win98-desktop-dialog-titlebar .win98-desktop-dialog-close {
    position: relative;
    z-index: 8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    line-height: 1;
    font-size: 16px;
    font-weight: 700;
    color: #111;
    -webkit-text-fill-color: #111;
    text-transform: none;
    text-shadow: none;
    background: #c0c0c0;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
    cursor: var(--win98-cursor-pointer) !important;
}

.win98-desktop-dialog-titlebar .win98-desktop-dialog-close:active {
    border-color: #808080 #ffffff #ffffff #808080;
}

.win98-desktop-select {
    height: 24px;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    border: 2px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    background: #fff;
    cursor: var(--win98-cursor-pointer) !important;
}

html[data-site-theme="neon"] .site-dock-menu-note {
    margin: 6px 8px 4px;
    font-size: 9px;
    line-height: 1.35;
    opacity: 0.72;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

html[data-site-theme="win98"] .site-dock-menu-note {
    margin: 6px 8px 4px;
    font-size: 10px;
    line-height: 1.35;
    color: #333;
}

#win98-screensaver-overlay {
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    background: #000;
    isolation: isolate;
}

#win98-screensaver-overlay[hidden] {
    display: none !important;
}

#win98-screensaver-canvas {
    display: block;
    width: 100%;
    height: 100%;
    pointer-events: none;
    image-rendering: pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
    /* Promote canvas to its own compositor layer so repaints don't bleed into surrounding stacking context. */
    transform: translateZ(0);
    contain: strict;
}

#win98-screensaver-tint {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-color: var(--win98-ss-tint-color, transparent);
    opacity: var(--win98-ss-tint-opacity, 0);
    mix-blend-mode: var(--win98-ss-tint-blend, multiply);
    display: var(--win98-ss-tint-display, none);
}

.site-control-dock .theme-toggle {
    min-width: 7.9rem;
    justify-content: center;
    text-align: center;
}

.site-control-dock #theme-toggle {
    order: 100;
}

.site-control-dock #win98-color-toggle {
    display: none;
}

html[data-site-theme="win98"] .site-control-dock #win98-color-toggle {
    display: inline-flex;
}

.neon-only-control {
    display: none !important;
}

html[data-site-theme="neon"] .neon-only-control {
    display: inline-flex !important;
}

/* Admin: keep the STYLE/defaults dialog button reachable in every theme so flat/vaporwave
   site-wide defaults can be edited regardless of the active admin theme. */
body.admin-page .site-control-dock #neon-playlist-style-toggle {
    display: inline-flex !important;
}

.win98-only-control {
    display: none !important;
}

html[data-site-theme="win98"] .win98-only-control {
    display: inline-flex !important;
}

html[data-site-theme="win98"] .site-control-dock #star-parallax-toggle,
html[data-site-theme="vaporwave"] .site-control-dock #star-parallax-toggle {
    display: none;
}

.neon-playlist-style-dialog-root {
    --neon-style-accent: var(--gp-color, #ff0055);
    --neon-style-accent-soft: color-mix(in srgb, var(--neon-style-accent) 24%, transparent);
    --neon-style-accent-glow: color-mix(in srgb, var(--neon-style-accent) 50%, transparent);
    --neon-style-line: color-mix(in srgb, var(--neon-style-accent) 18%, rgba(255, 255, 255, 0.08));
    --neon-style-text: #f6f7fa;
    --neon-style-text-muted: rgba(255, 255, 255, 0.6);
}

.neon-playlist-style-dialog-root[hidden] {
    display: none !important;
}

.neon-playlist-field[hidden],
.neon-playlist-section[hidden],
.neon-style-tab-panel[hidden] {
    display: none !important;
}

.neon-playlist-style-dialog-root {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    pointer-events: none;
}

body.neon-playlist-style-open .neon-playlist-style-dialog-root {
    align-items: flex-start;
    padding-bottom: 132px;
}

body.neon-playlist-style-open .neon-playlist-style-dialog {
    max-height: calc(100vh - 152px);
    overflow: hidden;
    overscroll-behavior: contain;
}

body.neon-playlist-style-open .global-player {
    z-index: 10060;
}

body.neon-playlist-style-open.neon-style-hero-preview .global-player {
    display: none !important;
}

body.neon-playlist-style-open.neon-style-hero-preview .neon-playlist-style-dialog-root {
    justify-content: flex-end;
}

body.neon-playlist-style-open.neon-style-hero-preview .neon-playlist-style-backdrop,
body.neon-playlist-style-open.neon-style-saved-preview .neon-playlist-style-backdrop {
    background: rgba(0, 0, 0, 0.18);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.neon-playlist-style-backdrop {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 50% 22%, color-mix(in srgb, var(--neon-style-accent) 14%, transparent), transparent 60%),
        rgba(0, 0, 0, 0.62);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    pointer-events: auto;
}

.neon-playlist-style-dialog {
    display: flex;
    flex-direction: column;
    position: relative;
    pointer-events: auto;
    width: min(880px, calc(100vw - 32px));
    min-width: min(440px, calc(100vw - 32px));
    min-height: min(460px, calc(100vh - 32px));
    border-radius: 18px;
    border: 1px solid var(--neon-style-line);
    background:
        radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--neon-style-accent) 10%, transparent), transparent 55%),
        linear-gradient(180deg, rgba(16, 17, 22, 0.96), rgba(6, 7, 10, 0.98));
    box-shadow:
        0 28px 80px rgba(0, 0, 0, 0.72),
        0 0 0 1px rgba(255, 255, 255, 0.03),
        0 0 36px color-mix(in srgb, var(--neon-style-accent) 22%, transparent),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    color: var(--neon-style-text);
    overflow: hidden;
}

.neon-playlist-style-dialog::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--neon-style-accent), transparent);
    box-shadow: 0 0 18px var(--neon-style-accent-glow);
    pointer-events: none;
    z-index: 4;
}

.neon-playlist-style-head,
.neon-playlist-style-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 18px;
}

.neon-playlist-style-head {
    position: relative;
    border-bottom: 1px solid var(--neon-style-line);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-style-accent) 10%, rgba(8, 9, 12, 0.85)), rgba(8, 9, 12, 0.92));
    cursor: grab;
    user-select: none;
}

.neon-playlist-style-head::after {
    content: "";
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: -1px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--neon-style-accent-soft), transparent);
}

body.neon-playlist-style-dragging .neon-playlist-style-head {
    cursor: grabbing;
}

.neon-playlist-style-head h2 {
    margin: 0;
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    text-shadow: 0 0 16px var(--neon-style-accent-glow);
}

.neon-playlist-style-close,
.neon-playlist-style-actions button {
    border: 1px solid var(--neon-style-accent-soft);
    background: color-mix(in srgb, var(--neon-style-accent) 8%, rgba(16, 18, 22, 0.88));
    color: #fff;
    border-radius: 999px;
    min-height: 34px;
    padding: 0 14px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.05s ease;
}

.neon-playlist-style-close:hover,
.neon-playlist-style-actions button:hover {
    border-color: var(--neon-style-accent);
    box-shadow: 0 0 18px var(--neon-style-accent-glow);
}

.neon-playlist-style-close:active,
.neon-playlist-style-actions button:active {
    transform: translateY(1px);
}

.neon-playlist-style-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 34px;
    padding: 0;
    font-size: 0;
    line-height: 1;
}

.neon-playlist-style-close::before,
.neon-playlist-style-close::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 12px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transform: translate(-50%, -50%) rotate(45deg);
}

.neon-playlist-style-close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.neon-playlist-style-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    padding: 0;
}

/* Non-neon themes have no inner scroll shell, so the body itself scrolls.
   Invisible scrollbar (no track/thumb) per request. */
.neon-playlist-style-dialog-root[data-style-theme="vaporwave"] .neon-playlist-style-body,
.neon-playlist-style-dialog-root[data-style-theme="flat"] .neon-playlist-style-body,
.neon-playlist-style-dialog-root[data-style-theme="win98"] .neon-playlist-style-body {
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-bottom: 6px;
}
.neon-playlist-style-dialog-root[data-style-theme="vaporwave"] .neon-playlist-style-body::-webkit-scrollbar,
.neon-playlist-style-dialog-root[data-style-theme="flat"] .neon-playlist-style-body::-webkit-scrollbar,
.neon-playlist-style-dialog-root[data-style-theme="win98"] .neon-playlist-style-body::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

.neon-style-display-card {
    flex: 0 0 auto;
    padding: 14px 18px;
    border-bottom: 1px solid var(--neon-style-line);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-style-accent) 6%, transparent), transparent),
        rgba(8, 9, 12, 0.72);
}

.neon-style-display-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
}

.neon-style-shell {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: 172px minmax(0, 1fr);
}

.neon-style-rail {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 10px;
    border-right: 1px solid var(--neon-style-line);
    background: rgba(6, 7, 10, 0.6);
    overflow-y: auto;
    overscroll-behavior: contain;
}

.neon-style-rail button {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
    height: 38px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: var(--neon-style-text-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    cursor: pointer;
    text-align: left;
    transition: color 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}

.neon-style-rail button:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.045);
}

.neon-style-rail-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.2);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
    flex-shrink: 0;
    transition: background 0.16s ease, box-shadow 0.16s ease;
}

.neon-style-rail button.is-active {
    color: #fff;
    background: color-mix(in srgb, var(--neon-style-accent) 14%, rgba(255, 255, 255, 0.04));
    border-color: var(--neon-style-accent-soft);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.04),
        0 0 22px color-mix(in srgb, var(--neon-style-accent) 22%, transparent);
}

.neon-style-rail button.is-active .neon-style-rail-dot {
    background: var(--neon-style-accent);
    box-shadow: 0 0 14px var(--neon-style-accent-glow);
}

.neon-style-rail button:focus-visible {
    outline: 1px solid var(--neon-style-accent);
    outline-offset: 2px;
}

.neon-style-panes {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 16px 18px;
    scrollbar-color: var(--neon-style-accent-soft) rgba(255, 255, 255, 0.05);
}

.neon-style-panes::-webkit-scrollbar {
    width: 10px;
}

.neon-style-panes::-webkit-scrollbar-track,
.neon-style-panes::-webkit-scrollbar-track-piece,
.neon-style-panes::-webkit-scrollbar-track-piece:hover,
.neon-style-panes::-webkit-scrollbar-track-piece:active {
    background: rgba(255, 255, 255, 0.04);
    border-radius: 999px;
    box-shadow: none;
    filter: none;
}

.neon-style-panes::-webkit-scrollbar-thumb,
.neon-style-panes::-webkit-scrollbar-thumb:hover {
    background: color-mix(in srgb, var(--neon-style-accent) 56%, rgba(255, 255, 255, 0.18));
    border: 2px solid transparent;
    border-radius: 999px;
    background-clip: padding-box;
}

.neon-style-panes::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

.neon-style-tab-panel {
    display: grid;
    gap: 12px;
}

.neon-style-preview-card {
    border-color: var(--neon-style-accent-soft);
    background: color-mix(in srgb, var(--neon-style-accent) 6%, rgba(255, 255, 255, 0.025));
}

.neon-style-main-preview {
    position: relative;
    min-height: 120px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 12px;
    background:
        radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--neon-style-accent) 16%, transparent), transparent 38%),
        linear-gradient(180deg, rgba(7, 8, 10, 0.85), rgba(3, 3, 5, 0.95));
    padding: 12px;
}

@media (max-width: 720px) {
    .neon-style-display-grid {
        grid-template-columns: 1fr;
    }

    .neon-style-shell {
        grid-template-columns: 1fr;
    }

    .neon-style-rail {
        flex-direction: row;
        gap: 6px;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 10px;
        border-right: 0;
        border-bottom: 1px solid var(--neon-style-line);
    }

    .neon-style-rail button {
        flex: 1 0 auto;
        justify-content: center;
    }
}

.neon-style-playlist-preview {
    min-height: 164px;
    display: flex;
    align-items: center;
}

.neon-style-preview-player {
    --gp-color: #ff0055;
    --gp-color-a: #ff0055;
    --gp-color-b: #00ffff;
    --gp-blur: 18px;
    --gp-opacity: 0.7;
    position: relative !important;
    left: auto;
    right: auto;
    bottom: auto;
    z-index: 1;
    width: 100%;
    display: block !important;
    pointer-events: none;
}

.neon-style-preview-player .global-player-inner {
    position: relative;
    overflow: visible;
    background: rgba(4, 5, 5, var(--gp-opacity)) !important;
    border: 1px solid color-mix(in srgb, var(--gp-color) 18%, transparent) !important;
    border-top: 2px solid color-mix(in srgb, var(--gp-color) 72%, transparent) !important;
    border-radius: 14px !important;
    box-shadow:
        0 10px 20px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 color-mix(in srgb, var(--gp-color) 8%, transparent),
        0 0 18px color-mix(in srgb, var(--gp-color) 12%, transparent) !important;
    backdrop-filter: blur(var(--gp-blur));
    -webkit-backdrop-filter: blur(var(--gp-blur));
}

.neon-style-preview-player .global-player-inner::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 2px;
    background: linear-gradient(
        to right,
        color-mix(in srgb, var(--gp-color) 56%, transparent),
        color-mix(in srgb, var(--gp-color) 100%, transparent),
        color-mix(in srgb, var(--gp-color) 56%, transparent)
    );
    border-radius: inherit;
    pointer-events: none;
}

.neon-style-preview-player .global-player-shell {
    position: relative;
    padding: 14px 16px;
    opacity: 1;
    filter: none;
}

.neon-style-preview-player .global-player-bar {
    display: grid;
    grid-template-columns: minmax(150px, 0.9fr) minmax(260px, 1.4fr) minmax(165px, 0.85fr);
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.neon-style-preview-player .global-player-left,
.neon-style-preview-player .global-player-center,
.neon-style-preview-player .global-player-right {
    min-width: 0;
}

.neon-style-preview-player .global-player-left {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.neon-style-preview-player .global-player-kicker {
    color: rgba(255, 255, 255, 0.48) !important;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.neon-style-preview-player .global-player-statusline {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.neon-style-preview-player .global-player-eq {
    display: inline-flex;
    align-items: flex-end;
    gap: 3px;
    height: 12px;
    flex-shrink: 0;
}

.neon-style-preview-player .global-player-eq span {
    width: 3px;
    border-radius: 999px;
    background: var(--gp-color);
}

.neon-style-preview-player .global-player-eq span:nth-child(1) { height: 5px; }
.neon-style-preview-player .global-player-eq span:nth-child(2) { height: 10px; }
.neon-style-preview-player .global-player-eq span:nth-child(3) { height: 7px; }

.neon-style-preview-player .global-player-status,
.neon-style-preview-player .global-player-subtitle {
    color: var(--gp-color) !important;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.neon-style-preview-player .global-player-title {
    color: #ffffff !important;
    font-size: 16px;
    line-height: 1.05;
    font-weight: 900;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.neon-style-preview-player .global-player-center {
    display: grid;
    grid-template-columns: auto minmax(150px, 1fr);
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.neon-style-preview-player .global-player-controls {
    display: flex;
    align-items: center;
    gap: 7px;
}

.neon-style-preview-player .global-player-btn {
    width: 30px;
    height: 30px;
    border: 1px solid color-mix(in srgb, var(--gp-color) 36%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--gp-color) 8%, rgba(255, 255, 255, 0.04));
    color: var(--gp-color) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 0 10px color-mix(in srgb, var(--gp-color) 14%, transparent);
}

.neon-style-preview-player .global-player-btn.play-btn {
    width: 36px;
    height: 36px;
}

.neon-style-preview-player .global-player-btn svg {
    width: 14px;
    height: 14px;
    fill: currentColor;
}

.neon-style-preview-player .global-player-btn .shuffle-icon {
    fill: none;
    stroke: currentColor;
    stroke-width: 2.1;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.neon-style-preview-player .global-player-progress {
    min-width: 0;
}

.neon-style-preview-player .global-player-slider-wrap {
    position: relative;
    height: 20px;
    display: flex;
    align-items: center;
}

.neon-style-preview-player .global-player-slider-track,
.neon-style-preview-player .global-player-slider-fill {
    position: absolute;
    left: 0;
    right: 0;
    height: 4px;
    border-radius: 999px;
}

.neon-style-preview-player .global-player-slider-track {
    background: rgba(255, 255, 255, 0.16);
}

.neon-style-preview-player .global-player-slider-fill {
    right: 58%;
    background: var(--gp-color);
    box-shadow: 0 0 10px color-mix(in srgb, var(--gp-color) 24%, transparent);
}

.neon-style-preview-player .global-player-time-row {
    display: flex;
    justify-content: space-between;
    color: rgba(255, 255, 255, 0.5);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.1em;
}

.neon-style-preview-player .global-player-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
}

.neon-style-preview-player .global-player-track-picker {
    min-width: 0;
    flex: 1 1 auto;
}

.neon-style-preview-player .global-player-track-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 32px;
    padding: 0 9px;
    border: 1px solid color-mix(in srgb, var(--gp-color) 22%, transparent);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.72);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.neon-style-preview-player .global-player-track-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.neon-style-preview-player .global-player-track-chevron {
    width: 18px;
    height: 18px;
    border: 1px solid color-mix(in srgb, var(--gp-color) 28%, transparent);
    border-radius: 999px;
    color: var(--gp-color);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.neon-style-preview-player .global-player-track-chevron svg {
    width: 9px;
    height: 9px;
    stroke: currentColor;
    stroke-width: 2.2;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.neon-style-preview-player .global-player-pill {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    border: 1px solid color-mix(in srgb, var(--gp-color) 20%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--gp-color) 7%, transparent);
    color: rgba(255, 255, 255, 0.72);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.08em;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .neon-style-preview-player .global-player-bar {
        grid-template-columns: 1fr;
    }

    .neon-style-preview-player .global-player-right {
        justify-content: flex-start;
    }
}

.neon-style-hero-preview-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    max-height: 320px;
    overflow: auto;
}

.neon-style-preview-box {
    display: grid;
    align-content: center;
    gap: 8px;
    min-height: 104px;
    padding: 14px;
    text-decoration: none;
    color: #ffffff;
    border-radius: 14px;
}

.neon-style-preview-box.site-widget-card {
    position: relative;
    inset: auto;
    width: auto;
    min-width: 0;
}

.neon-style-preview-box .box-title,
.neon-style-preview-box .game-rotation-heading,
.neon-style-preview-box .site-guestbook-hero-heading,
.neon-style-preview-box .site-widget-title {
    margin: 0;
    color: inherit;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.neon-style-preview-box .box-subtitle,
.neon-style-preview-box .game-rotation-live,
.neon-style-preview-box .site-guestbook-entry-message,
.neon-style-preview-box .site-guestbook-entry-meta,
.neon-style-preview-box .site-currently-list li {
    color: rgba(255, 255, 255, 0.72);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.neon-style-preview-box .site-hit-counter {
    justify-content: flex-start;
}

.neon-style-preview-box .site-currently-list {
    margin: 0;
    padding-left: 0;
}

.neon-style-preview-box .site-guestbook-entry {
    margin: 0;
    padding: 9px;
    border-radius: 10px;
}

.neon-style-preview-empty {
    color: rgba(255, 255, 255, 0.62);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.neon-style-section-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 14px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), rgba(255, 255, 255, 0.012));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.neon-style-section-card[open] {
    border-color: var(--neon-style-accent-soft);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 0 0 1px color-mix(in srgb, var(--neon-style-accent) 10%, transparent),
        0 0 24px color-mix(in srgb, var(--neon-style-accent) 10%, transparent);
}

.neon-style-section-card summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 0 14px;
    color: #fff;
    cursor: pointer;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.18em;
    list-style: none;
    text-transform: uppercase;
    user-select: none;
    pointer-events: auto;
}

.neon-style-section-card summary::-webkit-details-marker {
    display: none;
}

.neon-style-section-card summary::after {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    border-right: 2px solid rgba(255, 255, 255, 0.55);
    border-bottom: 2px solid rgba(255, 255, 255, 0.55);
    transform: rotate(45deg);
    transition: transform 0.18s ease, border-color 0.18s ease;
    margin-bottom: 4px;
}

.neon-style-section-card[open] summary::after {
    transform: rotate(-135deg);
    margin-bottom: -2px;
    border-color: var(--neon-style-accent);
}

.neon-style-section-card summary small {
    display: none;
    margin-top: 3px;
    color: var(--neon-style-text-muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.14em;
}

.neon-style-section-inner {
    display: grid;
    gap: 10px;
    padding: 0 14px 14px;
}

.neon-style-section-card[open] .neon-style-section-inner {
    border-top: 1px solid rgba(255, 255, 255, 0.045);
    padding-top: 12px;
}

.neon-style-basic-group {
    display: grid;
    gap: 8px;
}

.neon-style-basic-group[hidden] {
    display: none !important;
}

.neon-playlist-section {
    margin: 0 0 -2px;
    color: var(--neon-style-text-muted);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

.neon-style-row-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: stretch;
}

.neon-playlist-mode-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
    padding: 4px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.32);
}

.neon-variant-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.neon-hero-mode-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.neon-playlist-mode-grid label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 30px;
    padding: 4px 8px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: var(--neon-style-text-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.1;
    cursor: pointer;
    transition: background-color 0.16s ease, color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.neon-playlist-mode-grid label:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.045);
}

.neon-playlist-mode-grid input,
.neon-playlist-check input {
    accent-color: var(--neon-style-accent);
}

.neon-playlist-mode-grid input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    pointer-events: none;
}

.neon-playlist-mode-grid label:has(input:checked) {
    color: #fff;
    border-color: var(--neon-style-accent);
    background:
        radial-gradient(120% 120% at 0% 0%, color-mix(in srgb, var(--neon-style-accent) 32%, transparent), color-mix(in srgb, var(--neon-style-accent) 12%, transparent));
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--neon-style-accent) 50%, transparent),
        0 0 18px var(--neon-style-accent-glow);
}

.neon-playlist-field {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 10px;
    background: rgba(8, 9, 12, 0.48);
    color: var(--neon-style-text-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.neon-style-mini-reset,
.neon-style-category-actions button {
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.035);
    color: var(--neon-style-text-muted);
    border-radius: 10px;
    height: 30px;
    min-height: 30px;
    padding: 0 12px;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.neon-style-mini-reset:hover,
.neon-style-category-actions button:hover {
    color: #fff;
    border-color: var(--neon-style-accent);
    box-shadow: 0 0 14px var(--neon-style-accent-glow);
}

.neon-hero-shuffle-section {
    display: grid;
    gap: 9px;
}

.neon-hero-shuffle-section[hidden] {
    display: none !important;
}

.neon-hero-shuffle-list {
    display: grid;
    gap: 9px;
}

.neon-style-inline-actions {
    justify-content: start;
}

@media (max-width: 620px) {
    .neon-hero-mode-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .neon-playlist-field {
        grid-template-columns: 1fr;
    }
}

.neon-playlist-style-resize {
    position: absolute;
    width: 18px;
    height: 18px;
    z-index: 2;
}

.neon-playlist-style-resize.is-se {
    right: 5px;
    bottom: 5px;
    cursor: nwse-resize;
}

.neon-playlist-style-resize.is-nw {
    left: 5px;
    top: 5px;
    cursor: nwse-resize;
}

.neon-playlist-style-resize.is-ne {
    right: 5px;
    top: 5px;
    cursor: nesw-resize;
}

.neon-playlist-style-resize.is-sw {
    left: 5px;
    bottom: 5px;
    cursor: nesw-resize;
}

.neon-playlist-style-resize::before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
}

.neon-playlist-style-resize.is-se::before {
    right: 2px;
    bottom: 2px;
    border-right: 2px solid var(--neon-style-accent-soft);
    border-bottom: 2px solid var(--neon-style-accent-soft);
}

.neon-playlist-field input[type="color"] {
    width: 100%;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.neon-playlist-field input[type="range"] {
    --neon-range-progress: 0%;
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    height: 18px;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.neon-playlist-field input[type="range"]::-webkit-slider-runnable-track {
    height: 6px;
    border: 0;
    border-radius: 999px;
    background:
        linear-gradient(
            90deg,
            var(--neon-style-accent) 0%,
            var(--neon-style-accent) var(--neon-range-progress),
            rgba(255, 255, 255, 0.16) var(--neon-range-progress),
            rgba(255, 255, 255, 0.16) 100%
        );
    box-shadow: 0 0 10px color-mix(in srgb, var(--neon-style-accent) 30%, transparent);
}

.neon-playlist-field input[type="range"]::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    margin-top: -6px;
    border: 0;
    border-radius: 50%;
    background: #ffffff;
    box-shadow:
        0 0 0 2px var(--neon-style-accent),
        0 0 12px var(--neon-style-accent-glow);
}

.neon-playlist-field input[type="range"]::-moz-range-track {
    height: 6px;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
}

.neon-playlist-field input[type="range"]::-moz-range-progress {
    height: 6px;
    border-radius: 999px;
    background: var(--neon-style-accent);
    box-shadow: 0 0 10px var(--neon-style-accent-glow);
}

.neon-playlist-field input[type="range"]::-moz-range-thumb {
    width: 18px;
    height: 18px;
    border: 0;
    border-radius: 50%;
    background: #ffffff;
    box-shadow:
        0 0 0 2px var(--neon-style-accent),
        0 0 12px var(--neon-style-accent-glow);
}

.neon-playlist-field select,
.neon-style-theme-row select {
    width: 100%;
    min-height: 32px;
    padding: 0 32px 0 10px;
    border: 1px solid var(--neon-style-accent-soft);
    border-radius: 8px;
    appearance: none;
    -webkit-appearance: none;
    color: #ffffff;
    background-color: rgba(10, 11, 14, 0.92);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 9px center;
    background-size: 14px 14px;
    font: inherit;
}

.neon-playlist-field select option,
.neon-style-theme-row select option {
    background: #121416;
    color: #ffffff;
}

.neon-style-output-wrap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.neon-style-output-wrap output {
    min-width: 40px;
    text-align: right;
    color: #fff;
    font-weight: 900;
}

.neon-style-category-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 2px;
}

.neon-style-category-actions.neon-style-inline-actions {
    justify-content: flex-start;
}

.neon-style-theme-tools {
    display: grid;
    gap: 8px;
    padding-top: 2px;
}

.neon-style-theme-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.neon-style-theme-row input,
.neon-style-theme-row select {
    flex: 1 1 auto;
    min-width: 0;
    height: 32px;
    min-height: 32px;
    border: 1px solid var(--neon-style-accent-soft);
    border-radius: 10px;
    background-color: rgba(8, 9, 12, 0.6);
    color: #fff;
    padding: 0 12px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.neon-style-theme-row select {
    padding-right: 32px;
}

.neon-style-theme-row input::placeholder {
    color: var(--neon-style-text-muted);
}

.neon-style-theme-row button {
    border: 1px solid var(--neon-style-accent-soft);
    background: color-mix(in srgb, var(--neon-style-accent) 6%, rgba(255, 255, 255, 0.035));
    color: #fff;
    border-radius: 10px;
    height: 32px;
    min-height: 32px;
    padding: 0 12px;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
    transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.neon-style-theme-row button:hover {
    border-color: var(--neon-style-accent);
    box-shadow: 0 0 16px var(--neon-style-accent-glow);
}

.neon-style-defaults-status {
    flex: 1 1 auto;
    min-width: 0;
    color: var(--neon-style-text-muted);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.neon-hero-box-group {
    display: grid;
    gap: 8px;
    padding: 10px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.22);
}

.neon-hero-box-group[hidden] {
    display: none !important;
}

.neon-hero-box-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #fff;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.neon-hero-box-list {
    gap: 8px;
}

.neon-playlist-check {
    grid-template-columns: auto 1fr;
    justify-content: start;
}

.neon-playlist-style-actions {
    flex: 0 0 auto;
    border-top: 1px solid var(--neon-style-line);
    justify-content: flex-end;
    background: linear-gradient(180deg, rgba(8, 9, 12, 0.6), rgba(8, 9, 12, 0.9));
}

.title-top-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.title-side-controls {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: center;
    justify-content: center;
    gap: 0.6rem;
}

#live-pill-title {
    align-self: center;
}

.title-toggle-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

@media (min-width: 768px) {
    .title-top-row {
        flex-wrap: nowrap;
    }

    .title-side-controls {
        align-items: flex-end;
    }
}

.site-tooltip-host {
    position: relative;
}

.site-tooltip-host[aria-label]::before {
    content: attr(aria-label);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%) translateY(4px);
    padding: 0.38rem 0.55rem;
    border-radius: 999px;
    background: rgba(8, 10, 10, 0.96);
    border: 1px solid rgba(255,255,255,0.08);
    color: #ffffff;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.14s ease, transform 0.14s ease;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.38), 0 0 12px rgba(255,255,255,0.08);
    z-index: 40;
}

.site-tooltip-host[aria-label]:hover::before,
.site-tooltip-host[aria-label]:focus-visible::before {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.site-control-dock .site-tooltip-host[aria-label]::before {
    left: auto;
    right: calc(100% + 10px);
    bottom: auto;
    top: 50%;
    transform: translateY(-50%) translateX(4px);
}

.site-control-dock .site-tooltip-host[aria-label]:hover::before,
.site-control-dock .site-tooltip-host[aria-label]:focus-visible::before {
    transform: translateY(-50%) translateX(0);
}

.global-player-volume-rail {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    width: 100%;
}

.global-player-volume-rail .global-player-slider-wrap {
    flex: 1 1 auto;
    min-width: 0;
}

.global-player-volume-caption,
.global-player-volume-edge {
    display: none;
}

html[data-site-theme="win98"] {
    background-color: var(--win98-desktop);
    --win98-scrollbar-size: 18px;
}

html[data-site-theme="win98"] body {
    background: transparent;
    color: var(--win98-desktop-text, #111);
    font-family: Tahoma, "MS Sans Serif", sans-serif;
}

html[data-site-theme="win98"] #theme-backdrop {
    opacity: 1;
    background-color: var(--win98-desktop);
    background-image: none;
    background-size: auto;
    background-repeat: repeat;
    background-position: 0 0;
    image-rendering: pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
    overflow: hidden;
    isolation: isolate;
    filter: blur(var(--win98-desktop-blur, 0px));
}

html[data-site-theme="win98"] #theme-backdrop .win98-backdrop-rainbow {
    position: absolute;
    inset: -900px;
    pointer-events: none;
    display: none;
    background-image: linear-gradient(var(--win98-rainbow-desktop-pastel-overlay), var(--win98-rainbow-desktop-pastel-overlay)), var(--win98-rainbow-desktop-scroll-strip);
    background-repeat: no-repeat, repeat;
    background-size: 100% 100%, var(--win98-rainbow-desktop-bg-size, 800px 100%);
    background-position: 0 0, 0 0;
    mix-blend-mode: var(--win98-rainbow-desktop-blend, normal);
    filter: none;
    animation: var(--win98-rainbow-desktop-anim-name, win98-rainbow-desktop-h) var(--win98-rainbow-desktop-duration, 32s) linear infinite;
    animation-play-state: var(--win98-rainbow-desktop-play-state, running);
    will-change: background-position;
    z-index: 1;
}

html[data-site-theme="win98"][data-win98-desktop-rainbow="1"] #theme-backdrop .win98-backdrop-rainbow {
    display: block;
}

/* Gradient overlay — sits between the wallpaper image and the tint, blends with whatever is below. */
html[data-site-theme="win98"] #theme-backdrop::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: var(--win98-bg-grad-image, none);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    mix-blend-mode: var(--win98-bg-grad-blend, normal);
    opacity: var(--win98-bg-grad-opacity, 1);
    display: var(--win98-bg-grad-display, none);
    z-index: 0;
}

/* Wallpaper tint overlay — colorizes whatever is below (wallpaper or gradient) using a chosen blend mode */
html[data-site-theme="win98"] #theme-backdrop::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-color: var(--win98-bg-tint-color, transparent);
    opacity: var(--win98-bg-tint-opacity, 0);
    mix-blend-mode: var(--win98-bg-tint-blend, multiply);
    display: var(--win98-bg-tint-display, none);
    z-index: 2;
}

html[data-site-theme="win98"] body::after {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    background-color: var(--win98-page-tint-color, transparent);
    opacity: var(--win98-page-tint-opacity, 0);
    mix-blend-mode: var(--win98-page-tint-blend, multiply);
    display: var(--win98-page-tint-display, none);
    z-index: 100065;
}

html[data-site-theme="win98"][data-win98-bg-mode="tile"] #theme-backdrop {
    background-image: var(--win98-bg-image, none);
    background-size: var(--win98-bg-tile-size, auto);
    background-repeat: repeat;
    background-position: 0 0;
}

html[data-site-theme="win98"][data-win98-bg-mode="center"] #theme-backdrop {
    background-image: var(--win98-bg-image, none);
    background-size: auto;
    background-repeat: no-repeat;
    background-position: center center;
}

html[data-site-theme="win98"][data-win98-bg-mode="stretch"] #theme-backdrop {
    background-image: var(--win98-bg-image, none);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
}

html[data-site-theme="win98"][data-win98-bg-mode="fill"] #theme-backdrop {
    background-image: var(--win98-bg-image, none);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    image-rendering: auto;
}

html[data-site-theme="win98"][data-win98-bg-mode="fit"] #theme-backdrop {
    background-image: var(--win98-bg-image, none);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    image-rendering: auto;
}

/* Rainbow desktop must win over wallpaper layout modes (those rules come earlier and share specificity). */
html[data-site-theme="win98"][data-win98-desktop-rainbow="1"][data-win98-bg-mode="tile"] #theme-backdrop,
html[data-site-theme="win98"][data-win98-desktop-rainbow="1"][data-win98-bg-mode="center"] #theme-backdrop,
html[data-site-theme="win98"][data-win98-desktop-rainbow="1"][data-win98-bg-mode="stretch"] #theme-backdrop,
html[data-site-theme="win98"][data-win98-desktop-rainbow="1"][data-win98-bg-mode="fill"] #theme-backdrop,
html[data-site-theme="win98"][data-win98-desktop-rainbow="1"][data-win98-bg-mode="fit"] #theme-backdrop {
    background-color: var(--win98-desktop) !important;
    background-image: var(--win98-bg-image, none) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-bg-tile-size, auto) !important;
    background-position: 0 0 !important;
    filter: blur(var(--win98-desktop-blur, 0px));
}

html[data-site-theme="win98"][data-win98-desktop-rainbow="1"][data-win98-bg-mode="center"] #theme-backdrop {
    background-repeat: no-repeat !important;
    background-size: auto !important;
    background-position: center center !important;
}

html[data-site-theme="win98"][data-win98-desktop-rainbow="1"][data-win98-bg-mode="stretch"] #theme-backdrop {
    background-repeat: no-repeat !important;
    background-size: 100% 100% !important;
    background-position: center center !important;
}

html[data-site-theme="win98"][data-win98-desktop-rainbow="1"][data-win98-bg-mode="fill"] #theme-backdrop {
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: center center !important;
}

html[data-site-theme="win98"][data-win98-desktop-rainbow="1"][data-win98-bg-mode="fit"] #theme-backdrop {
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center center !important;
}

html[data-site-theme="win98"] #star-field {
    display: none !important;
}

html[data-site-theme="win98"] .color-orb {
    opacity: 0 !important;
    visibility: hidden !important;
}

html[data-site-theme="win98"] .float-wrapper {
    animation: none !important;
}

html[data-site-theme="win98"] .reveal {
    animation: none !important;
    transform: none !important;
}

html[data-site-theme="win98"] .title-container {
    width: min(100%, 980px);
    padding: 1rem 1.15rem 1.15rem;
    background: var(--win98-panel-bg, rgba(192, 192, 192, 1));
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    border-radius: 0;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
}

html[data-site-theme="win98"] .title-container::before {
    content: "ITSJMIKEE.EXE";
    display: block;
    align-self: stretch;
    width: calc(100% + 2.3rem);
    box-sizing: border-box;
    margin: -1rem -1.15rem 0.95rem;
    padding: 0.32rem 0.6rem 0.32rem 30px;
    background-color: transparent;
    background-image: url("../assets/avatar.png"), linear-gradient(to right, #808080, #c0c0c0);
    background-size: 16px 16px, 100% 100%;
    background-position: 7px center, 0 0;
    background-repeat: no-repeat, no-repeat;
    color: var(--win98-inactive-title-text, #ffffff);
    -webkit-text-fill-color: var(--win98-inactive-title-text, #ffffff);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-align: left;
    text-transform: uppercase;
}

html[data-site-theme="win98"] .title-container:hover::before,
html[data-site-theme="win98"] .title-container:focus-within::before {
    background-image: url("../assets/avatar.png"), var(--win98-title-bg-local, var(--win98-title-bg, linear-gradient(to right, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0))));
    background-size: 16px 16px, 100% 100%;
    background-position: 7px center, 0 0;
    background-repeat: no-repeat, no-repeat;
    color: var(--win98-title-text, #ffffff);
    -webkit-text-fill-color: var(--win98-title-text, #ffffff);
}

html[data-site-theme="win98"] .title-container *,
html[data-site-theme="win98"] .glass,
html[data-site-theme="win98"] .glass *,
html[data-site-theme="win98"] .player-shell,
html[data-site-theme="win98"] .player-shell * {
    color: var(--win98-text, #111) !important;
    text-shadow: none !important;
}

html[data-site-theme="win98"] .now-playing-card,
html[data-site-theme="win98"] .now-playing-card *,
html[data-site-theme="win98"] .inner-entry,
html[data-site-theme="win98"] .inner-entry *,
html[data-site-theme="win98"] .carousel-viewport,
html[data-site-theme="win98"] .carousel-viewport *:not(.poster-title):not(.poster-box):not(.poster-box span) {
    color: var(--win98-sub-text, var(--win98-text, #111)) !important;
}

html[data-site-theme="win98"] .smp-hero-glass,
html[data-site-theme="win98"] .smp-hero-glass * {
    color: var(--win98-text, #111) !important;
}

html[data-site-theme="win98"] .smp-hero-glass .box-title,
html[data-site-theme="win98"] .smp-hero-glass .box-title * {
    color: var(--win98-title-text, #fff) !important;
}

html[data-site-theme="win98"] .flicker-title {
    opacity: 1;
    animation: none !important;
    font-style: normal !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    cursor: var(--win98-cursor-default) !important;
    pointer-events: none;
}

html[data-site-theme="win98"] .flicker-title:hover,
html[data-site-theme="win98"] .flicker-title:active,
html[data-site-theme="win98"] .avatar-animated:hover {
    animation: none !important;
    transform: none !important;
    color: #111 !important;
    box-shadow: none !important;
}

html[data-site-theme="win98"] .glass,
html[data-site-theme="win98"] .player-shell {
    background: var(--win98-panel-bg, rgba(192, 192, 192, 1)) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 2px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    padding: 2.85rem 2.5rem 2.5rem !important;
    position: relative;
}

html[data-site-theme="win98"] .now-playing-card {
    background: var(--win98-sub-bg, #ffffff) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 2px solid !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #dfdfdf, inset 1px 1px 0 #000000 !important;
    padding: 0.85rem 1rem !important;
}

html[data-site-theme="win98"] .glass {
    overflow: hidden !important;
}

html[data-site-theme="win98"] .glass::before {
    display: none !important;
}

html[data-site-theme="win98"] .glass:hover {
    transform: none !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    outline: 1px dotted #000 !important;
    outline-offset: -4px !important;
}

html[data-site-theme="win98"] .site-guestbook-shell:hover,
html[data-site-theme="win98"] .site-guestbook-shell:focus-within {
    outline: none !important;
    outline-offset: 0 !important;
}

html[data-site-theme="win98"] .site-guestbook-shell :is(
    .site-guestbook-form,
    .site-guestbook-form *,
    .site-guestbook-comments-title,
    .site-guestbook-status,
    .site-guestbook-entry,
    .site-guestbook-entry-empty,
    .site-guestbook-entry-message,
    .site-guestbook-verification-code
) {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    text-shadow: none !important;
}

html[data-site-theme="win98"] .site-guestbook-shell .site-guestbook-comments-title {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
}

html[data-site-theme="win98"] .site-guestbook-comments {
    display: grid;
    gap: 7px;
    padding: 18px 20px 20px;
    background: #c0c0c0;
    border: 2px solid;
    border-color: #ffffff #808080 #808080 #ffffff;
    border-radius: 0;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
}

html[data-site-theme="win98"] .site-guestbook-shell .site-guestbook-comments-title {
    margin: 0 0 10px;
    padding: 0;
    background: transparent;
    font: 700 18px/1.2 Tahoma, "MS Sans Serif", sans-serif;
    text-transform: none;
}

html[data-site-theme="win98"] .site-guestbook-comments .site-guestbook-entries {
    display: grid;
    gap: 16px;
}

html[data-site-theme="win98"] .site-guestbook-comments .site-guestbook-entry {
    background: #c0c0c0;
    border-color: #ffffff #808080 #808080 #ffffff;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf;
}

html[data-site-theme="win98"] .site-guestbook-shell .site-guestbook-actions button {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
}

html[data-site-theme="win98"] .site-guestbook-shell input::placeholder,
html[data-site-theme="win98"] .site-guestbook-shell textarea::placeholder {
    color: #808080 !important;
    -webkit-text-fill-color: #808080 !important;
}

html[data-site-theme="win98"] .site-guestbook-shell .site-guestbook-actions button:disabled {
    color: #808080 !important;
    -webkit-text-fill-color: #808080 !important;
}

html[data-site-theme="win98"] .site-guestbook-shell .site-guestbook-entry-meta,
html[data-site-theme="win98"] .site-guestbook-shell .site-guestbook-entry-meta * {
    color: var(--win98-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-title-text, #ffffff) !important;
}

html[data-site-theme="win98"][data-win98-glass-frost="1"] .glass,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .title-container,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .smp-hero-glass,
html[data-site-theme="win98"][data-win98-glass-frost="1"] body.admin-page .admin-board-shell {
    backdrop-filter: blur(var(--win98-panel-blur, 0px)) saturate(1.12) !important;
    -webkit-backdrop-filter: blur(var(--win98-panel-blur, 0px)) saturate(1.12) !important;
}

html[data-site-theme="win98"][data-win98-glass-frost="1"] .now-playing-card,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .inner-entry,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .carousel-viewport {
    backdrop-filter: blur(var(--win98-sub-blur, 0px)) saturate(1.12) !important;
    -webkit-backdrop-filter: blur(var(--win98-sub-blur, 0px)) saturate(1.12) !important;
}

html[data-site-theme="win98"][data-win98-glass-frost="1"] .player-shell,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .global-player-inner,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .global-player-track-menu,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .global-player-queue-panel,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .global-player-search-wrap {
    backdrop-filter: blur(var(--win98-player-blur, 0px)) saturate(1.12) !important;
    -webkit-backdrop-filter: blur(var(--win98-player-blur, 0px)) saturate(1.12) !important;
}

html[data-site-theme="win98"][data-win98-glass-frost="1"] .glass > .win98-titlebar,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .glass > .box-title,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .smp-hero-glass > .box-title,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .site-widget-title,
html[data-site-theme="win98"][data-win98-glass-frost="1"] .title-container::before {
    backdrop-filter: blur(var(--win98-title-blur, 0px)) saturate(1.12) !important;
    -webkit-backdrop-filter: blur(var(--win98-title-blur, 0px)) saturate(1.12) !important;
}

/* Nav cards (homepage): icon + label left-aligned, small gap between */
html[data-site-theme="win98"] .nav-card > a.glass {
    justify-content: flex-start !important;
    gap: 1rem !important;
}

html[data-site-theme="win98"] .nav-card > a.glass > div:has(.icon-box) {
    margin-right: 0 !important;
}

html[data-site-theme="win98"] .nav-card > a.glass > div.flex.flex-col {
    align-items: flex-start !important;
    text-align: left !important;
}

/* Title bars (homepage injected + SMP existing) sit absolutely at top of box */
html[data-site-theme="win98"] .glass > .win98-titlebar,
html[data-site-theme="win98"] .glass > .box-title {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    margin: 0 !important;
    padding: 3px 6px !important;
    background: linear-gradient(to right, #808080, #c0c0c0) !important;
    color: var(--win98-inactive-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-inactive-title-text, #ffffff) !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
    line-height: 1.45 !important;
    text-align: left !important;
    box-sizing: border-box !important;
    z-index: 1;
    pointer-events: none;
    border: 0 !important;
    box-shadow: none !important;
    font-style: normal !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
}

html[data-site-theme="win98"] .glass:hover > .win98-titlebar,
html[data-site-theme="win98"] .glass:focus-within > .win98-titlebar,
html[data-site-theme="win98"] .glass:hover > .box-title,
html[data-site-theme="win98"] .glass:focus-within > .box-title {
    background: var(--win98-title-bg-local, var(--win98-title-bg, linear-gradient(to right, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0)))) !important;
    color: var(--win98-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-title-text, #ffffff) !important;
}

/* SMP hero bar (.smp-hero-glass > .box-title.smp-hero-bar) — same hover behavior */
html[data-site-theme="win98"] .smp-hero-glass {
    position: relative;
    padding-top: 2.85rem !important;
}

html[data-site-theme="win98"] .smp-hero-glass > .box-title {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    margin: 0 !important;
    padding: 3px 6px !important;
    background: linear-gradient(to right, #808080, #c0c0c0) !important;
    color: var(--win98-inactive-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-inactive-title-text, #ffffff) !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    font-style: normal !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    line-height: 1.45 !important;
    text-align: left !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    z-index: 1;
    pointer-events: none;
    border: 0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

html[data-site-theme="win98"] .smp-hero-glass:hover > .box-title,
html[data-site-theme="win98"] .smp-hero-glass:focus-within > .box-title {
    background: var(--win98-title-bg-local, var(--win98-title-bg, linear-gradient(to right, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0)))) !important;
    color: var(--win98-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-title-text, #ffffff) !important;
}

html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]) .site-widget-card:not(:hover):not(:focus-within) .site-widget-title,
html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]) .win98-desktop-dialog-titlebar:not(:hover):not(:active),
html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]) .glass:not(:hover):not(:focus-within) > .win98-titlebar,
html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]) .glass:not(:hover):not(:focus-within) > .box-title,
html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]) .smp-hero-glass:not(:hover):not(:focus-within) > .box-title,
html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]) .win98-desktop-preview-window-title.is-inactive {
    background:
        linear-gradient(90deg, rgba(192, 192, 192, 0.58), rgba(128, 128, 128, 0.58)),
        var(--win98-title-bg-local, var(--win98-title-bg, linear-gradient(90deg, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0)))) !important;
    color: var(--win98-inactive-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-inactive-title-text, #ffffff) !important;
}

html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]) .title-container:not(:hover):not(:focus-within)::before {
    background-image:
        url("../assets/avatar.png"),
        linear-gradient(90deg, rgba(192, 192, 192, 0.58), rgba(128, 128, 128, 0.58)),
        var(--win98-title-bg-local, var(--win98-title-bg, linear-gradient(90deg, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0)))) !important;
    background-size: 16px 16px, 100% 100%, 100% 100% !important;
    background-position: 7px center, 0 0, 0 0 !important;
    background-repeat: no-repeat, no-repeat, no-repeat !important;
    color: var(--win98-inactive-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-inactive-title-text, #ffffff) !important;
}

/* Rainbow title paint is on ::before — force chrome gradient off even when these rules come later */
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:hover > .win98-titlebar,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:focus-within > .win98-titlebar,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:hover > .box-title,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:focus-within > .box-title,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .smp-hero-glass:hover > .box-title,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .smp-hero-glass:focus-within > .box-title {
    background: transparent !important;
    background-image: none !important;
}

html[data-site-theme="win98"][data-win98-title-rainbow="1"] .title-container::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .title-container:hover::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .title-container:focus-within::before {
    background-color: transparent !important;
    background-image: url("../assets/avatar.png"), linear-gradient(var(--win98-rainbow-title-pastel-overlay), var(--win98-rainbow-title-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-title-scroll-strip) !important;
    background-size: 16px 16px, auto, auto, var(--win98-rainbow-title-bg-size, 800px 100%) !important;
    background-position: 7px center, 0 0, 0 0, 0 0;
    background-repeat: no-repeat, no-repeat, no-repeat, repeat !important;
    animation: var(--win98-rainbow-title-icon-anim-name, win98-rainbow-title-icon-h) var(--win98-rainbow-title-duration, 28s) linear infinite !important;
    animation-play-state: var(--win98-rainbow-title-play-state, running) !important;
    filter: var(--win98-rainbow-effect-filter, none) !important;
}

html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass > .win98-titlebar::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass > .box-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .smp-hero-glass > .box-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .site-widget-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .title-container::before {
    opacity: 0.42 !important;
    transition: opacity 0.18s ease !important;
}

html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:hover > .win98-titlebar::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:focus-within > .win98-titlebar::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:hover > .box-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .glass:focus-within > .box-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .smp-hero-glass:hover > .box-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .smp-hero-glass:focus-within > .box-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .site-widget-card:hover .site-widget-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .site-widget-card:focus-within .site-widget-title::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .title-container:hover::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .title-container:focus-within::before {
    opacity: var(--win98-rainbow-opacity, 1) !important;
}

html[data-site-theme="neon"] .win98-titlebar {
    display: none !important;
}

html[data-site-theme="win98"] .status-chip,
html[data-site-theme="win98"] .theme-toggle,
html[data-site-theme="win98"] .btn-glow,
html[data-site-theme="win98"] .player-btn,
html[data-site-theme="win98"] .playlist-select,
html[data-site-theme="win98"] .game-rotation-cta {
    background: #c0c0c0 !important;
    color: #111 !important;
    border: 2px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
}

/* The label's own rules (and the descendant selector .game-rotation-cta .game-rotation-cta-label)
   force the neon glow color via !important, which beats `color: inherit`. Force readable text on the
   gray Win98 button. */
html[data-site-theme="win98"] .game-rotation-cta,
html[data-site-theme="win98"] .game-rotation-cta:link,
html[data-site-theme="win98"] .game-rotation-cta:visited,
html[data-site-theme="win98"] .game-rotation-cta:hover,
html[data-site-theme="win98"] .game-rotation-cta:focus-visible,
html[data-site-theme="win98"] .game-rotation-cta:active,
html[data-site-theme="win98"] .game-rotation-cta .game-rotation-cta-label {
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;
}

/* Universal Win98 button hover/focus/press behavior — color flips to theme accent + gentle press feedback */
html[data-site-theme="win98"] button,
html[data-site-theme="win98"] .btn-glow,
html[data-site-theme="win98"] .game-rotation-cta,
html[data-site-theme="win98"] .player-btn,
html[data-site-theme="win98"] .playlist-select,
html[data-site-theme="win98"] .global-player-btn,
html[data-site-theme="win98"] .global-player-pill,
html[data-site-theme="win98"] .global-player-toggle-pill,
html[data-site-theme="win98"] .global-player-track-button,
html[data-site-theme="win98"] .global-player-category-chip,
html[data-site-theme="win98"] .global-track-queue-btn,
html[data-site-theme="win98"] .theme-toggle,
html[data-site-theme="win98"] .site-control-toggle,
html[data-site-theme="win98"] a.glass {
    transition: color 0.1s ease, filter 0.1s ease, transform 0.05s ease !important;
}

html[data-site-theme="win98"] button:hover,
html[data-site-theme="win98"] .btn-glow:hover,
html[data-site-theme="win98"] .game-rotation-cta:hover,
html[data-site-theme="win98"] .player-btn:hover,
html[data-site-theme="win98"] .playlist-select:hover,
html[data-site-theme="win98"] .global-player-btn:hover,
html[data-site-theme="win98"] .global-player-pill:hover,
html[data-site-theme="win98"] .global-player-toggle-pill:hover,
html[data-site-theme="win98"] .global-player-category-chip:not(.is-active):hover,
html[data-site-theme="win98"] .global-track-queue-btn:not(.is-active):hover,
html[data-site-theme="win98"] .theme-toggle:hover,
html[data-site-theme="win98"] .site-control-toggle:hover {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    filter: none !important;
}

/* Active (pressed) state: classic Win98 inset offset */
html[data-site-theme="win98"] button:active,
html[data-site-theme="win98"] .btn-glow:active,
html[data-site-theme="win98"] .game-rotation-cta:active,
html[data-site-theme="win98"] .player-btn:active,
html[data-site-theme="win98"] .playlist-select:active,
html[data-site-theme="win98"] .global-player-btn:active,
html[data-site-theme="win98"] .global-player-pill:active,
html[data-site-theme="win98"] .global-player-toggle-pill:active,
html[data-site-theme="win98"] .global-player-category-chip:active,
html[data-site-theme="win98"] .global-track-queue-btn:active,
html[data-site-theme="win98"] .theme-toggle:active,
html[data-site-theme="win98"] .site-control-toggle:active {
    transform: translate(1px, 1px) !important;
    filter: brightness(0.92) !important;
}

html[data-site-theme="win98"] .theme-toggle,
html[data-site-theme="win98"] .btn-glow,
html[data-site-theme="win98"] .player-btn,
html[data-site-theme="win98"] .playlist-select,
html[data-site-theme="win98"] .game-rotation-cta,
html[data-site-theme="win98"] .global-player-btn,
html[data-site-theme="win98"] .global-player-track-button,
html[data-site-theme="win98"] .global-player-category-chip,
html[data-site-theme="win98"] .global-track-queue-btn,
html[data-site-theme="win98"] .nav-card > a {
    transition: none !important;
}

html[data-site-theme="win98"] .theme-toggle:hover,
html[data-site-theme="win98"] .theme-toggle:focus-visible,
html[data-site-theme="win98"] .btn-glow:hover,
html[data-site-theme="win98"] .btn-glow:focus-visible,
html[data-site-theme="win98"] .player-btn:hover,
html[data-site-theme="win98"] .playlist-select:hover,
html[data-site-theme="win98"] .game-rotation-cta:hover {
    transform: none !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .theme-toggle:active,
html[data-site-theme="win98"] .btn-glow:active,
html[data-site-theme="win98"] .player-btn:active,
html[data-site-theme="win98"] .playlist-select:active,
html[data-site-theme="win98"] .game-rotation-cta:active {
    transform: none !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .site-tooltip-host[aria-label]::before,
html[data-site-theme="win98"] .global-player-btn[aria-label]::before,
html[data-site-theme="win98"] .global-player-tooltip-host[aria-label]::before {
    background: #ffffe1 !important;
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;
    border: 1px solid #111 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
    padding: 0.18rem 0.34rem !important;
    line-height: 1.1 !important;
    z-index: 10060 !important;
}

html[data-site-theme="win98"] #gp-show-toggle .global-player-show-tooltip {
    background: #ffffe1 !important;
    color: #111 !important;
    border: 1px solid #111 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
    padding: 0.18rem 0.34rem !important;
}

html[data-site-theme="win98"] .site-control-dock .site-tooltip-host[aria-label]::before {
    background: #ffffe1 !important;
    color: #111 !important;
    border: 1px solid #111 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
    padding: 0.18rem 0.34rem !important;
}

@supports not selector(::-webkit-scrollbar) {
    html[data-site-theme="win98"],
    html[data-site-theme="win98"] body,
    html[data-site-theme="win98"] .custom-scroll,
    html[data-site-theme="win98"] .global-player-track-menu,
    html[data-site-theme="win98"] #gp-track-options,
    html[data-site-theme="win98"] .global-player-queue-list,
    html[data-site-theme="win98"] .global-player-queue-panel {
        scrollbar-width: auto;
        scrollbar-color: var(--win98-scrollbar-face, #c0c0c0) var(--win98-scrollbar-track, #c0c0c0);
    }
}

html[data-site-theme="win98"]::-webkit-scrollbar,
html[data-site-theme="win98"] body::-webkit-scrollbar,
html[data-site-theme="win98"] *::-webkit-scrollbar {
    width: var(--win98-scrollbar-size);
    height: var(--win98-scrollbar-size);
    background: var(--win98-scrollbar-face, #c0c0c0);
}

html[data-site-theme="win98"]::-webkit-scrollbar-track,
html[data-site-theme="win98"] body::-webkit-scrollbar-track,
html[data-site-theme="win98"] *::-webkit-scrollbar-track {
    background-color: var(--win98-scrollbar-track, #c0c0c0);
    background-image: repeating-conic-gradient(var(--win98-scrollbar-track-light, #ffffff) 0% 25%, var(--win98-scrollbar-track, #c0c0c0) 0% 50%);
    background-size: 2px 2px;
}

html[data-site-theme="win98"]::-webkit-scrollbar-thumb,
html[data-site-theme="win98"] body::-webkit-scrollbar-thumb,
html[data-site-theme="win98"] *::-webkit-scrollbar-thumb {
    background-color: var(--win98-scrollbar-face, #c0c0c0);
    border: 2px solid;
    border-image: var(--win98-sb-bdi);
    border-radius: 0;
    min-height: calc(var(--win98-scrollbar-size) * 1.25);
}

html[data-site-theme="win98"]::-webkit-scrollbar-corner,
html[data-site-theme="win98"] body::-webkit-scrollbar-corner,
html[data-site-theme="win98"] *::-webkit-scrollbar-corner {
    background: var(--win98-scrollbar-face, #c0c0c0);
}

html[data-site-theme="win98"]::-webkit-scrollbar-track-piece:active,
html[data-site-theme="win98"] body::-webkit-scrollbar-track-piece:active,
html[data-site-theme="win98"] *::-webkit-scrollbar-track-piece:active {
    background: var(--win98-scrollbar-active, #404040);
}

html[data-site-theme="win98"]::-webkit-scrollbar-button,
html[data-site-theme="win98"] body::-webkit-scrollbar-button,
html[data-site-theme="win98"] *::-webkit-scrollbar-button {
    display: block;
    width: var(--win98-scrollbar-size);
    height: var(--win98-scrollbar-size);
    background-color: var(--win98-scrollbar-face, #c0c0c0);
    border: 2px solid;
    border-image: var(--win98-sb-bdi);
    background-image: var(--win98-sb-sprite);
    background-repeat: no-repeat;
    background-size: calc(4 * var(--win98-scrollbar-size)) calc(2 * var(--win98-scrollbar-size));
    background-origin: border-box;
    background-clip: border-box;
}

html[data-site-theme="win98"]::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"]::-webkit-scrollbar-button:start:increment,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:start:increment,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:start:increment {
    display: none;
}

html[data-site-theme="win98"]::-webkit-scrollbar-button:vertical:decrement,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:vertical:decrement,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:vertical:decrement {
    background-position: 0 0;
}

html[data-site-theme="win98"]::-webkit-scrollbar-button:vertical:increment,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:vertical:increment,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:vertical:increment {
    background-position: calc(-1 * var(--win98-scrollbar-size)) 0;
}

html[data-site-theme="win98"]::-webkit-scrollbar-button:horizontal:decrement,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:horizontal:decrement,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:horizontal:decrement {
    background-position: calc(-2 * var(--win98-scrollbar-size)) 0;
}

html[data-site-theme="win98"]::-webkit-scrollbar-button:horizontal:increment,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:horizontal:increment,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:horizontal:increment {
    background-position: calc(-3 * var(--win98-scrollbar-size)) 0;
}

html[data-site-theme="win98"]::-webkit-scrollbar-button:vertical:active,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:vertical:active,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:vertical:active,
html[data-site-theme="win98"]::-webkit-scrollbar-button:horizontal:active,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:horizontal:active,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:horizontal:active {
    border: 1px solid #808080;
    background-position-y: 1px;
}

html[data-site-theme="win98"]::-webkit-scrollbar-button:vertical:decrement:active,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:vertical:decrement:active,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:vertical:decrement:active { background-position-x: 1px; }
html[data-site-theme="win98"]::-webkit-scrollbar-button:vertical:increment:active,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:vertical:increment:active,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:vertical:increment:active { background-position-x: calc(var(--win98-scrollbar-size) * -15 / 16); }
html[data-site-theme="win98"]::-webkit-scrollbar-button:horizontal:decrement:active,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:horizontal:decrement:active,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:horizontal:decrement:active { background-position-x: calc(var(--win98-scrollbar-size) * -31 / 16); }
html[data-site-theme="win98"]::-webkit-scrollbar-button:horizontal:increment:active,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:horizontal:increment:active,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:horizontal:increment:active { background-position-x: calc(var(--win98-scrollbar-size) * -47 / 16); }

html[data-site-theme="win98"]::-webkit-scrollbar-button:vertical:disabled,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:vertical:disabled,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:vertical:disabled { background-position-y: calc(-1 * var(--win98-scrollbar-size)); }
html[data-site-theme="win98"]::-webkit-scrollbar-button:horizontal:disabled,
html[data-site-theme="win98"] body::-webkit-scrollbar-button:horizontal:disabled,
html[data-site-theme="win98"] *::-webkit-scrollbar-button:horizontal:disabled { background-position-y: calc(-1 * var(--win98-scrollbar-size)); }

.win98-desktop-dialog {
    --win98-scrollbar-size: 18px;
    --win98-scrollbar-face: #c0c0c0;
    --win98-scrollbar-track: #c0c0c0;
    --win98-scrollbar-track-light: #ffffff;
    --win98-scrollbar-active: #404040;
}

/* Intentionally omitting `scrollbar-width` / `scrollbar-color` here.
   In Chrome 121+ either declaration activates the CSS Scrollbars Module standard
   scrollbar and disables the `::-webkit-scrollbar-*` pseudo-elements below,
   stripping the Win98 bevel, sprite arrows, and checkered track. */

.win98-desktop-dialog-body::-webkit-scrollbar,
.win98-dialog-pages::-webkit-scrollbar {
    width: var(--win98-scrollbar-size);
    height: var(--win98-scrollbar-size);
    background: var(--win98-scrollbar-face, #c0c0c0);
}

.win98-desktop-dialog-body::-webkit-scrollbar-track,
.win98-dialog-pages::-webkit-scrollbar-track {
    background-color: var(--win98-scrollbar-track, #c0c0c0);
    background-image: repeating-conic-gradient(var(--win98-scrollbar-track-light, #ffffff) 0% 25%, var(--win98-scrollbar-track, #c0c0c0) 0% 50%);
    background-size: 2px 2px;
}

.win98-desktop-dialog-body::-webkit-scrollbar-thumb,
.win98-dialog-pages::-webkit-scrollbar-thumb {
    background-color: var(--win98-scrollbar-face, #c0c0c0);
    border: 2px solid;
    border-image: var(--win98-sb-bdi);
    border-radius: 0;
    min-height: calc(var(--win98-scrollbar-size) * 1.25);
}

.win98-desktop-dialog-body::-webkit-scrollbar-corner,
.win98-dialog-pages::-webkit-scrollbar-corner {
    background: var(--win98-scrollbar-face, #c0c0c0);
}

.win98-desktop-dialog-body::-webkit-scrollbar-track-piece:active,
.win98-dialog-pages::-webkit-scrollbar-track-piece:active {
    background: var(--win98-scrollbar-active, #404040);
}

.win98-desktop-dialog-body::-webkit-scrollbar-button,
.win98-dialog-pages::-webkit-scrollbar-button {
    display: block;
    width: var(--win98-scrollbar-size);
    height: var(--win98-scrollbar-size);
    background-color: var(--win98-scrollbar-face, #c0c0c0);
    border: 2px solid;
    border-image: var(--win98-sb-bdi);
    background-image: var(--win98-sb-sprite);
    background-repeat: no-repeat;
    background-size: calc(4 * var(--win98-scrollbar-size)) calc(2 * var(--win98-scrollbar-size));
    background-origin: border-box;
    background-clip: border-box;
}

.win98-desktop-dialog-body::-webkit-scrollbar-button:end:decrement,
.win98-dialog-pages::-webkit-scrollbar-button:end:decrement,
.win98-desktop-dialog-body::-webkit-scrollbar-button:start:increment,
.win98-dialog-pages::-webkit-scrollbar-button:start:increment {
    display: none;
}

.win98-desktop-dialog-body::-webkit-scrollbar-button:vertical:decrement,
.win98-dialog-pages::-webkit-scrollbar-button:vertical:decrement {
    background-position: 0 0;
}

.win98-desktop-dialog-body::-webkit-scrollbar-button:vertical:increment,
.win98-dialog-pages::-webkit-scrollbar-button:vertical:increment {
    background-position: calc(-1 * var(--win98-scrollbar-size)) 0;
}

.win98-desktop-dialog-body::-webkit-scrollbar-button:horizontal:decrement,
.win98-dialog-pages::-webkit-scrollbar-button:horizontal:decrement {
    background-position: calc(-2 * var(--win98-scrollbar-size)) 0;
}

.win98-desktop-dialog-body::-webkit-scrollbar-button:horizontal:increment,
.win98-dialog-pages::-webkit-scrollbar-button:horizontal:increment {
    background-position: calc(-3 * var(--win98-scrollbar-size)) 0;
}

.win98-desktop-dialog-body::-webkit-scrollbar-button:vertical:active,
.win98-dialog-pages::-webkit-scrollbar-button:vertical:active,
.win98-desktop-dialog-body::-webkit-scrollbar-button:horizontal:active,
.win98-dialog-pages::-webkit-scrollbar-button:horizontal:active {
    border: 1px solid #808080;
    background-position-y: 1px;
}

.win98-desktop-dialog-body::-webkit-scrollbar-button:vertical:decrement:active,
.win98-dialog-pages::-webkit-scrollbar-button:vertical:decrement:active { background-position-x: 1px; }
.win98-desktop-dialog-body::-webkit-scrollbar-button:vertical:increment:active,
.win98-dialog-pages::-webkit-scrollbar-button:vertical:increment:active { background-position-x: calc(var(--win98-scrollbar-size) * -15 / 16); }
.win98-desktop-dialog-body::-webkit-scrollbar-button:horizontal:decrement:active,
.win98-dialog-pages::-webkit-scrollbar-button:horizontal:decrement:active { background-position-x: calc(var(--win98-scrollbar-size) * -31 / 16); }
.win98-desktop-dialog-body::-webkit-scrollbar-button:horizontal:increment:active,
.win98-dialog-pages::-webkit-scrollbar-button:horizontal:increment:active { background-position-x: calc(var(--win98-scrollbar-size) * -47 / 16); }

.win98-desktop-dialog-body::-webkit-scrollbar-button:vertical:disabled,
.win98-dialog-pages::-webkit-scrollbar-button:vertical:disabled,
.win98-desktop-dialog-body::-webkit-scrollbar-button:horizontal:disabled,
.win98-dialog-pages::-webkit-scrollbar-button:horizontal:disabled { background-position-y: calc(-1 * var(--win98-scrollbar-size)); }

html[data-site-theme="win98"] .win98-desktop-dialog,
html[data-site-theme="win98"] .win98-desktop-dialog * {
    --win98-scrollbar-face: #c0c0c0;
    --win98-scrollbar-track: #c0c0c0;
    --win98-scrollbar-track-light: #ffffff;
    --win98-scrollbar-active: #404040;
}

/* See note above: setting `scrollbar-color` here would disable the Win98
   `::-webkit-scrollbar-*` chrome on `.win98-dialog-pages` in Chrome 121+. */

html[data-site-theme="win98"] .status-chip-dot {
    background: var(--win98-status-dot);
    box-shadow: none;
}

html[data-site-theme="win98"] #game-rotation-panel .status-chip-dot {
    background: #008000 !important;
}

html[data-site-theme="win98"] .icon-box {
    background-color: #111;
}

html[data-site-theme="win98"] .nav-stack > h2,
html[data-site-theme="win98"] #game-rotation-panel .space-y-2 p,
html[data-site-theme="win98"] #what-im-feeling-copy {
    color: var(--win98-text-muted, #333) !important;
}

html[data-site-theme="win98"] #game-rotation-panel > div > div:first-child h3 {
    color: var(--win98-text, #111) !important;
    -webkit-text-fill-color: var(--win98-text, #111) !important;
}

html[data-site-theme="win98"] .now-playing-card > span,
html[data-site-theme="win98"] #main-current-platform {
    color: var(--win98-sub-text-muted, var(--win98-sub-text, #333)) !important;
    -webkit-text-fill-color: var(--win98-sub-text-muted, var(--win98-sub-text, #333)) !important;
}

html[data-site-theme="win98"] #game-rotation-panel .now-playing-card > span {
    color: var(--win98-sub-text, var(--win98-text, #111)) !important;
    -webkit-text-fill-color: var(--win98-sub-text, var(--win98-text, #111)) !important;
}

html[data-site-theme="win98"] #main-current-game,
html[data-site-theme="win98"] #game-rotation-panel .space-y-2 > h3 {
    color: var(--win98-sub-text, var(--win98-text, #111)) !important;
    -webkit-text-fill-color: var(--win98-sub-text, var(--win98-text, #111)) !important;
    font-style: normal !important;
    letter-spacing: 0.01em !important;
    text-shadow: none !important;
}

html[data-site-theme="win98"] .nav-card > a > div:has(.icon-box) {
    margin-right: 0 !important;
    padding: 0.55rem !important;
    background: #c0c0c0 !important;
    border: 2px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .nav-card > a > div.flex.flex-col > div:nth-child(1) {
    font-size: 1.35rem !important;
    font-style: normal !important;
    letter-spacing: 0.01em !important;
    line-height: 1.1 !important;
    color: var(--win98-text, #111) !important;
    -webkit-text-fill-color: var(--win98-text, #111) !important;
}

html[data-site-theme="win98"] .nav-card > a > div.flex.flex-col > div:nth-child(2) {
    color: var(--win98-text-muted, var(--win98-text, #444)) !important;
    -webkit-text-fill-color: var(--win98-text-muted, var(--win98-text, #444)) !important;
    font-size: 0.78rem !important;
    margin-top: 0.2rem !important;
}

html[data-site-theme="win98"] .nav-card > a:hover,
html[data-site-theme="win98"] .nav-card > a:focus-visible {
    transform: none !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .nav-card > a:active {
    transform: none !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .nav-card > a:active > div:has(.icon-box) {
    border-color: #808080 #ffffff #ffffff #808080 !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .carousel-viewport {
    background: var(--win98-sub-bg, #bdbdbd) !important;
    border: 2px solid !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    box-shadow: inset -1px -1px 0 #dfdfdf, inset 1px 1px 0 #000000 !important;
    padding: 0.9rem 0.25rem !important;
    border-radius: 0 !important;
    cursor: var(--win98-cursor-default) !important;
}

html[data-site-theme="win98"] .poster-box {
    width: 116px;
    height: 142px;
    padding: 2rem 0.7rem 0.8rem;
    background: linear-gradient(90deg, #808080, #c0c0c0) 0 0 / 100% 1.35rem no-repeat, #c0c0c0 !important;
    border: 2px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"][data-win98-title-rainbow="1"] .poster-box {
    isolation: isolate;
}

html[data-site-theme="win98"][data-win98-title-rainbow="1"] .poster-box::before {
    --win98-rainbow-shift-x: var(--win98-rainbow-title-shift-x, -224px);
    --win98-rainbow-shift-y: var(--win98-rainbow-title-shift-y, 0px);
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    right: 0 !important;
    height: 1.35rem !important;
    z-index: 1 !important;
    pointer-events: none !important;
    background-image: linear-gradient(var(--win98-rainbow-title-pastel-overlay), var(--win98-rainbow-title-pastel-overlay)), linear-gradient(var(--win98-rainbow-tint), var(--win98-rainbow-tint)), var(--win98-rainbow-title-scroll-strip) !important;
    background-repeat: repeat !important;
    background-size: var(--win98-rainbow-title-bg-size, 800px 100%) !important;
    animation: var(--win98-rainbow-title-anim-name, win98-rainbow-h) var(--win98-rainbow-title-duration, 28s) linear infinite;
    animation-play-state: var(--win98-rainbow-title-play-state, running);
    filter: var(--win98-rainbow-effect-filter, none);
    opacity: 0.42;
    transition: opacity 0.18s ease;
}

html[data-site-theme="win98"] .poster-box::after {
    display: none !important;
}

html[data-site-theme="win98"] .poster-box > span:first-child {
    top: 0.2rem !important;
    right: 0.3rem !important;
    background: transparent !important;
    color: var(--win98-title-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-title-text, #ffffff) !important;
    text-shadow: none !important;
    opacity: 1 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0.1rem 0.25rem !important;
    font-size: 6px !important;
    letter-spacing: 0.08em !important;
}

html[data-site-theme="win98"] .poster-title {
    color: var(--win98-sub-text, var(--win98-text, #111)) !important;
    -webkit-text-fill-color: var(--win98-sub-text, var(--win98-text, #111)) !important;
    text-shadow: none !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
    letter-spacing: 0.02em !important;
}

html[data-site-theme="win98"] .game-card,
html[data-site-theme="win98"] .poster-box,
html[data-site-theme="win98"] .poster-title {
    transition: none !important;
}

html[data-site-theme="win98"] .game-card:hover .poster-box,
html[data-site-theme="win98"] .game-card:focus-within .poster-box {
    transform: none !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    background: var(--win98-title-bg-local, var(--win98-title-bg, linear-gradient(90deg, var(--win98-title-start, #000080), var(--win98-title-end, #1084d0)))) 0 0 / 100% 1.35rem no-repeat, #c0c0c0 !important;
}

html[data-site-theme="win98"][data-win98-title-rainbow="1"] .game-card:hover .poster-box::before,
html[data-site-theme="win98"][data-win98-title-rainbow="1"] .game-card:focus-within .poster-box::before {
    opacity: var(--win98-rainbow-opacity, 1);
}

html[data-site-theme="win98"] .game-card:hover .poster-title {
    color: var(--win98-sub-text, var(--win98-text, #111)) !important;
    -webkit-text-fill-color: var(--win98-sub-text, var(--win98-text, #111)) !important;
}

html[data-site-theme="win98"] .now-playing-card {
    border-color: #808080 #ffffff #ffffff #808080 !important;
    box-shadow: inset -1px -1px 0 #dfdfdf, inset 1px 1px 0 #000000 !important;
}

html[data-site-theme="win98"] #game-rotation-panel .flex.flex-wrap.gap-2 > span {
    background: #c0c0c0 !important;
    color: #111 !important;
    border: 2px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .game-rotation-cta::after {
    display: none !important;
}

html[data-site-theme="win98"] .global-player {
    animation: none !important;
    --gp-color: var(--win98-title-start) !important;
}

html[data-site-theme="win98"] .global-player-inner,
html[data-site-theme="win98"] .global-player-track-menu,
html[data-site-theme="win98"] .global-player-queue-panel,
html[data-site-theme="win98"] .global-player-search-wrap {
    background: var(--win98-player-bg, #c0c0c0) !important;
    color: var(--win98-player-text, var(--win98-text, #111)) !important;
    border: 2px solid #ffffff !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    border-radius: 0 !important;
    border-top: 2px solid #ffffff !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    filter: none !important;
}

html[data-site-theme="win98"] .global-player-inner,
html[data-site-theme="win98"] .global-player-shell,
html[data-site-theme="win98"] .global-player-title,
html[data-site-theme="win98"] .global-player-subtitle,
html[data-site-theme="win98"] .global-player-status,
html[data-site-theme="win98"] .global-player-kicker,
html[data-site-theme="win98"] .global-player-pill,
html[data-site-theme="win98"] .global-player-volume-caption,
html[data-site-theme="win98"] .global-player-volume-edge {
    color: var(--win98-player-text, var(--win98-text, #111)) !important;
}

/* Track picker popup — text color follows the music-player text variable so the list
   stays readable when the user picks a dark player background or smart-dark gradient. */
html[data-site-theme="win98"] .global-track-option .global-track-title,
html[data-site-theme="win98"] .global-track-option .global-track-main {
    color: var(--win98-player-text, #111) !important;
}

html[data-site-theme="win98"] .global-track-option .global-track-artist,
html[data-site-theme="win98"] .global-track-option .global-track-option-index {
    color: var(--win98-player-text-muted, var(--win98-player-text, #444)) !important;
    opacity: 0.78;
}

html[data-site-theme="win98"] .global-track-option.is-active,
html[data-site-theme="win98"] .global-track-option:hover {
    background: var(--win98-title-start, #000080) !important;
}

html[data-site-theme="win98"] .global-track-option.is-active .global-track-title,
html[data-site-theme="win98"] .global-track-option.is-active .global-track-main,
html[data-site-theme="win98"] .global-track-option.is-active .global-track-artist,
html[data-site-theme="win98"] .global-track-option.is-active .global-track-option-index,
html[data-site-theme="win98"] .global-track-option:hover .global-track-title,
html[data-site-theme="win98"] .global-track-option:hover .global-track-main,
html[data-site-theme="win98"] .global-track-option:hover .global-track-artist,
html[data-site-theme="win98"] .global-track-option:hover .global-track-option-index {
    color: var(--win98-title-on-player-text, var(--win98-title-text, #ffffff)) !important;
    -webkit-text-fill-color: var(--win98-title-on-player-text, var(--win98-title-text, #ffffff)) !important;
    opacity: 1;
}

html[data-site-theme="win98"] .global-player-inner::before {
    display: none !important;
}

html[data-site-theme="win98"] .global-player-shell {
    opacity: 1 !important;
    filter: none !important;
}

html[data-site-theme="win98"] .global-player-bar {
    grid-template-columns: minmax(0, 220px) minmax(430px, 560px) minmax(300px, max-content) !important;
    justify-content: center !important;
    gap: 10px !important;
}

html[data-site-theme="win98"] .global-player-center {
    grid-template-columns: auto minmax(280px, 420px) !important;
    justify-content: center !important;
    gap: 8px !important;
}

html[data-site-theme="win98"] .global-player-right {
    gap: 8px !important;
    justify-content: flex-start !important;
    padding-left: 6px !important;
    border-left: 0 !important;
}

@media (max-width: 1380px) {
    html[data-site-theme="win98"] .global-player-bar {
        grid-template-columns: minmax(0, 190px) minmax(360px, 470px) minmax(260px, max-content) !important;
        justify-content: center !important;
    }

    html[data-site-theme="win98"] .global-player-volume-area {
        width: 220px !important;
        flex-basis: 220px !important;
    }

    html[data-site-theme="win98"] .global-player-track-picker {
        width: 170px !important;
        flex-basis: 170px !important;
    }
}

@media (max-width: 1140px) {
    html[data-site-theme="win98"] .global-player-bar {
        grid-template-columns: 1fr !important;
    }

    html[data-site-theme="win98"] .global-player-right {
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        padding-left: 0 !important;
    }

    html[data-site-theme="win98"] .global-player-volume-area {
        width: 282px !important;
        flex: 0 0 282px !important;
    }

    html[data-site-theme="win98"] .global-player-track-picker {
        width: auto !important;
        flex: 1 1 220px !important;
    }
}

html[data-site-theme="win98"] .global-player-title,
html[data-site-theme="win98"] .global-player-subtitle,
html[data-site-theme="win98"] .global-player-status,
html[data-site-theme="win98"] .global-player-kicker,
html[data-site-theme="win98"] .global-player-queue-item-title,
html[data-site-theme="win98"] .global-player-queue-item-artist,
html[data-site-theme="win98"] .global-player-time-row,
html[data-site-theme="win98"] .global-player-search::placeholder {
    color: var(--win98-player-text, #111) !important;
    -webkit-text-fill-color: var(--win98-player-text, #111) !important;
}

html[data-site-theme="win98"] .global-player-time-row {
    font-weight: 400 !important;
}

html[data-site-theme="win98"] .global-player-time-row,
html[data-site-theme="win98"] .global-player-time-row *,
html[data-site-theme="win98"] .global-player-volume-caption,
html[data-site-theme="win98"] .global-player-volume-edge {
    color: var(--win98-chip-text, #111111) !important;
    -webkit-text-fill-color: var(--win98-chip-text, #111111) !important;
}

html[data-site-theme="win98"] .global-player-left .global-player-kicker,
html[data-site-theme="win98"] .global-player-left .global-player-status,
html[data-site-theme="win98"] .global-player-left .global-player-title,
html[data-site-theme="win98"] .global-player-left .global-player-subtitle {
    color: var(--win98-chip-text, #111111) !important;
    -webkit-text-fill-color: var(--win98-chip-text, #111111) !important;
}

html[data-site-theme="win98"] .global-player-btn,
html[data-site-theme="win98"] .global-player-pill,
html[data-site-theme="win98"] .global-player-volume-pill,
html[data-site-theme="win98"] .global-player-search,
html[data-site-theme="win98"] .global-player-category-chip {
    background: #c0c0c0 !important;
    color: var(--win98-chip-text, #111) !important;
    -webkit-text-fill-color: var(--win98-chip-text, #111) !important;
    border: 2px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .global-player-btn:hover,
html[data-site-theme="win98"] .global-player-category-chip:hover {
    transform: none !important;
    background: #c0c0c0 !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .global-player-btn:active,
html[data-site-theme="win98"] .global-player-category-chip:active {
    transform: none !important;
    background: #c0c0c0 !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .global-player-btn.is-active,
html[data-site-theme="win98"] .global-player-btn.is-active:hover,
html[data-site-theme="win98"] .global-player-btn.is-active:focus-visible,
html[data-site-theme="win98"] .global-player-toggle-pill.is-active,
html[data-site-theme="win98"] .global-player-toggle-pill.is-active:hover,
html[data-site-theme="win98"] .global-player-toggle-pill.is-active:focus-visible,
html[data-site-theme="win98"] #gp-queue-pill[aria-expanded="true"] {
    transform: translate(1px, 1px) !important;
    background: #c0c0c0 !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .global-player-controls .global-player-btn,
html[data-site-theme="win98"] .global-player-controls .global-player-btn *,
html[data-site-theme="win98"] .global-player-controls .global-player-btn svg,
html[data-site-theme="win98"] .global-player-controls .global-player-btn svg * {
    color: var(--win98-player-control-text, #111111) !important;
    -webkit-text-fill-color: var(--win98-player-control-text, #111111) !important;
    fill: var(--win98-player-control-text, #111111) !important;
    stroke: var(--win98-player-control-text, #111111) !important;
}

html[data-site-theme="win98"] .global-player-track-picker {
    width: 200px !important;
    flex: 0 1 200px !important;
}

html[data-site-theme="win98"] .global-player-track-button {
    min-height: 24px !important;
    padding: 2px 1px 2px 5px !important;
    background: #ffffff !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    border: 1px solid !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    border-radius: 0 !important;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf !important;
    align-items: stretch !important;
    gap: 0 !important;
}

html[data-site-theme="win98"] .global-player-track-button:hover,
html[data-site-theme="win98"] .global-player-track-button:focus-visible {
    background: #ffffff !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    outline: 1px dotted #000000 !important;
    outline-offset: -4px !important;
}

html[data-site-theme="win98"] .global-player-track-button.is-open,
html[data-site-theme="win98"] .global-player-track-button.is-open:hover,
html[data-site-theme="win98"] .global-player-track-button.is-open:focus-visible {
    transform: none !important;
    background: #ffffff !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .global-player-track-button:active {
    transform: none !important;
    background: #ffffff !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .global-player-track-label {
    display: flex;
    align-items: center;
    min-width: 0;
    padding-right: 0.35rem;
    font-size: 12px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}

html[data-site-theme="win98"] .global-player-track-chevron {
    width: 18px !important;
    height: auto !important;
    min-height: 100%;
    margin-left: 5px !important;
    border: 1px solid !important;
    border-color: #ffffff #404040 #404040 #ffffff !important;
    border-radius: 0 !important;
    background: #c0c0c0 !important;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
    color: #111 !important;
    position: relative !important;
}

html[data-site-theme="win98"] .global-player-track-chevron svg {
    display: none !important;
}

html[data-site-theme="win98"] .global-player-track-chevron::before {
    content: "" !important;
    width: 8px !important;
    height: 5px !important;
    background: #000000 !important;
    border: 0 !important;
    clip-path: polygon(0 0, 100% 0, 50% 100%) !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
}

html[data-site-theme="win98"] .global-player-track-menu {
    padding: 4px !important;
    overflow: hidden !important;
    resize: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

html[data-site-theme="win98"] .global-player-search-wrap {
    display: block !important;
    padding: 4px !important;
    background: #c0c0c0 !important;
    border: 2px solid !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

html[data-site-theme="win98"] .global-player-filter-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

html[data-site-theme="win98"] .global-player-search {
    min-height: 23px !important;
    padding: 0.18rem 0.38rem !important;
    background: #ffffff !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

html[data-site-theme="win98"] .global-player-search::placeholder {
    color: #444 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    opacity: 1 !important;
}

html[data-site-theme="win98"] .global-player-category-chips {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    padding: 0 !important;
    overflow: visible !important;
    max-height: none !important;
}

html[data-site-theme="win98"] #gp-track-options {
    padding: 0 !important;
    background: #ffffff !important;
    border: 1px solid #808080 !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
}

html[data-site-theme="win98"] .global-track-option {
    grid-template-columns: minmax(0, 1fr) 18px 26px !important;
    gap: 6px !important;
    padding: 0.18rem 0.28rem !important;
    border-radius: 0 !important;
    min-height: 22px;
    background: #ffffff !important;
}

html[data-site-theme="win98"] .global-track-queue-btn {
    display: inline-flex !important;
    width: 18px !important;
    height: 18px !important;
    border-radius: 0 !important;
    border: 2px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    background: #c0c0c0 !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    color: #111 !important;
}

html[data-site-theme="win98"] .global-track-queue-btn:hover,
html[data-site-theme="win98"] .global-track-queue-btn:focus-visible {
    transform: none !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    outline: none !important;
}

html[data-site-theme="win98"] .global-track-queue-btn:active {
    transform: none !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .global-track-queue-btn.is-active {
    background: var(--win98-title-start) !important;
    color: var(--win98-title-on-player-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-title-on-player-text, #ffffff) !important;
    transform: translate(1px, 1px) !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .global-track-option-index {
    display: inline-flex !important;
    min-height: 18px !important;
    justify-content: flex-end !important;
    color: #555 !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
}

html[data-site-theme="win98"] .global-track-main {
    gap: 1px !important;
}

html[data-site-theme="win98"] .global-track-title {
    font-size: 12px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: #111 !important;
}

html[data-site-theme="win98"] .global-track-artist {
    font-size: 10px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: #444 !important;
}

html[data-site-theme="win98"] .global-player-slider-fill {
    background: var(--win98-title-start) !important;
    box-shadow: none !important;
}

html[data-site-theme="win98"] .global-player-slider-track {
    background: #7f7f7f !important;
}

html[data-site-theme="win98"] .global-player-slider::-webkit-slider-thumb {
    background: #c0c0c0 !important;
    border: 1px solid #111 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

html[data-site-theme="win98"] .global-player-slider::-moz-range-thumb {
    background: #c0c0c0 !important;
    border: 1px solid #111 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

html[data-site-theme="win98"] .global-player-category-chip {
    min-height: 22px !important;
    padding: 0.2rem 0.5rem !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

html[data-site-theme="win98"] .global-player-category-chip.is-active {
    background: var(--win98-title-start) !important;
    color: var(--win98-title-on-player-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-title-on-player-text, #ffffff) !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .global-player-category-chip.is-active:hover,
html[data-site-theme="win98"] .global-player-category-chip.is-active:focus-visible {
    color: var(--win98-title-on-player-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-title-on-player-text, #ffffff) !important;
}

html[data-site-theme="win98"] .global-player-category-chip:hover,
html[data-site-theme="win98"] .global-player-category-chip:focus-visible {
    color: #111 !important;
    transform: none !important;
    outline: none !important;
}

html[data-site-theme="win98"] .global-player-volume-area {
    width: 240px !important;
    flex: 0 0 240px !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 6px !important;
}

html[data-site-theme="win98"] .global-player-progress {
    position: relative !important;
    align-self: center !important;
    overflow: visible !important;
}

html[data-site-theme="win98"] .global-player-progress .global-player-time-row {
    position: absolute !important;
    top: 18px !important;
    left: 0 !important;
    right: 0 !important;
    margin-top: 0 !important;
}

html[data-site-theme="win98"] .global-player-volume-caption,
html[data-site-theme="win98"] .global-player-volume-edge {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 400;
    color: #111;
}

html[data-site-theme="win98"] .global-player-volume-caption {
    margin-right: 1px;
}

html[data-site-theme="win98"] #gp-volume-area .global-player-slider-wrap {
    height: 18px !important;
}

html[data-site-theme="win98"] #gp-volume-area .global-player-slider-track {
    height: 2px !important;
    background: #111 !important;
}

html[data-site-theme="win98"] .global-player-progress .global-player-slider-wrap {
    height: 18px !important;
}

html[data-site-theme="win98"] .global-player-progress .global-player-slider-track {
    height: 2px !important;
    background: #111 !important;
}

html[data-site-theme="win98"] #gp-volume-fill,
html[data-site-theme="win98"] #gp-progress-fill {
    display: none !important;
}

html[data-site-theme="win98"] #gp-volume.global-player-slider::-webkit-slider-thumb,
html[data-site-theme="win98"] #gp-progress.global-player-slider::-webkit-slider-thumb {
    width: 11px !important;
    height: 22px !important;
    margin-top: -10px !important;
    background: #c0c0c0 !important;
    border: 1px solid #111 !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #ffffff !important;
}

html[data-site-theme="win98"] #gp-volume.global-player-slider::-moz-range-thumb,
html[data-site-theme="win98"] #gp-progress.global-player-slider::-moz-range-thumb {
    width: 11px !important;
    height: 22px !important;
    background: #c0c0c0 !important;
    border: 1px solid #111 !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #ffffff !important;
}

html[data-site-theme="win98"] .global-player-volume-input {
    display: block !important;
    width: 46px !important;
    min-width: 46px !important;
    height: 22px !important;
    padding: 0 3px !important;
    background: #ffffff !important;
    color: #111 !important;
    border: 2px solid !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    text-align: center !important;
}

/* FX visualizer toggle remains visible in Win98 too */

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar {
    width: var(--win98-scrollbar-size) !important;
    height: var(--win98-scrollbar-size) !important;
    background-color: #c0c0c0 !important;
    background-image: repeating-conic-gradient(#ffffff 0% 25%, #c0c0c0 0% 50%) !important;
    background-size: 2px 2px !important;
    background-position: 0 0 !important;
    background-repeat: repeat !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-track,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-track,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-track,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-track {
    background-color: #c0c0c0 !important;
    background-image: repeating-conic-gradient(#ffffff 0% 25%, #c0c0c0 0% 50%) !important;
    background-size: 2px 2px !important;
    background-position: 0 0 !important;
    background-repeat: repeat !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-track-piece,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-track-piece,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-track-piece,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-track-piece,
html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-track-piece:hover,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-track-piece:hover,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-track-piece:hover,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-track-piece:hover,
html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-track-piece:active,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-track-piece:active,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-track-piece:active,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-track-piece:active {
    background-color: #c0c0c0 !important;
    background-image: repeating-conic-gradient(#ffffff 0% 25%, #c0c0c0 0% 50%) !important;
    background-size: 2px 2px !important;
    box-shadow: none !important;
    filter: none !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-thumb,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-thumb,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-thumb,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-thumb {
    background: #c0c0c0 !important;
    border: 2px solid !important;
    border-image: var(--win98-sb-bdi) !important;
    border-radius: 0 !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-button,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-button,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-button,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-button {
    display: block !important;
    width: var(--win98-scrollbar-size) !important;
    height: var(--win98-scrollbar-size) !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-button:hover,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-button:hover,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-button:hover,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-button:hover,
html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-button:active,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-button:active,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-button:active,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-button:active {
    background-color: #c0c0c0 !important;
    box-shadow: none !important;
    filter: none !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-button:start:increment,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-button:start:increment,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-button:start:increment,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-button:start:increment {
    display: none !important;
}

@supports not selector(::-webkit-scrollbar) {
    html[data-site-theme="win98"] .global-player-track-menu,
    html[data-site-theme="win98"] #gp-track-options,
    html[data-site-theme="win98"] .global-player-category-chips,
    html[data-site-theme="win98"] .global-player-queue-list {
        scrollbar-width: auto !important;
        scrollbar-color: #c0c0c0 #c0c0c0 !important;
    }
}

html[data-site-theme="win98"],
html[data-site-theme="win98"] *,
html[data-site-theme="win98"] *::before,
html[data-site-theme="win98"] *::after,
html[data-site-theme="win98"]::-webkit-scrollbar,
html[data-site-theme="win98"]::-webkit-scrollbar-track,
html[data-site-theme="win98"]::-webkit-scrollbar-thumb,
html[data-site-theme="win98"]::-webkit-scrollbar-button,
html[data-site-theme="win98"]::-webkit-scrollbar-corner {
    cursor: var(--win98-cursor-default) !important;
}

html[data-site-theme="win98"] button,
html[data-site-theme="win98"] button *,
html[data-site-theme="win98"] a[href],
html[data-site-theme="win98"] a[href] *,
html[data-site-theme="win98"] .theme-toggle,
html[data-site-theme="win98"] .theme-toggle *,
html[data-site-theme="win98"] .player-btn,
html[data-site-theme="win98"] .player-btn *,
html[data-site-theme="win98"] .playlist-select,
html[data-site-theme="win98"] .glass a,
html[data-site-theme="win98"] .glass a *,
html[data-site-theme="win98"] .nav-card > a,
html[data-site-theme="win98"] .nav-card > a *,
html[data-site-theme="win98"] .global-player-btn,
html[data-site-theme="win98"] .global-player-btn *,
html[data-site-theme="win98"] .global-player-value-pill,
html[data-site-theme="win98"] .global-player-value-pill *,
html[data-site-theme="win98"] .global-player-pill,
html[data-site-theme="win98"] .global-player-pill *,
html[data-site-theme="win98"] .global-player-toggle-pill,
html[data-site-theme="win98"] .global-player-toggle-pill *,
html[data-site-theme="win98"] .global-track-option,
html[data-site-theme="win98"] .global-track-option *,
html[data-site-theme="win98"] .global-track-queue-btn,
html[data-site-theme="win98"] .global-track-queue-btn *,
html[data-site-theme="win98"] .global-player-track-button,
html[data-site-theme="win98"] .global-player-track-button *,
html[data-site-theme="win98"] .global-player-category-chip,
html[data-site-theme="win98"] .global-player-category-chip *,
html[data-site-theme="win98"] [role="button"],
html[data-site-theme="win98"] [role="button"] *,
html[data-site-theme="win98"] [tabindex]:not([tabindex="-1"]),
html[data-site-theme="win98"] [tabindex]:not([tabindex="-1"]) *,
html[data-site-theme="win98"] summary,
html[data-site-theme="win98"] summary *,
html[data-site-theme="win98"] label[for],
html[data-site-theme="win98"] label[for] * {
    cursor: var(--win98-cursor-pointer) !important;
}

html[data-site-theme="win98"] abbr[title],
html[data-site-theme="win98"] [data-help],
html[data-site-theme="win98"] .help,
html[data-site-theme="win98"] .is-help {
    cursor: var(--win98-cursor-help) !important;
}

html[data-site-theme="win98"] input[type="text"],
html[data-site-theme="win98"] input[type="search"],
html[data-site-theme="win98"] input[type="number"],
html[data-site-theme="win98"] input[type="email"],
html[data-site-theme="win98"] input[type="password"],
html[data-site-theme="win98"] input[type="tel"],
html[data-site-theme="win98"] input[type="url"],
html[data-site-theme="win98"] input:not([type]),
html[data-site-theme="win98"] [contenteditable="true"],
html[data-site-theme="win98"] textarea,
html[data-site-theme="win98"] .global-player-search {
    cursor: var(--win98-cursor-text) !important;
}

html[data-site-theme="win98"] select {
    cursor: var(--win98-cursor-pointer) !important;
}

html[data-site-theme="win98"] .global-player-slider,
html[data-site-theme="win98"] .global-player-slider-wrap,
html[data-site-theme="win98"] .global-player-slider-track,
html[data-site-theme="win98"] .global-player-slider-fill,
html[data-site-theme="win98"] .global-player-slider::-webkit-slider-thumb,
html[data-site-theme="win98"] .global-player-slider::-webkit-slider-runnable-track,
html[data-site-theme="win98"] .global-player-slider::-moz-range-thumb,
html[data-site-theme="win98"] .global-player-slider::-moz-range-track,
html[data-site-theme="win98"] .global-player-slider::-moz-range-progress,
html[data-site-theme="win98"] .global-player-progress,
html[data-site-theme="win98"] .global-player-progress *,
html[data-site-theme="win98"] #gp-volume-area,
html[data-site-theme="win98"] #gp-volume-area *,
html[data-site-theme="win98"] .global-player-volume-rail,
html[data-site-theme="win98"] .global-player-volume-rail *,
html[data-site-theme="win98"] input[type="range"] {
    cursor: var(--win98-cursor-pointer) !important;
}

html[data-site-theme="win98"] button:disabled,
html[data-site-theme="win98"] input:disabled,
html[data-site-theme="win98"] select:disabled,
html[data-site-theme="win98"] textarea:disabled,
html[data-site-theme="win98"] [aria-disabled="true"] {
    cursor: var(--win98-cursor-not-allowed) !important;
}

html[data-site-theme="win98"][aria-busy="true"],
html[data-site-theme="win98"] [aria-busy="true"],
html[data-site-theme="win98"] .is-busy,
html[data-site-theme="win98"] .busy {
    cursor: var(--win98-cursor-wait) !important;
}

html[data-site-theme="win98"] .is-loading,
html[data-site-theme="win98"] .loading,
html[data-site-theme="win98"] .progress,
html[data-site-theme="win98"] [data-loading="true"] {
    cursor: var(--win98-cursor-progress) !important;
}

html[data-site-theme="win98"] [draggable="true"] {
    cursor: var(--win98-cursor-grab) !important;
}

html[data-site-theme="win98"] [draggable="true"]:active {
    cursor: var(--win98-cursor-grabbing) !important;
}

html[data-site-theme="win98"] .is-moving,
html[data-site-theme="win98"] .move,
html[data-site-theme="win98"] [data-cursor="move"] {
    cursor: var(--win98-cursor-move) !important;
}

html[data-site-theme="win98"] .crosshair,
html[data-site-theme="win98"] [data-cursor="crosshair"] {
    cursor: var(--win98-cursor-crosshair) !important;
}

html[data-site-theme="win98"] [data-cursor="resize-ns"] {
    cursor: var(--win98-cursor-resize-ns) !important;
}

html[data-site-theme="win98"] [data-cursor="resize-ew"] {
    cursor: var(--win98-cursor-resize-ew) !important;
}

html[data-site-theme="win98"] [data-cursor="resize-nwse"] {
    cursor: var(--win98-cursor-resize-nwse) !important;
}

html[data-site-theme="win98"] [data-cursor="resize-nesw"] {
    cursor: var(--win98-cursor-resize-nesw) !important;
}

html[data-site-theme="win98"] .global-player-inner,
html[data-site-theme="win98"] .global-player-inner *:not(input):not(textarea):not(select):not(.global-player-search) {
    cursor: var(--win98-cursor-default) !important;
}

html[data-site-theme="win98"] .global-player-btn,
html[data-site-theme="win98"] .global-player-btn *,
html[data-site-theme="win98"] .global-player-pill,
html[data-site-theme="win98"] .global-player-pill *,
html[data-site-theme="win98"] .global-player-toggle-pill,
html[data-site-theme="win98"] .global-player-toggle-pill *,
html[data-site-theme="win98"] .global-player-track-button,
html[data-site-theme="win98"] .global-player-track-button *,
html[data-site-theme="win98"] .global-player-category-chip,
html[data-site-theme="win98"] .global-player-category-chip *,
html[data-site-theme="win98"] .global-track-option,
html[data-site-theme="win98"] .global-track-option *,
html[data-site-theme="win98"] .global-track-queue-btn,
html[data-site-theme="win98"] .global-track-queue-btn *,
html[data-site-theme="win98"] .global-player-track-chevron,
html[data-site-theme="win98"] .global-player-track-chevron *,
html[data-site-theme="win98"] .global-player-show-toggle,
html[data-site-theme="win98"] .global-player-show-toggle *,
html[data-site-theme="win98"] .global-player-queue-item-remove,
html[data-site-theme="win98"] .global-player-queue-clear,
html[data-site-theme="win98"] .global-player-queue-item,
html[data-site-theme="win98"] .global-player-queue-item *,
html[data-site-theme="win98"] .player-btn,
html[data-site-theme="win98"] .player-btn *,
html[data-site-theme="win98"] .playlist-select,
html[data-site-theme="win98"] .playlist-select * {
    cursor: var(--win98-cursor-pointer) !important;
}

html[data-site-theme="win98"] button:disabled,
html[data-site-theme="win98"] button:disabled *,
html[data-site-theme="win98"] input:disabled,
html[data-site-theme="win98"] input:disabled *,
html[data-site-theme="win98"] input[type="range"]:disabled,
html[data-site-theme="win98"] input[type="range"]:disabled::-webkit-slider-runnable-track,
html[data-site-theme="win98"] input[type="range"]:disabled::-webkit-slider-thumb,
html[data-site-theme="win98"] input[type="range"]:disabled::-moz-range-track,
html[data-site-theme="win98"] input[type="range"]:disabled::-moz-range-thumb,
html[data-site-theme="win98"] select:disabled,
html[data-site-theme="win98"] textarea:disabled,
html[data-site-theme="win98"] [aria-disabled="true"],
html[data-site-theme="win98"] [aria-disabled="true"] * {
    cursor: var(--win98-cursor-not-allowed) !important;
}

/* ===== WIN98 form controls — 98.css style range slider ===== */
html[data-site-theme="win98"] input[type="range"]:not(.global-player-progress):not(.global-player-volume) {
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    height: 22px;
    padding: 0 !important;
    margin: 0 !important;
    border: 0;
    outline: none;
}
html[data-site-theme="win98"] input[type="range"]:not(.global-player-progress):not(.global-player-volume)::-webkit-slider-runnable-track {
    height: 4px;
    background: #c0c0c0;
    border-top: 1px solid #808080;
    border-left: 1px solid #808080;
    border-right: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
    box-shadow: inset 0 0 0 1px transparent;
}
html[data-site-theme="win98"] input[type="range"]:not(.global-player-progress):not(.global-player-volume)::-moz-range-track {
    height: 4px;
    background: #c0c0c0;
    border-top: 1px solid #808080;
    border-left: 1px solid #808080;
    border-right: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
}
html[data-site-theme="win98"] input[type="range"]:not(.global-player-progress):not(.global-player-volume)::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    width: 12px;
    height: 22px;
    margin-top: -10px;
    background: #c0c0c0;
    border-top: 2px solid #ffffff;
    border-left: 2px solid #ffffff;
    border-right: 2px solid #404040;
    border-bottom: 2px solid #404040;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf;
    border-radius: 0;
    cursor: var(--win98-cursor-pointer) !important;
}
html[data-site-theme="win98"] input[type="range"]:not(.global-player-progress):not(.global-player-volume)::-moz-range-thumb {
    width: 12px;
    height: 22px;
    background: #c0c0c0;
    border-top: 2px solid #ffffff;
    border-left: 2px solid #ffffff;
    border-right: 2px solid #404040;
    border-bottom: 2px solid #404040;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf;
    border-radius: 0;
    cursor: var(--win98-cursor-pointer) !important;
}
html[data-site-theme="win98"] input[type="range"]:not(.global-player-progress):not(.global-player-volume):active::-webkit-slider-thumb {
    border-top-color: #404040;
    border-left-color: #404040;
    border-right-color: #ffffff;
    border-bottom-color: #ffffff;
}

html[data-site-theme="win98"] input[type="range"]:disabled:not(.global-player-progress):not(.global-player-volume)::-webkit-slider-runnable-track {
    background: #d0d0d0;
    border-color: #a0a0a0 #efefef #efefef #a0a0a0;
}

html[data-site-theme="win98"] input[type="range"]:disabled:not(.global-player-progress):not(.global-player-volume)::-moz-range-track {
    background: #d0d0d0;
    border-color: #a0a0a0 #efefef #efefef #a0a0a0;
}

html[data-site-theme="win98"] input[type="range"]:disabled:not(.global-player-progress):not(.global-player-volume)::-webkit-slider-thumb,
html[data-site-theme="win98"] input[type="range"]:disabled:not(.global-player-progress):not(.global-player-volume)::-moz-range-thumb {
    background: #d0d0d0;
    border-color: #efefef #808080 #808080 #efefef;
    box-shadow: inset -1px -1px 0 #a0a0a0, inset 1px 1px 0 #f0f0f0;
    cursor: var(--win98-cursor-not-allowed) !important;
}

html[data-site-theme="win98"] select.win98-desktop-select,
html[data-site-theme="win98"] .win98-desktop-dialog select {
    appearance: none;
    -webkit-appearance: none;
    background: #ffffff;
    border-top: 1px solid #404040;
    border-left: 1px solid #404040;
    border-right: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
    box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf;
    border-radius: 0;
    padding: 2px 18px 2px 4px;
    font-family: "MS Sans Serif", Tahoma, sans-serif;
    font-size: 11px;
    color: #000;
}

/* ===== WIN98 form controls — 98.css style checkboxes & radios ===== */
html[data-site-theme="win98"] input[type="checkbox"],
html[data-site-theme="win98"] input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    margin: 0 6px 0 0;
    width: 13px;
    height: 13px;
    background: #ffffff;
    border: 1px solid;
    border-color: #808080 #ffffff #ffffff #808080;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf;
    border-radius: 0;
    padding: 0;
    vertical-align: -2px;
    cursor: var(--win98-cursor-pointer) !important;
    flex-shrink: 0;
}

html[data-site-theme="win98"] input[type="radio"] {
    border-radius: 50% !important;
    background: #ffffff;
}

html[data-site-theme="win98"] input[type="checkbox"]::after {
    content: "";
    display: block;
    position: absolute;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 7px 7px;
    background-image: none;
}

html[data-site-theme="win98"] input[type="checkbox"]:checked::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='7' viewBox='0 0 7 7'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.4' d='M0 3.6L2.4 6 7 1'/%3E%3C/svg%3E");
}

html[data-site-theme="win98"] input[type="radio"]::after {
    content: "";
    display: block;
    position: absolute;
    top: 3px;
    left: 3px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: transparent;
}

html[data-site-theme="win98"] input[type="radio"]:checked::after {
    background: #000;
}

html[data-site-theme="win98"] input[type="checkbox"]:disabled,
html[data-site-theme="win98"] input[type="radio"]:disabled {
    background: #c0c0c0;
    cursor: var(--win98-cursor-not-allowed) !important;
}

html[data-site-theme="win98"] input[type="checkbox"]:disabled:checked::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='7' viewBox='0 0 7 7'%3E%3Cpath fill='none' stroke='%23808080' stroke-width='1.4' d='M0 3.6L2.4 6 7 1'/%3E%3C/svg%3E");
}

html[data-site-theme="win98"] input[type="radio"]:disabled:checked::after {
    background: #808080;
}

html[data-site-theme="win98"] .field-row {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: 12px;
}

html[data-site-theme="win98"] label[for] {
    cursor: var(--win98-cursor-pointer) !important;
}

html[data-site-theme="win98"] button:disabled,
html[data-site-theme="win98"] input:disabled,
html[data-site-theme="win98"] select:disabled,
html[data-site-theme="win98"] textarea:disabled,
html[data-site-theme="win98"] .global-player-btn:disabled {
    cursor: var(--win98-cursor-not-allowed) !important;
}

html[data-site-theme="win98"] #gp-reactive-toggle {
    display: none !important;
}

/* ===== WIN98: SMP page — title bars & inner boxes (positioning handled above) ===== */

/* Subtitle below title bar */
html[data-site-theme="win98"] .box-subtitle {
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 11px !important;
    color: #444 !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
    margin-bottom: 1rem !important;
}

/* Sunken inset panel (like a Win98 list box / text field) */
html[data-site-theme="win98"] .inner-entry {
    background: var(--win98-sub-bg, #ffffff) !important;
    border: 2px solid !important;
    border-color: #808080 #dfdfdf #dfdfdf #808080 !important;
    border-radius: 0 !important;
    box-shadow: inset 1px 1px 0 #000000 !important;
}

/* Body text + command descriptions + inner-entry paragraphs — readable on sub-bg */
html[data-site-theme="win98"] .box-body,
html[data-site-theme="win98"] .cmd-line span,
html[data-site-theme="win98"] .inner-entry p {
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
}

html[data-site-theme="win98"] .box-body {
    color: var(--win98-text, #111) !important;
    -webkit-text-fill-color: var(--win98-text, #111) !important;
}

html[data-site-theme="win98"] .cmd-line span,
html[data-site-theme="win98"] .inner-entry p {
    color: var(--win98-sub-text, var(--win98-text, #111)) !important;
    -webkit-text-fill-color: var(--win98-sub-text, var(--win98-text, #111)) !important;
}

/* Inline code — monospace with slight inset look, uses Win98 theme accent */
html[data-site-theme="win98"] .glass code {
    font-family: "Courier New", Courier, monospace !important;
    background: var(--win98-sub-bg, #dfdfdf) !important;
    color: var(--win98-link, var(--win98-title-start, #000080)) !important;
    border: 1px solid #808080 !important;
    border-top-color: #404040 !important;
    border-left-color: #404040 !important;
    border-radius: 0 !important;
    padding: 1px 5px !important;
    font-weight: 700 !important;
}

html[data-site-theme="win98"] .cmd-line code {
    background: color-mix(in srgb, var(--win98-link, var(--win98-title-start, #000080)) 12%, transparent) !important;
    background-image: none !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    color: var(--win98-link, var(--win98-title-start, var(--win98-accent, #000080))) !important;
    -webkit-text-fill-color: var(--win98-link, var(--win98-title-start, var(--win98-accent, #000080))) !important;
}

/* Command list row separators */
html[data-site-theme="win98"] .cmd-line {
    border-bottom-color: #a0a0a0 !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-size: 11px !important;
}

/* Plugin / in-box links — contrast against inner (sub) surface; JS sets --win98-link */
html[data-site-theme="win98"] .plugin-link,
html[data-site-theme="win98"] a[href]:not(.glass):not(.btn-glow):not(.theme-toggle):not(.site-control-toggle):not(.game-rotation-cta):not(.global-player-btn):not(.global-player-pill):not(.global-player-track-button):not(.global-player-category-chip):not(.global-track-queue-btn):not(.site-dock-menu-button):not(.site-dock-menu-item),
html[data-site-theme="win98"] .glass a:not(.btn-glow):not(.theme-toggle):not(.game-rotation-cta):not(.global-player-btn):not(.global-player-pill) {
    color: var(--win98-link, var(--win98-title-start, #000080)) !important;
    -webkit-text-fill-color: var(--win98-link, var(--win98-title-start, #000080)) !important;
    text-decoration: underline !important;
    transition: color 0.15s ease, -webkit-text-fill-color 0.15s ease !important;
    font-weight: 700 !important;
}
html[data-site-theme="win98"] .plugin-link:hover,
html[data-site-theme="win98"] .plugin-link:focus-visible,
html[data-site-theme="win98"] a[href]:not(.glass):not(.btn-glow):not(.theme-toggle):not(.site-control-toggle):not(.game-rotation-cta):not(.global-player-btn):not(.global-player-pill):not(.global-player-track-button):not(.global-player-category-chip):not(.global-track-queue-btn):not(.site-dock-menu-button):not(.site-dock-menu-item):hover,
html[data-site-theme="win98"] a[href]:not(.glass):not(.btn-glow):not(.theme-toggle):not(.site-control-toggle):not(.game-rotation-cta):not(.global-player-btn):not(.global-player-pill):not(.global-player-track-button):not(.global-player-category-chip):not(.global-track-queue-btn):not(.site-dock-menu-button):not(.site-dock-menu-item):focus-visible,
html[data-site-theme="win98"] .glass a:not(.btn-glow):not(.theme-toggle):not(.game-rotation-cta):not(.global-player-btn):not(.global-player-pill):hover,
html[data-site-theme="win98"] .glass a:not(.btn-glow):not(.theme-toggle):not(.game-rotation-cta):not(.global-player-btn):not(.global-player-pill):focus-visible {
    color: var(--win98-link-hover, var(--win98-title-end, var(--win98-title-start, #000080))) !important;
    -webkit-text-fill-color: var(--win98-link-hover, var(--win98-title-end, var(--win98-title-start, #000080))) !important;
    filter: none !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

/* Section labels inside boxes — readable on sub-bg.
   Use the full readable color (not muted) so small all-caps labels stay legible on any background. */
html[data-site-theme="win98"] .glass h3,
html[data-site-theme="win98"] .glass h4,
html[data-site-theme="win98"] .box-subtitle {
    color: var(--win98-text, #111) !important;
    -webkit-text-fill-color: var(--win98-text, #111) !important;
}

html[data-site-theme="win98"] .inner-entry h3,
html[data-site-theme="win98"] .inner-entry h4,
html[data-site-theme="win98"] .inner-entry > p:first-child {
    color: var(--win98-sub-text, var(--win98-text, #111)) !important;
    -webkit-text-fill-color: var(--win98-sub-text, var(--win98-text, #111)) !important;
}

/* Tailwind utility-class text colors get explicitly overridden inside .glass so dark-on-dark or
   light-on-light combinations from the neon theme don't bleed through into Win98. */
html[data-site-theme="win98"] .glass .text-white,
html[data-site-theme="win98"] .glass .text-gray-100,
html[data-site-theme="win98"] .glass .text-gray-200,
html[data-site-theme="win98"] .glass .text-gray-300,
html[data-site-theme="win98"] .glass .text-gray-400,
html[data-site-theme="win98"] .glass .text-gray-500,
html[data-site-theme="win98"] .glass .text-gray-600,
html[data-site-theme="win98"] .glass .text-gray-700,
html[data-site-theme="win98"] .glass .text-gray-800,
html[data-site-theme="win98"] .glass .text-gray-900,
html[data-site-theme="win98"] .glass .text-black {
    color: var(--win98-text, #111) !important;
    -webkit-text-fill-color: var(--win98-text, #111) !important;
}

html[data-site-theme="win98"] .inner-entry :is(
    .text-white,
    .text-gray-100,
    .text-gray-200,
    .text-gray-300,
    .text-gray-400,
    .text-gray-500,
    .text-gray-600,
    .text-gray-700,
    .text-gray-800,
    .text-gray-900,
    .text-black
) {
    color: var(--win98-sub-text, var(--win98-text, #111)) !important;
    -webkit-text-fill-color: var(--win98-sub-text, var(--win98-text, #111)) !important;
}

/* Translucent "white tint" chips (bg-white/5, border-white/10) become unreadable on dark panels.
   Force them to a flat readable card style in Win98. */
html[data-site-theme="win98"] .glass .bg-white\/5,
html[data-site-theme="win98"] .glass [class*="bg-white/"] {
    background-color: var(--win98-sub-bg, #ffffff) !important;
    border-color: #808080 !important;
    color: var(--win98-sub-text, var(--win98-text, #111)) !important;
}
html[data-site-theme="win98"] .glass [class*="border-white/"] {
    border-color: #808080 !important;
}

/* Slider + progress area — pointer cursor over full widget */
html[data-site-theme="win98"] #gp-volume-area,
html[data-site-theme="win98"] .global-player-progress,
html[data-site-theme="win98"] .global-player-progress *,
html[data-site-theme="win98"] .global-player-slider-wrap {
    cursor: var(--win98-cursor-pointer) !important;
}

@media (max-width: 767px) {
    .site-control-dock {
        top: auto;
        bottom: 7.35rem;
        transform: none;
    }
}

/* --- PAGE LOAD REVEAL ANIMATION --- */
@keyframes fadeInUp { 
    from { opacity: 0; transform: translateY(30px); } 
    to { opacity: 1; transform: none; } 
}
.reveal { animation: fadeInUp 0.8s ease-out forwards; }

@property --orb-c1 {
    syntax: '<color>';
    inherits: false;
    initial-value: transparent;
}

@property --orb-c2 {
    syntax: '<color>';
    inherits: false;
    initial-value: transparent;
}

@property --orb-c3 {
    syntax: '<color>';
    inherits: false;
    initial-value: transparent;
}

@property --orb-c4 {
    syntax: '<color>';
    inherits: false;
    initial-value: transparent;
}

/* Blob positions inside each orb — registered so they CSS-transition smoothly */
@property --blob-x1 { syntax: '<percentage>'; inherits: false; initial-value: 22%; }
@property --blob-y1 { syntax: '<percentage>'; inherits: false; initial-value: 28%; }
@property --blob-x2 { syntax: '<percentage>'; inherits: false; initial-value: 74%; }
@property --blob-y2 { syntax: '<percentage>'; inherits: false; initial-value: 22%; }
@property --blob-x3 { syntax: '<percentage>'; inherits: false; initial-value: 36%; }
@property --blob-y3 { syntax: '<percentage>'; inherits: false; initial-value: 76%; }
@property --blob-x4 { syntax: '<percentage>'; inherits: false; initial-value: 78%; }
@property --blob-y4 { syntax: '<percentage>'; inherits: false; initial-value: 70%; }
@property --orb-r1 { syntax: '<percentage>'; inherits: false; initial-value: 54%; }
@property --orb-r2 { syntax: '<percentage>'; inherits: false; initial-value: 46%; }
@property --orb-r3 { syntax: '<percentage>'; inherits: false; initial-value: 52%; }
@property --orb-r4 { syntax: '<percentage>'; inherits: false; initial-value: 48%; }
@property --orb-r5 { syntax: '<percentage>'; inherits: false; initial-value: 50%; }
@property --orb-r6 { syntax: '<percentage>'; inherits: false; initial-value: 56%; }
@property --orb-r7 { syntax: '<percentage>'; inherits: false; initial-value: 44%; }
@property --orb-r8 { syntax: '<percentage>'; inherits: false; initial-value: 50%; }

@property --star-beat-glow {
    syntax: '<number>';
    inherits: true;
    initial-value: 0;
}

/* --- BACKGROUND ORBS & STARS --- */
html {
    scrollbar-width: auto;
    scrollbar-color: auto;
}

/* Unified scrollbar thickness (non–Win98); Firefox uses scrollbar-width inherited from html */
html:not([data-site-theme="win98"]) {
    --site-scrollbar-size: 12px;
    scrollbar-width: auto;
    scrollbar-color: rgba(255, 255, 255, 0.22) rgba(255, 255, 255, 0.06);
}

html:not([data-site-theme="win98"]) *::-webkit-scrollbar {
    width: var(--site-scrollbar-size);
    height: var(--site-scrollbar-size);
}

html:not([data-site-theme="win98"]) *::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.06);
    border-radius: 999px;
}

html:not([data-site-theme="win98"]) *::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

html:not([data-site-theme="win98"]) *::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.22);
    background-clip: padding-box;
}

.color-orb {
    position: fixed !important;
    top: 0;
    left: 0;
    width: var(--orb-width, 720px);
    height: var(--orb-height, 620px);
    border-radius: var(--orb-r1) var(--orb-r2) var(--orb-r3) var(--orb-r4) / var(--orb-r5) var(--orb-r6) var(--orb-r7) var(--orb-r8);
    z-index: -2;
    opacity: calc(var(--orb-opacity, 0) * var(--orb-reactive-opacity, 1));
    pointer-events: none;
    mix-blend-mode: screen;
    transform:
        translate3d(
            calc(var(--orb-x, 0px) + var(--orb-shift-x, 0px) + var(--orb-reactive-x, 0px)),
            calc(var(--orb-y, 0px) + var(--orb-shift-y, 0px) + var(--orb-reactive-y, 0px)),
            0
        )
        rotate(var(--orb-rotate, 0deg));
    transform-origin: center;
    will-change: transform, opacity;
    isolation: isolate;
    backface-visibility: hidden;
}

.orb-no-transition {
    transition: none !important;
}

.orb-fx-off::before,
.orb-fx-off::after {
    transition:
        --orb-c1 4s ease-in-out,
        --orb-c2 5s ease-in-out,
        --orb-c3 4.5s ease-in-out,
        --orb-c4 5.5s ease-in-out !important;
}

.color-orb::before {
    content: "";
    position: absolute;
    inset: -10%;
    border-radius: inherit;
    background:
        radial-gradient(ellipse 42% 38% at var(--blob-x1) var(--blob-y1),
            color-mix(in srgb, var(--orb-c1) 96%, white 4%) 0%,
            color-mix(in srgb, var(--orb-c1) 84%, transparent) 16%,
            color-mix(in srgb, var(--orb-c1) 62%, transparent) 36%,
            color-mix(in srgb, var(--orb-c1) 34%, transparent) 56%,
            transparent 80%),
        radial-gradient(ellipse 40% 36% at var(--blob-x2) var(--blob-y2),
            color-mix(in srgb, var(--orb-c2) 95%, white 5%) 0%,
            color-mix(in srgb, var(--orb-c2) 82%, transparent) 16%,
            color-mix(in srgb, var(--orb-c2) 58%, transparent) 36%,
            color-mix(in srgb, var(--orb-c2) 30%, transparent) 56%,
            transparent 82%),
        radial-gradient(ellipse 38% 34% at var(--blob-x3) var(--blob-y3),
            color-mix(in srgb, var(--orb-c3) 94%, white 6%) 0%,
            color-mix(in srgb, var(--orb-c3) 80%, transparent) 16%,
            color-mix(in srgb, var(--orb-c3) 54%, transparent) 38%,
            color-mix(in srgb, var(--orb-c3) 28%, transparent) 58%,
            transparent 82%),
        radial-gradient(ellipse 36% 32% at var(--blob-x4) var(--blob-y4),
            color-mix(in srgb, var(--orb-c4) 92%, white 8%) 0%,
            color-mix(in srgb, var(--orb-c4) 78%, transparent) 16%,
            color-mix(in srgb, var(--orb-c4) 52%, transparent) 38%,
            color-mix(in srgb, var(--orb-c4) 24%, transparent) 58%,
            transparent 82%);
    mix-blend-mode: screen;
    opacity: 0.98;
    filter: blur(64px) saturate(calc(178% + var(--orb-reactive-saturate, 0%))) contrast(108%) brightness(calc(1.06 + var(--orb-reactive-brightness, 0))) hue-rotate(var(--orb-reactive-hue, 0deg));
    transform: scale(calc(var(--orb-scale, 1) * var(--orb-reactive-scale, 1)));
    transform-origin: center;
    transition:
        --orb-c1 4s ease-in-out,
        --orb-c2 5s ease-in-out,
        --orb-c3 4.5s ease-in-out,
        --orb-c4 5.5s ease-in-out;
    will-change: transform;
    pointer-events: none;
}

.color-orb::after {
    content: "";
    position: absolute;
    inset: -12%;
    border-radius: inherit;
    background:
        radial-gradient(ellipse 54% 48% at 34% 34%, color-mix(in srgb, var(--orb-c1) 10%, transparent) 0%, transparent 70%),
        radial-gradient(ellipse 52% 46% at 68% 34%, color-mix(in srgb, var(--orb-c2) 9%, transparent) 0%, transparent 70%),
        radial-gradient(ellipse 50% 44% at 36% 70%, color-mix(in srgb, var(--orb-c3) 8%, transparent) 0%, transparent 70%),
        radial-gradient(ellipse 48% 42% at 68% 68%, color-mix(in srgb, var(--orb-c4) 7%, transparent) 0%, transparent 70%);
    mix-blend-mode: screen;
    opacity: 0.50;
    filter: blur(32px) saturate(calc(140% + calc(var(--orb-reactive-saturate, 0%) * 0.58))) brightness(calc(1.02 + var(--orb-reactive-brightness, 0))) hue-rotate(calc(var(--orb-reactive-hue, 0deg) * 0.62));
    transform: scale(calc(var(--orb-scale, 1) * var(--orb-reactive-scale, 1) * 1.05));
    transform-origin: center;
    transition:
        --orb-c1 5s ease-in-out,
        --orb-c2 6s ease-in-out,
        --orb-c3 5.5s ease-in-out,
        --orb-c4 6.5s ease-in-out;
    will-change: transform;
    pointer-events: none;
}

#orb1 { --orb-width: 1380px; --orb-height: 1200px; }
#orb2 { --orb-width: 1700px; --orb-height: 1480px; }
#orb3 { --orb-width: 1220px; --orb-height: 1060px; }
#orb4 { --orb-width: 1160px; --orb-height: 1000px; }
#orb5 { --orb-width: 1320px; --orb-height: 1140px; }
#orb6 { --orb-width: 1240px; --orb-height: 1080px; }
#orb7 { --orb-width: 1200px; --orb-height: 1040px; }
#orb8 { --orb-width: 1060px; --orb-height: 940px; }

#star-field { 
    position: fixed !important; 
    top: 0; 
    left: 0; 
    width: 100vw; 
    height: 100vh; 
    z-index: -1; 
    pointer-events: none; 
    background-color: transparent;
    transform: translate(
        calc(var(--star-auto-x, 0px) + var(--star-mouse-x, 0px) + var(--star-reactive-x, 0px)),
        calc(var(--star-auto-y, 0px) + var(--star-mouse-y, 0px) + var(--star-reactive-y, 0px))
    ) scale(calc(1 + var(--star-reactive-scale, 0)));
    filter: none;
    will-change: transform;
}

html[data-site-theme="neon"] #theme-backdrop {
    z-index: 0;
}

html[data-site-theme="neon"] .color-orb {
    z-index: 0;
}

html[data-site-theme="neon"] #star-field {
    z-index: 1;
}

html[data-site-theme="neon"] .neon-hero-backdrop-layer {
    position: fixed;
    inset: 0;
    z-index: 2;
    pointer-events: none;
}

html[data-site-theme="neon"] .neon-hero-backdrop-pane {
    position: absolute;
    background: rgba(0, 0, 0, 0.001);
    backdrop-filter: blur(var(--neon-hero-pane-blur, 0px));
    -webkit-backdrop-filter: blur(var(--neon-hero-pane-blur, 0px));
    pointer-events: none;
    will-change: left, top, width, height, backdrop-filter;
}

html[data-site-theme="neon"] body.admin-page .admin-board-shell > h1 {
    font-size: var(--ad-text-lg, 17px) !important;
    line-height: 1 !important;
    letter-spacing: var(--ad-letter-track, 0.12em) !important;
}

.star {
    position: absolute;
    pointer-events: none;
    opacity: 0;
    width: var(--star-size, 1.2px);
    height: var(--star-size, 1.2px);
    background: #ffffff;
    border-radius: 0;
    filter: none;
    box-shadow: none;
    animation: starTwinkle var(--duration, 5s) cubic-bezier(0.4, 0, 0.2, 1) infinite;
    animation-delay: var(--delay, 0s);
    will-change: opacity;
    contain: paint;
}

.star::before,
.star::after {
    display: none;
}

@keyframes starTwinkle {
    0%, 100% { opacity: 0; }
    16% { opacity: 0; }
    38% { opacity: calc(var(--star-peak, 0.82) * 0.34); }
    56% { opacity: var(--star-peak, 0.82); }
    74% { opacity: calc(var(--star-peak, 0.82) * 0.22); }
}

:root {
    --neon-sync-duration: 0.5s;
    --neon-sync-ease: ease;
}

/* --- FROSTED GLASS BOXES --- */
.glass {
    background: rgba(11, 11, 11, 0.25);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid color-mix(in srgb, var(--glow-color) 6%, transparent);
    border-radius: 2.5rem;
    position: relative;
    overflow: hidden;
    box-shadow: none;
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        --glow-color var(--neon-sync-duration) var(--neon-sync-ease);
    z-index: 10;
}

.glass::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    border-left: 5px solid color-mix(in srgb, var(--glow-color) 65%, transparent);
    box-shadow: inset 8px 0 14px -10px color-mix(in srgb, var(--glow-color) 55%, transparent);
    z-index: 20;
    pointer-events: none;
    transition:
        border-left-width var(--neon-sync-duration) var(--neon-sync-ease),
        border-left-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease);
}

.glass:hover::before {
    border-left: 8px solid var(--glow-color);
    box-shadow: inset 12px 0 18px -12px var(--glow-color);
}

.glass:hover {
    transform: translateY(-8px) scale(1.015) !important;
    border-color: color-mix(in srgb, var(--glow-color) 95%, transparent);
    box-shadow: -6px 0 14px -4px var(--glow-color), 0 10px 20px color-mix(in srgb, var(--glow-color) 12%, transparent);
    z-index: 50;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.glass, .site-widget-card, .site-guestbook-shell) {
    --neon-tone-title: color-mix(in srgb, var(--glow-color, #fc00e3) 58%, #ffffff);
    --neon-tone-strong: color-mix(in srgb, var(--glow-color, #fc00e3) 76%, #ffffff);
    --neon-tone-body: color-mix(in srgb, var(--glow-color, #fc00e3) 26%, #d7d8e4);
    --neon-tone-dim: color-mix(in srgb, var(--glow-color, #fc00e3) 18%, #8c8d99);
    --neon-tone-panel: color-mix(in srgb, var(--glow-color, #fc00e3) 8%, rgba(7, 3, 11, 0.9));
    --neon-tone-line: color-mix(in srgb, var(--glow-color, #fc00e3) 68%, rgba(255, 255, 255, 0.12));
    color: var(--neon-tone-body);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .glass {
    background: color-mix(in srgb, var(--glow-color) 7%, rgba(10, 6, 14, 0.9));
    border: 2px solid color-mix(in srgb, var(--glow-color) 74%, rgba(255, 255, 255, 0.14));
    border-radius: 8px;
    box-shadow:
        inset 0 0 24px color-mix(in srgb, var(--glow-color) 10%, transparent),
        0 0 18px color-mix(in srgb, var(--glow-color) 10%, transparent);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .glass::before {
    border-left: 4px solid color-mix(in srgb, var(--glow-color) 82%, transparent);
    border-radius: inherit;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .glass:hover,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .glass:focus-within {
    border-color: color-mix(in srgb, var(--glow-color) 92%, #ffffff);
    box-shadow:
        inset 0 0 32px color-mix(in srgb, var(--glow-color) 18%, transparent),
        0 0 30px color-mix(in srgb, var(--glow-color) 30%, transparent),
        0 0 58px color-mix(in srgb, var(--glow-color) 12%, transparent);
    transform: translateY(-4px) scale(1.006) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .site-widget-card,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .site-hit-counter {
    --glow-color: #fc00e3;
    color: color-mix(in srgb, var(--glow-color) 66%, #ffffff);
    background: color-mix(in srgb, var(--glow-color) 7%, rgba(10, 6, 14, 0.9));
    border: 2px solid color-mix(in srgb, var(--glow-color) 74%, rgba(255, 255, 255, 0.14));
    border-radius: 8px;
    box-shadow: inset 0 0 18px color-mix(in srgb, var(--glow-color) 10%, transparent);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.site-widget-card, .site-hit-counter):hover,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.site-widget-card, .site-hit-counter):focus-within {
    border-color: color-mix(in srgb, var(--glow-color) 92%, #ffffff);
    box-shadow:
        inset 0 0 24px color-mix(in srgb, var(--glow-color) 16%, transparent),
        0 0 26px color-mix(in srgb, var(--glow-color) 28%, transparent);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .site-widget-title,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .site-currently-list li {
    color: var(--neon-tone-strong);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .site-widget-title {
    background: transparent;
    border-bottom-color: transparent;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .site-currently-list li::before {
    background: var(--glow-color, #fc00e3);
    box-shadow: 0 0 8px color-mix(in srgb, var(--glow-color, #fc00e3) 58%, transparent);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .site-hit-counter-digit {
    color: var(--neon-tone-strong);
    background: color-mix(in srgb, var(--glow-color) 10%, rgba(0, 0, 0, 0.76));
    border-color: color-mix(in srgb, var(--glow-color) 65%, #ffffff);
}

html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom {
    color: color-mix(in srgb, var(--glow-color, #ffffff) 66%, #ffffff);
    border: 2px solid color-mix(in srgb, var(--glow-color, #ffffff) 74%, rgba(255, 255, 255, 0.14)) !important;
    border-radius: 8px;
    box-shadow: inset 0 0 18px color-mix(in srgb, var(--glow-color, #ffffff) 10%, transparent) !important;
    overflow: hidden;
    position: relative;
}

html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    border-left: 4px solid color-mix(in srgb, var(--glow-color, #ffffff) 82%, transparent);
    box-shadow: inset 8px 0 14px -10px var(--glow-color, #ffffff);
    pointer-events: none;
    z-index: 2;
}

html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom:hover,
html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom:focus-within {
    border-color: color-mix(in srgb, var(--glow-color, #ffffff) 92%, #ffffff) !important;
    box-shadow:
        inset 0 0 24px color-mix(in srgb, var(--glow-color, #ffffff) 16%, transparent),
        0 0 26px color-mix(in srgb, var(--glow-color, #ffffff) 28%, transparent) !important;
}

html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom .site-hit-counter {
    color: color-mix(in srgb, var(--glow-color, #ffffff) 66%, #ffffff);
    background: color-mix(in srgb, var(--glow-color, #ffffff) 7%, rgba(10, 6, 14, 0.9));
    border: 2px solid color-mix(in srgb, var(--glow-color, #ffffff) 74%, rgba(255, 255, 255, 0.14));
    border-radius: 8px;
    box-shadow: inset 0 0 18px color-mix(in srgb, var(--glow-color, #ffffff) 10%, transparent);
}

html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom .site-widget-title,
html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom .site-currently-list li {
    color: color-mix(in srgb, var(--glow-color, #ffffff) 76%, #ffffff);
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, #ffffff) 76%, #ffffff);
}

html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom .site-currently-list li::before {
    background: var(--glow-color, #ffffff);
    box-shadow: 0 0 8px color-mix(in srgb, var(--glow-color, #ffffff) 58%, transparent);
}

html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom .site-hit-counter-digit {
    color: color-mix(in srgb, var(--glow-color, #ffffff) 38%, #ffffff);
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, #ffffff) 38%, #ffffff);
    background: color-mix(in srgb, var(--glow-color, #ffffff) 10%, rgba(0, 0, 0, 0.76));
    border-color: color-mix(in srgb, var(--glow-color, #ffffff) 65%, #ffffff);
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom {
    --neon-widget-edge-color: var(--glow-color, #fc00e3);
    color: color-mix(in srgb, var(--neon-widget-edge-color) 34%, #ffffff) !important;
    background: color-mix(in srgb, var(--neon-widget-edge-color) 9%, rgba(13, 0, 18, 0.9)) !important;
    border: 1px solid color-mix(in srgb, var(--neon-widget-edge-color) 88%, transparent) !important;
    border-radius: 6px;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--neon-widget-edge-color) 10%, transparent),
        0 0 18px color-mix(in srgb, var(--neon-widget-edge-color) 20%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom::before {
    display: block !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom:is(:hover, :focus-within) {
    border-color: var(--neon-widget-edge-color) !important;
    box-shadow:
        inset 0 0 22px color-mix(in srgb, var(--neon-widget-edge-color) 14%, transparent),
        0 0 24px color-mix(in srgb, var(--neon-widget-edge-color) 30%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom .site-widget-title {
    color: color-mix(in srgb, var(--neon-widget-edge-color) 82%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-widget-edge-color) 82%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom .site-currently-list li {
    color: color-mix(in srgb, var(--neon-widget-edge-color) 26%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-widget-edge-color) 26%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom .site-currently-list li::before {
    background: color-mix(in srgb, var(--neon-widget-edge-color) 92%, #ffffff);
    box-shadow: 0 0 8px color-mix(in srgb, var(--neon-widget-edge-color) 62%, transparent);
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom .site-hit-counter {
    background: color-mix(in srgb, var(--neon-widget-edge-color) 7%, rgba(0, 0, 0, 0.62));
    border: 1px solid color-mix(in srgb, var(--neon-widget-edge-color) 78%, transparent);
    border-radius: 6px;
    box-shadow: inset 0 0 14px color-mix(in srgb, var(--neon-widget-edge-color) 12%, transparent);
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom .site-hit-counter-digit {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: color-mix(in srgb, var(--neon-widget-edge-color) 12%, rgba(0, 0, 0, 0.74));
    border-color: color-mix(in srgb, var(--neon-widget-edge-color) 76%, transparent);
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    animation: rainbow-glow var(--neon-hero-rainbow-speed) linear infinite !important;
    --neon-widget-color: var(--glow-color) !important;
    --neon-widget-edge-color: var(--glow-color);
    --neon-widget-counter-color: var(--glow-color) !important;
    --neon-widget-counter-bright: var(--glow-color) !important;
    border-color: var(--glow-color) !important;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--glow-color) 10%, transparent),
        0 0 18px color-mix(in srgb, var(--glow-color) 20%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"]::before {
    animation: none !important;
    border-left-color: var(--glow-color) !important;
    box-shadow: inset 8px 0 14px -10px color-mix(in srgb, var(--glow-color) 55%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-widget-title,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-list li,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-updated,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter-digit {
    animation: rainbow-glow var(--neon-hero-rainbow-speed, 7s) linear infinite !important;
    animation-delay: var(--neon-hero-rainbow-delay, 0s) !important;
    border-color: var(--glow-color) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color) 32%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-list li::before {
    animation: rainbow-glow var(--neon-hero-rainbow-speed, 7s) linear infinite !important;
    animation-delay: var(--neon-hero-rainbow-delay, 0s) !important;
    background: var(--glow-color) !important;
    box-shadow: 0 0 8px color-mix(in srgb, var(--glow-color) 58%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-widget-title,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-list li,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-updated,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter-digit {
    animation: rainbow-glow var(--neon-hero-rainbow-speed, 7s) linear infinite !important;
    animation-delay: var(--neon-hero-rainbow-delay, 0s) !important;
    border-color: var(--glow-color) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"]) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-list li::before {
    animation: rainbow-glow var(--neon-hero-rainbow-speed, 7s) linear infinite !important;
    animation-delay: var(--neon-hero-rainbow-delay, 0s) !important;
    background: var(--glow-color) !important;
    box-shadow: 0 0 8px color-mix(in srgb, var(--glow-color) 58%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .carousel-viewport,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .inner-entry,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .btn-glow,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .game-rotation-cta,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .player-shell,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .global-player-inner,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .global-player-track-menu,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .global-player-queue-panel,
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .global-player-search-wrap {
    color: var(--neon-tone-body);
    background: var(--neon-tone-panel) !important;
    border: 1px solid var(--neon-tone-line) !important;
    border-radius: 8px !important;
    box-shadow:
        inset 0 0 16px color-mix(in srgb, var(--glow-color) 12%, transparent),
        0 0 12px color-mix(in srgb, var(--glow-color) 10%, transparent) !important;
}

html[data-site-theme="neon"] .global-player :is(.global-player-track-menu, .global-player-queue-panel) {
    background: rgba(8, 10, 10, var(--gp-opacity, 0.7)) !important;
    border-color: color-mix(in srgb, var(--gp-color, #ff0055) 28%, transparent) !important;
    border-radius: 1rem !important;
    box-shadow:
        0 14px 28px rgba(0, 0, 0, 0.45),
        0 0 18px color-mix(in srgb, var(--gp-color, #ff0055) 16%, transparent) !important;
}

html[data-site-theme="neon"] .global-player .global-player-search-wrap {
    background: rgba(8, 10, 10, var(--gp-opacity, 0.7)) !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.now-playing-card, .inner-entry, .site-guestbook-form, .site-guestbook-entry, .site-guestbook-viewport) {
    color: var(--neon-tone-body) !important;
    background: var(--neon-tone-panel) !important;
    border-color: var(--neon-tone-line) !important;
    box-shadow: inset 0 0 16px color-mix(in srgb, var(--glow-color, #fc00e3) 10%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.box-subtitle, .game-rotation-live, #game-rotation-panel .text-\[10px\], #game-rotation-panel .text-\[11px\], .site-guestbook-comments-title, .site-guestbook-form h3, .site-guestbook-field > span:first-child, .cmd-line code) {
    color: var(--neon-tone-strong) !important;
    -webkit-text-fill-color: var(--neon-tone-strong) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color, #fc00e3) 24%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.box-body, .inner-entry p, .now-playing-card p, .site-currently-list li, .site-guestbook-entry-message, .site-guestbook-status, #what-im-feeling-copy, .glass .text-gray-400, .glass .text-gray-500, .glass .text-gray-600) {
    color: var(--neon-tone-body) !important;
    -webkit-text-fill-color: var(--neon-tone-body) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(#main-current-game, .inner-entry p.font-black, .site-guestbook-entry-meta, .site-guestbook-entry-site, code) {
    color: var(--neon-tone-title) !important;
    -webkit-text-fill-color: var(--neon-tone-title) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color, #fc00e3) 18%, transparent) !important;
}

html[data-site-theme="neon"] :is(.site-guestbook-entry-meta, .site-guestbook-entry-site) {
    color: color-mix(in srgb, var(--glow-color, #fc00e3) 22%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, #fc00e3) 22%, #ffffff) !important;
    text-shadow: 0 0 8px color-mix(in srgb, var(--glow-color, #fc00e3) 32%, transparent) !important;
}

html[data-site-theme="neon"] .site-guestbook-entry-meta > span:not(:has(.site-guestbook-name)) {
    color: color-mix(in srgb, var(--glow-color, #fc00e3) 22%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, #fc00e3) 22%, #ffffff) !important;
}

html[data-site-theme="neon"] .site-guestbook-name {
    font-weight: 900;
    font-size: 1.55em;
    letter-spacing: 0.03em;
    text-shadow: 0 0 8px color-mix(in srgb, currentColor 55%, transparent), 0 0 16px color-mix(in srgb, currentColor 28%, transparent);
}

html[data-site-theme="neon"] .site-guestbook-admin-name {
    font-size: 1.18em;
}

html[data-site-theme="neon"] .site-guestbook-admin-name:not(.site-guestbook-admin-name-custom),
html[data-site-theme="neon"] .site-guestbook-admin-name:not(.site-guestbook-admin-name-custom) .site-guestbook-admin-name-text {
    color: color-mix(in srgb, var(--glow-color, #fc00e3) 18%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, #fc00e3) 18%, #ffffff) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color, #fc00e3) 38%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .nav-card a.glass .flex.flex-col > div:first-child {
    color: var(--neon-tone-title) !important;
    -webkit-text-fill-color: var(--neon-tone-title) !important;
    text-shadow: 0 0 12px color-mix(in srgb, var(--glow-color, #fc00e3) 22%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) #game-rotation-panel .game-rotation-heading {
    color: var(--neon-tone-title) !important;
    -webkit-text-fill-color: var(--neon-tone-title) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .nav-card a.glass .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .nav-card a.glass .flex.flex-col > div:last-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) #game-rotation-panel .game-rotation-heading {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .nav-card a.glass .flex.flex-col > div:last-child {
    color: var(--neon-tone-strong) !important;
    -webkit-text-fill-color: var(--neon-tone-strong) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color, #fc00e3) 24%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.site-guestbook-field input, .site-guestbook-field select, .site-guestbook-field textarea) {
    color: var(--neon-tone-title) !important;
    -webkit-text-fill-color: var(--neon-tone-title) !important;
    background: color-mix(in srgb, var(--glow-color, #fc00e3) 7%, rgba(0, 0, 0, 0.88)) !important;
    border-color: var(--neon-tone-line) !important;
    box-shadow: inset 0 0 10px color-mix(in srgb, var(--glow-color, #fc00e3) 14%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.btn-glow, .game-rotation-cta, .site-guestbook-actions button) {
    color: var(--neon-tone-strong) !important;
    -webkit-text-fill-color: var(--neon-tone-strong) !important;
    background: color-mix(in srgb, var(--glow-color, #fc00e3) 14%, rgba(0, 0, 0, 0.82)) !important;
    border-color: color-mix(in srgb, var(--glow-color, #fc00e3) 76%, rgba(255, 255, 255, 0.16)) !important;
    border-radius: 8px !important;
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--glow-color, #fc00e3) 18%, transparent) !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.btn-glow:hover, .btn-glow:focus-visible, .game-rotation-cta:hover, .game-rotation-cta:focus-visible, .site-guestbook-actions button:hover, .site-guestbook-actions button:focus-visible) {
    color: color-mix(in srgb, var(--glow-color, #fc00e3) 36%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, #fc00e3) 36%, #ffffff) !important;
    background: color-mix(in srgb, var(--glow-color, #fc00e3) 24%, rgba(0, 0, 0, 0.78)) !important;
    border-color: color-mix(in srgb, var(--glow-color, #fc00e3) 92%, #ffffff) !important;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--glow-color, #fc00e3) 18%, transparent),
        0 0 24px color-mix(in srgb, var(--glow-color, #fc00e3) 34%, transparent) !important;
    transform: translateY(-2px) scale(1.02);
}

html[data-site-theme="neon"] #game-rotation-panel::before {
    border-left-color: var(--glow-color);
    box-shadow: inset 8px 0 14px -10px var(--glow-color);
    transition:
        border-left-width var(--neon-sync-duration) var(--neon-sync-ease),
        border-left-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] #game-rotation-panel:hover::before,
html[data-site-theme="neon"] #game-rotation-panel:focus-within::before {
    border-left-color: var(--glow-color);
    box-shadow: inset 12px 0 18px -12px var(--glow-color);
}

html[data-site-theme="neon"] #game-rotation-panel {
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        background var(--neon-sync-duration) var(--neon-sync-ease),
        --glow-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-shift-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-stripe-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-outline-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-outline-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-active-fill-color var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] .neon-hero-box-custom {
    --glow-color: var(--neon-hero-color);
    --glow-rgb: var(--neon-hero-rgb);
    --neon-hero-stripe-color: var(--glow-color);
    --neon-hero-stripe-rgb: var(--neon-hero-rgb);
    --neon-hero-glass-bg: rgba(0, 0, 0, 0.01);
    --neon-hero-button-color: var(--neon-hero-color);
    --neon-hero-panel-bg: rgba(4, 5, 5, var(--neon-hero-panel-opacity, var(--neon-hero-opacity, 0.25)));
    --neon-hero-subpanel-bg: rgba(8, 10, 10, var(--neon-hero-subpanel-opacity, var(--neon-hero-opacity, 0.25)));
    background: var(--neon-hero-glass-bg) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background-clip: padding-box;
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        background var(--neon-sync-duration) var(--neon-sync-ease),
        backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease),
        --glow-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-shift-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-stripe-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-outline-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-outline-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-button-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-active-fill-color var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] body.admin-page .admin-board-shell.neon-hero-box-custom {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--neon-hero-glass-bg) !important;
    border-color: color-mix(in srgb, var(--glow-color) 76%, transparent) !important;
    box-shadow:
        inset 0 0 24px color-mix(in srgb, var(--glow-color) 10%, transparent),
        0 0 28px color-mix(in srgb, var(--glow-color) 22%, transparent) !important;
    backdrop-filter: blur(var(--neon-hero-blur, 0px));
    -webkit-backdrop-filter: blur(var(--neon-hero-blur, 0px));
    transition:
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        background var(--neon-sync-duration) var(--neon-sync-ease),
        backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease),
        --glow-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-shift-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-stripe-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-outline-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-outline-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-active-fill-color var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] body.admin-page .admin-board-shell.neon-hero-box-custom::before {
    content: "";
    position: absolute;
    inset: 0;
    border-left: 5px solid var(--neon-hero-stripe-color, var(--glow-color));
    border-radius: inherit;
    box-shadow: inset 8px 0 14px -10px var(--neon-hero-stripe-color, var(--glow-color));
    pointer-events: none;
    z-index: 2;
    transition:
        border-left-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] body.admin-page .admin-board-shell.neon-hero-box-custom::after {
    z-index: 0;
}

html[data-site-theme="neon"] body.admin-page .admin-board-shell.neon-hero-box-custom:is(:hover, :focus-within) {
    border-color: var(--glow-color) !important;
    box-shadow:
        inset 0 0 32px color-mix(in srgb, var(--glow-color) 12%, transparent),
        0 0 34px color-mix(in srgb, var(--glow-color) 30%, transparent) !important;
}

html[data-site-theme="neon"] body.admin-page .admin-board-shell.neon-hero-box-custom:is(:hover, :focus-within)::before {
    border-left-width: 5px;
    box-shadow: inset 8px 0 14px -10px var(--neon-hero-stripe-color, var(--glow-color));
}

html[data-site-theme="neon"] body.admin-page .admin-board-shell.neon-hero-box-custom:not(#game-rotation-panel)[data-neon-hero-style="gradient"]::before {
    transition: none !important;
}

html[data-site-theme="neon"] .float-wrapper.neon-hero-backdrop-host {
    background: var(--neon-hero-glass-bg, rgba(0, 0, 0, 0.001));
    backdrop-filter: blur(var(--neon-hero-blur, 0px));
    -webkit-backdrop-filter: blur(var(--neon-hero-blur, 0px));
    border-radius: 2.5rem;
    overflow: hidden;
    position: relative;
    transition:
        backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .float-wrapper.neon-hero-backdrop-host {
    border-radius: 8px;
}

html[data-site-theme="neon"] .neon-hero-box-custom > * {
    position: relative;
    z-index: 1;
}

html[data-site-theme="neon"] .neon-hero-box-custom::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background:
        linear-gradient(var(--neon-hero-glass-bg), var(--neon-hero-glass-bg)),
        var(--neon-hero-panel-bg);
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    pointer-events: none;
    z-index: 0;
    transition:
        background var(--neon-sync-duration) var(--neon-sync-ease),
        backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] .neon-hero-box-custom::before {
    border-left-color: var(--neon-hero-stripe-color, var(--glow-color));
    box-shadow: inset 8px 0 14px -10px var(--neon-hero-stripe-color, var(--glow-color));
    z-index: 2;
    transition:
        border-left-width var(--neon-sync-duration) var(--neon-sync-ease),
        border-left-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-fill="off"][data-neon-hero-outline="hover"] {
    overflow: visible !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom:hover::before,
html[data-site-theme="neon"] .neon-hero-box-custom:focus-within::before {
    border-left-color: var(--neon-hero-stripe-color, var(--glow-color));
    box-shadow: inset 12px 0 18px -12px var(--neon-hero-stripe-color, var(--glow-color));
}

html[data-site-theme="neon"] .smp-hero-glass.neon-hero-box-custom {
    border: 1px solid color-mix(in srgb, var(--glow-color) 6%, transparent);
    border-radius: 2.5rem;
    box-shadow: none;
    margin-top: 1.5rem;
    overflow: hidden;
    padding: 2.5rem;
    position: relative;
    z-index: 10;
}

html[data-site-theme="neon"] .smp-hero-glass.neon-hero-box-custom::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    border-left: 5px solid var(--neon-hero-stripe-color, var(--glow-color));
    box-shadow: inset 8px 0 14px -10px var(--neon-hero-stripe-color, var(--glow-color));
    z-index: 20;
    pointer-events: none;
    transition:
        border-left-width var(--neon-sync-duration) var(--neon-sync-ease),
        border-left-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] .smp-hero-glass.neon-hero-box-custom:hover,
html[data-site-theme="neon"] .smp-hero-glass.neon-hero-box-custom:focus-within {
    border-color: color-mix(in srgb, var(--glow-color) 95%, transparent);
    box-shadow: -6px 0 14px -4px var(--glow-color), 0 10px 20px color-mix(in srgb, var(--glow-color) 12%, transparent);
    transform: translateY(-8px) scale(1.015);
    z-index: 50;
}

html[data-site-theme="neon"] .smp-hero-glass.neon-hero-box-custom:hover::before,
html[data-site-theme="neon"] .smp-hero-glass.neon-hero-box-custom:focus-within::before {
    border-left: 8px solid var(--neon-hero-stripe-color, var(--glow-color));
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="accent"] {
    background: var(--neon-hero-glass-bg) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="gradient"] {
    --neon-hero-progress: 0;
    --neon-hero-shift-color: color-mix(in srgb, var(--neon-hero-color), var(--neon-hero-hover-color, var(--neon-hero-color)) calc(var(--neon-hero-progress) * 100%));
    --neon-hero-button-color: var(--neon-hero-shift-color);
    --neon-hero-outline-color: var(--neon-hero-shift-color);
    --neon-hero-outline-shadow: color-mix(in srgb, var(--neon-hero-shift-color) 55%, transparent);
    --glow-color: var(--neon-hero-shift-color) !important;
    --glow-rgb: var(--neon-hero-rgb) !important;
    --neon-hero-stripe-color: var(--neon-hero-shift-color) !important;
    --neon-title-glow-color: var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within) {
    --neon-hero-progress: 1;
    --glow-rgb: var(--neon-hero-hover-rgb, var(--neon-hero-rgb)) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .neon-hero-box-custom[data-neon-hero-style="gradient"] {
    --neon-hero-progress: 0;
    --neon-hero-shift-color: color-mix(in srgb, var(--neon-hero-color), var(--neon-hero-hover-color, var(--neon-hero-color)) calc(var(--neon-hero-progress) * 100%));
    --neon-hero-button-color: var(--neon-hero-shift-color);
    --neon-hero-outline-color: var(--neon-hero-shift-color);
    --neon-hero-outline-shadow: color-mix(in srgb, var(--neon-hero-shift-color) 55%, transparent);
    --glow-color: var(--neon-hero-shift-color) !important;
    --glow-rgb: var(--neon-hero-rgb) !important;
    --neon-hero-stripe-color: var(--neon-hero-shift-color) !important;
    --neon-title-glow-color: var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within) {
    --neon-hero-progress: 1;
    --glow-rgb: var(--neon-hero-hover-rgb, var(--neon-hero-rgb)) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(h1, h2, h3, h4, p, span:not(#dot), a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .smp-hero-h1, .smp-hero-subtitle, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game, #status, [data-main-hero-dot]) {
    transition:
        color var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-text-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        text-shadow var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"]) {
    --neon-hero-outline-color: var(--glow-color);
    --neon-hero-outline-shadow: color-mix(in srgb, var(--glow-color) 55%, transparent);
    border-color: var(--neon-hero-outline-color) !important;
    background: var(--neon-hero-glass-bg) !important;
    box-shadow:
        inset 0 0 24px color-mix(in srgb, var(--glow-color) 10%, transparent),
        -6px 0 18px -7px var(--neon-hero-outline-shadow) !important;
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        background var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-shift-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-stripe-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-outline-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-outline-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-button-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-active-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        --glow-color var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="accent"][data-neon-hero-fill="on"]::after {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-hero-fill-color) var(--neon-hero-fill-strong, 14%), transparent), color-mix(in srgb, var(--neon-hero-fill-color) var(--neon-hero-fill-soft, 7%), transparent)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-panel-bg);
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="gradient"][data-neon-hero-fill="on"]::after {
    --neon-hero-active-fill-color: var(--neon-hero-fill-color, var(--glow-color));
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-hero-active-fill-color) var(--neon-hero-fill-strong, 14%), transparent), color-mix(in srgb, var(--neon-hero-active-fill-color) var(--neon-hero-fill-soft, 7%), transparent)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-panel-bg);
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="gradient"][data-neon-hero-fill="on"]:is(:hover, :focus-within)::after {
    --neon-hero-active-fill-color: var(--neon-hero-fill-color-b, var(--glow-color));
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="gradient"][data-neon-hero-fill="on"]::after {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--glow-color) var(--neon-hero-fill-strong, 14%), transparent), color-mix(in srgb, var(--glow-color) var(--neon-hero-fill-soft, 7%), transparent)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-panel-bg);
    transition:
        background var(--neon-sync-duration) var(--neon-sync-ease),
        --glow-color var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-active-fill-color var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"]):hover,
html[data-site-theme="neon"] .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"]):focus-within {
    --neon-hero-outline-color: var(--glow-color);
    --neon-hero-outline-shadow: color-mix(in srgb, var(--glow-color) 64%, transparent);
    border-color: var(--neon-hero-outline-color) !important;
    box-shadow:
        inset 0 0 32px color-mix(in srgb, var(--glow-color) 12%, transparent),
        -8px 0 28px -8px var(--neon-hero-outline-shadow) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"]):hover::before,
html[data-site-theme="neon"] .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"]):focus-within::before {
    border-left-color: var(--neon-hero-stripe-color, var(--neon-hero-outline-color)) !important;
    box-shadow: inset 12px 0 18px -12px color-mix(in srgb, var(--neon-hero-stripe-color, var(--glow-color)) 64%, transparent) !important;
}

html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom:is(:hover, :focus-within) {
    box-shadow:
        inset 0 0 24px color-mix(in srgb, var(--glow-color, #ffffff) 16%, transparent),
        0 0 26px color-mix(in srgb, var(--glow-color, #ffffff) 28%, transparent) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="shuffle"] {
    background: var(--neon-hero-glass-bg) !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="shuffle"] {
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        background var(--neon-sync-duration) var(--neon-sync-ease),
        --glow-color 0s linear;
}

html[data-site-theme="neon"] #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style="shuffle"] {
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        background var(--neon-sync-duration) var(--neon-sync-ease),
        --glow-color 0s linear;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="shuffle"]::before {
    transition:
        border-left-width var(--neon-sync-duration) var(--neon-sync-ease),
        border-left-color 0s linear,
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style="shuffle"]::before {
    transition:
        border-left-width var(--neon-sync-duration) var(--neon-sync-ease),
        border-left-color 0s linear,
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="shuffle"][data-neon-hero-fill="on"]::after {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-hero-fill-color) var(--neon-hero-fill-strong, 14%), transparent), color-mix(in srgb, var(--neon-hero-fill-color) var(--neon-hero-fill-soft, 7%), transparent)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-panel-bg);
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    animation: rainbow-glow var(--neon-hero-rainbow-speed) linear infinite;
    border-color: var(--glow-color);
    outline: none !important;
    box-shadow: inset 0 0 24px color-mix(in srgb, var(--glow-color) 18%, transparent) !important;
    background: var(--neon-hero-glass-bg) !important;
}

/* Rainbow v1 hover-outer-glow: outer glow only on hover when toggle on. */
html[data-site-theme="neon"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"][data-neon-hero-hover-glow="on"]:is(:hover, :focus-within),
html[data-site-theme="neon"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync).neon-hero-box-custom[data-neon-hero-style="rainbow"][data-neon-hero-hover-glow="on"]:is(:hover, :focus-within) {
    box-shadow:
        inset 0 0 24px color-mix(in srgb, var(--glow-color) 18%, transparent),
        0 0 32px color-mix(in srgb, var(--glow-color) 32%, transparent) !important;
}

/* Rainbow v1 outline-reveal at rest: keep rainbow-glow (so --glow-color still cycles) but kill rainbow-outline. Border tinted to 24% of the live --glow-color so border dims like accent's outline-reveal at rest. Also covers :focus state so previously-clicked cards don't show full bright outline. */
html[data-site-theme="neon"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"][data-neon-hero-outline="hover"]:not(:hover),
html[data-site-theme="neon"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync).neon-hero-box-custom[data-neon-hero-style="rainbow"][data-neon-hero-outline="hover"]:not(:hover) {
    animation: rainbow-glow var(--neon-hero-rainbow-speed) linear infinite !important;
    border-color: color-mix(in srgb, var(--glow-color) 24%, transparent) !important;
    outline: none !important;
}

html[data-site-theme="neon"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"][data-neon-hero-outline="hover"]:is(.nav-card a.glass):focus:not(:hover),
html[data-site-theme="neon"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync).neon-hero-box-custom[data-neon-hero-style="rainbow"][data-neon-hero-outline="hover"]:focus:not(:hover) {
    border-color: color-mix(in srgb, var(--glow-color) 24%, transparent) !important;
    outline: none !important;
}

/* Force-suppress browser focus outline on all rainbow nav cards so leftover focus rings don't show as white. */
html[data-site-theme="neon"] body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"]:focus,
html[data-site-theme="neon"] body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"]:focus-visible {
    outline: none !important;
}


html[data-site-theme="neon"]:not([data-neon-rainbow-variant="v2"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"]::before {
    animation: none !important;
    border-left-style: solid !important;
    border-left-width: 5px !important;
    border-left-color: var(--glow-color) !important;
    box-shadow: inset 8px 0 14px -10px color-mix(in srgb, var(--glow-color) 55%, transparent) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="rainbow"][data-neon-hero-fill="on"]::after {
    background:
        radial-gradient(circle at 16% 18%, color-mix(in srgb, var(--glow-color) var(--neon-hero-fill-strong), transparent), transparent 34%),
        radial-gradient(circle at 86% 22%, color-mix(in srgb, var(--glow-color) var(--neon-hero-fill-medium), transparent), transparent 36%),
        radial-gradient(circle at 64% 92%, color-mix(in srgb, var(--glow-color) var(--neon-hero-fill-soft), transparent), transparent 40%),
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--glow-color) var(--neon-hero-fill-medium), transparent),
            color-mix(in srgb, #ffffff var(--neon-hero-fill-white), transparent) 46%,
            color-mix(in srgb, var(--glow-color) var(--neon-hero-fill-soft), transparent)
        ),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-panel-bg);
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-fill="off"] {
    background: var(--neon-hero-glass-bg) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-fill="off"]::after {
    background:
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-panel-bg);
}

html[data-site-theme="neon"] .neon-hero-box-custom :is(.carousel-viewport, .now-playing-card, .inner-entry, .site-guestbook-viewport, .site-guestbook-form, .site-guestbook-entry) {
    background:
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-subpanel-bg) !important;
    backdrop-filter: blur(var(--neon-hero-panel-blur, var(--neon-hero-blur, 15px))) !important;
    -webkit-backdrop-filter: blur(var(--neon-hero-panel-blur, var(--neon-hero-blur, 15px))) !important;
    transition:
        background var(--neon-sync-duration) var(--neon-sync-ease),
        backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-fill="on"]:is([data-neon-hero-style="accent"], [data-neon-hero-style="shuffle"])::after {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-hero-fill-color, var(--glow-color)) var(--neon-hero-fill-strong, 14%), transparent), color-mix(in srgb, var(--neon-hero-fill-color, var(--glow-color)) var(--neon-hero-fill-soft, 7%), transparent)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-panel-bg);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-fill="on"][data-neon-hero-style="gradient"]::after {
    --neon-hero-active-fill-color: var(--neon-hero-fill-color, var(--glow-color));
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-hero-active-fill-color) var(--neon-hero-fill-strong, 14%), transparent), color-mix(in srgb, var(--neon-hero-active-fill-color) var(--neon-hero-fill-soft, 7%), transparent)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-panel-bg);
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-fill="on"][data-neon-hero-style="gradient"]:is(:hover, :focus-within)::after {
    --neon-hero-active-fill-color: var(--neon-hero-fill-color-b, var(--glow-color));
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.carousel-viewport, .now-playing-card, .inner-entry, .site-guestbook-viewport, .site-guestbook-form, .site-guestbook-entry, .btn-glow) {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--glow-color) var(--neon-hero-subpanel-tint, 10%), var(--neon-hero-subpanel-bg)), var(--neon-hero-subpanel-bg)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)) !important;
    border-color: color-mix(in srgb, var(--glow-color) 78%, transparent) !important;
    box-shadow:
        inset 0 0 16px color-mix(in srgb, var(--glow-color) 8%, transparent),
        0 0 12px color-mix(in srgb, var(--glow-color) 10%, transparent) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="shuffle"][data-neon-hero-fill="on"]:is([data-neon-hero-shuffle-panel="match"], [data-neon-hero-shuffle-panel="random"]) :is(.carousel-viewport, .now-playing-card, .inner-entry, .site-guestbook-viewport, .site-guestbook-form, .site-guestbook-entry, .btn-glow) {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-hero-fill-color) var(--neon-hero-subpanel-tint, 10%), var(--neon-hero-subpanel-bg)), var(--neon-hero-subpanel-bg)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)) !important;
    border-color: color-mix(in srgb, var(--neon-hero-fill-color) 78%, transparent) !important;
    box-shadow:
        inset 0 0 16px color-mix(in srgb, var(--neon-hero-fill-color) 8%, transparent),
        0 0 12px color-mix(in srgb, var(--neon-hero-fill-color) 10%, transparent) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.box-title, .game-rotation-heading, .inner-entry h3) {
    background: none !important;
    color: var(--neon-tone-title) !important;
    -webkit-text-fill-color: var(--neon-tone-title) !important;
    text-shadow: 0 0 12px color-mix(in srgb, var(--glow-color, #fc00e3) 22%, transparent) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.box-subtitle, .game-rotation-live) {
    background: none !important;
    color: var(--neon-tone-strong) !important;
    -webkit-text-fill-color: var(--neon-tone-strong) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color, #fc00e3) 24%, transparent) !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-outline="hover"]:not(:hover):not(:focus-within) {
    border-color: color-mix(in srgb, var(--neon-hero-outline-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 24%, transparent) !important;
    outline-color: color-mix(in srgb, var(--neon-hero-outline-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 24%, transparent) !important;
}

/* Outline reveal: at rest under hover-shift OR rainbow mode, fade outline only (do NOT touch box-shadow; outer glow is controlled by hover-outer-glow toggle). High-specificity to beat hover-shift/rainbow sync rules. */
html[data-site-theme="neon"] body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom):is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"])[data-neon-hero-outline="hover"]:not(:hover):not(:focus-within),
html[data-site-theme="neon"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"])[data-neon-hero-outline="hover"]:not(:hover):not(:focus-within) {
    border-color: color-mix(in srgb, var(--neon-hero-outline-color, var(--neon-hero-shift-color, var(--glow-color, var(--neon-hero-color, #fc00e3)))) 24%, transparent) !important;
    outline-color: color-mix(in srgb, var(--neon-hero-outline-color, var(--neon-hero-shift-color, var(--glow-color, var(--neon-hero-color, #fc00e3)))) 24%, transparent) !important;
}

/* High-specificity nav-card title-glow rules to beat 10380/10399 default classic shadow. Covers gradient + rainbow. */
html[data-site-theme="neon"][data-neon-title-glow="none"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-glow="none"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:last-child {
    text-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-title-glow="theme"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-glow="theme"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:last-child {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 40%, transparent),
        0 0 18px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 24%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-glow="white"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-glow="white"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:last-child {
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.44),
        0 0 18px rgba(255, 255, 255, 0.26) !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-outline="hover"]:not(:hover):not(:focus-within)::after {
    border-color: transparent !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom) {
    --neon-title-glow-color: var(--neon-edge-tint-base, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3))));
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom):is(:hover, :focus-within) {
    --neon-title-glow-color: var(--neon-edge-tint-base, var(--glow-color, var(--neon-hero-color, #fc00e3)));
}

html[data-site-theme="neon"][data-neon-title-mode="default"] :is(.site-guestbook-hero-heading, .game-rotation-heading, .glass > .box-title, .smp-hero-glass > .box-title, .nav-card a.glass .flex.flex-col > div:first-child) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow:
        0 0 10px rgba(255, 255, 255, 0.45),
        0 0 18px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3)))) 22%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"] :is(.site-widget-title, .site-guestbook-comments-title, .site-guestbook-form h3, .game-rotation-live, .glass > .box-subtitle, .nav-card a.glass .flex.flex-col > div:last-child) {
    color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3)))) 82%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3)))) 82%, #ffffff) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3)))) 32%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] :is(.glass, .site-widget-card, .site-guestbook-shell, .smp-hero-glass) {
    --neon-edge-tint-base: var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3)));
    --neon-edge-tint-title: color-mix(in srgb, var(--neon-edge-tint-base) 58%, #ffffff);
    --neon-edge-tint-strong: color-mix(in srgb, var(--neon-edge-tint-base) 76%, #ffffff);
    --neon-edge-tint-body: color-mix(in srgb, var(--neon-edge-tint-base) 28%, #d7d8e4);
    --neon-edge-tint-muted: color-mix(in srgb, var(--neon-edge-tint-base) 20%, #8c8d99);
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] .neon-hero-box-custom:is(:hover, :focus-within) {
    --neon-edge-tint-base: var(--glow-color, var(--neon-hero-color, #fc00e3));
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] :is(.site-guestbook-hero-heading, .game-rotation-heading, .glass > .box-title, .smp-hero-glass > .box-title, .inner-entry h3, .nav-card a.glass .flex.flex-col > div:first-child) {
    color: var(--neon-edge-tint-title) !important;
    -webkit-text-fill-color: var(--neon-edge-tint-title) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] :is(.site-widget-title, .site-guestbook-comments-title, .site-guestbook-form h3, .game-rotation-live, .glass > .box-subtitle, .nav-card a.glass .flex.flex-col > div:last-child) {
    color: var(--neon-edge-tint-strong) !important;
    -webkit-text-fill-color: var(--neon-edge-tint-strong) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] :is(.box-body, .inner-entry p, .now-playing-card p, .site-currently-list li, .site-guestbook-entry-message, .site-guestbook-status, #what-im-feeling-copy, .cmd-line span, .glass .text-gray-400, .glass .text-gray-500, .glass .text-gray-600, .smp-hero-glass .text-gray-400, .smp-hero-glass .text-gray-500, .smp-hero-glass .text-gray-600) {
    color: var(--neon-edge-tint-body) !important;
    -webkit-text-fill-color: var(--neon-edge-tint-body) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] :is(#main-current-game, .inner-entry p.font-black, .inner-entry .font-black, .inner-entry .text-white, .inner-entry .uppercase, .site-guestbook-entry-meta, .site-guestbook-entry-site, code, .cmd-line code, .btn-glow, .plugin-link) {
    color: var(--neon-edge-tint-strong) !important;
    -webkit-text-fill-color: var(--neon-edge-tint-strong) !important;
}

html[data-site-theme="neon"] .game-platform-badge,
html[data-site-theme="neon"] span.game-platform-badge,
html[data-site-theme="neon"][data-neon-title-mode] .neon-hero-box-custom[data-neon-hero-style] span.game-platform-badge,
html[data-site-theme="neon"][data-neon-variant] .neon-hero-box-custom[data-neon-hero-style] span.game-platform-badge,
html[data-site-theme="vaporwave"] .game-platform-badge,
html[data-site-theme="vaporwave"] span.game-platform-badge {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] .plugin-link:is(:hover, :focus-visible) {
    color: var(--neon-edge-tint-base) !important;
    -webkit-text-fill-color: var(--neon-edge-tint-base) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--neon-edge-tint-base) 55%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within) .flex.flex-col > div:first-child {
    color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 58%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 58%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within) .flex.flex-col > div:last-child {
    color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 76%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-title-mode="white"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:last-child,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-title-mode="white"]) .neon-hero-box-custom :is(.box-subtitle, .game-rotation-live) {
    color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 82%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 82%, #ffffff) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 32%, transparent) !important;
    transition:
        color var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-text-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        text-shadow var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-title-mode="white"]) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-title-mode="white"]) .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.box-subtitle, .game-rotation-live) {
    color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 82%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 82%, #ffffff) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 32%, transparent) !important;
    transition:
        color var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-text-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        text-shadow var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-title-mode="white"]) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within) .flex.flex-col > div:last-child,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-title-mode="white"]) .neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within) :is(.box-subtitle, .game-rotation-live) {
    color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 82%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 82%, #ffffff) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 32%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"] .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.box-title, .box-subtitle, .game-rotation-heading, .game-rotation-live, .inner-entry h3) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .game-rotation-live, .glass > .box-title, .glass > .box-subtitle, .smp-hero-glass > .box-title, .inner-entry h3, .nav-card a.glass .flex.flex-col > div:first-child, .nav-card a.glass .flex.flex-col > div:last-child) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-glow="none"] :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .game-rotation-live, .glass > .box-title, .glass > .box-subtitle, .smp-hero-glass > .box-title, .inner-entry h3, .nav-card a.glass .flex.flex-col > div:first-child, .nav-card a.glass .flex.flex-col > div:last-child) {
    text-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-title-glow="theme"] :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .game-rotation-live, .glass > .box-title, .glass > .box-subtitle, .smp-hero-glass > .box-title, .inner-entry h3, .nav-card a.glass .flex.flex-col > div:first-child, .nav-card a.glass .flex.flex-col > div:last-child) {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-title-glow-color, var(--neon-edge-tint-base, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3))))) 38%, transparent),
        0 0 16px color-mix(in srgb, var(--neon-title-glow-color, var(--neon-edge-tint-base, var(--glow-color, var(--neon-hero-color, var(--site-guestbook-accent, #fc00e3))))) 22%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-glow="white"] :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .game-rotation-live, .glass > .box-title, .glass > .box-subtitle, .smp-hero-glass > .box-title, .inner-entry h3, .nav-card a.glass .flex.flex-col > div:first-child, .nav-card a.glass .flex.flex-col > div:last-child) {
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.42),
        0 0 16px rgba(255, 255, 255, 0.24) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="shuffle"] {
    --neon-shuffle-text-color: var(--neon-hero-text-color, var(--glow-color, var(--neon-hero-color, #fc00e3)));
    --neon-title-glow-color: var(--neon-shuffle-text-color);
    --neon-edge-tint-base: var(--neon-shuffle-text-color);
    color: var(--neon-shuffle-text-color) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="shuffle"] :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600) {
    color: var(--neon-shuffle-text-color) !important;
    -webkit-text-fill-color: var(--neon-shuffle-text-color) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="shuffle"] :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="shuffle"] .flex.flex-col > div:first-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="shuffle"] .game-platform-badge {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="shuffle"]) {
    --neon-shuffle-text-color: #ffffff;
    color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="shuffle"]) :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, .nav-card a.glass .flex.flex-col > div:first-child, .nav-card a.glass .flex.flex-col > div:last-child) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:last-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="shuffle"]) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .game-rotation-live, .glass > .box-title, .glass > .box-subtitle, .smp-hero-glass > .box-title, .inner-entry h3, .nav-card a.glass .flex.flex-col > div:first-child, .nav-card a.glass .flex.flex-col > div:last-child) {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 38%, transparent),
        0 0 16px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 22%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:last-child {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 38%, transparent),
        0 0 16px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 22%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="shuffle"]) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .game-rotation-live, .glass > .box-title, .glass > .box-subtitle, .smp-hero-glass > .box-title, .inner-entry h3, .nav-card a.glass .flex.flex-col > div:first-child, .nav-card a.glass .flex.flex-col > div:last-child) {
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.42),
        0 0 16px rgba(255, 255, 255, 0.24) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:last-child {
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.42),
        0 0 16px rgba(255, 255, 255, 0.24) !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom {
    --neon-widget-color: var(--glow-color, #ff0059);
    color: color-mix(in srgb, var(--neon-widget-color) 18%, #ffffff) !important;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-widget-color) 9%, transparent), color-mix(in srgb, var(--neon-widget-color) 5%, transparent)),
        rgba(10, 0, 7, 0.9) !important;
    border: 1px solid var(--neon-widget-color) !important;
    border-radius: 6px !important;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--neon-widget-color) 8%, transparent),
        0 0 16px color-mix(in srgb, var(--neon-widget-color) 18%, transparent) !important;
    transform: none !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom:is(:hover, :focus-within) {
    color: color-mix(in srgb, var(--neon-widget-color) 18%, #ffffff) !important;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-widget-color) 9%, transparent), color-mix(in srgb, var(--neon-widget-color) 5%, transparent)),
        rgba(10, 0, 7, 0.9) !important;
    border-color: var(--neon-widget-color) !important;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--neon-widget-color) 8%, transparent),
        0 0 16px color-mix(in srgb, var(--neon-widget-color) 18%, transparent) !important;
    transform: none !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom::before {
    display: block !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom:is(.site-widget-counter, .site-widget-currently)::before {
    display: none !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom .site-widget-title {
    color: color-mix(in srgb, var(--neon-widget-color) 82%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-widget-color) 82%, #ffffff) !important;
    background: transparent !important;
    border-bottom-color: transparent !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom .site-hit-counter {
    background: color-mix(in srgb, var(--neon-widget-color) 5%, rgba(0, 0, 0, 0.62)) !important;
    border: 1px solid var(--neon-widget-color) !important;
    border-radius: 4px !important;
    box-shadow: inset 0 0 12px color-mix(in srgb, var(--neon-widget-color) 6%, transparent) !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom .site-hit-counter-digit {
    color: color-mix(in srgb, var(--neon-widget-color) 38%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-widget-color) 38%, #ffffff) !important;
    background: rgba(0, 0, 0, 0.42) !important;
    border-color: var(--neon-widget-color) !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom .site-currently-list li {
    color: color-mix(in srgb, var(--neon-widget-color) 18%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-widget-color) 18%, #ffffff) !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom .site-currently-list li::before {
    background: var(--neon-widget-color) !important;
    box-shadow: 0 0 8px color-mix(in srgb, var(--neon-widget-color) 50%, transparent) !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom .site-currently-updated {
    color: color-mix(in srgb, var(--neon-widget-color) 28%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-widget-color) 28%, #ffffff) !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom,
html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom:is(:hover, :focus-within) {
    background: rgba(13, 0, 8, 0.88) !important;
    border: 2px solid color-mix(in srgb, var(--neon-widget-color) 58%, transparent) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    transform: none !important;
    transition:
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        background var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom .site-hit-counter {
    background: rgba(0, 0, 0, 0.2) !important;
    border-color: var(--neon-widget-color) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom .site-hit-counter-digit {
    color: color-mix(in srgb, var(--neon-widget-color) 38%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-widget-color) 38%, #ffffff) !important;
    background: rgba(0, 0, 0, 0.28) !important;
    border-color: var(--neon-widget-color) !important;
    box-shadow: none !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom .site-currently-list li::before {
    box-shadow: none !important;
}

html[data-site-theme="neon"] .site-widget-counter.neon-hero-box-custom {
    --neon-widget-counter-color: var(--glow-color, var(--neon-hero-color, #ff0059));
    --neon-widget-counter-bright: color-mix(in srgb, var(--neon-widget-counter-color) 82%, #ffffff);
}

html[data-site-theme="neon"] .site-widget-counter.neon-hero-box-custom .site-widget-title {
    color: var(--neon-widget-counter-bright) !important;
    -webkit-text-fill-color: var(--neon-widget-counter-bright) !important;
    background: transparent !important;
    border-bottom-color: transparent !important;
}

html[data-site-theme="neon"] .site-widget-counter.neon-hero-box-custom .site-hit-counter {
    background: transparent !important;
    border-color: var(--neon-widget-counter-bright) !important;
    box-shadow: none !important;
}

html[data-site-theme="neon"] .site-widget-counter.neon-hero-box-custom .site-hit-counter-digit {
    color: var(--neon-widget-counter-bright) !important;
    -webkit-text-fill-color: var(--neon-widget-counter-bright) !important;
    border-color: var(--neon-widget-counter-bright) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body .site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"],
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body .site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"]:is(:hover, :focus-within) {
    animation: rainbow-glow var(--neon-hero-rainbow-speed) linear infinite !important;
    --neon-widget-color: var(--glow-color) !important;
    --neon-widget-edge-color: var(--glow-color) !important;
    --neon-widget-counter-color: var(--glow-color) !important;
    --neon-widget-counter-bright: var(--glow-color) !important;
    color: var(--glow-color) !important;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--glow-color) 10%, transparent), color-mix(in srgb, var(--glow-color) 5%, transparent)),
        rgba(13, 0, 8, 0.88) !important;
    border: 2px solid var(--glow-color) !important;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--glow-color) 8%, transparent),
        0 0 16px color-mix(in srgb, var(--glow-color) 18%, transparent) !important;
    transform: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body .site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-widget-title,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body .site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-widget-title > span,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body .site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-list li,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body .site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-updated,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body .site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body .site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter-digit {
    animation: none !important;
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;
    border-color: inherit !important;
    text-shadow: 0 0 10px color-mix(in srgb, currentColor 32%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body .site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter {
    background: color-mix(in srgb, var(--glow-color) 5%, rgba(0, 0, 0, 0.62)) !important;
    box-shadow: inset 0 0 12px color-mix(in srgb, var(--glow-color) 6%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body .site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-list li::before {
    animation: rainbow-glow var(--neon-hero-rainbow-speed, 7s) linear infinite !important;
    animation-delay: var(--neon-hero-rainbow-delay, 0s) !important;
    background: var(--glow-color) !important;
    box-shadow: 0 0 8px color-mix(in srgb, var(--glow-color) 58%, transparent) !important;
}

html[data-site-theme="neon"] .neon-style-main-preview {
    min-height: 0;
    padding: 10px;
}

html[data-site-theme="neon"] .neon-style-hero-preview-grid {
    grid-template-columns: repeat(auto-fill, minmax(126px, 1fr));
    gap: 8px;
    max-height: 250px;
    align-items: start;
}

html[data-site-theme="neon"] .neon-style-preview-box.neon-hero-box-custom {
    min-height: 76px !important;
    max-height: 92px;
    align-content: start;
    gap: 5px;
    padding: 10px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    transform: none !important;
}

html[data-site-theme="neon"] .neon-style-preview-box.neon-hero-box-custom:is(:hover, :focus-within) {
    transform: none !important;
}

html[data-site-theme="neon"] .neon-style-preview-box.neon-hero-box-custom::before {
    border-radius: inherit !important;
}

html[data-site-theme="neon"] .neon-style-preview-box.neon-hero-box-custom :is(.box-title, .game-rotation-heading, .site-guestbook-hero-heading, .site-widget-title) {
    max-width: 100%;
    margin: 0 !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 10px !important;
    line-height: 1.15 !important;
    letter-spacing: 0.08em !important;
    text-shadow: none !important;
    white-space: normal;
    overflow-wrap: anywhere;
}

html[data-site-theme="neon"] .neon-style-preview-box.neon-hero-box-custom :is(.box-subtitle, .game-rotation-live, .site-guestbook-entry-message, .site-guestbook-entry-meta, .site-currently-list li) {
    color: color-mix(in srgb, currentColor 74%, rgba(255, 255, 255, 0.68)) !important;
    -webkit-text-fill-color: color-mix(in srgb, currentColor 74%, rgba(255, 255, 255, 0.68)) !important;
    font-size: 8px !important;
    line-height: 1.25 !important;
    letter-spacing: 0.02em !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"] .neon-style-preview-box.neon-hero-box-custom .site-guestbook-entry {
    margin: 0 !important;
    padding: 5px !important;
    border-radius: 5px !important;
    overflow: hidden !important;
}

html[data-site-theme="neon"] .neon-style-preview-box.neon-hero-box-custom .site-hit-counter {
    min-height: 0 !important;
    padding: 2px !important;
    gap: 1px !important;
    justify-content: flex-start;
}

html[data-site-theme="neon"] .neon-style-preview-box.neon-hero-box-custom .site-hit-counter-digit {
    min-width: 9px !important;
    height: 12px !important;
    padding: 0 1px !important;
    font-size: 8px !important;
    line-height: 12px !important;
}

html[data-site-theme="neon"] .neon-style-preview-box.neon-hero-box-custom .site-currently-list {
    display: grid;
    gap: 4px;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

[data-main-hero-dot] {
    color: var(--main-hero-dot-color, currentColor) !important;
    -webkit-text-fill-color: var(--main-hero-dot-color, currentColor) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="rainbow"] :is(.carousel-viewport, .now-playing-card, .inner-entry, .site-guestbook-viewport, .site-guestbook-form, .site-guestbook-entry) {
    background:
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        color-mix(in srgb, var(--glow-color) 12%, var(--neon-hero-subpanel-bg)) !important;
    border-color: color-mix(in srgb, var(--glow-color) 78%, transparent) !important;
    box-shadow:
        inset 0 0 16px color-mix(in srgb, var(--glow-color) 12%, transparent),
        0 0 12px color-mix(in srgb, var(--glow-color) 16%, transparent) !important;
}

/* --- UNIVERSAL NEON COLORS --- */
.neon-green { --glow-color: #77ff00; --glow-rgb: 119, 255, 0; }
.neon-blue { --glow-color: #001aff; --glow-rgb: 0, 26, 255; }
.neon-purple { --glow-color: #9d00ff; --glow-rgb: 157, 0, 255; }
.neon-dank-purple { --glow-color: #5d00ff; --glow-rgb: 93, 0, 255; }
.neon-hot-pink { --glow-color: #fe2858; --glow-rgb: 254, 40, 88; }
.neon-cyan { --glow-color: #00ffff; --glow-rgb: 0, 255, 255; }
.neon-yellow { --glow-color: #fcfc03; --glow-rgb: 252, 252, 3; }
.neon-pink { --glow-color: #fc00e3; --glow-rgb: 252, 0, 227; }
.neon-orange { --glow-color: #ff8800; --glow-rgb: 255, 136, 0; }
.neon-mint { --glow-color: #00fca0; --glow-rgb: 0, 252, 160; }
.neon-red { --glow-color: #fa0000; --glow-rgb: 250, 0, 0; }
.neon-white { --glow-color: #ffffff; --glow-rgb: 255, 255, 255; }
.discord-color { --glow-color: #5865F2; --glow-rgb: 88, 101, 242; }
.visitor-log-blue { --glow-color: #0011ff; --glow-rgb: 0, 17, 255; }
.neon-green2 { --glow-color: #9bff29; --glow-rgb: 155, 255, 41; }
.phthalo-green { --glow-color: #00334d; --glow-rgb: 0, 51, 77; }
.phthalo-green2 { --glow-color: #003233; --glow-rgb: 0, 50, 51; }
.dark-maroon { --glow-color: #38002c; --glow-rgb: 56, 0, 44; }
/* --- HOVER NEON COLOR VARIANTS --- */
@property --neon-hero-progress {
    syntax: '<number>';
    inherits: true;
    initial-value: 0;
}

@property --glow-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

@property --neon-hero-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

@property --neon-hero-hover-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    --neon-hero-shift-color: var(--glow-color);
    --neon-hero-stripe-color: var(--glow-color);
    --neon-hero-outline-color: var(--glow-color);
    --neon-title-glow-color: var(--glow-color);
}

html[data-neon-hero-rainbow-js="1"] .neon-hero-box-custom[data-neon-hero-style="rainbow"],
html[data-neon-hero-rainbow-js="1"] .neon-hero-box-custom[data-neon-hero-style="rainbow"]::before,
html[data-neon-hero-rainbow-js="1"] .neon-hero-box-custom[data-neon-hero-style="rainbow"] * {
    animation-name: none !important;
}


@property --neon-hero-shift-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

@property --neon-hero-stripe-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

@property --neon-hero-outline-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

@property --neon-hero-outline-shadow {
    syntax: '<color>';
    inherits: true;
    initial-value: rgba(252, 0, 227, 0.55);
}

@property --neon-rainbow-border-shift {
    syntax: '<length>';
    inherits: true;
    initial-value: 0px;
}

@property --neon-halo-g0 { syntax: '<color>'; inherits: true; initial-value: #ff0055; }
@property --neon-halo-g1 { syntax: '<color>'; inherits: true; initial-value: #ff6a00; }
@property --neon-halo-g2 { syntax: '<color>'; inherits: true; initial-value: #ffd000; }
@property --neon-halo-g3 { syntax: '<color>'; inherits: true; initial-value: #26ff66; }
@property --neon-halo-g4 { syntax: '<color>'; inherits: true; initial-value: #00d9ff; }

@property --neon-title-glow-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

@property --neon-hero-fill-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

@property --neon-hero-active-fill-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

@property --neon-cta-sync-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

@property --neon-hero-button-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #fc00e3;
}

.neon-hover-green:hover    { --glow-color: #77ff00; --glow-rgb: 119, 255, 0; }
.neon-hover-blue:hover     { --glow-color: #001aff; --glow-rgb: 0, 26, 255; }
.neon-hover-purple:hover   { --glow-color: #9d00ff; --glow-rgb: 157, 0, 255; }
.neon-hover-hot-pink:hover { --glow-color: #fe2858; --glow-rgb: 254, 40, 88; }
.neon-hover-cyan:hover     { --glow-color: #00ffff; --glow-rgb: 0, 255, 255; }
.neon-hover-yellow:hover   { --glow-color: #ecfc03; --glow-rgb: 236, 252, 3; }
.neon-hover-pink:hover     { --glow-color: #fc00e3; --glow-rgb: 252, 0, 227; }
.neon-hover-orange:hover   { --glow-color: #ff8800; --glow-rgb: 255, 136, 0; }
.neon-hover-mint:hover     { --glow-color: #00fca0; --glow-rgb: 0, 252, 160; }
.neon-hover-red:hover      { --glow-color: #fa0000; --glow-rgb: 250, 0, 0; }
.neon-hover-white:hover    { --glow-color: #ffffff; --glow-rgb: 255, 255, 255; }
.neon-hover-ember:hover    { --glow-color: #ff7a00; --glow-rgb: 255, 122, 0; }
.dark-hover-evergreen:hover { --glow-color: #004a37; --glow-rgb: 0, 74, 55; }

/* --- RAINBOW NEON --- */
@keyframes rainbow-bar {
    0%   { border-left-color: #ff0055; box-shadow: inset 8px 0 14px -10px rgba(255,0,85,0.55); }
    14%  { border-left-color: #ff8800; box-shadow: inset 8px 0 14px -10px rgba(255,136,0,0.55); }
    28%  { border-left-color: #fcfc03; box-shadow: inset 8px 0 14px -10px rgba(252,252,3,0.55); }
    42%  { border-left-color: #00ff88; box-shadow: inset 8px 0 14px -10px rgba(0,255,136,0.55); }
    57%  { border-left-color: #00ffff; box-shadow: inset 8px 0 14px -10px rgba(0,255,255,0.55); }
    71%  { border-left-color: #0088ff; box-shadow: inset 8px 0 14px -10px rgba(0,136,255,0.55); }
    85%  { border-left-color: #cc00ff; box-shadow: inset 8px 0 14px -10px rgba(204,0,255,0.55); }
    100% { border-left-color: #ff0055; box-shadow: inset 8px 0 14px -10px rgba(255,0,85,0.55); }
}
@keyframes rainbow-glow {
    0%   { --glow-color: #ff0055; color: #ff0055; -webkit-text-fill-color: #ff0055; }
    14%  { --glow-color: #ff8800; color: #ff8800; -webkit-text-fill-color: #ff8800; }
    28%  { --glow-color: #fcfc03; color: #fcfc03; -webkit-text-fill-color: #fcfc03; }
    42%  { --glow-color: #00ff88; color: #00ff88; -webkit-text-fill-color: #00ff88; }
    57%  { --glow-color: #00ffff; color: #00ffff; -webkit-text-fill-color: #00ffff; }
    71%  { --glow-color: #0088ff; color: #0088ff; -webkit-text-fill-color: #0088ff; }
    85%  { --glow-color: #cc00ff; color: #cc00ff; -webkit-text-fill-color: #cc00ff; }
    100% { --glow-color: #ff0055; color: #ff0055; -webkit-text-fill-color: #ff0055; }
}
@keyframes rainbow-outline {
    0%   { border-color: #ff0055; }
    14%  { border-color: #ff8800; }
    28%  { border-color: #fcfc03; }
    42%  { border-color: #00ff88; }
    57%  { border-color: #00ffff; }
    71%  { border-color: #0088ff; }
    85%  { border-color: #cc00ff; }
    100% { border-color: #ff0055; }
}
@keyframes neon-rainbow-border-pan {
    from { --neon-rainbow-border-shift: 0px; }
    to { --neon-rainbow-border-shift: -520px; }
}
@keyframes rainbow-glow-v2 {
    0%    { --glow-color: #ff0055; }
    12.5% { --glow-color: #ff6a00; }
    25%   { --glow-color: #ffd000; }
    37.5% { --glow-color: #26ff66; }
    50%   { --glow-color: #00d9ff; }
    62.5% { --glow-color: #006bff; }
    75%   { --glow-color: #a000ff; }
    87.5% { --glow-color: #ff00c8; }
    100%  { --glow-color: #ff0055; }
}
@keyframes rainbow-halo-spread-v2 {
    0%    { --neon-halo-g0: #ff0055; --neon-halo-g4: #ff00c8; --neon-halo-h0: #ff0055; --neon-halo-h1: #ff6a00; --neon-halo-h2: #ffd000; --neon-halo-h3: #26ff66; --neon-halo-h4: #00d9ff; --neon-halo-h5: #006bff; --neon-halo-h6: #a000ff; --neon-halo-h7: #ff00c8; }
    12.5% { --neon-halo-g0: #ff6a00; --neon-halo-g4: #ff0055; --neon-halo-h0: #ff6a00; --neon-halo-h1: #ffd000; --neon-halo-h2: #26ff66; --neon-halo-h3: #00d9ff; --neon-halo-h4: #006bff; --neon-halo-h5: #a000ff; --neon-halo-h6: #ff00c8; --neon-halo-h7: #ff0055; }
    25%   { --neon-halo-g0: #ffd000; --neon-halo-g4: #ff6a00; --neon-halo-h0: #ffd000; --neon-halo-h1: #26ff66; --neon-halo-h2: #00d9ff; --neon-halo-h3: #006bff; --neon-halo-h4: #a000ff; --neon-halo-h5: #ff00c8; --neon-halo-h6: #ff0055; --neon-halo-h7: #ff6a00; }
    37.5% { --neon-halo-g0: #26ff66; --neon-halo-g4: #ffd000; --neon-halo-h0: #26ff66; --neon-halo-h1: #00d9ff; --neon-halo-h2: #006bff; --neon-halo-h3: #a000ff; --neon-halo-h4: #ff00c8; --neon-halo-h5: #ff0055; --neon-halo-h6: #ff6a00; --neon-halo-h7: #ffd000; }
    50%   { --neon-halo-g0: #00d9ff; --neon-halo-g4: #26ff66; --neon-halo-h0: #00d9ff; --neon-halo-h1: #006bff; --neon-halo-h2: #a000ff; --neon-halo-h3: #ff00c8; --neon-halo-h4: #ff0055; --neon-halo-h5: #ff6a00; --neon-halo-h6: #ffd000; --neon-halo-h7: #26ff66; }
    62.5% { --neon-halo-g0: #006bff; --neon-halo-g4: #00d9ff; --neon-halo-h0: #006bff; --neon-halo-h1: #a000ff; --neon-halo-h2: #ff00c8; --neon-halo-h3: #ff0055; --neon-halo-h4: #ff6a00; --neon-halo-h5: #ffd000; --neon-halo-h6: #26ff66; --neon-halo-h7: #00d9ff; }
    75%   { --neon-halo-g0: #a000ff; --neon-halo-g4: #006bff; --neon-halo-h0: #a000ff; --neon-halo-h1: #ff00c8; --neon-halo-h2: #ff0055; --neon-halo-h3: #ff6a00; --neon-halo-h4: #ffd000; --neon-halo-h5: #26ff66; --neon-halo-h6: #00d9ff; --neon-halo-h7: #006bff; }
    87.5% { --neon-halo-g0: #ff00c8; --neon-halo-g4: #a000ff; --neon-halo-h0: #ff00c8; --neon-halo-h1: #ff0055; --neon-halo-h2: #ff6a00; --neon-halo-h3: #ffd000; --neon-halo-h4: #26ff66; --neon-halo-h5: #00d9ff; --neon-halo-h6: #006bff; --neon-halo-h7: #a000ff; }
    100%  { --neon-halo-g0: #ff0055; --neon-halo-g4: #ff00c8; --neon-halo-h0: #ff0055; --neon-halo-h1: #ff6a00; --neon-halo-h2: #ffd000; --neon-halo-h3: #26ff66; --neon-halo-h4: #00d9ff; --neon-halo-h5: #006bff; --neon-halo-h6: #a000ff; --neon-halo-h7: #ff00c8; }
}
@property --neon-hero-rainbow-tile {
    syntax: '<length>';
    initial-value: 520px;
    inherits: true;
}
@keyframes neon-rainbow-border-pan-v2 {
    from { background-position: 0 center; }
    to { background-position: -520px center; }
}
@keyframes neon-rainbow-fill-pan-v2 {
    from { background-position: 0 center; }
    to { background-position: -520px center; }
}
.neon-rainbow {
    --glow-color: #ff0055;
    animation: rainbow-glow 4s linear infinite;
    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.3s ease;
}
.neon-rainbow::before {
    animation: rainbow-bar 4s linear infinite;
    transition: border-left-width 0.15s ease;
}

/* --- FLOATING ANIMATION --- */
@keyframes float { 
    0%, 100% { transform: translateY(0); } 
    50% { transform: translateY(-12px); } 
}
.float-wrapper { animation: float 5s ease-in-out infinite; }

/* --- CUSTOM SCROLLBARS --- (.custom-scroll uses same rules as html:not([data-site-theme="win98"]) *::-webkit-scrollbar*) */

/* --- GLOBAL DYNAMIC NEON BUTTONS --- */
.btn-glow,
.btn-glow:link,
.btn-glow:visited {
    background-color: color-mix(in srgb, var(--glow-color) 20%, transparent);
    border: 1px solid color-mix(in srgb, var(--glow-color) 65%, transparent);
    color: var(--glow-color);
    box-shadow: 0 0 15px color-mix(in srgb, var(--glow-color) 20%, transparent);
    cursor: pointer;
    outline: none;
    text-decoration: none;
    transition:
        transform 0.3s ease,
        color var(--neon-sync-duration) var(--neon-sync-ease),
        background-color var(--neon-sync-duration) var(--neon-sync-ease),
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease);
}
.btn-glow:hover,
.btn-glow:focus-visible {
    background-color: color-mix(in srgb, var(--glow-color) 40%, transparent);
    border-color: color-mix(in srgb, var(--glow-color) 40%, transparent);
    color: var(--glow-color);
    box-shadow: 0 0 25px color-mix(in srgb, var(--glow-color) 40%, transparent);
    text-decoration: none;
    transform: scale(1.02);
}
.btn-glow:active {
    transform: scale(0.98);
}

.game-rotation-live {
    color: var(--glow-color);
}

.game-rotation-cta,
.game-rotation-cta:link,
.game-rotation-cta:visited,
.game-rotation-cta:hover,
.game-rotation-cta:focus-visible,
.game-rotation-cta:active,
.game-rotation-cta .game-rotation-cta-label {
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
    text-shadow: none !important;
}

.game-rotation-cta,
.game-rotation-cta:link,
.game-rotation-cta:visited {
    background-color: color-mix(in srgb, var(--glow-color) 20%, transparent) !important;
    border: 0 !important;
    box-shadow:
        inset 0 0 0 1px var(--glow-color),
        0 0 15px color-mix(in srgb, var(--glow-color) 20%, transparent) !important;
    cursor: pointer;
    outline: none !important;
    text-decoration: none;
    position: relative;
    isolation: isolate;
    overflow: visible;
    transition: transform 0.3s ease;
}

.game-rotation-cta:hover,
.game-rotation-cta:focus-visible {
    background-color: color-mix(in srgb, var(--glow-color) 40%, transparent) !important;
    box-shadow:
        inset 0 0 0 1px var(--glow-color),
        0 0 25px color-mix(in srgb, var(--glow-color) 40%, transparent) !important;
    text-decoration: none;
    transform: scale(1.02);
}

.game-rotation-cta:active {
    transform: scale(0.98);
}

html[data-site-theme="neon"] #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style="gradient"] .game-rotation-cta,
html[data-site-theme="neon"] #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style="gradient"] .game-rotation-cta:link,
html[data-site-theme="neon"] #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style="gradient"] .game-rotation-cta:visited {
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
    background: color-mix(in srgb, var(--glow-color) 14%, rgba(0, 0, 0, 0.82)) !important;
    border-color: var(--glow-color) !important;
    outline-color: var(--glow-color) !important;
    box-shadow:
        inset 0 0 0 1px var(--glow-color),
        0 0 14px color-mix(in srgb, var(--glow-color) 22%, transparent) !important;
    text-shadow: 0 0 8px color-mix(in srgb, var(--glow-color) 32%, transparent) !important;
}

html[data-site-theme="neon"] #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style="gradient"] .game-rotation-cta .game-rotation-cta-label {
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
}

html[data-site-theme="neon"] #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style="gradient"] .game-rotation-cta:hover,
html[data-site-theme="neon"] #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style="gradient"] .game-rotation-cta:focus-visible {
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
    background: color-mix(in srgb, var(--glow-color) 24%, rgba(0, 0, 0, 0.78)) !important;
    border-color: var(--glow-color) !important;
    outline-color: var(--glow-color) !important;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--glow-color) 18%, transparent),
        inset 0 0 0 1px var(--glow-color),
        0 0 24px color-mix(in srgb, var(--glow-color) 34%, transparent) !important;
    text-decoration: none;
    text-shadow: 0 0 8px color-mix(in srgb, var(--glow-color) 42%, transparent) !important;
    transform: scale(1.02);
}

html[data-site-theme="neon"] #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style="gradient"] .game-rotation-cta:hover .game-rotation-cta-label,
html[data-site-theme="neon"] #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style="gradient"] .game-rotation-cta:focus-visible .game-rotation-cta-label {
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.about-link, .btn-glow, .game-rotation-cta, .site-guestbook-actions button) {
    --neon-cta-sync-color: var(--neon-hero-shift-color, var(--neon-hero-button-color, var(--glow-color, var(--neon-hero-color, #fc00e3))));
    color: color-mix(in srgb, var(--neon-cta-sync-color) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-cta-sync-color) 76%, #ffffff) !important;
    background: color-mix(in srgb, var(--neon-cta-sync-color) 14%, rgba(0, 0, 0, 0.82)) !important;
    border-color: color-mix(in srgb, var(--neon-cta-sync-color) 76%, rgba(255, 255, 255, 0.16)) !important;
    outline-color: color-mix(in srgb, var(--neon-cta-sync-color) 76%, rgba(255, 255, 255, 0.16)) !important;
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--neon-cta-sync-color) 18%, transparent),
        0 0 14px color-mix(in srgb, var(--neon-cta-sync-color) 22%, transparent) !important;
    text-shadow: 0 0 8px color-mix(in srgb, var(--neon-cta-sync-color) 42%, transparent) !important;
    transition:
        transform 0.3s ease,
        color var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-text-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        background var(--neon-sync-duration) var(--neon-sync-ease),
        background-color var(--neon-sync-duration) var(--neon-sync-ease),
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        outline-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        text-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-cta-sync-color var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom)[data-neon-hero-style="gradient"] .game-rotation-cta .game-rotation-cta-label {
    color: color-mix(in srgb, var(--neon-cta-sync-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-cta-sync-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 76%, #ffffff) !important;
    transition:
        color var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-text-fill-color var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom)[data-neon-hero-style="gradient"]:is(:hover, :focus-within) :is(.about-link, .btn-glow, .game-rotation-cta, .site-guestbook-actions button) {
    --neon-cta-sync-color: var(--neon-hero-shift-color, var(--neon-hero-button-color, var(--neon-hero-hover-color, var(--glow-color, var(--neon-hero-color, #fc00e3)))));
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom)[data-neon-hero-style="gradient"]:is(:hover, :focus-within) .game-rotation-cta .game-rotation-cta-label {
    color: color-mix(in srgb, var(--neon-cta-sync-color, var(--neon-hero-shift-color, var(--glow-color, var(--neon-hero-color, #fc00e3)))) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-cta-sync-color, var(--neon-hero-shift-color, var(--glow-color, var(--neon-hero-color, #fc00e3)))) 76%, #ffffff) !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.about-link:hover, .about-link:focus-visible, .btn-glow:hover, .btn-glow:focus-visible, .game-rotation-cta:hover, .game-rotation-cta:focus-visible, .site-guestbook-actions button:hover, .site-guestbook-actions button:focus-visible) {
    --neon-cta-sync-color: var(--neon-hero-shift-color, var(--neon-hero-button-color, var(--neon-hero-hover-color, var(--glow-color, var(--neon-hero-color, #fc00e3)))));
    background: color-mix(in srgb, var(--neon-cta-sync-color) 24%, rgba(0, 0, 0, 0.78)) !important;
    border-color: color-mix(in srgb, var(--neon-cta-sync-color) 92%, #ffffff) !important;
    outline-color: color-mix(in srgb, var(--neon-cta-sync-color) 92%, #ffffff) !important;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--neon-cta-sync-color) 18%, transparent),
        inset 0 0 0 1px color-mix(in srgb, var(--neon-cta-sync-color) 92%, #ffffff),
        0 0 24px color-mix(in srgb, var(--neon-cta-sync-color) 34%, transparent) !important;
    transform: translateY(-2px) scale(1.02);
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="rainbow"] :is(.btn-glow, .game-rotation-cta) {
    --neon-cta-sync-color: var(--glow-color, var(--neon-hero-color, #ff0055));
    animation: none !important;
    color: var(--neon-cta-sync-color) !important;
    -webkit-text-fill-color: var(--neon-cta-sync-color) !important;
    background: color-mix(in srgb, var(--neon-cta-sync-color) 18%, transparent) !important;
    border-color: var(--neon-cta-sync-color) !important;
    outline-color: var(--neon-cta-sync-color) !important;
    box-shadow: inset 0 0 0 1px var(--neon-cta-sync-color) !important;
    transition:
        transform 0.3s ease,
        color 0.2s linear,
        -webkit-text-fill-color 0.2s linear,
        background 0.2s linear,
        border-color 0.2s linear,
        outline-color 0.2s linear,
        box-shadow 0.2s linear !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="rainbow"] :is(.btn-glow:hover, .btn-glow:focus-visible, .game-rotation-cta:hover, .game-rotation-cta:focus-visible) {
    color: var(--neon-cta-sync-color) !important;
    -webkit-text-fill-color: var(--neon-cta-sync-color) !important;
    background: color-mix(in srgb, var(--neon-cta-sync-color) 32%, transparent) !important;
    border-color: var(--neon-cta-sync-color) !important;
    outline-color: var(--neon-cta-sync-color) !important;
    box-shadow:
        inset 0 0 14px color-mix(in srgb, var(--neon-cta-sync-color) 16%, transparent),
        inset 0 0 0 1px var(--neon-cta-sync-color) !important;
    text-shadow: 0 0 8px color-mix(in srgb, var(--neon-cta-sync-color) 42%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom):not(:hover):not(:focus-within) {
    box-shadow: none !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom):not(:hover):not(:focus-within)::before {
    box-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom):is(:hover, :focus-within) {
    box-shadow:
        inset 0 0 34px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 14%, transparent),
        0 0 30px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 42%, transparent),
        0 0 50px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 18%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom):not([data-neon-hero-style="rainbow"]):is(:hover, :focus-within) {
    border-color: color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 94%, #ffffff) !important;
    box-shadow:
        inset 0 0 34px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 14%, transparent),
        0 0 30px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 42%, transparent),
        0 0 50px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 18%, transparent) !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]::before {
    transition:
        border-left-width var(--neon-sync-duration) var(--neon-sync-ease),
        border-left-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-stripe-color var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.box-title, .box-subtitle, .game-rotation-heading, .game-rotation-live, .inner-entry h3, .site-guestbook-hero-heading, .nav-card a.glass .flex.flex-col > div:first-child, .nav-card a.glass .flex.flex-col > div:last-child) {
    transition:
        color var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-text-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        text-shadow var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]::before {
    border-left-color: var(--neon-hero-stripe-color, var(--neon-hero-shift-color, var(--glow-color, #fc00e3))) !important;
    box-shadow: inset 8px 0 14px -10px color-mix(in srgb, var(--neon-hero-stripe-color, var(--neon-hero-shift-color, var(--glow-color, #fc00e3))) 64%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]:is(:hover, :focus-within)::before {
    border-left-color: var(--neon-hero-stripe-color, var(--neon-hero-shift-color, var(--glow-color, #fc00e3))) !important;
    box-shadow: inset 12px 0 18px -12px color-mix(in srgb, var(--neon-hero-stripe-color, var(--neon-hero-shift-color, var(--glow-color, #fc00e3))) 64%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.box-title, .game-rotation-heading, .inner-entry h3, .site-guestbook-hero-heading, .nav-card a.glass .flex.flex-col > div:first-child, #main-current-game) {
    color: color-mix(in srgb, var(--neon-hero-shift-color, var(--glow-color, #fc00e3)) 58%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-hero-shift-color, var(--glow-color, #fc00e3)) 58%, #ffffff) !important;
    transition:
        color var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-text-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        text-shadow var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]:is(:hover, :focus-within) :is(.box-title, .game-rotation-heading, .inner-entry h3, .site-guestbook-hero-heading, .nav-card a.glass .flex.flex-col > div:first-child, #main-current-game) {
    color: color-mix(in srgb, var(--neon-hero-shift-color, var(--glow-color, #fc00e3)) 58%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-hero-shift-color, var(--glow-color, #fc00e3)) 58%, #ffffff) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]):not([data-neon-title-mode="white"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.box-subtitle, .game-rotation-live, .nav-card a.glass .flex.flex-col > div:last-child, .now-playing-card span, .now-playing-card p) {
    color: color-mix(in srgb, var(--neon-hero-shift-color, var(--glow-color, #fc00e3)) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-hero-shift-color, var(--glow-color, #fc00e3)) 76%, #ffffff) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--neon-hero-shift-color, var(--glow-color, #fc00e3)) 24%, transparent) !important;
    transition:
        color var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-text-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        text-shadow var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]):not([data-neon-title-mode="white"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]:is(:hover, :focus-within) :is(.box-subtitle, .game-rotation-live, .nav-card a.glass .flex.flex-col > div:last-child, .now-playing-card span, .now-playing-card p) {
    color: color-mix(in srgb, var(--neon-hero-shift-color, var(--glow-color, #fc00e3)) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-hero-shift-color, var(--glow-color, #fc00e3)) 76%, #ffffff) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--neon-hero-shift-color, var(--glow-color, #fc00e3)) 24%, transparent) !important;
}

html[data-site-theme="neon"] body.admin-page .admin-board-shell.neon-hero-box-custom[data-neon-hero-style="gradient"]::before {
    transition:
        border-left-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-hero-stripe-color var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"] body .site-retro-widgets .site-widget-card.neon-hero-box-custom:is(:hover, :focus-within) {
    border-color: color-mix(in srgb, var(--neon-widget-color, var(--glow-color, #ff0059)) 94%, #ffffff) !important;
    box-shadow:
        inset 0 0 28px color-mix(in srgb, var(--neon-widget-color, var(--glow-color, #ff0059)) 12%, transparent),
        0 0 26px color-mix(in srgb, var(--neon-widget-color, var(--glow-color, #ff0059)) 38%, transparent),
        0 0 44px color-mix(in srgb, var(--neon-widget-color, var(--glow-color, #ff0059)) 17%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) :is(.about-link, .btn-glow, .game-rotation-cta, .site-guestbook-actions button):not(:hover):not(:focus-visible) {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--glow-color, #fc00e3) 18%, transparent) !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.about-link, .btn-glow, .game-rotation-cta, .site-guestbook-actions button):not(:hover):not(:focus-visible) {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--neon-cta-sync-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 18%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="rainbow"] :is(.btn-glow, .game-rotation-cta):not(:hover):not(:focus-visible) {
    box-shadow: inset 0 0 0 1px var(--neon-cta-sync-color, var(--glow-color)) !important;
    text-shadow: none !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="rainbow"] .inner-entry h3 {
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color) 42%, transparent) !important;
    transition: none !important;
}

.game-rotation-cta-label {
    position: relative;
    z-index: 1;
    color: inherit !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600),
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:last-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="theme"] .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .game-rotation-live, .box-title, .box-subtitle, .smp-hero-glass > .box-title, .inner-entry h3),
html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="theme"] .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="theme"] .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:last-child {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 38%, transparent),
        0 0 16px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 22%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="white"] .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .game-rotation-live, .box-title, .box-subtitle, .smp-hero-glass > .box-title, .inner-entry h3),
html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="white"] .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"][data-neon-title-glow="white"] .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:last-child {
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.42),
        0 0 16px rgba(255, 255, 255, 0.24) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:first-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) :is(h4, p, span, a, button, strong, small, code, li, label, time, .box-subtitle, .box-body, .game-rotation-live, .game-rotation-cta-label, .inner-entry p, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #status),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:last-child {
    color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 76%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:first-child {
    text-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 40%, transparent),
        0 0 18px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 24%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom:is([data-neon-hero-style="accent"], [data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"], [data-neon-hero-style="shuffle"]) .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.44),
        0 0 18px rgba(255, 255, 255, 0.26) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-subtitle, .box-body, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:last-child {
    color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 76%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-subtitle, .box-body, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:last-child {
    color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 76%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span),
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child {
    color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 58%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 58%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .neon-hero-box-custom :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:last-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span),
html[data-site-theme="neon"][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child {
    text-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span),
html[data-site-theme="neon"][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 40%, transparent),
        0 0 18px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-color, #fc00e3))) 24%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span),
html[data-site-theme="neon"][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.44),
        0 0 18px rgba(255, 255, 255, 0.26) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child {
    text-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 40%, transparent),
        0 0 18px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 24%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.44),
        0 0 18px rgba(255, 255, 255, 0.26) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.btn-glow, .game-rotation-cta, .site-guestbook-actions button) {
    --neon-cta-sync-color: var(--neon-hero-shift-color, var(--neon-hero-button-color, var(--glow-color, var(--neon-hero-color, #fc00e3))));
    color: color-mix(in srgb, var(--neon-cta-sync-color) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-cta-sync-color) 76%, #ffffff) !important;
    background: color-mix(in srgb, var(--neon-cta-sync-color) 14%, rgba(0, 0, 0, 0.82)) !important;
    border-color: color-mix(in srgb, var(--neon-cta-sync-color) 76%, rgba(255, 255, 255, 0.16)) !important;
    outline-color: color-mix(in srgb, var(--neon-cta-sync-color) 76%, rgba(255, 255, 255, 0.16)) !important;
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--neon-cta-sync-color) 18%, transparent),
        0 0 14px color-mix(in srgb, var(--neon-cta-sync-color) 22%, transparent) !important;
    transition:
        transform 0.3s ease,
        color var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-text-fill-color var(--neon-sync-duration) var(--neon-sync-ease),
        background var(--neon-sync-duration) var(--neon-sync-ease),
        border-color var(--neon-sync-duration) var(--neon-sync-ease),
        outline-color var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease),
        --neon-cta-sync-color var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within) :is(.btn-glow, .game-rotation-cta, .site-guestbook-actions button),
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.btn-glow:hover, .btn-glow:focus-visible, .game-rotation-cta:hover, .game-rotation-cta:focus-visible, .site-guestbook-actions button:hover, .site-guestbook-actions button:focus-visible) {
    --neon-cta-sync-color: var(--neon-hero-shift-color, var(--neon-hero-button-color, var(--neon-hero-hover-color, var(--glow-color, var(--neon-hero-color, #fc00e3)))));
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        background var(--neon-sync-duration) var(--neon-sync-ease),
        backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease),
        -webkit-backdrop-filter var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="rainbow"]:not(:hover):not(:focus-within) {
    box-shadow:
        inset 0 0 24px color-mix(in srgb, var(--glow-color) 18%, transparent),
        0 0 20px color-mix(in srgb, var(--glow-color) 16%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) .neon-hero-box-custom[data-neon-hero-style="rainbow"]:is(:hover, :focus-within) {
    box-shadow:
        inset 0 0 34px color-mix(in srgb, var(--glow-color) 14%, transparent),
        0 0 30px color-mix(in srgb, var(--glow-color) 42%, transparent),
        0 0 50px color-mix(in srgb, var(--glow-color) 18%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    animation: rainbow-glow var(--neon-hero-rainbow-speed) linear infinite !important;
    --neon-hero-outline-color: var(--glow-color) !important;
    border-color: var(--glow-color) !important;
    outline: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    animation: rainbow-glow var(--neon-hero-rainbow-speed) linear infinite !important;
    --neon-hero-shift-color: var(--glow-color) !important;
    --neon-hero-stripe-color: var(--glow-color) !important;
    --neon-hero-outline-color: var(--glow-color) !important;
    --neon-hero-outline-shadow: color-mix(in srgb, var(--glow-color) 64%, transparent) !important;
    border-color: var(--glow-color) !important;
    outline: none !important;
    box-shadow: none !important;
    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"]::before {
    animation: none !important;
    border-left-color: var(--glow-color) !important;
    box-shadow: inset 8px 0 14px -10px color-mix(in srgb, var(--glow-color) 55%, transparent) !important;
    transition: border-left-width var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"]:is(:hover, :focus-within),
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card:is(:hover, :focus-within) > a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    border-color: var(--glow-color) !important;
    box-shadow:
        inset 0 0 34px color-mix(in srgb, var(--glow-color) 14%, transparent),
        0 0 30px color-mix(in srgb, var(--glow-color) 42%, transparent),
        0 0 50px color-mix(in srgb, var(--glow-color) 18%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div:last-child {
    animation: rainbow-glow var(--neon-hero-rainbow-speed) linear infinite !important;
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color) 32%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a[href="pages/smp"].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"],
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a[href="pages/arcade"].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"],
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a[href="pages/about"].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    animation: rainbow-glow var(--neon-hero-rainbow-speed) linear infinite !important;
    --neon-hero-shift-color: var(--glow-color) !important;
    --neon-hero-stripe-color: var(--glow-color) !important;
    --neon-hero-outline-color: var(--glow-color) !important;
    --neon-hero-outline-shadow: color-mix(in srgb, var(--glow-color) 64%, transparent) !important;
    border-color: var(--glow-color) !important;
    outline: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a[href="pages/smp"].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"]::before,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a[href="pages/arcade"].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"]::before,
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a[href="pages/about"].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"]::before {
    animation: none !important;
    border-left-color: var(--glow-color) !important;
    box-shadow: inset 8px 0 14px -10px color-mix(in srgb, var(--glow-color) 55%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"] {
    animation: rainbow-glow var(--neon-hero-rainbow-speed) linear infinite !important;
    --neon-hero-shift-color: var(--glow-color) !important;
    --neon-hero-stripe-color: var(--glow-color) !important;
    --neon-hero-outline-color: var(--glow-color) !important;
    --neon-hero-outline-shadow: color-mix(in srgb, var(--glow-color) 64%, transparent) !important;
    border-color: color-mix(in srgb, var(--glow-color) 24%, transparent) !important;
    outline: none !important;
    box-shadow: none !important;
    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"]::before {
    animation: none !important;
    border-left-style: solid !important;
    border-left-width: 5px !important;
    border-left-color: var(--glow-color) !important;
    box-shadow: inset 8px 0 14px -10px var(--glow-color) !important;
    transition: border-left-width var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"]::after {
    box-shadow: none !important;
    opacity: 1;
    transition: background var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"]:is(:hover, :focus-within) {
    border-color: var(--glow-color) !important;
    box-shadow:
        inset 0 0 34px color-mix(in srgb, var(--glow-color) 14%, transparent),
        0 0 30px color-mix(in srgb, var(--glow-color) 42%, transparent),
        0 0 50px color-mix(in srgb, var(--glow-color) 18%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"]:is(:hover, :focus-within)::after {
    box-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"]:not(:hover):not(:focus-within) :is(.carousel-viewport, .now-playing-card, .inner-entry, .site-guestbook-viewport, .site-guestbook-form, .site-guestbook-entry) {
    border-color: color-mix(in srgb, var(--glow-color) 32%, transparent) !important;
    box-shadow: inset 0 0 12px color-mix(in srgb, var(--glow-color) 6%, transparent) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    animation-delay: var(--neon-hero-rainbow-delay, 0s), var(--neon-hero-rainbow-delay, 0s) !important;
}

html[data-site-theme="neon"] :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"]::before {
    animation-delay: var(--neon-hero-rainbow-delay, 0s) !important;
}

html[data-site-theme="neon"] .neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div:last-child,
html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter,
html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter-digit,
html[data-site-theme="neon"] .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-list li::before {
    animation-delay: var(--neon-hero-rainbow-delay, 0s) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"],
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card > a[href].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"],
html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) .nav-card > a[href].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"],
html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"] {
    animation-delay: var(--neon-hero-rainbow-delay, 0s), var(--neon-hero-rainbow-delay, 0s) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"]::before,
html[data-site-theme="neon"] body:not(.admin-page) .nav-card > a[href].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"]::before,
html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom)[data-neon-hero-style="rainbow"]::before {
    animation-delay: var(--neon-hero-rainbow-delay, 0s) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter,
html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-hit-counter-digit,
html[data-site-theme="neon"][data-neon-variant="edge"] .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] .site-currently-list li::before,
html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) .nav-card > a[href].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div:last-child {
    animation-delay: var(--neon-hero-rainbow-delay, 0s) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body #site-retro-widgets.site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"],
html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body #site-retro-widgets.site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"]:not(:hover):not(:focus-within) {
    --neon-hero-outline-color: var(--glow-color) !important;
    --neon-widget-color: var(--glow-color) !important;
    --neon-widget-edge-color: var(--glow-color) !important;
    --neon-widget-counter-color: var(--glow-color) !important;
    --neon-widget-counter-bright: var(--glow-color) !important;
    background: rgba(13, 0, 8, 0.88) !important;
    border: 2px solid color-mix(in srgb, var(--glow-color) 58%, transparent) !important;
    box-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body #site-retro-widgets.site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"]:not(:hover):not(:focus-within) .site-hit-counter {
    background: transparent !important;
    box-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body #site-retro-widgets.site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"]:is(:hover, :focus-within) {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--glow-color) 10%, transparent), color-mix(in srgb, var(--glow-color) 5%, transparent)),
        rgba(13, 0, 8, 0.88) !important;
    border: 2px solid var(--glow-color) !important;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--glow-color) 8%, transparent),
        0 0 16px color-mix(in srgb, var(--glow-color) 18%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"]:not([data-neon-rainbow-variant="v2"]) body #site-retro-widgets.site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"]:is(:hover, :focus-within) .site-hit-counter {
    background: color-mix(in srgb, var(--glow-color) 5%, rgba(0, 0, 0, 0.62)) !important;
    box-shadow: inset 0 0 12px color-mix(in srgb, var(--glow-color) 6%, transparent) !important;
}

html[data-site-theme="neon"] body #site-retro-widgets.site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style][data-neon-hero-hover-glow="on"]:is(:hover, :focus-within) {
    box-shadow:
        inset 0 0 24px color-mix(in srgb, var(--neon-widget-color, var(--glow-color, #ffffff)) 16%, transparent),
        0 0 26px color-mix(in srgb, var(--neon-widget-color, var(--glow-color, #ffffff)) 28%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style][data-neon-hero-hover-glow="off"]:is(:hover, :focus-within),
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style][data-neon-hero-hover-glow="off"]:is(:hover, :focus-within) {
    box-shadow: inset 0 0 34px color-mix(in srgb, var(--glow-color, var(--neon-hero-color, #fc00e3)) 14%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="accent"]:not(:hover):not(:focus-within) {
    box-shadow: inset 0 0 24px color-mix(in srgb, var(--glow-color) 10%, transparent) !important;
}

/* Edge variant: kill the always-on glow on Game Rotation + Visitor Log boxes
   so they only light up under the hover-glow rules. ID-based selectors so this
   wins over the generic .neon-hero-box-custom edge accent base above. */
html[data-site-theme="neon"][data-neon-variant="edge"] body :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom)[data-neon-hero-style]:not(:hover):not(:focus-within) {
    box-shadow: none !important;
}

html[data-site-theme="neon"] body #site-retro-widgets.site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style][data-neon-hero-hover-glow="off"]:is(:hover, :focus-within) {
    box-shadow: inset 0 0 24px color-mix(in srgb, var(--glow-color, #ffffff) 16%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body #site-retro-widgets.site-retro-widgets .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"][data-neon-hero-hover-glow="off"]:is(:hover, :focus-within) {
    box-shadow: inset 0 0 18px color-mix(in srgb, var(--glow-color) 8%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"] {
    animation:
        rainbow-glow-v2 var(--neon-hero-rainbow-speed) linear infinite,
        rainbow-halo-spread-v2 var(--neon-hero-rainbow-speed) linear infinite !important;
    border-color: transparent !important;
    background: var(--neon-hero-panel-bg) !important;
    backdrop-filter: blur(var(--neon-hero-panel-blur, var(--neon-hero-blur, 0px))) !important;
    -webkit-backdrop-filter: blur(var(--neon-hero-panel-blur, var(--neon-hero-blur, 0px))) !important;
    box-shadow:
        inset 5px 0 0 0 var(--glow-color),
        inset 0 0 24px color-mix(in srgb, var(--glow-color) 10%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"]::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: -1px !important;
    width: auto !important;
    height: auto !important;
    border-radius: inherit !important;
    box-sizing: border-box !important;
    border: 2px solid transparent !important;
    animation: neon-rainbow-border-pan-v2-left var(--neon-hero-rainbow-speed, 7s) linear infinite !important;
    will-change: background-position, transform !important;
    transform: translateZ(0) !important;
    background-image: linear-gradient(90deg, #ff0055 0%, #ff6a00 12.5%, #ffd000 25%, #26ff66 37.5%, #00d9ff 50%, #006bff 62.5%, #a000ff 75%, #ff00c8 87.5%, #ff0055 100%) !important;
    background-origin: border-box !important;
    background-clip: border-box !important;
    background-size: var(--neon-hero-rainbow-tile, 520px) 100% !important;
    background-repeat: repeat !important;
    -webkit-mask: linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0) border-box !important;
    -webkit-mask-composite: xor !important;
    mask: linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0) border-box !important;
    mask-composite: exclude !important;
    box-shadow: none !important;
    opacity: 1 !important;
    pointer-events: none !important;
    z-index: 20 !important;
    transition:
        border-left-width var(--neon-sync-duration) var(--neon-sync-ease),
        opacity var(--neon-sync-duration) var(--neon-sync-ease),
        box-shadow var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"][data-neon-hero-outline="hover"]:not(:hover):not(:focus-within)::before {
    opacity: 0.24 !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"]:is(:hover, :focus-within)::before,
html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) .nav-card:is(:hover, :focus-within) > a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"]::before {
    opacity: 1 !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"][data-neon-hero-outline="hover"]:not(:hover):not(:focus-within) {
    box-shadow: inset 5px 0 0 0 var(--glow-color) !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"][data-neon-hero-fill="on"]::after {
    animation: neon-rainbow-fill-pan-v2-left var(--neon-hero-rainbow-speed, 7s) linear infinite !important;
    background-image: linear-gradient(90deg,
        color-mix(in srgb, #ff0055 var(--neon-hero-fill-strong, 14%), transparent) 0%,
        color-mix(in srgb, #ff6a00 var(--neon-hero-fill-strong, 14%), transparent) 12.5%,
        color-mix(in srgb, #ffd000 var(--neon-hero-fill-strong, 14%), transparent) 25%,
        color-mix(in srgb, #26ff66 var(--neon-hero-fill-strong, 14%), transparent) 37.5%,
        color-mix(in srgb, #00d9ff var(--neon-hero-fill-strong, 14%), transparent) 50%,
        color-mix(in srgb, #006bff var(--neon-hero-fill-strong, 14%), transparent) 62.5%,
        color-mix(in srgb, #a000ff var(--neon-hero-fill-strong, 14%), transparent) 75%,
        color-mix(in srgb, #ff00c8 var(--neon-hero-fill-strong, 14%), transparent) 87.5%,
        color-mix(in srgb, #ff0055 var(--neon-hero-fill-strong, 14%), transparent) 100%) !important;
    background-color: transparent !important;
    background-size: var(--neon-hero-rainbow-tile, 520px) 100% !important;
    background-repeat: repeat !important;
    will-change: background-position !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"]:is(:hover, :focus-within),
html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) .nav-card:is(:hover, :focus-within) > a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    border-color: transparent !important;
    box-shadow: inset 5px 0 0 0 var(--glow-color) !important;
}

/* Rainbow v2: no outer glow, only inset stripe regardless of hover-glow setting. */
html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"][data-neon-hero-hover-glow="on"]:is(:hover, :focus-within),
html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) .nav-card:is(:hover, :focus-within) > a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"][data-neon-hero-hover-glow="on"] {
    box-shadow: inset 5px 0 0 0 var(--glow-color) !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"] {
    overflow: visible !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"]:is(.site-guestbook-shell, .site-widget-card) {
    box-shadow:
        inset 5px 0 0 0 var(--glow-color),
        inset 0 0 24px color-mix(in srgb, var(--glow-color) 10%, transparent) !important;
    animation: none !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"]:is(.site-guestbook-shell, .site-widget-card):is(:hover, :focus-within) {
    box-shadow: inset 5px 0 0 0 var(--glow-color) !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"]:is(.site-guestbook-shell, .site-widget-card)[data-neon-hero-outline="hover"]:not(:hover):not(:focus-within) {
    box-shadow: inset 5px 0 0 0 var(--glow-color) !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"] body:not(.admin-page) :is(.site-widget-card, .site-hit-counter, .site-hit-counter-digit, .site-widget-counter, .site-widget-currently, .site-guestbook-shell) {
    --glow-color: inherit !important;
    --glow-rgb: inherit !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"] body:not(.admin-page) :is(.site-widget-counter, .site-widget-currently, .site-widget-card, .site-guestbook-shell).neon-hero-box-custom {
    --neon-widget-counter-color: var(--glow-color) !important;
    --neon-widget-counter-bright: var(--glow-color) !important;
    --neon-widget-color: var(--glow-color) !important;
    --neon-widget-edge-color: var(--glow-color) !important;
    --site-guestbook-accent: var(--glow-color) !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"] body:not(.admin-page) :is(.glass, .site-widget-card, .site-guestbook-shell) {
    --neon-tone-title: var(--glow-color) !important;
    --neon-tone-strong: var(--glow-color) !important;
    --neon-tone-body: var(--glow-color) !important;
    --neon-tone-dim: var(--glow-color) !important;
    --neon-tone-line: var(--glow-color) !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"] body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div:last-child {
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color) 32%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"][data-neon-rainbow-direction="right"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"]::before {
    animation-name: neon-rainbow-border-pan-v2-right !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"][data-neon-rainbow-direction="right"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"][data-neon-hero-fill="on"]::after {
    animation-name: neon-rainbow-fill-pan-v2-right !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"][data-neon-rainbow-direction="right"] body:not(.admin-page) :is(#game-rotation-panel.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom, .site-widget-card.neon-hero-box-custom, .nav-card > a.glass.neon-hero-box-custom, .neon-hero-box-custom)[data-neon-hero-style="rainbow"] {
    animation-direction: reverse, reverse !important;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"] body:not(.admin-page) {
    animation: rainbow-glow-v2 var(--neon-hero-rainbow-speed, 7s) linear infinite;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"][data-neon-rainbow-direction="right"] body:not(.admin-page) {
    animation-direction: reverse;
}

html[data-site-theme="neon"][data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"] body:not(.admin-page) :is(.neon-blue, .neon-purple, .neon-orange, .neon-mint, .neon-red, .neon-green, .neon-yellow, .neon-cyan, .neon-pink, .neon-magenta) {
    --glow-color: inherit !important;
    --glow-rgb: inherit !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="white"] body:not(.admin-page) .neon-hero-box-custom[data-neon-hero-style="rainbow"],
html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="white"] body:not(.admin-page) .site-guestbook-shell.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"],
html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="white"] body:not(.admin-page) .site-widget-card.neon-hero-box-custom[data-neon-hero-style="rainbow"] {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="white"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom)[data-neon-hero-style="rainbow"] :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .poster-title, .game-platform-badge, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-currently-list li, .site-currently-updated, .site-hit-counter, .site-hit-counter-digit, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game, #status),
html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="white"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="white"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div:last-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="white"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a[href="pages/smp"].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div,
html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="white"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a[href="pages/arcade"].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div,
html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="white"]:not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card > a[href="pages/about"].glass.neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div {
    animation: rainbow-glow var(--neon-hero-rainbow-speed) linear infinite !important;
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--glow-color) 32%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .neon-hero-box-custom :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"][data-neon-hero-mode="rainbow"]) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:last-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style]:is(:hover, :focus-within, :not(:hover)) :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style]:is(:hover, :focus-within, :not(:hover)) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom):not([data-neon-hero-style]) :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom):not([data-neon-hero-style]) .flex.flex-col > div:first-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Keep global box text modes and title glow stronger than older main-page nav-card styling. */
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(h4, p, span, a, button, strong, small, code, li, label, time, .box-subtitle, .box-body, .game-rotation-live, .game-rotation-cta-label, .inner-entry p, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #status),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom .flex.flex-col > div:last-child {
    color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 76%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .smp-hero-glass.neon-hero-box-custom > .box-title,
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom .flex.flex-col > div:first-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom .flex.flex-col > div:last-child {
    color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 76%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 76%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .smp-hero-glass.neon-hero-box-custom > .box-title,
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom .flex.flex-col > div:first-child {
    color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 58%, #ffffff) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 58%, #ffffff) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom .flex.flex-col > div:last-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) .neon-style-preview-box.neon-hero-box-custom :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site) {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
}

html[data-site-theme="neon"][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) .smp-hero-glass.neon-hero-box-custom > .box-title,
html[data-site-theme="neon"][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom .flex.flex-col > div:first-child {
    text-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .smp-hero-glass.neon-hero-box-custom > .box-title,
html[data-site-theme="neon"][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 40%, transparent),
        0 0 18px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 24%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .neon-hero-box-custom :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .smp-hero-glass.neon-hero-box-custom > .box-title,
html[data-site-theme="neon"][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.44),
        0 0 18px rgba(255, 255, 255, 0.26) !important;
}

/* Hover Shift sync: one animated source color drives outline, stripe, panels, buttons, and text. */
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"],
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] {
    --neon-hero-progress: 0;
    --neon-hero-shift-color: color-mix(in srgb, var(--neon-hero-color), var(--neon-hero-hover-color, var(--neon-hero-color)) calc(var(--neon-hero-progress) * 100%));
    --glow-color: var(--neon-hero-shift-color) !important;
    --neon-hero-stripe-color: var(--neon-hero-shift-color) !important;
    --neon-hero-outline-color: var(--neon-hero-shift-color) !important;
    --neon-hero-active-fill-color: var(--neon-hero-shift-color);
    --neon-cta-sync-color: var(--neon-hero-shift-color);
    --neon-title-glow-color: var(--neon-hero-shift-color) !important;
    background: var(--neon-hero-glass-bg) !important;
    border-color: var(--neon-hero-shift-color) !important;
    box-shadow: inset 0 0 24px color-mix(in srgb, var(--neon-hero-shift-color) 10%, transparent) !important;
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        --neon-hero-progress var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]:is(:hover, :focus-within),
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within) {
    --neon-hero-progress: 1;
    --glow-color: var(--neon-hero-shift-color) !important;
    --neon-hero-stripe-color: var(--neon-hero-shift-color) !important;
    --neon-hero-outline-color: var(--neon-hero-shift-color) !important;
    --neon-hero-active-fill-color: var(--neon-hero-shift-color);
    --neon-cta-sync-color: var(--neon-hero-shift-color);
    --neon-title-glow-color: var(--neon-hero-shift-color) !important;
    border-color: var(--neon-hero-shift-color) !important;
    box-shadow: inset 0 0 32px color-mix(in srgb, var(--neon-hero-shift-color) 12%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"][data-neon-hero-hover-glow="on"]:is(:hover, :focus-within),
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"][data-neon-hero-hover-glow="on"]:is(:hover, :focus-within) {
    box-shadow:
        inset 0 0 32px color-mix(in srgb, var(--neon-hero-shift-color) 12%, transparent),
        0 0 34px color-mix(in srgb, var(--neon-hero-shift-color) 30%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]::before {
    border-left: 5px solid var(--neon-hero-shift-color) !important;
    box-shadow: inset 8px 0 14px -10px var(--neon-hero-shift-color) !important;
    transition: none !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]:is(:hover, :focus-within)::before {
    border-left-width: 5px !important;
    box-shadow: inset 8px 0 14px -10px var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"][data-neon-hero-fill="on"]::after {
    --neon-hero-active-fill-color: var(--neon-hero-shift-color);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-hero-active-fill-color) var(--neon-hero-fill-strong, 14%), transparent), color-mix(in srgb, var(--neon-hero-active-fill-color) var(--neon-hero-fill-soft, 7%), transparent)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-panel-bg) !important;
    transition: none !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.carousel-viewport, .now-playing-card, .inner-entry, .site-guestbook-viewport, .site-guestbook-form, .site-guestbook-entry) {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-hero-shift-color) var(--neon-hero-subpanel-tint, 10%), var(--neon-hero-subpanel-bg)), var(--neon-hero-subpanel-bg)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)) !important;
    border-color: var(--neon-hero-shift-color) !important;
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--neon-hero-shift-color) 18%, transparent),
        0 0 16px color-mix(in srgb, var(--neon-hero-shift-color) 18%, transparent) !important;
    transition: none !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.about-link, .btn-glow, .game-rotation-cta, .site-guestbook-actions button) {
    --neon-cta-sync-color: var(--neon-hero-shift-color);
    background: color-mix(in srgb, var(--neon-cta-sync-color) 14%, rgba(0, 0, 0, 0.82)) !important;
    border-color: var(--neon-cta-sync-color) !important;
    outline-color: var(--neon-cta-sync-color) !important;
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--neon-cta-sync-color) 18%, transparent),
        0 0 14px color-mix(in srgb, var(--neon-cta-sync-color) 22%, transparent) !important;
    transition: transform 0.3s ease !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.about-link:hover, .about-link:focus-visible, .btn-glow:hover, .btn-glow:focus-visible, .game-rotation-cta:hover, .game-rotation-cta:focus-visible, .site-guestbook-actions button:hover, .site-guestbook-actions button:focus-visible) {
    --neon-cta-sync-color: var(--neon-hero-shift-color);
    background: color-mix(in srgb, var(--neon-cta-sync-color) 24%, rgba(0, 0, 0, 0.78)) !important;
    border-color: var(--neon-cta-sync-color) !important;
    outline-color: var(--neon-cta-sync-color) !important;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--neon-cta-sync-color) 18%, transparent),
        inset 0 0 0 1px var(--neon-cta-sync-color),
        0 0 24px color-mix(in srgb, var(--neon-cta-sync-color) 34%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .smp-hero-h1, .smp-hero-h1 span, .smp-hero-subtitle, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game, #status, [data-main-hero-dot]),
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div {
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"] body:not(.admin-page) .neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) :is(h4, p, span, a, button, strong, small, code, li, label, time, .box-subtitle, .box-body, .game-rotation-live, .game-rotation-cta-label, .inner-entry p, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, .text-\[\#001aff\], #status),
html[data-site-theme="neon"][data-neon-title-mode="default"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:last-child {
    color: var(--neon-hero-shift-color) !important;
    -webkit-text-fill-color: var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"] body:not(.admin-page) .neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="default"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:first-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"] body:not(.admin-page) .neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, .text-\[\#001aff\], #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="tinted"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="tinted"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:last-child {
    color: var(--neon-hero-shift-color) !important;
    -webkit-text-fill-color: var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"] body:not(.admin-page) .neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, .text-\[\#001aff\], #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="white"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:last-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div:last-child {
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]):not([data-neon-rainbow-variant="v2"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="rainbow"] .flex.flex-col > div:last-child {
    color: var(--glow-color) !important;
    -webkit-text-fill-color: var(--glow-color) !important;
}

html[data-site-theme="neon"][data-neon-title-glow="theme"] body:not(.admin-page) .neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-glow="theme"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom:is([data-neon-hero-style="gradient"], [data-neon-hero-style="rainbow"]) .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-hero-shift-color) 40%, transparent),
        0 0 18px color-mix(in srgb, var(--neon-hero-shift-color) 24%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .smp-hero-h1, .smp-hero-h1 span, .smp-hero-subtitle, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game, #status, [data-main-hero-dot]),
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div {
    transition: none !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.about-link, .btn-glow, .game-rotation-cta, .site-guestbook-actions button) {
    --neon-cta-sync-color: var(--neon-hero-shift-color);
    background: color-mix(in srgb, var(--neon-cta-sync-color) 14%, rgba(0, 0, 0, 0.82)) !important;
    border-color: var(--neon-cta-sync-color) !important;
    outline-color: var(--neon-cta-sync-color) !important;
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--neon-cta-sync-color) 18%, transparent),
        0 0 14px color-mix(in srgb, var(--neon-cta-sync-color) 22%, transparent) !important;
    transition: transform 0.3s ease !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.about-link:hover, .about-link:focus-visible, .btn-glow:hover, .btn-glow:focus-visible, .game-rotation-cta:hover, .game-rotation-cta:focus-visible, .site-guestbook-actions button:hover, .site-guestbook-actions button:focus-visible) {
    --neon-cta-sync-color: var(--neon-hero-shift-color);
    background: color-mix(in srgb, var(--neon-cta-sync-color) 24%, rgba(0, 0, 0, 0.78)) !important;
    border-color: var(--neon-cta-sync-color) !important;
    outline-color: var(--neon-cta-sync-color) !important;
    box-shadow:
        inset 0 0 18px color-mix(in srgb, var(--neon-cta-sync-color) 18%, transparent),
        inset 0 0 0 1px var(--neon-cta-sync-color),
        0 0 24px color-mix(in srgb, var(--neon-cta-sync-color) 34%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(h4, p, span, a, button, strong, small, code, li, label, time, .box-subtitle, .box-body, .game-rotation-live, .game-rotation-cta-label, .inner-entry p, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #status, [data-main-hero-dot]),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child {
    color: var(--neon-hero-shift-color) !important;
    -webkit-text-fill-color: var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.site-guestbook-hero-heading, .game-rotation-heading, .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game, [data-main-hero-dot]),
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child {
    color: var(--neon-hero-shift-color) !important;
    -webkit-text-fill-color: var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game, [data-main-hero-dot]),
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child {
    color: var(--neon-hero-shift-color) !important;
    -webkit-text-fill-color: var(--neon-hero-shift-color) !important;
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child {
    transition: none !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] {
    --glow-color: var(--neon-hero-shift-color) !important;
    --neon-title-glow-color: var(--neon-hero-shift-color) !important;
    --neon-hero-stripe-color: var(--neon-hero-shift-color) !important;
    --neon-hero-outline-color: var(--neon-hero-shift-color) !important;
    border-color: var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] > div:has(.icon-box) {
    background: color-mix(in srgb, var(--neon-hero-shift-color) 13%, rgba(0, 0, 0, 0.72)) !important;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--neon-hero-shift-color) 16%, transparent) !important;
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child,
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child {
    color: var(--neon-hero-shift-color) !important;
    -webkit-text-fill-color: var(--neon-hero-shift-color) !important;
    text-shadow: 0 0 10px color-mix(in srgb, var(--neon-hero-shift-color) 28%, transparent) !important;
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="white"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child {
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-title-mode="tinted"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child {
    color: var(--neon-hero-shift-color) !important;
    -webkit-text-fill-color: var(--neon-hero-shift-color) !important;
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] {
    --neon-hero-progress: 0;
    --neon-hero-shift-color: color-mix(in srgb, var(--neon-hero-color), var(--neon-hero-hover-color, var(--neon-hero-color)) calc(var(--neon-hero-progress) * 100%));
    --glow-color: var(--neon-hero-shift-color) !important;
    --neon-title-glow-color: var(--neon-hero-shift-color) !important;
    --neon-hero-stripe-color: var(--neon-hero-shift-color) !important;
    --neon-hero-outline-color: var(--neon-hero-shift-color) !important;
    --neon-hero-outline-shadow: color-mix(in srgb, var(--neon-hero-shift-color) 64%, transparent);
    --neon-hero-active-fill-color: var(--neon-hero-shift-color);
    --neon-cta-sync-color: var(--neon-hero-shift-color);
    border-color: var(--neon-hero-shift-color) !important;
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        --neon-hero-progress var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]:is(:hover, :focus-within) {
    --neon-hero-progress: 1;
    box-shadow: inset 0 0 24px color-mix(in srgb, var(--neon-hero-shift-color) 12%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"][data-neon-hero-hover-glow="on"]:is(:hover, :focus-within),
html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"][data-neon-hero-hover-glow="on"]:is(:hover, :focus-within) {
    box-shadow:
        inset 0 0 24px color-mix(in srgb, var(--neon-hero-shift-color) 12%, transparent),
        0 0 32px color-mix(in srgb, var(--neon-hero-shift-color) 30%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]::before {
    border-left-color: var(--neon-hero-shift-color) !important;
    box-shadow: inset 8px 0 14px -10px var(--neon-hero-shift-color) !important;
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"]:is(:hover, :focus-within)::before {
    border-left-color: var(--neon-hero-shift-color) !important;
    box-shadow: inset 12px 0 18px -12px var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"][data-neon-hero-fill="on"]::after {
    --neon-hero-active-fill-color: var(--neon-hero-shift-color);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-hero-active-fill-color) var(--neon-hero-fill-strong, 14%), transparent), color-mix(in srgb, var(--neon-hero-active-fill-color) var(--neon-hero-fill-soft, 7%), transparent)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)),
        var(--neon-hero-panel-bg) !important;
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom)[data-neon-hero-style="gradient"] :is(.carousel-viewport, .now-playing-card, .inner-entry, .site-guestbook-viewport, .site-guestbook-form, .site-guestbook-entry) {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--neon-hero-shift-color) var(--neon-hero-subpanel-tint, 10%), var(--neon-hero-subpanel-bg)), var(--neon-hero-subpanel-bg)),
        linear-gradient(rgba(255, 255, 255, 0.001), rgba(255, 255, 255, 0.001)) !important;
    border-color: var(--neon-hero-shift-color) !important;
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--neon-hero-shift-color) 18%, transparent),
        0 0 16px color-mix(in srgb, var(--neon-hero-shift-color) 18%, transparent) !important;
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(.about-link, .btn-glow, .game-rotation-cta, .site-guestbook-actions button) {
    --neon-cta-sync-color: var(--neon-hero-shift-color);
    border-color: var(--neon-cta-sync-color) !important;
    outline-color: var(--neon-cta-sync-color) !important;
    box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--neon-cta-sync-color) 18%, transparent),
        0 0 14px color-mix(in srgb, var(--neon-cta-sync-color) 22%, transparent) !important;
    transition: transform 0.3s ease !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) .neon-hero-box-custom[data-neon-hero-style="gradient"] :is(h1, h2, h3, h4, p, span, a, button, strong, small, code, li, label, time, .box-title, .box-subtitle, .box-body, .smp-hero-h1, .smp-hero-h1 span, .smp-hero-subtitle, .game-rotation-heading, .game-rotation-live, .game-rotation-cta-label, .inner-entry h3, .inner-entry p, .site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .site-guestbook-entry-message, .site-guestbook-status, .site-guestbook-entry-meta, .site-guestbook-entry-site, .btn-glow, .plugin-link, .cmd-line span, .cmd-line code, .text-white, .text-gray-400, .text-gray-500, .text-gray-600, #main-current-game, #status, [data-main-hero-dot]) {
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] {
    --neon-hero-progress: 0;
    --neon-hero-shift-color: color-mix(in srgb, var(--neon-hero-color), var(--neon-hero-hover-color, var(--neon-hero-color)) calc(var(--neon-hero-progress) * 100%));
    --glow-color: var(--neon-hero-shift-color) !important;
    --neon-title-glow-color: var(--neon-hero-shift-color) !important;
    --neon-hero-stripe-color: var(--neon-hero-shift-color) !important;
    --neon-hero-outline-color: var(--neon-hero-shift-color) !important;
    --neon-hero-outline-shadow: color-mix(in srgb, var(--neon-hero-shift-color) 64%, transparent);
    border-color: var(--neon-hero-shift-color) !important;
    box-shadow: inset 0 0 24px color-mix(in srgb, var(--neon-hero-shift-color) 10%, transparent) !important;
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        --neon-hero-progress var(--neon-sync-duration) var(--neon-sync-ease) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within) {
    --neon-hero-progress: 1;
    box-shadow: inset 0 0 24px color-mix(in srgb, var(--neon-hero-shift-color) 12%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"]::before {
    border-left-color: var(--neon-hero-shift-color) !important;
    box-shadow: inset 8px 0 14px -10px var(--neon-hero-shift-color) !important;
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within)::before {
    border-left-color: var(--neon-hero-shift-color) !important;
    box-shadow: inset 12px 0 18px -12px var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:first-child,
html[data-site-theme="neon"][data-neon-variant="edge"][data-neon-title-mode="tinted"] body:not(.admin-page) .nav-card a.glass:not(#neon-nav-gradient-text).neon-hero-box-custom[data-neon-hero-style="gradient"] .flex.flex-col > div:last-child {
    color: var(--neon-hero-shift-color) !important;
    -webkit-text-fill-color: var(--neon-hero-shift-color) !important;
    transition: none !important;
}

/* --- VAPORWAVE THEME ---
   Scene rendered entirely on a 2D canvas (#vaporwave-canvas) by setupVaporwaveScene()
   in global.js. Layers: sky gradient, twinkling stars, sun w/ scrolling stripes,
   parallax wireframe mountains, perspective neon grid. No raster assets used. */

@keyframes vaporwaveScan {
    from { background-position: 0 0; }
    to { background-position: 0 8px; }
}

html[data-site-theme="vaporwave"] {
    background-color: #030008;
    --vapor-pink: #ff2bd6;
    --vapor-cyan: #00eaff;
    --vapor-violet: #7c2cff;
    --vapor-gold: #ffd15c;
}

html[data-site-theme="vaporwave"] body {
    background: transparent;
    color: #fff7ff;
}

html[data-site-theme="vaporwave"] #theme-backdrop {
    opacity: 1;
    overflow: hidden;
    background: #030008;
}

html[data-site-theme="vaporwave"] #vaporwave-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    display: block;
    /* Promote to own GPU layer; pixels get pushed every frame. */
    transform: translateZ(0);
    contain: strict;
}

/* Hide neon star-field DOM and color orbs — canvas owns the sky in vaporwave mode. */
html[data-site-theme="vaporwave"] #star-field,
html[data-site-theme="vaporwave"] .color-orb {
    display: none !important;
}

/* CRT scan-line overlay above content for retro feel. */
html[data-site-theme="vaporwave"] body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 9100;
    pointer-events: none;
    background: repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 6px);
    mix-blend-mode: screen;
    opacity: 0.08;
    animation: vaporwaveScan 1.25s linear infinite;
}

html[data-site-theme="vaporwave"] .flicker-title {
    color: #fff38a;
    text-shadow: 3px 3px 0 #ff2bd6, -3px -2px 0 #00eaff, 0 0 24px rgba(255, 43, 214, 0.45);
}

html[data-site-theme="vaporwave"] .glass,
html[data-site-theme="vaporwave"] .player-shell,
html[data-site-theme="vaporwave"] .now-playing-card,
html[data-site-theme="vaporwave"] .inner-entry,
html[data-site-theme="vaporwave"] .carousel-viewport {
    background: linear-gradient(180deg, rgba(38, 0, 70, 0.6), rgba(9, 0, 31, 0.65)) !important;
    border: 2px solid var(--vapor-cyan) !important;
    border-radius: 7px !important;
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.22),
        inset -2px -2px 0 rgba(0, 0, 0, 0.5),
        5px 5px 0 rgba(255, 43, 214, 0.5),
        0 0 24px rgba(0, 234, 255, 0.22) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html[data-site-theme="vaporwave"] .glass::before {
    border-left: none !important;
    border-radius: 0 !important;
    background:
        linear-gradient(90deg, rgba(255, 209, 92, 0.82), rgba(255, 43, 214, 0.72), rgba(0, 234, 255, 0.78));
    height: 5px;
    inset: 0 0 auto 0;
    box-shadow: 0 0 18px rgba(255, 43, 214, 0.5);
}

html[data-site-theme="vaporwave"] .glass:hover {
    transform: translate(-2px, -8px) scale(1.012) !important;
    border-color: var(--vapor-gold) !important;
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.25),
        inset -2px -2px 0 rgba(0, 0, 0, 0.55),
        7px 7px 0 rgba(0, 234, 255, 0.46),
        0 0 30px rgba(255, 43, 214, 0.42) !important;
}

html[data-site-theme="vaporwave"] .win98-titlebar {
    display: none !important;
}

html[data-site-theme="vaporwave"] .neon-hot-pink,
html[data-site-theme="vaporwave"] .neon-pink,
html[data-site-theme="vaporwave"] .neon-red {
    --glow-color: var(--vapor-pink);
    --glow-rgb: 255, 43, 214;
}

html[data-site-theme="vaporwave"] .neon-blue,
html[data-site-theme="vaporwave"] .neon-cyan,
html[data-site-theme="vaporwave"] .neon-green,
html[data-site-theme="vaporwave"] .neon-mint,
html[data-site-theme="vaporwave"] .neon-green2 {
    --glow-color: var(--vapor-cyan);
    --glow-rgb: 0, 234, 255;
}

html[data-site-theme="vaporwave"] .neon-purple,
html[data-site-theme="vaporwave"] .neon-dank-purple {
    --glow-color: var(--vapor-violet);
    --glow-rgb: 124, 44, 255;
}

html[data-site-theme="vaporwave"] .neon-white,
html[data-site-theme="vaporwave"] .neon-yellow,
html[data-site-theme="vaporwave"] .neon-orange {
    --glow-color: var(--vapor-gold);
    --glow-rgb: 255, 209, 92;
}

html[data-site-theme="vaporwave"] .dark-maroon {
    --glow-color: var(--vapor-pink);
    --glow-rgb: 255, 43, 214;
}

html[data-site-theme="vaporwave"] .dark-evergreen,
html[data-site-theme="vaporwave"] .dark-hover-evergreen:hover {
    --glow-color: var(--vapor-cyan);
    --glow-rgb: 0, 234, 255;
}

html[data-site-theme="vaporwave"] .neon-hover-red:hover {
    --glow-color: #ff5f87;
    --glow-rgb: 255, 95, 135;
}

html[data-site-theme="vaporwave"] #game-rotation-panel {
    --glow-color: var(--vapor-pink);
    --glow-rgb: 255, 43, 214;
}

html[data-site-theme="vaporwave"] #game-rotation-panel:hover,
html[data-site-theme="vaporwave"] #game-rotation-panel:focus-within {
    --glow-color: var(--vapor-cyan);
    --glow-rgb: 0, 234, 255;
}

html[data-site-theme="vaporwave"] .text-\[\#77ff00\],
html[data-site-theme="vaporwave"] .text-\[\#001aff\],
html[data-site-theme="vaporwave"] .text-\[\#00ffff\],
html[data-site-theme="vaporwave"] .text-\[\#ff8800\],
html[data-site-theme="vaporwave"] .hover\:text-\[\#001aff\]:hover {
    color: var(--vapor-gold) !important;
    -webkit-text-fill-color: var(--vapor-gold) !important;
}

html[data-site-theme="vaporwave"] .border-\[\#001aff\]\/20,
html[data-site-theme="vaporwave"] .border-cyan-400\/30,
html[data-site-theme="vaporwave"] .border-red-500\/20,
html[data-site-theme="vaporwave"] .border-white\/5,
html[data-site-theme="vaporwave"] .border-white\/10 {
    border-color: rgba(0, 234, 255, 0.32) !important;
}

html[data-site-theme="vaporwave"] .bg-red-600 {
    background-color: var(--vapor-pink) !important;
}

html[data-site-theme="vaporwave"] .text-red-500 {
    color: var(--vapor-pink) !important;
    -webkit-text-fill-color: var(--vapor-pink) !important;
}

html[data-site-theme="vaporwave"] .theme-toggle,
html[data-site-theme="vaporwave"] .site-dock-menu-button,
html[data-site-theme="vaporwave"] .site-dock-menu-item,
html[data-site-theme="vaporwave"] .btn-glow,
html[data-site-theme="vaporwave"] .player-btn,
html[data-site-theme="vaporwave"] .playlist-select,
html[data-site-theme="vaporwave"] .game-rotation-cta,
html[data-site-theme="vaporwave"] .site-guestbook-auth-signin,
html[data-site-theme="vaporwave"] .site-guestbook-actions button,
html[data-site-theme="vaporwave"] .global-player-btn,
html[data-site-theme="vaporwave"] .global-player-pill,
html[data-site-theme="vaporwave"] .global-player-volume-pill,
html[data-site-theme="vaporwave"] .global-player-toggle-pill,
html[data-site-theme="vaporwave"] .global-player-track-button,
html[data-site-theme="vaporwave"] .global-player-category-chip,
html[data-site-theme="vaporwave"] .global-track-queue-btn {
    border: 2px solid !important;
    border-color: var(--vapor-cyan) !important;
    border-radius: 7px !important;
    background: linear-gradient(180deg, rgba(38, 0, 70, 0.6), rgba(9, 0, 31, 0.65)) !important;
    color: #fff7ff !important;
    -webkit-text-fill-color: #fff7ff !important;
    text-shadow: none !important;
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.22),
        inset -2px -2px 0 rgba(0, 0, 0, 0.5),
        4px 4px 0 rgba(255, 43, 214, 0.45),
        0 0 18px rgba(0, 234, 255, 0.22) !important;
    letter-spacing: 0.14em;
}

html[data-site-theme="vaporwave"] .site-control-dock .theme-toggle,
html[data-site-theme="vaporwave"] .site-control-dock .site-dock-menu-button {
    background: linear-gradient(180deg, rgba(38, 0, 70, 0.6), rgba(9, 0, 31, 0.65)) !important;
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.22),
        inset -2px -2px 0 rgba(0, 0, 0, 0.5),
        5px 5px 0 rgba(255, 43, 214, 0.5),
        0 0 24px rgba(0, 234, 255, 0.22) !important;
}

html[data-site-theme="vaporwave"] .theme-toggle:hover,
html[data-site-theme="vaporwave"] .site-dock-menu-button:hover,
html[data-site-theme="vaporwave"] .site-dock-menu-item:hover,
html[data-site-theme="vaporwave"] .btn-glow:hover,
html[data-site-theme="vaporwave"] .player-btn:hover,
html[data-site-theme="vaporwave"] .playlist-select:hover,
html[data-site-theme="vaporwave"] .game-rotation-cta:hover,
html[data-site-theme="vaporwave"] .site-guestbook-auth-signin:hover,
html[data-site-theme="vaporwave"] .site-guestbook-auth-signin:focus-visible,
html[data-site-theme="vaporwave"] .site-guestbook-actions button:hover,
html[data-site-theme="vaporwave"] .site-guestbook-actions button:focus-visible,
html[data-site-theme="vaporwave"] .global-player-btn:hover,
html[data-site-theme="vaporwave"] .global-player-pill:hover,
html[data-site-theme="vaporwave"] .global-player-volume-pill:hover,
html[data-site-theme="vaporwave"] .global-player-toggle-pill:hover,
html[data-site-theme="vaporwave"] .global-player-track-button:hover,
html[data-site-theme="vaporwave"] .global-player-category-chip:hover,
html[data-site-theme="vaporwave"] .global-track-queue-btn:hover {
    transform: translate(-2px, -2px) !important;
    border-color: var(--vapor-gold) !important;
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.4),
        inset -2px -2px 0 rgba(0, 0, 0, 0.55),
        5px 5px 0 rgba(0, 234, 255, 0.42),
        0 0 24px rgba(255, 43, 214, 0.36) !important;
}

html[data-site-theme="vaporwave"] .theme-toggle:active,
html[data-site-theme="vaporwave"] .site-dock-menu-button:active,
html[data-site-theme="vaporwave"] .site-dock-menu-item:active,
html[data-site-theme="vaporwave"] .btn-glow:active,
html[data-site-theme="vaporwave"] .player-btn:active,
html[data-site-theme="vaporwave"] .playlist-select:active,
html[data-site-theme="vaporwave"] .game-rotation-cta:active,
html[data-site-theme="vaporwave"] .site-guestbook-auth-signin:active,
html[data-site-theme="vaporwave"] .site-guestbook-actions button:active,
html[data-site-theme="vaporwave"] .global-player-btn:active,
html[data-site-theme="vaporwave"] .global-player-pill:active,
html[data-site-theme="vaporwave"] .global-player-volume-pill:active,
html[data-site-theme="vaporwave"] .global-player-toggle-pill:active,
html[data-site-theme="vaporwave"] .global-player-track-button:active,
html[data-site-theme="vaporwave"] .global-player-category-chip:active,
html[data-site-theme="vaporwave"] .global-track-queue-btn:active {
    transform: translate(2px, 2px) !important;
    box-shadow:
        inset -2px -2px 0 rgba(255, 255, 255, 0.25),
        inset 2px 2px 0 rgba(0, 0, 0, 0.55),
        1px 1px 0 rgba(0, 234, 255, 0.35) !important;
}

html[data-site-theme="vaporwave"] .game-rotation-cta,
html[data-site-theme="vaporwave"] .game-rotation-cta:link,
html[data-site-theme="vaporwave"] .game-rotation-cta:visited,
html[data-site-theme="vaporwave"] .game-rotation-cta:hover,
html[data-site-theme="vaporwave"] .game-rotation-cta:focus-visible,
html[data-site-theme="vaporwave"] .game-rotation-cta:active,
html[data-site-theme="vaporwave"] .game-rotation-cta .game-rotation-cta-label {
    color: #fff7ff !important;
    -webkit-text-fill-color: #fff7ff !important;
    text-shadow: none !important;
}

html[data-site-theme="vaporwave"] .game-rotation-cta,
html[data-site-theme="vaporwave"] .game-rotation-cta:link,
html[data-site-theme="vaporwave"] .game-rotation-cta:visited {
    background: linear-gradient(180deg, rgba(38, 0, 70, 0.6), rgba(9, 0, 31, 0.65)) !important;
    border: 2px solid var(--vapor-cyan) !important;
    border-radius: 7px !important;
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.22),
        inset -2px -2px 0 rgba(0, 0, 0, 0.5),
        4px 4px 0 rgba(255, 43, 214, 0.45),
        0 0 18px rgba(0, 234, 255, 0.22) !important;
    outline: none !important;
    text-shadow: none !important;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease !important;
}

html[data-site-theme="vaporwave"] .game-rotation-cta:hover,
html[data-site-theme="vaporwave"] .game-rotation-cta:focus-visible {
    background: linear-gradient(180deg, rgba(38, 0, 70, 0.6), rgba(9, 0, 31, 0.65)) !important;
    border-color: var(--vapor-gold) !important;
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.4),
        inset -2px -2px 0 rgba(0, 0, 0, 0.55),
        5px 5px 0 rgba(0, 234, 255, 0.42),
        0 0 24px rgba(255, 43, 214, 0.36) !important;
    transform: translate(-2px, -2px) !important;
}

html[data-site-theme="vaporwave"] .game-rotation-cta:active {
    transform: translate(2px, 2px) !important;
    box-shadow:
        inset -2px -2px 0 rgba(255, 255, 255, 0.25),
        inset 2px 2px 0 rgba(0, 0, 0, 0.55),
        1px 1px 0 rgba(0, 234, 255, 0.35) !important;
}

html[data-site-theme="vaporwave"] #game-rotation-panel:hover .game-rotation-cta:not(:hover):not(:focus-visible),
html[data-site-theme="vaporwave"] #game-rotation-panel:focus-within .game-rotation-cta:not(:hover):not(:focus-visible) {
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.22),
        inset -2px -2px 0 rgba(0, 0, 0, 0.5),
        4px 4px 0 rgba(255, 43, 214, 0.45),
        0 0 18px rgba(0, 234, 255, 0.22) !important;
}

html[data-site-theme="vaporwave"] .nav-card > a.glass {
    background: linear-gradient(180deg, rgba(38, 0, 70, 0.6), rgba(9, 0, 31, 0.65)) !important;
    border-color: var(--vapor-cyan) !important;
    border-radius: 7px !important;
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.22),
        inset -2px -2px 0 rgba(0, 0, 0, 0.5),
        5px 5px 0 rgba(255, 43, 214, 0.5),
        0 0 24px rgba(0, 234, 255, 0.22) !important;
    letter-spacing: 0 !important;
    text-shadow: none !important;
}

html[data-site-theme="vaporwave"] .nav-card > a.glass:hover,
html[data-site-theme="vaporwave"] .nav-card > a.glass:focus-visible {
    transform: translate(-2px, -8px) scale(1.012) !important;
    border-color: var(--vapor-gold) !important;
    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.25),
        inset -2px -2px 0 rgba(0, 0, 0, 0.55),
        7px 7px 0 rgba(0, 234, 255, 0.46),
        0 0 30px rgba(255, 43, 214, 0.42) !important;
}

html[data-site-theme="vaporwave"] .nav-card > a.glass:active {
    transform: translate(2px, 2px) !important;
    box-shadow:
        inset -2px -2px 0 rgba(255, 255, 255, 0.25),
        inset 2px 2px 0 rgba(0, 0, 0, 0.55),
        1px 1px 0 rgba(0, 234, 255, 0.35) !important;
}

html[data-site-theme="vaporwave"] .site-dock-menu,
html[data-site-theme="vaporwave"] .global-player-track-menu,
html[data-site-theme="vaporwave"] .global-player-queue-panel,
html[data-site-theme="vaporwave"] .global-player-inner,
html[data-site-theme="vaporwave"] .global-player-shell {
    background: linear-gradient(180deg, rgba(38, 0, 70, 0.6), rgba(9, 0, 31, 0.65)) !important;
    border: 2px solid var(--vapor-cyan) !important;
    border-radius: 7px !important;
    box-shadow: 5px 5px 0 rgba(255, 43, 214, 0.45), 0 0 24px rgba(0, 234, 255, 0.24) !important;
}

html[data-site-theme="vaporwave"] .global-player {
    --gp-color: #ff2bd6 !important;
    animation: none !important;
}

html[data-site-theme="vaporwave"] .global-player-inner {
    animation: none !important;
}

html[data-site-theme="vaporwave"] .global-player-kicker {
    color: rgba(255, 247, 255, 0.5) !important;
    -webkit-text-fill-color: rgba(255, 247, 255, 0.5) !important;
}

html[data-site-theme="vaporwave"] .global-player-title {
    color: #fff7ff !important;
    -webkit-text-fill-color: #fff7ff !important;
}

html[data-site-theme="vaporwave"] .global-player-status,
html[data-site-theme="vaporwave"] .global-player-subtitle,
html[data-site-theme="vaporwave"] .global-player-time-row,
html[data-site-theme="vaporwave"] .global-player-volume-input {
    color: #ff5bd8 !important;
    -webkit-text-fill-color: #ff5bd8 !important;
    text-shadow: 0 0 10px rgba(255, 43, 214, 0.34) !important;
}

html[data-site-theme="vaporwave"] .global-player-eq span {
    background: #ff2bd6 !important;
    box-shadow: 0 0 12px rgba(255, 43, 214, 0.48) !important;
}

html[data-site-theme="vaporwave"] .global-player-slider-fill {
    background: linear-gradient(90deg, #00eaff 0%, #7c2cff 50%, #ff2bd6 100%) !important;
    box-shadow:
        0 0 10px rgba(0, 234, 255, 0.4),
        0 0 14px rgba(255, 43, 214, 0.45) !important;
}

html[data-site-theme="vaporwave"] .global-player-slider-track {
    background: rgba(0, 234, 255, 0.16) !important;
}

html[data-site-theme="vaporwave"] .global-player-slider::-webkit-slider-thumb {
    border-color: rgba(255, 255, 255, 0.85) !important;
    background: linear-gradient(135deg, #00eaff, #ff2bd6) !important;
    box-shadow:
        0 0 10px rgba(0, 234, 255, 0.55),
        0 0 14px rgba(255, 43, 214, 0.55) !important;
}

html[data-site-theme="vaporwave"] .global-player-slider::-moz-range-thumb {
    border-color: rgba(255, 255, 255, 0.85) !important;
    background: linear-gradient(135deg, #00eaff, #ff2bd6) !important;
    box-shadow:
        0 0 10px rgba(0, 234, 255, 0.55),
        0 0 14px rgba(255, 43, 214, 0.55) !important;
}

html[data-site-theme="vaporwave"] .poster-box {
    border-radius: 5px;
    border-color: rgba(0, 234, 255, 0.55);
    background:
        linear-gradient(135deg, rgba(255, 43, 214, 0.16), rgba(0, 234, 255, 0.08)),
        rgba(9, 0, 31, 0.6);
    box-shadow: inset 0 0 18px rgba(255, 43, 214, 0.22), 0 0 16px rgba(0, 234, 255, 0.18);
}

html[data-site-theme="vaporwave"] .status-chip,
html[data-site-theme="vaporwave"] .player-counter {
    border-radius: 4px;
    border-color: rgba(0, 234, 255, 0.45);
    background: rgba(255, 43, 214, 0.14);
    color: #ffd15c;
    text-shadow: 1px 1px 0 #12001f;
}

html[data-site-theme="vaporwave"] :is(.text-gray-400, .text-gray-500, .text-gray-600, .playlist-empty, .box-body) {
    color: rgba(255, 247, 255, 0.74) !important;
}

html[data-site-theme="vaporwave"] #daily-quote,
html[data-site-theme="vaporwave"] #daily-scripture,
html[data-site-theme="vaporwave"] #daily-quote ~ p,
html[data-site-theme="vaporwave"] footer {
    color: #fff38a !important;
    -webkit-text-fill-color: #fff38a !important;
    opacity: 0.92 !important;
    text-shadow: 2px 2px 0 #ff2bd6, -1px -1px 0 #00eaff, 0 0 18px rgba(255, 43, 214, 0.34);
}

/* --- MOTIVATIONAL QUOTE & SCRIPTURE --- */
.inspiration-container { margin-top: 6rem; margin-bottom: 2rem; text-align: center; padding: 0 1.5rem; position: relative; z-index: 10; width: 100%; }
.inspiration-wrapper { max-width: 36rem; margin: 0 auto; }
.divider-line { height: 1px; width: 100%; background: linear-gradient(to right, transparent, rgba(255,255,255,0.1), transparent); margin-bottom: 2rem; }
.divider-line-bottom { height: 1px; width: 100%; background: linear-gradient(to right, transparent, rgba(255,255,255,0.1), transparent); margin-top: 2rem; }
#daily-quote { font-size: 13px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; font-style: italic; color: white; margin-bottom: 1rem; }
#daily-scripture { font-size: 10px; font-weight: 500; letter-spacing: 0.1em; color: #6b7280; font-style: italic; }
.idea-tag { font-size: 8px; color: #1f2937; font-weight: 900; text-transform: uppercase; letter-spacing: 0.5em; margin-top: 1rem; opacity: 0.5; }

html[data-site-theme="neon"] #daily-quote,
html[data-site-theme="neon"] #daily-scripture,
html[data-site-theme="neon"] #daily-quote ~ p,
html[data-site-theme="neon"] footer {
    color: rgba(255, 255, 255, 0.9) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.9) !important;
    opacity: 0.9 !important;
    text-shadow: 0 0 10px rgba(168, 85, 247, 0.32), 0 0 18px rgba(34, 211, 238, 0.22);
}

html[data-site-theme="neon"] #daily-quote {
    opacity: 1 !important;
}

html[data-site-theme="neon"] #daily-quote + #daily-scripture {
    color: rgba(255, 255, 255, 0.78) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.78) !important;
}

html[data-site-theme="win98"] #daily-quote,
html[data-site-theme="win98"] #daily-scripture,
html[data-site-theme="win98"] #daily-quote ~ p,
html[data-site-theme="win98"] footer {
    color: var(--win98-desktop-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-desktop-text, #ffffff) !important;
    opacity: 0.92 !important;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.45);
}

/* --- WIN98 DROPDOWNS / POPUP MENUS --- */
html[data-site-theme="win98"] .site-dock-menu,
html[data-site-theme="win98"] .global-player-track-menu,
html[data-site-theme="win98"] .global-player-queue-panel {
    background: #c0c0c0 !important;
    color: #111 !important;
    border: 1px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    border-radius: 0 !important;
    box-shadow: 1px 1px 0 #000000 !important;
    padding: 2px !important;
    gap: 0 !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

html[data-site-theme="win98"] .site-dock-menu-item,
html[data-site-theme="win98"] .global-track-option,
html[data-site-theme="win98"] .global-player-queue-item {
    min-height: 22px !important;
    background: #c0c0c0 !important;
    color: #111 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 3px 18px 3px 6px !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

html[data-site-theme="win98"] .site-dock-menu-item:hover,
html[data-site-theme="win98"] .site-dock-menu-item:focus-visible {
    background: #c0c0c0 !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    outline: none !important;
}

html[data-site-theme="win98"] .global-player-queue-item:hover,
html[data-site-theme="win98"] .global-player-queue-item:focus-within {
    background: var(--win98-title-start, #000080) !important;
    color: var(--win98-title-start-text, var(--win98-title-text, #ffffff)) !important;
    -webkit-text-fill-color: var(--win98-title-start-text, var(--win98-title-text, #ffffff)) !important;
    outline: none !important;
}

html[data-site-theme="win98"] .global-track-option:hover *,
html[data-site-theme="win98"] .global-track-option.is-active *,
html[data-site-theme="win98"] .global-player-queue-item:hover *,
html[data-site-theme="win98"] .global-player-queue-item:focus-within * {
    color: var(--win98-title-start-text, var(--win98-title-text, #ffffff)) !important;
    -webkit-text-fill-color: var(--win98-title-start-text, var(--win98-title-text, #ffffff)) !important;
}

html[data-site-theme="win98"] .site-dock-menu-sep,
html[data-site-theme="win98"] .global-player-menu-sep {
    height: 0 !important;
    margin: 3px 0 !important;
    border: 0 !important;
    border-top: 1px solid #808080 !important;
    border-bottom: 1px solid #ffffff !important;
}

html[data-site-theme="win98"] #gp-track-options {
    background: #c0c0c0 !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

html[data-site-theme="win98"] .global-player-search-wrap {
    margin: 0 0 3px 0 !important;
    padding: 2px !important;
    background: #c0c0c0 !important;
    border: 0 !important;
    box-shadow: none !important;
}

html[data-site-theme="win98"] .global-track-option:hover,
html[data-site-theme="win98"] .global-track-option.is-active {
    background: #808080 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    outline: none !important;
}

html[data-site-theme="win98"] .global-track-option:hover *,
html[data-site-theme="win98"] .global-track-option.is-active * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="win98"] select,
html[data-site-theme="win98"] select.win98-desktop-select,
html[data-site-theme="win98"] .win98-desktop-dialog select,
html[data-site-theme="win98"] .playlist-select {
    appearance: none !important;
    -webkit-appearance: none !important;
    min-height: 22px !important;
    background-color: #ffffff !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    border: 1px solid !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    border-radius: 0 !important;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf !important;
    padding: 2px 22px 2px 5px !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 16px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    background-image: none !important;
}

html[data-site-theme="win98"] .win98-select-wrap {
    position: relative !important;
    display: block !important;
    min-width: 0 !important;
}

html[data-site-theme="win98"] .win98-select-wrap:has(> #win98-theme-load-sel) {
    flex: 1 1 auto !important;
    min-width: 120px !important;
}

html[data-site-theme="win98"] .field-row .win98-select-wrap,
html[data-site-theme="win98"] .win98-stack-row-body .win98-select-wrap {
    display: inline-block !important;
}

html[data-site-theme="win98"] .win98-select-wrap > select,
html[data-site-theme="win98"] .playlist-select-wrap > .playlist-select {
    padding-right: 22px !important;
}

html[data-site-theme="win98"] .win98-select-wrap::after,
html[data-site-theme="win98"] .playlist-select-wrap::after {
    content: "" !important;
    position: absolute !important;
    right: 1px !important;
    top: 1px !important;
    width: 18px !important;
    height: calc(100% - 2px) !important;
    transform: none !important;
    background: #c0c0c0 !important;
    border: 1px solid !important;
    border-color: #ffffff #404040 #404040 #ffffff !important;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
    box-sizing: border-box !important;
    pointer-events: none !important;
    z-index: 2 !important;
}

html[data-site-theme="win98"] .win98-select-wrap::before,
html[data-site-theme="win98"] .playlist-select-wrap::before {
    content: "" !important;
    position: absolute !important;
    right: 6px !important;
    top: 50% !important;
    width: 8px !important;
    height: 5px !important;
    background: #000000 !important;
    border: 0 !important;
    clip-path: polygon(0 0, 100% 0, 50% 100%) !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
    z-index: 3 !important;
}

html[data-site-theme="win98"] select option,
html[data-site-theme="win98"] .playlist-select option {
    background: #ffffff !important;
    color: #000000 !important;
    font-family: Tahoma, "MS Sans Serif", sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
}

html[data-site-theme="win98"] select option:checked,
html[data-site-theme="win98"] .playlist-select option:checked {
    background: var(--win98-selection-bg, #000080) !important;
    color: var(--win98-selection-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-selection-text, #ffffff) !important;
}

html[data-site-theme="win98"] select option:disabled,
html[data-site-theme="win98"] .playlist-select option:disabled {
    color: #808080 !important;
    background: #c0c0c0 !important;
}

html[data-site-theme="win98"] select:disabled,
html[data-site-theme="win98"] .playlist-select:disabled {
    background-color: #c0c0c0 !important;
    color: #808080 !important;
    -webkit-text-fill-color: #808080 !important;
}

html[data-site-theme="win98"] select:not(:disabled):hover,
html[data-site-theme="win98"] select:not(:disabled):focus,
html[data-site-theme="win98"] .playlist-select:not(:disabled):hover,
html[data-site-theme="win98"] .playlist-select:not(:disabled):focus {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    filter: none !important;
    outline: 1px dotted #000000 !important;
    outline-offset: -4px !important;
}

/* Disabled selects must stay flat — no hover outline, no blue selection highlight on the
   displayed option. Browsers otherwise paint :checked on the closed-select text. */
html[data-site-theme="win98"] select:disabled,
html[data-site-theme="win98"] select:disabled:hover,
html[data-site-theme="win98"] select:disabled:focus,
html[data-site-theme="win98"] .playlist-select:disabled,
html[data-site-theme="win98"] .playlist-select:disabled:hover,
html[data-site-theme="win98"] .playlist-select:disabled:focus {
    background-color: #c0c0c0 !important;
    color: #808080 !important;
    -webkit-text-fill-color: #808080 !important;
    outline: none !important;
    filter: none !important;
}

html[data-site-theme="win98"] select:disabled option,
html[data-site-theme="win98"] select:disabled option:checked,
html[data-site-theme="win98"] .playlist-select:disabled option,
html[data-site-theme="win98"] .playlist-select:disabled option:checked {
    background: #c0c0c0 !important;
    color: #808080 !important;
    -webkit-text-fill-color: #808080 !important;
}

html[data-site-theme="win98"] .global-player-track-button,
html[data-site-theme="win98"] .global-player-track-button:hover,
html[data-site-theme="win98"] .global-player-track-button:focus-visible,
html[data-site-theme="win98"] .global-player-track-button.is-open,
html[data-site-theme="win98"] .global-player-track-button.is-open:hover,
html[data-site-theme="win98"] .global-player-track-button.is-open:focus-visible,
html[data-site-theme="win98"] .global-player-track-button:active {
    min-height: 22px !important;
    padding: 2px 1px 2px 5px !important;
    background: #ffffff !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    border: 1px solid !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    border-radius: 0 !important;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf !important;
    transform: none !important;
    filter: none !important;
}

html[data-site-theme="win98"] .global-player-track-button:focus-visible,
html[data-site-theme="win98"] .global-player-track-button.is-open {
    outline: 1px dotted #000000 !important;
    outline-offset: -4px !important;
}

html[data-site-theme="win98"] .global-player-track-label {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}

html[data-site-theme="win98"] .global-player-track-chevron,
html[data-site-theme="win98"] .global-player-track-button.is-open .global-player-track-chevron {
    width: 18px !important;
    min-height: 18px !important;
    align-self: stretch !important;
    margin: -1px -1px -1px 5px !important;
    border: 1px solid !important;
    border-color: #ffffff #404040 #404040 #ffffff !important;
    border-radius: 0 !important;
    background: #c0c0c0 !important;
    box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
    color: #000000 !important;
    position: relative !important;
}

html[data-site-theme="win98"] .global-player-track-chevron svg {
    display: none !important;
}

html[data-site-theme="win98"] .global-player-track-chevron::before {
    content: "" !important;
    width: 8px !important;
    height: 5px !important;
    background: #000000 !important;
    border: 0 !important;
    clip-path: polygon(0 0, 100% 0, 50% 100%) !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
}

html[data-site-theme="win98"] .global-player-track-button.is-open .global-player-track-chevron svg {
    transform: none !important;
}

/* Player chrome follows the selected player color instead of staying black-on-gray. */
html[data-site-theme="win98"] .global-player-inner,
html[data-site-theme="win98"] .global-player-track-menu,
html[data-site-theme="win98"] .global-player-queue-panel,
html[data-site-theme="win98"] .global-player-search-wrap {
    background: var(--win98-player-bg, #c0c0c0) !important;
    color: var(--win98-player-text, #111111) !important;
}

html[data-site-theme="win98"] .global-player :is(.global-player-kicker, .global-player-status, .global-player-title, .global-player-subtitle, .global-player-time-row, .global-player-time-row *, .global-player-volume-caption, .global-player-volume-edge, .global-player-queue-item-title, .global-player-queue-item-artist) {
    color: var(--win98-player-text, #111111) !important;
    -webkit-text-fill-color: var(--win98-player-text, #111111) !important;
}

html[data-site-theme="win98"] .global-player-eq span {
    background: var(--win98-title-start, var(--win98-accent, #000080)) !important;
}

html[data-site-theme="win98"] .global-player :is(.global-player-btn, .global-player-pill, .global-player-volume-pill, .global-player-category-chip, .global-track-queue-btn),
html[data-site-theme="win98"] .global-player-show-toggle {
    background: var(--win98-player-control-bg, #c0c0c0) !important;
    color: var(--win98-player-control-text, #111111) !important;
    -webkit-text-fill-color: var(--win98-player-control-text, #111111) !important;
}

html[data-site-theme="win98"][data-win98-player-panel-stripes="1"] .global-player-inner,
html[data-site-theme="win98"][data-win98-player-panel-stripes="1"] .global-player-track-menu,
html[data-site-theme="win98"][data-win98-player-panel-stripes="1"] .global-player-queue-panel,
html[data-site-theme="win98"][data-win98-player-panel-stripes="1"] .global-player-search-wrap {
    background: var(--win98-player-panel-stripe-bg, var(--win98-player-bg, #c0c0c0)) !important;
    color: var(--win98-player-panel-stripe-text, var(--win98-player-text, #111111)) !important;
    -webkit-text-fill-color: var(--win98-player-panel-stripe-text, var(--win98-player-text, #111111)) !important;
}

html[data-site-theme="win98"][data-win98-player-panel-stripes="1"] .global-player :is(.global-player-kicker, .global-player-status, .global-player-title, .global-player-subtitle, .global-player-time-row, .global-player-time-row *, .global-player-volume-caption, .global-player-volume-edge, .global-player-queue-item-title, .global-player-queue-item-artist) {
    color: var(--win98-player-panel-stripe-text, var(--win98-player-text, #111111)) !important;
    -webkit-text-fill-color: var(--win98-player-panel-stripe-text, var(--win98-player-text, #111111)) !important;
}

html[data-site-theme="win98"] .global-player :is(.global-player-btn, .global-player-pill, .global-player-volume-pill, .global-player-category-chip, .global-track-queue-btn) *,
html[data-site-theme="win98"] .global-player-show-toggle * {
    color: var(--win98-player-control-text, #111111) !important;
    -webkit-text-fill-color: var(--win98-player-control-text, #111111) !important;
    fill: var(--win98-player-control-text, #111111) !important;
    stroke: var(--win98-player-control-text, #111111) !important;
}

html[data-site-theme="win98"] .global-player :is(.global-player-btn:hover, .global-player-pill:hover, .global-player-category-chip:not(.is-active):hover, .global-track-queue-btn:hover),
html[data-site-theme="win98"] .global-player-show-toggle:hover {
    background: var(--win98-player-control-bg, #c0c0c0) !important;
    color: var(--win98-player-control-text, #111111) !important;
    -webkit-text-fill-color: var(--win98-player-control-text, #111111) !important;
}

html[data-site-theme="win98"] .global-player :is(.global-player-btn.is-active, .global-player-btn.is-active:hover, .global-player-btn.is-active:focus-visible, .global-player-toggle-pill.is-active, .global-player-toggle-pill.is-active:hover, .global-player-toggle-pill.is-active:focus-visible, .global-player-category-chip.is-active, .global-player-category-chip.is-active:hover, .global-player-category-chip.is-active:focus-visible, .global-track-queue-btn.is-active, #gp-queue-pill[aria-expanded="true"]) {
    background: var(--win98-player-accent-bg, var(--win98-title-start, #000080)) !important;
    color: var(--win98-player-accent-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-player-accent-text, #ffffff) !important;
}

html[data-site-theme="win98"] .global-player :is(.global-player-btn.is-active, .global-player-toggle-pill.is-active, .global-player-category-chip.is-active, .global-track-queue-btn.is-active, #gp-queue-pill[aria-expanded="true"]) * {
    color: var(--win98-player-accent-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-player-accent-text, #ffffff) !important;
    fill: var(--win98-player-accent-text, #ffffff) !important;
    stroke: var(--win98-player-accent-text, #ffffff) !important;
}

html[data-site-theme="win98"][data-win98-player-button-stripes="1"] .global-player :is(.global-player-btn, .global-player-btn:hover, .global-player-btn.is-active, .global-player-pill, .global-player-pill:hover, .global-player-toggle-pill.is-active, .global-player-category-chip, .global-player-category-chip:hover, .global-player-category-chip.is-active, .global-track-queue-btn, .global-track-queue-btn:hover, .global-track-queue-btn.is-active, #gp-queue-pill[aria-expanded="true"]),
html[data-site-theme="win98"][data-win98-player-button-stripes="1"] .global-player-show-toggle,
html[data-site-theme="win98"][data-win98-player-button-stripes="1"] .global-player-show-toggle:hover {
    background: var(--win98-player-button-stripe-bg-local, var(--win98-player-button-stripe-bg, var(--win98-player-control-bg, #c0c0c0))) !important;
    color: var(--win98-player-button-stripe-text-local, var(--win98-player-button-stripe-text, var(--win98-player-control-text, #111111))) !important;
    -webkit-text-fill-color: var(--win98-player-button-stripe-text-local, var(--win98-player-button-stripe-text, var(--win98-player-control-text, #111111))) !important;
}

html[data-site-theme="win98"][data-win98-player-button-stripes="1"] .global-player :is(.global-player-btn, .global-player-pill, .global-player-category-chip, .global-track-queue-btn) *,
html[data-site-theme="win98"][data-win98-player-button-stripes="1"] .global-player-show-toggle * {
    color: var(--win98-player-button-stripe-text-local, var(--win98-player-button-stripe-text, var(--win98-player-control-text, #111111))) !important;
    -webkit-text-fill-color: var(--win98-player-button-stripe-text-local, var(--win98-player-button-stripe-text, var(--win98-player-control-text, #111111))) !important;
    fill: var(--win98-player-button-stripe-text-local, var(--win98-player-button-stripe-text, var(--win98-player-control-text, #111111))) !important;
    stroke: var(--win98-player-button-stripe-text-local, var(--win98-player-button-stripe-text, var(--win98-player-control-text, #111111))) !important;
}

html[data-site-theme="win98"] .global-player-track-button,
html[data-site-theme="win98"] .global-player-track-button:hover,
html[data-site-theme="win98"] .global-player-track-button:focus-visible,
html[data-site-theme="win98"] .global-player-track-button.is-open,
html[data-site-theme="win98"] .global-player-track-button.is-open:hover,
html[data-site-theme="win98"] .global-player-track-button.is-open:focus-visible,
html[data-site-theme="win98"] .global-player-track-button:active,
html[data-site-theme="win98"] .global-player-search,
html[data-site-theme="win98"] .global-player-volume-input,
html[data-site-theme="win98"] .global-player .playlist-select {
    background: var(--win98-player-field-bg, #ffffff) !important;
    background-color: var(--win98-player-field-bg, #ffffff) !important;
    color: var(--win98-player-field-text, #000000) !important;
    -webkit-text-fill-color: var(--win98-player-field-text, #000000) !important;
}

html[data-site-theme="win98"] .global-player #gp-volume-value.global-player-volume-input {
    background: var(--win98-player-field-bg, #ffffff) !important;
    background-color: var(--win98-player-field-bg, #ffffff) !important;
    color: var(--win98-player-field-text, #000000) !important;
    -webkit-text-fill-color: var(--win98-player-field-text, #000000) !important;
}

html[data-site-theme="win98"] .global-player-track-button:focus-visible,
html[data-site-theme="win98"] .global-player-track-button.is-open,
html[data-site-theme="win98"] .global-player .playlist-select:not(:disabled):hover,
html[data-site-theme="win98"] .global-player .playlist-select:not(:disabled):focus {
    outline-color: var(--win98-player-field-text, #000000) !important;
}

html[data-site-theme="win98"] .global-player-track-label {
    color: var(--win98-player-field-text, #000000) !important;
    -webkit-text-fill-color: var(--win98-player-field-text, #000000) !important;
}

html[data-site-theme="win98"] .global-player-track-chevron,
html[data-site-theme="win98"] .global-player-track-button.is-open .global-player-track-chevron,
html[data-site-theme="win98"] .global-player .playlist-select-wrap::after {
    background: var(--win98-player-control-bg, #c0c0c0) !important;
    color: var(--win98-player-control-text, #111111) !important;
}

html[data-site-theme="win98"] .global-player-track-chevron::before,
html[data-site-theme="win98"] .global-player .playlist-select-wrap::before {
    background: var(--win98-player-control-text, #111111) !important;
}

html[data-site-theme="win98"] #gp-track-options,
html[data-site-theme="win98"] .global-track-option,
html[data-site-theme="win98"] .global-player-queue-item {
    background: var(--win98-player-field-bg, #ffffff) !important;
    color: var(--win98-player-field-text, #000000) !important;
    -webkit-text-fill-color: var(--win98-player-field-text, #000000) !important;
}

html[data-site-theme="win98"] .global-track-option :is(.global-track-title, .global-track-main),
html[data-site-theme="win98"] .global-player-queue-item-title {
    color: var(--win98-player-field-text, #000000) !important;
    -webkit-text-fill-color: var(--win98-player-field-text, #000000) !important;
}

html[data-site-theme="win98"] .global-track-option :is(.global-track-artist, .global-track-option-index),
html[data-site-theme="win98"] .global-player-queue-item-artist,
html[data-site-theme="win98"] .global-player-search::placeholder {
    color: var(--win98-player-field-muted, #444444) !important;
    -webkit-text-fill-color: var(--win98-player-field-muted, #444444) !important;
}

html[data-site-theme="win98"] .global-track-option:hover,
html[data-site-theme="win98"] .global-track-option.is-active,
html[data-site-theme="win98"] .global-player-queue-item:hover,
html[data-site-theme="win98"] .global-player-queue-item:focus-within {
    background: var(--win98-player-accent-bg, var(--win98-title-start, #000080)) !important;
    color: var(--win98-player-accent-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-player-accent-text, #ffffff) !important;
}

html[data-site-theme="win98"] .global-track-option:hover *,
html[data-site-theme="win98"] .global-track-option.is-active *,
html[data-site-theme="win98"] .global-player-queue-item:hover *,
html[data-site-theme="win98"] .global-player-queue-item:focus-within * {
    color: var(--win98-player-accent-text, #ffffff) !important;
    -webkit-text-fill-color: var(--win98-player-accent-text, #ffffff) !important;
}

html[data-site-theme="win98"] .global-player-slider-track,
html[data-site-theme="win98"] #gp-volume-area .global-player-slider-track,
html[data-site-theme="win98"] .global-player-progress .global-player-slider-track {
    background: var(--win98-player-track-rail, #111111) !important;
}

html[data-site-theme="win98"] .global-player-slider::-webkit-slider-thumb,
html[data-site-theme="win98"] #gp-volume.global-player-slider::-webkit-slider-thumb,
html[data-site-theme="win98"] #gp-progress.global-player-slider::-webkit-slider-thumb {
    background: var(--win98-player-control-bg, #c0c0c0) !important;
    border-color: var(--win98-player-control-text, #111111) !important;
}

html[data-site-theme="win98"] .global-player-slider::-moz-range-thumb,
html[data-site-theme="win98"] #gp-volume.global-player-slider::-moz-range-thumb,
html[data-site-theme="win98"] #gp-progress.global-player-slider::-moz-range-thumb {
    background: var(--win98-player-control-bg, #c0c0c0) !important;
    border-color: var(--win98-player-control-text, #111111) !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar {
    width: var(--win98-scrollbar-size) !important;
    height: var(--win98-scrollbar-size) !important;
    background: #c0c0c0 !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-track,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-track,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-track,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-track,
html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-track-piece,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-track-piece,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-track-piece,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-track-piece {
    background-color: #c0c0c0 !important;
    background-image: repeating-conic-gradient(#ffffff 0% 25%, #c0c0c0 0% 50%) !important;
    background-size: 2px 2px !important;
    background-repeat: repeat !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-button,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-button,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-button,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-button {
    display: block !important;
    width: var(--win98-scrollbar-size) !important;
    height: var(--win98-scrollbar-size) !important;
    background-color: #c0c0c0 !important;
    background-image: var(--win98-sb-sprite) !important;
    background-repeat: no-repeat !important;
    background-size: calc(4 * var(--win98-scrollbar-size)) calc(2 * var(--win98-scrollbar-size)) !important;
    background-origin: border-box !important;
    background-clip: border-box !important;
    border: 2px solid !important;
    border-image: var(--win98-sb-bdi) !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-thumb,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-thumb,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-thumb,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-thumb {
    background: #c0c0c0 !important;
    border: 2px solid !important;
    border-image: var(--win98-sb-bdi) !important;
    border-radius: 0 !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-button:vertical:decrement,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-button:vertical:decrement,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-button:vertical:decrement,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-button:vertical:decrement {
    background-position: 0 0 !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-button:vertical:increment,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-button:vertical:increment,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-button:vertical:increment,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-button:vertical:increment {
    background-position: calc(-1 * var(--win98-scrollbar-size)) 0 !important;
}

html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-button:end:decrement,
html[data-site-theme="win98"] .global-player-track-menu::-webkit-scrollbar-button:start:increment,
html[data-site-theme="win98"] #gp-track-options::-webkit-scrollbar-button:start:increment,
html[data-site-theme="win98"] .global-player-category-chips::-webkit-scrollbar-button:start:increment,
html[data-site-theme="win98"] .global-player-queue-list::-webkit-scrollbar-button:start:increment {
    display: none !important;
}

html[data-site-theme="win98"] .global-track-option:hover .global-track-queue-btn,
html[data-site-theme="win98"] .global-track-option.is-active .global-track-queue-btn {
    background: #c0c0c0 !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    fill: #111111 !important;
    stroke: #111111 !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
}

html[data-site-theme="win98"] .global-player-controls .global-player-btn svg {
    width: 13px !important;
    height: 13px !important;
}

html[data-site-theme="win98"] .global-player-controls .global-player-btn.play-btn svg {
    width: 14px !important;
    height: 14px !important;
}

html[data-site-theme="win98"] .global-player-controls .global-player-btn svg.shuffle-icon,
html[data-site-theme="win98"] .global-player-controls .global-player-btn svg.shuffle-icon * {
    stroke-width: 1.45 !important;
}

html[data-site-theme="win98"] .btn-glow,
html[data-site-theme="win98"] .btn-glow:link,
html[data-site-theme="win98"] .btn-glow:visited,
html[data-site-theme="win98"] .btn-glow:hover,
html[data-site-theme="win98"] .btn-glow:focus-visible {
    background: #c0c0c0 !important;
    background-image: none !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    border: 2px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    filter: none !important;
    text-shadow: none !important;
    transform: none !important;
    transition: filter 0.12s ease !important;
}

html[data-site-theme="win98"] .btn-glow:hover,
html[data-site-theme="win98"] .btn-glow:focus-visible {
    filter: brightness(1.04) !important;
}

html[data-site-theme="win98"] .btn-glow:active {
    background: #c0c0c0 !important;
    background-image: none !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    border: 2px solid !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    border-radius: 0 !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
    filter: none !important;
    text-shadow: none !important;
    transform: none !important;
}

html[data-site-theme="win98"] .btn-glow::before,
html[data-site-theme="win98"] .btn-glow::after {
    display: none !important;
}

html[data-site-theme="win98"] .game-rotation-cta,
html[data-site-theme="win98"] .game-rotation-cta:link,
html[data-site-theme="win98"] .game-rotation-cta:visited,
html[data-site-theme="win98"] #game-rotation-panel:hover .game-rotation-cta,
html[data-site-theme="win98"] #game-rotation-panel:focus-within .game-rotation-cta {
    background: #c0c0c0 !important;
    background-image: none !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    border: 2px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    border-radius: 0 !important;
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    filter: none !important;
    text-shadow: none !important;
    transform: none !important;
    transition: filter 0.12s ease !important;
}

html[data-site-theme="win98"] .game-rotation-cta:hover,
html[data-site-theme="win98"] .game-rotation-cta:focus-visible {
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    transform: none !important;
    filter: brightness(1.04) !important;
}

html[data-site-theme="win98"] #game-rotation-panel:hover .game-rotation-cta:hover,
html[data-site-theme="win98"] #game-rotation-panel:focus-within .game-rotation-cta:focus-visible {
    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
    transform: none !important;
    filter: brightness(1.04) !important;
}

html[data-site-theme="win98"] .game-rotation-cta:active {
    background: #c0c0c0 !important;
    background-image: none !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    border: 2px solid !important;
    border-color: #808080 #ffffff #ffffff #808080 !important;
    border-radius: 0 !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
    filter: none !important;
    text-shadow: none !important;
    transform: none !important;
}

html[data-site-theme="win98"] #game-rotation-panel:hover .game-rotation-cta:active,
html[data-site-theme="win98"] #game-rotation-panel:focus-within .game-rotation-cta:active {
    border-color: #808080 #ffffff #ffffff #808080 !important;
    box-shadow: inset 1px 1px 0 #000000, inset -1px -1px 0 #dfdfdf !important;
    filter: none !important;
    transform: none !important;
}

html[data-site-theme="win98"] .game-rotation-cta::before,
html[data-site-theme="win98"] .game-rotation-cta::after {
    display: none !important;
    content: none !important;
}

html[data-site-theme="win98"] .game-rotation-cta .game-rotation-cta-label {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    text-shadow: none !important;
}

html[data-site-theme="win98"],
html[data-site-theme="win98"] body,
html[data-site-theme="win98"] body *,
html[data-site-theme="win98"] body *::before,
html[data-site-theme="win98"] body *::after,
html[data-site-theme="win98"] button,
html[data-site-theme="win98"] a,
html[data-site-theme="win98"] input,
html[data-site-theme="win98"] select,
html[data-site-theme="win98"] textarea,
html[data-site-theme="win98"] [role="button"] {
    cursor: var(--site-cursor, url("/data/assets/win98/cursors/default.png") 3 2, auto) !important;
}

html[data-site-theme="win98"],
html[data-site-theme="win98"] body,
html[data-site-theme="win98"] body * {
    cursor: var(--win98-cursor-default, url("/data/assets/win98/cursors/default.png") 3 2, auto) !important;
}

html[data-site-theme="win98"] a,
html[data-site-theme="win98"] button,
html[data-site-theme="win98"] select,
html[data-site-theme="win98"] .win98-select-wrap,
html[data-site-theme="win98"] .win98-cursor-picker,
html[data-site-theme="win98"] .win98-cursor-picker *,
html[data-site-theme="win98"] .win98-cursor-scheme-picker,
html[data-site-theme="win98"] .win98-cursor-scheme-picker *,
html[data-site-theme="win98"] [role="button"],
html[data-site-theme="win98"] input[type="button"],
html[data-site-theme="win98"] input[type="submit"] {
    cursor: var(--win98-cursor-pointer, url("/data/assets/win98/cursors/pointer.png") 12 5, pointer) !important;
}

html[data-site-theme="win98"] input[type="text"],
html[data-site-theme="win98"] input[type="search"],
html[data-site-theme="win98"] input[type="number"],
html[data-site-theme="win98"] input[type="email"],
html[data-site-theme="win98"] input[type="password"],
html[data-site-theme="win98"] input[type="tel"],
html[data-site-theme="win98"] input[type="url"],
html[data-site-theme="win98"] input:not([type]),
html[data-site-theme="win98"] textarea,
html[data-site-theme="win98"] [contenteditable="true"] {
    cursor: var(--win98-cursor-text, url("/data/assets/win98/cursors/text.png") 15 16, text) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog-titlebar .win98-desktop-dialog-close,
html[data-site-theme="win98"] .win98-desktop-dialog-titlebar .win98-desktop-dialog-close:hover,
html[data-site-theme="win98"] .win98-desktop-dialog-titlebar .win98-desktop-dialog-close:focus-visible,
html[data-site-theme="win98"] .win98-desktop-dialog-titlebar .win98-desktop-dialog-close:active {
    cursor: var(--win98-cursor-default, url("/data/assets/win98/cursors/default.png") 3 2, auto) !important;
}

html[data-site-theme="win98"] [data-cursor="resize-ns"],
html[data-site-theme="win98"] [data-cursor="resize-ns"] * {
    cursor: var(--win98-cursor-resize-ns, url("/data/assets/win98/cursors/ns-resize.png") 15 15, ns-resize) !important;
}

html[data-site-theme="win98"] [data-cursor="resize-ew"],
html[data-site-theme="win98"] [data-cursor="resize-ew"] * {
    cursor: var(--win98-cursor-resize-ew, url("/data/assets/win98/cursors/ew-resize.png") 15 15, ew-resize) !important;
}

html[data-site-theme="win98"] [data-cursor="resize-nwse"],
html[data-site-theme="win98"] [data-cursor="resize-nwse"] * {
    cursor: var(--win98-cursor-resize-nwse, url("/data/assets/win98/cursors/nwse-resize.png") 15 15, nwse-resize) !important;
}

html[data-site-theme="win98"] [data-cursor="resize-nesw"],
html[data-site-theme="win98"] [data-cursor="resize-nesw"] * {
    cursor: var(--win98-cursor-resize-nesw, url("/data/assets/win98/cursors/nesw-resize.png") 15 15, nesw-resize) !important;
}

html[data-site-theme="win98"] .global-player-btn,
html[data-site-theme="win98"] .global-player-btn *,
html[data-site-theme="win98"] .global-player-controls,
html[data-site-theme="win98"] .global-player-controls *,
html[data-site-theme="win98"] .global-player-value-pill,
html[data-site-theme="win98"] .global-player-value-pill *,
html[data-site-theme="win98"] .global-player-pill,
html[data-site-theme="win98"] .global-player-pill *,
html[data-site-theme="win98"] .global-player-toggle-pill,
html[data-site-theme="win98"] .global-player-toggle-pill *,
html[data-site-theme="win98"] .global-player-track-button,
html[data-site-theme="win98"] .global-player-track-button *,
html[data-site-theme="win98"] .global-track-option,
html[data-site-theme="win98"] .global-track-option *,
html[data-site-theme="win98"] .global-track-queue-btn,
html[data-site-theme="win98"] .global-track-queue-btn *,
html[data-site-theme="win98"] .global-player-category-chip,
html[data-site-theme="win98"] .global-player-category-chip *,
html[data-site-theme="win98"] .global-player-slider,
html[data-site-theme="win98"] .global-player-slider-wrap,
html[data-site-theme="win98"] .global-player-slider-track,
html[data-site-theme="win98"] .global-player-slider-fill,
html[data-site-theme="win98"] .global-player-slider::-webkit-slider-runnable-track,
html[data-site-theme="win98"] .global-player-slider::-webkit-slider-thumb,
html[data-site-theme="win98"] .global-player-slider::-moz-range-track,
html[data-site-theme="win98"] .global-player-slider::-moz-range-thumb,
html[data-site-theme="win98"] input[type="range"] {
    cursor: var(--win98-cursor-pointer, url("/data/assets/win98/cursors/pointer.png") 12 5, pointer) !important;
}

html[data-site-theme="win98"] .global-player-track-menu {
    cursor: auto !important;
}

html[data-site-theme="win98"] #gp-track-resize.global-player-track-resize {
    cursor: var(--win98-cursor-resize-nesw, url("/data/assets/win98/cursors/nesw-resize.png") 15 15, nesw-resize) !important;
}

html[data-site-theme="win98"] button:disabled,
html[data-site-theme="win98"] button:disabled *,
html[data-site-theme="win98"] input:disabled,
html[data-site-theme="win98"] input:disabled *,
html[data-site-theme="win98"] input[type="range"]:disabled,
html[data-site-theme="win98"] input[type="range"]:disabled::-webkit-slider-runnable-track,
html[data-site-theme="win98"] input[type="range"]:disabled::-webkit-slider-thumb,
html[data-site-theme="win98"] input[type="range"]:disabled::-moz-range-track,
html[data-site-theme="win98"] input[type="range"]:disabled::-moz-range-thumb,
html[data-site-theme="win98"] select:disabled,
html[data-site-theme="win98"] select:disabled *,
html[data-site-theme="win98"] textarea:disabled,
html[data-site-theme="win98"] textarea:disabled *,
html[data-site-theme="win98"] [disabled],
html[data-site-theme="win98"] [disabled] *,
html[data-site-theme="win98"] .disabled,
html[data-site-theme="win98"] .disabled *,
html[data-site-theme="win98"] .is-disabled,
html[data-site-theme="win98"] .is-disabled *,
html[data-site-theme="win98"] .unavailable,
html[data-site-theme="win98"] .unavailable *,
html[data-site-theme="win98"] .is-unavailable,
html[data-site-theme="win98"] .is-unavailable *,
html[data-site-theme="win98"] [data-cursor="not-allowed"],
html[data-site-theme="win98"] [data-cursor="not-allowed"] *,
html[data-site-theme="win98"] [data-disabled="true"],
html[data-site-theme="win98"] [data-disabled="true"] *,
html[data-site-theme="win98"] [aria-disabled="true"],
html[data-site-theme="win98"] [aria-disabled="true"] * {
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

/* ============================================================
   CURSOR POLICY — universal catch-all (must stay last in file)
   Order: pointer rule first, not-allowed rule second.
   not-allowed wins on disabled buttons via source order tiebreak.
   ============================================================ */

html[data-site-theme="win98"] :is(
    button,
    a[href],
    summary,
    label[for],
    select,
    [role="button"],
    [role="link"],
    [role="tab"],
    [role="menuitem"],
    [role="menuitemcheckbox"],
    [role="menuitemradio"],
    [role="option"],
    [role="switch"],
    [role="checkbox"],
    [role="radio"],
    [role="treeitem"],
    [onclick],
    [data-action],
    [data-href],
    [data-cursor="pointer"],
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    input[type="checkbox"],
    input[type="radio"],
    input[type="color"],
    input[type="image"],
    input[type="file"]
):not(:disabled):not([disabled]):not([aria-disabled="true"]):not([data-disabled="true"]):not(.disabled):not(.is-disabled):not(.unavailable):not(.is-unavailable),
html[data-site-theme="win98"] :is(
    button,
    a[href],
    summary,
    label[for],
    select,
    [role="button"],
    [role="link"],
    [role="tab"],
    [role="menuitem"],
    [role="menuitemcheckbox"],
    [role="menuitemradio"],
    [role="option"],
    [role="switch"],
    [role="checkbox"],
    [role="radio"],
    [role="treeitem"],
    [onclick],
    [data-action],
    [data-href],
    [data-cursor="pointer"],
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    input[type="checkbox"],
    input[type="radio"],
    input[type="color"],
    input[type="image"],
    input[type="file"]
):not(:disabled):not([disabled]):not([aria-disabled="true"]):not([data-disabled="true"]):not(.disabled):not(.is-disabled):not(.unavailable):not(.is-unavailable) * {
    cursor: var(--win98-cursor-pointer, url("/data/assets/win98/cursors/pointer.png") 12 5, pointer) !important;
}

html[data-site-theme="win98"] :is(
    :disabled,
    [disabled],
    [aria-disabled="true"],
    [data-disabled="true"],
    [data-disabled],
    [data-cursor="not-allowed"],
    .disabled,
    .is-disabled,
    .unavailable,
    .is-unavailable,
    .greyed,
    .greyed-out,
    .grayed,
    .grayed-out,
    .muted-control,
    .is-muted-control,
    .locked,
    .is-locked,
    .readonly:not(input):not(textarea):not(select),
    .is-readonly:not(input):not(textarea):not(select)
),
html[data-site-theme="win98"] :is(
    :disabled,
    [disabled],
    [aria-disabled="true"],
    [data-disabled="true"],
    [data-disabled],
    [data-cursor="not-allowed"],
    .disabled,
    .is-disabled,
    .unavailable,
    .is-unavailable,
    .greyed,
    .greyed-out,
    .grayed,
    .grayed-out,
    .muted-control,
    .is-muted-control,
    .locked,
    .is-locked
) * {
    /* Override inline `pointer-events: none` so cursor can render.
       Disabled attribute still blocks clicks, drags, and keyboard input. */
    pointer-events: auto !important;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

/* Field rows whose input is disabled — label inside row also gets not-allowed.
   Covers <span class="field-row"><input disabled><label></label></span> pattern. */
html[data-site-theme="win98"] .field-row:has(:is(input, button, select, textarea):is(:disabled, [disabled], [aria-disabled="true"])),
html[data-site-theme="win98"] .field-row:has(:is(input, button, select, textarea):is(:disabled, [disabled], [aria-disabled="true"])) * {
    pointer-events: auto !important;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog :is(input, select, textarea, button):disabled {
    pointer-events: none !important;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog .win98-inline-controls:has(:is(input, button, select, textarea):disabled) {
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog .win98-color-effect-grid:has(:is(input, button, select, textarea):disabled),
html[data-site-theme="win98"] .win98-desktop-dialog .win98-color-effect-grid:has(:is(input, button, select, textarea):disabled) * {
    pointer-events: auto !important;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog .win98-color-override-values:has(:is(input, button, select, textarea):disabled),
html[data-site-theme="win98"] .win98-desktop-dialog .win98-color-override-values:has(:is(input, button, select, textarea):disabled) * {
    pointer-events: auto !important;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog .win98-color-override-row:has(> input[type="checkbox"]:disabled),
html[data-site-theme="win98"] .win98-desktop-dialog .win98-color-override-row:has(> input[type="checkbox"]:disabled) * {
    pointer-events: auto !important;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog .win98-select-wrap:has(> select:disabled),
html[data-site-theme="win98"] .win98-desktop-dialog .win98-select-wrap:has(> select:disabled) *,
html[data-site-theme="win98"] .win98-desktop-dialog-fieldset[data-win98-category-disabled],
html[data-site-theme="win98"] .win98-desktop-dialog-fieldset[data-win98-category-disabled] * {
    pointer-events: auto !important;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog-fieldset[data-win98-category-disabled] .win98-section-enable-row,
html[data-site-theme="win98"] .win98-desktop-dialog-fieldset[data-win98-category-disabled] .win98-section-enable-row * {
    cursor: var(--win98-cursor-pointer, pointer) !important;
}

html[data-site-theme="win98"] .win98-wallpaper-grid[data-controls-disabled="true"] .win98-wallpaper-item {
    opacity: 0.45;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog input[type="range"]:disabled::-webkit-slider-thumb {
    opacity: 0 !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog input[type="range"]:disabled::-moz-range-thumb {
    opacity: 0 !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog .win98-select-wrap:has(> select:disabled)::before,
html[data-site-theme="win98"] .win98-desktop-dialog .win98-select-wrap:has(> select:disabled)::after {
    opacity: 0 !important;
    display: none !important;
}

/* Rainbow control group — sub-controls (Animated, Pastel, Direction, Speed)
   are not actually `disabled`'d when master is off, just visually dimmed.
   When master checkbox in the FIRST .field-row is unchecked, treat the rest
   of the group as unavailable. */
html[data-site-theme="win98"] .win98-desktop-dialog :is(input, select, textarea, button):disabled,
html[data-site-theme="win98"] .win98-desktop-dialog :is(input, select, textarea, button):disabled * {
    pointer-events: none !important;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog :is(
    [data-controls-disabled="true"],
    [aria-disabled="true"],
    [data-win98-category-disabled],
    .win98-color-effect-grid:has(:is(input, button, select, textarea):disabled),
    .win98-color-override-values:has(:is(input, button, select, textarea):disabled),
    .win98-inline-controls:has(:is(input, button, select, textarea):disabled)
) {
    pointer-events: auto !important;
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

html[data-site-theme="win98"] .win98-desktop-dialog :is(
    [data-controls-disabled="true"],
    [aria-disabled="true"],
    [data-win98-category-disabled],
    .win98-color-effect-grid:has(:is(input, button, select, textarea):disabled),
    .win98-color-override-values:has(:is(input, button, select, textarea):disabled),
    .win98-inline-controls:has(:is(input, button, select, textarea):disabled)
) * {
    cursor: var(--win98-cursor-not-allowed, url("/data/assets/win98/cursors/not-allowed.png") 7 6, not-allowed) !important;
}

/* Native text selection highlight — tracks active win98 palette. */
html[data-site-theme="win98"] .win98-cursor-picker-search,
html[data-site-theme="win98"] .win98-cursor-picker-search * {
    cursor: var(--win98-cursor-text, url("/data/assets/win98/cursors/text.png") 15 16, text) !important;
}

html[data-site-theme="win98"] ::selection {
    background: var(--win98-selection-bg, #000080);
    color: var(--win98-selection-text, #ffffff);
    -webkit-text-fill-color: var(--win98-selection-text, #ffffff);
}
html[data-site-theme="win98"] ::-moz-selection {
    background: var(--win98-selection-bg, #000080);
    color: var(--win98-selection-text, #ffffff);
}

html[data-site-theme="win98"][data-win98-selection-bg-rainbow="1"] {
    --win98-selection-bg-image: var(--win98-rainbow-selection-scroll-strip);
    --win98-selection-bg-size: var(--win98-rainbow-selection-bg-size, 224px 100%);
    --win98-selection-bg-animation: var(--win98-rainbow-selection-anim-name, win98-selection-rainbow-h) var(--win98-rainbow-selection-duration, 28s) linear infinite;
    --win98-selection-bg-animation-state: var(--win98-rainbow-selection-play-state, running);
}

/* When titlebar uses stripes (not rainbow) and selection-bg-rainbow is OFF, mirror
   the live titlebar background (--win98-title-bg) onto the selection highlight +
   marquee so colors shuffle in lockstep with the titlebar and alpha follows the
   user's titlebar opacity setting (hexToRgba in getWin98TitleBackground bakes
   titleBarOpacity into each color stop). Text color uses the middle stripe's
   auto-contrast pairing (readableTextColor) so it stays legible. */
html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]):not([data-win98-selection-bg-rainbow="1"]) {
    --win98-selection-bg-image: var(--win98-title-bg, none);
    --win98-selection-bg-size: auto;
    --win98-selection-text: var(--win98-title-stripe-rot-2-text, #ffffff);
    --win98-selection-outline: var(--win98-title-stripe-rot-2, #000080);
}
/* Marquee shows stripes at 20% via a ::before fill so the outline stays
   fully opaque. Outline uses border-image sourced from the live titlebar
   gradient so all 3 stripe colors cycle along the border instead of one. */
html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]):not([data-win98-selection-bg-rainbow="1"]) .win98-marquee {
    background-color: transparent;
    background-image: none;
    overflow: hidden;
    opacity: 1;
    border: 1px solid transparent;
    border-image: var(--win98-title-bg, linear-gradient(90deg, var(--win98-title-stripe-rot-1, #000080), var(--win98-title-stripe-rot-2, #1084d0), var(--win98-title-stripe-rot-3, #00d8ff))) 1;
}
html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]):not([data-win98-selection-bg-rainbow="1"]) .win98-marquee::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: var(--win98-title-bg, none);
    background-size: var(--win98-selection-bg-size, auto);
    animation: var(--win98-selection-bg-animation, none);
    animation-play-state: var(--win98-selection-bg-animation-state, running);
    opacity: 0.2;
    pointer-events: none;
}

/* Text selection over striped highlight: paint the live titlebar stripe pattern
   onto the selection bg, force white text plus a tight black outline so the
   glyph stays legible across every stripe band. The default ::selection rule
   uses the `background:` shorthand which wipes background-image — these rules
   restore it under stripes mode. */
html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]):not([data-win98-selection-bg-rainbow="1"]) ::selection {
    background-color: var(--win98-title-stripe-rot-1, #000080) !important;
    background-image: var(--win98-title-bg, none) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow:
        1px 0 0 #000,
        -1px 0 0 #000,
        0 1px 0 #000,
        0 -1px 0 #000,
        1px 1px 0 #000,
        -1px -1px 0 #000,
        1px -1px 0 #000,
        -1px 1px 0 #000 !important;
}
html[data-site-theme="win98"][data-win98-title-stripes="1"]:not([data-win98-title-rainbow="1"]):not([data-win98-selection-bg-rainbow="1"]) ::-moz-selection {
    background-color: var(--win98-title-stripe-rot-1, #000080) !important;
    background-image: var(--win98-title-bg, none) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow:
        1px 0 0 #000,
        -1px 0 0 #000,
        0 1px 0 #000,
        0 -1px 0 #000,
        1px 1px 0 #000,
        -1px -1px 0 #000,
        1px -1px 0 #000,
        -1px 1px 0 #000 !important;
}

html[data-site-theme="win98"][data-win98-selection-highlighter-rainbow="1"] {
    animation: win98-selection-text-hue var(--win98-rainbow-title-duration, 28s) linear infinite;
}

@property --win98-selection-text-hue {
    syntax: "<number>";
    inherits: true;
    initial-value: 0;
}

@keyframes win98-selection-text-hue {
    from { --win98-selection-text-hue: 0; }
    to { --win98-selection-text-hue: 360; }
}

html[data-site-theme="win98"][data-win98-selection-text-rainbow="1"] {
    --win98-selection-text: hsl(var(--win98-selection-text-hue), 100%, 52%);
    animation: win98-selection-text-hue var(--win98-rainbow-title-duration, 28s) linear infinite;
}

/* Drag-select marquee — semi-transparent rectangle over empty desktop area.
   Color tracks the active win98 palette (titlebar gradient start). */
.win98-marquee {
    position: absolute;
    pointer-events: none;
    z-index: 99999;
    background-color: var(--win98-selection-bg, color-mix(in srgb, var(--win98-title-start, #000080) 22%, transparent));
    background-image: var(--win98-selection-bg-image, none);
    background-size: var(--win98-selection-bg-size, auto);
    animation: var(--win98-selection-bg-animation, none);
    animation-play-state: var(--win98-selection-bg-animation-state, running);
    border: 1px solid var(--win98-selection-outline, var(--win98-title-start, #000080));
}

html[data-site-theme="win98"][data-win98-selection-bg-rainbow="1"] .win98-marquee {
    border-image: var(--win98-rainbow-selection-scroll-strip) 1;
}

/* While the marquee is being dragged, kill text selection everywhere so the cursor
   passing over text inside cards doesn't leak ghost highlights outside them. */
body.win98-marquee-active,
body.win98-marquee-active * {
    user-select: none !important;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
}

/* Per-tab Reset bar — sits at top-right of each Personalization tab page. */
html[data-site-theme="win98"] .win98-dialog-tab-reset-bar {
    display: flex;
    justify-content: flex-end;
    margin: 0 0 6px;
}
html[data-site-theme="win98"] .win98-dialog-tab-reset {
    font: 11px/16px Tahoma, "MS Sans Serif", sans-serif !important;
    padding: 2px 10px !important;
    background: #c0c0c0 !important;
    color: #000 !important;
    border: 1px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    box-shadow: inset 1px 1px 0 #dfdfdf, inset -1px -1px 0 #404040 !important;
    border-radius: 0 !important;
}
html[data-site-theme="win98"] .win98-dialog-tab-reset:active {
    border-color: #808080 #ffffff #ffffff #808080 !important;
    box-shadow: inset 1px 1px 0 #404040, inset -1px -1px 0 #dfdfdf !important;
    padding: 3px 9px 1px 11px !important;
}
html[data-site-theme="win98"] .win98-dialog-tab-reset:focus-visible {
    outline: 1px dotted #000 !important;
    outline-offset: -4px !important;
}

html[data-site-theme="win98"] :is(
    .win98-dialog-tab,
    .win98-dialog-tab-reset,
    .win98-desktop-dialog-close,
    .win98-error-dialog-close,
    .site-dock-menu-button,
    .site-control-toggle
):is(:hover, :focus-visible) {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
}

/* ─── CRT / VHS overlay (vaporwave theme only, gated by FX toggle) ─── */
.crt-overlay {
    display: none;
}
html[data-site-theme="vaporwave"]:not([data-vaporwave-fx="off"]) .crt-overlay {
    display: block;
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 2147483000;
    overflow: hidden;
    contain: strict;
    /* Lower whole-overlay intensity in vaporwave — VHS sits as a quiet film grain layer. */
    opacity: 0.42;
}
/* When the WebGL bad-TV shader canvas is present, it replaces the CSS layers
   entirely (user-requested replacement). Canvas already outputs ~15% alpha so
   the parent opacity is bumped back to 1 to avoid double-dimming. */
html[data-site-theme="vaporwave"]:not([data-vaporwave-fx="off"]) .crt-overlay:has(.crt-badtv-canvas) {
    opacity: 1;
}
html[data-site-theme="vaporwave"]:not([data-vaporwave-fx="off"]) .crt-overlay:has(.crt-badtv-canvas) > :not(.crt-badtv-canvas) {
    display: none !important;
}
/* Style editor open: drop the vaporwave FX film grain so it never sits over the dialog. */
body.neon-playlist-style-open .crt-overlay { display: none !important; }
.crt-badtv-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    image-rendering: pixelated;
}

/* ─── Vaporwave bad-TV post-pass (jagracar shader, LGPL — see /NOTICE.md) ───
   Lives inside #theme-backdrop, above #vaporwave-canvas. Samples the 2D
   vaporwave canvas as input texture, outputs warped + grained version. */
.vapor-badtv-canvas {
    display: none;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
html[data-site-theme="vaporwave"]:not([data-vaporwave-fx="off"]) .vapor-badtv-canvas {
    display: block;
}
/* Source canvas must keep drawing (so its pixels are uploaded as the GL
   texture each frame) — hide it visually with visibility, not display. */
html[data-site-theme="vaporwave"][data-vaporwave-badtv="on"] #vaporwave-canvas {
    visibility: hidden;
}

/* FX toggle button visible only in vaporwave theme. */
.vaporwave-only-control {
    display: none !important;
}
html[data-site-theme="vaporwave"] .vaporwave-only-control {
    display: inline-flex !important;
}
.crt-overlay > * {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
/* Static dense scanline overlay — fixed in place, no scroll, no flicker.
   Tight 1px black line + 2px gap matches the reference photo. */
.crt-scanlines {
    background-image: repeating-linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.85) 0px,
        rgba(0, 0, 0, 0.85) 1px,
        transparent 1px,
        transparent 3px
    );
    background-size: 100% 3px;
    mix-blend-mode: multiply;
    opacity: 0.95;
}
.crt-noise {
    /* oversize so internal jitter never exposes edges */
    inset: -8%;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
    background-size: 220px 220px;
    opacity: 0.13;
    mix-blend-mode: overlay;
    animation: crt-noise-shift 0.09s steps(11) infinite;
    will-change: background-position;
}
.crt-noise--alt {
    /* second turbulence layer, finer + faster, offset cycle for denser shimmer */
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n2'><feTurbulence type='fractalNoise' baseFrequency='1.6' numOctaves='3' stitchTiles='stitch' seed='7'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.7 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n2)'/></svg>");
    background-size: 180px 180px;
    opacity: 0.09;
    mix-blend-mode: screen;
    animation: crt-noise-shift-alt 0.07s steps(13) infinite;
}
/* Third layer — colored RGB static.
   No feColorMatrix → feTurbulence outputs raw R/G/B random per pixel
   (classic dead-channel TV color snow). Boosted contrast pushes saturation. */
.crt-noise--color {
    inset: -6%;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='nc'><feTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='2' stitchTiles='stitch' seed='13'/><feComponentTransfer><feFuncR type='linear' slope='2.4' intercept='-0.7'/><feFuncG type='linear' slope='2.4' intercept='-0.7'/><feFuncB type='linear' slope='2.4' intercept='-0.7'/><feFuncA type='linear' slope='1' intercept='0'/></feComponentTransfer></filter><rect width='100%25' height='100%25' filter='url(%23nc)'/></svg>");
    background-size: 200px 200px;
    opacity: 0.45;
    mix-blend-mode: overlay;
    animation: crt-noise-shift-color 0.05s steps(15) infinite;
}
@keyframes crt-noise-shift-color {
    0%   { background-position: 0 0; }
    7%   { background-position: 35px -45px; }
    14%  { background-position: -50px 25px; }
    21%  { background-position: 60px 15px; }
    28%  { background-position: -25px -55px; }
    35%  { background-position: 45px 50px; }
    43%  { background-position: -65px 10px; }
    50%  { background-position: 20px -40px; }
    57%  { background-position: -40px 65px; }
    64%  { background-position: 55px -25px; }
    71%  { background-position: -30px 40px; }
    78%  { background-position: 70px 5px; }
    85%  { background-position: -55px -35px; }
    92%  { background-position: 25px 55px; }
    100% { background-position: 0 0; }
}
@keyframes crt-noise-shift {
    0%   { background-position: 0 0; }
    10%  { background-position: 40px 10px; }
    20%  { background-position: -20px 30px; }
    30%  { background-position: 60px -20px; }
    40%  { background-position: -40px 50px; }
    50%  { background-position: 30px 70px; }
    60%  { background-position: -60px -10px; }
    70%  { background-position: 80px 35px; }
    80%  { background-position: -25px -45px; }
    90%  { background-position: 50px 60px; }
    100% { background-position: 0 0; }
}
@keyframes crt-noise-shift-alt {
    0%   { background-position: 0 0; }
    8%   { background-position: -55px 25px; }
    17%  { background-position: 30px -40px; }
    25%  { background-position: -70px 60px; }
    33%  { background-position: 45px 15px; }
    42%  { background-position: -20px -55px; }
    50%  { background-position: 65px 50px; }
    58%  { background-position: -45px 5px; }
    67%  { background-position: 25px -30px; }
    75%  { background-position: -60px 70px; }
    83%  { background-position: 55px -15px; }
    92%  { background-position: -35px 40px; }
    100% { background-position: 0 0; }
}
.crt-vignette {
    /* Edge falloff + 4 corner radials. Many color stops smooth the gradient ramp
       so corners blend without banding (high-AA feel). */
    background:
        radial-gradient(circle at 0% 0%,
            rgba(0, 0, 0, 0.78) 0%,
            rgba(0, 0, 0, 0.62) 4%,
            rgba(0, 0, 0, 0.46) 8%,
            rgba(0, 0, 0, 0.32) 12%,
            rgba(0, 0, 0, 0.20) 16%,
            rgba(0, 0, 0, 0.12) 20%,
            rgba(0, 0, 0, 0.06) 24%,
            rgba(0, 0, 0, 0.02) 28%,
            transparent 32%),
        radial-gradient(circle at 100% 0%,
            rgba(0, 0, 0, 0.78) 0%,
            rgba(0, 0, 0, 0.62) 4%,
            rgba(0, 0, 0, 0.46) 8%,
            rgba(0, 0, 0, 0.32) 12%,
            rgba(0, 0, 0, 0.20) 16%,
            rgba(0, 0, 0, 0.12) 20%,
            rgba(0, 0, 0, 0.06) 24%,
            rgba(0, 0, 0, 0.02) 28%,
            transparent 32%),
        radial-gradient(circle at 0% 100%,
            rgba(0, 0, 0, 0.78) 0%,
            rgba(0, 0, 0, 0.62) 4%,
            rgba(0, 0, 0, 0.46) 8%,
            rgba(0, 0, 0, 0.32) 12%,
            rgba(0, 0, 0, 0.20) 16%,
            rgba(0, 0, 0, 0.12) 20%,
            rgba(0, 0, 0, 0.06) 24%,
            rgba(0, 0, 0, 0.02) 28%,
            transparent 32%),
        radial-gradient(circle at 100% 100%,
            rgba(0, 0, 0, 0.78) 0%,
            rgba(0, 0, 0, 0.62) 4%,
            rgba(0, 0, 0, 0.46) 8%,
            rgba(0, 0, 0, 0.32) 12%,
            rgba(0, 0, 0, 0.20) 16%,
            rgba(0, 0, 0, 0.12) 20%,
            rgba(0, 0, 0, 0.06) 24%,
            rgba(0, 0, 0, 0.02) 28%,
            transparent 32%),
        radial-gradient(ellipse at center,
            transparent 50%,
            rgba(0, 0, 0, 0.22) 88%,
            rgba(0, 0, 0, 0.42) 100%);
    mix-blend-mode: multiply;
    opacity: 0.85;
}
.crt-flicker {
    background: rgba(255, 255, 255, 0.025);
    /* Single ultra-fast flicker — no slow modulators, no breathing pulse. */
    animation: crt-flicker-anim 0.05s steps(1) infinite;
    will-change: opacity;
}
@keyframes crt-flicker-anim {
    /* dense sub-frame jitter — every step a different opacity, full random walk */
    0%   { opacity: 0.45; }
    7%   { opacity: 0.18; }
    13%  { opacity: 0.72; }
    20%  { opacity: 0.32; }
    27%  { opacity: 0.6; }
    34%  { opacity: 0.12; }
    41%  { opacity: 0.55; }
    48%  { opacity: 0.28; }
    55%  { opacity: 0.68; }
    62%  { opacity: 0.22; }
    69%  { opacity: 0.5; }
    76%  { opacity: 0.15; }
    83%  { opacity: 0.62; }
    90%  { opacity: 0.36; }
    96%  { opacity: 0.58; }
    100% { opacity: 0.45; }
}
/* Secondary ultra-mega-fast flicker layer for sub-frame chaos.
   0.03s with 14 steps => ~470 changes/sec. */
.crt-flicker::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.02);
    mix-blend-mode: screen;
    animation: crt-flicker-mega 0.03s steps(1) infinite;
}
@keyframes crt-flicker-mega {
    0%   { opacity: 0.05; }
    7%   { opacity: 0.6; }
    14%  { opacity: 0.1; }
    21%  { opacity: 0.5; }
    28%  { opacity: 0.2; }
    35%  { opacity: 0.7; }
    42%  { opacity: 0.05; }
    49%  { opacity: 0.45; }
    56%  { opacity: 0.15; }
    63%  { opacity: 0.55; }
    70%  { opacity: 0.25; }
    77%  { opacity: 0.65; }
    84%  { opacity: 0.1; }
    91%  { opacity: 0.5; }
    100% { opacity: 0.05; }
}
@media (prefers-reduced-motion: reduce) {
    .crt-noise,
    .crt-noise--alt,
    .crt-noise--color,
    .crt-flicker {
        animation: none !important;
    }
}
@media (max-width: 767px), (pointer: coarse) {
    html[data-site-theme="vaporwave"]:not([data-vaporwave-fx="off"]) .crt-overlay {
        opacity: 0.24;
    }
    .crt-noise,
    .crt-noise--alt,
    .crt-noise--color,
    .crt-flicker {
        animation: none !important;
        will-change: auto;
    }
    .crt-noise--alt,
    .crt-noise--color {
        display: none !important;
    }
}

/* Shared UI consistency layer */
:root {
    --ui-font-body: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --ui-font-display: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --ui-font-mono: "JetBrains Mono", "Fira Code", Consolas, monospace;
    --ui-text-xs: 11px;
    --ui-text-sm: 13px;
    --ui-text-md: 14px;
    --ui-text-lg: 18px;
    --ui-letter: 0.08em;
    --ui-control-height: 38px;
    --ui-control-radius: 8px;
    --ui-panel-radius: 10px;
    --ui-pill-radius: 999px;
    --ui-panel-gap: 10px;
    --ui-panel-pad: 14px;
    --ui-control-pad-x: 14px;
}

html[data-site-theme="win98"] {
    --ui-font-body: Tahoma, "MS Sans Serif", sans-serif;
    --ui-font-display: Tahoma, "MS Sans Serif", sans-serif;
    --ui-font-mono: "Courier New", monospace;
    --ui-text-xs: 11px;
    --ui-text-sm: 12px;
    --ui-text-md: 12px;
    --ui-text-lg: 16px;
    --ui-letter: 0;
    --ui-control-height: 28px;
    --ui-control-radius: 0;
    --ui-panel-radius: 0;
    --ui-pill-radius: 0;
    --ui-panel-gap: 8px;
    --ui-panel-pad: 12px;
    --ui-control-pad-x: 10px;
}

body {
    font-family: var(--ui-font-body);
}

:is(
    .theme-toggle,
    .site-dock-menu-item,
    .site-dock-layout-option,
    .btn-glow,
    .game-rotation-cta,
    .playlist-select,
    .site-guestbook-auth-signin,
    .global-player-pill,
    .global-player-toggle-pill,
    .global-player-track-button,
    .global-player-category-chip,
    .global-track-queue-btn,
    .users-admin-row-actions button,
    #users-admin-refresh
) {
    font-family: var(--ui-font-display);
    font-size: var(--ui-text-xs);
    font-weight: 900;
    letter-spacing: var(--ui-letter);
    text-transform: uppercase;
}

.site-control-dock .theme-toggle,
.site-control-dock .site-dock-menu-item,
.site-dock-proxy {
    min-height: var(--ui-control-height);
    padding-inline: var(--ui-control-pad-x);
}

html:not([data-site-theme="win98"]) :is(
    .theme-toggle,
    .site-dock-menu-button,
    .site-dock-menu-item,
    .site-guestbook-auth-signin,
    .global-player-pill,
    .global-player-toggle-pill,
    .global-track-queue-btn
) {
    border-radius: var(--ui-pill-radius);
}

html:not([data-site-theme="win98"]) :is(
    .site-guestbook-auth-notice,
    .users-admin-row,
    .users-admin-actions input[type="search"]
) {
    border-radius: var(--ui-control-radius);
}

.site-guestbook-auth-notice {
    gap: var(--ui-panel-gap);
    padding: 10px var(--ui-panel-pad);
    font-size: var(--ui-text-sm);
}

.users-admin {
    margin-top: 24px;
}

.users-admin-hint,
#users-admin-status,
.users-admin-row-meta {
    font-size: var(--ui-text-xs);
}

.users-admin-actions {
    gap: var(--ui-panel-gap);
}

.users-admin-actions input[type="search"] {
    min-height: var(--ui-control-height);
    padding: 0 var(--ui-control-pad-x);
    font-family: var(--ui-font-body);
    font-size: var(--ui-text-sm);
}

.users-admin-row {
    padding: var(--ui-panel-pad);
}

.users-admin-row-actions {
    gap: 8px;
}

.users-admin-row-actions button,
#users-admin-refresh {
    min-height: var(--ui-control-height);
    padding: 0 var(--ui-control-pad-x);
}

/* Platform badge always white — neon (all variants/modes/styles) + vaporwave */
html[data-site-theme="neon"][data-neon-title-mode] body:not(.admin-page) #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style] span.game-platform-badge.game-platform-badge,
html[data-site-theme="neon"][data-neon-variant] body:not(.admin-page) #game-rotation-panel.neon-hero-box-custom[data-neon-hero-style] span.game-platform-badge.game-platform-badge,
html[data-site-theme="neon"] body #game-rotation-panel.neon-hero-box-custom span.game-platform-badge.game-platform-badge,
html[data-site-theme="neon"] body #game-rotation-panel span.game-platform-badge.game-platform-badge,
html[data-site-theme="vaporwave"] body #game-rotation-panel span.game-platform-badge.game-platform-badge {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: none !important;
}

/* Win98 main pages: keep track info left, player controls centered, picker controls right. */
html[data-site-theme="win98"] body:not(.admin-page) .global-player-bar {
    grid-template-columns: minmax(220px, 0.8fr) minmax(500px, 0.95fr) minmax(660px, 1.25fr) !important;
    grid-template-areas: "info transport aux" !important;
    justify-content: stretch !important;
    align-items: center !important;
    width: 100% !important;
    column-gap: 18px !important;
}

html[data-site-theme="win98"] body:not(.admin-page) .global-player-left {
    grid-area: info !important;
    justify-self: start !important;
    width: max-content !important;
    max-width: 270px !important;
}

html[data-site-theme="win98"] body:not(.admin-page) .global-player-center {
    grid-area: transport !important;
    justify-self: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: auto minmax(190px, 1fr) !important;
    overflow: hidden !important;
}

html[data-site-theme="win98"] body:not(.admin-page) .global-player-progress,
html[data-site-theme="win98"] body:not(.admin-page) .global-player-progress .global-player-slider-wrap {
    min-width: 0 !important;
    max-width: 100% !important;
}

html[data-site-theme="win98"] body:not(.admin-page) .global-player-right {
    grid-area: aux !important;
    justify-self: stretch !important;
    display: grid !important;
    grid-template-columns: minmax(250px, 290px) minmax(165px, 1fr) auto auto auto !important;
    align-items: center !important;
    justify-content: stretch !important;
    column-gap: 8px !important;
    min-width: 0 !important;
    width: 100% !important;
    padding-left: 0 !important;
}

html[data-site-theme="win98"] body:not(.admin-page) .global-player-volume-area,
html[data-site-theme="win98"] body:not(.admin-page) .global-player-track-picker {
    width: 100% !important;
    min-width: 0 !important;
    flex: 0 1 auto !important;
}

@media (min-width: 1141px) {
    html[data-site-theme="win98"] body:not(.admin-page) .global-player-bar {
        grid-template-columns: minmax(220px, 0.8fr) minmax(500px, 0.95fr) minmax(660px, 1.25fr) !important;
    }

    html[data-site-theme="win98"] body:not(.admin-page) .global-player-center {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        grid-template-columns: auto minmax(190px, 1fr) !important;
    }

    html[data-site-theme="win98"] body:not(.admin-page) .global-player-right {
        display: grid !important;
        grid-template-columns: minmax(250px, 290px) minmax(165px, 1fr) auto auto auto !important;
        align-items: center !important;
        justify-content: stretch !important;
        column-gap: 8px !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    html[data-site-theme="win98"] body:not(.admin-page) .global-player-volume-area,
    html[data-site-theme="win98"] body:not(.admin-page) .global-player-track-picker {
        width: 100% !important;
        min-width: 0 !important;
        flex: 0 1 auto !important;
    }
}

@media (max-width: 1500px) and (min-width: 1141px) {
    html[data-site-theme="win98"] body:not(.admin-page) .global-player-bar {
        grid-template-columns: minmax(190px, 0.75fr) minmax(430px, 0.9fr) minmax(570px, 1.25fr) !important;
        column-gap: 12px !important;
    }

    html[data-site-theme="win98"] body:not(.admin-page) .global-player-right {
        grid-template-columns: minmax(220px, 250px) minmax(145px, 1fr) auto auto auto !important;
        column-gap: 7px !important;
    }
}

/* Keep page title dots matched to their main-page hero box color. */
body:not(.admin-page) [data-main-hero-dot] {
    color: var(--main-hero-dot-color, currentColor) !important;
    -webkit-text-fill-color: var(--main-hero-dot-color, currentColor) !important;
}

@media (max-width: 1140px) {
    html[data-site-theme="win98"] body:not(.admin-page) .global-player-bar {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "info"
            "transport"
            "aux" !important;
        column-gap: 10px !important;
        row-gap: 8px !important;
    }

    html[data-site-theme="win98"] body:not(.admin-page) .global-player-left {
        align-self: center !important;
    }

    html[data-site-theme="win98"] body:not(.admin-page) .global-player-right {
        justify-self: stretch !important;
        display: flex !important;
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
        width: 100% !important;
    }
}

@media (max-width: 760px) {
    html[data-site-theme="win98"] body:not(.admin-page) .global-player-bar {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "info"
            "transport"
            "aux" !important;
    }

    html[data-site-theme="win98"] body:not(.admin-page) .global-player-left {
        justify-self: start !important;
        max-width: 100% !important;
    }
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card:is(:hover, :focus-within) {
    animation-play-state: paused !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card > a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within):not([href="pages/smp"]):not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync),
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card:is(:hover, :focus-within) > a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"]:not([href="pages/smp"]):not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync) {
    --neon-hero-progress: 1 !important;
    --glow-color: var(--neon-hero-shift-color) !important;
    --neon-title-glow-color: var(--neon-hero-shift-color) !important;
    --neon-hero-stripe-color: var(--neon-hero-shift-color) !important;
    --neon-hero-outline-color: var(--neon-hero-shift-color) !important;
    --neon-hero-active-fill-color: var(--neon-hero-shift-color) !important;
    border-color: var(--neon-hero-shift-color) !important;
    box-shadow: inset 0 0 32px color-mix(in srgb, var(--neon-hero-shift-color) 12%, transparent) !important;
    transform: scale(1.006) !important;
    z-index: 50;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card > a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"][data-neon-hero-hover-glow="on"]:is(:hover, :focus-within):not([href="pages/smp"]):not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync),
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card:is(:hover, :focus-within) > a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"][data-neon-hero-hover-glow="on"]:not([href="pages/smp"]):not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync) {
    box-shadow:
        inset 0 0 32px color-mix(in srgb, var(--neon-hero-shift-color) 12%, transparent),
        0 0 34px color-mix(in srgb, var(--neon-hero-shift-color) 30%, transparent) !important;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card > a[href="pages/smp"].glass.neon-hero-box-custom[data-neon-hero-style="gradient"]:is(:hover, :focus-within),
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card:is(:hover, :focus-within) > a[href="pages/smp"].glass.neon-hero-box-custom[data-neon-hero-style="gradient"] {
    border-color: var(--neon-hero-shift-color) !important;
    box-shadow: inset 0 0 32px color-mix(in srgb, var(--neon-hero-shift-color) 12%, transparent) !important;
    transform: scale(1.006) !important;
    z-index: 50;
}

html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card > a[href="pages/smp"].glass.neon-hero-box-custom[data-neon-hero-style="gradient"][data-neon-hero-hover-glow="on"]:is(:hover, :focus-within),
html[data-site-theme="neon"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card:is(:hover, :focus-within) > a[href="pages/smp"].glass.neon-hero-box-custom[data-neon-hero-style="gradient"][data-neon-hero-hover-glow="on"] {
    box-shadow:
        inset 0 0 32px color-mix(in srgb, var(--neon-hero-shift-color) 12%, transparent),
        0 0 34px color-mix(in srgb, var(--neon-hero-shift-color) 30%, transparent) !important;
}

html[data-site-theme="neon"] body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"]:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync) {
    --glow-color: var(--neon-hero-shift-color) !important;
    --neon-title-glow-color: var(--neon-hero-shift-color) !important;
    --neon-hero-stripe-color: var(--neon-hero-shift-color) !important;
    --neon-hero-outline-color: var(--neon-hero-shift-color) !important;
    border-color: var(--neon-hero-shift-color) !important;
}

html[data-site-theme="neon"][data-neon-title-mode="default"] body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"]:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync) .flex.flex-col > div:last-child:not(#main-current-game):not(#neon-nav-text-sync),
html[data-site-theme="neon"][data-neon-title-mode="tinted"] body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"]:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync) .flex.flex-col > div:first-child:not(#main-current-game):not(#neon-nav-text-sync),
html[data-site-theme="neon"][data-neon-title-mode="tinted"] body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom[data-neon-hero-style="gradient"]:not(#neon-nav-gradient-text):not(#neon-nav-card-sync):not(#neon-nav-rgb-sync) .flex.flex-col > div:last-child:not(#main-current-game):not(#neon-nav-text-sync) {
    color: var(--neon-hero-shift-color) !important;
    -webkit-text-fill-color: var(--neon-hero-shift-color) !important;
    transition: none !important;
}

html[data-site-theme="neon"][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-glow="none"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child {
    text-shadow: none !important;
}

html[data-site-theme="neon"][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-glow="theme"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 40%, transparent),
        0 0 18px color-mix(in srgb, var(--neon-title-glow-color, var(--glow-color, var(--neon-hero-shift-color, var(--neon-hero-color, #fc00e3)))) 24%, transparent) !important;
}

html[data-site-theme="neon"][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) body:not(.admin-page) :is(.neon-hero-box-custom, .site-guestbook-shell.glass.neon-hero-box-custom, #game-rotation-panel.neon-hero-box-custom, .smp-hero-glass.neon-hero-box-custom) :is(.site-guestbook-hero-heading, .site-guestbook-comments-title, .site-guestbook-form h3, .site-widget-title, .game-rotation-heading, .box-title, .smp-hero-glass > .box-title, .smp-hero-h1, .smp-hero-h1 span, .inner-entry h3, #main-current-game),
html[data-site-theme="neon"][data-neon-title-glow="white"]:not([data-neon-variant="edge"]) body:not(.admin-page) .nav-card a.glass.neon-hero-box-custom .flex.flex-col > div:first-child {
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.44),
        0 0 18px rgba(255, 255, 255, 0.26) !important;
}

/* === Mobile performance overrides ===
   Drop backdrop-filter blur (biggest mobile cost), kill float animation,
   simplify shadows, content-visibility on off-screen sections, throttle paint.
*/
@media (max-width: 900px), (hover: none) and (pointer: coarse) {
    .glass,
    .site-guestbook-shell,
    .site-widget-card,
    #game-rotation-panel,
    .smp-hero-glass,
    .neon-hero-box-custom {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
    .float-wrapper {
        animation: none !important;
        transform: none !important;
    }
    .glass,
    .neon-hero-box-custom {
        will-change: auto !important;
    }
    .site-guestbook-section,
    #site-retro-widgets,
    #game-rotation-panel,
    .smp-hero-glass {
        content-visibility: auto;
        contain-intrinsic-size: 1px 600px;
    }
    html[data-site-theme="neon"] .neon-hero-box-custom {
        transition:
            border-color 0.2s linear,
            box-shadow 0.2s linear !important;
    }
    .crt-noise,
    .crt-noise--color,
    .crt-flicker {
        display: none !important;
    }
    #star-field {
        opacity: 0.5;
    }
}

@media (prefers-reduced-motion: reduce) {
    .float-wrapper,
    .neon-hero-box-custom {
        animation: none !important;
    }
}

/* =============================================================
   FLAT THEME
   Lag-free dark theme inspired by R.E.P.O. Save Editor UI.
   No backdrop-filter, no rainbow rAF, no color-mix-per-repaint,
   no large blur shadows. Per-card .neon-* classes become solid
   1px accent borders only.
   ============================================================= */

html[data-site-theme="flat"] {
    --flat-bg: #0d1117;
    /* Glassy surfaces — matches the shader Tweaks-panel chrome:
       translucent near-black + white hairline borders + frosted blur. */
    --flat-bg-elev: rgba(10, 10, 14, 0.55);
    --flat-bg-elev-2: rgba(255, 255, 255, 0.10);
    --flat-border: rgba(255, 255, 255, 0.12);
    --flat-border-strong: rgba(255, 255, 255, 0.35);
    --flat-text: #e6edf3;
    --flat-text-dim: #9da7b3;
    --flat-text-faint: #6b7480;
    --flat-accent: rgba(255, 255, 255, 0.14);
    --flat-accent-strong: rgba(255, 255, 255, 0.20);
    --flat-accent-text: #e6edf3;
    --flat-shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
    --flat-radius: 14px;
    --flat-radius-sm: 8px;
    --flat-blur: blur(0px);
    background: var(--flat-bg);
    color: var(--flat-text);
}

html[data-site-theme="flat"] body {
    background: var(--flat-bg);
    color: var(--flat-text);
}

html[data-site-theme="flat"] body::before,
html[data-site-theme="flat"] body::after,
html[data-site-theme="flat"] #star-field,
html[data-site-theme="flat"] .neon-hero-backdrop-pane,
html[data-site-theme="flat"] .vaporwave-scene,
html[data-site-theme="flat"] .vaporwave-fx {
    display: none !important;
}

/* #theme-backdrop hosts the flat-shaders iframe (FOIL shaders). Keep it visible but
   transparent so only the shader iframe paints when FX is on; empty when FX off. */
html[data-site-theme="flat"] #theme-backdrop {
    background: transparent !important;
    opacity: 1 !important;
}

/* ─── FLAT theme shader-wallpaper FX (iframe embed) ───
   When FX toggle is ON in FLAT theme, the backdrop becomes visible and
   hosts /pages/flat-shaders/ as a fullscreen iframe — gives FLAT a
   live WebGL wallpaper while keeping the rest of the chrome FLAT-flat. */
/* Backdrop sits at z-index:0 (not -3) and accepts pointer events so the
   shader canvas + bottom HUD picker are interactive. It stays position:fixed
   so the wallpaper follows the scroll. Page content (main-wrapper z-10, dock
   z-9200, widgets z-9100) all paint above it and stay clickable. */
html[data-site-theme="flat"][data-flat-fx="on"] #theme-backdrop {
    display: block !important;
    opacity: 1;
    z-index: 0;
    background: var(--flat-bg);
    background-image: none;
    pointer-events: auto;
}
/* The opaque FLAT html/body bg sits ABOVE the backdrop and would hide the
   iframe — make them transparent so the wallpaper shows through.
   Panels/cards keep their own solid backgrounds. */
html[data-site-theme="flat"][data-flat-fx="on"],
html[data-site-theme="flat"][data-flat-fx="on"] body {
    background: transparent !important;
}
/* The main content column spans the full width but is mostly empty space
   between cards. Make the column itself click-through so gaps reach the
   shader behind it, then re-enable pointer events on the actual interactive
   elements (cards, links, buttons, form fields). */
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper {
    pointer-events: none;
}
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper a,
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper button,
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper input,
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper textarea,
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper select,
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper label,
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper .glass,
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper [role="button"],
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper [tabindex],
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper .flicker-title,
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper #main-title,
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper .avatar-animated,
html[data-site-theme="flat"][data-flat-fx="on"] .main-wrapper p {
    pointer-events: auto;
}
.flat-shaders-frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    margin: 0;
    padding: 0;
    pointer-events: auto;
    background: transparent;
}

/* Edit mode — raise the whole wallpaper iframe above ALL site chrome so its
   HUD picker + Tweaks panel are visible and usable (they live inside the
   iframe and can't be split across z-layers). Toggled by pressing T. */
html[data-site-theme="flat"][data-flat-fx="on"][data-flat-edit="on"] #theme-backdrop {
    z-index: 2147483600;
}
html[data-site-theme="flat"][data-flat-fx="on"][data-flat-edit="on"] .main-wrapper {
    pointer-events: none;
}

/* FLAT-only FX toggle button (mirrors .vaporwave-only-control). */
.flat-only-control {
    display: none !important;
}
html[data-site-theme="flat"] .flat-only-control {
    display: inline-flex !important;
}
/* Shader Tweaks button — only useful while the wallpaper is on, so it shows
   only in FLAT theme with FX enabled. Gives mobile/touch users (no T key) a
   way into the shader editor. */
.flat-edit-control {
    display: none !important;
}
html[data-site-theme="flat"][data-flat-fx="on"] .flat-edit-control {
    display: inline-flex !important;
}
html[data-site-theme="flat"][data-flat-edit="on"] .flat-edit-control {
    background: #232a33 !important;
}

/* Frosted glass on the main FLAT content surfaces — restores the blur that the
   blanket killer below strips, but only on the panels/cards so they read like
   the shader Tweaks panel over the live wallpaper. The control dock + player
   are intentionally excluded (kept solid, opaque chrome). */
html[data-site-theme="flat"] :is(
    .glass, .neon-hero-box-custom, .site-widget-card,
    .site-hit-counter, .site-guestbook-shell, .site-guestbook-viewport
) {
    background: color-mix(in srgb, var(--flat-bg-elev) var(--flat-panel-opacity, 100%), transparent);
    border-radius: var(--flat-radius);
    backdrop-filter: var(--flat-blur, blur(0px)) !important;
    -webkit-backdrop-filter: var(--flat-blur, blur(0px)) !important;
}
/* .float-wrapper is just a layout wrapper — keep it transparent + unblurred so the
   rounded .glass inside isn't boxed by a square fill/halo. */
html[data-site-theme="flat"] .float-wrapper {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
/* Dock buttons stay solid (not the translucent glass token) so the control
   strip reads clearly against the busy wallpaper. */
html[data-site-theme="flat"] .site-control-dock .theme-toggle,
html[data-site-theme="flat"] .site-control-dock .site-dock-menu-button {
    background: #161b22 !important;
}
html[data-site-theme="flat"] .site-control-dock .theme-toggle:is(:hover, :focus-visible),
html[data-site-theme="flat"] .site-control-dock .theme-toggle.is-active,
html[data-site-theme="flat"] .site-control-dock .site-dock-menu-button:is(:hover, :focus-visible) {
    background: #232a33 !important;
}

html[data-site-theme="flat"] *,
html[data-site-theme="flat"] *::before,
html[data-site-theme="flat"] *::after {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html[data-site-theme="flat"] .glass,
html[data-site-theme="flat"] .float-wrapper,
html[data-site-theme="flat"] .neon-hero-box-custom,
html[data-site-theme="flat"] .site-widget-card,
html[data-site-theme="flat"] .site-hit-counter,
html[data-site-theme="flat"] .site-guestbook-shell,
html[data-site-theme="flat"] .site-guestbook-viewport {
    animation: none !important;
    transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
}

html[data-site-theme="flat"] .glass {
    background: color-mix(in srgb, var(--flat-bg-elev) var(--flat-panel-opacity, 100%), transparent);
    border: 1px solid var(--glow-color, var(--flat-border));
    border-radius: var(--flat-radius);
    box-shadow: var(--flat-shadow);
    color: var(--flat-text);
    backdrop-filter: var(--flat-blur, blur(0px)) !important;
    -webkit-backdrop-filter: var(--flat-blur, blur(0px)) !important;
}

html[data-site-theme="flat"] .glass::before,
html[data-site-theme="flat"] .glass::after {
    display: none !important;
}

html[data-site-theme="flat"] .glass:is(:hover, :focus-within) {
    border-color: var(--glow-color, var(--flat-border-strong));
    background: var(--flat-bg-elev-2);
    box-shadow: var(--flat-shadow);
    transform: none !important;
}

html[data-site-theme="flat"] :is(.glass.neon-green, .glass.neon-red, .glass.neon-blue,
    .glass.neon-pink, .glass.neon-cyan, .glass.neon-purple, .glass.neon-yellow,
    .glass.neon-orange, .glass.neon-magenta, .glass.neon-white) {
    background: color-mix(in srgb, var(--flat-bg-elev) var(--flat-panel-opacity, 100%), transparent);
    border: 1px solid var(--glow-color, var(--flat-border));
    box-shadow: var(--flat-shadow);
}

html[data-site-theme="flat"] :is(.glass.neon-green, .glass.neon-red, .glass.neon-blue,
    .glass.neon-pink, .glass.neon-cyan, .glass.neon-purple, .glass.neon-yellow,
    .glass.neon-orange, .glass.neon-magenta, .glass.neon-white):is(:hover, :focus-within) {
    background: var(--flat-bg-elev-2);
    border-color: var(--glow-color, var(--flat-border-strong));
    box-shadow: var(--flat-shadow);
}

html[data-site-theme="flat"] .box-title,
html[data-site-theme="flat"] .site-guestbook-hero-heading,
html[data-site-theme="flat"] .game-rotation-heading,
html[data-site-theme="flat"] .site-widget-title {
    color: var(--flat-text) !important;
    text-shadow: none !important;
    -webkit-text-fill-color: var(--flat-text) !important;
    background: none !important;
    -webkit-text-stroke: 0 !important;
    animation: none !important;
}

html[data-site-theme="flat"] .box-subtitle,
html[data-site-theme="flat"] .site-currently-list li,
html[data-site-theme="flat"] .site-currently-updated {
    color: var(--flat-text-dim) !important;
    text-shadow: none !important;
}

html[data-site-theme="flat"] .site-hit-counter-digit {
    color: var(--flat-text) !important;
    text-shadow: none !important;
    background: var(--flat-bg-elev-2);
    border: 1px solid var(--flat-border);
    border-radius: var(--flat-radius-sm);
}

html[data-site-theme="flat"] .site-widget-card,
html[data-site-theme="flat"] .site-hit-counter {
    background: var(--flat-bg-elev);
    border: 1px solid var(--flat-border);
    border-radius: var(--flat-radius);
    box-shadow: var(--flat-shadow);
}

html[data-site-theme="flat"] .site-widget-card:is(:hover, :focus-within),
html[data-site-theme="flat"] .site-hit-counter:is(:hover, :focus-within) {
    border-color: var(--flat-border-strong);
    background: var(--flat-bg-elev-2);
    box-shadow: var(--flat-shadow);
}

html[data-site-theme="flat"] .site-currently-list li::before {
    background: var(--flat-accent);
    box-shadow: none !important;
}

html[data-site-theme="flat"] :is(button, .button, .btn, .cta-button) {
    background: var(--flat-accent);
    color: var(--flat-accent-text);
    border: 1px solid var(--flat-border-strong);
    border-radius: var(--flat-radius-sm);
    box-shadow: none;
    text-shadow: none;
    transition: background 0.16s ease, border-color 0.16s ease;
}

html[data-site-theme="flat"] :is(button, .button, .btn, .cta-button):is(:hover, :focus-visible) {
    background: var(--flat-accent-strong);
    border-color: var(--flat-border-strong);
}

html[data-site-theme="flat"] :is(button, .button, .btn).is-ghost,
html[data-site-theme="flat"] :is(button, .button, .btn).is-secondary {
    background: var(--flat-bg-elev-2);
    color: var(--flat-text);
    border-color: var(--flat-border);
}

html[data-site-theme="flat"] :is(button, .button, .btn).is-ghost:is(:hover, :focus-visible),
html[data-site-theme="flat"] :is(button, .button, .btn).is-secondary:is(:hover, :focus-visible) {
    background: var(--flat-border);
    border-color: var(--flat-border-strong);
}

html[data-site-theme="flat"] :is(input, textarea, select) {
    background: var(--flat-bg);
    color: var(--flat-text);
    border: 1px solid var(--flat-border);
    border-radius: var(--flat-radius-sm);
    box-shadow: none;
}

html[data-site-theme="flat"] :is(input, textarea, select):focus {
    border-color: var(--flat-border-strong);
    outline: none;
    box-shadow: 0 0 0 2px rgba(157, 167, 179, 0.18);
}

html[data-site-theme="flat"] :is(.glass, .site-widget-card)[data-neon-hero-style="rainbow"],
html[data-site-theme="flat"] .neon-rainbow-stripe,
html[data-site-theme="flat"] .neon-rainbow-fill {
    animation: none !important;
    background: var(--flat-bg-elev) !important;
}

html[data-site-theme="flat"] .site-guestbook-shell,
html[data-site-theme="flat"] .site-guestbook-shell.glass {
    background: var(--flat-bg-elev) !important;
    border: 1px solid var(--glow-color, var(--flat-border)) !important;
    border-radius: var(--flat-radius) !important;
    box-shadow: var(--flat-shadow) !important;
    color: var(--flat-text) !important;
    transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important;
}

html[data-site-theme="flat"] .site-guestbook-viewport {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--flat-text) !important;
}

html[data-site-theme="flat"] .site-guestbook-shell:is(:hover, :focus-within),
html[data-site-theme="flat"] .site-guestbook-shell.glass:is(:hover, :focus-within) {
    background: var(--flat-bg-elev-2) !important;
    border-color: var(--glow-color, var(--flat-border-strong)) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5), 0 0 0 1px var(--glow-color, var(--flat-border-strong)) !important;
}

html[data-site-theme="flat"] .site-guestbook-admin-name,
html[data-site-theme="flat"] .site-guestbook-admin-name.site-guestbook-admin-name-custom {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

html[data-site-theme="flat"] .site-guestbook-section {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

html[data-site-theme="flat"] .site-guestbook-shell.glass::before,
html[data-site-theme="flat"] .site-guestbook-shell.glass::after {
    display: none !important;
}

html[data-site-theme="flat"] .site-guestbook-hero-heading {
    color: var(--flat-text) !important;
    text-shadow: none !important;
    background: none !important;
}

html[data-site-theme="flat"] #site-control-dock,
html[data-site-theme="flat"] #site-control-dock * {
    text-shadow: none !important;
    box-shadow: none !important;
}

html[data-site-theme="flat"] #site-control-dock,
html[data-site-theme="flat"] .site-control-dock-inner,
html[data-site-theme="flat"] .site-dock-buttons {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

html[data-site-theme="flat"] .site-control-dock .theme-toggle,
html[data-site-theme="flat"] .site-control-dock .site-dock-menu-button {
    background: var(--flat-bg-elev-2) !important;
    color: var(--flat-text) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

html[data-site-theme="flat"] .site-control-dock .theme-toggle:is(:hover, :focus-visible),
html[data-site-theme="flat"] .site-control-dock .site-dock-menu-button:is(:hover, :focus-visible) {
    background: var(--flat-border) !important;
    border-color: var(--flat-border-strong) !important;
}

html[data-site-theme="flat"] .site-control-dock .theme-toggle.is-active {
    background: var(--flat-border) !important;
    border-color: var(--flat-border-strong) !important;
    color: var(--flat-text) !important;
}

html[data-site-theme="flat"] .site-control-dock #theme-toggle {
    background: var(--flat-accent) !important;
    color: var(--flat-accent-text) !important;
    border-color: var(--flat-border-strong) !important;
}

html[data-site-theme="flat"] .site-control-dock #theme-toggle:is(:hover, :focus-visible) {
    background: var(--flat-accent-strong) !important;
}

html[data-site-theme="flat"] .site-dock-layout-switch {
    background: var(--flat-bg) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius-sm) !important;
}

html[data-site-theme="flat"] .site-dock-layout-option {
    color: var(--flat-text-dim) !important;
}

html[data-site-theme="flat"] .site-dock-layout-option[aria-pressed="true"] {
    background: var(--flat-border) !important;
    color: var(--flat-text) !important;
    box-shadow: none !important;
}

html[data-site-theme="flat"] .site-dock-layout-option:hover:not([aria-pressed="true"]) {
    background: var(--flat-bg-elev-2) !important;
}

html[data-site-theme="flat"] .global-player,
html[data-site-theme="flat"] .global-player * {
    text-shadow: none !important;
    box-shadow: none !important;
}

html[data-site-theme="flat"] .global-player {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
}

html[data-site-theme="flat"] .global-player.is-collapsed,
html[data-site-theme="flat"] .global-player.is-collapsed .global-player-inner {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html[data-site-theme="flat"] .global-player-inner {
    background: var(--flat-bg-elev) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius) !important;
    box-shadow: var(--flat-shadow) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-window {
    background: var(--flat-bg-elev) !important;
    color: var(--flat-text) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius) !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.6) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-body {
    background: var(--flat-bg-elev) !important;
    border: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 14px 16px 16px !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-submit {
    background: var(--flat-accent) !important;
    color: var(--flat-accent-text) !important;
    border: 1px solid var(--flat-border-strong) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    height: auto !important;
    width: auto !important;
    align-self: flex-end !important;
    padding: 6px 16px !important;
    font: 700 12px var(--ui-font-body, 'Inter', system-ui, sans-serif) !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-submit:is(:hover, :focus-visible) {
    background: var(--flat-accent-strong) !important;
    border-color: var(--flat-border-strong) !important;
    filter: none !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-submit:active {
    transform: none !important;
    box-shadow: none !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-field input {
    background: var(--flat-bg) !important;
    color: var(--flat-text) !important;
    -webkit-text-fill-color: var(--flat-text) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    height: auto !important;
    padding: 8px 10px !important;
    font: 13px var(--ui-font-body, 'Inter', system-ui, sans-serif) !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-field input:focus {
    border-color: var(--flat-border-strong) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(157, 167, 179, 0.18) !important;
}

/* Browser autofill paints a light bg + hides our text. Force dark bg + light text. */
html[data-site-theme="flat"] .auth-overlay .auth-field input:-webkit-autofill,
html[data-site-theme="flat"] .auth-overlay .auth-field input:-webkit-autofill:hover,
html[data-site-theme="flat"] .auth-overlay .auth-field input:-webkit-autofill:focus,
html[data-site-theme="flat"] .site-guestbook-form input:-webkit-autofill,
html[data-site-theme="flat"] .site-guestbook-form input:-webkit-autofill:hover,
html[data-site-theme="flat"] .site-guestbook-form input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--flat-text) !important;
    caret-color: var(--flat-text) !important;
    -webkit-box-shadow: 0 0 0 1000px var(--flat-bg) inset !important;
    box-shadow: 0 0 0 1000px var(--flat-bg) inset !important;
    border: 1px solid var(--flat-border) !important;
    transition: background-color 9999s ease-in-out 0s !important;
}

html[data-site-theme="neon"] .auth-overlay .auth-field input:-webkit-autofill,
html[data-site-theme="neon"] .auth-overlay .auth-field input:-webkit-autofill:hover,
html[data-site-theme="neon"] .auth-overlay .auth-field input:-webkit-autofill:focus,
html[data-site-theme="neon"] .site-guestbook-form input:-webkit-autofill,
html[data-site-theme="neon"] .site-guestbook-form input:-webkit-autofill:hover,
html[data-site-theme="neon"] .site-guestbook-form input:-webkit-autofill:focus {
    -webkit-text-fill-color: #e8feff !important;
    caret-color: #e8feff !important;
    -webkit-box-shadow: 0 0 0 1000px #0a0420 inset !important;
    box-shadow: 0 0 0 1000px #0a0420 inset !important;
    transition: background-color 9999s ease-in-out 0s !important;
}

html[data-site-theme="vaporwave"] .auth-overlay .auth-field input:-webkit-autofill,
html[data-site-theme="vaporwave"] .auth-overlay .auth-field input:-webkit-autofill:hover,
html[data-site-theme="vaporwave"] .auth-overlay .auth-field input:-webkit-autofill:focus,
html[data-site-theme="vaporwave"] .site-guestbook-form input:-webkit-autofill,
html[data-site-theme="vaporwave"] .site-guestbook-form input:-webkit-autofill:hover,
html[data-site-theme="vaporwave"] .site-guestbook-form input:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff4ff !important;
    caret-color: #fff4ff !important;
    -webkit-box-shadow: 0 0 0 1000px #14001f inset !important;
    box-shadow: 0 0 0 1000px #14001f inset !important;
    transition: background-color 9999s ease-in-out 0s !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-field span,
html[data-site-theme="flat"] .auth-overlay .auth-check {
    color: var(--flat-text-dim) !important;
    -webkit-text-fill-color: var(--flat-text-dim) !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-error {
    background: color-mix(in srgb, #ff5a5a 14%, var(--flat-bg)) !important;
    color: #ff9a9a !important;
    -webkit-text-fill-color: #ff9a9a !important;
    border: 1px solid color-mix(in srgb, #ff5a5a 40%, var(--flat-border)) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

/* Clean normal-X close: show native ✕ glyph only, kill win98 Marlett + duplicate ::before (flat / neon / vaporwave). */
html[data-site-theme="flat"] .auth-overlay .auth-close,
html[data-site-theme="neon"] .auth-overlay .auth-close,
html[data-site-theme="vaporwave"] .auth-overlay .auth-close {
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    padding: 2px 8px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    overflow: visible !important;
    font-size: 18px !important;
    line-height: 1 !important;
    font-weight: 400 !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-close::before,
html[data-site-theme="neon"] .auth-overlay .auth-close::before,
html[data-site-theme="vaporwave"] .auth-overlay .auth-close::before {
    display: none !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-close {
    color: var(--flat-text-dim) !important;
    -webkit-text-fill-color: var(--flat-text-dim) !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-close:is(:hover, :focus-visible) {
    background: var(--flat-bg-elev-2) !important;
    color: var(--flat-text) !important;
    -webkit-text-fill-color: var(--flat-text) !important;
}

html[data-site-theme="neon"] .auth-overlay .auth-close {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="neon"] .auth-overlay .auth-close:is(:hover, :focus-visible) {
    background: rgba(255, 62, 108, 0.28) !important;
}

html[data-site-theme="vaporwave"] .auth-overlay .auth-close {
    color: var(--vapor-gold, #fff38a) !important;
    -webkit-text-fill-color: var(--vapor-gold, #fff38a) !important;
    transition: transform 0.18s ease, background 0.18s ease, color 0.18s ease, text-shadow 0.18s ease !important;
}

html[data-site-theme="vaporwave"] .auth-overlay .auth-close:is(:hover, :focus-visible) {
    background: rgba(255, 43, 214, 0.28) !important;
    color: var(--vapor-cyan, #00eaff) !important;
    -webkit-text-fill-color: var(--vapor-cyan, #00eaff) !important;
    transform: scale(1.2) rotate(90deg) !important;
    text-shadow: 0 0 8px var(--vapor-magenta, #ff2bd6), 0 0 14px var(--vapor-cyan, #00eaff) !important;
}

/* CRT/VHS overlay (z-index ~2.1B) sits above the modal; lift auth modal above it so FX
   does not bleed onto the sign-in box on vaporwave. */
html[data-site-theme="vaporwave"] .auth-overlay {
    z-index: 2147483600 !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-titlebar {
    background: var(--flat-bg) !important;
    color: var(--flat-text) !important;
    border-bottom: 1px solid var(--flat-border) !important;
    border-top-left-radius: var(--flat-radius) !important;
    border-top-right-radius: var(--flat-radius) !important;
    box-shadow: none !important;
    background-image: none !important;
    padding: 10px 14px !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-title-text {
    padding-left: 4px !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-title-text {
    color: var(--flat-text) !important;
    text-shadow: none !important;
    -webkit-text-fill-color: var(--flat-text) !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-close {
    background: transparent !important;
    color: var(--flat-text-dim) !important;
    border: 0 !important;
    box-shadow: none !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-close:is(:hover, :focus-visible) {
    background: var(--flat-bg-elev-2) !important;
    color: var(--flat-text) !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-tabs {
    border-bottom: 1px solid var(--flat-border) !important;
    background: transparent !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-tab {
    background: transparent !important;
    color: var(--flat-text-dim) !important;
    -webkit-text-fill-color: var(--flat-text-dim) !important;
    border: 0 !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    top: 0 !important;
    padding: 6px 14px !important;
    font-weight: 700 !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-tab.is-active {
    color: var(--flat-text) !important;
    -webkit-text-fill-color: var(--flat-text) !important;
    border-bottom-color: var(--flat-text) !important;
    background: transparent !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-window :is(label, span, p, .auth-field) {
    color: var(--flat-text) !important;
    -webkit-text-fill-color: var(--flat-text) !important;
    text-shadow: none !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-window input:not([type="checkbox"]):not([type="radio"]) {
    background: var(--flat-bg) !important;
    color: var(--flat-text) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    -webkit-text-fill-color: var(--flat-text) !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-window input:focus {
    border-color: var(--flat-border-strong) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(157, 167, 179, 0.18) !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-window button:not(.auth-close):not(.auth-link-button):not(.auth-tab) {
    background: var(--flat-accent) !important;
    color: var(--flat-accent-text) !important;
    border: 1px solid var(--flat-border-strong) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-window button:not(.auth-close):not(.auth-link-button):not(.auth-tab):is(:hover, :focus-visible) {
    background: var(--flat-accent-strong) !important;
    border-color: var(--flat-border-strong) !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-link-button {
    color: var(--flat-text-dim) !important;
    -webkit-text-fill-color: var(--flat-text-dim) !important;
    background: transparent !important;
    border: 0 !important;
    text-shadow: none !important;
    text-decoration: underline !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-link-button:is(:hover, :focus-visible) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-site-theme="flat"] .auth-overlay .auth-check {
    color: var(--flat-text-dim) !important;
}

/* =============================================================
   VISITOR LOG REVAMP
   - Admin name chip stripped globally (configured name-effect shines through)
   - Reactions retinted per theme
   - Flat theme: full guestbook re-skin (single border, dim meta, normalize comment card)
   ============================================================= */

/* Admin name: drop chip across all themes; let configured name-effect render bare. */
.site-guestbook-admin-name,
.site-guestbook-admin-name.site-guestbook-admin-name-custom {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    letter-spacing: normal !important;
}

/* Reaction pills retheme per theme. Default neon variant unchanged. */
html[data-site-theme="win98"] .site-guestbook-reaction {
    color: #000 !important;
    background: var(--win98-button-face, #c0c0c0) !important;
    border: 2px solid !important;
    border-color: #fff #404040 #404040 #fff !important;
    border-radius: 0 !important;
    box-shadow: inset 1px 1px 0 #dfdfdf, inset -1px -1px 0 #808080 !important;
}

html[data-site-theme="win98"] .site-guestbook-reaction:is(:hover, :focus-visible) {
    background: var(--win98-button-highlight, #d4d0c8) !important;
}

html[data-site-theme="win98"] .site-guestbook-reaction.is-active {
    border-color: #404040 #fff #fff #404040 !important;
    box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf !important;
}

html[data-site-theme="vaporwave"] .site-guestbook-reaction {
    color: var(--vapor-gold, #fff38a) !important;
    background: rgba(20, 0, 31, 0.75) !important;
    border: 1px solid var(--vapor-cyan, #00eaff) !important;
    box-shadow: 0 0 8px rgba(0, 234, 255, 0.35) !important;
}

html[data-site-theme="flat"] .site-guestbook-reaction {
    color: var(--flat-text) !important;
    background: var(--flat-bg-elev-2) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
}

html[data-site-theme="flat"] .site-guestbook-reaction:is(:hover, :focus-visible) {
    background: var(--flat-border) !important;
    border-color: var(--flat-border-strong) !important;
}

html[data-site-theme="flat"] .site-guestbook-reaction.is-active {
    background: var(--flat-border) !important;
    border-color: var(--flat-text-dim) !important;
    color: var(--flat-text) !important;
}

/* ----- FLAT theme: full guestbook re-skin ----- */

html[data-site-theme="flat"] .site-guestbook-hero-heading,
html[data-site-theme="flat"] .site-guestbook-comments-title,
html[data-site-theme="flat"] .site-guestbook-form h3,
html[data-site-theme="flat"] .game-rotation-heading {
    color: var(--flat-text) !important;
    -webkit-text-fill-color: var(--flat-text) !important;
    text-shadow: none !important;
    background: none !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    letter-spacing: 0.3em !important;
    text-transform: uppercase !important;
}

html[data-site-theme="flat"] .site-guestbook-field > span {
    color: var(--flat-text-dim) !important;
    -webkit-text-fill-color: var(--flat-text-dim) !important;
    text-shadow: none !important;
}

html[data-site-theme="flat"] .site-guestbook-form input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
html[data-site-theme="flat"] .site-guestbook-form textarea,
html[data-site-theme="flat"] .site-guestbook-form select {
    background: var(--flat-bg) !important;
    color: var(--flat-text) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    -webkit-text-fill-color: var(--flat-text) !important;
}

html[data-site-theme="flat"] .site-guestbook-form input:focus,
html[data-site-theme="flat"] .site-guestbook-form textarea:focus,
html[data-site-theme="flat"] .site-guestbook-form select:focus {
    border-color: var(--flat-border-strong) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(157, 167, 179, 0.18) !important;
}

html[data-site-theme="flat"] .site-guestbook-actions button {
    background: var(--flat-accent) !important;
    color: var(--flat-accent-text) !important;
    border: 1px solid var(--flat-border-strong) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

html[data-site-theme="flat"] .site-guestbook-actions button:is(:hover, :focus-visible) {
    background: var(--flat-accent-strong) !important;
    border-color: var(--flat-border-strong) !important;
}

html[data-site-theme="flat"] .site-guestbook-auth-notice {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: var(--flat-text-dim) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

html[data-site-theme="flat"] .site-guestbook-auth-signin {
    background: var(--flat-accent) !important;
    color: var(--flat-accent-text) !important;
    border: 1px solid var(--flat-border-strong) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

html[data-site-theme="flat"] .site-guestbook-auth-signin:is(:hover, :focus-visible) {
    background: var(--flat-accent-strong) !important;
}

html[data-site-theme="flat"] .site-guestbook-verification-code {
    background: var(--flat-bg-elev-2) !important;
    color: var(--flat-text) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    -webkit-text-fill-color: var(--flat-text) !important;
    letter-spacing: 0.12em;
}

html[data-site-theme="flat"] .site-guestbook-comments {
    border-top: 1px solid var(--flat-border) !important;
    padding-top: 1.4rem;
    margin-top: 0.4rem;
}

html[data-site-theme="flat"] .site-guestbook-form {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

html[data-site-theme="flat"] .site-guestbook-entry {
    background: var(--flat-bg) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    color: var(--flat-text) !important;
    padding: 0.9rem 1rem;
}

html[data-site-theme="flat"] .site-guestbook-entry-meta {
    border-bottom: 1px solid var(--flat-border) !important;
    padding-bottom: 0.4rem;
    margin-bottom: 0.5rem;
}

html[data-site-theme="flat"] .site-guestbook-name {
    color: var(--flat-text) !important;
    -webkit-text-fill-color: var(--flat-text) !important;
    text-shadow: none !important;
    font-weight: 800;
}

html[data-site-theme="flat"] .site-guestbook-entry-meta-sub,
html[data-site-theme="flat"] .site-guestbook-entry-meta-sub span,
html[data-site-theme="flat"] .site-guestbook-entry-site {
    color: var(--flat-text-dim) !important;
    -webkit-text-fill-color: var(--flat-text-dim) !important;
    text-shadow: none !important;
    font-weight: 500;
    letter-spacing: 0.04em;
}

html[data-site-theme="flat"] .site-guestbook-entry-message,
html[data-site-theme="flat"] .site-guestbook-admin-reply-message {
    color: var(--flat-text) !important;
    -webkit-text-fill-color: var(--flat-text) !important;
    text-shadow: none !important;
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
}

html[data-site-theme="flat"] .site-guestbook-admin-reply {
    background: var(--flat-bg-elev-2) !important;
    border: 1px solid var(--flat-border) !important;
    border-left: 3px solid var(--flat-border-strong) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    margin-top: 0.6rem;
    padding: 0.7rem 0.9rem;
}

html[data-site-theme="flat"] .site-guestbook-admin-reply-action {
    color: var(--flat-text-dim) !important;
    -webkit-text-fill-color: var(--flat-text-dim) !important;
    text-shadow: none !important;
}

html[data-site-theme="flat"] .site-guestbook-badge {
    background: var(--flat-bg-elev-2) !important;
    color: var(--flat-text) !important;
    border: 1px solid var(--flat-border) !important;
    border-radius: var(--flat-radius-sm) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    padding: 1px 6px;
    font-size: 10px;
    letter-spacing: 0.08em;
}

html[data-site-theme="flat"] a {
    color: var(--flat-text);
    text-shadow: none;
}

html[data-site-theme="flat"] a:is(:hover, :focus-visible) {
    color: #ffffff;
    text-decoration: none;
}

html[data-site-theme="flat"] hr {
    border: none;
    border-top: 1px solid var(--flat-border);
}

html[data-site-theme="flat"] .neon-hero-stripe,
html[data-site-theme="flat"] .neon-hero-outline,
html[data-site-theme="flat"] .neon-hero-fill {
    display: none !important;
}

html[data-site-theme="flat"] .win98-titlebar,
html[data-site-theme="flat"] .win98-titlebar-stripe,
html[data-site-theme="flat"] .win98-titlebar-controls {
    display: none !important;
}

html[data-site-theme="flat"] .flicker-title,
html[data-site-theme="flat"] #main-title {
    color: var(--flat-text) !important;
    -webkit-text-fill-color: var(--flat-text) !important;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
    background: none !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    animation: none !important;
    filter: none !important;
}

/* FLAT theme: the hero title still animates on hover like every other theme.
   Re-enable the native startup-flicker (the rule above forces animation:none
   on the resting state, so the hover state must restore it explicitly). */
html[data-site-theme="flat"] #main-title:is(:hover, :focus-visible),
html[data-site-theme="flat"] .flicker-title:is(:hover, :focus-visible) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    animation: startupFlicker 0.3s forwards !important;
}

html[data-site-theme="flat"] .nav-card a.glass .flex.flex-col > div:first-child {
    color: var(--flat-text) !important;
    -webkit-text-fill-color: var(--flat-text) !important;
    text-shadow: none !important;
    background: none !important;
    -webkit-text-stroke: 0 !important;
}

html[data-site-theme="flat"] .nav-card a.glass .flex.flex-col > div:last-child {
    color: var(--flat-text-dim) !important;
    text-shadow: none !important;
}

html[data-site-theme="flat"] .nav-card a.glass {
    padding: 1.25rem 1.5rem;
    border-radius: var(--flat-radius);
    gap: 1rem;
}

html[data-site-theme="flat"] .nav-card .icon-box {
    background-color: var(--flat-text) !important;
}

html[data-site-theme="flat"] .nav-card a.glass > div:has(.icon-box) {
    background: var(--flat-bg-elev-2) !important;
    border: 1px solid var(--flat-border);
    border-radius: var(--flat-radius-sm);
}

.flat-token-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 8px;
    margin: 8px 0;
}

.flat-token-cell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 4px 8px;
    border: 1px solid currentColor;
    border-radius: 6px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.flat-token-cell span {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flat-token-cell input[type="color"] {
    width: 36px;
    height: 24px;
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: 0;
}

/* =============================================================
   STYLE EDITOR — per-theme content gating + flat/vapor chrome
   ============================================================= */

/* Theme-specific extra panels visibility (gated by dialog-root dataset). */
.style-theme-extra { display: flex; flex-direction: column; gap: 12px; margin-bottom: 14px; }
.style-extra-flat, .style-extra-vapor { display: none; }
.neon-playlist-style-dialog-root[data-style-theme="flat"] .style-extra-flat { display: block; }
.neon-playlist-style-dialog-root[data-style-theme="vaporwave"] .style-extra-vapor { display: block; }

/* Non-neon themes: hide the neon-only display card + rail/panes shell. */
.neon-playlist-style-dialog-root[data-style-theme="flat"] .neon-style-display-card,
.neon-playlist-style-dialog-root[data-style-theme="flat"] .neon-style-shell,
.neon-playlist-style-dialog-root[data-style-theme="vaporwave"] .neon-style-display-card,
.neon-playlist-style-dialog-root[data-style-theme="vaporwave"] .neon-style-shell,
.neon-playlist-style-dialog-root[data-style-theme="win98"] .neon-style-display-card,
.neon-playlist-style-dialog-root[data-style-theme="win98"] .neon-style-shell {
    display: none !important;
}

.style-extra-card {
    background: rgba(0, 0, 0, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.style-extra-title {
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    opacity: 0.7;
}
.style-extra-row { display: flex; flex-direction: column; gap: 6px; }
.style-extra-row > span { font-size: 12px; font-weight: 700; display: flex; justify-content: space-between; }
.style-extra-row > span em { font-style: normal; opacity: 0.7; }
.style-extra-row input[type="range"] { width: 100%; }
.style-extra-select {
    padding: 8px 36px 8px 12px; border-radius: 8px; font: inherit;
    -webkit-appearance: none; appearance: none;
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 11px 7px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
}
/* Color pickers: even columns, label stacked above its own swatch (no space-between
   offset that visually pairs a swatch with the next label). */
.style-extra-color-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)); gap: 10px; }
.style-extra-color { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 6px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; }
.style-extra-color input[type="color"] { width: 34px; height: 22px; border: 0; background: transparent; cursor: pointer; padding: 0; }
/* Boxes peek toggle never dims — it is always usable regardless of on/off state. */
#vapor-scene-peek-toggle[aria-pressed="false"] { opacity: 1; }
.style-extra-text {
    padding: 8px 12px; border-radius: 8px; font: inherit;
    border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.08); color: inherit;
}
.style-extra-preset-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.style-extra-preset-row > .style-extra-text,
.style-extra-preset-row > .style-extra-select { flex: 1 1 120px; min-width: 0; }
.style-extra-preset-row > .style-extra-reset { flex: 0 0 auto; }
.style-extra-swatches { display: flex; gap: 8px; }
.style-extra-swatch { width: 28px; height: 28px; border-radius: 6px; border: 1px solid rgba(255, 255, 255, 0.25); }
.style-extra-toggle-row { display: flex; flex-wrap: wrap; gap: 8px; }
.style-extra-toggle, .style-extra-reset {
    padding: 7px 14px; font: inherit; font-weight: 800; font-size: 12px; cursor: pointer;
    border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.08); color: inherit;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.16s ease, background-color 0.18s ease, opacity 0.18s ease;
}
.style-extra-toggle:hover, .style-extra-reset:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 255, 255, 0.45);
    box-shadow: 0 0 14px rgba(255, 255, 255, 0.18);
}
.style-extra-toggle:active, .style-extra-reset:active { transform: translateY(0); }
.style-extra-toggle[aria-pressed="false"] { opacity: 0.55; }
.style-extra-toggle[aria-pressed="false"]:hover { opacity: 0.8; }
.style-extra-target-row { display: none; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 12px; font-weight: 700; }
.style-extra-target-row > span { opacity: 0.7; text-transform: uppercase; letter-spacing: 0.04em; font-size: 11px; }
.style-extra-target-row input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.style-extra-target-row label {
    display: inline-flex; align-items: center; cursor: pointer;
    padding: 5px 12px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.06); opacity: 0.6; transition: opacity 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}
.style-extra-target-row label:hover { opacity: 0.85; }
.style-extra-target-row label:has(input:checked) { opacity: 1; border-color: currentColor; background: rgba(255, 255, 255, 0.14); }
/* Flat editor: all boxes shown as a grouped, selectable list (neon-style). */
.flat-subhead { margin-top: 6px; }
/* Per-box color cards (neon-style): each in-scope box gets its own card. */
.flat-box-cards { display: flex; flex-direction: column; gap: 8px; max-height: 320px; overflow-y: auto; scrollbar-width: thin; padding-right: 2px; }
.flat-box-group-label { font-size: 9px; font-weight: 900; letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.5; padding: 6px 2px 0; }
.flat-box-group-label:first-child { padding-top: 0; }
.flat-box-card { border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 8px; padding: 10px; display: flex; flex-direction: column; gap: 8px; background: rgba(255, 255, 255, 0.04); }
.flat-box-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 12px; font-weight: 800; }
.flat-box-card-reset { padding: 3px 10px; font: inherit; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; cursor: pointer; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.22); background: rgba(255, 255, 255, 0.06); color: inherit; }
.flat-box-card-reset:hover { background: rgba(255, 255, 255, 0.14); }
html[data-site-theme="flat"] .flat-box-card { border-color: var(--flat-border) !important; background: var(--flat-bg) !important; }
html[data-site-theme="flat"] .flat-box-card-reset { background: var(--flat-bg-elev-2) !important; border-color: var(--flat-border) !important; }
.neon-playlist-style-dialog-root[data-style-theme="vaporwave"] .style-extra-target-row,
.neon-playlist-style-dialog-root[data-style-theme="flat"] .style-extra-target-row { display: flex; }

/* FLAT dialog chrome. */
html[data-site-theme="flat"] .neon-playlist-style-dialog {
    background: var(--flat-bg-elev) !important;
    border: 1px solid var(--flat-border) !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6) !important;
    color: var(--flat-text) !important;
}
/* Chrome accent follows the flat palette, never the hue-shifting player accent. */
html[data-site-theme="flat"] .neon-playlist-style-dialog-root {
    --neon-style-accent: var(--flat-border-strong, #3A424F) !important;
    --neon-style-accent-soft: color-mix(in srgb, var(--flat-border-strong, #3A424F) 40%, transparent) !important;
    --neon-style-accent-glow: color-mix(in srgb, var(--flat-border-strong, #3A424F) 50%, transparent) !important;
    --neon-style-line: var(--flat-border, #2A313C) !important;
}
html[data-site-theme="flat"] .neon-playlist-style-head { border-bottom: 1px solid var(--flat-border) !important; }
html[data-site-theme="flat"] .neon-playlist-style-head h2 { color: var(--flat-text) !important; -webkit-text-fill-color: var(--flat-text) !important; text-shadow: none !important; background: none !important; }
html[data-site-theme="flat"] .style-extra-card { background: var(--flat-bg) !important; border-color: var(--flat-border) !important; }
html[data-site-theme="flat"] .style-extra-select,
html[data-site-theme="flat"] .style-extra-toggle,
html[data-site-theme="flat"] .style-extra-reset {
    background-color: var(--flat-bg-elev-2) !important; color: var(--flat-text) !important; border: 1px solid var(--flat-border) !important;
}
html[data-site-theme="flat"] .neon-playlist-style-close { color: var(--flat-text-dim) !important; }

/* VAPORWAVE dialog chrome. */
html[data-site-theme="vaporwave"] .neon-playlist-style-dialog {
    background: linear-gradient(160deg, #1a0033, #2a074f 60%, #14001f) !important;
    border: 1px solid var(--vapor-cyan, #00eaff) !important;
    box-shadow: 0 0 30px rgba(255, 43, 214, 0.3) !important;
}
/* Chrome accent follows the palette, never the hue-shifting player accent (rAF writes
   --neon-style-accent inline; these !important binds override it). Keeps title/footer bars static. */
html[data-site-theme="vaporwave"] .neon-playlist-style-dialog-root {
    --neon-style-accent: var(--vapor-cyan, #00eaff) !important;
    --neon-style-accent-soft: color-mix(in srgb, var(--vapor-cyan, #00eaff) 26%, transparent) !important;
    --neon-style-accent-glow: color-mix(in srgb, var(--vapor-pink, #ff2bd6) 50%, transparent) !important;
    --neon-style-line: color-mix(in srgb, var(--vapor-cyan, #00eaff) 22%, rgba(255, 255, 255, 0.08)) !important;
}
html[data-site-theme="vaporwave"] .neon-playlist-style-head h2 { color: var(--vapor-gold, #fff38a) !important; text-shadow: 2px 2px 0 #ff2bd6 !important; }
html[data-site-theme="vaporwave"] .style-extra-title { color: var(--vapor-cyan, #00eaff) !important; opacity: 1; }
html[data-site-theme="vaporwave"] .style-extra-select,
html[data-site-theme="vaporwave"] .style-extra-text,
html[data-site-theme="vaporwave"] .style-extra-toggle,
html[data-site-theme="vaporwave"] .style-extra-reset {
    background-color: rgba(20, 0, 31, 0.7) !important; color: #fff4ff !important; border: 1px solid var(--vapor-cyan, #00eaff) !important;
}
html[data-site-theme="vaporwave"] .style-extra-toggle:hover,
html[data-site-theme="vaporwave"] .style-extra-reset:hover {
    border-color: var(--vapor-pink, #ff2bd6) !important;
    box-shadow: 0 0 18px color-mix(in srgb, var(--vapor-pink, #ff2bd6) 55%, transparent) !important;
}
/* Admin scene peek: hide content boxes so the canvas sun + grid show through. */
html[data-site-theme="vaporwave"] body.admin-page.vapor-scene-peek .admin-board-layout {
    visibility: hidden;
}