/* Saison-Effekte und Anlässe (seasons.js): Bühne über der Startseite, nimmt nur Klicks auf eigene Knöpfe */

.content { position: relative; }
.season-stage { position: absolute; inset: 0; z-index: 5; overflow: hidden; pointer-events: none; }
.season-canvas { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; } /* nie Klicks abfangen (Schnee liegt über den Kacheln) */
.season-canvas--fixed { position: fixed; }

/* Hinweiskarte */
.season-note { position: absolute; left: 50%; top: 4px; z-index: 3; display: flex; align-items: center; gap: 12px; max-width: min(620px, calc(100% - 24px));
  padding: 12px 14px 12px 18px; border-radius: 16px; background: var(--hub-card, #151a11); border: 1px solid var(--hub-line, rgba(255,255,255,.1)); color: var(--ink, #fff);
  box-shadow: 0 12px 32px -12px rgba(0, 0, 0, .35); font-size: 14px; font-weight: 600; line-height: 1.45; pointer-events: auto;
  opacity: 0; transform: translate(-50%, -10px); transition: opacity .35s, transform .35s; }
.season-note.is-in { opacity: 1; transform: translate(-50%, 0); }
.season-note__text { flex: 1; min-width: 0; }
.season-note__sub { font-size: 12.5px; font-weight: 500; color: var(--muted, #a4ab9d); }
.season-note__btn { flex: none; font: inherit; font-size: 12px; font-weight: 800; padding: 7px 14px; border-radius: 999px; border: 0; background: #82be28; color: #000; cursor: pointer; }
.season-note__x { flex: none; width: 28px; height: 28px; border-radius: 50%; border: 0; background: none; color: inherit; opacity: .55; font-size: 20px; line-height: 1; cursor: pointer; }
.season-note__x:hover { opacity: 1; }

/* Hüpfende Figuren */
.season-pk { position: absolute; left: 0; top: 0; will-change: transform; transition: opacity .8s; }
.season-pk svg { display: block; width: 100%; height: 100%; overflow: visible; transform-origin: 50% 100%; }
.season-pk.is-land svg { animation: season-land .28s ease-out; }
.season-pk.is-hit svg { animation: season-hit .4s ease-out; }
.season-pk.is-out { opacity: 0; }
@keyframes season-land { 0% { transform: scale(1.18, .8); } 100% { transform: none; } }
@keyframes season-hit { 0%, 100% { transform: none; } 40% { transform: rotate(14deg) translateX(4px); } }

/* Halloween: Spinnweben oben rechts im sichtbaren Bereich (fest, unter der Pfadleiste) */
.season-webs { position: fixed; z-index: 4; pointer-events: none; overflow: hidden; color: rgba(255, 255, 255, .32); }
body:not(.theme-dark) .season-webs { color: rgba(33, 33, 33, .28); }
.season-threads { position: absolute; left: 0; top: 0; overflow: visible; }
.season-threads line { stroke: currentColor; stroke-width: 1; }
.season-web { position: absolute; line-height: 0; }
.season-web svg { display: block; }
.season-web--tr { right: 0; top: 0; transform: scaleX(-1); }
.season-web.is-shake svg { animation: season-web-shake .6s ease-out; }
@keyframes season-web-shake { 0%, 100% { transform: none; } 20% { transform: translate(2px, 3px) rotate(1deg); } 45% { transform: translate(-2px, -1px) rotate(-1deg); } 70% { transform: translate(1px, 1px); } }
.season-spider { position: absolute; left: -17px; top: -15px; width: 34px; height: 30px; will-change: transform; }
.season-spider svg { width: 100%; height: 100%; display: block; transition: transform .1s; filter: drop-shadow(0 0 1.5px rgba(255, 255, 255, .55)); }
body:not(.theme-dark) .season-spider svg { filter: none; }
.season-spider.is-bite svg { transform: scale(1.25); }
html.season-nocursor, html.season-nocursor * { cursor: none !important; }
.season-caught { position: absolute; width: 16px; height: 22px; animation: season-struggle .18s ease-in-out infinite alternate; transition: opacity .8s; }
.season-caught svg { width: 100%; height: 100%; display: block; }
.season-caught.is-wrapped { animation: none; }
.season-caught.is-wrapped::after { content: ""; position: absolute; inset: -4px -5px; border-radius: 45%; background: repeating-linear-gradient(35deg, rgba(240, 240, 240, .95) 0 3px, rgba(200, 200, 200, .9) 3px 5px); animation: season-wrap .9s ease-out both; }
.season-caught.is-out { opacity: 0; }
@keyframes season-struggle { from { transform: rotate(-12deg) translate(-1px, 0); } to { transform: rotate(10deg) translate(1px, -1px); } }
@keyframes season-wrap { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }

/* Silvester (nur 31.12.): abgedunkelter Hintergrund, Zählwerk, Gruß, Countdown, Rückblick */
.season-canvas { z-index: 2; }
.nye, .nye__dim { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; pointer-events: none; }
.nye { z-index: 3; color: #fff; }
.nye__dim { z-index: 1; background: rgba(6, 8, 6, .78); opacity: 0; transition: opacity 1s; }
.nye__box { position: absolute; left: 50%; top: 50%; width: min(980px, calc(100% - 48px)); transform: translate(-50%, -50%); text-align: center; opacity: 0; transition: opacity .8s; }
.nye__dim.is-in { opacity: 1; }
.nye.is-in .nye__box { opacity: 1; }
.nye__year { display: inline-flex; font-size: clamp(72px, 13vw, 200px); font-weight: 900; line-height: .9; letter-spacing: -.06em; color: #82be28; }
.nye__d, .nye__roll { display: inline-block; height: .9em; }
.nye__roll { overflow: hidden; }
.nye__col { display: flex; flex-direction: column; transition: transform .75s cubic-bezier(.6, -.35, .3, 1.35); }
.nye__col span { height: .9em; }
.nye.is-rolled .nye__col { transform: translateY(-50%); }
.nye.is-rolled .nye__year { animation: nye-pop .5s .55s ease-out; }
@keyframes nye-pop { 40% { transform: scale(1.06); } }
.nye__title { margin-top: 14px; font-size: clamp(34px, 5.6vw, 86px); font-weight: 900; line-height: .95; letter-spacing: -.045em; text-transform: uppercase; }
.nye__title em { font-style: normal; color: #82be28; }
.nye__w { display: inline-block; opacity: 0; transform: translateY(.35em); }
.nye.is-words .nye__w { animation: greet-in .55s cubic-bezier(.2, .7, .2, 1) forwards; animation-delay: calc(var(--i) * 140ms); }
.nye__count { margin-top: 18px; font-size: clamp(15px, 1.4vw, 20px); font-weight: 600; color: #cfd3cb; opacity: 0; transition: opacity .6s; font-variant-numeric: tabular-nums; }
.nye__count b { color: #fff; font-weight: 800; }
.nye.is-count .nye__count { opacity: 1; }
.nye__tiles { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 30px; }
.nye__label { flex-basis: 100%; font-size: 11px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; color: #82be28; opacity: 0; transition: opacity .6s; }
.nye__tile { min-width: 190px; padding: 18px 22px 16px; border-radius: 20px; background: #151a11; border: 1px solid rgba(255, 255, 255, .08); text-align: left;
  opacity: 0; transform: translateY(14px); transition: opacity .6s, transform .6s cubic-bezier(.2, .8, .3, 1); }
.nye__tile:nth-child(3) { transition-delay: .12s; } .nye__tile:nth-child(4) { transition-delay: .24s; }
.nye.is-tiles .nye__tile, .nye.is-tiles .nye__label { opacity: 1; transform: none; }
.nye__num { display: block; font-size: clamp(24px, 2.6vw, 36px); font-weight: 800; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.nye__l { display: block; margin-top: 8px; font-size: 13px; font-weight: 600; color: #a4ab9d; }

/* Weihnachten: Schlitten am Himmel (fest über dem sichtbaren Bereich), Päckchen fallen nach unten */
.season-sky { position: fixed; z-index: 3; overflow: hidden; pointer-events: none; }
.season-sleigh { position: absolute; left: 0; top: 0; padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; will-change: transform; }
.season-sleigh__art { display: block; filter: drop-shadow(0 6px 8px rgba(0, 0, 0, .3)); }
.season-sleigh__frames { display: block; aspect-ratio: 600 / 297; background: var(--sheet) 0 0 / 1200% 100% no-repeat; }
.season-sleigh:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(130, 190, 40, .45); border-radius: 12px; }
.season-sleigh::after { content: "Ho ho ho!"; position: absolute; left: 6%; top: -6%; padding: 3px 10px; border-radius: 999px; background: #fff; color: #c8372d;
  font: 800 12px/1.4 var(--font, sans-serif); white-space: nowrap; opacity: 0; transition: opacity .2s; }
.season-sleigh.is-ho-text::after { opacity: 1; }
.season-sleigh.is-left::after { left: auto; right: 6%; }
.season-sleigh.is-ho .season-sleigh__frames { animation: season-ho .5s ease-out; }
@keyframes season-ho { 30% { transform: translateY(-6px) rotate(-3deg); } 60% { transform: translateY(2px) rotate(2deg); } }
.season-gift { position: absolute; left: 0; top: 0; width: 34px; height: 34px; padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; transition: opacity .8s; }
.season-gift:hover svg { transform: scale(1.15); }
.season-gift svg { transition: transform .15s; }
.season-gift:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(130, 190, 40, .45); border-radius: 6px; }
.season-gift.is-open svg { transform: scale(1.8); opacity: 0; transition: transform .4s, opacity .4s; }
.season-gift svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .3)); }
.season-gift.is-out { opacity: 0; }

/* Weihnachten: großer Gruß mitten im Bild */
.season-xmas { position: fixed; z-index: 2; top: 0; left: 0; width: 100vw; height: 100vh; display: grid; place-content: center; text-align: center; pointer-events: none; padding: 0 24px; }
.season-xmas__title { font-size: clamp(34px, 6vw, 92px); font-weight: 900; line-height: .95; letter-spacing: -.045em; text-transform: uppercase; color: #fff;
  text-shadow: 0 3px 30px rgba(0, 0, 0, .75), 0 1px 4px rgba(0, 0, 0, .5); }
.season-xmas__title em { font-style: normal; color: #82be28; }
.season-xmas.is-in .nye__w { animation: greet-in .55s cubic-bezier(.2, .7, .2, 1) forwards; animation-delay: calc(var(--i) * 160ms); }
.season-xmas__hint { margin-top: 16px; font-size: clamp(14px, 1.4vw, 19px); font-weight: 600; color: #e6e9e2; text-shadow: 0 2px 14px rgba(0, 0, 0, .8); opacity: 0; transition: opacity .6s .6s; }
.season-xmas.is-in .season-xmas__hint { opacity: 1; }
.season-xmas { transition: opacity .8s; }
.season-xmas.is-out { opacity: 0; }
body:not(.theme-dark) .season-xmas__title { color: #212121; text-shadow: 0 2px 24px rgba(255, 255, 255, .95); }
body:not(.theme-dark) .season-xmas__hint { color: #3a3a3a; text-shadow: 0 1px 10px rgba(255, 255, 255, .95); }

/* Nikolaus: Stiefel unten in der Mitte, Süßigkeiten und Schoko-Nikolaus fliegen heraus */
.season-boot { position: absolute; padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; transform-origin: 50% 100%;
  animation: season-boot-in .7s cubic-bezier(.3, 1.5, .5, 1) both, season-wiggle 2.6s 1s ease-in-out infinite; }
.season-boot img { width: 100%; height: auto; display: block; user-select: none; filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .35)); }
.season-boot:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(130, 190, 40, .45); border-radius: 16px; }
.season-boot.is-pop img { animation: season-boot-pop .45s ease-out; }
@keyframes season-boot-in { from { transform: translateY(120%) scale(.8); } to { transform: none; } }
@keyframes season-wiggle { 0%, 80%, 100% { transform: rotate(0); } 85% { transform: rotate(-6deg); } 90% { transform: rotate(5deg); } 95% { transform: rotate(-3deg); } }
@keyframes season-boot-pop { 30% { transform: scale(1.12, .86); } 60% { transform: scale(.95, 1.08); } }
.season-sweet, .season-schoko { position: absolute; left: 0; top: 0; background-repeat: no-repeat; filter: drop-shadow(0 3px 3px rgba(0, 0, 0, .35)); transition: opacity .8s; will-change: transform; }
.season-schoko { background-size: contain; background-position: center bottom; }
.season-sweet.is-out, .season-schoko.is-out { opacity: 0; }

.season-hat { position: absolute; left: 50%; bottom: 72%; margin-left: -26px; pointer-events: none; width: 52px; height: 32px; transform-origin: 50% 100%; animation: season-hat .6s cubic-bezier(.3, 1.6, .5, 1) both, season-hat-wobble 2.2s .8s ease-in-out infinite; transition: opacity .8s; }
.season-hat svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .35)); }
.season-hat.is-out { opacity: 0; }
@keyframes season-hat { from { transform: translateY(-40px) rotate(-20deg); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes season-hat-wobble { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-6deg); } 75% { transform: rotate(6deg); } }
/* Fasent: Offenburger Hexe hüpft über die Kacheln (Klassen heißen weiter season-narr/narr__*) */
.season-narr { position: absolute; left: 0; top: 0; padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; will-change: transform; transition: opacity .8s; }
.season-narr__art { display: block; }
.season-narr svg { width: 100%; height: auto; display: block; overflow: visible; filter: drop-shadow(0 6px 6px rgba(0, 0, 0, .35)); transform-origin: 50% 100%; }
.season-narr.is-land svg { animation: season-land .28s ease-out; }
.season-narr .narr__arm--l { transform-origin: 34px 70px; } .season-narr .narr__arm--r { transform-origin: 66px 70px; }
.season-narr .narr__leg--l { transform-origin: 40px 104px; } .season-narr .narr__leg--r { transform-origin: 58px 104px; }
.season-narr.is-dance .narr__arm--l { animation: narr-arm .45s ease-in-out infinite alternate; }
.season-narr.is-dance .narr__arm--r { animation: narr-arm .45s ease-in-out infinite alternate-reverse; }
.season-narr.is-dance .narr__leg--l { animation: narr-leg .45s ease-in-out infinite alternate; }
.season-narr.is-dance .narr__leg--r { animation: narr-leg .45s ease-in-out infinite alternate-reverse; }
.season-narr .narr__bell { animation: narr-bell .3s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: center; }
@keyframes narr-arm { from { transform: rotate(-22deg); } to { transform: rotate(18deg); } }
@keyframes narr-leg { from { transform: rotate(-10deg); } to { transform: rotate(8deg); } }
@keyframes narr-bell { from { transform: scale(1); } to { transform: scale(1.18); } }
.season-narr.is-out { opacity: 0; }
.season-narr:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(130, 190, 40, .45); border-radius: 12px; }

/* Valentinstag: Amor schwebt, Pfeil fliegt auf das eigene Foto, Lottie-Herzen */
.season-amor { position: absolute; left: 0; top: 0; padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; will-change: transform; }
.season-amor img { width: 100%; height: auto; display: block; user-select: none; filter: drop-shadow(0 0 1px rgba(255, 255, 255, .5)) drop-shadow(0 8px 10px rgba(0, 0, 0, .35)); }
.season-amor.is-shot img { animation: amor-recoil .4s ease-out; }
@keyframes amor-recoil { 30% { transform: translateX(10px) rotate(4deg); } }
.season-amor:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(130, 190, 40, .45); border-radius: 16px; }
.season-arrow { position: fixed; left: 0; top: 0; z-index: 8; width: 120px; height: 30px; pointer-events: none; will-change: transform; transition: opacity .5s; }
.season-arrow svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .4)); }
.season-arrow.is-hit { opacity: 0; }
.season-lottie { position: fixed; z-index: 7; pointer-events: none; transition: opacity .5s; }
.season-lottie--big { z-index: 1; opacity: .9; }
.season-lottie.is-out { opacity: 0; }
.season-hit { animation: season-hit-pulse 1.1s ease-out; box-shadow: 0 0 0 0 rgba(232, 57, 46, .7); }
@keyframes season-hit-pulse { 0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(232, 57, 46, .7); } 25% { transform: scale(1.25); } 100% { transform: scale(1); box-shadow: 0 0 0 18px rgba(232, 57, 46, 0); } }

