/* =====================================================================
   HSB Simulations · Saisonale Farbschemata und Deko
   ---------------------------------------------------------------------
   Überschreibt ausschließlich Farben und ergänzt Deko über freie
   Pseudo-Elemente. Kein Eingriff in Markup, Aufbau oder Abstände.
   Ohne gesetztes data-season ist die Datei vollständig wirkungslos.

   Einbinden   <link rel="stylesheet" href="/seasonal.css">
               direkt NACH dem <style>-Block der Seite
   Automatik   <script src="/seasonal.js"></script> im <head>
   Von Hand    <html data-season="halloween">   (hat Vorrang)
   Testen      ?season=silvester  an die URL hängen

   Die beiden Seiten werden über ihre Hero-IDs getrennt:
   #home = Hauptseite, #top = VVH-Seite.
   ===================================================================== */

/* ===================== HALLOWEEN ===================== */

/* Hauptseite */
:root[data-season="halloween"]{
  --bg:#130d1c; --card:#221433; --card2:#2b1a3f;
  --accent1:#ff9442; --accent2:#b06bf5;
  --grad:linear-gradient(135deg,#ff9442,#b06bf5);
  --grad-hover:linear-gradient(135deg,#ffab6c,#c28cf8);
  --text2:#e3d2fb;
  --border:rgba(255,148,66,.20);
  --sm1:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%23ff9442' fill-opacity='0.085' stroke='%23ff9442' stroke-opacity='0.085'%3E%3Cpath fill-rule='evenodd' d='M46 22h8v12h-8zM50 34c-7 0-11 4-16 4-7 0-12 8-12 18s8 20 17 20c4 0 8-2 11-2s7 2 11 2c9 0 17-10 17-20s-5-18-12-18c-5 0-9-4-16-4zM38 54l8-5 4 8zM62 54l-8-5-4 8zM36 68h28l-5 6-5-3-4 4-4-4-5 3z'/%3E%3C/g%3E%3C/svg%3E");
  --sm2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%23ff9442' fill-opacity='0.085' stroke='%23ff9442' stroke-opacity='0.085'%3E%3Cpath fill-rule='evenodd' d='M50 22c-10 0-18 9-18 21v39l6-7 6 7 6-7 6 7 6-7 6 7V43c0-12-8-21-18-21zM43 42a4 5 0 1 0 0 10 4 5 0 1 0 0-10zM57 42a4 5 0 1 0 0 10 4 5 0 1 0 0-10z'/%3E%3C/g%3E%3C/svg%3E");
  --sm3:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%23ff9442' fill-opacity='0.085' stroke='%23ff9442' stroke-opacity='0.085'%3E%3Cpath d='M50 44c-2.4 0-4.2 1.5-5 3.8-3-3.3-7.6-4.7-12.3-3.3.6-2.2.3-4.5-.8-6.7-1 3.3-3.3 5.5-6.4 6.7-3.3 1.2-7.1.8-10.6-.9 1.7 2.6 2.4 5.3 2 8.2-2.9-.6-5.6-.2-8.1 1.43.3.3 6 1.7 8 4 1.9 2.3 2.9 5.1 3.1 8.4 1.7-3.6 4.2-5.8 7.6-6.5 3.1-.6 6.2.2 9 2.4.6-2.8 2.1-4.8 4.4-5.7 2.3.9 3.8 2.9 4.4 5.7 2.8-2.2 5.9-3 9-2.4 3.4.7 5.9 2.9 7.6 6.5.2-3.3 1.2-6.1 3.1-8.4 2-2.3 4.7-3.7 8-4-2.5-1.6-5.2-2-8.1-1.4-.4-2.9.3-5.6 2-8.2-3.5 1.7-7.3 2.1-10.6.9-3.1-1.2-5.4-3.4-6.4-6.7-1.1 2.2-1.4 4.5-.8 6.7-4.7-1.4-9.3 0-12.3 3.3-.8-2.3-2.6-3.8-5-3.8z'/%3E%3C/g%3E%3C/svg%3E");
  --sm4:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%23ff9442' fill-opacity='0.085' stroke='%23ff9442' stroke-opacity='0.085'%3E%3Cpath fill-rule='evenodd' d='M46 22h8v12h-8zM50 34c-7 0-11 4-16 4-7 0-12 8-12 18s8 20 17 20c4 0 8-2 11-2s7 2 11 2c9 0 17-10 17-20s-5-18-12-18c-5 0-9-4-16-4zM38 54l8-5 4 8zM62 54l-8-5-4 8zM36 68h28l-5 6-5-3-4 4-4-4-5 3z'/%3E%3C/g%3E%3C/svg%3E");
  --smv1:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%236d28d9' fill-opacity='0.085' stroke='%236d28d9' stroke-opacity='0.085'%3E%3Cpath fill-rule='evenodd' d='M46 22h8v12h-8zM50 34c-7 0-11 4-16 4-7 0-12 8-12 18s8 20 17 20c4 0 8-2 11-2s7 2 11 2c9 0 17-10 17-20s-5-18-12-18c-5 0-9-4-16-4zM38 54l8-5 4 8zM62 54l-8-5-4 8zM36 68h28l-5 6-5-3-4 4-4-4-5 3z'/%3E%3C/g%3E%3C/svg%3E");
  --smv2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%236d28d9' fill-opacity='0.085' stroke='%236d28d9' stroke-opacity='0.085'%3E%3Cpath fill-rule='evenodd' d='M50 22c-10 0-18 9-18 21v39l6-7 6 7 6-7 6 7 6-7 6 7V43c0-12-8-21-18-21zM43 42a4 5 0 1 0 0 10 4 5 0 1 0 0-10zM57 42a4 5 0 1 0 0 10 4 5 0 1 0 0-10z'/%3E%3C/g%3E%3C/svg%3E");
  --smv3:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%236d28d9' fill-opacity='0.085' stroke='%236d28d9' stroke-opacity='0.085'%3E%3Cpath d='M50 44c-2.4 0-4.2 1.5-5 3.8-3-3.3-7.6-4.7-12.3-3.3.6-2.2.3-4.5-.8-6.7-1 3.3-3.3 5.5-6.4 6.7-3.3 1.2-7.1.8-10.6-.9 1.7 2.6 2.4 5.3 2 8.2-2.9-.6-5.6-.2-8.1 1.43.3.3 6 1.7 8 4 1.9 2.3 2.9 5.1 3.1 8.4 1.7-3.6 4.2-5.8 7.6-6.5 3.1-.6 6.2.2 9 2.4.6-2.8 2.1-4.8 4.4-5.7 2.3.9 3.8 2.9 4.4 5.7 2.8-2.2 5.9-3 9-2.4 3.4.7 5.9 2.9 7.6 6.5.2-3.3 1.2-6.1 3.1-8.4 2-2.3 4.7-3.7 8-4-2.5-1.6-5.2-2-8.1-1.4-.4-2.9.3-5.6 2-8.2-3.5 1.7-7.3 2.1-10.6.9-3.1-1.2-5.4-3.4-6.4-6.7-1.1 2.2-1.4 4.5-.8 6.7-4.7-1.4-9.3 0-12.3 3.3-.8-2.3-2.6-3.8-5-3.8z'/%3E%3C/g%3E%3C/svg%3E");
  --smv4:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%236d28d9' fill-opacity='0.085' stroke='%236d28d9' stroke-opacity='0.085'%3E%3Cpath fill-rule='evenodd' d='M46 22h8v12h-8zM50 34c-7 0-11 4-16 4-7 0-12 8-12 18s8 20 17 20c4 0 8-2 11-2s7 2 11 2c9 0 17-10 17-20s-5-18-12-18c-5 0-9-4-16-4zM38 54l8-5 4 8zM62 54l-8-5-4 8zM36 68h28l-5 6-5-3-4 4-4-4-5 3z'/%3E%3C/g%3E%3C/svg%3E");
}
:root[data-season="halloween"] .hero-overlay{
  background:linear-gradient(to bottom,rgba(19,13,28,.40) 0%,rgba(19,13,28,.70) 70%,#130d1c 100%);
}

/* VVH-Seite, hell */
:root[data-season="halloween"]{
  --vvh-teal:#6d28d9; --vvh-teal-dark:#4c1d95; --vvh-teal-soft:#f0e9fe;
  --vvh-bg:#faf7fd; --vvh-ink:#1b1424; --vvh-muted:#635c70;
  --vvh-line:#e2dced; --vvh-warn:#c2410c; --vvh-warn-soft:#fdeee2;
  --np-bg:#f1ecfa; --np-rg:#ddd4ee;
}
/* VVH-Seite, dunkel */
@media (prefers-color-scheme: dark){
  :root[data-season="halloween"]:not([data-theme="light"]){
    --vvh-teal:#a78bfa; --vvh-teal-dark:#c4b5fd; --vvh-teal-soft:#2a1b43;
    --vvh-bg:#130d1c; --vvh-surface:#1f1430; --vvh-ink:#f0e9fb;
    --vvh-text:#d6c9e8; --vvh-muted:#9b8fae; --vvh-line:#352347;
    --vvh-warn:#fb923c; --vvh-warn-soft:#3a220d;
    --on-teal:#1a0f2b; --np-bg:#1b1128; --np-rg:#3a2750;
    --footer-bg:#0c0714; --board-bg:#0c0714; --tag-off-bg:#352347;
  }
}
:root[data-season="halloween"][data-theme="dark"]{
  --vvh-teal:#a78bfa; --vvh-teal-dark:#c4b5fd; --vvh-teal-soft:#2a1b43;
  --vvh-bg:#130d1c; --vvh-surface:#1f1430; --vvh-ink:#f0e9fb;
  --vvh-text:#d6c9e8; --vvh-muted:#9b8fae; --vvh-line:#352347;
  --vvh-warn:#fb923c; --vvh-warn-soft:#3a220d;
  --on-teal:#1a0f2b; --np-bg:#1b1128; --np-rg:#3a2750;
  --footer-bg:#0c0714; --board-bg:#0c0714; --tag-off-bg:#352347;
}
/* VVH-Hero: Verlauf steht in der Seite fest verdrahtet */
:root[data-season="halloween"] #top{ background:#4c1d95; }
:root[data-season="halloween"] #top::after,
:root[data-season="halloween"][data-theme="dark"] #top::after{ background:linear-gradient(100deg,rgba(40,14,88,.97) 0%,rgba(76,29,149,.90) 45%,rgba(76,29,149,.45) 100%); }
@media (prefers-color-scheme: dark){
  :root[data-season="halloween"]:not([data-theme="light"]) #top::after{ background:linear-gradient(100deg,rgba(40,14,88,.97) 0%,rgba(76,29,149,.90) 45%,rgba(76,29,149,.45) 100%); }
}

/* ===================== WINTER & WEIHNACHTEN ===================== */

/* Hauptseite */
:root[data-season="winter"]{
  --bg:#0a1020; --card:#15203a; --card2:#1b2847;
  --accent1:#8ec5ff; --accent2:#ffd27a;
  --grad:linear-gradient(135deg,#8ec5ff,#ffd27a);
  --grad-hover:linear-gradient(135deg,#aed6ff,#ffe0a1);
  --text2:#cfe3ff;
  --border:rgba(142,197,255,.20);
  --sm1:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%238ec5ff' fill-opacity='0.085' stroke='%238ec5ff' stroke-opacity='0.085'%3E%3Cpath d='M50 20l13 22H37zM50 35l17 25H33zM50 50l21 29H29z'/%3E%3Crect x='45' y='79' width='10' height='9' rx='2'/%3E%3C/g%3E%3C/svg%3E");
  --sm2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%238ec5ff' fill-opacity='0.085' stroke='%238ec5ff' stroke-opacity='0.085'%3E%3Cpath d='M50 22l8 19 21 2-16 14 5 21-18-11-18 11 5-21-16-14 21-2z'/%3E%3C/g%3E%3C/svg%3E");
  --sm3:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg opacity='0.085'%3E%3Cg stroke='%238ec5ff' stroke-width='2.6' stroke-linecap='round' fill='none'%3E%3Cpath d='M50 22v56M26 36l48 28M74 36L26 64'/%3E%3Cpath d='M50 34l-7-7M50 34l7-7M50 66l-7 7M50 66l7 7'/%3E%3Cpath d='M37 42l-9-2M37 42l-2-9M63 58l9 2M63 58l2 9'/%3E%3Cpath d='M63 42l9-2M63 42l2-9M37 58l-9 2M37 58l-2 9'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --sm4:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%238ec5ff' fill-opacity='0.085' stroke='%238ec5ff' stroke-opacity='0.085'%3E%3Cpath d='M50 20l13 22H37zM50 35l17 25H33zM50 50l21 29H29z'/%3E%3Crect x='45' y='79' width='10' height='9' rx='2'/%3E%3C/g%3E%3C/svg%3E");
  --smv1:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%231e5f8c' fill-opacity='0.085' stroke='%231e5f8c' stroke-opacity='0.085'%3E%3Cpath d='M50 20l13 22H37zM50 35l17 25H33zM50 50l21 29H29z'/%3E%3Crect x='45' y='79' width='10' height='9' rx='2'/%3E%3C/g%3E%3C/svg%3E");
  --smv2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%231e5f8c' fill-opacity='0.085' stroke='%231e5f8c' stroke-opacity='0.085'%3E%3Cpath d='M50 22l8 19 21 2-16 14 5 21-18-11-18 11 5-21-16-14 21-2z'/%3E%3C/g%3E%3C/svg%3E");
  --smv3:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg opacity='0.085'%3E%3Cg stroke='%238ec5ff' stroke-width='2.6' stroke-linecap='round' fill='none'%3E%3Cpath d='M50 22v56M26 36l48 28M74 36L26 64'/%3E%3Cpath d='M50 34l-7-7M50 34l7-7M50 66l-7 7M50 66l7 7'/%3E%3Cpath d='M37 42l-9-2M37 42l-2-9M63 58l9 2M63 58l2 9'/%3E%3Cpath d='M63 42l9-2M63 42l2-9M37 58l-9 2M37 58l-2 9'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --smv4:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%231e5f8c' fill-opacity='0.085' stroke='%231e5f8c' stroke-opacity='0.085'%3E%3Cpath d='M50 20l13 22H37zM50 35l17 25H33zM50 50l21 29H29z'/%3E%3Crect x='45' y='79' width='10' height='9' rx='2'/%3E%3C/g%3E%3C/svg%3E");
}
:root[data-season="winter"] .hero-overlay{
  background:linear-gradient(to bottom,rgba(10,16,32,.40) 0%,rgba(10,16,32,.70) 70%,#0a1020 100%);
}

/* VVH-Seite, hell */
:root[data-season="winter"]{
  --vvh-teal:#1e5f8c; --vvh-teal-dark:#143f5e; --vvh-teal-soft:#e3eff8;
  --vvh-bg:#f4f8fb; --vvh-ink:#111a22; --vvh-muted:#5c6b78;
  --vvh-line:#d4e0ea; --vvh-warn:#9f1239; --vvh-warn-soft:#fce7ec;
  --np-bg:#e9f0f6; --np-rg:#cfdce6;
}
/* VVH-Seite, dunkel */
@media (prefers-color-scheme: dark){
  :root[data-season="winter"]:not([data-theme="light"]){
    --vvh-teal:#7dd3fc; --vvh-teal-dark:#a5e0ff; --vvh-teal-soft:#0f2b40;
    --vvh-bg:#0a1020; --vvh-surface:#141f33; --vvh-ink:#e7f1fb;
    --vvh-text:#c5d7e8; --vvh-muted:#8ba0b4; --vvh-line:#243349;
    --vvh-warn:#f6c177; --vvh-warn-soft:#33260f;
    --on-teal:#061a2b; --np-bg:#101a2b; --np-rg:#26384f;
    --footer-bg:#070c18; --board-bg:#070c18; --tag-off-bg:#243349;
  }
}
:root[data-season="winter"][data-theme="dark"]{
  --vvh-teal:#7dd3fc; --vvh-teal-dark:#a5e0ff; --vvh-teal-soft:#0f2b40;
  --vvh-bg:#0a1020; --vvh-surface:#141f33; --vvh-ink:#e7f1fb;
  --vvh-text:#c5d7e8; --vvh-muted:#8ba0b4; --vvh-line:#243349;
  --vvh-warn:#f6c177; --vvh-warn-soft:#33260f;
  --on-teal:#061a2b; --np-bg:#101a2b; --np-rg:#26384f;
  --footer-bg:#070c18; --board-bg:#070c18; --tag-off-bg:#243349;
}
/* VVH-Hero: Verlauf steht in der Seite fest verdrahtet */
:root[data-season="winter"] #top{ background:#143f5e; }
:root[data-season="winter"] #top::after,
:root[data-season="winter"][data-theme="dark"] #top::after{ background:linear-gradient(100deg,rgba(9,32,48,.97) 0%,rgba(20,63,94,.90) 45%,rgba(20,63,94,.45) 100%); }
@media (prefers-color-scheme: dark){
  :root[data-season="winter"]:not([data-theme="light"]) #top::after{ background:linear-gradient(100deg,rgba(9,32,48,.97) 0%,rgba(20,63,94,.90) 45%,rgba(20,63,94,.45) 100%); }
}

/* ===================== SILVESTER ===================== */

/* Hauptseite */
:root[data-season="silvester"]{
  --bg:#0b0d1a; --card:#171a2e; --card2:#1d2140;
  --accent1:#ffd166; --accent2:#f472b6;
  --grad:linear-gradient(135deg,#ffd166,#f472b6);
  --grad-hover:linear-gradient(135deg,#ffdf91,#f895c7);
  --text2:#e4e3ff;
  --border:rgba(255,209,102,.20);
  --sm1:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%23ffd166' fill-opacity='0.085' stroke='%23ffd166' stroke-opacity='0.085'%3E%3Cpath d='M50 18c8 10 12 22 12 32 0 8-4 14-12 14s-12-6-12-14c0-10 4-22 12-32z'/%3E%3Cpath d='M38 48l-9 17 11-7zM62 48l9 17-11-7z'/%3E%3Cpath d='M46 64h8l-2 11h-4z'/%3E%3C/g%3E%3C/svg%3E");
  --sm2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%23ffd166' fill-opacity='0.085' stroke='%23ffd166' stroke-opacity='0.085'%3E%3Cg fill='none' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M34 24h32l-6 20-10 7-10-7z'/%3E%3Cpath d='M50 51v23M40 76h20'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --sm3:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%23ffd166' fill-opacity='0.085' stroke='%23ffd166' stroke-opacity='0.085'%3E%3Cg stroke-linecap='round' fill='none' stroke-width='2.8'%3E%3Cpath d='M50 50V22M50 50l20-20M50 50h28M50 50l20 20M50 50v28M50 50l-20 20M50 50H22M50 50l-20-20'/%3E%3C/g%3E%3Ccircle cx='50' cy='50' r='3.6' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  --sm4:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%23ffd166' fill-opacity='0.085' stroke='%23ffd166' stroke-opacity='0.085'%3E%3Cpath d='M50 18c8 10 12 22 12 32 0 8-4 14-12 14s-12-6-12-14c0-10 4-22 12-32z'/%3E%3Cpath d='M38 48l-9 17 11-7zM62 48l9 17-11-7z'/%3E%3Cpath d='M46 64h8l-2 11h-4z'/%3E%3C/g%3E%3C/svg%3E");
  --smv1:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%234338ca' fill-opacity='0.085' stroke='%234338ca' stroke-opacity='0.085'%3E%3Cpath d='M50 18c8 10 12 22 12 32 0 8-4 14-12 14s-12-6-12-14c0-10 4-22 12-32z'/%3E%3Cpath d='M38 48l-9 17 11-7zM62 48l9 17-11-7z'/%3E%3Cpath d='M46 64h8l-2 11h-4z'/%3E%3C/g%3E%3C/svg%3E");
  --smv2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%234338ca' fill-opacity='0.085' stroke='%234338ca' stroke-opacity='0.085'%3E%3Cg fill='none' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M34 24h32l-6 20-10 7-10-7z'/%3E%3Cpath d='M50 51v23M40 76h20'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  --smv3:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%234338ca' fill-opacity='0.085' stroke='%234338ca' stroke-opacity='0.085'%3E%3Cg stroke-linecap='round' fill='none' stroke-width='2.8'%3E%3Cpath d='M50 50V22M50 50l20-20M50 50h28M50 50l20 20M50 50v28M50 50l-20 20M50 50H22M50 50l-20-20'/%3E%3C/g%3E%3Ccircle cx='50' cy='50' r='3.6' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  --smv4:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%234338ca' fill-opacity='0.085' stroke='%234338ca' stroke-opacity='0.085'%3E%3Cpath d='M50 18c8 10 12 22 12 32 0 8-4 14-12 14s-12-6-12-14c0-10 4-22 12-32z'/%3E%3Cpath d='M38 48l-9 17 11-7zM62 48l9 17-11-7z'/%3E%3Cpath d='M46 64h8l-2 11h-4z'/%3E%3C/g%3E%3C/svg%3E");
}
:root[data-season="silvester"] .hero-overlay{
  background:linear-gradient(to bottom,rgba(11,13,26,.40) 0%,rgba(11,13,26,.70) 70%,#0b0d1a 100%);
}

/* VVH-Seite, hell */
:root[data-season="silvester"]{
  --vvh-teal:#4338ca; --vvh-teal-dark:#312e81; --vvh-teal-soft:#ebeafc;
  --vvh-bg:#f8f8fd; --vvh-ink:#16162a; --vvh-muted:#5f5f78;
  --vvh-line:#e0e0ee; --vvh-warn:#b45309; --vvh-warn-soft:#fef3e2;
  --np-bg:#efeffa; --np-rg:#dadaee;
}
/* VVH-Seite, dunkel */
@media (prefers-color-scheme: dark){
  :root[data-season="silvester"]:not([data-theme="light"]){
    --vvh-teal:#a5b4fc; --vvh-teal-dark:#c7d2fe; --vvh-teal-soft:#23234a;
    --vvh-bg:#0b0d1a; --vvh-surface:#16182c; --vvh-ink:#eceaf9;
    --vvh-text:#c8c9e2; --vvh-muted:#9093ad; --vvh-line:#2b2e4a;
    --vvh-warn:#fbbf5c; --vvh-warn-soft:#342611;
    --on-teal:#141236; --np-bg:#12142a; --np-rg:#2d3156;
    --footer-bg:#070813; --board-bg:#070813; --tag-off-bg:#2b2e4a;
  }
}
:root[data-season="silvester"][data-theme="dark"]{
  --vvh-teal:#a5b4fc; --vvh-teal-dark:#c7d2fe; --vvh-teal-soft:#23234a;
  --vvh-bg:#0b0d1a; --vvh-surface:#16182c; --vvh-ink:#eceaf9;
  --vvh-text:#c8c9e2; --vvh-muted:#9093ad; --vvh-line:#2b2e4a;
  --vvh-warn:#fbbf5c; --vvh-warn-soft:#342611;
  --on-teal:#141236; --np-bg:#12142a; --np-rg:#2d3156;
  --footer-bg:#070813; --board-bg:#070813; --tag-off-bg:#2b2e4a;
}
/* VVH-Hero: Verlauf steht in der Seite fest verdrahtet */
:root[data-season="silvester"] #top{ background:#312e81; }
:root[data-season="silvester"] #top::after,
:root[data-season="silvester"][data-theme="dark"] #top::after{ background:linear-gradient(100deg,rgba(18,16,66,.97) 0%,rgba(49,46,129,.90) 45%,rgba(49,46,129,.45) 100%); }
@media (prefers-color-scheme: dark){
  :root[data-season="silvester"]:not([data-theme="light"]) #top::after{ background:linear-gradient(100deg,rgba(18,16,66,.97) 0%,rgba(49,46,129,.90) 45%,rgba(49,46,129,.45) 100%); }
}

/* ===================== OSTERN ===================== */

/* Hauptseite */
:root[data-season="ostern"]{
  --bg:#101522; --card:#1a2436; --card2:#1f2b40;
  --accent1:#6ee7b7; --accent2:#cbb6fd;
  --grad:linear-gradient(135deg,#6ee7b7,#cbb6fd);
  --grad-hover:linear-gradient(135deg,#92efca,#ddcbfe);
  --text2:#d4e8e0;
  --border:rgba(110,231,183,.20);
  --sm1:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%236ee7b7' fill-opacity='0.085' stroke='%236ee7b7' stroke-opacity='0.085'%3E%3Cellipse cx='50' cy='62' rx='16' ry='18'/%3E%3Ccircle cx='50' cy='42' r='11'/%3E%3Cellipse cx='43' cy='24' rx='5' ry='13' transform='rotate(-12 43 24)'/%3E%3Cellipse cx='57' cy='24' rx='5' ry='13' transform='rotate(12 57 24)'/%3E%3Ccircle cx='68' cy='73' r='6'/%3E%3C/g%3E%3C/svg%3E");
  --sm2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%236ee7b7' fill-opacity='0.085' stroke='%236ee7b7' stroke-opacity='0.085'%3E%3Cellipse cx='50' cy='32' rx='8' ry='13'/%3E%3Cellipse cx='32' cy='46' rx='13' ry='8'/%3E%3Cellipse cx='68' cy='46' rx='13' ry='8'/%3E%3Cellipse cx='40' cy='64' rx='8' ry='12' transform='rotate(30 40 64)'/%3E%3Cellipse cx='60' cy='64' rx='8' ry='12' transform='rotate(-30 60 64)'/%3E%3C/g%3E%3C/svg%3E");
  --sm3:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%236ee7b7' fill-opacity='0.085' stroke='%236ee7b7' stroke-opacity='0.085'%3E%3Cpath d='M50 20c13 0 22 17 22 31s-9 23-22 23-22-9-22-23 9-31 22-31z'/%3E%3Cpath fill='none' stroke-width='4' d='M30 52h40M30 64h40'/%3E%3C/g%3E%3C/svg%3E");
  --sm4:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%236ee7b7' fill-opacity='0.085' stroke='%236ee7b7' stroke-opacity='0.085'%3E%3Cellipse cx='50' cy='62' rx='16' ry='18'/%3E%3Ccircle cx='50' cy='42' r='11'/%3E%3Cellipse cx='43' cy='24' rx='5' ry='13' transform='rotate(-12 43 24)'/%3E%3Cellipse cx='57' cy='24' rx='5' ry='13' transform='rotate(12 57 24)'/%3E%3Ccircle cx='68' cy='73' r='6'/%3E%3C/g%3E%3C/svg%3E");
  --smv1:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%2315803d' fill-opacity='0.085' stroke='%2315803d' stroke-opacity='0.085'%3E%3Cellipse cx='50' cy='62' rx='16' ry='18'/%3E%3Ccircle cx='50' cy='42' r='11'/%3E%3Cellipse cx='43' cy='24' rx='5' ry='13' transform='rotate(-12 43 24)'/%3E%3Cellipse cx='57' cy='24' rx='5' ry='13' transform='rotate(12 57 24)'/%3E%3Ccircle cx='68' cy='73' r='6'/%3E%3C/g%3E%3C/svg%3E");
  --smv2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%2315803d' fill-opacity='0.085' stroke='%2315803d' stroke-opacity='0.085'%3E%3Cellipse cx='50' cy='32' rx='8' ry='13'/%3E%3Cellipse cx='32' cy='46' rx='13' ry='8'/%3E%3Cellipse cx='68' cy='46' rx='13' ry='8'/%3E%3Cellipse cx='40' cy='64' rx='8' ry='12' transform='rotate(30 40 64)'/%3E%3Cellipse cx='60' cy='64' rx='8' ry='12' transform='rotate(-30 60 64)'/%3E%3C/g%3E%3C/svg%3E");
  --smv3:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%2315803d' fill-opacity='0.085' stroke='%2315803d' stroke-opacity='0.085'%3E%3Cpath d='M50 20c13 0 22 17 22 31s-9 23-22 23-22-9-22-23 9-31 22-31z'/%3E%3Cpath fill='none' stroke-width='4' d='M30 52h40M30 64h40'/%3E%3C/g%3E%3C/svg%3E");
  --smv4:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'%3E%3Cg transform='translate(0 0) scale(1)' fill='%2315803d' fill-opacity='0.085' stroke='%2315803d' stroke-opacity='0.085'%3E%3Cellipse cx='50' cy='62' rx='16' ry='18'/%3E%3Ccircle cx='50' cy='42' r='11'/%3E%3Cellipse cx='43' cy='24' rx='5' ry='13' transform='rotate(-12 43 24)'/%3E%3Cellipse cx='57' cy='24' rx='5' ry='13' transform='rotate(12 57 24)'/%3E%3Ccircle cx='68' cy='73' r='6'/%3E%3C/g%3E%3C/svg%3E");
}
:root[data-season="ostern"] .hero-overlay{
  background:linear-gradient(to bottom,rgba(16,21,34,.40) 0%,rgba(16,21,34,.70) 70%,#101522 100%);
}

/* VVH-Seite, hell */
:root[data-season="ostern"]{
  --vvh-teal:#15803d; --vvh-teal-dark:#0d5529; --vvh-teal-soft:#e5f5e9;
  --vvh-bg:#f6faf5; --vvh-ink:#131c16; --vvh-muted:#5f6e65;
  --vvh-line:#d8e6da; --vvh-warn:#935c06; --vvh-warn-soft:#fdf4e0;
  --np-bg:#ecf3ec; --np-rg:#d3e2d5;
}
/* VVH-Seite, dunkel */
@media (prefers-color-scheme: dark){
  :root[data-season="ostern"]:not([data-theme="light"]){
    --vvh-teal:#4ade80; --vvh-teal-dark:#86efac; --vvh-teal-soft:#12301f;
    --vvh-bg:#0d1612; --vvh-surface:#15241c; --vvh-ink:#e8f5ec;
    --vvh-text:#c6dccd; --vvh-muted:#8aa494; --vvh-line:#24382b;
    --vvh-warn:#e0b25c; --vvh-warn-soft:#2e240f;
    --on-teal:#06230f; --np-bg:#101d16; --np-rg:#26402e;
    --footer-bg:#070f0b; --board-bg:#070f0b; --tag-off-bg:#24382b;
  }
}
:root[data-season="ostern"][data-theme="dark"]{
  --vvh-teal:#4ade80; --vvh-teal-dark:#86efac; --vvh-teal-soft:#12301f;
  --vvh-bg:#0d1612; --vvh-surface:#15241c; --vvh-ink:#e8f5ec;
  --vvh-text:#c6dccd; --vvh-muted:#8aa494; --vvh-line:#24382b;
  --vvh-warn:#e0b25c; --vvh-warn-soft:#2e240f;
  --on-teal:#06230f; --np-bg:#101d16; --np-rg:#26402e;
  --footer-bg:#070f0b; --board-bg:#070f0b; --tag-off-bg:#24382b;
}
/* VVH-Hero: Verlauf steht in der Seite fest verdrahtet */
:root[data-season="ostern"] #top{ background:#0d5529; }
:root[data-season="ostern"] #top::after,
:root[data-season="ostern"][data-theme="dark"] #top::after{ background:linear-gradient(100deg,rgba(5,44,21,.97) 0%,rgba(13,85,41,.90) 45%,rgba(13,85,41,.45) 100%); }
@media (prefers-color-scheme: dark){
  :root[data-season="ostern"]:not([data-theme="light"]) #top::after{ background:linear-gradient(100deg,rgba(5,44,21,.97) 0%,rgba(13,85,41,.90) 45%,rgba(13,85,41,.45) 100%); }
}

/* =====================================================================
   DEKO
   #home::before  ruhendes Motivmuster      #home::after  Partikel
   Beide liegen über dem Bildverlauf und unter Überschrift und Zahlen.
   Die VVH-Seite bekommt nur das Muster, keine Bewegung.
   ===================================================================== */

:root[data-season] body > nav{ overflow:visible; }
:root[data-season] body > nav::after,
:root[data-season] .vvh-header::after{
  content:""; position:absolute; left:0; right:0; pointer-events:none;
}
:root[data-season] body > nav::after{ bottom:-18px; height:18px; }
:root[data-season] .vvh-header::after{ bottom:-12px; height:12px; opacity:.55; }

:root[data-season] #home::before,
:root[data-season] #home::after,
:root[data-season] #top::before{
  content:""; position:absolute; z-index:1; pointer-events:none;
}
:root[data-season] #home::before,
:root[data-season] #top::before{ inset:0; }

/* Die Motive bleiben am Rand: in der Mitte, wo Überschrift und Text
   stehen, wird das Muster ausgeblendet.                             */
:root[data-season] #home::before{
  -webkit-mask-image:radial-gradient(ellipse 62% 58% at 50% 46%,transparent 0%,transparent 46%,#000 96%);
          mask-image:radial-gradient(ellipse 62% 58% at 50% 46%,transparent 0%,transparent 46%,#000 96%);
}
:root[data-season] #top::before{
  opacity:.6;
  -webkit-mask-image:linear-gradient(100deg,transparent 0%,transparent 44%,#000 88%);
          mask-image:linear-gradient(100deg,transparent 0%,transparent 44%,#000 88%);
}
:root[data-season] #home::after{ inset:-20% 0 0 0; }

/* Halloween */
:root[data-season="halloween"] body > nav::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='18' viewBox='0 0 140 18' preserveAspectRatio='none'%3E%3Cg fill='%23ff9442'%3E%3Crect width='140' height='3'/%3E%3Cpath d='M12 2c-2.6 0-4 1.6-4 4.2 0 3.4 4 7.8 4 7.8s4-4.4 4-7.8C16 3.6 14.6 2 12 2z'/%3E%3Cpath d='M38 2c-2.2 0-3.4 1.3-3.4 3.4 0 2.6 3.4 5.6 3.4 5.6s3.4-3 3.4-5.6C41.4 3.3 40.2 2 38 2z'/%3E%3Cpath d='M64 2c-3 0-4.6 1.9-4.6 5 0 4.2 4.6 9.4 4.6 9.4s4.6-5.2 4.6-9.4c0-3.1-1.6-5-4.6-5z'/%3E%3Cpath d='M92 2c-2 0-3 1.1-3 2.9 0 2.2 3 4.7 3 4.7s3-2.5 3-4.7C95 3.1 94 2 92 2z'/%3E%3Cpath d='M118 2c-2.4 0-3.8 1.5-3.8 4 0 3.2 3.8 7.2 3.8 7.2s3.8-4 3.8-7.2c0-2.5-1.4-4-3.8-4z'/%3E%3C/g%3E%3C/svg%3E");
  background-size:140px 18px; background-repeat:repeat-x; opacity:.85;
}
:root[data-season="halloween"] .vvh-header::after{
  background:rgba(255,255,255,.78); opacity:1;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='18' viewBox='0 0 140 18' preserveAspectRatio='none'%3E%3Cg fill='%23000'%3E%3Crect width='140' height='3'/%3E%3Cpath d='M12 2c-2.6 0-4 1.6-4 4.2 0 3.4 4 7.8 4 7.8s4-4.4 4-7.8C16 3.6 14.6 2 12 2z'/%3E%3Cpath d='M38 2c-2.2 0-3.4 1.3-3.4 3.4 0 2.6 3.4 5.6 3.4 5.6s3.4-3 3.4-5.6C41.4 3.3 40.2 2 38 2z'/%3E%3Cpath d='M64 2c-3 0-4.6 1.9-4.6 5 0 4.2 4.6 9.4 4.6 9.4s4.6-5.2 4.6-9.4c0-3.1-1.6-5-4.6-5z'/%3E%3Cpath d='M92 2c-2 0-3 1.1-3 2.9 0 2.2 3 4.7 3 4.7s3-2.5 3-4.7C95 3.1 94 2 92 2z'/%3E%3Cpath d='M118 2c-2.4 0-3.8 1.5-3.8 4 0 3.2 3.8 7.2 3.8 7.2s3.8-4 3.8-7.2c0-2.5-1.4-4-3.8-4z'/%3E%3C/g%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='18' viewBox='0 0 140 18' preserveAspectRatio='none'%3E%3Cg fill='%23000'%3E%3Crect width='140' height='3'/%3E%3Cpath d='M12 2c-2.6 0-4 1.6-4 4.2 0 3.4 4 7.8 4 7.8s4-4.4 4-7.8C16 3.6 14.6 2 12 2z'/%3E%3Cpath d='M38 2c-2.2 0-3.4 1.3-3.4 3.4 0 2.6 3.4 5.6 3.4 5.6s3.4-3 3.4-5.6C41.4 3.3 40.2 2 38 2z'/%3E%3Cpath d='M64 2c-3 0-4.6 1.9-4.6 5 0 4.2 4.6 9.4 4.6 9.4s4.6-5.2 4.6-9.4c0-3.1-1.6-5-4.6-5z'/%3E%3Cpath d='M92 2c-2 0-3 1.1-3 2.9 0 2.2 3 4.7 3 4.7s3-2.5 3-4.7C95 3.1 94 2 92 2z'/%3E%3Cpath d='M118 2c-2.4 0-3.8 1.5-3.8 4 0 3.2 3.8 7.2 3.8 7.2s3.8-4 3.8-7.2c0-2.5-1.4-4-3.8-4z'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-size:93px 12px; mask-size:93px 12px; -webkit-mask-repeat:repeat-x; mask-repeat:repeat-x;
}
:root[data-season="halloween"] #home::before,
:root[data-season="halloween"] #top::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='330' height='330' viewBox='0 0 330 330'%3E%3Cg transform='translate(18 34) scale(1.15)' fill='%23ff9442' fill-opacity='0.11' stroke='%23ff9442' stroke-opacity='0.11'%3E%3Cpath d='M50 44c-2.4 0-4.2 1.5-5 3.8-3-3.3-7.6-4.7-12.3-3.3.6-2.2.3-4.5-.8-6.7-1 3.3-3.3 5.5-6.4 6.7-3.3 1.2-7.1.8-10.6-.9 1.7 2.6 2.4 5.3 2 8.2-2.9-.6-5.6-.2-8.1 1.43.3.3 6 1.7 8 4 1.9 2.3 2.9 5.1 3.1 8.4 1.7-3.6 4.2-5.8 7.6-6.5 3.1-.6 6.2.2 9 2.4.6-2.8 2.1-4.8 4.4-5.7 2.3.9 3.8 2.9 4.4 5.7 2.8-2.2 5.9-3 9-2.4 3.4.7 5.9 2.9 7.6 6.5.2-3.3 1.2-6.1 3.1-8.4 2-2.3 4.7-3.7 8-4-2.5-1.6-5.2-2-8.1-1.4-.4-2.9.3-5.6 2-8.2-3.5 1.7-7.3 2.1-10.6.9-3.1-1.2-5.4-3.4-6.4-6.7-1.1 2.2-1.4 4.5-.8 6.7-4.7-1.4-9.3 0-12.3 3.3-.8-2.3-2.6-3.8-5-3.8z'/%3E%3C/g%3E%3Cg transform='translate(182 196) scale(0.78)' fill='%23ff9442' fill-opacity='0.11' stroke='%23ff9442' stroke-opacity='0.11'%3E%3Cpath d='M50 44c-2.4 0-4.2 1.5-5 3.8-3-3.3-7.6-4.7-12.3-3.3.6-2.2.3-4.5-.8-6.7-1 3.3-3.3 5.5-6.4 6.7-3.3 1.2-7.1.8-10.6-.9 1.7 2.6 2.4 5.3 2 8.2-2.9-.6-5.6-.2-8.1 1.43.3.3 6 1.7 8 4 1.9 2.3 2.9 5.1 3.1 8.4 1.7-3.6 4.2-5.8 7.6-6.5 3.1-.6 6.2.2 9 2.4.6-2.8 2.1-4.8 4.4-5.7 2.3.9 3.8 2.9 4.4 5.7 2.8-2.2 5.9-3 9-2.4 3.4.7 5.9 2.9 7.6 6.5.2-3.3 1.2-6.1 3.1-8.4 2-2.3 4.7-3.7 8-4-2.5-1.6-5.2-2-8.1-1.4-.4-2.9.3-5.6 2-8.2-3.5 1.7-7.3 2.1-10.6.9-3.1-1.2-5.4-3.4-6.4-6.7-1.1 2.2-1.4 4.5-.8 6.7-4.7-1.4-9.3 0-12.3 3.3-.8-2.3-2.6-3.8-5-3.8z'/%3E%3C/g%3E%3C/svg%3E");
  background-size:330px 330px; background-repeat:repeat;
}
:root[data-season="halloween"] #home::after{
  background-image:radial-gradient(2.5px 2.5px at 60px 40px,rgba(255,148,66,.55),transparent),radial-gradient(2px 2px at 220px 160px,rgba(176,107,245,.5),transparent),radial-gradient(1.5px 1.5px at 380px 90px,rgba(255,148,66,.4),transparent);
  background-size:460px 460px,460px 460px,300px 300px; background-repeat:repeat;
  animation:hsb-fall 34s linear infinite;
}

/* Winter & Weihnachten */
:root[data-season="winter"] body > nav::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='18' viewBox='0 0 160 18' preserveAspectRatio='none'%3E%3Cpath d='M0 2q40 9 80 0 40-9 80 0' stroke='%238ec5ff' stroke-width='1.3' fill='none' opacity='.7'/%3E%3Cpath d='M20 6.4v3' stroke='%238ec5ff' stroke-width='1.2'/%3E%3Cellipse cx='20' cy='12.0' rx='3' ry='4' fill='%23ffd27a'/%3E%3Cpath d='M40 7.6v3' stroke='%238ec5ff' stroke-width='1.2'/%3E%3Cellipse cx='40' cy='13.2' rx='3' ry='4' fill='%238ec5ff'/%3E%3Cpath d='M60 6.4v3' stroke='%238ec5ff' stroke-width='1.2'/%3E%3Cellipse cx='60' cy='12.0' rx='3' ry='4' fill='%23ffd27a'/%3E%3Cpath d='M100 6.4v3' stroke='%238ec5ff' stroke-width='1.2'/%3E%3Cellipse cx='100' cy='12.0' rx='3' ry='4' fill='%238ec5ff'/%3E%3Cpath d='M120 7.6v3' stroke='%238ec5ff' stroke-width='1.2'/%3E%3Cellipse cx='120' cy='13.2' rx='3' ry='4' fill='%23ffd27a'/%3E%3Cpath d='M140 6.4v3' stroke='%238ec5ff' stroke-width='1.2'/%3E%3Cellipse cx='140' cy='12.0' rx='3' ry='4' fill='%238ec5ff'/%3E%3C/svg%3E");
  background-size:160px 18px; background-repeat:repeat-x; opacity:.9;
}
:root[data-season="winter"] .vvh-header::after{
  background:rgba(255,255,255,.78); opacity:1;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='18' viewBox='0 0 160 18' preserveAspectRatio='none'%3E%3Cpath d='M0 2q40 9 80 0 40-9 80 0' stroke='%23000' stroke-width='1.3' fill='none' opacity='.7'/%3E%3Cpath d='M20 6.4v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='20' cy='12.0' rx='3' ry='4' fill='%23000'/%3E%3Cpath d='M40 7.6v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='40' cy='13.2' rx='3' ry='4' fill='%23000'/%3E%3Cpath d='M60 6.4v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='60' cy='12.0' rx='3' ry='4' fill='%23000'/%3E%3Cpath d='M100 6.4v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='100' cy='12.0' rx='3' ry='4' fill='%23000'/%3E%3Cpath d='M120 7.6v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='120' cy='13.2' rx='3' ry='4' fill='%23000'/%3E%3Cpath d='M140 6.4v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='140' cy='12.0' rx='3' ry='4' fill='%23000'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='18' viewBox='0 0 160 18' preserveAspectRatio='none'%3E%3Cpath d='M0 2q40 9 80 0 40-9 80 0' stroke='%23000' stroke-width='1.3' fill='none' opacity='.7'/%3E%3Cpath d='M20 6.4v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='20' cy='12.0' rx='3' ry='4' fill='%23000'/%3E%3Cpath d='M40 7.6v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='40' cy='13.2' rx='3' ry='4' fill='%23000'/%3E%3Cpath d='M60 6.4v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='60' cy='12.0' rx='3' ry='4' fill='%23000'/%3E%3Cpath d='M100 6.4v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='100' cy='12.0' rx='3' ry='4' fill='%23000'/%3E%3Cpath d='M120 7.6v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='120' cy='13.2' rx='3' ry='4' fill='%23000'/%3E%3Cpath d='M140 6.4v3' stroke='%23000' stroke-width='1.2'/%3E%3Cellipse cx='140' cy='12.0' rx='3' ry='4' fill='%23000'/%3E%3C/svg%3E");
  -webkit-mask-size:107px 12px; mask-size:107px 12px; -webkit-mask-repeat:repeat-x; mask-repeat:repeat-x;
}
:root[data-season="winter"] #home::before,
:root[data-season="winter"] #top::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='360' viewBox='0 0 360 360'%3E%3Cg opacity='.13'%3E%3Cg transform='translate(72 78) scale(1.25)'%3E%3Cg stroke='%238ec5ff' stroke-width='2.6' stroke-linecap='round' fill='none'%3E%3Cpath d='M50 22v56M26 36l48 28M74 36L26 64'/%3E%3Cpath d='M50 34l-7-7M50 34l7-7M50 66l-7 7M50 66l7 7'/%3E%3Cpath d='M37 42l-9-2M37 42l-2-9M63 58l9 2M63 58l2 9'/%3E%3Cpath d='M63 42l9-2M63 42l2-9M37 58l-9 2M37 58l-2 9'/%3E%3C/g%3E%3C/g%3E%3Cg transform='translate(256 250) scale(0.85)'%3E%3Cg stroke='%238ec5ff' stroke-width='2.6' stroke-linecap='round' fill='none'%3E%3Cpath d='M50 22v56M26 36l48 28M74 36L26 64'/%3E%3Cpath d='M50 34l-7-7M50 34l7-7M50 66l-7 7M50 66l7 7'/%3E%3Cpath d='M37 42l-9-2M37 42l-2-9M63 58l9 2M63 58l2 9'/%3E%3Cpath d='M63 42l9-2M63 42l2-9M37 58l-9 2M37 58l-2 9'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  background-size:360px 360px; background-repeat:repeat;
}
:root[data-season="winter"] #home::after{
  background-image:radial-gradient(2.5px 2.5px at 50px 60px,rgba(255,255,255,.75),transparent),radial-gradient(2px 2px at 250px 180px,rgba(255,255,255,.6),transparent),radial-gradient(1.5px 1.5px at 120px 90px,rgba(226,240,255,.5),transparent);
  background-size:420px 420px,420px 420px,260px 260px; background-repeat:repeat;
  animation:hsb-fall 24s linear infinite;
}

/* Silvester */
:root[data-season="silvester"] body > nav::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='18' viewBox='0 0 140 18' preserveAspectRatio='none'%3E%3Crect width='140' height='2.4' fill='%23ffd166' opacity='.6'/%3E%3Crect x='14' y='5' width='3' height='7' rx='1.2' fill='%23ffd166' transform='rotate(18 15.5 8.5)'/%3E%3Crect x='34' y='6' width='3' height='6' rx='1.2' fill='%23f472b6' transform='rotate(-24 35.5 9.0)'/%3E%3Crect x='70' y='5' width='3' height='8' rx='1.2' fill='%23f472b6' transform='rotate(12 71.5 9.0)'/%3E%3Crect x='106' y='6' width='3' height='7' rx='1.2' fill='%23ffd166' transform='rotate(-16 107.5 9.5)'/%3E%3Ccircle cx='52' cy='8' r='2' fill='%23ffd166'/%3E%3Ccircle cx='90' cy='9' r='1.8' fill='%23f472b6'/%3E%3Ccircle cx='126' cy='7' r='2' fill='%23ffd166'/%3E%3C/svg%3E");
  background-size:140px 18px; background-repeat:repeat-x; opacity:.9;
}
:root[data-season="silvester"] .vvh-header::after{
  background:rgba(255,255,255,.78); opacity:1;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='18' viewBox='0 0 140 18' preserveAspectRatio='none'%3E%3Crect width='140' height='2.4' fill='%23000' opacity='.6'/%3E%3Crect x='14' y='5' width='3' height='7' rx='1.2' fill='%23000' transform='rotate(18 15.5 8.5)'/%3E%3Crect x='34' y='6' width='3' height='6' rx='1.2' fill='%23000' transform='rotate(-24 35.5 9.0)'/%3E%3Crect x='70' y='5' width='3' height='8' rx='1.2' fill='%23000' transform='rotate(12 71.5 9.0)'/%3E%3Crect x='106' y='6' width='3' height='7' rx='1.2' fill='%23000' transform='rotate(-16 107.5 9.5)'/%3E%3Ccircle cx='52' cy='8' r='2' fill='%23000'/%3E%3Ccircle cx='90' cy='9' r='1.8' fill='%23000'/%3E%3Ccircle cx='126' cy='7' r='2' fill='%23000'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='18' viewBox='0 0 140 18' preserveAspectRatio='none'%3E%3Crect width='140' height='2.4' fill='%23000' opacity='.6'/%3E%3Crect x='14' y='5' width='3' height='7' rx='1.2' fill='%23000' transform='rotate(18 15.5 8.5)'/%3E%3Crect x='34' y='6' width='3' height='6' rx='1.2' fill='%23000' transform='rotate(-24 35.5 9.0)'/%3E%3Crect x='70' y='5' width='3' height='8' rx='1.2' fill='%23000' transform='rotate(12 71.5 9.0)'/%3E%3Crect x='106' y='6' width='3' height='7' rx='1.2' fill='%23000' transform='rotate(-16 107.5 9.5)'/%3E%3Ccircle cx='52' cy='8' r='2' fill='%23000'/%3E%3Ccircle cx='90' cy='9' r='1.8' fill='%23000'/%3E%3Ccircle cx='126' cy='7' r='2' fill='%23000'/%3E%3C/svg%3E");
  -webkit-mask-size:93px 12px; mask-size:93px 12px; -webkit-mask-repeat:repeat-x; mask-repeat:repeat-x;
}
:root[data-season="silvester"] #home::before,
:root[data-season="silvester"] #top::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='380' height='380' viewBox='0 0 380 380'%3E%3Cg transform='translate(82 86) scale(1.25)' fill='%23ffd166' fill-opacity='0.13' stroke='%23ffd166' stroke-opacity='0.13'%3E%3Cg stroke-linecap='round' fill='none' stroke-width='2.8'%3E%3Cpath d='M50 50V22M50 50l20-20M50 50h28M50 50l20 20M50 50v28M50 50l-20 20M50 50H22M50 50l-20-20'/%3E%3C/g%3E%3Ccircle cx='50' cy='50' r='3.6' stroke='none'/%3E%3C/g%3E%3Cg transform='translate(272 262) scale(0.85)' fill='%23ffd166' fill-opacity='0.13' stroke='%23ffd166' stroke-opacity='0.13'%3E%3Cg stroke-linecap='round' fill='none' stroke-width='2.8'%3E%3Cpath d='M50 50V22M50 50l20-20M50 50h28M50 50l20 20M50 50v28M50 50l-20 20M50 50H22M50 50l-20-20'/%3E%3C/g%3E%3Ccircle cx='50' cy='50' r='3.6' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  background-size:380px 380px; background-repeat:repeat;
}
:root[data-season="silvester"] #home::after{
  background-image:radial-gradient(2.5px 2.5px at 70px 70px,rgba(255,209,102,.6),transparent),radial-gradient(2px 2px at 230px 190px,rgba(244,114,182,.55),transparent),radial-gradient(1.5px 1.5px at 350px 110px,rgba(255,209,102,.45),transparent);
  background-size:480px 480px,480px 480px,320px 320px; background-repeat:repeat;
  animation:hsb-rise 28s linear infinite;
}

/* Ostern */
:root[data-season="ostern"] body > nav::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='18' viewBox='0 0 120 18' preserveAspectRatio='none'%3E%3Cg opacity='.95'%3E%3Cpath d='M0 2q30 7 60 0 30-7 60 0' stroke='%236ee7b7' stroke-width='1.3' fill='none' opacity='.8'/%3E%3Cpath d='M12 4.2l10-1.4-4.4 10z' fill='%236ee7b7'/%3E%3Cpath d='M34 2.2l10 .6-6 9.4z' fill='%23cbb6fd'/%3E%3Cpath d='M56 2l10 1.4-7 9z' fill='%236ee7b7'/%3E%3Cpath d='M78 3.4l10-1.2-4.6 9.8z' fill='%23cbb6fd'/%3E%3Cpath d='M100 2.2l10 .8-6 9.2z' fill='%236ee7b7'/%3E%3C/g%3E%3C/svg%3E");
  background-size:120px 18px; background-repeat:repeat-x; opacity:.9;
}
:root[data-season="ostern"] .vvh-header::after{
  background:rgba(255,255,255,.78); opacity:1;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='18' viewBox='0 0 120 18' preserveAspectRatio='none'%3E%3Cg opacity='.95'%3E%3Cpath d='M0 2q30 7 60 0 30-7 60 0' stroke='%23000' stroke-width='1.3' fill='none' opacity='.8'/%3E%3Cpath d='M12 4.2l10-1.4-4.4 10z' fill='%23000'/%3E%3Cpath d='M34 2.2l10 .6-6 9.4z' fill='%23000'/%3E%3Cpath d='M56 2l10 1.4-7 9z' fill='%23000'/%3E%3Cpath d='M78 3.4l10-1.2-4.6 9.8z' fill='%23000'/%3E%3Cpath d='M100 2.2l10 .8-6 9.2z' fill='%23000'/%3E%3C/g%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='18' viewBox='0 0 120 18' preserveAspectRatio='none'%3E%3Cg opacity='.95'%3E%3Cpath d='M0 2q30 7 60 0 30-7 60 0' stroke='%23000' stroke-width='1.3' fill='none' opacity='.8'/%3E%3Cpath d='M12 4.2l10-1.4-4.4 10z' fill='%23000'/%3E%3Cpath d='M34 2.2l10 .6-6 9.4z' fill='%23000'/%3E%3Cpath d='M56 2l10 1.4-7 9z' fill='%23000'/%3E%3Cpath d='M78 3.4l10-1.2-4.6 9.8z' fill='%23000'/%3E%3Cpath d='M100 2.2l10 .8-6 9.2z' fill='%23000'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-size:80px 12px; mask-size:80px 12px; -webkit-mask-repeat:repeat-x; mask-repeat:repeat-x;
}
:root[data-season="ostern"] #home::before,
:root[data-season="ostern"] #top::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='340' height='340' viewBox='0 0 340 340'%3E%3Cg transform='translate(74 80) scale(1.15)' fill='%236ee7b7' fill-opacity='0.11' stroke='%236ee7b7' stroke-opacity='0.11'%3E%3Cpath d='M50 20c13 0 22 17 22 31s-9 23-22 23-22-9-22-23 9-31 22-31z'/%3E%3Cpath fill='none' stroke-width='4' d='M30 52h40M30 64h40'/%3E%3C/g%3E%3Cg transform='translate(244 238) scale(0.8)' fill='%236ee7b7' fill-opacity='0.11' stroke='%236ee7b7' stroke-opacity='0.11'%3E%3Cpath d='M50 20c13 0 22 17 22 31s-9 23-22 23-22-9-22-23 9-31 22-31z'/%3E%3Cpath fill='none' stroke-width='4' d='M30 52h40M30 64h40'/%3E%3C/g%3E%3C/svg%3E");
  background-size:340px 340px; background-repeat:repeat;
}
:root[data-season="ostern"] #home::after{
  background-image:radial-gradient(2.5px 2.5px at 70px 50px,rgba(110,231,183,.5),transparent),radial-gradient(2px 2px at 240px 200px,rgba(203,182,253,.5),transparent),radial-gradient(1.5px 1.5px at 150px 120px,rgba(110,231,183,.35),transparent);
  background-size:440px 440px,440px 440px,280px 280px; background-repeat:repeat;
  animation:hsb-fall 40s linear infinite;
}

@keyframes hsb-fall{
  from{ background-position:0 0, 160px 0, 80px 0; }
  to  { background-position:0 920px, 160px 920px, 80px 560px; }
}
@keyframes hsb-rise{
  from{ background-position:0 0, 160px 0, 80px 0; }
  to  { background-position:0 -960px, 160px -960px, 80px -640px; }
}
@media (prefers-reduced-motion: reduce){
  :root[data-season] #home::after{ animation:none; }
}


/* ---------- Logo-Signet der VVH-Seite ----------
   Die Farbe des Signets steht als festes Attribut im SVG und folgt
   deshalb nicht den Variablen. Hier wird sie nachgezogen.          */
:root[data-season] .vvh-header svg rect[fill="#0e7c8c"],
:root[data-season] .vvh-footer svg rect[fill="#0e7c8c"]{ fill:var(--vvh-teal); }

/* =====================================================================
   MOTIVE ÜBER DIE SEITE VERTEILT
   Je Abschnitt ein einzelnes Motiv als Hintergrundbild. Die Farbe
   der Flaeche bleibt unangetastet, nur background-image kommt dazu.
   ===================================================================== */

:root[data-season] #server{ background-image:var(--sm1) !important; background-repeat:no-repeat !important; background-position:right 5% top 14% !important; background-size:160px !important; }
:root[data-season] #features{ background-image:var(--sm2); background-repeat:no-repeat; background-position:left 4% bottom 10%; background-size:150px; }
:root[data-season] #trailer{ background-image:var(--sm3); background-repeat:no-repeat; background-position:right 6% bottom 12%; background-size:170px; }
:root[data-season] #gallery{ background-image:var(--sm1); background-repeat:no-repeat; background-position:left 5% top 10%; background-size:145px; }
:root[data-season] #news{ background-image:var(--sm2); background-repeat:no-repeat; background-position:right 5% top 16%; background-size:155px; }
:root[data-season] #karte{ background-image:var(--sm3) !important; background-repeat:no-repeat !important; background-position:left 4% top 12% !important; background-size:150px !important; }
:root[data-season] #community{ background-image:var(--sm1); background-repeat:no-repeat; background-position:right 6% bottom 10%; background-size:165px; }
:root[data-season] #faq{ background-image:var(--sm4); background-repeat:no-repeat; background-position:left 5% bottom 12%; background-size:150px; }
:root[data-season] #spenden{ background-image:var(--sm2); background-repeat:no-repeat; background-position:right 5% top 12%; background-size:160px; }

/* VVH-Seite: nur zwei Abschnitte, zurueckhaltend */
:root[data-season] #netz{ background-image:var(--smv1); background-repeat:no-repeat; background-position:right 4% top 10%; background-size:130px; }
:root[data-season] #linien{ background-image:var(--smv3); background-repeat:no-repeat; background-position:left 3% bottom 8%; background-size:120px; }

@media (max-width:860px){
  :root[data-season] #server,:root[data-season] #features,:root[data-season] #trailer,
  :root[data-season] #gallery,:root[data-season] #news,:root[data-season] #karte,
  :root[data-season] #community,:root[data-season] #faq,:root[data-season] #spenden,
  :root[data-season] #netz,:root[data-season] #linien{ background-size:96px; }
}