:root{--bg:#e8f8f4;--bg-dot:#cdeee6;--ink:#2b2440;--ink-soft:#5b5578;--teal:#2ec4b6;--go:#2fb36d;--go-dark:#1f8a50;--soft:#d9f1ec;--shadow:0 5px 0 #2b244029;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:Fredoka,"Baloo 2",system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);background-image:radial-gradient(var(--bg-dot) 1.6px, transparent 1.6px);min-height:100%;color:var(--ink);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;background-size:24px 24px;margin:0}[hidden]{display:none!important}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;border:0}:focus-visible{outline-offset:3px;outline:3px solid #3d7eff}.hub{max-width:1100px;padding-block:22px 160px;padding-left:max(16px, env(safe-area-inset-left,0px));padding-right:max(16px, env(safe-area-inset-right,0px));margin:0 auto}.hub-top{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}h1{margin:0;font-size:clamp(2.3rem,6vw,3.6rem);font-weight:700;line-height:1}h1 span{color:var(--teal);-webkit-text-stroke:1.5px var(--ink);paint-order:stroke fill}.hub-sub{color:var(--ink-soft);margin:8px 0 26px;font-size:1.2rem;font-weight:500}.pill{min-height:44px;box-shadow:var(--shadow);background:#fff;border-radius:999px;padding:.4em 1em;font-weight:600}.pill[aria-pressed=false]{color:var(--ink-soft)}.places{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:22px;margin:0;padding:0;list-style:none;display:grid}.place{text-align:left;width:100%;height:100%;color:inherit;border-radius:26px;flex-direction:column;padding:0;text-decoration:none;transition:transform .12s;display:flex;overflow:hidden;box-shadow:0 8px #2b244033}.place:hover{transform:translateY(-4px)rotate(-.6deg)}.place:active{transform:translateY(2px)}.place-art{aspect-ratio:16/10;place-items:center;padding:22px 28%;display:grid}.place-art svg{width:100%;height:100%}.place-text{flex-direction:column;flex:1;gap:4px;padding:16px 20px 20px;display:flex}.place-kind{letter-spacing:.08em;text-transform:uppercase;border-radius:999px;width:max-content;padding:3px 12px;font-size:.8rem;font-weight:600}.place-name{font-size:1.7rem;font-weight:700}.place-about{opacity:.85;font-size:1.05rem;line-height:1.35}.place-stars{align-items:center;gap:6px;margin-top:6px;font-size:1.1rem;font-weight:600;display:inline-flex}.place-stars svg{fill:#ffc61a;width:22px;height:22px}.place.code{color:#fff;background:#241a4d}.place.code .place-art{background:#33266b;padding:22px 18%}.place.code .place-kind{color:#fff;background:#2bb673}.place.design{background:#fffaf0}.place.design .place-art{background:#fdf3e1 radial-gradient(#f3e2c2 1.5px,#0000 1.5px) 0 0/18px 18px;padding-block:34px}.place.design .place-art svg{border-radius:2px;box-shadow:0 0 0 10px #fff,0 0 0 16px #c8894a}.place.design .place-kind{color:#fff;background:#ec4b3f}.place.words{background:#eef4ff}.place.words .place-art{background:#dce8ff;padding-inline:12%}.place.words .word-card{justify-content:center;align-items:center;gap:10px;width:100%;height:100%;display:flex}.place.words .word-card svg{width:auto;max-width:55%;height:100%}.place.words .word-card b{color:#2f63d6;font-size:clamp(2rem,5vw,3.2rem)}.place.words .place-kind{color:#fff;background:#3d7eff}.place.data{color:#fff;background:#0f2a3a}.place.data .place-art{background:#163d52;padding-inline:18%}.place.data .place-kind{color:#0f2a3a;background:#22c3b5}.place.maths{background:#fff4ea}.place.maths .place-art{background:#ffe3cc;padding:6px 12%}.place.maths .place-kind{color:#fff;background:#e0713a}.place.steps{background:#f1fbe9}.place.steps .place-art{background:#d6f2c2;padding:6px 20%}.place.steps .place-kind{color:#fff;background:#3f9b2f}.place.pattern{background:#eef5ff}.place.pattern .place-art{background:#d3e5ff;padding:6px 8%}.place.pattern .place-kind{color:#fff;background:#3a6fd9}.place.sort{background:#fff0f5}.place.sort .place-art{background:#ffd6e4;padding:6px 14%}.place.sort .place-kind{color:#fff;background:#d9577f}.place.build{background:#fffbea}.place.build .place-art{background:#fff0b8;padding-inline:22%}.place.build .place-kind{color:#2b2440;background:#e0a400}.place.story{background:#fff0f6}.place.story .place-art{background:#ffd6e7;padding-inline:20%}.place.story .place-kind{color:#fff;background:#e06a98}.place.science{background:#eefaf1}.place.science .place-art{background:#d3f2dc;padding-inline:30%}.place.science .place-kind{color:#fff;background:#1f8a50}.place.safety{background:#f4efff}.place.safety .place-art{background:#e4d9ff;padding-inline:22%}.place.safety .place-kind{color:#fff;background:#8a5fe6}.place.soon{box-shadow:none;background:0 0;border:3px dashed #9fd8cd}.soon-art{color:#9fd8cd;font-size:4rem;font-weight:700}.place.soon .place-kind{background:var(--soft);color:var(--ink-soft)}.welcome{min-height:100dvh;padding-block:24px 150px;padding-left:max(16px, env(safe-area-inset-left,0px));padding-right:max(16px, env(safe-area-inset-right,0px));place-items:center;display:grid}body[data-screen=welcome] .codie{display:none}.welcome-card{text-align:center;justify-items:center;gap:6px;width:min(100%,760px);display:grid}.welcome-codie{filter:drop-shadow(0 6px #2b24402e);width:120px;height:132px}.welcome-codie svg{width:100%;height:100%;overflow:visible}.welcome h1{text-wrap:balance}.welcome-sub{color:var(--ink-soft);margin:4px 0 18px;font-size:1.2rem;font-weight:500}.welcome-ask{margin:0 0 12px;font-size:1.7rem}.age-picks{grid-template-columns:repeat(4,1fr);gap:14px;width:100%;display:grid}.age-pick{box-shadow:var(--shadow);background:#fff;border-radius:22px;gap:2px;padding:22px 10px;transition:transform .15s;display:grid}.age-pick:hover{transform:translateY(-3px)}.age-pick:active{transform:translateY(2px)}.age-pick b{font-size:2rem;line-height:1.1}.age-pick span{color:var(--ink-soft);font-weight:600}.age-pick:first-child b{color:#ff7a45}.age-pick:nth-child(2) b{color:#2bb673}.age-pick:nth-child(3) b{color:#3d7eff}.age-pick:nth-child(4) b{color:#8a55e6}.welcome-step{justify-items:center;width:100%;display:grid}.name-form{gap:12px;width:min(100%,520px);display:flex}.name-input{min-width:0;min-height:64px;box-shadow:var(--shadow);font:inherit;color:var(--ink);background:#fff;border:3px solid #0000;border-radius:20px;flex:1;padding:0 20px;font-size:1.6rem;font-weight:600}.name-input:focus{border-color:var(--teal);outline:none}.name-input::placeholder{color:#a8a3bd;font-weight:500}.name-go{background:var(--go);color:#fff;min-height:64px;box-shadow:0 5px 0 var(--go-dark);border-radius:20px;padding:0 24px;font-size:1.3rem;font-weight:700}.name-go:active{box-shadow:0 2px 0 var(--go-dark);transform:translateY(3px)}.name-note{color:var(--ink-soft);margin:14px 0 0;font-weight:500}.name-skip{min-height:44px;color:var(--ink);text-underline-offset:3px;background:0 0;padding:0 10px;font-weight:700;text-decoration:underline}.grown-up{min-height:44px;color:var(--ink-soft);text-underline-offset:3px;background:0 0;margin-top:18px;padding:0 14px;font-weight:600;text-decoration:underline}.for-age{flex-wrap:wrap;align-items:center;gap:12px;margin:-10px 0 22px;display:flex}.age-title{font-size:1.35rem;font-weight:700}.place-ages{background:#2b244014;border-radius:999px;align-self:flex-start;margin-top:2px;padding:2px 10px;font-size:.9rem;font-weight:700}.place.code .place-ages,.place.data .place-ages{background:#ffffff29}.codie{left:max(16px, env(safe-area-inset-left,0px));right:max(16px, env(safe-area-inset-right,0px));bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:45;pointer-events:none;align-items:flex-end;gap:8px;display:flex;position:fixed}.codie-body{pointer-events:auto;filter:drop-shadow(0 4px #2b244033);background:0 0;flex:none;width:88px;height:96px;padding:0}.codie-svg{width:100%;height:100%;overflow:visible}.codie-bob{transform-origin:60px 120px;animation:2.4s ease-in-out infinite codie-bob}@keyframes codie-bob{50%{transform:translateY(-3px)rotate(-2deg)}}.codie-beret{transform-origin:60px 30px}.codie.talking .codie-beret{animation:1.2s ease-in-out beret}@keyframes beret{50%{transform:rotate(-6deg)}}.codie-eyes{transform-origin:60px 54px;animation:4.5s infinite codie-blink}@keyframes codie-blink{0%,94%,to{transform:scaleY(1)}97%{transform:scaleY(.1)}}.codie-arm-r{transform-origin:98px 74px}.codie.talking .codie-arm-r{animation:.9s ease-in-out 2 codie-wave}@keyframes codie-wave{50%{transform:rotate(-22deg)}}.codie-talk,.codie-frown,.codie.speaking .codie-smile{display:none}.codie.speaking .codie-talk{transform-origin:60px 69px;animation:.22s ease-in-out infinite alternate codie-talk;display:block}@keyframes codie-talk{0%{transform:scaleY(.35)}to{transform:scaleY(1)}}.codie[data-mood=oops] .codie-smile{display:none}.codie[data-mood=oops]:not(.speaking) .codie-frown{display:block}.codie[data-mood=oops] .codie-brows{transform-origin:60px 40px;transform:translateY(2px)rotate(4deg)}.codie[data-mood=think] .codie-brows{transform:translateY(-3px)}.codie[data-mood=think] .codie-eyes{animation:none;transform:translate(3px)}.codie[data-mood=cheer] .codie-arm-l{transform-origin:22px 74px;transform:rotate(40deg)}.codie[data-mood=cheer] .codie-arm-r{transform:rotate(-30deg)}.codie-bubble{pointer-events:auto;color:var(--ink);width:max-content;max-width:min(420px,100% - 100px);box-shadow:0 6px 0 #2b244033, 0 0 0 2px var(--soft);opacity:0;transform-origin:0 100%;visibility:hidden;background:#fff;border-radius:18px;margin-bottom:30px;padding:12px 16px;font-size:1.08rem;font-weight:500;line-height:1.4;transition:opacity .18s,transform .18s;position:relative;transform:translateY(8px)scale(.96)}.codie-bubble:before{content:"";border:9px solid #0000;border-left:0;border-right-color:#fff;position:absolute;bottom:16px;left:-9px}.codie.talking .codie-bubble{opacity:1;visibility:visible;transform:none}.codie-bubble p{margin:0}.codie-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:10px;display:none}:is(.codie.talking .codie-actions:has(.codie-replay:not([hidden])),.codie.waiting .codie-actions){display:flex}.codie-actions button{border-radius:999px;min-height:42px;padding:6px 16px;font-weight:700}.codie-replay{background:var(--soft)}.codie-next{background:var(--go);color:#fff;display:none}.codie.waiting .codie-next{animation:1.2s ease-in-out infinite codie-pulse;display:inline-block}@keyframes codie-pulse{50%{transform:scale(1.06)}}@media (width<=560px){.codie-body{width:58px;height:64px}.codie-bubble{max-width:calc(100% - 66px);font-size:.98rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}@media (width<=560px){.age-picks{grid-template-columns:repeat(2,1fr);gap:12px}.welcome-codie{width:92px;height:100px}.welcome-ask{font-size:1.45rem}.name-form{flex-direction:column}.name-input,.name-go{min-height:56px}.place-art{aspect-ratio:2}.place.soon .place-art{aspect-ratio:auto;padding-block:12px 0}}.warm-up{box-shadow:var(--shadow);background:#fff7d6;border-radius:22px;margin:0 0 26px;padding:16px 20px 20px}.warm-up h2{margin:0;font-size:1.5rem}.warm-up p{color:var(--ink-soft);margin:4px 0 14px;font-size:1.05rem}.warm-up-list{flex-wrap:wrap;gap:12px;margin:0;padding:0;list-style:none;display:flex}.warm-up-item{min-width:160px;min-height:64px;color:inherit;box-shadow:var(--shadow);background:#fff;border-radius:16px;flex-direction:column;gap:2px;padding:10px 18px;text-decoration:none;display:flex}.warm-up-item:active{transform:translateY(2px)}.warm-up-section{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);font-size:.85rem;font-weight:600}.warm-up-name{font-size:1.25rem;font-weight:700}.place-art .mini-train{justify-content:center;align-items:center;gap:4px;height:100%;display:flex}.place-art .mini-car{aspect-ratio:1;background:#ffe9a8;border-radius:6px;width:18%;padding:3px;box-shadow:inset 0 0 0 2px #e0b84a}.place-art .mini-car svg{width:100%;height:100%;display:block}.grown-ups{color:var(--ink-soft);flex-wrap:wrap;align-items:center;gap:10px;margin-top:28px;font-weight:500;display:flex}.grown-ups a{min-height:44px;color:var(--ink);box-shadow:var(--shadow);background:#fff;border-radius:999px;align-items:center;padding:.3em 1em;font-weight:600;text-decoration:none;display:inline-flex}.gate-picks{grid-template-columns:repeat(2,minmax(0,220px));justify-content:center;gap:16px;width:100%;display:grid}.gate-pick{color:var(--ink);font:inherit;cursor:pointer;background:#fff;border:0;border-radius:24px;justify-items:center;gap:4px;padding:18px 14px 16px;text-decoration:none;transition:transform .15s;animation:.5s cubic-bezier(.2,1.4,.4,1) both gate-in;display:grid;box-shadow:0 6px #2b244024}.gate-pick.home{animation-delay:.12s}.gate-pick svg{width:84px;height:84px;transition:transform .3s}.gate-pick:hover{transform:translateY(-4px)}.gate-pick:hover svg{transform:rotate(-6deg)scale(1.08)}.gate-pick:active{transform:translateY(2px)}.gate-pick b{font-size:1.6rem}.gate-pick.school b{color:#3d7eff}.gate-pick.home b{color:#2bb673}.gate-pick span{color:var(--ink-soft);font-weight:600}#gate-step .name-note{margin-top:18px}@keyframes gate-in{0%{opacity:0;transform:translateY(18px)scale(.92)}}@media (width<=420px){.gate-picks{grid-template-columns:1fr 1fr;gap:10px}.gate-pick svg{width:64px;height:64px}.gate-pick b{font-size:1.3rem}}@media (prefers-reduced-motion:reduce){.gate-pick,.gate-pick svg{transition:none;animation:none}}.code-form{justify-items:center;gap:12px;width:100%;display:grid}.code-input{text-transform:uppercase;letter-spacing:.3em;text-align:center;max-width:280px}.pupil-names{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;width:100%;margin:0;padding:0;list-style:none;display:grid}.pupil-names button{width:100%;min-height:64px;box-shadow:var(--shadow);background:#fff;border-radius:18px;font-size:1.25rem;font-weight:700}.pin-dots{justify-content:center;gap:14px;min-height:28px;margin:4px 0 16px;display:flex}.pin-dots i{border:3px solid var(--ink);border-radius:50%;width:22px;height:22px}.pin-dots i.on{background:var(--teal);border-color:var(--teal)}.pin-pad{grid-template-columns:repeat(3,84px);justify-content:center;gap:12px;display:grid}.pin-pad button{height:84px;box-shadow:var(--shadow);background:#fff;border-radius:20px;font-size:2rem;font-weight:700}.pin-pad button.wide{font-size:1.1rem}.class-msg{color:#c2410c;min-height:1.5em;margin:12px 0 4px;font-weight:600}.player-bar{box-shadow:var(--shadow);background:#fff;border-radius:18px;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:14px 0 0;padding:10px 16px;font-size:1.1rem;display:flex}.player-bar #player-class{color:var(--ink-soft)}.player-save{color:var(--ink-soft);margin-left:auto;font-size:.95rem}#gate-step .name-note a{color:var(--teal-dark,#128f84)}
