/* Halloween 2026 — colour layer for the current Recompensated design.
   No layout, typography, spacing or content changes. */
:root[data-season="halloween"] {
    color-scheme: dark;
    --bg-base: var(--season-background);
    --bg-main: var(--season-background);
    --bg-card: var(--season-surface);
    --bg-card-end: color-mix(in srgb, var(--season-surface) 65%, var(--season-background));
    --bg-surface: color-mix(in srgb, var(--season-purple) 7%, transparent);
    --bg-surface-hover: color-mix(in srgb, var(--season-purple) 12%, transparent);
    --border-subtle: color-mix(in srgb, var(--season-purple) 19%, transparent);
    --border-medium: color-mix(in srgb, var(--season-purple) 25%, transparent);
    --border-strong: color-mix(in srgb, var(--season-purple) 40%, transparent);
    --text-primary: var(--season-ink);
    --text-body: color-mix(in srgb, var(--season-ink) 88%, var(--season-purple));
    --text-muted: color-mix(in srgb, var(--season-ink) 62%, var(--season-purple));
    --text-faint: color-mix(in srgb, var(--season-ink) 48%, var(--season-purple));
    --accent: var(--season-accent);
    --accent-hover: color-mix(in srgb, var(--season-accent) 83%, var(--season-ink));
    --accent-strong: var(--season-accent);
    --accent-dim: color-mix(in srgb, var(--season-accent) 12%, transparent);
    --accent-border: color-mix(in srgb, var(--season-accent) 30%, transparent);
    --glow-accent: color-mix(in srgb, var(--season-accent) 20%, transparent);
    --money: var(--accent);
    --money-strong: var(--accent-hover);
    --money-dim: var(--accent-dim);
    --money-border: var(--accent-border);
    --bonus: var(--season-purple);
    --bonus-dim: color-mix(in srgb, var(--season-purple) 18%, transparent);
    --header-bg: var(--bg-base);
    --ticker-bg: var(--bg-card-end);
    --input-bg: var(--bg-card-end);
    --footer-bg: linear-gradient(180deg, var(--bg-card-end), var(--bg-base));
    --dropdown-bg: linear-gradient(180deg, var(--bg-card), var(--bg-card-end));
    --shadow-hero: 0 8px 24px var(--glow-accent);
    --focus-ring: 0 0 0 3px var(--accent-border);
    /* Legacy declarations use these optional tokens with their exact original
       colour as fallback. They resolve only while the seasonal layer is loaded. */
    --season-legacy-base: var(--bg-base);
    --season-legacy-surface: var(--bg-card);
    --season-legacy-accent: var(--accent);
    --season-legacy-base-rgb: var(--season-background-rgb);
    --season-legacy-surface-rgb: var(--season-surface-rgb);
    --season-legacy-accent-rgb: var(--season-accent-rgb);
    /* Admin uses its own token names. */
    --bg-elev: var(--bg-card);
    --surface: var(--bg-surface);
    --surface-2: var(--bg-surface-hover);
    --surface-3: color-mix(in srgb, var(--season-purple) 15%, transparent);
    --border: var(--border-subtle);
    --ink: var(--text-primary);
    --ink-dim: var(--text-muted);
    --ink-faint: var(--text-faint);
    --accent-2: var(--accent-hover);
    --accent-soft: var(--accent-dim);
}

/* Scoped specificity also covers legacy CSS and the workspace stylesheet
   loaded after the head. Provider art and semantic status colours stay intact. */
