:root{--ink: #263238;--paper: #fff8e1;--card: #ffffff;--go: #43a047;--accent: #1e88e5;--warn: #fb8c00;--radius: 28px;--tap: clamp(120px, 22vh, 230px);--shadow: 0 6px 0 rgba(38, 50, 56, .18);--font: "SF Pro Rounded", ui-rounded, "Arial Rounded MT Bold", "Nunito", system-ui, sans-serif;color-scheme:light}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--paper);color:var(--ink);font-family:var(--font);overflow:hidden;overscroll-behavior:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:manipulation}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.35}svg{display:block}.app,.screen{height:100dvh;width:100vw}.screen{display:flex;flex-direction:column;align-items:center;padding:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));gap:12px;position:relative;overflow:hidden}.zone-numbers{background:linear-gradient(#fff3c4,#ffe082)}.zone-letters{background:linear-gradient(#e3f2fd,#90caf9)}.zone-colors{background:linear-gradient(#fce4ec,#f8bbd0)}.zone-logic{background:linear-gradient(#fff3e0,#ffcc80)}.zone-garage{background:linear-gradient(#eceff1,#b0bec5)}.zone-play{background:linear-gradient(#e8f5e9,#a5d6a7)}.title{font-size:clamp(40px,9vh,88px);margin:2vh 0 0;color:var(--accent);text-shadow:0 5px 0 #fff,0 8px 0 rgba(0,0,0,.12);letter-spacing:1px}.title.small{font-size:clamp(28px,6vh,52px);margin:0}.big-btn{min-width:var(--tap);height:calc(var(--tap) * .75);border-radius:999px;background:var(--card);box-shadow:var(--shadow);display:grid;place-items:center;font-size:44px;font-weight:900;transition:transform .1s}.big-btn.go{background:var(--go);color:#fff}.big-btn:active,.choice:active,.zone-card:active,.game-card:active,.scene-item:active{transform:scale(.94)}.round-btn{width:76px;height:76px;border-radius:50%;background:var(--accent);box-shadow:var(--shadow);display:grid;place-items:center;flex:none}.round-btn-spacer{width:76px;flex:none}.start{background:linear-gradient(#bbdefb,#fff8e1 70%);justify-content:space-around}.start-cars{display:flex;gap:3vw;align-items:flex-end;width:min(92vw,1000px)}.start-cars>div{flex:1}.start-btn{width:200px;height:200px}.pulse{animation:pulse 1.4s ease-in-out infinite}.home{background:linear-gradient(#bbdefb,#fff8e1 60%)}.home-head{width:100%;display:flex;align-items:center;justify-content:space-between}.home-head-actions{display:flex;gap:12px;align-items:center}.garage-btn{font-size:40px;height:84px;padding:0 22px;border-radius:999px;background:var(--card);box-shadow:var(--shadow)}.zone-grid{flex:1;width:min(100%,1200px);display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:2.4vh 2vw;min-height:0}.zone-card,.game-card{border-radius:var(--radius);box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5vh;gap:1vh;min-height:0;transition:transform .1s;border:5px solid #fff}.zone-icon,.game-icon{width:70%;flex:1;min-height:0;display:grid;place-items:center}.zone-icon>*,.game-icon>*{max-height:100%}.zone-name,.game-name{font-size:clamp(18px,3.4vh,32px);font-weight:800;text-align:center}.hold-btn{position:relative;width:64px;height:64px;border-radius:50%;background:#ffffffb3;font-size:30px;display:grid;place-items:center}.hold-ring{position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:50%;border:5px solid transparent}.hold-btn.holding .hold-ring{border-color:var(--accent);clip-path:inset(0 0 0 0);animation:hold var(--hold-ms) linear forwards}.sleep .hold-btn{position:absolute;right:20px;bottom:20px}.topbar{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none}.topbar-mid{flex:1;display:flex;justify-content:center;align-items:center}.zone-title{margin:0;font-size:clamp(26px,5vh,44px)}.game-grid{flex:1;width:min(100%,1200px);display:grid;gap:2.4vh 2vw;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;min-height:0}.game-grid.n4{grid-template-columns:repeat(2,1fr)}.game-grid.n1,.game-grid.n2{grid-template-columns:repeat(2,1fr);grid-template-rows:1fr}.game-card{background:var(--card)}.dots{display:flex;gap:10px}.dots span{width:22px;height:22px;border-radius:50%;background:#fffc;border:3px solid var(--ink)}.dots span.on{background:var(--go)}.game{gap:2vh}.scene{width:100%;flex:1.1;display:flex;align-items:center;justify-content:center;gap:2vw;min-height:0;flex-wrap:wrap}.scene-item{position:relative;height:100%;max-height:34vh;flex:0 1 auto;aspect-ratio:1.6;display:grid;place-items:center;border-radius:20px}.scene-row .scene-item{aspect-ratio:1;background:#ffffff8c;padding:1vh}.scene-road{background:#546e7a;border-radius:24px;padding:2vh 2vw;flex:.9;flex-wrap:nowrap;border-top:8px dashed #fdd835}.scene-road .scene-item{aspect-ratio:1;flex:1 1 0;max-width:24vw}.scene-pair .scene-item{aspect-ratio:1.6;flex:0 1 38vw;background:#fff6}.scene-lot{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:minmax(0,1fr);background:#78909c;border-radius:24px;padding:1.5vh;gap:1vh 1vw}.scene-lot .scene-item{border-right:4px solid #fff;border-radius:0}.scene-lot.n1,.scene-lot.n2,.scene-lot.n3{grid-template-columns:repeat(3,1fr);width:70%}.scene-lot.n4{grid-template-columns:repeat(4,1fr)}.scene-lot .scene-item{width:100%;height:100%;aspect-ratio:auto;max-height:none}.scene-item.counted{background:#ffffff59}.count-badge{position:absolute;top:0;right:4%;min-width:48px;height:48px;border-radius:50%;background:var(--go);color:#fff;font-size:30px;font-weight:900;display:grid;place-items:center;border:3px solid #fff;animation:pop .25s}.choices{width:100%;flex:1;display:flex;justify-content:center;align-items:center;gap:2.5vw;min-height:0}.choice{height:min(100%,30vh);aspect-ratio:1.15;max-width:23vw;background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);display:grid;place-items:center;padding:1.2vh;transition:transform .12s,opacity .2s;border:5px solid #fff}.choices.n2 .choice{max-width:32vw;height:min(100%,34vh)}.choice.dim{opacity:.45}.choice.glow{animation:glow 1s ease-in-out infinite}.choice.win{animation:win .6s ease forwards;border-color:var(--go)}.thing-svg{width:100%;height:100%;max-height:100%}.thing-vehicle{display:flex;align-items:flex-end;justify-content:center;height:100%;margin:0 auto}.thing-vehicle .thing-svg{height:auto}.choice>*,.scene-item>svg,.scene-item>.thing-vehicle{max-width:100%;max-height:100%}.reward{justify-content:center;background:radial-gradient(circle,#fff59d,#ffcc80);gap:4vh}.sticker-big{width:min(60vw,60vh * 1.6);filter:drop-shadow(0 8px 0 rgba(0,0,0,.15))}.reward-actions{display:flex;gap:4vw}.page-grid{flex:1;width:100%;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px;padding:4px 4px 24px;-webkit-overflow-scrolling:touch;touch-action:pan-y}.page-card{background:var(--card);border-radius:22px;box-shadow:var(--shadow);aspect-ratio:1.4;padding:12px;display:grid;place-items:center}.paint-tools{display:flex;gap:14px}.tool-btn{width:76px;height:76px;border-radius:22px;background:var(--card);box-shadow:var(--shadow);font-size:38px}.tool-btn.save{background:#fff59d}.paint-body{flex:1;width:100%;display:flex;gap:2vw;min-height:0}.canvas{flex:1;position:relative;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);display:grid;place-items:center;padding:2vh;min-width:0}.paint-svg{width:100%;height:100%}.paint-svg [data-region]{cursor:pointer}.reference{position:absolute;left:12px;top:12px;width:18%;background:#fffde7;border-radius:16px;padding:6px;border:3px dashed #fbc02d;pointer-events:none}.palette{width:clamp(160px,22vw,280px);display:grid;grid-template-columns:repeat(3,1fr);gap:10px;align-content:center}.pot{aspect-ratio:1;border-radius:50%;background:var(--pot);border:5px solid #fff;box-shadow:var(--shadow),inset 0 -8px #00000026;transition:transform .1s}.pot.on{transform:scale(1.12);outline:5px solid var(--ink);outline-offset:2px}.pot.small{width:64px}.mix{grid-column:span 3;display:flex;align-items:center;justify-content:center;gap:6px;background:#fff;border-radius:999px;padding:6px;font-weight:900;font-size:22px;box-shadow:var(--shadow)}.mix span{width:34px;height:34px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 2px var(--ink)}.memory-grid{flex:1;width:min(100%,1100px);display:grid;gap:2vh 2vw;grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr;min-height:0;padding-bottom:1vh}.memory-grid.n4{grid-template-columns:repeat(2,1fr);width:min(100%,720px)}.memory-grid.n6{grid-template-columns:repeat(3,1fr)}.memory-grid.n10{grid-template-columns:repeat(5,1fr)}.mem-card{border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);padding:1.4vh;display:grid;place-items:center;border:5px solid #fff;min-height:0;transition:transform .25s}.mem-card.down{background:repeating-linear-gradient(0deg,#90a4ae 0,#90a4ae 14px,#b0bec5 14px,#b0bec5 28px)}.mem-card.sel{border-color:var(--accent);transform:scale(1.04)}.mem-card.matched{border-color:var(--go);opacity:.8}.mem-back{font-size:64px;font-weight:900;color:#fff;text-shadow:0 3px 0 var(--ink)}.build-body{flex:1;width:100%;display:grid;grid-template-columns:1fr auto;grid-template-rows:1fr auto;gap:2vh 2vw;min-height:0}.build-preview{min-height:0;display:grid;place-items:center}.build-preview svg{max-height:100%;width:min(100%,700px)}.build-go{align-self:center;font-size:56px;height:150px}.build-rows{grid-column:1 / -1;display:flex;flex-direction:column;gap:1.4vh}.opt-row{display:flex;gap:12px;align-items:center;justify-content:center}.opt-row.scroll{justify-content:flex-start;overflow-x:auto;padding:4px 4px 10px;touch-action:pan-x;-webkit-overflow-scrolling:touch}.opt{flex:none;width:120px;height:84px;border-radius:20px;background:var(--card);box-shadow:var(--shadow);padding:6px;border:4px solid #fff;display:grid;place-items:center}.opt.logo{width:84px}.opt.horn{width:84px;font-size:40px}.opt.on{border-color:var(--accent);transform:scale(1.06)}.traffic-body{flex:1;width:100%;display:flex;gap:3vw;align-items:stretch;min-height:0}.signal{background:var(--ink);border-radius:40px;padding:2.4vh;display:flex;flex-direction:column;justify-content:space-around;gap:2vh;box-shadow:var(--shadow)}.lamp{width:min(19vh,150px);aspect-ratio:1;border-radius:50%;opacity:.3;border:6px solid #000;transition:opacity .2s,box-shadow .2s}.lamp.red{background:#e53935}.lamp.yellow{background:#fdd835}.lamp.green{background:#43a047}.lamp.lit{opacity:1;box-shadow:0 0 40px 10px currentColor}.lamp.red.lit{color:#ff8a80}.lamp.yellow.lit{color:#fff59d}.lamp.green.lit{color:#b9f6ca}.road{flex:1;position:relative;align-self:center;height:45%;background:#546e7a;border-radius:24px;overflow:hidden}.road-line{position:absolute;left:0;right:0;top:50%;border-top:10px dashed #fff;transform:translateY(-50%)}.road-car{position:absolute;bottom:8%;width:30%;left:10%}.tabs{display:flex;gap:12px}.tabs button{font-size:30px;font-weight:800;padding:12px 24px;border-radius:999px;background:#ffffffb3;box-shadow:var(--shadow)}.tabs button.on{background:var(--accent);color:#fff}.collection{flex:1;width:100%;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;align-content:start;padding:4px 4px 24px;touch-action:pan-y}.col-item{background:var(--card);border-radius:22px;box-shadow:var(--shadow);aspect-ratio:1.4;padding:12px;display:grid;place-items:center}.empty{grid-column:1 / -1;font-size:120px;text-align:center;padding-top:10vh;opacity:.6}.sleep{background:linear-gradient(#1a237e,#3949ab);color:#fff;justify-content:center}.moon{font-size:120px}.sleep-cars{display:flex;gap:3vw;width:min(90vw,900px);opacity:.8}.sleep-cars svg{flex:1}.zzz{font-size:56px;font-weight:900;animation:float 2s ease-in-out infinite}.parent{background:#fafafa;overflow-y:auto;align-items:stretch;display:block;padding:24px max(24px,env(safe-area-inset-right)) 48px max(24px,env(safe-area-inset-left));-webkit-user-select:auto;user-select:auto;touch-action:pan-y;font-family:system-ui,sans-serif}.parent-head{display:flex;justify-content:space-between;align-items:center}.parent h2{margin:0;font-size:28px}.parent section{background:#fff;border-radius:16px;padding:16px 20px;margin:16px 0;box-shadow:0 1px 3px #0000001a}.parent h3{margin:0 0 12px}.parent h4{margin:16px 0 6px;color:#546e7a}.prow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:6px 0;flex-wrap:wrap}.prow input[type=range]{width:240px}.check{display:flex;align-items:center;gap:10px;font-size:17px}.check input{width:22px;height:22px}.seg{display:flex;flex-wrap:wrap;gap:6px}.seg button,.pbtn{padding:10px 16px;border-radius:10px;background:#eceff1;font-size:16px;font-weight:600}.seg.small button{padding:6px 12px;font-size:14px}.seg button.on,.pbtn{background:var(--accent);color:#fff}.pbtn.danger{background:#e53935}.muted{color:#78909c;font-size:14px}.muted.small{text-align:center}.confetti{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:50}.confetti span{position:absolute;top:-20px;width:14px;height:22px;border-radius:3px;animation:fall linear forwards}.pop-in{animation:pop .35s cubic-bezier(.3,1.6,.6,1) both}.drive-in{animation:drivein .6s cubic-bezier(.2,1.2,.4,1) both}.drive-off{animation:driveoff 1.4s ease-in forwards}.shake{animation:shake .4s}@keyframes pop{0%{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}@keyframes drivein{0%{transform:translate(-60vw)}to{transform:none}}@keyframes driveoff{0%{transform:none}15%{transform:translate(-3vw)}to{transform:translate(120vw)}}@keyframes shake{0%,to{transform:none}20%,60%{transform:translate(-14px) rotate(-3deg)}40%,80%{transform:translate(14px) rotate(3deg)}}@keyframes glow{0%,to{box-shadow:var(--shadow),0 0 #fdd835}50%{box-shadow:var(--shadow),0 0 30px 14px #fdd835;transform:scale(1.05)}}@keyframes win{0%{transform:scale(1)}40%{transform:scale(1.18) rotate(-4deg)}to{transform:scale(1.08)}}@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-14px)}}@keyframes hold{0%{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (orientation: portrait){.zone-grid,.game-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:none;grid-auto-rows:1fr}.choices{flex-wrap:wrap}.choice{max-width:42vw;height:auto;width:40vw}.paint-body{flex-direction:column}.palette{width:100%;grid-template-columns:repeat(6,1fr)}.mix{grid-column:span 6}.traffic-body{flex-direction:column;align-items:center}.signal{flex-direction:row}.road{width:100%;align-self:stretch}}
