/* AI Magic Adventskalender / modern winter edition 2.0
   No external fonts, third-party graphics or scripts. Mobile-first. */
:root {
  color-scheme: dark;
  --night:#071326;
  --deep:#091c2b;
  --winter:#a2d4d5;
  --ivory:#fff9ed;
  --gold:#f6d69b;
  --gold-bright:#ffeac2;
  --gold-muted:#ccad78;
  --font-ui:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --font-display:"Iowan Old Style","Baskerville","Palatino Linotype",Georgia,serif;
}
* {box-sizing:border-box}
html {min-height:100%; background:var(--night)}
body {min-height:100%; margin:0; font-family:var(--font-ui); -webkit-tap-highlight-color:transparent}
button,input {font:inherit}
button {cursor:pointer}
button:focus-visible,a:focus-visible,input:focus-visible {outline:3px solid #f9d58c;outline-offset:3px}
.sr-only {position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.winter-scene {
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:clamp(17px,3.6vh,38px);
  min-height:100svh;padding:clamp(24px,5vh,50px) clamp(13px,3.4vw,50px) clamp(30px,5.8vh,60px);
  background:linear-gradient(180deg,rgba(3,13,28,.22),rgba(7,20,33,.48) 67%,rgba(6,15,27,.26)), url('scenery-lively.svg') center center/cover no-repeat, #081a2c;
  color:var(--ivory);
}
.winter-scene::before{
  content:"";pointer-events:none;position:absolute;inset:0;z-index:-1;
  background:radial-gradient(ellipse 63% 46% at 48% 44%,rgba(12,37,51,.36),transparent 85%),
    radial-gradient(ellipse 90% 65% at 50% 65%,transparent 20%,rgba(3,10,22,.53) 100%),
    linear-gradient(90deg,rgba(4,16,30,.27),transparent 23% 75%,rgba(4,16,30,.27));
}
.winter-scene::after{
  content:"";pointer-events:none;position:absolute;inset:11px;z-index:3;
  border:1px solid rgba(255,219,154,.24);border-radius:24px;
  box-shadow:inset 0 0 0 1px rgba(255,241,210,.04),0 0 60px rgba(10,22,34,.1);
}
.sky-glow{position:absolute;pointer-events:none;z-index:-1;inset:-5% 6% auto;height:50%;background:radial-gradient(ellipse,rgba(94,171,172,.13),transparent 68%);filter:blur(36px)}
.ambient-orbit{position:absolute;pointer-events:none;top:clamp(50px,9vw,120px);left:50%;transform:translateX(-50%);width:min(82vw,680px);aspect-ratio:1;border:1px solid rgba(226,197,140,.08);border-radius:50%;box-shadow:0 0 130px 50px rgba(73,139,147,.08),inset 0 0 90px rgba(118,181,176,.06)}
.light-rays{position:absolute;pointer-events:none;z-index:-1;top:-22%;left:25%;width:50%;height:70%;background:conic-gradient(from 90deg at 50% 16%,transparent,rgba(136,195,193,.09) 23deg,transparent 39deg,rgba(203,225,213,.06) 74deg,transparent 91deg);filter:blur(25px);animation:rayDrift 22s ease-in-out infinite alternate}
@keyframes rayDrift{to{transform:translateX(-2%) rotate(10deg);opacity:.7}}
.masthead{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;filter:drop-shadow(0 8px 18px rgba(0,0,0,.28))}
.brand-emblem{position:relative;display:grid;place-items:center;width:clamp(30px,4.1vw,46px);height:clamp(30px,4.1vw,46px);margin-bottom:clamp(10px,1.8vh,18px);border:1px solid rgba(251,219,161,.65);border-radius:50%;background:radial-gradient(circle,rgba(238,195,123,.28),rgba(238,195,123,.03) 70%);box-shadow:0 0 28px rgba(242,196,122,.18)}
.brand-emblem::before,.brand-emblem::after{content:"";position:absolute;inset:-6px;border:1px solid rgba(251,219,161,.22);border-radius:50%}.brand-emblem::after{inset:5px;border-color:rgba(251,219,161,.24)}
.brand-emblem span{font-size:clamp(17px,2.2vw,25px);color:#ffe7b4;text-shadow:0 0 18px rgba(255,220,150,.8);animation:starBreath 5s ease-in-out infinite}
@keyframes starBreath{50%{transform:scale(1.14) rotate(14deg);filter:brightness(1.2)}}
.eyebrow{color:#e9c68e;letter-spacing:clamp(.32em,.7vw,.55em);padding-left:.42em;font-size:clamp(.6rem,.95vw,.78rem);font-weight:750;text-shadow:0 2px 14px rgba(0,0,0,.3)}
.masthead h1{font:normal 500 clamp(2.18rem,5.5vw,5.5rem)/1.09 var(--font-display);letter-spacing:-.035em;margin:8px 0 9px;color:var(--ivory);text-wrap:balance;text-shadow:0 4px 26px rgba(0,0,0,.36),0 0 32px rgba(255,231,188,.18)}
.title-ornament{display:flex;justify-content:center;align-items:center;gap:17px;color:var(--gold);font-size:17px;text-shadow:0 0 16px rgba(247,204,136,.5)}
.title-ornament span{width:clamp(40px,9vw,110px);height:1px;background:linear-gradient(90deg,transparent,rgba(236,206,152,.82))}.title-ornament span:last-child{transform:rotate(180deg)}
.doors{position:relative;z-index:2;width:min(100%,1150px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(8px,2.1vw,15px);align-items:center;justify-content:center;filter:drop-shadow(0 15px 22px rgba(0,10,22,.2))}
.door-tile{
  --tile-h:clamp(82px,24vw,133px);
  position:relative;display:block;min-width:0;width:100%;height:var(--tile-h);
  padding:0;border:0;border-radius:clamp(14px,2.5vw,24px);background:transparent;
  perspective:800px;transform-style:preserve-3d;touch-action:manipulation;
  animation:tileAppear .58s cubic-bezier(.21,.7,.32,1) both;animation-delay:calc(var(--order)*17ms);
  transition:transform .2s ease, filter .2s ease;
}
@keyframes tileAppear{from{opacity:0;transform:translateY(13px) scale(.955)}to{opacity:1;transform:translateY(0) scale(1)}}
.door-tile:hover:not(:disabled){transform:translateY(-5px);filter:brightness(1.16)}
.door-tile:active:not(:disabled){transform:translateY(-1px) scale(.985)}
.door-tile:disabled{cursor:not-allowed}
.door-frame{position:absolute;inset:0;display:block;border-radius:inherit;border:1px solid rgba(250,221,172,.29);background:linear-gradient(147deg,rgba(243,224,188,.21),rgba(81,126,139,.08) 41%,rgba(244,212,162,.14));box-shadow:0 12px 22px rgba(0,9,20,.22),inset 0 1px 0 rgba(255,242,214,.24),inset 0 0 0 1px rgba(5,16,31,.47);transform-style:preserve-3d}
.door-interior{position:absolute;inset:3px;display:grid;place-items:center;border-radius:inherit;background:radial-gradient(circle,rgba(255,234,176,.9),rgba(224,178,105,.42) 27%,rgba(23,52,65,.94) 75%);font-size:clamp(27px,5vw,42px);color:#fff4cc;text-shadow:0 0 24px #ffe1a0;box-shadow:inset 0 0 35px rgba(245,204,133,.24)}
.door-panel{position:absolute;inset:2px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;border-radius:clamp(12px,2.4vw,22px);border:1px solid rgba(255,230,183,.16);backface-visibility:hidden;transform-style:preserve-3d;transform-origin:0 center;
 background:linear-gradient(145deg,rgba(76,126,143,.58),rgba(25,57,78,.88) 43%,rgba(15,37,58,.96) 96%);
 box-shadow:inset 0 1px 0 rgba(248,230,193,.25),inset 0 -15px 30px rgba(4,14,28,.2);
 transition:transform .78s cubic-bezier(.2,.61,.14,1),filter .24s ease;
}
.door-tile:nth-child(4n+2) .door-panel{background:linear-gradient(147deg,rgba(72,109,128,.63),rgba(30,62,79,.85) 54%,rgba(12,36,58,.95))}
.door-tile:nth-child(4n+3) .door-panel{background:linear-gradient(145deg,rgba(69,111,121,.65),rgba(25,63,73,.88) 50%,rgba(12,41,54,.94))}
.door-tile:nth-child(4n+4) .door-panel{background:linear-gradient(147deg,rgba(78,104,133,.7),rgba(26,56,81,.88) 50%,rgba(16,34,62,.96))}
.door-panel::before{content:"";position:absolute;inset:4px;border:1px solid rgba(240,219,181,.095);border-radius:clamp(9px,2vw,17px);pointer-events:none}
.door-panel::after{content:"";position:absolute;top:0;left:-110%;width:68%;height:100%;transform:skewX(-19deg);background:linear-gradient(90deg,transparent,rgba(250,236,204,.1),transparent);transition:left .7s ease;pointer-events:none}
.door-tile:hover:not(:disabled) .door-panel::after{left:130%}
.door-motif{position:absolute;top:clamp(8px,1.8vw,17px);left:clamp(9px,1.75vw,17px);font-size:clamp(10px,1.7vw,16px);line-height:1;color:rgba(255,222,165,.72);text-shadow:0 0 9px rgba(255,218,152,.24)}
.door-day{font:500 clamp(2.2rem,6.6vw,4.6rem)/1 var(--font-display);letter-spacing:-.09em;padding-right:.1em;font-variant-numeric:lining-nums tabular-nums;color:#fff1cf;text-shadow:0 3px 19px rgba(5,15,29,.32),0 0 18px rgba(255,218,151,.12)}
.door-corners{position:absolute;bottom:9px;left:clamp(9px,1.8vw,17px);font-size:clamp(8px,1.2vw,12px);color:rgba(255,227,172,.38)}
.door-status{position:absolute;right:clamp(10px,1.8vw,17px);bottom:clamp(10px,1.8vw,17px);width:7px;height:7px;border-radius:50%;background:#f1dba9;box-shadow:0 0 0 3px rgba(243,206,151,.09),0 0 13px rgba(243,206,151,.34);opacity:.78}
.door-tile.is-locked .door-panel{filter:saturate(.54) brightness(.83)}
.door-tile.is-locked .door-day{color:#d8e4e6;text-shadow:0 3px 17px rgba(4,11,24,.35)}
.door-tile.is-locked .door-status{width:10px;height:8px;border-radius:2px;background:transparent;border:1.5px solid rgba(236,232,213,.68);box-shadow:none;opacity:.8}
.door-tile.is-locked .door-status::before{content:"";position:absolute;left:1.7px;top:-6px;width:4px;height:5px;border:1.5px solid rgba(236,232,213,.7);border-radius:5px 5px 0 0;border-bottom:0}
.door-tile.is-visited .door-frame{border-color:rgba(249,220,162,.64);box-shadow:0 0 0 1px rgba(255,226,176,.14),0 7px 25px rgba(233,192,109,.13),inset 0 1px 0 rgba(255,246,221,.36)}
.door-tile.is-visited .door-status{background:#b6e9cf;box-shadow:0 0 12px rgba(157,240,202,.5)}
.door-tile.is-today .door-frame{animation:todayGlow 3.2s ease-in-out infinite}
@keyframes todayGlow{50%{border-color:rgba(255,227,176,.98);box-shadow:0 0 0 1px rgba(255,227,176,.3),0 0 26px rgba(247,190,100,.4),inset 0 1px 0 rgba(255,242,213,.6)}}
.door-tile.is-opening{z-index:12;filter:drop-shadow(0 0 12px rgba(245,197,117,.32))}
.door-tile.is-opening .door-panel{transform:rotateY(-112deg);overflow:visible}
.door-tile.is-opening .door-day,.door-tile.is-opening .door-motif,.door-tile.is-opening .door-corners,.door-tile.is-opening .door-status{opacity:0;transition:opacity .2s}
.snowfall{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}.snowfall--front{z-index:3}.snowflake{position:absolute;left:var(--left);top:-5%;width:var(--size);height:var(--size);border-radius:50%;opacity:var(--opacity);background:#fff9e7;box-shadow:0 0 5px #effffb;animation:fall var(--duration) linear var(--delay) infinite}.snowfall--back .snowflake{filter:blur(.7px)}
@keyframes fall{from{transform:translate3d(0,-24px,0)}to{transform:translate3d(var(--drift),105vh,0)}}
/* Accessible, cinematic sheet — all content in the same design language */
.content-dialog{padding:0;border:1px solid rgba(245,207,147,.67);width:min(92vw,690px);max-width:690px;max-height:min(89svh,940px);border-radius:25px;color:#f6f3e9;background:#10293b;overflow:auto;overscroll-behavior:contain;box-shadow:0 35px 110px rgba(0,0,0,.71),0 0 0 5px rgba(184,171,143,.08)}
.content-dialog::backdrop{background:rgba(3,9,19,.79);backdrop-filter:blur(13px)}
.content-dialog[open]{animation:modalAppear .3s cubic-bezier(.21,.76,.25,1) both}
@keyframes modalAppear{from{opacity:0;transform:translateY(18px) scale(.965)}to{opacity:1;transform:translateY(0) scale(1)}}
.dialog-shell{position:relative;min-height:310px;border-radius:24px;padding:clamp(38px,5vw,56px) clamp(22px,5vw,47px) clamp(30px,5vw,48px);
  background:radial-gradient(circle at 100% -2%,rgba(249,208,140,.13),transparent 40%),
             radial-gradient(circle at 0 96%,rgba(72,144,144,.14),transparent 48%),
             linear-gradient(149deg,#19384a,#0e2538 53%,#0c2133);
  box-shadow:inset 0 1px 0 rgba(255,249,218,.13)}
.dialog-shell::after{content:"";pointer-events:none;position:absolute;inset:10px;border:1px solid rgba(225,197,151,.14);border-radius:17px}
.close-button{position:sticky;z-index:5;float:right;top:0;margin:-29px -28px 0 0;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;color:#faf5e8;background:rgba(221,239,235,.09);border:1px solid rgba(237,228,210,.22);box-shadow:0 3px 16px rgba(0,0,0,.13);transition:background .2s,transform .2s}
.close-button:hover{background:rgba(246,215,155,.18);transform:scale(1.05)}
.dialog-sparkle{clear:both;text-align:center;color:#e8be7a;letter-spacing:.48em;font-size:1.12rem;opacity:.89}
.dialog-day{margin:16px 0 11px;text-align:center;color:#dfc38e;font-size:.72rem;font-weight:750;letter-spacing:.23em;text-transform:uppercase}
.dialog-shell h2{text-align:center;font:500 clamp(1.7rem,5.4vw,2.75rem)/1.16 var(--font-display);letter-spacing:-.023em;color:#fff5df;margin:0 0 clamp(24px,4vw,32px);text-wrap:balance}
.dialog-content{color:#e6edf0;font-size:clamp(1rem,2.6vw,1.08rem);line-height:1.74;overflow-wrap:anywhere}
.dialog-content p{margin:0 0 17px}.dialog-content p:last-child{margin-bottom:0}
.dialog-content .body-text.is-lyrics{white-space:pre-line;text-align:center;font-family:var(--font-display);font-size:1.17rem;line-height:1.88;background:rgba(255,251,229,.065);border:1px solid rgba(242,212,163,.18);padding:20px;border-radius:17px;color:#fff4db}
.external-link,.action-button,.game-button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;text-align:center;gap:9px;padding:12px 18px;min-height:46px;border:1px solid rgba(250,217,164,.5);background:linear-gradient(125deg,#f6dba8,#dcb77e);color:#172c38;font-weight:750;border-radius:12px;transition:background .2s,transform .2s,filter .2s;box-shadow:0 8px 25px rgba(0,0,0,.15)}
.external-link:hover,.action-button:hover,.game-button:hover{filter:brightness(1.09);transform:translateY(-1px)}.external-link{margin-top:20px;width:100%}.muted{font-size:.88rem;color:#c5d1d3}

.game-card{border:1px solid #e2cfb2;background:rgba(255,255,255,.6);border-radius:14px;padding:17px;margin-top:16px}.game-card h3{margin:0 0 12px;font-family:var(--font-title);font-size:1.2rem}.option-list{display:grid;gap:9px}.option-list button{border:1px solid #d7bc8c;background:#fff9eb;border-radius:11px;color:#2b4348;min-height:43px;padding:8px 10px;text-align:left}.option-list button:hover{background:#f5e6c5}.option-list button.correct{background:#ddeddd;border-color:#6d9a79}.option-list button.wrong{background:#f6ded7;border-color:#ae7768}.option-list button:disabled{cursor:default}.feedback{margin-top:12px;font-weight:650;color:#305d51}.feedback.warning{color:#a35c44}.crossword-grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:3px;max-width:350px;margin:16px auto}.crossword-cell{aspect-ratio:1;position:relative;min-width:0}.crossword-cell input{width:100%;height:100%;padding:0;text-align:center;font-size:clamp(1rem,4.2vw,1.4rem);font-weight:750;text-transform:uppercase;background:#fffaf2;border:1px solid #af9875;border-radius:3px;color:#1f3c49}.crossword-cell em{position:absolute;top:0;left:3px;font:650 9px/1.1 var(--font-body);color:#8e6a43;pointer-events:none}.crossword-cell.blank{background:transparent}.crossword-cell.input-ok input{background:#dcede0}.crossword-cell.input-bad input{background:#fae5d9}.clues{padding-left:23px;margin:16px 0;line-height:1.55}.clues li{margin:4px 0}.game-controls{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin-top:14px}.memory-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-width:430px;margin:18px auto}.memory-card{aspect-ratio:1;background:linear-gradient(145deg,#ab7756,#784834);color:transparent;font-size:clamp(1.8rem,8vw,2.6rem);border:2px solid #e3c393;border-radius:12px;box-shadow:inset 0 0 0 2px rgba(255,245,220,.1)}.memory-card::before{content:'✦';color:#f6e2b2}.memory-card.revealed,.memory-card.matched{background:#fff6e5;color:#283c46}.memory-card.revealed::before,.memory-card.matched::before{content:none}.memory-card.matched{border-color:#6d9a79;background:#e1f2e3}.candle-scene{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;background:radial-gradient(circle at 50% 45%,rgba(228,174,89,.25),transparent 65%),#26424f;border-radius:18px;padding:34px 10px;margin:16px auto;color:#f8e3be}.candle-flame{font-size:56px;opacity:.15;filter:grayscale(1);transition:opacity .4s,filter .4s;line-height:1}.candle-scene.lit .candle-flame{opacity:1;filter:none;animation:flicker 1.4s ease-in-out infinite alternate}@keyframes flicker{to{transform:rotate(3deg) scale(.95);filter:drop-shadow(0 0 16px #ffd786)}}.candle-body{width:65px;height:95px;background:linear-gradient(90deg,#d3b68d,#fff5d9,#caa679);border-radius:8px 8px 7px 7px;box-shadow:0 0 0 3px rgba(155,114,69,.2)}.candle-button{background:#f6e4be;border:0;border-radius:10px;padding:10px 20px;color:#263e4b;margin-top:9px;font-weight:750}.find-scene{position:relative;max-width:430px;height:230px;margin:14px auto;border-radius:16px;background:radial-gradient(circle at 65% 28%,#4f6c7b,#163347);overflow:hidden}.find-scene::before{content:'🏠　🌲　⛪　🌲';position:absolute;bottom:3px;left:0;right:0;font-size:clamp(32px,10vw,58px);text-align:center;filter:drop-shadow(1px 4px 4px rgba(0,0,0,.5))}.find-star{position:absolute;left:var(--sx);top:var(--sy);border:0;background:transparent;color:#fce9af;font-size:28px;text-shadow:0 0 10px #fff7d8;padding:7px;line-height:1}.find-star.found{opacity:.22;transform:scale(.85)}.puzzle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;max-width:300px;margin:14px auto}.puzzle-tile{aspect-ratio:1;border-radius:12px;border:2px solid #dbc49f;background:#f9ebd4;font-size:clamp(1.65rem,10vw,2.8rem)}.puzzle-tile.selected{outline:3px solid #a87c4b}.wordsearch-grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:3px;max-width:400px;margin:15px auto}.letter{aspect-ratio:1;border:1px solid #d8c49c;border-radius:5px;background:#fff9ec;color:#2e4a52;font-weight:700;min-width:0;padding:0;font-size:clamp(.8rem,3vw,1.06rem)}.letter.selected{background:#ecd3a1}.letter.found{background:#cfe7c7;border-color:#749666}.word-list{text-align:center;font-size:.95rem;line-height:2}.word-list span{display:inline-block;margin:2px 5px;padding:0 6px;border-radius:5px;background:#f1e3cb}.word-list .done{text-decoration:line-through;background:#d9ecd4}.finale-art{text-align:center;padding:16px;font-size:clamp(2.5rem,9vw,4.7rem);background:radial-gradient(ellipse at center,#ffedc6,transparent 71%);margin-bottom:15px;animation:finaleGlow 3s ease-in-out infinite alternate}@keyframes finaleGlow{to{filter:drop-shadow(0 0 17px #e6c17c)}}.welcome-art{text-align:center;margin:10px 0;font-size:3.7rem;filter:drop-shadow(0 0 16px #d7b369)}


/* Game area refresh */
.game-card{border-color:rgba(229,213,184,.18);background:rgba(248,249,235,.07);border-radius:18px;padding:clamp(14px,3vw,20px);margin-top:20px}
.game-card h3{color:#fff3d7;font-family:var(--font-display);font-size:1.28rem}
.option-list button{background:rgba(243,251,246,.095);border-color:rgba(240,235,212,.23);color:#f4f4eb;border-radius:12px;min-height:46px;padding:12px 14px}
.option-list button:hover{background:rgba(233,242,231,.19)}
.option-list button.correct{background:#d8ebcf;color:#173f2d;border-color:#7ac19d}
.option-list button.wrong{background:#f5d3cf;color:#673329;border-color:#d58477}
.feedback{color:#c8efdb}.feedback.warning{color:#ffd2b7}
.crossword-cell input,.letter{background:#f8f5eb;color:#152f41;border-color:#b9d0c9}
.crossword-cell.blank{background:transparent}
.crossword-cell em{color:#4a4a42}
.clues{color:#ecf4ed}
.memory-card{background:linear-gradient(145deg,#305c68,#163044);border-color:rgba(247,215,164,.44);border-radius:12px}
.memory-card.revealed,.memory-card.matched{background:#fff8e8;color:#263c48}
.memory-card.matched{border-color:#8dc8a5;background:#e0f3e6}
.candle-scene{background:radial-gradient(circle at 50% 42%,rgba(245,191,105,.32),transparent 68%),#0c2134;border:1px solid rgba(245,217,165,.2)}
.candle-button{background:#f3d9a6;color:#1b3441}
.find-scene{background:radial-gradient(circle at 65% 28%,#53838b,#163347)}
.puzzle-tile{background:#f6ead5;color:#1a3947;border-color:#d0bb9b}
.puzzle-tile.selected{outline-color:#f8d08d}
.wordsearch-grid .letter.selected{background:#e7d0a0}
.wordsearch-grid .letter.found{background:#c3e6d2}
.word-list span{background:rgba(249,235,205,.12);color:#f6ebd0}
.word-list .done{background:#365b52;color:#e2ffeb}
.finale-art{background:radial-gradient(ellipse at center,rgba(255,228,163,.35),transparent 71%)}
/* Tablet / desktop: cinematic wide 8 × 3 layout */
@media(min-width:780px){
  .winter-scene{gap:clamp(24px,5vh,58px);padding-top:clamp(22px,3vh,44px);padding-bottom:clamp(30px,5vh,55px)}
  .doors{grid-template-columns:repeat(8,minmax(0,1fr));gap:clamp(12px,1.35vw,21px)}
  .door-tile{--tile-h:clamp(124px,12.6vw,161px)}
  .door-day{font-size:clamp(2.8rem,4.65vw,4.4rem)}
}
/* Smaller phones maintain comfortable touch targets */
@media(max-width:440px){
  .winter-scene{padding:clamp(20px,4vh,31px) 13px clamp(21px,3vh,35px);gap:clamp(19px,3.6vh,32px)}
  .winter-scene::after{inset:7px;border-radius:19px}
  .brand-emblem{width:31px;height:31px;margin-bottom:10px}
  .eyebrow{font-size:.62rem}
  .masthead h1{font-size:clamp(2.1rem,9.3vw,3.35rem);margin-top:6px}
  .title-ornament{font-size:14px;gap:11px}
  .doors{gap:clamp(7px,1.85vw,10px)}
  .door-tile{--tile-h:clamp(79px,24vw,109px);border-radius:14px}
  .door-day{font-size:clamp(2.0rem,8.2vw,3.2rem)}
  .door-motif{top:8px;left:9px;font-size:10px}
  .door-corners{bottom:7px;left:9px;font-size:9px}
  .door-status{right:9px;bottom:9px}
  .dialog-shell{padding:40px 19px 26px}
  .close-button{margin:-30px -10px 0 0}
}
/* Landscape phone: 8 × 3 as requested, and scroll if the display is very short */
@media(orientation:landscape) and (max-height:620px){
  .winter-scene{padding:15px 18px 23px;gap:14px;min-height:100svh}
  .brand-emblem{display:none}
  .masthead h1{font-size:clamp(1.9rem,4.2vw,2.75rem);margin:4px 0}
  .title-ornament{font-size:11px}
  .doors{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;max-width:970px}
  .door-tile{--tile-h:clamp(76px,11.6vw,115px)}
  .door-day{font-size:clamp(1.8rem,3.4vw,2.9rem)}
  .door-motif{top:7px;left:9px;font-size:10px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important}
 .snowfall{display:none}
}
/* V3 – Original design retained; already visited doors use wine-red accents. */
.door-tile.is-visited .door-panel,
.door-tile.is-visited:nth-child(4n+2) .door-panel,
.door-tile.is-visited:nth-child(4n+3) .door-panel,
.door-tile.is-visited:nth-child(4n+4) .door-panel{
 background:linear-gradient(148deg,rgba(143,55,82,.87),rgba(95,25,52,.96) 52%,rgba(57,16,42,.98) 100%);
 border-color:rgba(255,207,201,.27);
 box-shadow:inset 0 1px 0 rgba(255,226,205,.23),inset 0 -22px 30px rgba(36,7,28,.28),0 0 18px rgba(109,31,70,.23);
}
.door-tile.is-visited .door-day{color:#ffeedf}
.door-tile.is-visited .door-status{background:#f3b7b8;box-shadow:0 0 11px rgba(243,183,184,.52)}
/* Unified daily quiz inserted below each day's individual content. */
.daily-quiz{margin-top:32px;padding-top:10px;color:#f7f3ec}
.quiz-divider{text-align:center;color:#e7ba82;letter-spacing:14px;margin-bottom:12px}
.quiz-heading{font-family:var(--font-display,Georgia,serif);font-size:clamp(1.65rem,4vw,2.1rem);font-weight:500;color:#ffe7b9;margin:0 0 5px}
.quiz-description,.quiz-hint{font-size:.91rem;color:#cbdcd8;line-height:1.5;margin:7px 0 16px}
.quiz-hint{font-size:.82rem;opacity:.86;margin-top:12px}
.quiz-stage{padding:clamp(15px,3.3vw,24px);border:1px solid rgba(228,211,173,.24);border-radius:20px;background:linear-gradient(150deg,rgba(18,68,80,.67),rgba(10,30,51,.88));box-shadow:0 14px 30px rgba(3,13,30,.24),inset 0 1px 0 rgba(255,255,255,.07)}
.quiz-primary,.quiz-secondary{display:block;width:100%;min-height:48px;border-radius:13px;padding:11px 17px;font-size:1rem;font-weight:750;cursor:pointer;touch-action:manipulation;transition:transform .15s,background .15s}
.quiz-primary{border:1px solid rgba(248,213,160,.74);background:linear-gradient(110deg,#f5d29b,#d9a863);color:#28323b;box-shadow:0 6px 18px rgba(3,13,30,.26)}
.quiz-secondary{margin-top:11px;background:rgba(254,248,237,.1);color:#ffe9c9;border:1px solid rgba(255,234,200,.35)}
.quiz-primary:hover:not(:disabled),.quiz-secondary:hover:not(:disabled){transform:translateY(-2px)}
.quiz-primary:disabled,.quiz-secondary:disabled{opacity:.6;cursor:wait}
.quiz-progress{display:flex;justify-content:space-between;gap:15px;letter-spacing:.13em;color:#f8d5a6;font-size:.77rem;font-weight:800}
.quiz-progress-bar{height:5px;border-radius:10px;background:rgba(255,255,255,.11);overflow:hidden;margin:10px 0 18px}
.quiz-progress-bar i{display:block;background:linear-gradient(90deg,#d9a765,#ffe2ae);height:100%;transition:width .25s}
.quiz-question{font-size:clamp(1.12rem,3vw,1.35rem);margin:10px 0 18px;color:#fff9eb;line-height:1.4}
.quiz-answers{display:grid;gap:9px}
.quiz-answer{display:flex;align-items:center;text-align:left;gap:13px;background:rgba(249,247,231,.08);border:1px solid rgba(252,238,214,.22);border-radius:13px;color:#f6f6ef;min-height:51px;padding:10px 13px;cursor:pointer;font-size:.98rem;transition:background .18s,transform .18s}
.quiz-answer:hover:not(:disabled){background:rgba(231,250,242,.19);transform:translateX(3px)}
.quiz-answer-letter{display:grid;place-items:center;flex:0 0 31px;width:31px;height:31px;color:#ffdfa9;background:rgba(249,224,171,.1);border:1px solid rgba(249,224,171,.26);border-radius:9px;font-size:.85rem;font-weight:750}
.quiz-answer.is-wrong{opacity:.55;background:rgba(137,35,63,.28);border-color:#b86d78;cursor:default}
.quiz-answer.is-correct{background:rgba(60,123,96,.55);border-color:#9bddb8}
.quiz-answer:disabled:not(.is-wrong):not(.is-correct){opacity:.75;cursor:wait}
.quiz-feedback{min-height:1em;margin:14px 0;color:#f9dfb2;font-weight:650;line-height:1.45}
.quiz-error{border:1px solid #f3a5a8;background:rgba(135,29,55,.45);padding:12px;border-radius:11px;color:#fff0ed;margin:0 0 12px}
.quiz-completed-symbol{font-size:2.5rem;color:#f6d59e;text-align:center;text-shadow:0 0 25px rgba(245,214,157,.37)}
.quiz-done-title{text-align:center;font:500 clamp(1.3rem,4vw,1.8rem) var(--font-display,Georgia,serif);color:#fff2d9;margin:4px 0 7px}
.quiz-score-intro,.quiz-score-big{text-align:center;color:#ffe3b1;font-size:1.25rem;font-weight:800;margin:8px 0 16px}
.quiz-score-big{font-size:clamp(1.6rem,6vw,2.4rem)}
.quiz-name-form{display:grid;gap:10px}
.quiz-name-input{width:100%;min-height:50px;border:1px solid rgba(246,212,164,.52);border-radius:12px;padding:10px 13px;background:rgba(255,255,255,.95);color:#172d3d;font-size:1rem}
.quiz-breakdown{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:18px 0 25px}
.quiz-breakdown>div{display:flex;flex-direction:column;justify-content:center;gap:5px;padding:12px 7px;border-radius:12px;text-align:center;border:1px solid rgba(238,218,184,.19);background:rgba(247,239,220,.07)}
.quiz-breakdown span{font-size:.74rem;color:#d9e3df}.quiz-breakdown strong{font-size:1.16rem;color:#ffe6b6}
.leaderboard-head{display:flex;justify-content:space-between;align-items:center;gap:7px;flex-wrap:wrap;margin:20px 0 12px}
.leaderboard-head h4{margin:0;color:#fce6bb;font-size:1.3rem}.leaderboard-head>span{color:#d1e5df;font-size:.78rem}
.leaderboard{display:grid;list-style:none;padding:0;margin:0;gap:6px}
.leaderboard-row{display:grid;grid-template-columns:31px minmax(0,1fr) auto;align-items:center;gap:8px;padding:12px 11px;background:rgba(243,246,240,.07);border:1px solid rgba(250,234,201,.13);border-radius:10px}
.leaderboard-row.is-me{background:rgba(177,86,96,.29);border-color:rgba(248,194,185,.62)}
.leaderboard-rank{color:#f4d49b;font-weight:800}.leaderboard-name{overflow-wrap:anywhere}.leaderboard-points{white-space:nowrap;color:#ffe2b8}
.leaderboard-empty{list-style:none;margin:0;padding:14px;border-radius:11px;background:rgba(255,255,255,.06);color:#dbe7e2}
.demo-hint{color:#a7bec2;font-size:.72rem;margin:10px 0}
@media (max-width:430px){.quiz-stage{padding:14px}.quiz-breakdown{gap:5px}.quiz-breakdown>div{padding:10px 3px}.quiz-breakdown span{font-size:.67rem}.quiz-answer{font-size:.93rem}}
@media (prefers-reduced-motion:reduce){.quiz-answer,.quiz-primary,.quiz-secondary{transition:none!important}}

/* V4: Song-only media/notation presentation, no parallel games */
.song-lyrics{padding:21px clamp(15px,3vw,29px);border-radius:19px;background:linear-gradient(145deg,rgba(239,208,153,.14),rgba(34,90,95,.15));border:1px solid rgba(250,218,168,.24);margin:14px 0 20px}
.song-kicker{font-weight:770;font-size:.73rem;letter-spacing:.19em;color:#f0d4a8;margin-bottom:13px}
.song-lyrics .body-text{font-size:clamp(1.02rem,2.7vw,1.19rem);line-height:1.85;color:#fff8e8;white-space:pre-line;margin:0;font-family:var(--font-display)}
.song-media{padding:18px;background:rgba(10,41,56,.61);border:1px solid rgba(229,214,181,.22);border-radius:17px;margin:15px 0}
.song-media-label{font-size:.94rem;font-weight:750;color:#f8e7c6;margin:0 0 12px}
.song-audio{display:block;width:100%;max-width:100%;min-height:45px;color-scheme:light}
.song-source{font-size:.76rem;line-height:1.55;color:#cbded9;margin:12px 0 0;overflow-wrap:anywhere}
.song-downloads{display:flex;gap:10px;flex-wrap:wrap;margin:13px 0 24px}
.song-download{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 18px;border-radius:13px;text-decoration:none;font-weight:760;background:linear-gradient(120deg,#eed4a7,#d6ad70);border:1px solid #f4dfb8;color:#1b2c38;box-shadow:0 5px 18px #030d1c44}
.song-download:hover{filter:brightness(1.08)}
@media(max-width:430px){.song-lyrics{padding:16px}.song-audio{width:100%}}

/* V5 · Interaktive Winterdorf-Edition nach der gelieferten Bildvorlage. */
.winter-scene{
 background-image:linear-gradient(180deg,rgba(4,16,39,.12),rgba(3,20,42,.07) 38%,rgba(2,13,30,.14)),url('winterdorf-background.webp');
 background-position:center center;background-size:cover;
 gap:clamp(18px,3vh,34px);padding:clamp(18px,3vh,31px) 14px clamp(26px,5vh,55px);
}
.winter-scene::before{background:radial-gradient(ellipse 60% 69% at 50% 51%,rgba(7,23,47,.32),transparent 87%)}
.ambient-orbit,.light-rays,.sky-glow{opacity:.37}
.masthead{margin:0 auto 6px;}
.masthead .eyebrow{font-family:var(--font-display);font-size:clamp(2rem,4.25vw,4.3rem);font-weight:400;line-height:1.03;letter-spacing:.025em;color:#fff9ea;text-shadow:0 2px 3px #061429,0 0 25px #ffd68a80;padding:0}
.masthead h1{font:italic 400 clamp(2.75rem,6.2vw,6.2rem)/1.07 'Palatino Linotype','Book Antiqua',Georgia,serif;margin:0;letter-spacing:-.045em;color:#ffe4a0;text-shadow:0 2px 3px #241522,0 0 14px #fcbf46a8,0 0 35px #eaae6c6b}
.title-ornament{margin-top:0;font-size:20px;color:#ffe19b}
.title-ornament span{background:linear-gradient(90deg,transparent,#ffd78b);height:2px}
.doors{width:min(100%,1110px);grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(7px,1vw,14px);filter:drop-shadow(0 10px 18px rgba(0,7,22,.4))}
.door-tile{--tile-h:clamp(100px,10vw,150px);border-radius:clamp(12px,1.4vw,20px)}
.door-frame{border:2px solid #f1cf8d;box-shadow:0 0 0 1px #452f22,0 0 14px #efbd66a6,0 8px 20px #0009,inset 0 1px 2px #fff6}
.door-panel{inset:2px;border-radius:clamp(10px,1.25vw,17px);border:1px solid #e2b96892;background:radial-gradient(circle at 54% 65%,#106980 0%,#074157 48%,#03243d 100%);box-shadow:inset 0 1px 14px #67b6bc44,inset 0 -17px 12px #d6f7ff0a}
.door-tile:nth-child(4n+2) .door-panel,.door-tile:nth-child(4n+3) .door-panel,.door-tile:nth-child(4n+4) .door-panel{background:radial-gradient(circle at 54% 65%,#0b6079 0%,#08425a 45%,#032b46 100%)}
.door-tile.is-visited .door-panel,.door-tile.is-visited:nth-child(4n+2) .door-panel,.door-tile.is-visited:nth-child(4n+3) .door-panel,.door-tile.is-visited:nth-child(4n+4) .door-panel{background:radial-gradient(circle at 54% 55%,#971f4c,#640a2c 56%,#3c061f);border-color:#f4c8b196}
.door-panel::before{inset:4px;border:1px solid #f2d49d33}
.door-day{position:absolute;top:5px;left:clamp(9px,1vw,17px);font:400 clamp(1.65rem,2.45vw,2.7rem)/1 var(--font-display);letter-spacing:0;color:#ffdf92;text-shadow:0 2px 1px #211313,0 0 9px #ffcf7f77;padding:0}
.door-motif{position:relative;top:12%;left:auto;font:400 clamp(2.1rem,3.8vw,4.3rem)/1.1 Georgia,serif;color:#ffdf91;text-shadow:0 3px 8px #0009,0 0 22px #fed07799}
.door-corners{bottom:3px;left:50%;transform:translateX(-50%);font-size:clamp(8px,1.1vw,13px);white-space:nowrap;color:#e9f9ffdb;text-shadow:0 0 8px #e4fbff}
.door-status{right:9px;top:9px;bottom:auto;width:8px;height:8px;background:#ffe4a9}
.door-tile.is-visited .door-status{background:#fff0c9}
.door-tile.is-locked .door-panel{filter:saturate(.9) brightness(.9)}
.door-tile.is-locked .door-day{color:#f3d6a1}
.content-dialog::backdrop{background:rgba(1,9,26,.8);backdrop-filter:blur(9px)}
@media(max-width:779px){
 .winter-scene{justify-content:flex-start;min-height:100svh;padding:21px 13px 34px;background-position:center center}
 .masthead .eyebrow{font-size:clamp(1.9rem,7.1vw,3.3rem)}
 .masthead h1{font-size:clamp(2.45rem,9vw,4.3rem)}
 .doors{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;width:100%;max-width:580px}
 .door-tile{--tile-h:clamp(85px,24vw,132px)}
 .door-day{font-size:clamp(1.5rem,5vw,2.3rem);top:7px;left:9px}
 .door-motif{font-size:clamp(1.95rem,8vw,3.8rem)}
 .door-corners{font-size:9px}
}
@media(max-width:370px){.doors{gap:6px}.door-tile{--tile-h:clamp(76px,23.9vw,95px)}.door-motif{font-size:1.9rem}.door-day{font-size:1.4rem}}
@media(orientation:landscape) and (max-height:620px){
 .winter-scene{justify-content:flex-start;min-height:100svh;padding:12px 18px 25px}
 .masthead .eyebrow{font-size:1.9rem}.masthead h1{font-size:2.5rem}
 .doors{max-width:1050px;grid-template-columns:repeat(8,minmax(0,1fr));gap:7px}
 .door-tile{--tile-h:clamp(74px,10.7vw,114px)}.door-motif{font-size:clamp(1.9rem,3.3vw,3rem)}
}

/* V6 – Bild-Adventskalender: Vollbildillustration mit geometrisch zugeordneten echten Türchen.
   Desktop-Landschaft und Smartphone-Hochformat nutzen unterschiedliche Illustrationen;
   die Klickflächen bleiben pixelgenau über ihren Türchen. */
html,body{background:#061730}
body{min-height:100svh;overflow-x:hidden;background:radial-gradient(ellipse at center,#16405c 0%,#07172f 76%)}
.winter-scene{position:relative;min-height:100svh;width:100%;padding:clamp(8px,1.4vw,18px);display:flex;align-items:center;justify-content:center;overflow:visible;isolation:isolate;background:none!important;gap:0}
.winter-scene::before,.winter-scene::after{display:none!important}
.calendar-artboard{position:relative;width:min(100%,1672px);aspect-ratio:1672/941;overflow:hidden;isolation:isolate;border-radius:clamp(13px,2vw,24px);background:#0a2346;box-shadow:0 22px 66px rgba(0,0,0,.5),0 0 0 1px rgba(251,217,151,.32)}
.calendar-picture{position:absolute;inset:0;z-index:0;display:block;pointer-events:none}
.calendar-picture img{display:block;width:100%;height:100%;object-fit:fill;user-select:none;-webkit-user-drag:none}
.calendar-artboard .doors{position:absolute;inset:0;z-index:2;width:100%;max-width:none;filter:none;display:block!important}
.calendar-artboard .door-tile{--tile-h:auto;box-sizing:border-box;position:absolute!important;top:var(--dy);left:var(--dx);width:var(--dw);height:var(--dh);padding:0;margin:0;border:0;background:transparent;border-radius:8%;cursor:pointer;touch-action:manipulation;perspective:700px;transform:none;animation:none;transition:filter .22s ease,transform .22s ease;z-index:1;overflow:visible}
.calendar-artboard .door-tile:hover:not(:disabled){transform:scale(1.035);filter:drop-shadow(0 0 8px #ffd087);z-index:10}
.calendar-artboard .door-tile:focus-visible{outline:3px solid #fff0b4;outline-offset:2px;z-index:10}
.calendar-artboard .door-tile.is-locked{cursor:not-allowed;filter:brightness(.92)}
.calendar-artboard .door-tile.is-today{z-index:4;filter:drop-shadow(0 0 9px #f6c977)}
.calendar-artboard .door-hit-visual{display:block;position:absolute;inset:2%;border-radius:9%;border:1px solid transparent;pointer-events:none;transition:background .2s ease,border-color .2s ease}
.calendar-artboard .door-tile.is-visited .door-hit-visual{background:linear-gradient(135deg,rgba(129,15,56,.62),rgba(96,14,48,.48));box-shadow:inset 0 0 0 2px rgba(255,204,160,.32);border-color:rgba(255,221,159,.75);mix-blend-mode:multiply}
.calendar-artboard .door-tile.is-visited .door-hit-visual::after{content:'✓';position:absolute;top:1%;right:3%;font:bold clamp(11px,1.35vw,22px)/1 system-ui,sans-serif;color:#ffdf9a;text-shadow:0 2px 8px #160515}
.calendar-artboard .door-open-glow{position:absolute;inset:1%;border-radius:10%;pointer-events:none;opacity:0;background:radial-gradient(ellipse at center,rgba(255,244,198,.95),rgba(238,166,67,.45) 45%,transparent 72%)}
.calendar-artboard .door-tile.is-opening{z-index:15}
.calendar-artboard .door-tile.is-opening .door-open-glow{animation:doorHighlight .66s ease-out both}
.calendar-artboard .door-tile.is-opening .door-hit-visual{transform-origin:left center;animation:doorSwingV6 .64s ease-in-out forwards;background:linear-gradient(100deg,rgba(57,18,29,.9),rgba(160,77,54,.8));border:2px solid #f7d49b}
@keyframes doorHighlight{0%{opacity:0;transform:scale(.75)}50%{opacity:1;transform:scale(1.17)}100%{opacity:0;transform:scale(1.25)}}
@keyframes doorSwingV6{0%{transform:rotateY(0deg);opacity:.96}100%{transform:rotateY(-100deg);opacity:.15}}
.calendar-artboard .snowfall{z-index:3;pointer-events:none}
.calendar-artboard .snowfall--back{z-index:1}
.calendar-artboard .snowfall--front{z-index:4}
@media (max-width:740px) and (orientation:portrait){
 .winter-scene{padding:5px;align-items:center}
 .calendar-artboard{width:100%;aspect-ratio:1024/1536;border-radius:12px}
 .calendar-artboard .door-tile{top:var(--my);left:var(--mx);width:var(--mw);height:var(--mh)}
 .calendar-artboard .door-tile.is-visited .door-hit-visual::after{font-size:clamp(9px,2.4vw,15px)}
}
@media (max-width:500px){.content-dialog{max-width:calc(100vw - 16px)}.dialog-shell{padding:40px 17px 25px}}
@media (prefers-reduced-motion:reduce){.calendar-artboard .door-tile.is-opening .door-hit-visual,.calendar-artboard .door-tile.is-opening .door-open-glow{animation:none!important}}

/* V7: Legal navigation below the original full artwork, separate leaderboard and newsletter. */
body{min-height:100vh;background:#071326}
.calendar-bottom-controls{display:flex;justify-content:center;padding:4px 12px 0}
.top10-open{border:1px solid #edcc84;border-radius:999px;color:#ffe7b4;background:linear-gradient(100deg,#11304e,#1a4c60);font:600 1rem system-ui,sans-serif;padding:11px 22px;cursor:pointer;box-shadow:0 4px 24px #030e1d75}
.top10-open:hover{filter:brightness(1.14)}
.legal-footer{display:flex;justify-content:center;align-items:center;gap:16px;padding:16px 15px 24px;color:#b6c9d8;font:400 .93rem system-ui,sans-serif}
.legal-footer a{color:#e9d7b6;text-decoration:underline;text-underline-offset:3px}
.legal-footer a:hover,.legal-footer a:focus-visible{color:#fff}
.leaderboard-pane{min-height:100px;padding:6px 0}
.newsletter-card{margin:25px 0 12px;padding:clamp(18px,3vw,28px);border-radius:19px;border:1px solid #ecca8e80;background:linear-gradient(135deg,#153e52,#551831)}
.newsletter-form{display:grid;gap:13px;margin-top:15px}
.newsletter-check{display:flex;align-items:flex-start;gap:10px;line-height:1.5;color:#fff1d7;cursor:pointer;font:400 .93rem system-ui,sans-serif}
.newsletter-check input{width:19px;height:19px;min-width:19px;accent-color:#e7be76;margin-top:2px}
.newsletter-form a{color:#ffdea4}
@media(max-width:740px) and (orientation:portrait){.calendar-bottom-controls{padding-top:7px}.legal-footer{padding-bottom:calc(22px + env(safe-area-inset-bottom))}}