/* 1. April: falsche Systemmeldung, Aprilfisch */
.season-april { position: fixed; z-index: 9; top: 0; height: 100vh; display: grid; place-items: center; padding: 24px; pointer-events: none; }
.season-april__card { pointer-events: auto; width: min(460px, 100%); padding: 26px 28px 22px; border-radius: 24px; background: var(--hub-card, #151a11); border: 1px solid var(--hub-line, rgba(255,255,255,.1));
  color: var(--ink, #fff); box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .6); opacity: 0; transform: translateY(16px) scale(.97); transition: opacity .35s, transform .35s cubic-bezier(.2, .8, .3, 1); }
.season-april.is-in .season-april__card { opacity: 1; transform: none; }
.season-april__badge { display: inline-block; padding: 3px 10px; border-radius: 999px; background: rgba(130, 190, 40, .16); color: #82be28; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.season-april__title { margin-top: 12px; font-size: 24px; font-weight: 900; line-height: 1.05; letter-spacing: -.035em; text-transform: uppercase; }
.season-april__text { margin: 10px 0 18px; font-size: 14px; line-height: 1.55; color: var(--muted, #a4ab9d); }
.season-april__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.season-april__go, .season-april__later { font: inherit; font-size: 13px; font-weight: 800; padding: 10px 18px; border-radius: 999px; cursor: pointer; }
.season-april__go { border: 0; background: #82be28; color: #000; }
.season-april__go:hover { background: #95d238; }
.season-april__later { border: 1px solid var(--hub-line, rgba(255,255,255,.2)); background: none; color: inherit; }
.season-fish { position: absolute; left: 0; top: 0; will-change: transform; }
.season-fish img { width: 100%; height: auto; display: block; user-select: none; animation: fish-wiggle .5s ease-in-out infinite alternate; transform-origin: 70% 50%; filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .35)); }
@keyframes fish-wiggle { from { transform: skewY(-3deg) scaleX(.97); } to { transform: skewY(3deg) scaleX(1.02); } }
.season-bubble { position: absolute; border-radius: 50%; border: 2px solid rgba(160, 220, 255, .75); background: rgba(160, 220, 255, .15); animation: bubble-up 1.8s ease-out forwards; }
@keyframes bubble-up { to { transform: translate(14px, -90px); opacity: 0; } }

/* Ostern */
.season-egg { position: absolute; width: 32px; height: 40px; padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; transform: rotate(var(--tilt)); transition: transform .2s, opacity .5s; animation: season-egg-in .45s cubic-bezier(.3, 1.6, .5, 1) both; }
.season-egg:hover { transform: rotate(0) scale(1.18); }
.egg__part { position: absolute; inset: 0; transition: transform .5s cubic-bezier(.3, 1.4, .5, 1), opacity .5s; }
.egg__part svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .25)); }
.egg__top { clip-path: polygon(0 0, 100% 0, 100% 50%, 87% 42%, 75% 52%, 62% 42%, 50% 52%, 37% 42%, 25% 52%, 12% 42%, 0 50%); }
.egg__bot { clip-path: polygon(0 50%, 12% 42%, 25% 52%, 37% 42%, 50% 52%, 62% 42%, 75% 52%, 87% 42%, 100% 50%, 100% 100%, 0 100%); }
.season-egg.is-open, .season-egg.is-open:hover { transform: none; cursor: default; }
.season-egg.is-open .egg__top { transform: translate(14px, -30px) rotate(38deg); opacity: 0; transition-duration: .7s, .9s; }
.egg__chick { position: absolute; left: 50%; bottom: 8px; margin-left: -42px; pointer-events: none; animation: season-chick .6s .1s cubic-bezier(.3, 1.5, .5, 1) both; }
.season-egg.is-gone { opacity: 0; transform: translateY(-12px); }
@keyframes season-egg-in { from { transform: rotate(var(--tilt)) translateY(-18px) scale(.3); opacity: 0; } }
@keyframes season-chick { from { transform: translateY(38px) scale(.5); } }
.season-bunny { position: absolute; left: 0; top: 0; z-index: 2; pointer-events: none; will-change: transform; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .22)); }
.season-bunny > svg { display: block; }
.season-bunny.is-land { animation: season-land .28s ease-out; }
@keyframes season-land { 40% { scale: 1.06 .92; } }
.season-eggbar { position: fixed; bottom: 18px; z-index: 6; display: flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: var(--hub-card, #151a11); border: 1px solid var(--hub-line, rgba(255,255,255,.1)); color: var(--ink, #fff); box-shadow: 0 12px 32px -12px rgba(0, 0, 0, .35); font-weight: 700; font-size: 13px; transform: translate(-50%, 90px); opacity: 0; transition: transform .5s cubic-bezier(.3, 1.4, .5, 1), opacity .4s; }
.season-eggbar.is-in { transform: translate(-50%, 0); opacity: 1; }
.eggbar__label { text-transform: uppercase; letter-spacing: .04em; font-size: 11px; opacity: .7; margin-right: 2px; }
.eggbar__egg { width: 18px; height: 23px; display: block; filter: grayscale(1); opacity: .3; transition: filter .3s, opacity .3s; }
.eggbar__egg svg { width: 100%; height: 100%; display: block; }
.eggbar__egg.is-on { filter: none; opacity: 1; animation: season-pop .5s cubic-bezier(.3, 1.8, .5, 1); }
.eggbar__n { min-width: 34px; text-align: right; font-variant-numeric: tabular-nums; }
@keyframes season-pop { 50% { transform: scale(1.5) rotate(-10deg); } }

/* Sommer */
.season-sun { position: absolute; left: 0; top: 0; padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; will-change: transform; filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .25)); }
.season-sun > svg { width: 100%; height: 100%; display: block; overflow: visible; }
.sun__rays { transform-origin: 80px 80px; animation: season-spin 16s linear infinite; }
.sun__shades { position: absolute; left: 25%; top: 38%; width: 50%; height: 17%; animation: sun-shades .7s 1.6s cubic-bezier(.3, 1.5, .5, 1) both; }
.sun__shades svg { width: 100%; height: 100%; display: block; }
.season-sun:hover .sun__shades { transform: translateY(-14%); transition: transform .2s; }
.season-sun.is-clicked { cursor: default; }
.season-sun.is-clicked .sun__eyes { transform-origin: 80px 74px; animation: sun-blink .5s .1s; }
.season-sun:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(130, 190, 40, .45); border-radius: 50%; }
@keyframes sun-shades { from { transform: translateY(-260%) rotate(-12deg); opacity: 0; } 60% { opacity: 1; } }
@keyframes sun-blink { 50% { transform: scaleY(.1); } }
.season-shades-fly { position: fixed; z-index: 8; pointer-events: none; will-change: transform; }
.season-shades-fly svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 3px 4px rgba(0, 0, 0, .3)); }
.season-beachball { position: absolute; left: 0; top: 0; padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; will-change: transform; transition: opacity .8s; border-radius: 50%; }
.season-beachball::before { content: ""; position: absolute; inset: -18px; border-radius: 50%; } /* größere Trefferfläche */
.season-beachball:hover { filter: brightness(1.08); }
.season-beachball svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 4px 4px rgba(0, 0, 0, .25)); }
.season-beachball.is-out { opacity: 0; }
.season-ice { position: absolute; pointer-events: none; animation: ice-drop .55s cubic-bezier(.4, 0, .6, 1.4) both; transition: opacity .8s, transform .8s; }
.season-ice svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .2)); }
.season-ice.is-out { opacity: 0; transform: translateY(40px); }
@keyframes ice-drop { from { transform: translateY(-110vh); } 80% { transform: translateY(4px) scaleY(.94); } }
/* Sonnenbrille auf dem eigenen Foto (Sommeranfang, den ganzen Tag) */
html.season-shades .me__avatar::after { content: ""; position: absolute; z-index: 1; left: 9%; top: 27%; width: 82%; height: 28%; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 34'%3E%3Cpath d='M2 6h96' stroke='%231b1b1b' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M6 5h36c2 0 3 2 3 4-1 12-7 21-20 21S7 22 5 10c0-3 0-5 1-5zM58 5h36c1 0 1 2 1 5-2 12-8 20-20 20S56 21 55 9c0-2 1-4 3-4z' fill='%231b1b1b'/%3E%3Cpath d='M12 10c3 6 8 8 14 8M64 10c3 6 8 8 14 8' stroke='%234cc8e8' stroke-width='3' fill='none' stroke-linecap='round' opacity='.7'/%3E%3C/svg%3E") center / contain no-repeat; }
@keyframes season-spin { to { transform: rotate(360deg); } }

/* Fußball */
.season-ball { position: absolute; left: 0; top: 0; width: 32px; height: 32px; will-change: transform; }
.season-ball svg { width: 100%; height: 100%; display: block; }
.season-ball--kick { padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; border-radius: 50%; transition: opacity .8s; }
.season-ball--kick::before { content: ""; position: absolute; inset: -18px; border-radius: 50%; } /* größere Trefferfläche */
.season-ball--kick svg { filter: drop-shadow(0 4px 4px rgba(0, 0, 0, .3)); }
.season-ball--kick.is-shot { cursor: default; }
.season-goal, .season-keeper { position: absolute; pointer-events: none; transition: opacity .8s; }
.season-goal svg, .season-keeper svg { width: 100%; height: 100%; display: block; }
.season-goal { animation: goal-in .6s cubic-bezier(.3, 1.4, .5, 1) both; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .3)); }
.season-goal.is-goal .goal__net { transform-origin: 50% 0; animation: goal-net .5s ease-out 2; }
.season-keeper { left: 0; top: 0; transform-origin: 50% 90%; will-change: transform; filter: drop-shadow(0 4px 5px rgba(0, 0, 0, .3)); }
.season-score { position: absolute; transform: translate(-50%, -100%); padding: 6px 16px; border-radius: 10px; background: #1b1b1b; color: #f5c542; font-weight: 900; font-size: 26px; line-height: 1; letter-spacing: .06em; font-variant-numeric: tabular-nums; box-shadow: 0 8px 20px rgba(0, 0, 0, .35); animation: season-pop-in .5s cubic-bezier(.3, 1.8, .5, 1) both; transition: opacity .8s; }
.season-score span { color: #fff; }
.season-goal.is-out, .season-keeper.is-out, .season-ball--kick.is-out, .season-score.is-out { opacity: 0; }
@keyframes goal-in { from { transform: translateY(40px); opacity: 0; } }
@keyframes goal-net { 30% { transform: scaleY(1.06) skewX(3deg); } 60% { transform: scaleY(.97) skewX(-2deg); } }
@keyframes season-pop-in { from { transform: translate(-50%, -100%) scale(.2); opacity: 0; } }

/* Geburtstag */
.season-balloon { position: absolute; width: 40px; height: 90px; animation: season-float 8s ease-in forwards; }
.season-balloon svg { width: 100%; height: 100%; display: block; }
@keyframes season-float { 0% { transform: translate(0, 0); } 25% { transform: translate(14px, -30vh); } 50% { transform: translate(-10px, -60vh); } 100% { transform: translate(8px, -130vh); } }

/* Fünfmal auf „pulse“ klicken */
.pulse--love { display: inline-block; animation: season-love-beat .7s ease-in-out 6; }
@keyframes season-love-beat { 0%, 100% { transform: scale(1); } 15% { transform: scale(1.35); } 30% { transform: scale(1.05); } 45% { transform: scale(1.25); } }
.season-love { position: fixed; z-index: 100; pointer-events: none; font-size: 18px; animation: season-love-fly 2.2s ease-out forwards; opacity: 0; }
@keyframes season-love-fly { 0% { opacity: 0; transform: translate(-50%, 0) scale(.5); } 20% { opacity: 1; } 100% { opacity: 0; transform: translate(calc(-50% + var(--dx)), -120px) scale(1.2); } }

/* Konami-Code: Retro-Look */
html.is-retro body { font-family: ui-monospace, Menlo, Consolas, monospace !important; }
html.is-retro .shell { filter: grayscale(1) sepia(1) hue-rotate(50deg) saturate(4) contrast(1.15); }
html.is-retro img { image-rendering: pixelated; }
html.is-retro::after { content: ""; position: fixed; inset: 0; z-index: 200; pointer-events: none; background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .18) 0 2px, transparent 2px 4px); }

