@font-face{font-family:Atkinson;src:url(/fonts/Atkinson-Regular.ttf)format("truetype");font-weight:400;font-display:swap}@font-face{font-family:Atkinson;src:url(/fonts/Atkinson-Bold.ttf)format("truetype");font-weight:700;font-display:swap}:root{--cream:#f4f1ea;--ink:#1a1a1a;--ink-soft:#4a4a4a;--line:#d8d2c4;--sky-day:#bfe3f7;--sky-dusk:#f3c6a5;--sky-night:#2b2f55;--grass:#7fc85a;--purple:#d63cf0;--green:#5ea63f;--amber:#f2b13d;--blue:#4f8fd6;--grey:#cfcac0;--radius:10px}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--cream);color:var(--ink);letter-spacing:.01em;-webkit-font-smoothing:antialiased;font-family:Atkinson,system-ui,sans-serif;font-size:20px;line-height:1.4;overflow:hidden}#app{height:100%}button{font:inherit;color:inherit;border:3px solid var(--ink);border-radius:var(--radius);cursor:pointer;box-shadow:0 4px 0 var(--ink);background:#fff;padding:10px 18px;transition:transform 80ms,box-shadow 80ms}button:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}button:disabled{opacity:.45;cursor:default}select,input[type=number],input[type=text]{font:inherit;border:2px solid var(--ink);background:#fff;border-radius:8px;padding:6px 10px}a{color:var(--blue)}h1,h2,h3{margin:0 0 8px;font-weight:700}h1{font-size:34px}h2{margin-top:28px;font-size:24px}p{margin:6px 0}.screen{flex-direction:column;height:100%;display:flex}.parent{max-width:1100px;height:100%;margin:0 auto;padding:24px 32px 80px;overflow:auto}.row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.muted{color:var(--ink-soft)}.small{font-size:16px}.icon-btn{border-radius:16px;justify-content:center;align-items:center;width:72px;height:72px;padding:0;display:inline-flex}.icon-btn.big{border-radius:28px;flex-direction:column;gap:8px;width:200px;height:200px}.icon-btn.mid{border-radius:20px;width:124px;height:124px}.icon-btn.small{width:48px;height:48px;box-shadow:0 3px 0 var(--ink);border-width:2px;border-radius:12px}.home{justify-content:center;align-items:center;gap:28px;padding-bottom:170px;position:relative}.home .tiles{flex-wrap:wrap;justify-content:center;gap:28px;display:flex}.home .tiles.games{gap:18px;max-width:min(92vw,1000px)}.home .corner{gap:12px;display:flex;position:absolute;top:20px;right:20px}.home .camera-on{background:var(--purple);border-radius:50%;width:14px;height:14px;animation:2s ease-in-out infinite twinkle;position:absolute;top:28px;left:28px}.home .title{letter-spacing:.04em;font-size:40px;font-weight:700}.home .coach-spot{position:absolute;bottom:40px;left:48px}.home .village-spot{pointer-events:none;position:absolute;bottom:64px;left:50%;transform:translate(-46%)}.village svg{display:block}.village .drop{transform-box:fill-box;transform-origin:50%;animation:.35s cubic-bezier(.2,.9,.3,1.2) drop}.home .xp-spot{width:min(600px,70vw);position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.session{grid-template-rows:84px 1fr;grid-template-columns:minmax(460px,1.15fr) 1fr;height:100%;transition:background 1.5s;display:grid}.session.round-0{background:linear-gradient(var(--sky-day), var(--cream) 70%)}.session.round-1{background:linear-gradient(var(--sky-dusk), var(--cream) 70%)}.session.round-2,.session.round-3,.session.round-4{background:linear-gradient(var(--sky-night), var(--cream) 80%)}.session.round-2 .topbar,.session.round-3 .topbar,.session.round-4 .topbar{color:#fff}.session.round-2 .topbar .streak svg,.session.round-3 .topbar .streak svg{filter:drop-shadow(0 0 2px #fff)}.topbar{grid-column:1/-1;align-items:center;gap:24px;padding:14px 24px;display:flex}.topbar .pips{gap:8px;display:flex}.topbar .pip{border:3px solid;border-radius:4px;width:18px;height:18px}.topbar .pip.done{background:currentColor}.topbar .pip.now{background:var(--purple);border-color:var(--purple)}.topbar .streak{align-items:center;gap:4px;min-height:32px;display:flex}.topbar .streak .n{margin-left:8px;font-size:26px;font-weight:700}.topbar .spacer{flex:1}.topbar .xp{width:min(420px,36vw)}.build-pane{flex-direction:column;justify-content:flex-end;padding:0 0 0 20px;display:flex;position:relative}.build-pane .ground{height:32px;image-rendering:pixelated;background-repeat:repeat-x;background-size:32px 32px}.build-pane .sky{pointer-events:none;position:absolute;inset:0;overflow:hidden}.build-pane .cloud{opacity:.9;animation:60s linear infinite drift;position:absolute;top:8%}.build-pane .cloud.c2{animation-duration:90s;animation-delay:-40s;top:26%}@keyframes drift{0%{left:-80px}to{left:110%}}.build-pane .star{animation:2s ease-in-out infinite twinkle;position:absolute}@keyframes twinkle{0%,to{opacity:.4}50%{opacity:1}}.build-pane .scene{z-index:1;justify-content:safe center;align-items:flex-end;gap:20px;margin-bottom:-4px;padding-left:8px;display:flex;position:relative}.build-pane .coach{margin-bottom:4px}.stage{justify-content:center;align-items:center;padding:24px;display:flex;position:relative}.stage .prompt{flex-direction:column;align-items:center;gap:24px;display:flex}.numeral{letter-spacing:.02em;font-size:clamp(120px,28vmin,300px);font-weight:700;line-height:1}.numeral .zero{transform-origin:50%;display:inline-block;transform:scaleX(.84)}.numeral.medium{font-size:clamp(96px,16vmin,180px)}.word{letter-spacing:.08em;font-size:clamp(64px,12vmin,140px);font-weight:700}.stage .hidden-visual{opacity:0}.stage .listening-icon{opacity:.9;animation:1.6s ease-in-out infinite breathe}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}.twelve-frame{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.twelve-frame .slot{width:var(--slot,64px);height:var(--slot,64px);border:3px solid var(--ink);opacity:.35;border-radius:4px}.twelve-frame .slot.on{opacity:1;border-color:#0000}.twelve-frame.big{--slot:min(11vmin, 96px);gap:10px}.twelve-frame.small{--slot:22px;gap:3px}.twelve-frame.small .slot{border-width:2px}.fact{grid-template-rows:auto auto;grid-template-columns:1fr 1fr;place-items:center;gap:12px 40px;display:grid}.fact .top{grid-column:1/-1}.fact .op{font-size:clamp(56px,10vmin,120px);font-weight:700}.fact .q{color:var(--purple)}.fact .tri{width:0;height:0}.feedback{align-items:center;gap:40px;animation:.3s fade-in;display:flex}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.strategy{--cell:min(5.2vmin, 46px);gap:calc(var(--cell) * .45);flex-direction:column;display:flex}.strategy .group{gap:5px;display:grid}.strategy.tenframes .group{grid-template-columns:repeat(5, var(--cell));grid-template-rows:repeat(2, var(--cell));border:3px solid var(--ink);border-radius:8px;padding:6px}.strategy.rows .group{grid-auto-rows:var(--cell)}.strategy .cell{width:var(--cell);height:var(--cell);border:2px solid var(--ink);opacity:.3;border-radius:4px}.strategy .cell.a,.strategy .cell.b{opacity:1;clip-path:polygon(12% 0,88% 0,100% 12%,100% 88%,88% 100%,12% 100%,0 88%,0 12%);border-color:#0000}.strategy .cell.a{background:var(--ink)}.strategy .cell.b{background:var(--purple);animation:.5s .3s both fade-in}.strategy-feedback{gap:48px}.camera-preview{aspect-ratio:16/9;border:3px solid var(--ink);background:#000;border-radius:12px;width:220px;position:absolute;bottom:20px;right:20px;overflow:hidden}.camera-preview.large{width:min(100%,900px);position:relative;bottom:auto;right:auto}.camera-preview .mirror{position:absolute;inset:0;transform:scaleX(-1)}.camera-preview video,.camera-preview canvas{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.camera-preview .hint{color:#fff;text-align:center;background:#1a1a1acc;padding:4px;font-size:16px;position:absolute;bottom:0;left:0;right:0}.done-overlay{background:#f4f1ead9;flex-direction:column;justify-content:center;align-items:center;gap:24px;animation:.6s fade-in;display:flex;position:absolute;inset:0}.mystery,.crafting{flex-direction:column;align-items:center;gap:28px;display:flex}.mystery .cards,.crafting .cards{gap:28px;display:flex}.mystery .card,.crafting .card{aspect-ratio:54/86;border:4px solid var(--ink);background:#fff;border-radius:14px;justify-content:center;align-items:center;width:clamp(120px,17vmin,190px);display:flex}.mystery .card.hidden{border-color:var(--purple);background:#2b2f55}.mystery .card.hidden .q{color:var(--purple)}.crafting .card.empty{opacity:.45;background:0 0;border-style:dashed}.crafting .recipe{align-items:center;gap:28px;display:flex}.choice{align-items:flex-start;gap:56px;animation:.3s fade-in;display:flex}.choice .option{flex-direction:column;align-items:center;gap:10px;display:flex}.numeral.badge{color:var(--ink-soft);font-size:72px}.reveal{flex-direction:column;align-items:center;gap:8px;display:flex}.reveal .word{font-size:clamp(48px,9vmin,104px)}.twelve-frame .slot.on.second{background:var(--purple)}.leave-ask{align-items:center;gap:48px;animation:.3s fade-in;display:flex}.leave-ask .icon-btn.big:first-child{border-color:var(--green);box-shadow:0 4px 0 var(--green)}.done-overlay .big-level{color:var(--purple);font-size:120px;font-weight:700;line-height:1}.tap-pad{grid-template-columns:repeat(7,1fr);gap:8px;margin-top:16px;display:grid}.tap-pad button{min-width:64px;padding:10px 0;font-size:32px;font-weight:700}.coach-wrap{display:inline-block;position:relative}.coach-wrap.idle svg{transform-origin:bottom;animation:3s ease-in-out infinite sway}.coach-wrap.happy svg{transform-origin:bottom;animation:.5s ease-in-out infinite bounce}.coach-wrap.think svg{transform-origin:bottom;animation:1.2s ease-in-out infinite tilt}.coach-wrap.teleport svg{animation:.9s ease-out teleport}@keyframes sway{0%,to{transform:rotate(-1.5deg)}50%{transform:rotate(1.5deg)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-14px)}}@keyframes tilt{0%,to{transform:rotate(0)}50%{transform:rotate(6deg)}}@keyframes teleport{0%{opacity:0;transform:translateY(20px)scaleY(1.4)}60%{opacity:1;transform:translateY(-6px)scaleY(.95)}to{transform:none}}.particles{pointer-events:none;position:absolute;inset:-20px}.particle{background:var(--purple);width:6px;height:6px;animation:.9s ease-out forwards particle;position:absolute}@keyframes particle{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(var(--dx), var(--dy))}}.boss-spot{align-self:flex-end;margin-bottom:4px;margin-left:-28px}.boss-wrap{flex-direction:column;align-items:center;gap:8px;display:inline-flex;position:relative}.boss-wrap .hearts{flex-wrap:wrap;justify-content:center;gap:3px;max-width:120px;display:flex}.boss-wrap .boss-sprite svg{transform-origin:bottom;animation:2.4s ease-in-out infinite sway}.boss-wrap.enter .boss-sprite{animation:.9s ease-out teleport}.boss-wrap.hit .boss-sprite{animation:.32s ease-out boss-hit}.boss-wrap.wobble .boss-sprite svg{animation:.7s ease-in-out tilt}.boss-wrap.exploding .boss-sprite,.boss-wrap.exploding .hearts{animation:.7s ease-in forwards boss-explode}@keyframes boss-hit{0%{transform:translate(0)}25%{transform:translate(10px)rotate(4deg)}60%{transform:translate(-6px)}to{transform:none}}@keyframes boss-explode{0%{opacity:1;transform:scale(1)}60%{opacity:1;transform:scale(1.35)}to{opacity:0;transform:scale(1.8)}}.boss-particle{background:var(--green);width:9px;height:9px;animation-duration:1.2s}.boss-particle:nth-child(3n){background:var(--purple)}.boss-particle:nth-child(5n){background:#7a4f22}.crown-drop{animation:1.1s cubic-bezier(.3,1.4,.5,1) .5s both crown-drop;position:absolute;bottom:0;left:50%;transform:translate(-50%)}@keyframes crown-drop{0%{opacity:0;transform:translate(-50%,-260px)}30%{opacity:1}70%{transform:translate(-50%)}85%{transform:translate(-50%,-18px)}to{opacity:1;transform:translate(-50%)}}.coach-wrap .staff{transform-origin:bottom;position:absolute}.coach-wrap .staff.swing{animation:.35s ease-out staff-swing}@keyframes staff-swing{0%{transform:rotate(0)}40%{transform:rotate(55deg)}to{transform:rotate(0)}}.xp-bar{align-items:center;gap:12px;display:flex}.xp-bar .level{text-align:center;min-width:32px;color:var(--green);font-size:22px;font-weight:700}.xp-bar .track{border:3px solid var(--ink);background:#fff;border-radius:4px;flex:1;height:18px;overflow:hidden}.xp-bar .fill{background:repeating-linear-gradient(90deg, var(--green) 0 8px, var(--grass) 8px 16px);height:100%;transition:width .6s}.build svg{display:block}.build .drop{transform-box:fill-box;transform-origin:50%;animation:.35s cubic-bezier(.2,.9,.3,1.2) drop}@keyframes drop{0%{opacity:0;transform:translateY(-24px)scale(.6)}to{opacity:1;transform:none}}.heat{border-collapse:collapse}.heat th,.heat td{border:1px solid var(--line);text-align:center;padding:0;font-size:14px}.heat th{padding:4px 8px;font-weight:700}.heat td{width:44px;height:36px}.cell{width:100%;height:100%;box-shadow:none;cursor:pointer;border:none;border-radius:0;padding:0;font-size:13px}.cell.untouched{background:var(--grey)}.cell.counting{background:var(--amber)}.cell.strategy{background:var(--blue);color:#fff}.cell.automatic{background:var(--green);color:#fff}.cell.locked{color:#999;background:repeating-linear-gradient(45deg,#eee 0 4px,#ddd 4px 8px)}.cell.selected{outline:3px solid var(--purple);outline-offset:-3px}.legend{align-items:center;gap:14px;margin:8px 0;font-size:15px;display:flex}.legend .swatch{vertical-align:middle;border:1px solid var(--line);width:18px;height:18px;margin-right:4px;display:inline-block}.detail{border:2px solid var(--ink);background:#fff;border-radius:10px;margin-top:12px;padding:12px 16px}table.log{border-collapse:collapse;width:100%;font-size:16px}table.log th,table.log td{text-align:left;border-bottom:1px solid var(--line);padding:6px 10px}.order-list{columns:3;column-gap:16px;margin:0;padding:0;font-size:15px;list-style:none}.order-list li{break-inside:avoid;align-items:center;gap:6px;padding:2px 0;display:flex}.order-list li button{box-shadow:none;border-width:1px;padding:0 6px;font-size:13px}.order-list li.dragging{opacity:.4}.controls{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px 24px;display:grid}.controls label{align-items:center;gap:10px;display:flex}.controls label span{min-width:180px}.field{align-items:center;gap:10px;display:flex}.setup .stats{flex-wrap:wrap;gap:24px;font-size:16px;display:flex}.setup .test-ok{color:var(--green);font-weight:700}@media (max-width:900px){.session{grid-template-rows:84px auto 1fr;grid-template-columns:1fr}.build-pane{padding-left:0}.icon-btn.big{width:150px;height:150px}}.twelve-frame .slot.on{background:var(--ink);clip-path:polygon(12% 0,88% 0,100% 12%,100% 88%,88% 100%,12% 100%,0 88%,0 12%)}.session.round-2 .twelve-frame .slot,.session.round-3 .twelve-frame .slot{border-color:var(--ink)}