html[data-season="halloween"] body {
    background: var(--bg-base) !important;
}
html[data-season="halloween"] :is(.site-header, .ticker-bar, .app-shell, .app-shell-wrap, .app-content, .landing-v4, .auth-shell, .auth-form-panel) {
    background: var(--bg-base);
}
html[data-season="halloween"] :is(.app-sidebar, .cx-panel, .lp-phone, .lp-phone__screen, .admin-sidebar, .admin-topbar) {
    background: var(--bg-card-end);
    border-color: var(--border-subtle);
}
html[data-season="halloween"] :is(.site-footer, .admin-aurora, .auth-showcase) {
    background: radial-gradient(ellipse at 85% 0, var(--bonus-dim), transparent 65%), var(--bg-base);
}
html[data-season="halloween"] .admin-aurora canvas { opacity: .16; }
html[data-season="halloween"] .auth-showcase { --showcase-bg: var(--bg-base); }
html[data-season="halloween"] .auth-showcase__glow {
    background: var(--accent-dim);
    border-color: var(--accent-border);
    box-shadow: 0 0 0 4.5rem var(--bg-surface);
}
html[data-season="halloween"] :is(.site-header__logo-icon, .admin-brand__gem, .page-brand-loader__tile) {
    background: var(--bg-card);
    border-color: var(--accent-border);
    box-shadow: 0 0 12px var(--glow-accent);
}
html[data-season="halloween"] .site-header__brand { --season-brand-ink: var(--season-accent); }
html[data-season="halloween"] :is(.site-header__wordmark, .site-header__wordmark .brand-wordmark__letter) {
    color: var(--season-accent);
}
html[data-season="halloween"] :is(.brand-transition__monogram, [data-brand-icon]) {
    filter: drop-shadow(0 3px 4px var(--bonus-dim));
}
html[data-season="halloween"] :is(.site-header__withdraw-btn, .app-sidebar__cashout-btn, .seasonal-banner__link, .notif-item__dot) {
    background: var(--accent);
    color: var(--bg-base);
    border-color: var(--accent-border);
}
html[data-season="halloween"] .mobile-bottom-nav__item--cta,
html[data-season="halloween"] .mobile-bottom-nav__item--cta:is(:hover, :focus-visible) {
    background: var(--accent);
    color: var(--bg-base);
}
html[data-season="halloween"] .mobile-bottom-nav__item--cta :is(span, i) {
    color: var(--bg-base);
}
html[data-season="halloween"] .lp-hero::after {
    background: var(--bg-base);
    opacity: .55;
}
html[data-season="halloween"] :is(.site-header__nav-link.is-active, .app-sidebar__item.is-active, .account-trigger, .notif-item.is-unread) {
    background: var(--accent-dim);
    border-color: var(--accent-border);
}
html[data-season="halloween"] :is(.ticker-item__points, .site-header__points, .account-dropdown__item:hover i, .notif-item__icon--withdraw) {
    color: var(--accent);
}
html[data-season="halloween"] .auth-submit-button { color: var(--bg-base); }
html[data-season="halloween"] .ticker-bar__label {
    background: var(--accent);
    color: var(--bg-base);
}
html[data-season="halloween"] .ticker-bar__label :is(span, i) { color: var(--bg-base); }
html[data-season="halloween"] .page-brand-loader__tile img {
    display: block;
    width: 100%;
    height: 100%;
}
html[data-season="halloween"] :is(.site-footer__brand-mark, .maintenance-loader__tile) img {
    display: block;
    width: 100%;
    height: 100%;
}
html[data-season="halloween"] .page-brand-loader__arc {
    background: conic-gradient(transparent 200deg, var(--accent-border) 300deg, var(--accent) 352deg, transparent 360deg);
}
/* Destination chooses the event reveal; ordinary routes keep the R sequence. */
html[data-season="halloween"].brand-halloween-loading .brand-transition {
    background: radial-gradient(ellipse at center, var(--accent-dim), transparent 60%), var(--bg-base);
}
.brand-halloween-loading .brand-transition__monogram { display:none; }
.brand-halloween-loading .brand-transition__pumpkin {
    display:block; position:absolute; width:clamp(8rem,20vw,14rem); aspect-ratio:1;
    opacity:0; transform-origin:center; filter:drop-shadow(0 12px 28px var(--accent-dim));
}
.brand-transition__pumpkin img { display:block; width:100%; height:100%; object-fit:contain; }
html[data-season="halloween"] .brand-transition__wordmark .brand-wordmark__letter { color:var(--season-accent); }

/* The ordinary R remains the resting identity. Hover/focus is reversible and
   CSS owns it, so mouseout restores the logo even when navigation is cancelled. */
