/* Event seasons layer onto whichever audience theme is chosen.
   The audience keeps its type, shapes, houses and buttons; the season brings
   the sky, the lights on the string, falling weather, a page tint and props.
   html[data-theme] is set automatically from the local date (theme-runtime.mjs). */

:root{--event-tint:transparent;--event-accent:var(--dm-accent);--event-mix:0%}
:root[data-theme="halloween"][data-theme][data-theme][data-theme]{--event-tint:#7a3cc4;--event-accent:#ff8a2a;--event-mix:13%;--event-label-ink:#3b1a5c;
  --scene-sky-top:#3a2160;--scene-sky-bottom:#f29a5c;--scene-orb:#fff1c9;--scene-ground:#4a3a63;--scene-ground-2:#5b4a78;--scene-bead-1:#ff8a2a;--scene-bead-2:#a46ae6;--scene-bead-3:#9be37a;--scene-line:#1e1430}
:root[data-theme="diwali"][data-theme][data-theme][data-theme]{--event-tint:#f2a52a;--event-accent:#ffb347;--event-mix:14%;--event-label-ink:#4a2a00;
  --scene-sky-top:#241a5c;--scene-sky-bottom:#9a4b8f;--scene-orb:#ffe7a8;--scene-ground:#3b2a63;--scene-ground-2:#4d3778;--scene-bead-1:#ffcf5a;--scene-bead-2:#ff8f3c;--scene-bead-3:#ffe6a0;--scene-line:#ffd27a}
:root[data-theme="christmas"][data-theme][data-theme][data-theme]{--event-tint:#c4323a;--event-accent:#e7b04b;--event-mix:9%;--event-label-ink:#5a1015;
  --scene-sky-top:#cfe1ee;--scene-sky-bottom:#f6f3ec;--scene-orb:#fff6d9;--scene-ground:#f4f7fb;--scene-ground-2:#dde7f0;--scene-bead-1:#d6303a;--scene-bead-2:#2f8a57;--scene-bead-3:#f2c14e;--scene-line:#2a3a33}
:root[data-theme="valentine"][data-theme][data-theme][data-theme]{--event-tint:#e8517a;--event-accent:#ff9ab0;--event-mix:12%;--event-label-ink:#5c0f2c;
  --scene-sky-top:#ffc9d6;--scene-sky-bottom:#fff0e8;--scene-orb:#fff4f6;--scene-ground:#f6b3c4;--scene-ground-2:#ec9db2;--scene-bead-1:#e8517a;--scene-bead-2:#ffffff;--scene-bead-3:#ff9ab0;--scene-line:#5c0f2c}
:root[data-theme="newyear"][data-theme][data-theme][data-theme]{--event-tint:#3a4ea8;--event-accent:#e2c066;--event-mix:12%;--event-label-ink:#1a2350;
  --scene-sky-top:#0f1a40;--scene-sky-bottom:#3a4ea8;--scene-orb:#f6efd8;--scene-ground:#1d2a55;--scene-ground-2:#26356b;--scene-bead-1:#e2c066;--scene-bead-2:#ffffff;--scene-bead-3:#8fb3ff;--scene-line:#e2c066}
:root[data-theme="lunar"][data-theme][data-theme][data-theme]{--event-tint:#c8262e;--event-accent:#f2c14e;--event-mix:12%;--event-label-ink:#5a0d12;
  --scene-sky-top:#f5b48a;--scene-sky-bottom:#fde6c8;--scene-orb:#ffe9b0;--scene-ground:#c96b4f;--scene-ground-2:#b85a40;--scene-bead-1:#d62b31;--scene-bead-2:#f2c14e;--scene-bead-3:#d62b31;--scene-line:#5a0d12}
:root[data-theme="easter"][data-theme][data-theme][data-theme]{--event-tint:#8fcf7a;--event-accent:#f6c6e0;--event-mix:12%;--event-label-ink:#24461a;
  --scene-sky-top:#cdebf7;--scene-sky-bottom:#fbf5e3;--scene-orb:#fff1a8;--scene-ground:#a7dd8f;--scene-ground-2:#8fcf7a;--scene-bead-1:#f6c6e0;--scene-bead-2:#c9b7f2;--scene-bead-3:#fff1a8;--scene-line:#3d6b2f}
:root[data-theme="eid"][data-theme][data-theme][data-theme]{--event-tint:#1f7a6a;--event-accent:#e8c573;--event-mix:12%;--event-label-ink:#0b3a32;
  --scene-sky-top:#0d3b45;--scene-sky-bottom:#2f7b7a;--scene-orb:#fff1c4;--scene-ground:#195449;--scene-ground-2:#1f6658;--scene-bead-1:#e8c573;--scene-bead-2:#fff1c4;--scene-bead-3:#e8c573;--scene-line:#e8c573}
:root[data-theme="ramadan"][data-theme][data-theme][data-theme]{--event-tint:#3c4f86;--event-accent:#e8c573;--event-mix:12%;--event-label-ink:#15204a;
  --scene-sky-top:#121c40;--scene-sky-bottom:#3c4f86;--scene-orb:#fff1c4;--scene-ground:#1e2a55;--scene-ground-2:#27366a;--scene-bead-1:#e8c573;--scene-bead-2:#fff1c4;--scene-bead-3:#e8c573;--scene-line:#e8c573}
:root[data-theme="national"][data-theme][data-theme][data-theme]{--event-tint:#2f5fb3;--event-accent:#e0473f;--event-mix:10%;--event-label-ink:#13264a;
  --scene-bead-1:#e0473f;--scene-bead-2:#ffffff;--scene-bead-3:#2f5fb3}
:root[data-theme="birthday"][data-theme][data-theme][data-theme]{--event-tint:#a07ad6;--event-accent:#ffc56b;--event-mix:11%;--event-label-ink:#3a2266;
  --scene-bead-1:#ffc56b;--scene-bead-2:#a07ad6;--scene-bead-3:#7fd6c2}
/* Night skies for daytime-bright seasons. */
:root[data-mode="dark"][data-theme="christmas"][data-theme][data-theme][data-theme]{--scene-sky-top:#0d1d33;--scene-sky-bottom:#284766;--scene-ground:#c9d6e4;--scene-ground-2:#9fb3c8}
:root[data-mode="dark"][data-theme="valentine"][data-theme][data-theme][data-theme]{--scene-sky-top:#2a0f24;--scene-sky-bottom:#6a2448;--scene-ground:#4a1d36;--scene-ground-2:#3a1529}
:root[data-mode="dark"][data-theme="lunar"][data-theme][data-theme][data-theme]{--scene-sky-top:#2a0d12;--scene-sky-bottom:#6a2028;--scene-ground:#4a1a1d;--scene-ground-2:#3a1417}
:root[data-mode="dark"][data-theme="easter"][data-theme][data-theme][data-theme]{--scene-sky-top:#14243a;--scene-sky-bottom:#35506b;--scene-ground:#2c4a2a;--scene-ground-2:#233b22}

/* Page, top bar and hero take a seasonal tint so the whole site feels the occasion. */
:root:not([data-theme="default"]){--dm-body-bg:color-mix(in srgb,var(--dm-page) calc(100% - var(--event-mix)),var(--event-tint));--dm-topbar-bg:color-mix(in srgb,color-mix(in srgb,var(--dm-page) calc(100% - var(--event-mix)),var(--event-tint)) 86%,transparent)}
:root:not([data-theme="default"]) .dm-topbar{border-bottom-color:color-mix(in srgb,var(--event-tint) 28%,var(--dm-line))}
:root:not([data-theme="default"]) body.dm-home .welcome.dm-hero{background:color-mix(in srgb,var(--dm-surface) calc(100% - var(--event-mix)),var(--event-tint));border-color:color-mix(in srgb,var(--event-tint) 35%,var(--dm-line))}
:root:not([data-theme="default"]) .dm-hero-eyebrow{background:color-mix(in srgb,var(--event-accent) 26%,var(--dm-surface))}
:root:not([data-theme="default"]) .dm-hero-eyebrow::before{background:var(--event-accent)}
html[data-mode="dark"]:not([data-theme="default"]) .dm-hero-eyebrow{color:var(--dm-ink)!important}

/* A crescent for Eid and Ramadan: a sky-coloured bite out of the moon. */
.dm-scene .sc-orb-bite{display:none;fill:color-mix(in srgb,var(--scene-sky-top) 72%,var(--scene-sky-bottom))}
:root:is([data-theme="eid"],[data-theme="ramadan"]) .dm-scene .sc-orb-bite{display:block}
:root:is([data-theme="diwali"],[data-theme="eid"],[data-theme="ramadan"],[data-theme="newyear"],[data-theme="halloween"]) .dm-scene .sc-beads circle{filter:drop-shadow(0 0 6px var(--scene-bead-1))}
:root:is([data-theme="halloween"],[data-theme="diwali"],[data-theme="newyear"],[data-theme="eid"],[data-theme="ramadan"]) .dm-scene .sc-stars{opacity:.9}
:root:is([data-theme="halloween"],[data-theme="diwali"],[data-theme="newyear"],[data-theme="eid"],[data-theme="ramadan"]) .dm-scene .sc-clouds{opacity:.12}
:root:is([data-theme="halloween"],[data-theme="diwali"],[data-theme="newyear"],[data-theme="eid"],[data-theme="ramadan"]) .dm-scene .sc-window{filter:drop-shadow(0 0 10px var(--scene-window))}
:root[data-theme="christmas"] .dm-scene .sc-roof-a,:root[data-theme="christmas"] .dm-scene .sc-roof-b{stroke-dasharray:none;filter:drop-shadow(0 -3px 0 #fff)}

/* Falling (or rising) weather over the hero art. */
.dm-hero-art::after{content:"";position:absolute;inset:0;pointer-events:none;background-repeat:repeat;opacity:0;transition:opacity .6s ease}
:root[data-theme="christmas"] .dm-hero-art::after{opacity:.95;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cg fill='%23fff'%3E%3Ccircle cx='14' cy='20' r='2.6'/%3E%3Ccircle cx='70' cy='8' r='1.8'/%3E%3Ccircle cx='120' cy='40' r='3'/%3E%3Ccircle cx='160' cy='14' r='2'/%3E%3Ccircle cx='40' cy='90' r='2.2'/%3E%3Ccircle cx='96' cy='110' r='1.6'/%3E%3Ccircle cx='150' cy='96' r='2.6'/%3E%3Ccircle cx='24' cy='150' r='1.8'/%3E%3Ccircle cx='82' cy='160' r='2.8'/%3E%3Ccircle cx='136' cy='150' r='2'/%3E%3C/g%3E%3C/svg%3E");background-size:180px 180px}
:root[data-theme="halloween"] .dm-hero-art::after{opacity:.9;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cg fill='%23ff8a2a'%3E%3Cpath d='M20 30c6-6 14-2 12 6-6 2-10-1-12-6Z'/%3E%3Cpath d='M150 70c7-4 13 2 10 9-7 1-10-4-10-9Z'/%3E%3C/g%3E%3Cg fill='%23a46ae6'%3E%3Cpath d='M90 140c6-6 14-2 12 6-6 2-10-1-12-6Z'/%3E%3C/g%3E%3Cg fill='%231e1430'%3E%3Cpath d='M170 160c4-5 9-5 12 0 3-5 8-5 12 0-5 1-9 4-12 8-3-4-7-7-12-8Z'/%3E%3Cpath d='M40 190c3-4 7-4 10 0 3-4 7-4 10 0-4 1-7 3-10 6-3-3-6-5-10-6Z'/%3E%3C/g%3E%3C/svg%3E");background-size:220px 220px}
:root[data-theme="valentine"] .dm-hero-art::after{opacity:.85;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cg fill='%23e8517a'%3E%3Cpath d='M30 40 22 32c-5-5 2-12 8-7 6-5 13 2 8 7Z'/%3E%3Cpath d='M140 90l-6-6c-4-4 2-9 6-5 4-4 10 1 6 5Z'/%3E%3C/g%3E%3Cg fill='%23ffffff'%3E%3Cpath d='M80 160l-5-5c-3-3 1-8 5-4 4-4 8 1 5 4Z'/%3E%3Cpath d='M170 30l-4-4c-3-3 1-6 4-3 3-3 7 0 4 3Z'/%3E%3C/g%3E%3C/svg%3E");background-size:200px 200px}
:root:is([data-theme="newyear"],[data-theme="birthday"]) .dm-hero-art::after{opacity:.9;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cg%3E%3Crect x='20' y='30' width='8' height='4' rx='1' fill='%23e2c066' transform='rotate(30 24 32)'/%3E%3Crect x='120' y='20' width='8' height='4' rx='1' fill='%23ff9ab0' transform='rotate(-20 124 22)'/%3E%3Crect x='70' y='100' width='8' height='4' rx='1' fill='%238fb3ff' transform='rotate(60 74 102)'/%3E%3Crect x='160' y='120' width='8' height='4' rx='1' fill='%23e2c066' transform='rotate(10 164 122)'/%3E%3Ccircle cx='40' cy='160' r='2.4' fill='%23fff'/%3E%3Ccircle cx='110' cy='170' r='2' fill='%23e2c066'/%3E%3C/g%3E%3C/svg%3E");background-size:200px 200px}
:root:is([data-theme="diwali"],[data-theme="lunar"],[data-theme="eid"],[data-theme="ramadan"]) .dm-hero-art::after{opacity:.9;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cg fill='%23ffd27a'%3E%3Ccircle cx='30' cy='40' r='2'/%3E%3Ccircle cx='150' cy='30' r='1.6'/%3E%3Ccircle cx='90' cy='110' r='2.2'/%3E%3Ccircle cx='170' cy='140' r='1.6'/%3E%3Ccircle cx='50' cy='170' r='1.8'/%3E%3C/g%3E%3C/svg%3E");background-size:200px 200px}
:root[data-theme="easter"] .dm-hero-art::after{opacity:.85;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cg%3E%3Cellipse cx='30' cy='40' rx='6' ry='3.5' fill='%23f6c6e0' transform='rotate(30 30 40)'/%3E%3Cellipse cx='140' cy='80' rx='5' ry='3' fill='%23ffffff' transform='rotate(-20 140 80)'/%3E%3Cellipse cx='80' cy='150' rx='6' ry='3.5' fill='%23c9b7f2' transform='rotate(60 80 150)'/%3E%3C/g%3E%3C/svg%3E");background-size:200px 200px}
@media (prefers-reduced-motion:no-preference){
  :root:is([data-theme="christmas"],[data-theme="halloween"],[data-theme="valentine"],[data-theme="easter"],[data-theme="newyear"],[data-theme="birthday"]) .dm-hero-art::after{animation:dm-season-fall 16s linear infinite}
  :root:is([data-theme="diwali"],[data-theme="lunar"],[data-theme="eid"],[data-theme="ramadan"]) .dm-hero-art::after{animation:dm-season-rise 18s linear infinite}
}
@keyframes dm-season-fall{from{background-position:0 0}to{background-position:-40px 220px}}
@keyframes dm-season-rise{from{background-position:0 0}to{background-position:30px -200px}}

/* The original event props sit on the hero artwork. */
body.dm-home .dm-hero .event-decoration--hero{position:absolute;grid-area:auto;inset:auto 18px auto auto;top:16px;width:clamp(130px,16vw,200px);height:clamp(100px,12vw,150px);margin:0;z-index:2;filter:drop-shadow(0 10px 18px rgba(0,0,0,.18))}
@media (max-width:899px){body.dm-home .dm-hero .event-decoration--hero{top:10px;right:10px;width:120px;height:92px}}

/* The season banner under the top bar. */
body.dm-app #event-ribbon.event-ribbon{display:flex;align-items:center;gap:12px;max-width:1320px;margin:12px auto 0;padding:10px 16px;box-sizing:border-box;width:calc(100% - 2 * clamp(16px,3.6vw,44px));border:0;border-radius:var(--dm-radius-md);background:color-mix(in srgb,var(--event-accent) 22%,var(--dm-surface));color:var(--event-label-ink,var(--dm-ink));font:600 .9rem/1.3 var(--dm-body);overflow:hidden}
body.dm-app #event-ribbon strong{font-weight:750}
body.dm-app #event-ribbon small{font-size:.82rem;color:inherit;opacity:.8}
body.dm-app #event-ribbon .event-decoration--ribbon{position:relative;inset:auto;margin-left:auto;flex:0 0 72px;width:72px;height:48px}
html[data-mode="dark"] body.dm-app #event-ribbon.event-ribbon{background:color-mix(in srgb,var(--event-accent) 20%,var(--dm-surface));color:var(--dm-ink)}
body.dm-home #event-tag{display:inline-flex!important;align-items:center;gap:.4em;margin-bottom:8px;padding:.4em .75em;border-radius:999px;background:color-mix(in srgb,var(--event-accent) 24%,var(--dm-surface));color:var(--dm-ink);font:700 .76rem/1 var(--dm-body);letter-spacing:.02em}
:root[data-theme="default"] body.dm-home #event-tag{display:none!important}