:root{--ink:#263e3b;--muted:#5e6b60;--paper:#fff8ea;--coral:#d95243;--teal:#236d61;--line:#ddd9c9;--yellow:#f6c54f;--display:'Chalkboard SE','Trebuchet MS',sans-serif;font-family:'Trebuchet MS',Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.35}button:focus-visible,a:focus-visible,summary:focus-visible{outline:4px solid #246d9d;outline-offset:5px}button{border:0}button:not(:disabled){transition:transform .16s,background .16s,box-shadow .16s}button:not(:disabled):active{transform:translateY(2px)}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display);line-height:1.08;letter-spacing:-.045em}svg{display:block;width:100%;height:100%}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.shell{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding:clamp(18px,2.5vw,44px) clamp(26px,4vw,76px) 18px;max-width:2400px;margin:auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:18px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px;text-align:left;background:none;padding:0}.brand-mark{display:grid;place-items:center;background:var(--yellow);width:48px;height:48px;border-radius:50%;font-size:34px;font-weight:900;border:2px solid var(--ink);transform:rotate(-9deg)}.brand-name{font-family:var(--display);font-size:clamp(20px,1.7vw,32px);font-weight:800;letter-spacing:-.04em}.brand small{display:block;text-transform:uppercase;letter-spacing:.16em;font-size:11px;margin-top:4px}.toolbar{display:flex;align-items:center;gap:10px}.tool{border:1px solid var(--line);background:transparent;border-radius:30px;padding:10px 17px;font-size:14px;white-space:nowrap}.tool:hover{background:#eee9db}.footer{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:16px;font-size:12px;color:var(--muted);gap:16px}.footer kbd{font:inherit;color:var(--ink);font-weight:bold}.eyebrow{font-size:clamp(12px,1.05vw,18px);text-transform:uppercase;letter-spacing:.19em;font-weight:800;color:var(--teal);line-height:1.5}.welcome{display:grid;grid-template-columns:1.06fr 1fr;align-items:center;flex:1;min-height:0;gap:2vw;padding:15px 0}.welcome-copy{padding:1vw 0}.welcome h1{font-size:clamp(55px,6.5vw,120px);line-height:1.02;max-width:850px;margin:16px 0 22px}.welcome h1 em{font-style:normal;color:var(--coral)}.welcome p{font-size:clamp(18px,1.6vw,28px);line-height:1.6;max-width:590px}.welcome-art{position:relative;max-height:71vh;aspect-ratio:640/570}.stamp{position:absolute;top:5%;left:35%;border-radius:30px;background:var(--paper);border:1.5px solid var(--ink);padding:9px 20px;font-size:14px;font-weight:bold;transform:rotate(8deg)}.welcome-actions{display:flex;align-items:center;gap:20px;margin-top:30px}.primary,.secondary,.dark-button{border-radius:15px;padding:16px 27px;font-weight:bold;font-size:clamp(16px,1.35vw,24px);display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:54px}.primary{background:var(--coral);color:#fffdf6;box-shadow:0 5px 0 #9c3d32}.primary:hover{background:#bc4437;transform:translateY(-2px)}.primary .arr{font-size:1.4em}.secondary{background:transparent;border:1.5px solid var(--ink)}.secondary:hover{background:#ebe5d5}.dark-button{background:var(--teal);color:white;box-shadow:0 4px 0 #14473e}.tiny-label{font-size:13px;font-weight:bold;line-height:1.7}.party-rule{display:flex;align-items:center;gap:10px;margin-top:30px;font-size:14px;color:var(--muted)}.sun-dot{width:22px;height:22px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;color:var(--ink)}.market{flex:1;padding-top:24px;display:flex;flex-direction:column}.market-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.market h1{font-size:clamp(32px,3.2vw,60px);margin-top:4px}.market-head p{font-size:clamp(14px,1.15vw,20px);color:var(--muted);margin-top:10px}.surprise{background:var(--yellow);border:1.5px solid var(--ink);border-radius:40px;padding:13px 23px;font-size:clamp(15px,1.2vw,22px);font-weight:bold;white-space:nowrap}.surprise:hover{transform:rotate(-3deg)}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 18px}.filter{background:transparent;border:1px solid var(--line);padding:9px 17px;border-radius:30px;font-size:clamp(13px,1vw,18px)}.filter[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.3vw,25px);flex:1}.card{background:#fffdf6;border:1.5px solid #d8d7c7;display:flex;flex-direction:column;overflow:hidden;border-radius:20px;text-align:left;padding:0;position:relative;box-shadow:0 3px 0 #e6e2d4}.card:hover{transform:translateY(-4px);box-shadow:0 7px 0 #e0dac9;border-color:var(--ink)}.card-picture{height:clamp(106px,15vh,195px);padding:1px 22px 0;position:relative;overflow:hidden}.peach{--tint:#f5d7bb}.pink{--tint:#f2d6d9}.mint{--tint:#d0e6d9}.lavender{--tint:#e1dcf0}.yellow{--tint:#f4e6af}.sky{--tint:#d4e7ef}.card-picture,.art-panel{background:var(--tint)}.card-picture .game-illustration{max-width:290px;margin:auto}.card-number{position:absolute;top:12px;left:14px;font-size:11px;font-weight:800;color:#465a53;letter-spacing:.1em}.played{position:absolute;right:10px;top:10px;background:var(--teal);color:white;border-radius:20px;padding:5px 10px;font-size:11px;font-weight:bold}.card-copy{padding:14px 18px 15px;display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;flex:1}.card h2{font-size:clamp(20px,1.75vw,32px);letter-spacing:-.025em}.card-meta{font-size:clamp(11px,.85vw,16px);margin-top:7px;color:var(--muted)}.card-arrow{display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--line);border-radius:50%;font-size:20px;flex-shrink:0}.market-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:18px;gap:20px}.progress-copy{font-size:14px;color:var(--muted)}.pager{display:flex;align-items:center;gap:16px}.pager button{border:1px solid var(--line);background:transparent;border-radius:50%;width:42px;height:42px;font-size:20px}.page-count{font-size:13px;letter-spacing:.08em}.game-screen{flex:1;display:flex;flex-direction:column;padding-top:20px;gap:20px}.game-heading{display:flex;justify-content:space-between;align-items:center;gap:18px}.game-heading h1{font-size:clamp(25px,2.8vw,49px)}.back-link{font-size:14px;background:transparent;padding:10px 0;text-decoration:underline;text-underline-offset:5px;white-space:nowrap}.game-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(25px,4vw,70px);flex:1;align-items:center}.art-panel{border-radius:28px;border:1.5px solid #d2d2bd;position:relative;aspect-ratio:1.32;max-height:57vh;display:flex;align-items:center;padding:15px}.art-caption{position:absolute;bottom:20px;left:0;right:0;text-align:center;font-size:12px;color:var(--muted)}.instruction{padding:10px 0}.instruction h2{font-size:clamp(31px,3.7vw,68px);line-height:1.13;margin:12px 0 20px}.instruction>p{font-size:clamp(20px,1.9vw,35px);line-height:1.5;max-width:740px}.kit{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.kit span{background:#ece8d8;border-radius:12px;padding:11px 16px;font-size:clamp(16px,1.2vw,23px)}.location{display:flex;align-items:center;gap:9px;font-size:clamp(15px,1.2vw,22px);margin:21px 0;color:var(--teal)}.location::before{content:'';height:9px;width:9px;border-radius:50%;background:var(--teal)}.instruction .actions{display:flex;gap:13px;flex-wrap:wrap;margin-top:28px}.step-nav{display:flex;align-items:center;gap:8px}.step-dot{width:28px;height:7px;background:#d5d8c9;border-radius:5px}.step-dot.current{width:55px;background:var(--teal)}.bottom-rule{font-size:clamp(14px,1.1vw,20px);color:var(--muted);text-align:center;margin-top:6px}.play-panel{background:var(--ink);color:var(--paper);border-radius:28px;padding:clamp(22px,3vw,55px);text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:380px}.play-panel h2{font-size:clamp(31px,3vw,58px);max-width:700px}.timer{font-size:clamp(65px,7.5vw,140px);font-family:var(--display);font-weight:bold;font-variant-numeric:tabular-nums;letter-spacing:-.06em;line-height:1.2;margin:10px 0}.timer-label{font-size:13px;text-transform:uppercase;letter-spacing:.17em;color:#d5dfce}.play-controls{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:13px 0}.play-controls button{background:#fff8ea;color:var(--ink);border-radius:12px;padding:12px 20px;font-size:clamp(16px,1.25vw,23px);font-weight:bold}.play-controls .music-toggle{background:var(--yellow)}.play-controls button:disabled{opacity:.45}.play-aside .art-panel{aspect-ratio:1.75;max-height:34vh}.play-aside h3{font-size:clamp(24px,2.1vw,40px);line-height:1.3;margin-top:16px}.play-aside p{font-size:clamp(17px,1.3vw,24px);line-height:1.5;color:var(--muted);margin:8px 0 20px}.done{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;flex-direction:column;padding:20px}.done-art{height:clamp(140px,24vh,260px);width:clamp(140px,24vh,260px)}.done h1{font-size:clamp(45px,5vw,92px);margin:8px 0 16px}.done>p{font-size:clamp(19px,1.7vw,32px);line-height:1.6}.done .actions{display:flex;gap:15px;margin-top:26px;flex-wrap:wrap;justify-content:center}.complete-badge{display:inline-block;padding:10px 18px;border-radius:30px;background:#d1e7d9;margin-top:19px;font-size:16px;font-weight:bold}dialog{color:var(--ink);background:var(--paper);border:2px solid var(--ink);border-radius:23px;padding:32px;max-width:720px;width:calc(100% - 40px);max-height:85vh;box-shadow:0 20px 80px #1a302c55}dialog::backdrop{background:#1b3029a6}dialog h2{font-size:32px;margin:0 0 20px}dialog h3{font-size:22px;margin:24px 0 10px;letter-spacing:-.02em}dialog p,dialog li{font-size:17px;line-height:1.6}dialog ul{padding-left:22px}dialog .dialog-actions{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap}dialog .tool{font-size:16px}#confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:8}.confetto{position:absolute;top:-30px;width:10px;height:18px;animation:fall 3.6s ease-in forwards}.float{animation:float 5s ease-in-out infinite;transform-origin:center}.flame{animation:flicker 1.9s ease-in-out infinite;transform-origin:center}.notice{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--paper);padding:13px 23px;border-radius:14px;z-index:20;font-size:16px;max-width:90vw}.screen-enter{animation:enter .28s ease-out}@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes float{50%{transform:translateY(-9px) rotate(2deg)}}@keyframes flicker{50%{transform:scale(.88,1.08)}}@keyframes fall{to{transform:translate3d(var(--drift),105vh,0) rotate(650deg);opacity:.4}}@media(min-width:1600px){.brand small{font-size:14px}.tool{font-size:18px;padding:12px 22px}.footer{font-size:16px}.card-picture{height:17vh}.card-picture .game-illustration{max-width:390px}.card-copy{padding:20px 24px}.card-number,.played{font-size:14px}.market-bottom{margin-top:25px}.progress-copy,.page-count{font-size:18px}.pager button{width:50px;height:50px}.tiny-label,.party-rule{font-size:18px}}@media(max-height:760px) and (min-width:900px){.shell{padding-top:18px;padding-bottom:12px}.topbar{padding-bottom:12px}.market{padding-top:16px}.market-head p{margin-top:5px}.filters{margin:15px 0 13px}.market-bottom{margin-top:12px}.card-picture{height:14vh}.card-copy{padding:10px 15px}.footer{padding-top:11px}.game-screen{gap:12px;padding-top:12px}.art-panel{max-height:55vh}.instruction h2{margin:10px 0 14px}.instruction .actions{margin-top:20px}.play-panel{min-height:330px}.welcome h1{margin:12px 0 15px}.welcome-actions{margin-top:22px}.party-rule{margin-top:24px}}
@media(max-width:899px){.shell{padding:18px 22px}.topbar{align-items:flex-start}.toolbar{gap:6px;flex-wrap:wrap;justify-content:flex-end}.tool{font-size:12px;padding:8px 10px}.brand small{font-size:9px}.brand-mark{width:38px;height:38px;font-size:27px;flex-shrink:0}.brand-name{font-size:18px}.welcome{grid-template-columns:1fr 1fr}.welcome h1{font-size:clamp(39px,7vw,65px)}.welcome p{font-size:16px}.welcome-actions{flex-direction:column;align-items:flex-start;gap:12px}.stamp{font-size:10px;padding:7px 13px}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.card-picture{height:130px}.market-head{align-items:flex-start}.market h1{font-size:30px}.surprise{padding:12px 15px;font-size:13px}.game-layout{gap:25px;grid-template-columns:1fr 1fr}.instruction h2{font-size:32px}.instruction>p{font-size:20px}.art-panel{max-height:none}.play-panel{min-height:340px}.play-aside .art-panel{max-height:none}.timer{font-size:80px}.footer{font-size:10px}.tiny-label{font-size:11px}.party-rule{font-size:12px}}
@media(max-width:580px){.shell{padding:16px}.brand-name{font-size:16px}.brand small{letter-spacing:.06em}.brand{gap:7px}.toolbar .tool{padding:7px 9px;font-size:10px}.toolbar{max-width:180px}.welcome{display:flex;flex-direction:column;align-items:stretch;padding-top:30px}.welcome-art{width:90%;align-self:center;max-height:none}.welcome-copy{text-align:center}.welcome h1{font-size:60px}.welcome-actions{align-items:center}.party-rule{justify-content:center}.welcome p{max-width:370px;margin:auto}.stamp{font-size:12px}.market-head{gap:12px}.market h1{font-size:28px}.market-head p{font-size:13px}.surprise{font-size:12px;padding:11px}.filters{gap:7px}.filter{font-size:12px;padding:8px 12px}.game-grid{gap:12px}.card-picture{height:105px;padding:0}.card-copy{padding:12px;min-height:89px}.card h2{font-size:19px}.card-arrow{display:none}.card-meta{font-size:10px}.card-number{font-size:9px;top:7px;left:7px}.played{font-size:9px;padding:4px 7px;top:6px;right:6px}.market-bottom{align-items:center}.progress-copy{font-size:12px}.pager{gap:9px}.pager button{height:34px;width:34px}.page-count{font-size:10px}.game-heading{align-items:flex-start}.game-heading h1{font-size:26px}.back-link{font-size:12px}.game-layout{grid-template-columns:1fr;gap:19px}.art-panel{aspect-ratio:1.7;max-height:32vh;width:100%;padding:0}.instruction h2{font-size:34px;margin-bottom:12px}.instruction>p{font-size:22px}.instruction .actions{margin-top:22px}.instruction{padding:0}.kit{margin:15px 0}.location{margin:15px 0}.footer{margin-top:20px;line-height:1.5}.footer .keyboard-help{display:none}.play-panel{min-height:320px}.play-aside{padding-bottom:10px}.play-aside .art-panel{display:none}.done h1{font-size:47px}.done .actions{flex-direction:column}.done-art{height:160px;width:160px}.game-screen{padding-top:18px}.bottom-rule{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.confetto{display:none}}
.flame{transform-box:fill-box;transform-origin:center bottom}
.card-picture .game-illustration{transform:scale(1.25)}
.card-picture .game-illustration text{display:none}
.card-picture .game-illustration text[font-size="100"],.card-picture .game-illustration text[font-size="60"]{display:block}

/* Design-review navigation only appears on explicitly requested previews. */
.design-review{min-height:76px;padding:12px 3vw;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;color:#263e3b;border-bottom:1px solid #d4d5d0;font-family:'Trebuchet MS',sans-serif;position:relative;z-index:5}.review-caption{display:flex;flex-direction:column;gap:5px}.review-caption strong{font-size:14px}.review-caption>span{font-size:11px;color:#606963}.design-review nav{display:flex;gap:7px}.design-review a{text-decoration:none;color:inherit}.design-review nav a{border:1px solid #d4d5d0;border-radius:9px;padding:9px 12px;display:flex;align-items:center;gap:7px;font-size:12px;text-transform:capitalize}.design-review nav a[aria-current]{background:#263e3b;color:white;border-color:#263e3b}.design-review nav a:hover{box-shadow:0 2px 0 #a7b7ab}.design-review b{font-size:15px}.leave-review{font-size:12px;white-space:nowrap}.reviewing .shell{min-height:calc(100dvh - 76px)}.concept-hero{flex:1;display:grid;grid-template-columns:1.08fr 1fr;align-items:center;column-gap:1vw;position:relative;padding-top:24px}.concept-copy{z-index:1}.concept-copy h1{font-size:clamp(48px,5.6vw,106px);margin:15px 0 20px;line-height:1.04}.concept-copy h1 em{font-style:normal}.concept-copy p{font-size:clamp(18px,1.5vw,28px);line-height:1.55}.concept-actions{margin-top:28px;display:flex;align-items:flex-start;flex-direction:column;gap:16px}.concept-actions>span{font-size:13px;font-weight:bold}.concept-art{position:relative;aspect-ratio:700/580;width:100%;max-height:65vh}.concept-sticker{position:absolute;top:0;right:7%;font-size:12px;letter-spacing:.12em;font-weight:bold;padding:12px 18px;border:1.5px solid currentColor;border-radius:30px;transform:rotate(7deg);z-index:1}.concept-bottom{grid-column:1/-1;text-align:center;padding:12px;font-size:14px;font-weight:bold;letter-spacing:.02em}.concept-art svg{overflow:visible}.concept-actions .primary{min-width:220px}.concept-actions .primary span{margin-left:12px}
body[data-design="2"]{background:#fff0d2;color:#73342e;--ink:#73342e;--paper:#fff0d2;--line:#d7baa0;--muted:#805149;--teal:#a34438;--coral:#d94150;--display:'Chalkboard SE','Trebuchet MS',sans-serif}body[data-design="2"] .brand-mark{background:#e55559;color:#fff1d7}body[data-design="2"] .topbar{border-bottom:2px dashed #d3ac92}.concept-2 h1{font-family:Georgia,serif;font-weight:900;font-size:clamp(50px,5.6vw,110px);letter-spacing:-.055em}.concept-2 h1 em{color:#d94150}.concept-2 .primary{background:#d94150;border-radius:50px;border:2px solid #73342e;box-shadow:4px 5px 0 #73342e}.concept-2 .concept-sticker{background:#e9b9cf;border:2px solid #73342e}.concept-2 .concept-bottom{border-top:2px dashed #d3ac92;margin-top:10px;text-transform:uppercase;letter-spacing:.16em;font-size:12px}
body[data-design="3"]{background:#151b36;color:#f9edda;--ink:#f9edda;--paper:#151b36;--muted:#b4bed9;--line:#424a6b;--teal:#c1c9ff;--yellow:#ffdb7d}body[data-design="3"] .shell{background-image:radial-gradient(circle at 14% 31%,#c3c9fa 0 1px,transparent 2px),radial-gradient(circle at 67% 9%,#c3c9fa 0 1px,transparent 2px),radial-gradient(circle at 43% 70%,#c3c9fa 0 1px,transparent 2px);background-size:330px 290px,450px 330px,370px 410px}body[data-design="3"] .brand-mark{color:#151b36;border-color:#ffdb7d}body[data-design="3"] .tool:hover{background:#303857}.concept-3 h1{font-size:clamp(45px,4.7vw,94px);letter-spacing:-.045em;line-height:1.1}.concept-3 h1 em{color:#ffdb7d}.concept-3 .concept-copy>p{color:#c3cce4}.concept-3 .primary{background:#ffdb7d;color:#1b2344;box-shadow:0 5px 0 #a17e37;border-radius:50px}.concept-3 .concept-actions>span{color:#b8c3e3}.concept-3 .concept-sticker{background:#30365c;color:#e2dfff;border-color:#727da7;transform:rotate(-5deg);right:2%;top:5%}.concept-3 .concept-bottom{color:#b8c3e3;letter-spacing:.1em;font-weight:normal}.concept-3 .concept-art{animation:float 8s ease-in-out infinite}
body[data-design="4"]{background:#edf0dc;color:#334e3b;--ink:#334e3b;--paper:#edf0dc;--muted:#5c705a;--line:#bcc8ae;--teal:#466c51;--coral:#517550;--display:Georgia,'Times New Roman',serif}body[data-design="4"] .brand-mark{background:#d6b26f}body[data-design="4"] .topbar{border-bottom:1px solid #9aac90}.concept-4 h1{font-family:Georgia,serif;font-weight:normal;font-size:clamp(48px,5.05vw,99px);letter-spacing:-.045em;line-height:1.08}.concept-4 h1 em{font-style:italic;color:#7c513e;font-size:.87em}.concept-4 .concept-copy p{font-family:Georgia,serif;line-height:1.7}.concept-4 .primary{border-radius:5px;background:#3b6249;box-shadow:3px 4px 0 #b5c6a5}.concept-4 .concept-sticker{border-radius:0;background:#f5e6c2;right:8%;top:1%;border-color:#a98b56;font-family:Georgia,serif;transform:rotate(4deg)}.concept-4 .concept-bottom{font-family:Georgia,serif;font-style:italic;font-size:18px;font-weight:normal}.concept-4 .eyebrow{font-size:12px;letter-spacing:.23em}
body[data-design="5"]{background:#ddd8f2;color:#322c54;--ink:#322c54;--paper:#ddd8f2;--muted:#5e567b;--line:#ada4ce;--teal:#443476;--display:'Arial Black','Trebuchet MS',sans-serif}body[data-design="5"] .brand-mark{border-radius:9px;background:#fa7979}body[data-design="5"] .topbar{border-bottom:2px solid #322c54}.concept-5 h1{font-family:'Arial Black','Trebuchet MS',sans-serif;font-weight:1000;font-size:clamp(70px,8.5vw,165px);line-height:.88;letter-spacing:-.075em;margin:25px 0}.concept-5 h1 em{font-size:.65em;display:inline-block;white-space:nowrap;letter-spacing:-.065em;color:#493b82}.concept-5 .primary{border:2px solid #322c54;color:#322c54;background:#ffdd63;box-shadow:5px 5px 0 #322c54;border-radius:0}.concept-5 .concept-sticker{background:#fa7979;border:2px solid #322c54;border-radius:0;transform:rotate(8deg);font-size:12px;right:2%}.concept-5 .concept-bottom{text-transform:uppercase;border-top:2px solid #322c54;letter-spacing:.16em;font-size:12px;margin-top:8px}
@media(min-width:1600px){.concept-actions>span,.concept-bottom{font-size:18px}.concept-sticker{font-size:17px}.concept-4 .eyebrow{font-size:17px}}
@media(max-height:800px) and (min-width:900px){.reviewing .welcome h1{font-size:5.7vw}.reviewing .welcome-art{max-height:60vh}.concept-hero{padding-top:18px}.concept-copy h1{margin-top:12px;margin-bottom:16px}.concept-actions{margin-top:21px;gap:12px}.concept-art{max-height:59vh}.concept-bottom{padding:7px}.concept-4 h1{font-size:4.7vw}.concept-2 h1{font-size:5.1vw}.concept-3 h1{font-size:4.4vw}.concept-5 h1{font-size:8vw}.concept-copy p{font-size:1.5vw}}
@media(max-width:1000px){.review-caption{display:none}.design-review{min-height:65px}.reviewing .shell{min-height:calc(100dvh - 65px)}.concept-copy h1{font-size:5.7vw}.concept-3 h1{font-size:4.8vw}.concept-5 h1{font-size:8vw}.concept-copy p{font-size:17px}.concept-sticker{font-size:9px}.concept-actions>span{font-size:11px}}
@media(max-width:650px){.design-review{padding:10px 12px;gap:7px;align-items:center;flex-wrap:wrap}.design-review nav{gap:5px;width:100%;justify-content:space-between}.design-review nav a{padding:8px 9px;flex:1;justify-content:center}.design-review nav a span{display:none}.leave-review{margin-left:auto}.concept-hero{grid-template-columns:1fr;padding-top:35px;gap:28px}.concept-copy{text-align:center}.concept-copy h1,.concept-2 h1,.concept-3 h1,.concept-4 h1{font-size:clamp(40px,9vw,60px)}.concept-5 h1{font-size:20vw}.concept-actions{align-items:center}.concept-art{max-height:none;width:100%}.concept-sticker{font-size:10px}.concept-bottom{font-size:12px}.concept-copy p{font-size:18px}.concept-4 .concept-bottom{font-size:16px}.reviewing .welcome-art{max-height:none}}

/* Summer is the birthday host, on the welcome page and throughout the party. */
.summer-avatar{position:relative;display:block;width:52px;height:52px;flex-shrink:0;overflow:hidden;border:2px solid #322c54;border-radius:50%;background:#ffdd63}.summer-avatar img{position:absolute;width:200%;max-width:none;height:auto;left:50%;top:-8%;transform:translateX(-50%)}.summer-hero-art{position:relative;width:100%;height:100%;isolation:isolate}.portrait-sun{position:absolute;width:83%;aspect-ratio:1;left:8%;top:8%;background:#ffdd63;border-radius:50%;z-index:-1}.summer-portrait{position:absolute;width:94%;height:100%;left:3%;bottom:0;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 7px 0 #322c5412)}.concept-5 .concept-sticker{z-index:3;top:0;right:-1%;font-size:clamp(10px,.85vw,16px)}.birthday-six{position:absolute;left:1%;top:39%;width:clamp(78px,8vw,145px);aspect-ratio:1;background:#fa7979;border:2px solid #322c54;box-shadow:4px 4px 0 #322c54;color:#322c54;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:'Arial Black','Trebuchet MS',sans-serif;font-size:clamp(35px,4vw,72px);font-weight:900;line-height:.95;transform:rotate(-9deg);border-radius:12px}.birthday-six small{font-family:'Trebuchet MS',sans-serif;font-size:clamp(8px,.75vw,14px);line-height:1.15;letter-spacing:.08em;margin-top:5px;text-align:center}.portrait-spark{position:absolute;color:#493b82;font-size:clamp(38px,5vw,80px);line-height:1;-webkit-text-stroke:1px #322c54}.spark-one{top:7%;left:9%;transform:rotate(-12deg)}.spark-two{top:47%;right:0;color:#63bbae;font-size:clamp(40px,6vw,90px)}.portrait-blocks{position:absolute;bottom:0;left:15%;right:4%;display:flex;justify-content:center;gap:5px;transform:rotate(-4deg)}.portrait-blocks span{position:relative;display:grid;place-items:center;flex:1;height:clamp(48px,5vw,84px);border:2px solid #322c54;border-radius:6px;background:#63bbae;font-family:'Arial Black','Trebuchet MS',sans-serif;font-size:clamp(16px,1.55vw,29px);font-weight:bold;color:#322c54;box-shadow:2px 3px 0 #322c54}.portrait-blocks span::before,.portrait-blocks span::after{content:'';position:absolute;top:-10px;width:19%;height:9px;border:2px solid #322c54;border-bottom:0;border-radius:3px 3px 0 0;background:inherit}.portrait-blocks span::before{left:14%}.portrait-blocks span::after{right:14%}.portrait-blocks span:nth-child(2){background:#fa7979;transform:translateY(-8px)}.portrait-blocks span:nth-child(3){background:#8378de}.summer-done{position:relative;overflow:hidden;background:#ffdd63;border:2px solid #322c54;border-radius:50%;margin-top:20px}.summer-done img{position:absolute;width:170%;max-width:none;height:auto;left:50%;top:-4%;transform:translateX(-50%)}
@media(max-width:899px){.summer-avatar{width:42px;height:42px}.birthday-six{width:73px}.birthday-six small{font-size:8px}.birthday-six{font-size:36px}.portrait-blocks span{font-size:14px}}
@media(max-width:650px){.concept-5 .concept-art{aspect-ratio:1.1}.summer-avatar{width:38px;height:38px}.concept-5 .concept-sticker{right:0;top:0}.portrait-blocks span{height:48px}.birthday-six{top:39%;left:0}.portrait-sun{top:8%}}
.portrait-sun{width:auto;height:92%;left:50%;top:5%;transform:translateX(-50%)}

/* The selected block-party design carries through the whole birthday. */
body[data-design="5"]{--yellow:#ffdd63;--coral:#fa7979;--teal:#396d65;--muted:#51476f;--line:#aaa0c8}
body[data-design="5"] .primary,body[data-design="5"] .secondary{border:2px solid #322c54;border-radius:9px;box-shadow:4px 4px 0 #322c54;color:#322c54;font-weight:900;min-height:52px}
body[data-design="5"] .primary{background:#ffdd63}body[data-design="5"] .primary:hover{background:#ffe992}body[data-design="5"] .secondary{background:#fffaf0}body[data-design="5"] .secondary:hover{background:#ece6ff}
body[data-design="5"] .tool{border-color:#8c80ad;background:#eee9fa}body[data-design="5"] .tool:hover{background:#fffaf0}body[data-design="5"] .eyebrow{color:#51476f}
body[data-design="5"] .footer{border-top:2px solid var(--ink);margin-top:20px;flex-shrink:0}
@media(max-width:899px){.topbar{flex-wrap:wrap}.toolbar{max-width:none;justify-content:flex-start}}
/* A portrait above a hand-painted birthday greeting, with one clear action. */
.birthday-welcome{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px;padding:24px 0 30px;text-align:center}
.birthday-portrait{position:relative;isolation:isolate;width:clamp(230px,36vh,460px);max-width:80vw;aspect-ratio:1.15}
.birthday-portrait::before{content:'';position:absolute;top:10%;left:50%;height:90%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle at 45% 35%,#fff0b0,#ffdd6370);z-index:-1}
.birthday-portrait img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom}
.birthday-copy{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%}
.birthday-title-art{display:block;width:min(760px,90vw);height:auto}
.birthday-actions{--button-width:100%;display:grid;grid-auto-rows:var(--button-height);justify-items:center;gap:14px;width:min(100%,26rem)}
.birthday-caption{display:grid;place-items:center;width:100%;height:var(--button-height);color:var(--muted);font-size:clamp(14px,1.1vw,18px);line-height:1.5;font-weight:bold;letter-spacing:.02em}
@media(max-height:800px) and (min-width:900px){.birthday-welcome{gap:4px;padding:8px 0}.birthday-portrait{width:32vh;min-width:0}.birthday-title-art{width:min(540px,65vw)}.birthday-copy{gap:4px}.birthday-actions{gap:4px}}
body[data-design="5"] .peach{--tint:#ffc9ad}body[data-design="5"] .pink{--tint:#ffbfc8}body[data-design="5"] .mint{--tint:#a9ddd0}body[data-design="5"] .lavender{--tint:#c8b9f3}body[data-design="5"] .yellow{--tint:#ffe783}body[data-design="5"] .sky{--tint:#a9d5ee}
body[data-design="5"] .market{padding-top:18px}.market h1{font-size:clamp(28px,2.8vw,52px)}body[data-design="5"] .surprise{background:#fa7979;border:2px solid #322c54;border-radius:8px;box-shadow:3px 3px 0 #322c54}
body[data-design="5"] .filters{margin:14px 0 16px;gap:9px}body[data-design="5"] .filter{border:1.5px solid #9a8db8;background:#eee9fa;font-weight:bold;padding:8px 14px}.filter span{font-size:1.2em;margin-right:3px}body[data-design="5"] .filter[aria-pressed=true]{background:#322c54;color:#fffaf0;border-color:#322c54}
.game-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));flex:1}
body[data-design="5"] .card{border:2px solid #322c54;border-radius:14px;background:var(--tint);box-shadow:4px 4px 0 #322c54}body[data-design="5"] .card:hover{box-shadow:6px 7px 0 #322c54;transform:translateY(-3px)}
.card-picture{height:clamp(115px,18vh,220px);padding:6px 38px 0;flex:1;min-height:0}.card-copy{background:#fffaf0;border-top:2px solid #322c54;flex:0;padding:10px 18px;min-height:56px}.card h2{font-size:clamp(19px,1.6vw,31px)}.card-number{color:#322c54;background:#fffaf0;border:2px solid #322c54;border-radius:7px;padding:5px;min-width:31px;text-align:center;left:10px;top:10px;font-size:14px}.card-arrow{background:#ffdd63;border:2px solid #322c54;flex-shrink:0;color:#322c54}.played{background:#322c54;z-index:1}.poster-illustration *{animation:none!important}.card-picture .lesson-illustration{width:100%;height:100%;max-width:550px;margin:auto}
.pager button{border:2px solid #322c54;background:#fffaf0;border-radius:8px;font-weight:bold;height:42px}.pager button[data-action="page-next"]{width:auto;padding:0 17px;background:#ffdd63;font-size:16px}.page-count{font-weight:bold;color:#322c54}.progress-copy{color:#51476f}
.game-heading h1{font-size:clamp(19px,1.8vw,32px);letter-spacing:-.025em}.game-heading{min-height:31px}.back-link{font-weight:bold;color:#51476f;font-size:14px}.setup-screen{flex:1;display:flex;flex-direction:column;gap:14px;padding-top:16px}.setup-intro{text-align:center}.setup-intro h2{font-size:clamp(32px,3.2vw,61px);margin-top:7px}.setup-intro .eyebrow{font-size:12px}.supply-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;max-width:940px;width:100%;margin:0 auto;flex:1;min-height:0}.supply-card{background:#ffdd63;border:3px solid #322c54;border-radius:20px;box-shadow:5px 5px 0 #322c54;display:flex;align-items:center;flex-direction:column;justify-content:center;overflow:hidden;min-height:0}.supply-card:nth-child(2){background:#a9ddd0}.supply-card svg{height:clamp(150px,28vh,340px);flex:1;min-height:0;width:100%;max-width:400px}.supply-card h3{font-size:clamp(23px,2vw,38px);padding:7px 14px 16px;text-align:center;letter-spacing:-.02em}.setup-controls{display:flex;justify-content:space-between;align-items:center;margin-top:9px;gap:20px}.setup-host>span{font-size:10px;letter-spacing:.14em;font-weight:bold;color:#51476f}.setup-host p{font-size:15px;margin-top:5px}.setup-host .back-link{padding:6px 0}.setup-controls .primary{min-width:235px}
.lesson-screen{flex:1;display:flex;flex-direction:column;padding-top:12px;gap:12px;min-height:0}.lesson-stage{border:3px solid #322c54;background:#fffaf0;border-radius:19px;box-shadow:5px 5px 0 #322c54;display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.lesson-title{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 24px 4px}.lesson-title h2{font-size:clamp(28px,3.5vw,65px);line-height:1.07;letter-spacing:-.035em}.lesson-progress{display:flex;align-items:center;gap:7px;flex-shrink:0}.lesson-progress>span{font-weight:bold;font-size:15px;color:#817394}.step-chip{width:39px;height:39px;border:2px solid #a396ba;border-radius:9px;background:#e6e0f2;color:#65597f;font-weight:900;font-size:19px;padding:0}.step-chip.current{background:#ffdd63;border-color:#322c54;color:#322c54;box-shadow:2px 2px 0 #322c54;transform:rotate(-6deg)}.demo-canvas{height:clamp(220px,44vh,650px);flex:1;min-height:200px;position:relative;padding:4px 18px}.demo-canvas .lesson-illustration{height:100%;width:100%;max-height:54vh;margin:auto;overflow:visible}.host-line{padding:10px 22px 13px;text-align:center;background:#eee8f7;border-top:1px solid #c3b7d5;font-size:clamp(14px,1.25vw,23px);line-height:1.35;color:#44365f}.host-line>span{font-size:.7em;text-transform:uppercase;letter-spacing:.1em;display:block;font-weight:bold;margin-bottom:3px;color:#6d5d83}.lesson-controls{display:flex;justify-content:space-between;align-items:center;gap:14px;padding-top:5px}.lesson-controls>.primary{min-width:160px}.demo-tools{display:flex;align-items:center;justify-content:center;gap:9px}.demo-tools .tool{font-size:13px;padding:11px 13px;font-weight:bold}
.live-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:25px;flex:1;min-height:0}.live-action{background:#fffaf0;border:3px solid #322c54;box-shadow:5px 5px 0 #322c54;border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;gap:12px;min-height:0}.live-action h2{font-size:clamp(37px,4.5vw,85px);text-align:center}.live-art{width:100%;height:clamp(200px,32vh,450px)}.live-art svg{overflow:visible}.live-action>p{font-size:clamp(14px,1.2vw,21px);text-align:center;line-height:1.45;color:#51476f}.live-music{width:100%;text-align:center}.music-toggle{border:3px solid #322c54;border-radius:12px;box-shadow:4px 4px 0 #322c54;background:#63bbae;color:#322c54;min-width:65%;padding:15px 24px;font-size:clamp(22px,2.1vw,40px);font-weight:900}.music-toggle.is-playing{background:#fa7979}.host-play{border:2px solid #9d91b7;border-radius:17px;padding:22px 18px;background:#eee8fa;display:flex;flex-direction:column;align-items:stretch;justify-content:center;text-align:center;gap:13px}.host-play .eyebrow{font-size:11px}.host-play .timer-label{color:#51476f;letter-spacing:.05em;font-size:12px;margin-top:6px}.host-play .timer{font-size:clamp(45px,4.3vw,78px);margin:0;color:#322c54}.host-play #timer-status{font-size:12px;line-height:1.4;color:#51476f}.host-play .play-controls{gap:8px;margin:0 0 9px}.host-play .play-controls button{font-size:14px;border:1px solid #9d91b7;padding:10px 11px;background:#fffaf0;border-radius:7px}.host-play>.primary,.host-play>.secondary{font-size:16px;padding:13px 10px;gap:4px}.complete-badge{background:#a9ddd0;color:#322c54;border:2px solid #322c54}
/* Fixed endpoints remain intelligible with motion paused or reduced. */
.demo-drop{animation:demo-drop 3.4s ease-in-out infinite}.demo-pass{animation:demo-pass 3.8s ease-in-out infinite}.demo-reach{animation:demo-reach 3.2s ease-in-out infinite}.demo-cover{animation:demo-cover 3.8s ease-in-out infinite}.demo-reveal{animation:demo-reveal 3.6s ease-in-out infinite}.demo-fit{animation:demo-fit 3.4s ease-in-out infinite}.demo-draw{animation:demo-draw 1.5s ease-in-out infinite}.demo-dance{animation:demo-dance .9s ease-in-out infinite;transform-origin:0 140px}.demo-clap{animation:demo-clap 1s ease-in-out infinite;transform-origin:0 60px}.demo-shoot{animation:demo-shoot 3.3s ease-in-out infinite}.demo-arrow{animation:demo-arrow 2s ease-in-out infinite}.demo-paused *{animation-play-state:paused!important}


@keyframes demo-reach{0%,15%{transform:translateY(-45px)}50%,85%{transform:translateY(23px)}100%{transform:translateY(-45px)}}
@keyframes demo-cover{0%,12%{transform:translateY(-32px)}50%,85%{transform:translateY(0)}100%{transform:translateY(-32px)}}
@keyframes demo-reveal{0%,15%{transform:translateY(45px)}55%,85%{transform:translateY(-15px)}100%{transform:translateY(45px)}}

@keyframes demo-draw{0%,100%{transform:translate(0,0)}30%{transform:translate(-12px,10px)}65%{transform:translate(8px,14px)}}
@keyframes demo-dance{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@keyframes demo-clap{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}

@keyframes demo-arrow{0%,100%{opacity:1}50%{opacity:.55}}
@media(min-width:1600px){.card-picture{height:18vh}.game-grid{gap:24px}.lesson-title{padding:24px 35px 10px}.step-chip{width:53px;height:53px;font-size:27px}.lesson-progress{gap:12px}.demo-tools .tool{font-size:18px}.lesson-controls>.primary{min-width:230px}.live-layout{grid-template-columns:minmax(0,1fr) 360px}.host-play>.primary,.host-play>.secondary{font-size:22px}.host-play .play-controls button{font-size:18px}.host-play #timer-status{font-size:16px}}
@media(max-height:760px) and (min-width:900px){.market h1{font-size:31px}.market .eyebrow{font-size:11px}.market .filters{margin:10px 0 13px}.card-picture{height:15vh;padding-top:0}.card-copy{min-height:47px;padding:8px 15px}.card h2{font-size:21px}.card-number{font-size:12px}.setup-screen{gap:10px}.setup-intro h2{font-size:36px}.supply-card svg{height:24vh}.supply-card h3{padding-bottom:12px}.lesson-title{padding:12px 20px 2px}.lesson-title h2{font-size:40px}.demo-canvas{max-height:42vh;padding:2px 18px}.host-line{padding:7px 15px 9px;font-size:16px}.lesson-controls .primary,.lesson-controls .secondary{padding:11px 20px;min-height:48px;font-size:18px}.live-action{padding:14px}.live-action h2{font-size:43px}.live-art{height:29vh}.music-toggle{padding:12px 20px;font-size:26px}.host-play{gap:10px;padding:16px}.host-play .timer{font-size:53px}}
@media(max-width:1000px){.lesson-title{gap:12px}.lesson-title h2{font-size:32px}.step-chip{width:30px;height:32px;font-size:16px}.lesson-progress{gap:4px}.lesson-progress>span{font-size:12px}.demo-tools .tool{padding:9px;font-size:11px}.lesson-controls{gap:9px}.lesson-controls>.primary{min-width:125px}.live-layout{grid-template-columns:minmax(0,1fr) 220px;gap:16px}.live-action{padding:12px}.live-action h2{font-size:35px}.music-toggle{padding:12px;font-size:22px;min-width:85%}.live-art{height:25vh}.host-play{padding:15px 11px}.host-play .timer{font-size:46px}}
@media(max-width:650px){.market-head{align-items:center}.market h1{font-size:25px}.market .eyebrow{font-size:10px}.market .surprise{font-size:11px;padding:10px;white-space:normal}.market .filters{gap:6px}.market .filter{font-size:11px;padding:7px 8px}.filter span{margin-right:0}.game-grid{gap:13px}.card-picture{height:115px;padding:15px 0 0;min-height:100px}.card-copy{padding:9px;min-height:63px}.card h2{font-size:17px}.card-number{font-size:10px;min-width:23px;padding:3px;left:5px;top:5px}.card-arrow{display:none}.pager{gap:8px}.pager button[data-action="page-next"]{font-size:12px;padding:0 9px}.progress-copy{font-size:11px}.game-heading h1{font-size:18px}.game-heading .back-link{font-size:12px}.setup-intro .eyebrow{font-size:9px}.setup-intro h2{font-size:32px}.supply-grid{gap:15px}.supply-card{border-width:2px}.supply-card svg{height:170px;min-height:130px}.supply-card h3{font-size:19px;padding:10px}.setup-controls{align-items:center;gap:10px}.setup-controls .primary{min-width:130px;font-size:17px}.setup-host p{font-size:12px;max-width:170px}.setup-host>span{font-size:9px}.lesson-title{flex-direction:column;padding:14px 10px 0;gap:12px}.lesson-title h2{font-size:30px;text-align:center}.step-chip{width:35px;height:34px}.lesson-stage{border-width:2px}.demo-canvas{height:230px;min-height:190px;max-height:none;padding:0}.demo-canvas .lesson-illustration{max-height:none}.host-line{font-size:14px;padding:10px}.lesson-controls{display:grid;grid-template-columns:1fr 1fr;gap:13px}.demo-tools{grid-column:1/-1;grid-row:2;justify-content:space-between;gap:6px}.demo-tools .tool{font-size:11px;flex:1;padding:10px 5px}.lesson-controls>.primary{min-width:0}.lesson-controls .primary,.lesson-controls .secondary{font-size:17px;padding:13px}.live-layout{grid-template-columns:1fr}.live-art{height:210px}.live-action h2{font-size:39px}.host-play{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:12px}.host-play .eyebrow,.host-play #timer-status{grid-column:1/-1}.host-play .timer{font-size:45px}.host-play .timer-label{font-size:12px}.host-play .play-controls{grid-column:1/-1}.host-play>.primary,.host-play>.secondary{font-size:14px}.live-action>p{font-size:13px}.lesson-screen{gap:12px}.market-bottom{margin-top:15px}}
@media(prefers-reduced-motion:reduce){.lesson-illustration *{animation:none!important}.demo-tools button[data-action="motion"],.demo-tools button[data-action="replay-demo"]{display:none}}
@media(min-width:900px){body:not([data-screen="welcome"]) .shell{height:100dvh;min-height:100dvh}.market,.game-grid,.card,.setup-screen,.game-screen{min-height:0}.game-grid{flex:1}.card-picture{height:auto;min-height:0;flex:1}.card-picture .lesson-illustration{position:absolute;inset:5px 30px 0;width:calc(100% - 60px);height:calc(100% - 5px)}.supply-grid{flex:1;min-height:0}.supply-card svg{flex:1;min-height:0;max-height:33vh}.demo-canvas{flex:1;min-height:180px}.live-layout{min-height:0}}



@media(min-width:900px){.demo-canvas{max-height:none}.host-line{margin-top:auto}}
.demo-fit{transform:translateX(-200px)}

@keyframes demo-pass{0%,15%{transform:translateX(-480px);opacity:1}65%,100%{transform:translateX(0);opacity:1}}
@keyframes demo-drop{0%,15%{transform:translateY(-48px);opacity:1}55%,100%{transform:translateY(0);opacity:1}}
@keyframes demo-fit{0%,15%{transform:translateX(0);opacity:1}55%,100%{transform:translateX(-200px);opacity:1}}
@keyframes demo-shoot{0%,10%{transform:translate(-350px,110px)}50%{transform:translate(-95px,-45px)}75%,100%{transform:translate(65px,40px)}}

/* Birthday Towers: a visible team contest, judged by the grown-up. */
.winner-choices{display:flex;justify-content:center;gap:22px;padding:9px 0 3px}.team-choice{display:flex;align-items:center;justify-content:center;gap:14px;border:2px solid #322c54;border-radius:9px;box-shadow:4px 4px 0 #322c54;padding:12px 24px;font-size:clamp(20px,2vw,34px);font-weight:900;color:#322c54}.team-one{background:#63bbae}.team-two{background:#fa7979}.team-choice b{display:grid;place-items:center;width:43px;height:43px;border:2px solid #322c54;border-radius:50%;background:#fffaf0;font-size:30px}.winner-choices>.secondary{font-size:17px;padding:12px 21px}.tower-prize{width:min(850px,80vw);height:clamp(160px,29vh,340px)}.tower-prize svg{width:100%;height:100%}.tower-done{gap:10px;min-height:0;padding-top:15px}.tower-done h1{font-size:clamp(40px,5vw,80px);margin:0}.tower-done p{font-size:clamp(17px,1.7vw,28px);line-height:1.4;margin:0}.tower-done .actions{margin-top:8px}.tower-done .complete-badge{margin:3px 0}.tower-done .actions .tool{font-size:14px}
@media(max-height:760px) and (min-width:900px){.tower-done{gap:7px}.tower-prize{height:25vh}.tower-done h1{font-size:49px}.tower-done .actions .primary,.tower-done .actions .secondary{font-size:17px;padding:12px 18px}.winner-choices{gap:15px}.team-choice{padding:10px 18px;font-size:23px}}
@media(max-width:650px){.winner-choices{display:grid;grid-template-columns:1fr 1fr;gap:13px}.team-choice{font-size:17px;padding:10px;gap:8px}.team-choice b{width:30px;height:30px;font-size:23px}.winner-choices>.secondary{grid-column:1/-1}.tower-judge .lesson-title .eyebrow{font-size:9px}.tower-prize{width:100%;height:180px}.tower-done .actions{flex-wrap:wrap}.tower-done{padding:20px 0}}

/* Flat controls share the three date-circle colours on every screen. */
:root{--party-yellow:#fff4c8;--party-pink:#ffbdc9;--party-teal:#a9ddd0;--button-width:150px;--button-height:44px;--button-ink:#322c54;--button-radius:9px;--button-disabled:#e3dfea;--button-disabled-ink:#716a80;--button-disabled-border:#aaa3b7}
#app .action-button,#host-dialog .action-button{
 --button-fill:var(--party-teal);
 display:inline-flex;align-items:center;justify-content:center;gap:0;
 flex:0 0 var(--button-width);width:var(--button-width);min-width:var(--button-width);max-width:var(--button-width);
 height:var(--button-height);min-height:var(--button-height);max-height:var(--button-height);
 padding:4px 6px;margin:0;border:2px solid var(--button-ink);border-radius:var(--button-radius);
 background:var(--button-fill);color:var(--button-ink);box-shadow:none;
 font:900 14px/1.2 'Trebuchet MS',Arial,sans-serif;letter-spacing:normal;text-align:center;text-transform:none;text-decoration:none;white-space:nowrap;transform:none;
 transition:border-color .15s,color .15s,background-color .15s;
}
/* Yellow starts/advances; pink goes back, stops, or clears; teal assists. */
:is(#app,#host-dialog) .action-button:is(.primary,.filter,.step-chip,.surprise,[data-action="page-next"],[data-action="timer"],[data-action="music"],[data-winner="tie"]){--button-fill:var(--party-yellow)}
:is(#app,#host-dialog) .action-button:is([data-action="home"],[data-action="page-prev"],[data-action="step-prev"],[data-action="reset"],[data-action="confirm-reset"],[data-winner="2"],[data-action="market"].back-link){--button-fill:var(--party-pink)}
#app .action-button:is(.filter[aria-pressed="true"],[aria-current="step"]){--button-fill:var(--party-teal);border-width:3px;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
#app .action-button:is([data-action="timer"][aria-pressed="true"],[data-action="music"][aria-pressed="true"],[data-action="motion"][aria-pressed="false"],[data-action="sound"][aria-pressed="false"],[data-action="finish"][data-stop="true"]){--button-fill:var(--party-pink)}
#app .action-button[data-action="motion"][aria-pressed="true"]{--button-fill:var(--party-yellow)}
:is(#app,#host-dialog) .action-button:not(:disabled):is(:hover,:active){border-width:3px;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;transform:none;box-shadow:none}
:is(#app,#host-dialog) .action-button:not(:disabled):active{text-decoration-thickness:3px}
:is(#app,#host-dialog) .action-button:disabled{background:var(--button-disabled);color:var(--button-disabled-ink);border-color:var(--button-disabled-border);opacity:1;box-shadow:none;transform:none;cursor:default}
:is(#app,#host-dialog) .action-button:focus-visible,#app .card:focus-visible{outline:4px solid var(--button-ink);outline-offset:4px}
/* Illustrated game choices are buttons too; colour follows the activity. */
#app .card{--card-fill:var(--party-yellow);background:var(--card-fill);border:2px solid var(--button-ink);box-shadow:none;transform:none;transition:border-color .15s}
#app .card:is([data-category="Build"],[data-category="Move"]){--card-fill:var(--party-teal)}
#app .card:is([data-category="Make"],[data-category="Music"]){--card-fill:var(--party-pink)}
#app .card :is(.card-picture,.card-copy){background:var(--card-fill)}
#app .card:is(:hover,:active){box-shadow:none;transform:none;outline:2px solid var(--button-ink);outline-offset:-6px}
#app .card:focus-visible{outline:4px solid var(--button-ink);outline-offset:4px}
/* The island has one composition, one centre line, and one title scale. */
#app .card{justify-content:center;--title-accent:var(--party-pink)}
#app .card[data-category="Build"],#app .card[data-category="Move"]{--title-accent:var(--party-yellow)}
#app .card[data-category="Make"],#app .card[data-category="Music"]{--title-accent:var(--party-teal)}
#app .card .card-picture{flex:0 1 65%;width:100%;height:65%;min-height:0;padding:20px 22px 0;overflow:hidden}
#app .card .card-picture .lesson-illustration{position:static;display:block;width:100%;height:100%;max-width:none;max-height:none;inset:auto;margin:0;overflow:hidden}
#app .card .card-wordmark{display:grid;place-items:center;flex:0 1 35%;width:100%;height:35%;margin:0;padding:0 24px 16px;border:0;line-height:1;background:none}
.game-wordmark{display:block;width:100%;height:100%;max-width:500px;overflow:hidden;pointer-events:none}
.wordmark-lettering{font-family:'Trebuchet MS',Arial,sans-serif;font-weight:900;letter-spacing:-1px;fill:var(--button-ink)}
.wordmark-accent{fill:var(--title-accent,var(--party-yellow));stroke:var(--button-ink);stroke-width:2.4px;stroke-linejoin:round;paint-order:stroke fill}
#app .card:is(:hover,:active,.is-selecting){outline:none;box-shadow:none;transform:none}
#app .card::after{content:'';position:absolute;inset:5px;border:2px solid var(--button-ink);border-radius:9px;opacity:0;pointer-events:none}
#app .card:is(:hover,:active,.is-selecting)::after{opacity:1}
#app .card.is-selecting::after{border-width:3px}
#app .card:focus-visible{outline:4px solid var(--button-ink);outline-offset:4px}
/* Four seconds per action; every visible island runs continuously. */
.card-illustration .preview-phase{display:none;opacity:0}
.card-illustration .preview-rest *{animation:none!important}
.card-illustration .preview-phase *{animation-play-state:paused}
:is(.card,.game-identity) .preview-rest{display:none}
:is(.card,.game-identity) .preview-phase{display:inline;animation:preview-two 8s linear var(--phase-delay) infinite}
:is(.card,.game-identity) .preview-count-1 .preview-phase{opacity:1;animation:none}
:is(.card,.game-identity) .preview-count-3 .preview-phase{animation-name:preview-three;animation-duration:12s}
:is(.card,.game-identity) .preview-phase *{animation-play-state:running}
@keyframes preview-two{0%,48%{opacity:1}50%,100%{opacity:0}}
@keyframes preview-three{0%,31%{opacity:1}33.333%,100%{opacity:0}}
.game-identity{display:flex;align-items:center;gap:6px;min-width:0;width:450px;height:88px;--title-accent:var(--party-yellow)}
.game-identity-art{display:block;flex:0 1 190px;min-width:0;height:100%}
.game-identity-art .card-illustration{width:100%;height:100%}
.game-heading .game-name{display:block;flex:1;min-width:0;height:100%;margin:0;line-height:1}
.game-heading .game-wordmark{max-width:none}
@media(max-height:800px) and (min-width:900px){
 #app .card{flex-direction:row;align-items:center}
 #app .card .card-picture{flex:0 0 59%;width:59%;height:100%;padding:22px 4px 10px 14px}
 #app .card .card-wordmark{flex:0 0 41%;width:41%;height:100%;padding:16px 14px 12px 0}
 .game-identity{height:64px;width:370px}
 .game-identity-art{flex-basis:155px}
}
@media(min-width:651px) and (max-width:899px){.game-grid{grid-auto-rows:minmax(260px,auto)}}
@media(max-width:650px){
 .game-grid{grid-template-columns:1fr;grid-template-rows:none;grid-auto-rows:300px}
 #app .card .card-picture{height:62%;flex-basis:62%;padding:22px 14px 0}
 #app .card .card-wordmark{height:38%;flex-basis:38%;padding:0 14px 14px}
 .game-heading{align-items:center;gap:8px}
 .game-identity{height:72px;flex:1;min-width:0}
 .game-identity-art{display:none}
 .game-heading .action-button{--button-width:130px}
}
@media(prefers-reduced-motion:reduce){
 :is(.card,.game-identity) .preview-rest{display:inline}
 :is(.card,.game-identity) .preview-phase{display:none}
}
/* Let groups wrap rather than shrink individual buttons. */
.filters,.toolbar,.demo-tools,.dialog-actions,.winner-choices,.lesson-controls{flex-wrap:wrap;gap:10px}
.lesson-title{flex-wrap:wrap}
.lesson-progress{flex-wrap:wrap;flex-shrink:1;justify-content:flex-end;gap:10px}
.demo-tools{justify-content:center}
.winner-choices{display:flex}
.market-bottom{flex-wrap:wrap}
.market-head>div{min-width:0}
.pager{flex-wrap:wrap;justify-content:center;gap:10px}
.host-play{justify-items:center}
.host-play>.action-button{align-self:center}

/* Selected welcome: overlapping original artwork and three date circles. */
.crest-welcome{gap:22px}
.birthday-emblem{display:flex;flex-direction:column;align-items:center;width:100%;isolation:isolate}
.birthday-emblem .birthday-portrait{overflow:hidden;border-radius:0 0 50% 50% / 0 0 22% 22%}
.birthday-emblem .birthday-title-art{position:relative;z-index:1;max-width:100%;margin-top:clamp(-74px,-5.7vh,-37px)}
.option-badges{--button-width:280px;width:510px;max-width:100%;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:14px}
.birthday-badges{display:flex;align-items:center;justify-content:center;gap:22px;width:100%;padding:5px 0 9px}
.birthday-badge{display:flex;justify-content:center;align-items:center;width:112px;height:112px;border:2px solid var(--ink);border-radius:50%;box-shadow:3px 4px 0 var(--ink)}
.birthday-badge strong{font:900 43px/1 'Arial Black',Arial,sans-serif;letter-spacing:-.05em}
.badge-date{background:var(--party-yellow);transform:rotate(-7deg)}
.badge-month{background:var(--party-pink);transform:translateY(-6px)}
.badge-year{background:var(--party-teal);transform:rotate(7deg)}
.badge-year strong{font-size:32px;letter-spacing:-.06em}
@media(max-width:650px){
 .topbar{gap:10px;align-items:center}.toolbar{justify-content:flex-end}
 .option-badges{--button-width:260px}.birthday-badges{gap:12px}.birthday-badge{width:92px;height:92px}.birthday-badge strong{font-size:37px}
 .badge-year strong{font-size:26px}
}
@media(max-width:359px){.birthday-badges{gap:8px}.birthday-badge{width:82px;height:82px}}
@media(max-height:800px) and (min-width:900px){
 .crest-welcome .birthday-portrait{width:20vh;min-width:0}.crest-welcome .birthday-title-art{width:360px}
 .crest-welcome{gap:14px}.birthday-emblem .birthday-title-art{margin-top:-22px}
 .birthday-badge{width:82px;height:82px}.birthday-badge strong{font-size:34px}.birthday-badges{padding:0}.option-badges{gap:9px}
 .badge-year strong{font-size:24px}
}

/* Five generous, one-shot celebrations; only transforms and opacity animate. */
#confetti{contain:strict;pointer-events:none}
.confetti-wave{position:absolute;inset:0;pointer-events:none}
.confetti-wave .confetto{position:absolute;width:var(--size);height:calc(var(--size)*1.5);opacity:0;border-radius:2px;animation:none;backface-visibility:hidden}
.confetto.confetto--circle{height:var(--size);border-radius:50%}
.confetto.confetto--star{height:var(--size);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 94%,50% 72%,21% 94%,32% 57%,2% 35%,39% 35%)}
.confetto.confetto--ribbon{width:calc(var(--size)*.45);height:calc(var(--size)*2.8);border-radius:8px}
.confetti-wave .confetto--rain{animation:confetti-rain var(--duration) linear var(--delay) both}
.confetti-wave .confetto--cannons{animation:confetti-cannons var(--duration) cubic-bezier(.15,.55,.45,1) var(--delay) both}
.confetti-wave .confetto--fountain{animation:confetti-fountain var(--duration) cubic-bezier(.18,.6,.5,1) var(--delay) both}
.confetti-wave .confetto--spiral{animation:confetti-spiral var(--duration) linear var(--delay) both}
.confetti-wave .confetto--burst{animation:confetti-burst var(--duration) ease-out var(--delay) both}
@keyframes confetti-rain{0%{opacity:0;transform:translate(0,-25px) rotate(0)}8%,85%{opacity:1}100%{opacity:0;transform:translate(var(--dx),110vh) rotate(var(--spin))}}
@keyframes confetti-cannons{0%{opacity:0;transform:translate(0,0) rotate(0) scale(.5)}5%,75%{opacity:1}45%{transform:translate(calc(var(--dx)*.65),var(--dy)) rotate(calc(var(--spin)*.45)) scale(1)}100%{opacity:0;transform:translate(var(--dx),20vh) rotate(var(--spin)) scale(.7)}}
@keyframes confetti-fountain{0%{opacity:0;transform:translate(0,0) rotate(0)}6%,80%{opacity:1}40%{transform:translate(calc(var(--dx)*.5),var(--dy)) rotate(calc(var(--spin)*.4))}100%{opacity:0;transform:translate(var(--dx),12vh) rotate(var(--spin))}}
@keyframes confetti-spiral{0%{opacity:0;transform:translate(0,0) rotate(0)}8%,85%{opacity:1}25%{transform:translate(calc(var(--dx) + 5vw),26vh) rotate(calc(var(--spin)*.25))}50%{transform:translate(calc(var(--dx) - 5vw),54vh) rotate(calc(var(--spin)*.5))}75%{transform:translate(calc(var(--dx) + 3vw),82vh) rotate(calc(var(--spin)*.75))}100%{opacity:0;transform:translate(var(--dx),110vh) rotate(var(--spin))}}
@keyframes confetti-burst{0%{opacity:0;transform:translate(0,0) scale(.15) rotate(0)}8%{opacity:1}40%{opacity:1;transform:translate(var(--dx),var(--dy)) scale(1.15) rotate(calc(var(--spin)*.4))}100%{opacity:0;transform:translate(calc(var(--dx)*1.3),calc(var(--dy) + 75vh)) scale(.65) rotate(var(--spin))}}
@media(prefers-reduced-motion:reduce){#confetti{display:none}.confetti-wave .confetto{animation:none!important}}