/* Neues Badge auf der Startseite */
.medal.is-new { animation: season-medal 1.2s cubic-bezier(.3, 1.6, .5, 1) both; }
@keyframes season-medal { 0% { transform: scale(.2) rotate(-30deg); opacity: 0; } 60% { transform: scale(1.25) rotate(8deg); opacity: 1; } 100% { transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .season-stage, .season-webs, .season-snow { display: none; }
  .season-stage.is-ruhig { display: block; }
  .season-stage.is-ruhig .season-note { transition: none; }
  .pulse--love, .medal.is-new { animation: none; }
}

/* Oktoberfest */
.season-bunting { position: absolute; left: 0; top: 0; pointer-events: none; animation: bunting-in .8s ease-out both; transition: opacity .8s; }
.season-bunting svg { display: block; filter: drop-shadow(0 3px 3px rgba(0, 0, 0, .2)); }
.bunting__flags path { transform-box: fill-box; transform-origin: 50% 0; }
.season-lebkuchen { position: absolute; font: inherit; padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; transform-origin: 50% 0; will-change: transform; transition: opacity .8s; }
.season-lebkuchen svg { width: 100%; height: 100%; display: block; overflow: visible; filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .35)); }
.season-lebkuchen.is-clicked { cursor: default; }
.season-lebkuchen:focus-visible { outline: none; }
.season-mass { position: absolute; pointer-events: none; animation: ice-drop .55s cubic-bezier(.4, 0, .6, 1.4) both; transition: opacity .8s; }
.season-mass svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 6px 8px rgba(0, 0, 0, .3)); }
.mass__beer, .mass__foam { animation: mass-fill 1.7s .5s cubic-bezier(.3, 0, .4, 1) both; }
.mass__drip path { transform-box: fill-box; transform-origin: 50% 0; animation: mass-drip .7s 2.1s ease-in both; }
.season-bunting.is-out, .season-lebkuchen.is-out, .season-mass.is-out { opacity: 0; }
@keyframes bunting-in { from { transform: translateY(-60px); } }
@keyframes mass-fill { from { transform: translateY(122px); } }
@keyframes mass-drip { from { transform: scaleY(0); } }

