/* Every rule is scoped: no holiday selected means the original style. */
html[data-sp-holiday="halloween"] {
    --sp-holiday-accent: #ffac57;
    --sp-holiday-bright: #ffd091;
    --sp-holiday-soft: rgba(255, 172, 87, .15);
    --sp-holiday-edge: rgba(255, 172, 87, .45);
    --sp-holiday-bg: #291c2b;
    --sp-holiday-art: url("halloween.svg");
}
html[data-sp-holiday="christmas"] {
    --sp-holiday-accent: #79e3ba;
    --sp-holiday-bright: #c1ffe5;
    --sp-holiday-soft: rgba(121, 227, 186, .15);
    --sp-holiday-edge: rgba(121, 227, 186, .45);
    --sp-holiday-bg: #142c2b;
    --sp-holiday-art: url("christmas.svg");
}
html[data-sp-holiday="newyear"] {
    --sp-holiday-accent: #f6cf78;
    --sp-holiday-bright: #ffe8b0;
    --sp-holiday-soft: rgba(246, 207, 120, .15);
    --sp-holiday-edge: rgba(246, 207, 120, .45);
    --sp-holiday-bg: #25233a;
    --sp-holiday-art: url("newyear.svg");
}
html[data-sp-holiday] {
    --accent: var(--sp-holiday-accent);
    --accent-bright: var(--sp-holiday-bright);
    --accent-soft: var(--sp-holiday-soft);
    --pink: var(--accent);
    --pink2: var(--accent-bright);
}
html[data-sp-holiday] .hero,
html[data-sp-holiday] #page-header .headerbar {
    border-color: var(--sp-holiday-edge);
    box-shadow: 0 0 24px var(--sp-holiday-soft);
}
html[data-sp-holiday] .topbar {
    border-bottom-color: var(--sp-holiday-edge);
}
html[data-sp-holiday] #page-header .headerbar .sp-holiday-banner {
    margin: 8px 8px 16px;
    clear: both;
}
html[data-sp-holiday] .forabg,
html[data-sp-holiday] .forumbg {
    background-color: var(--sp-holiday-bg);
    background-image: linear-gradient(100deg, var(--sp-holiday-bg), #23222c);
}
html[data-sp-holiday] .forabg .header a,
html[data-sp-holiday] .forumbg .header a,
html[data-sp-holiday] .forabg .header dt,
html[data-sp-holiday] .forumbg .header dt,
html[data-sp-holiday] .forabg .header dd,
html[data-sp-holiday] .forumbg .header dd {
    color: #fff3db;
}
html[data-sp-holiday] .sp-holiday-banner {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 16px;
    position: relative;
    z-index: 1;
    padding: 12px 18px;
    margin: 0 0 22px;
    min-height: 84px;
    border: 1px solid var(--sp-holiday-edge);
    border-radius: 14px;
    background: linear-gradient(110deg, var(--sp-holiday-bg), #1b202b);
    color: #fff4e2;
    font-family: inherit;
    line-height: 1.4;
    overflow: hidden;
}
html[data-sp-holiday] .sp-holiday-copy { flex: 1; min-width: 0; }
html[data-sp-holiday] .sp-holiday-copy strong {
    display: block;
    color: var(--sp-holiday-bright);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .1em;
}
html[data-sp-holiday] .sp-holiday-copy > span {
    display: block;
    font-size: 14px;
    margin-top: 3px;
    color: #fff4e2;
}
html[data-sp-holiday] .sp-holiday-art {
    display: block;
    flex: 0 0 100px;
    height: 58px;
    background: var(--sp-holiday-art) center / contain no-repeat;
}
html[data-sp-holiday] .sp-holiday-icon { font-size: 30px; flex: 0 0 auto; }
html[data-sp-holiday][data-sp-holiday-effects="1"] .sp-holiday-icon {
    animation: sp-holiday-glow 5s ease-in-out infinite;
}
@keyframes sp-holiday-glow {
    0%, 100% { transform: translateY(0); filter: brightness(1); }
    50% { transform: translateY(-3px); filter: brightness(1.15); }
}
@media (max-width: 600px) {
    html[data-sp-holiday] .sp-holiday-banner { gap: 10px; padding: 12px; min-height: 76px; }
    html[data-sp-holiday] .sp-holiday-art { flex-basis: 52px; height: 45px; }
    html[data-sp-holiday] .sp-holiday-copy strong { font-size: 10px; letter-spacing: .05em; }
    html[data-sp-holiday] .sp-holiday-copy > span { font-size: 12px; }
    html[data-sp-holiday] .sp-holiday-icon { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    html[data-sp-holiday] .sp-holiday-icon { animation: none !important; }
}

/* Festive palette on the actual Lucid Lime panels, including its important overrides. */
html[data-sp-holiday="halloween"] {
    --sp-holiday-bg: #402331;
    --sp-holiday-header: #73361f;
    --sp-holiday-secondary: #a579d7;
    --sp-holiday-panel: #231c28;
    --sp-holiday-edge: rgba(255, 161, 67, .65);
}
html[data-sp-holiday="christmas"] {
    --sp-holiday-bg: #123e35;
    --sp-holiday-header: #7e263a;
    --sp-holiday-secondary: #f1c56b;
    --sp-holiday-panel: #18292b;
    --sp-holiday-edge: rgba(121, 227, 186, .6);
}
html[data-sp-holiday="newyear"] {
    --sp-holiday-bg: #3a2d45;
    --sp-holiday-header: #715629;
    --sp-holiday-secondary: #cc9fef;
    --sp-holiday-panel: #24202e;
    --sp-holiday-edge: rgba(246, 207, 120, .65);
}
html[data-sp-holiday] body {
    background-image:
        radial-gradient(ellipse at 0 0, var(--sp-holiday-bg), transparent 48%),
        radial-gradient(ellipse at 100% 15%, var(--sp-holiday-soft), transparent 55%) !important;
}
html[data-sp-holiday] .topbar,
html[data-sp-holiday] .navbar,
html[data-sp-holiday] .content-card,
html[data-sp-holiday] .how-card,
html[data-sp-holiday] .stats-promo,
html[data-sp-holiday] .command-card,
html[data-sp-holiday] .community-card,
html[data-sp-holiday] .stat-card {
    border-color: var(--sp-holiday-edge) !important;
    background-image: linear-gradient(125deg, var(--sp-holiday-panel), #191d26) !important;
    box-shadow: inset 0 2px 0 var(--sp-holiday-soft), 0 6px 25px rgba(0, 0, 0, .18);
}
html[data-sp-holiday] .hero {
    background: radial-gradient(ellipse at 90% 10%, var(--sp-holiday-bg), transparent 65%),
        linear-gradient(120deg, var(--sp-holiday-panel), #131720) !important;
    border-color: var(--sp-holiday-accent) !important;
    box-shadow: 0 0 32px var(--sp-holiday-soft), inset 0 3px 0 var(--sp-holiday-edge);
}
html[data-sp-holiday] .hero::before { background: var(--sp-holiday-soft) !important; }
html[data-sp-holiday] .button.primary { color: #131720; border-color: var(--sp-holiday-accent); }
html[data-sp-holiday] .brand-icon { background: var(--sp-holiday-soft); box-shadow: 0 0 22px var(--sp-holiday-soft); }
html[data-sp-holiday] .forabg,
html[data-sp-holiday] .forumbg {
    border-color: var(--sp-holiday-edge) !important;
    background: linear-gradient(120deg, var(--sp-holiday-panel), #1b1f27) !important;
    box-shadow: 0 0 18px var(--sp-holiday-soft), inset 0 1px 0 var(--sp-holiday-edge) !important;
}
html[data-sp-holiday] .forabg > .inner > ul.topiclist:first-child,
html[data-sp-holiday] .forumbg > .inner > ul.topiclist:first-child,
html[data-sp-holiday] .forabg ul.topiclist li.header,
html[data-sp-holiday] .forumbg ul.topiclist li.header {
    background: linear-gradient(105deg, var(--sp-holiday-header), var(--sp-holiday-bg)) !important;
    border-color: var(--sp-holiday-edge) !important;
    color: #fff7e9 !important;
}
html[data-sp-holiday] .forabg .header a,
html[data-sp-holiday] .forumbg .header a,
html[data-sp-holiday] .forabg .header dt,
html[data-sp-holiday] .forumbg .header dt,
html[data-sp-holiday] .forabg .header dd,
html[data-sp-holiday] .forumbg .header dd { color: #fff7e9 !important; }
html[data-sp-holiday] a.forumtitle,
html[data-sp-holiday] a.topictitle,
html[data-sp-holiday] .navbar a { color: var(--sp-holiday-bright) !important; }
html[data-sp-holiday] a.forumtitle:hover,
html[data-sp-holiday] a.topictitle:hover { color: #fff !important; }
html[data-sp-holiday] ul.topiclist.forums > li.row {
    background: linear-gradient(95deg, var(--sp-holiday-soft), transparent 80%) !important;
}
html[data-sp-holiday] ul.topiclist.forums > li.row:hover {
    background: linear-gradient(95deg, var(--sp-holiday-soft), var(--sp-holiday-panel)) !important;
}
html[data-sp-holiday] .sp-holiday-banner {
    min-height: 108px;
    border-color: var(--sp-holiday-accent);
    background: linear-gradient(110deg, var(--sp-holiday-bg), var(--sp-holiday-header), #1b202b);
    box-shadow: 0 0 28px var(--sp-holiday-soft), inset 0 1px 0 rgba(255,255,255,.15);
    padding-top: 23px;
}
html[data-sp-holiday] .sp-holiday-copy strong { font-size: 16px; }
html[data-sp-holiday] .sp-holiday-art { flex-basis: 128px; height: 76px; }
html[data-sp-holiday] .sp-holiday-banner::before {
    content: "";
    position: absolute;
    left: 0; right: 0; top: 0;
    height: 12px;
    pointer-events: none;
    background: repeating-linear-gradient(110deg, var(--sp-holiday-accent) 0 20px,
        var(--sp-holiday-secondary) 20px 40px, transparent 40px 44px);
    opacity: .8;
}
html[data-sp-holiday="christmas"] .sp-holiday-banner::before {
    height: 18px;
    background:
        radial-gradient(circle at 12px 10px, #ffe89c 0 4px, transparent 6px),
        radial-gradient(circle at 42px 10px, #ff8c9c 0 4px, transparent 6px),
        radial-gradient(circle at 72px 10px, #a9ffe0 0 4px, transparent 6px),
        linear-gradient(transparent 3px, #91af95 4px 5px, transparent 6px);
    background-size: 90px 18px;
    opacity: 1;
}
html[data-sp-holiday="christmas"][data-sp-holiday-effects="1"] .sp-holiday-banner::before {
    animation: sp-holiday-lights 4s ease-in-out infinite;
}
@keyframes sp-holiday-lights { 0%, 100% { filter: brightness(.85); } 50% { filter: brightness(1.3); } }
/* All particles are decorative, sparse and never intercept clicks or scrolling. */
html[data-sp-holiday] #sp-holiday-decor {
    position: fixed;
    inset: 0;
    z-index: 40;
    overflow: hidden;
    pointer-events: none !important;
    user-select: none;
    contain: strict;
}
html[data-sp-holiday] #sp-holiday-decor * { pointer-events: none !important; }
html[data-sp-holiday] .sp-holiday-snow {
    position: absolute;
    top: -30px;
    left: var(--sp-x);
    font-size: var(--sp-size);
    line-height: 1;
    color: #eaffff;
    opacity: .65;
    animation: sp-holiday-snow var(--sp-duration) linear var(--sp-delay) infinite;
}
@keyframes sp-holiday-snow {
    from { transform: translate3d(0, -30px, 0) rotate(0deg); }
    to { transform: translate3d(30px, calc(100vh + 50px), 0) rotate(180deg); }
}
html[data-sp-holiday] .sp-holiday-bat {
    position: absolute;
    left: -60px;
    top: var(--sp-y);
    width: var(--sp-size);
    height: calc(var(--sp-size) * .55);
    background: url("bat.svg") center / contain no-repeat;
    opacity: 0;
    animation: sp-holiday-bat var(--sp-duration) linear var(--sp-delay) infinite;
}
@keyframes sp-holiday-bat {
    0% { transform: translate3d(0, 0, 0) rotate(-8deg); opacity: 0; }
    10%, 75% { opacity: .6; }
    45% { transform: translate3d(50vw, -28px, 0) rotate(9deg); }
    100% { transform: translate3d(calc(100vw + 90px), 15px, 0) rotate(-8deg); opacity: 0; }
}
html[data-sp-holiday] .sp-holiday-firework {
    position: absolute;
    left: var(--sp-x);
    top: var(--sp-y);
    width: 1px; height: 1px;
}
html[data-sp-holiday] .sp-holiday-firework i {
    position: absolute;
    width: 3px;
    height: 11px;
    border-radius: 3px;
    background: var(--sp-holiday-bright);
    box-shadow: 0 0 5px var(--sp-holiday-accent);
    opacity: 0;
    animation: sp-holiday-firework var(--sp-duration) ease-out var(--sp-delay) infinite;
}
html[data-sp-holiday] .sp-holiday-firework i:nth-child(2n) { background: var(--sp-holiday-secondary); }
@keyframes sp-holiday-firework {
    0%, 8% { opacity: 0; transform: rotate(var(--sp-angle)) translateY(0) scale(.3); }
    12% { opacity: .75; }
    25% { opacity: 0; transform: rotate(var(--sp-angle)) translateY(-65px) scale(.6); }
    100% { opacity: 0; transform: rotate(var(--sp-angle)) translateY(-65px) scale(.6); }
}
html[data-sp-holiday-paused] #sp-holiday-decor *,
html[data-sp-holiday-paused] .sp-holiday-icon,
html[data-sp-holiday-paused] .sp-holiday-banner::before { animation-play-state: paused !important; }
@media (max-width: 600px) {
    html[data-sp-holiday] .sp-holiday-banner { padding: 22px 12px 12px; min-height: 92px; }
    html[data-sp-holiday] .sp-holiday-art { flex-basis: 62px; height: 50px; }
    html[data-sp-holiday] .sp-holiday-copy strong { font-size: 12px; }
    html[data-sp-holiday] .sp-holiday-snow:nth-child(n+13),
    html[data-sp-holiday] .sp-holiday-bat:nth-child(n+5),
    html[data-sp-holiday] .sp-holiday-firework:nth-child(n+4) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    html[data-sp-holiday] #sp-holiday-decor { display: none; }
    html[data-sp-holiday] .sp-holiday-banner::before,
    html[data-sp-holiday] .sp-holiday-icon { animation: none !important; }
}
@media print {
    html[data-sp-holiday] #sp-holiday-decor { display: none; }
}

/* Separate Trivia/Chat interface: colour changes without changing viewport layout. */
html[data-sp-holiday] .chat-app .topbar {
    background: linear-gradient(105deg, var(--sp-holiday-header), var(--sp-holiday-panel)) !important;
    border-bottom-color: var(--sp-holiday-accent) !important;
}
html[data-sp-holiday] .chat-app .brand-title { color: #fff7e9; }
html[data-sp-holiday] .chat-app .brand-subtitle { color: #dfdce5; }
html[data-sp-holiday] .sp-holiday-chat-badge { color: var(--sp-holiday-bright); font-weight: 700; white-space: nowrap; }
html[data-sp-holiday] .chat-app .rooms-panel,
html[data-sp-holiday] .chat-app .users-panel {
    background: linear-gradient(180deg, var(--sp-holiday-panel), #191d26);
    border-color: var(--sp-holiday-edge);
}
html[data-sp-holiday] .chat-app .panel-title { color: var(--sp-holiday-bright); }
html[data-sp-holiday] .chat-app .chat-header {
    background: linear-gradient(110deg, var(--sp-holiday-bg), #222733);
    border-bottom-color: var(--sp-holiday-edge);
}
html[data-sp-holiday] .chat-app .chat-header h2 { color: var(--sp-holiday-bright); }
html[data-sp-holiday] .chat-app .chat-panel {
    background: linear-gradient(165deg, var(--sp-holiday-panel), #141820 60%);
}
html[data-sp-holiday] .chat-app .room.active {
    background: var(--sp-holiday-soft);
    box-shadow: inset 3px 0 0 var(--sp-holiday-accent);
}
html[data-sp-holiday] .chat-app .room.active span { color: var(--sp-holiday-bright); }
html[data-sp-holiday] .chat-app .message-form {
    background: var(--sp-holiday-panel);
    border-top-color: var(--sp-holiday-edge);
}
html[data-sp-holiday] .chat-app #messageInput { border-color: var(--sp-holiday-edge); }
html[data-sp-holiday] .chat-app #messageInput:focus {
    border-color: var(--sp-holiday-accent);
    box-shadow: 0 0 0 2px var(--sp-holiday-soft);
}
html[data-sp-holiday] .chat-app .message-form button {
    background: var(--sp-holiday-accent);
    color: #131720;
}
html[data-sp-holiday] #loginScreen .login-card {
    background: linear-gradient(145deg, var(--sp-holiday-bg), #1b1f27);
    border-color: var(--sp-holiday-edge);
    box-shadow: 0 0 35px var(--sp-holiday-soft);
}
html[data-sp-holiday] #loginScreen .forum-login-button {
    background: var(--sp-holiday-accent);
    color: #131720;
}
/* Stoker's forum chat. Message contents and member colour choices are untouched. */
html[data-sp-holiday] #stoker-chat {
    border-color: var(--sp-holiday-edge) !important;
    background: linear-gradient(140deg, var(--sp-holiday-panel), #1b1f27) !important;
}
html[data-sp-holiday] #stoker-chat .stoker-chat-messages {
    background: linear-gradient(135deg, var(--sp-holiday-panel), #191d26) !important;
}
html[data-sp-holiday] #stoker-chat .stoker-chat-title,
html[data-sp-holiday] #stoker-chat .stoker-chat-title a,
html[data-sp-holiday] #stoker-chat .stoker-chat-title i.fa { color: #fff7e9 !important; }
html[data-sp-holiday] #stoker-chat .stoker-chat-input { border-top-color: var(--sp-holiday-edge); }
html[data-sp-holiday] #stoker-chat #stoker-chat-text {
    background-color: #141820;
    border-color: var(--sp-holiday-edge) !important;
    color: #f4f6f8;
}
html[data-sp-holiday] #stoker-chat #stoker-chat-text:focus {
    border-color: var(--sp-holiday-accent) !important;
    box-shadow: 0 0 0 2px var(--sp-holiday-soft);
}
html[data-sp-holiday] #stoker-chat #stoker-chat-send {
    background: var(--sp-holiday-accent) !important;
    border-color: var(--sp-holiday-accent) !important;
    color: #131720 !important;
}
html[data-sp-holiday] #stoker-chat #stoker-chat-emoji-btn {
    color: var(--sp-holiday-bright);
    border-color: var(--sp-holiday-edge);
}