/* The seasonal layer is loaded only during the October date window. */
.halloween-season {
    --primary: #ff941f;
    --primary-dark: #ffb352;
    --line: #3d3834;
    --surface: #191b1e;
    --muted: #b0aba5;
    background: #101214 url('halloween-backdrop-2026.webp') center / cover fixed no-repeat;
}
.halloween-season .shell,
.halloween-season .client-shell {
    min-height: calc(100dvh - 64px);
    background: #111315f2;
}
.halloween-season .sidebar {
    background: #101214;
    border-right-color: #614020;
    box-shadow: 3px 0 20px #0005;
}
.halloween-season .sidebar .brand {
    position: relative;
    isolation: isolate;
    margin-inline: -14px;
    padding-inline: 17px;
    border-bottom: 1px solid #614020;
    background: #151719;
}
.halloween-season .sidebar nav { padding-top: 12px; }
.halloween-season .sidebar nav a.active {
    color: #ffc17b;
    background: #382313;
    border-color: #754923;
    box-shadow: inset 3px 0 var(--primary);
}
.halloween-season .nav-section { color: #c79e75; }
.halloween-season .userbox {
    border-top-color: #614020;
    background: url('halloween-web-2026.webp') right top / 54px 54px no-repeat;
}
.halloween-season .userbox .user-avatar {
    width: 44px;
    flex: 0 0 44px;
    border: 0;
    background: url('halloween-gym-2026.webp') center / contain no-repeat;
}
.halloween-season .userbox .user-avatar .lucide { visibility: hidden; }
.halloween-season .workspace-bar,
.halloween-season .client-header {
    background: #131517;
    border-bottom: 1px solid #78502b;
    box-shadow: 0 2px 0 #ff941f0d;
    backdrop-filter: none;
}
.halloween-badge { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; }
.halloween-badge img { width: 40px; height: 30px; object-fit: contain; }
.halloween-badge span,
.workspace-location .halloween-badge span { color: #ffb86d; font-size: 11px; font-weight: 700; }
.workspace-location > .halloween-badge { margin-left: 10px; padding-left: 16px; border-left: 1px solid #583921; }

/* Corner artwork belongs to the frame, never over interactive controls. */
.halloween-season .topbar {
    position: relative;
    isolation: isolate;
    min-height: 80px;
    padding-bottom: 22px;
    border-bottom: 1px solid #614020;
}
.halloween-season .topbar::before,
.halloween-season .login-card::before,
.halloween-season .sidebar .brand::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 132px;
    height: 132px;
    background: url('halloween-web-2026.webp') right top / contain no-repeat;
    opacity: .45;
    pointer-events: none;
    z-index: -1;
}
.halloween-season .topbar::before { height: 100%; }
.halloween-season .sidebar .brand::before { width: 88px; height: 88px; opacity: .22; }
.halloween-season .topbar > * { position: relative; }
.halloween-season .topbar .eyebrow { color: #ffbc78; }
.halloween-season .topbar h1 { color: #fff6eb; }
.halloween-season .module-tabs,
.halloween-season .quick-actions { border-color: #614020; }
.halloween-season .module-tabs a[aria-current="page"],
.halloween-season .client-nav a[aria-current="page"] { color: #ffbc78; border-color: #ff941f; }
.halloween-season .client-nav { background: #16181a; border-bottom-color: #614020; }
.halloween-season .metrics:not(.member-kpis) article {
    background: #1c1e20;
    border-color: #544537;
    border-top: 2px solid #c7762c;
}
.halloween-season .metrics:not(.member-kpis) article .lucide { color: #ffb261; }
.halloween-season th,
.halloween-season .module-table th,
.halloween-season .record-table th.record-controls {
    background: #30271f;
    color: #f1cda7;
    border-bottom: 1px solid #76502d;
}
.halloween-season .module-table { border-color: #544537; }
.halloween-season .module-table tr:hover td,
.halloween-season tbody tr:hover td { background: #30291f; }
.halloween-season input:not([type="checkbox"]):not([type="radio"]),
.halloween-season select,
.halloween-season textarea { border-color: #544a40; background-color: #16181a; }
.halloween-season input:focus,
.halloween-season select:focus,
.halloween-season textarea:focus { border-color: #ff941f; }
.halloween-season .primary { box-shadow: inset 0 1px 0 #ffd5a5; }
.halloween-season .topbar.checkin-topbar { min-height: 49px; padding-bottom: 0; border-bottom: 0; }
.halloween-season .topbar.checkin-topbar::before { display: none; }
.halloween-season .checkin-header {
    background:
        url('halloween-web-2026.webp') right top / 108px 108px no-repeat,
        linear-gradient(90deg, #111315fa 0%, #111315e8 38%, #11131526 72%, #11131573 100%),
        #191b1e url('halloween-backdrop-2026.webp') center 84% / cover no-repeat;
    border-bottom-color: #78502b;
}
.halloween-season .checkin-header h2 { color: #fff6eb; }
.halloween-season .checkin-header p { color: #d1cdc7; }
.halloween-season .checkin-board { border: 1px solid #614020; }
.halloween-season .panel-head h2 { color: #f4dfc6; }

.halloween-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 154px;
    padding: 24px 22%;
    gap: 36px;
    margin: 0 0 28px;
    border-block: 1px solid #885523;
    background: #151719 url('halloween-backdrop-2026.webp') center 84% / cover no-repeat;
}
.halloween-banner > div { display: grid; gap: 8px; min-width: 0; }
.halloween-banner > div > span { color: #f6dac0; font-size: 10px; font-weight: 700; }
.halloween-banner strong { font-size: 34px; line-height: 1.2; color: #ffb45f; font-weight: 800; text-shadow: 0 2px 8px #000; }
.halloween-banner-date { display: grid; gap: 2px; color: #f8d9b8; font-size: 10px; text-align: center; padding-left: 28px; border-left: 1px solid #976436; }
.halloween-banner-date b { font-size: 34px; line-height: 1.1; color: #ffb45f; }

.halloween-season .login-shell {
    background: transparent;
    min-height: 100dvh;
    padding-block: 44px;
}
.halloween-season .login-card {
    position: relative;
    isolation: isolate;
    border-color: #a26731;
    border-top-color: #ff941f;
    background: #131719f7;
    box-shadow: 0 24px 80px #0009, 0 0 0 6px #ff941f09;
    padding-top: 26px;
}
.halloween-season .login-card::before { border-top-right-radius: 6px; opacity: .65; }
.halloween-season .login-logo { width: 76px; height: 76px; margin-bottom: 12px; }
.halloween-season .login-card > .login-subtitle { margin-bottom: 12px; }
.halloween-login {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 12px 0 18px;
    border-block: 1px solid #634327;
    padding: 5px 0;
}
.halloween-login img { width: 96px; height: 72px; flex-shrink: 0; object-fit: contain; }
.halloween-login > div { display: grid; gap: 3px; }
.halloween-login span { color: #c9b6a3; font-size: 8px; font-weight: 700; }
.halloween-login strong { font-size: 25px; line-height: 1.25; color: #ffb86d; font-weight: 800; }
.halloween-season .login-audience { margin-top: 16px; border-color: #634327; }
.halloween-season .login-audience a[aria-current="page"] { background: #34251a; color: #ffbd73; }

@media (max-width: 1180px) {
    .workspace-location > .halloween-badge { display: none; }
}
@media (max-width: 700px) {
    .halloween-season { background-position: 22% center; background-attachment: scroll; }
    .halloween-season .shell, .halloween-season .client-shell { background: #111315f7; }
    .client-brand .halloween-badge { margin-left: 0; }
    .client-brand .halloween-badge > span { display: none; }
    .halloween-banner { min-height: 132px; padding: 20px 22px; margin-bottom: 24px; background-size: auto 210px; background-position: center 75%; justify-content: center; text-align: center; }
    .halloween-banner strong { font-size: 29px; }
    .halloween-banner > div > span { font-size: 8px; }
    .halloween-banner-date { display: none; }
    .halloween-season .topbar { min-height: 76px; }
    .halloween-season .login-shell { padding: 28px 18px; }
}
@media (max-width: 380px) {
    .halloween-login { gap: 6px; }
    .halloween-login img { width: 80px; height: 60px; }
    .halloween-login strong { font-size: 22px; }
    .halloween-banner { padding-inline: 16px; }
    .halloween-banner-date { display: none; }
}
@media print {
    .halloween-badge, .halloween-login, .halloween-banner,
    .halloween-season .topbar::before, .halloween-season .login-card::before { display: none !important; }
    .halloween-season, .halloween-season .client-shell { background: white !important; }
    .halloween-season .topbar, .halloween-season .topbar h1,
    .halloween-season .panel-head h2 { color: #111 !important; border-color: #aaa !important; }
    .halloween-season .checkin-header { background: white !important; }
    .halloween-season .checkin-header h2,
    .halloween-season .checkin-header p { color: #111 !important; }
}
