/* ===== Halloween ===== */
html[data-season="halloween"] {
--primary: #ea580c;
--secondary: #7c3aed;
--accent: #f97316;
--season-accent-strong: #f97316;
--season-hero-bg:
radial-gradient(circle at 88% 8%, rgba(254, 243, 199, 0.18), transparent 32%),
radial-gradient(ellipse at 20% 110%, rgba(234, 88, 12, 0.45), transparent 55%),
linear-gradient(160deg, #1e1b2e 0%, #2e1065 55%, #3b0764 100%);
--season-hero-shadow: 0 30px 60px -30px rgba(46, 16, 101, 0.6);
--season-hero-title: #fff7ed;
--season-hero-text: rgba(254, 215, 170, 0.85);
--season-form-shadow: 0 20px 40px -16px rgba(0, 0, 0, 0.55);
--season-submit-bg: linear-gradient(135deg, #ea580c, #c2410c);
--season-submit-hover: linear-gradient(135deg, #c2410c, #9a3412);
--season-focus-ring: rgba(249, 115, 22, 0.35);
--season-pill-bg: rgba(255, 255, 255, 0.08);
--season-pill-border: rgba(255, 255, 255, 0.18);
--season-pill-fg: #fed7aa;
--season-pill-hover-bg: rgba(249, 115, 22, 0.2);
--season-pill-hover-border: #f97316;
--season-badge-bg: rgba(249, 115, 22, 0.16);
--season-badge-border: rgba(249, 115, 22, 0.45);
--season-badge-fg: #fdba74;
--season-cta-bg: #f97316;
--season-cta-hover-bg: #fb923c;
--season-cta-fg: #1c1917;
--season-bat: #0c0a12;
--season-chip-bg: #1c1917;
--season-chip-hover-bg: #292524;
--season-chip-border: #ea580c;
--season-chip-fg: #fb923c;
--season-selection-bg: #f97316;
--season-selection-fg: #1c1917;
--season-scrollbar: rgba(234, 88, 12, 0.55);
--season-scrollbar-hover: #ea580c;
--season-card-hover-border: rgba(234, 88, 12, 0.5);
--season-card-hover-glow: rgba(234, 88, 12, 0.35);
--map-pin: #7c3aed;
--map-pin-detail: #ea580c;
--season-section-bg:
radial-gradient(ellipse at 50% 125%, rgba(220, 38, 38, 0.38), transparent 60%),
radial-gradient(ellipse at 0% 0%, rgba(234, 88, 12, 0.16), transparent 45%),
linear-gradient(180deg, #0a0708 0%, #140a08 60%, #1f0b06 100%);
--season-card-shadow: 0 18px 36px -16px rgba(0, 0, 0, 0.75);
}
html[data-season="halloween"] .season-section {
--season-hero-title: #fff4ec;
--season-hero-text: rgba(253, 186, 116, 0.8);
--season-badge-bg: rgba(220, 38, 38, 0.14);
--season-badge-border: rgba(239, 68, 68, 0.45);
--season-badge-fg: #fb923c;
--season-link: #f97316;
--season-hero-shadow: 0 30px 60px -30px rgba(127, 29, 29, 0.55);
}
html[data-season="halloween"] .season-section-panel {
border: 1px solid rgba(234, 88, 12, 0.22);
padding-top: 84px;
}
html[data-season="halloween"] .season-section-title {
text-shadow: 0 0 28px rgba(234, 88, 12, 0.45);
}
html[data-season="halloween"] .season-section-web {
position: absolute;
top: 0;
right: 0;
width: 120px;
color: rgba(255, 237, 213, 0.14);
transform: scaleX(-1);
}
html[data-season="halloween"] .season-section-embers {
position: absolute;
inset: 0;
opacity: 0.7;
background-image:
radial-gradient(2px 2px at 8% 70%, rgba(249, 115, 22, 0.9), transparent),
radial-gradient(1.5px 1.5px at 22% 30%, rgba(239, 68, 68, 0.8), transparent),
radial-gradient(2px 2px at 41% 85%, rgba(251, 146, 60, 0.8), transparent),
radial-gradient(1.5px 1.5px at 57% 50%, rgba(239, 68, 68, 0.7), transparent),
radial-gradient(2px 2px at 74% 20%, rgba(249, 115, 22, 0.8), transparent),
radial-gradient(1.5px 1.5px at 90% 65%, rgba(251, 146, 60, 0.9), transparent);
background-size: 100% 420px;
animation: season-embers 18s linear infinite;
}
@keyframes season-embers {
from { background-position: 0 0; }
to { background-position: 0 -420px; }
}
html[data-season="halloween"] .season-stars {
position: absolute;
inset: 0;
opacity: 0.55;
background-image:
radial-gradient(1.5px 1.5px at 12% 22%, #fff, transparent),
radial-gradient(1px 1px at 28% 68%, #fff, transparent),
radial-gradient(1.5px 1.5px at 46% 14%, #fff, transparent),
radial-gradient(1px 1px at 58% 44%, #fff, transparent),
radial-gradient(1px 1px at 71% 80%, #fff, transparent),
radial-gradient(1.5px 1.5px at 84% 36%, #fff, transparent),
radial-gradient(1px 1px at 93% 62%, #fff, transparent),
radial-gradient(1px 1px at 36% 90%, #fff, transparent);
animation: season-twinkle 5s ease-in-out infinite alternate;
}
@keyframes season-twinkle {
from { opacity: 0.35; }
to { opacity: 0.7; }
}
html[data-season="halloween"] .season-moon {
position: absolute;
top: -34px;
right: -34px;
width: 150px;
filter: drop-shadow(0 0 28px rgba(254, 243, 199, 0.55));
}
html[data-season="halloween"] .season-web {
position: absolute;
top: 0;
left: 0;
width: 130px;
color: rgba(255, 255, 255, 0.28);
}
html[data-season="halloween"] .season-spider {
position: absolute;
top: 0;
left: 132px;
width: 16px;
color: rgba(255, 255, 255, 0.35);
transform-origin: 50% 0;
animation: season-spider-drop 7s ease-in-out infinite;
}
html[data-season="halloween"] .season-spider svg { width: 100%; height: auto; }
@keyframes season-spider-drop {
0%, 100% { transform: translateY(-18px) rotate(2deg); }
50% { transform: translateY(8px) rotate(-3deg); }
}
html[data-season="halloween"] .season-pumpkins {
position: absolute;
left: 40px;
bottom: 8px;
width: 150px;
}
html[data-season="halloween"] .season-pumpkin-face {
animation: season-flicker 3.2s ease-in-out infinite;
}
@keyframes season-flicker {
0%, 100% { opacity: 1; }
40% { opacity: 0.75; }
45% { opacity: 1; }
70% { opacity: 0.85; }
}
@media (max-width: 1023px) {
html[data-season="halloween"] .season-pumpkins { left: auto; right: 24px; }
}
@media (max-width: 768px) {
html[data-season="halloween"] .season-moon { width: 96px; top: -26px; right: -26px; }
html[data-season="halloween"] .season-web { width: 80px; }
html[data-season="halloween"] .season-spider { display: none; }
html[data-season="halloween"] .season-pumpkins { width: 96px; right: 16px; bottom: 6px; }
html[data-season="halloween"] .season-section-web { width: 72px; }
html[data-season="halloween"] .season-section-panel { padding-top: 72px; }
}
html[data-season="halloween"] .map-pin--season {
background-image: url('../../../icons/seasons/halloween.svg');
}
html[data-season="halloween"] .empty-icon::before,
html[data-season="halloween"] .saved-empty-icon::before,
html[data-season="halloween"] #emptyState::before {
background-image: url('../../../icons/seasons/halloween-ghost.svg');
}