/* Zeitumstellung */
.season-clock { position: absolute; padding: 0; border: 0; background: none; border-radius: 50%; cursor: pointer; pointer-events: auto; animation: season-clock-in .7s cubic-bezier(.3, 1.5, .5, 1) both;
  transition: left .8s cubic-bezier(.3, 1.2, .5, 1), top .8s cubic-bezier(.3, 1.2, .5, 1), width .8s, height .8s, opacity .8s; filter: drop-shadow(0 12px 22px rgba(0, 0, 0, .4)); }
.season-clock svg { width: 100%; height: 100%; display: block; }
.season-clock.is-vor .clock__yawn { transform-box: fill-box; transform-origin: 50% 50%; animation: clock-yawn 3.2s ease-in-out infinite; }
.season-clock.is-zurueck:not(.is-aside) { animation: season-clock-in .7s cubic-bezier(.3, 1.5, .5, 1) both, clock-wiggle 1.6s 3.3s ease-in-out 2; }
.season-clock.is-aside { cursor: default; }
.season-clock.is-out, .season-coffee.is-out { opacity: 0; }
@keyframes season-clock-in { from { transform: scale(.3) rotate(-20deg); opacity: 0; } }
@keyframes clock-yawn { 0%, 55%, 100% { transform: scale(.35, .3); } 70%, 85% { transform: scale(1.1, 1.25); } }
@keyframes clock-wiggle { 25% { transform: rotate(-6deg); } 75% { transform: rotate(6deg); } }
.season-coffee { position: absolute; pointer-events: none; animation: ice-drop .55s cubic-bezier(.4, 0, .6, 1.4) both; transition: opacity .8s; }
.season-coffee svg { width: 100%; height: 100%; display: block; filter: drop-shadow(0 6px 8px rgba(0, 0, 0, .3)); }
.coffee__pour { transform-box: fill-box; transform-origin: 50% 100%; animation: coffee-pour 1.3s .5s ease-in-out both; }
.coffee__top { transform-box: fill-box; transform-origin: 50% 50%; animation: coffee-top .8s .9s ease-out both; }
.coffee__steam path { animation: coffee-steam 2.2s 1.6s ease-in-out infinite both; }
.coffee__steam path:nth-child(2) { animation-delay: 1.9s; }
.coffee__steam path:nth-child(3) { animation-delay: 2.2s; }
@keyframes coffee-pour { 0% { transform: scaleY(0); opacity: 1; } 30%, 80% { transform: scaleY(1); opacity: 1; } 100% { transform: scaleY(1) translateY(40px); opacity: 0; } }
@keyframes coffee-top { from { transform: scale(.2); opacity: 0; } }
@keyframes coffee-steam { 0% { opacity: 0; transform: translateY(10px); } 40% { opacity: 1; } 100% { opacity: 0; transform: translateY(-16px); } }
.season-bubble1h { position: fixed; z-index: 8; padding: 8px 14px; border-radius: 999px; background: #82be28; color: #10140c; font-weight: 900; font-size: 18px; pointer-events: none; box-shadow: 0 8px 18px rgba(0, 0, 0, .3); transform: translate(-50%, -50%); }
.season-bubble1h.is-pop { animation: bubble-pop .45s ease-out forwards; }
@keyframes bubble-pop { 40% { scale: 1.5; opacity: 1; } 100% { scale: 2; opacity: 0; } }
.season-tip { position: fixed; z-index: 8; transform: translate(-50%, -100%); padding: 6px 12px; border-radius: 10px; background: var(--hub-card, #151a11); border: 1px solid var(--hub-line, rgba(255,255,255,.1)); color: var(--ink, #fff); font-size: 13px; font-weight: 700; white-space: nowrap; pointer-events: none; animation: season-tip-in .35s ease-out both; transition: opacity .5s; }
.season-tip.is-out { opacity: 0; }
@keyframes season-tip-in { from { transform: translate(-50%, -60%); opacity: 0; } }

/* Geburtstag: Torte */
.season-cake { position: absolute; padding: 0; border: 0; background: none; cursor: pointer; pointer-events: auto; animation: ice-drop .6s cubic-bezier(.4, 0, .6, 1.4) both;
  transition: left .8s cubic-bezier(.3, 1.2, .5, 1), top .8s cubic-bezier(.3, 1.2, .5, 1), width .8s, height .8s, opacity .8s; filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .35)); }
.season-cake svg { width: 100%; height: 100%; display: block; }
.cake__flame { transform-box: fill-box; transform-origin: 50% 100%; animation: cake-flicker .5s ease-in-out infinite alternate; }
.cake__smoke { opacity: 0; }
.season-cake.is-out-candles { cursor: default; }
.season-cake.is-out-candles .cake__flame { animation: cake-blow .35s ease-in forwards; }
.season-cake.is-out-candles .cake__smoke { animation: cake-smoke 1.6s .25s ease-out both; }
.season-cake.is-out { opacity: 0; }
@keyframes cake-flicker { from { transform: scale(.9, 1.05) rotate(-4deg); } to { transform: scale(1.05, .92) rotate(4deg); } }
@keyframes cake-blow { 40% { transform: scale(.8, .5) skewX(-30deg); } to { transform: scale(0); opacity: 0; } }
@keyframes cake-smoke { 0% { opacity: 0; transform: translateY(6px); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(-26px); } }

/* Monatsabschluss: Zielscheibe, Pfeil, Pokal */
.season-target { position: absolute; pointer-events: none; transition: transform .8s cubic-bezier(.3, 1.2, .5, 1), opacity .8s; filter: drop-shadow(0 12px 22px rgba(0, 0, 0, .4)); }
.season-target > svg { width: 100%; height: 100%; display: block; animation: season-clock-in .6s cubic-bezier(.3, 1.5, .5, 1) both; } /* nicht am Rahmen: dessen transform rückt ihn später zur Seite */
.season-target.is-hit > svg { animation: target-hit .45s ease-out; }
.season-target.is-out, .season-trophy.is-out { opacity: 0; }
.season-dart { position: absolute; left: 0; top: 0; transform-origin: 100% 50%; will-change: transform; }
.season-dart svg { width: 100%; height: 100%; display: block; overflow: visible; filter: drop-shadow(0 3px 3px rgba(0, 0, 0, .3)); }
.season-target.is-hit .season-dart { animation: dart-wobble .5s ease-out; }
@keyframes target-hit { 30% { transform: scale(.94) rotate(-3deg); } 60% { transform: scale(1.02) rotate(2deg); } }
@keyframes dart-wobble { 25% { rotate: 4deg; } 50% { rotate: -3deg; } 75% { rotate: 1.5deg; } }
.season-trophy { position: absolute; pointer-events: none; text-align: center; animation: season-clock-in .6s cubic-bezier(.3, 1.5, .5, 1) both; transition: opacity .8s; }
.season-trophy svg { width: 100%; height: auto; display: block; filter: drop-shadow(0 8px 12px rgba(0, 0, 0, .35)); }
.trophy__label { width: max-content; max-width: 180px; margin: 6px 0 0 50%; translate: -50% 0; overflow-wrap: anywhere; padding: 6px 10px; border-radius: 10px; background: var(--hub-card, #151a11); border: 1px solid var(--hub-line, rgba(255,255,255,.1)); color: var(--ink, #fff); font-size: 11px; font-weight: 600; line-height: 1.35; }
.trophy__label b { display: block; font-size: 13px; font-weight: 800; }
.trophy__label span { display: block; font-size: 18px; font-weight: 900; color: #f5c542; }

/* Arcade-Champion (Monatsanfang): Pokal in vioma-Lime mit Abteilung und Avatar-Stapel, klickbar (Bestenliste) */
.season-champ { position: absolute; translate: -50% 0; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; pointer-events: auto; animation: season-clock-in .7s cubic-bezier(.3, 1.5, .5, 1) backwards; transition: opacity .8s, transform .9s cubic-bezier(.5, 0, .2, 1); }
.season-champ.is-out { opacity: 0; pointer-events: none; }
.season-champ:focus-visible { outline: 2px solid #82be28; outline-offset: 6px; border-radius: 14px; }
.champ__pokal svg { width: 100%; height: auto; display: block; filter: drop-shadow(0 8px 12px rgba(0, 0, 0, .35)); }
.champ__label { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 14px 10px; border-radius: 12px; background: var(--hub-card, #151a11); border: 1px solid var(--hub-line, rgba(255,255,255,.1)); color: var(--ink, #fff); max-width: 100%; }
.champ__label small { font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--muted, #9aa3a8); }
.champ__label b { font-size: 20px; font-weight: 900; text-transform: uppercase; letter-spacing: -.01em; overflow-wrap: anywhere; }
.champ__stapel { display: flex; justify-content: center; margin-top: 2px; }
.champ__stapel .sp-avatar { position: relative; flex: none; display: inline-grid; place-items: center; width: var(--sp-av, 34px); height: var(--sp-av, 34px); border-radius: 50%; overflow: hidden; background: #2a2f2a; color: #e8ebe8; font-size: calc(var(--sp-av, 34px) * .36); font-weight: 800; box-shadow: 0 0 0 2px var(--hub-card, #151a11); }
.champ__stapel .sp-avatar + .sp-avatar, .champ__mehr { margin-left: -8px; }
.champ__stapel .sp-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.champ__mehr { display: inline-grid; place-items: center; min-width: 34px; height: 34px; padding: 0 6px; border-radius: 999px; background: #82be28; color: #10140c; font-size: 12px; font-weight: 900; box-shadow: 0 0 0 2px var(--hub-card, #151a11); }

/* Arcade-Start: geheimnisvolle Kachel klappt wie eine Tür auf (seasons.js arcadeStart) */
.season-reveal { position: absolute; z-index: 2; display: grid; place-content: center; justify-items: center; gap: 10px; border-radius: 24px;
  background: #0c0e0a; border: 1px solid rgba(130, 190, 40, .4); color: #82be28; transform-origin: 0 50%; pointer-events: none;
  transition: transform .9s cubic-bezier(.5, 0, .3, 1), opacity .9s ease; }
.reveal__frage { font-size: 96px; font-weight: 900; line-height: 1; }
.reveal__name { font-size: 18px; font-weight: 900; letter-spacing: .14em; color: #fff; }
.season-reveal.is-offen { transform: perspective(1200px) rotateY(-105deg); opacity: 0; }
.season-glow { box-shadow: 0 0 0 3px #82be28, var(--hub-shadow-hover, none) !important; transition: box-shadow .4s ease; }