.brand-icon-swap { position:relative; display:inline-grid; width:2.5rem; height:2.5rem; flex-shrink:0; perspective:250px; transition:transform .35s ease; }
.brand-icon-swap :is(img, .brand-icon-swap__normal) {
    position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:contain;
    transition:opacity .28s ease,transform .48s cubic-bezier(.2,.75,.25,1);
    backface-visibility:hidden;
}
.brand-icon-swap__normal { opacity:1; transform:rotateY(0deg) scale(1); }
.brand-icon-swap__pumpkin { opacity:0; transform:rotateY(-65deg) scale(.55); border-radius:0; box-shadow:none; }
.site-header__logo-icon .brand-icon-swap,.admin-brand__gem .brand-icon-swap { width:100%; height:100%; }
.auth-toolbar__brand .brand-icon-swap,.auth-showcase__brand .brand-icon-swap { display:inline-grid; width:2.55rem; height:2.55rem; }
@media(hover:hover) {
    :is([data-brand-motion],.admin-brand):hover .brand-icon-swap__normal { opacity:0; transform:rotateY(65deg) scale(.65); }
    :is([data-brand-motion],.admin-brand):hover .brand-icon-swap__pumpkin { opacity:1; transform:rotateY(0deg) scale(1.18); animation:seasonal-hover-fire 1.7s ease-in-out infinite; }
}
:is([data-brand-motion],.admin-brand):focus-visible .brand-icon-swap__normal { opacity:0; transform:rotateY(65deg) scale(.65); }
:is([data-brand-motion],.admin-brand):focus-visible .brand-icon-swap__pumpkin { opacity:1; transform:rotateY(0deg) scale(1.18); animation:seasonal-hover-fire 1.7s ease-in-out infinite; }
/* Only hovered seasonal brand links move. Glyph transforms never change widths. */
@media(hover:hover) {
    :is([data-brand-motion],.admin-brand):hover:has(.brand-icon-swap) .brand-icon-swap { animation:seasonal-hover-prowl 1.8s ease-in-out infinite; }
    :is([data-brand-motion],.admin-brand):hover:has(.brand-icon-swap) .brand-wordmark__letter { animation:seasonal-wordmark-wave 1.6s ease-in-out infinite; }
    .admin-brand:hover:has(.brand-icon-swap) .admin-brand__copy strong { animation:seasonal-wordmark-glow 1.6s ease-in-out infinite; }
}
:is([data-brand-motion],.admin-brand):focus-visible:has(.brand-icon-swap) .brand-icon-swap { animation:seasonal-hover-prowl 1.8s ease-in-out infinite; }
:is([data-brand-motion],.admin-brand):focus-visible:has(.brand-icon-swap) .brand-wordmark__letter { animation:seasonal-wordmark-wave 1.6s ease-in-out infinite; }
.brand-wordmark__letter:nth-child(2) { animation-delay:0.055s !important; }
.brand-wordmark__letter:nth-child(3) { animation-delay:0.110s !important; }
.brand-wordmark__letter:nth-child(4) { animation-delay:0.165s !important; }
.brand-wordmark__letter:nth-child(5) { animation-delay:0.220s !important; }
.brand-wordmark__letter:nth-child(6) { animation-delay:0.275s !important; }
.brand-wordmark__letter:nth-child(7) { animation-delay:0.330s !important; }
.brand-wordmark__letter:nth-child(8) { animation-delay:0.385s !important; }
.brand-wordmark__letter:nth-child(9) { animation-delay:0.440s !important; }
.brand-wordmark__letter:nth-child(10) { animation-delay:0.495s !important; }
.brand-wordmark__letter:nth-child(11) { animation-delay:0.550s !important; }
.brand-wordmark__letter:nth-child(12) { animation-delay:0.605s !important; }
.brand-wordmark__letter:nth-child(13) { animation-delay:0.660s !important; }
@keyframes seasonal-hover-prowl {
    0%,100% { transform:perspective(250px) translateY(0) rotateY(-8deg) rotateZ(-5deg); }
    30% { transform:perspective(250px) translateY(-3px) rotateY(12deg) rotateZ(7deg) scale(1.07); }
    65% { transform:perspective(250px) translateY(2px) rotateY(-10deg) rotateZ(-4deg); }
}
@keyframes seasonal-hover-fire { 0%,100% {filter:brightness(.95)} 25% {filter:brightness(1.17)} 40% {filter:brightness(1.02)} 75% {filter:brightness(1.12)} }
@keyframes seasonal-wordmark-wave {
    0%,60%,100% { transform:translate3d(0,0,0) rotateZ(0deg); color:var(--season-brand-ink,var(--text-primary)); text-shadow:none; }
    20% { transform:translate3d(0,-.14em,0) rotateZ(-3deg); color:var(--accent); text-shadow:0 0 12px var(--accent-border); }
    38% { transform:translate3d(0,.04em,0) rotateZ(2deg); color:var(--season-brand-ink,var(--text-primary)); }
}
@keyframes seasonal-wordmark-glow { 0%,100% {text-shadow:none} 40% {text-shadow:0 0 12px var(--accent-border);color:var(--accent)} }
@media(prefers-reduced-motion:reduce) {
    .brand-icon-swap :is(img,.brand-icon-swap__normal),.brand-icon-swap { transition:none; }
    :is([data-brand-motion],.admin-brand):is(:hover,:focus-visible) :is(.brand-icon-swap__pumpkin,.brand-icon-swap,.brand-wordmark__letter,.admin-brand__copy strong) { animation:none; }
}