:root{font-family:"Chalkboard SE","Chalkboard","Comic Sans MS","KaiTi",cursive;color:#eee9d2;background:#102621;color-scheme:dark;--cream:#eee9d2;--yellow:#f0ce80;--mint:#bfdcaf}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;height:100%;overflow:hidden;touch-action:none;overscroll-behavior:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}body{background:radial-gradient(ellipse at 18% 15%,#26443a88,transparent 55%),#102621}button,a{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--yellow);outline-offset:4px}[hidden]{display:none!important}header{height:75px;max-width:1460px;margin:auto;padding:22px 42px 10px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:30}.brand{display:flex;gap:10px;align-items:center;color:var(--cream);text-decoration:none;font:10px/1.05 Arial,sans-serif;letter-spacing:2px;font-weight:800}.brand b{font-size:15px;letter-spacing:3px}.tools{display:flex;gap:9px;align-items:center}.tools button{display:grid;place-items:center;width:37px;height:37px;border:1px solid #d9e2cd66;border-radius:42% 49% 43% 47%;background:#19372ccc;font-size:20px}.tools svg{width:23px;height:23px}.layout{height:calc(100svh - 112px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;max-width:1230px;padding:0 45px;margin:auto;gap:55px}.story{justify-self:end;max-width:310px;padding-bottom:30px}.eyebrow{font:9px/1.7 Arial,sans-serif;letter-spacing:2px;color:var(--mint);font-weight:600}h1{font-size:56px;line-height:1.14;font-weight:500;letter-spacing:-2px;margin:26px 0 21px;transform:rotate(-3deg);text-shadow:1px 1px #eee9d222}h1 br+*{color:var(--yellow)}.intro{color:#d6d6bd;font-size:15px;line-height:1.9}.sketch-arrow{font-size:62px;color:var(--yellow);margin:14px 35px 4px;transform:rotate(16deg)}#control{font-size:14px;color:#c9d8c0}.keys{display:flex;gap:12px}.keys span{display:grid;place-items:center;width:39px;height:32px;border:1px solid #dfdfbb77;border-radius:3px 4px 6px 2px;font-size:20px;transform:rotate(-3deg)}.keys span+span{transform:rotate(3deg)}#desktop-help{font-size:12px;color:#cbd6bc}.platform-caption{font-size:11px;line-height:2;color:#a7bda6;max-width:220px;margin-top:26px}.board{position:relative;height:min(100%,823px);aspect-ratio:7/12;width:auto;max-width:480px;box-shadow:0 15px 70px #041a1755;border:1px solid #e7dcc62e;border-radius:12px 9px 13px 8px;overflow:hidden;background:#203e38}canvas{display:block;width:100%;height:100%;touch-action:none}.board-corners{position:absolute;inset:8px;pointer-events:none;border:1px solid #c5d3b32b;border-radius:7px 12px 6px 9px;z-index:9}.board-corners:before,.board-corners:after{content:'';position:absolute;width:40px;height:1px;background:#dfdbc744;bottom:4px;left:7px;transform:rotate(-3deg)}.board-corners:after{width:22px;left:auto;right:9px;bottom:7px;transform:rotate(3deg)}#hud{position:absolute;left:25px;right:25px;top:20px;display:flex;justify-content:space-between;pointer-events:none}#hud small{display:block;font:8px Arial,sans-serif;letter-spacing:1.5px;color:#d4dcc3b0}#hud strong{font-weight:400;font-size:30px;line-height:1.3;font-variant-numeric:tabular-nums}#hud i{font-style:normal;font-size:13px;margin-left:4px;color:#d4dcc3a0}.best-hud{text-align:right}.best-hud strong{font-size:23px;color:var(--yellow)}.panel{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:28px;z-index:15}.menu-copy{align-self:start;margin-top:14%;width:100%}.menu-copy h2{margin:24px 0 18px}.panel h2{font-size:48px;font-weight:400;line-height:1.12;letter-spacing:-1.6px;text-shadow:1px 1px #eee9d233}.panel h2 em{font-weight:400;font-style:normal;color:var(--yellow)}.panel p{font-size:12px;line-height:1.8;color:#cbd8c0}.panel .eyebrow{font-size:9px;color:var(--mint)}.primary{margin:24px auto 0;padding:13px 27px;background:#e5c47d;color:#20372c;border:1px solid #eee3b677;border-radius:6px 3px 7px 4px;box-shadow:3px 3px #071f2133;font-size:15px;transform:rotate(-1deg);min-width:170px;min-height:47px}.primary:hover{background:#f0d499}.primary:disabled{opacity:.6;cursor:wait}.secondary,.quiet{display:block;margin:13px auto 0;padding:10px 22px;background:transparent;border:1px solid #dddcc477;border-radius:5px;color:var(--cream);min-height:40px;font-size:13px}.quiet{border:0;color:#c4d1b7}.panel p.instruction{font-size:11px;max-width:240px;margin:17px auto 0}.panel p.permission{font-size:10px;max-width:240px;color:#bfcfb3}.panel p.tiny{font-size:10px;color:#d4c58c;margin-top:15px}.shade{background:#16362de8;backdrop-filter:blur(6px)}.result-height{font-size:25px;color:var(--yellow);line-height:1.1;margin:25px 0 15px}.result-height b{font-size:85px;font-weight:400;letter-spacing:-5px;margin-right:8px}.result-best{color:var(--yellow)!important}.margin-note{align-self:center;justify-self:start;width:120px;color:#b4c4a7;transform:rotate(6deg)}.chalk-star{font-size:38px;color:#d3cc9a}.margin-note>p{font:11px/1.8 Arial,sans-serif;letter-spacing:3px}.sample-platform{margin:35px 0 15px;width:65px;height:9px;border:2px solid var(--mint);border-radius:4px;transform:rotate(-5deg);opacity:.7}.chalk-small{font-size:40px;color:var(--yellow);margin-left:20px}#local-note{font-family:inherit;font-size:11px;letter-spacing:.2px;line-height:1.9;max-width:105px}footer{height:37px;display:flex;align-items:center;justify-content:center;gap:12px;font:8px Arial,sans-serif;letter-spacing:2px;color:#91aa9290}#touch{position:absolute;bottom:16px;left:17px;right:17px;display:flex;justify-content:space-between;z-index:12;pointer-events:none}#touch button{pointer-events:auto;width:64px;height:47px;border:1px solid #dfe4c77a;color:#ecdfae;background:#254639d9;border-radius:7px 3px 6px 4px;font-size:29px}#touch button.pressed{background:#d9c57e;color:#19382d}#sensor-notice{position:absolute;bottom:74px;left:30px;right:30px;text-align:center;z-index:12;padding:7px;background:#17382ce8;border:1px dashed #d8daba55;border-radius:5px;color:#d2d9bf;font-size:10px;line-height:1.6}#sensor-notice button{display:block;border:0;border-bottom:1px solid #e9cc87aa;color:var(--yellow);margin:3px auto 0;padding:2px 4px;background:none;font-size:11px}#toast{position:absolute;top:90px;left:20px;right:20px;text-align:center;font-size:12px;color:var(--yellow);z-index:20}.game-info-summary{font-family:Arial,sans-serif}
@media(max-width:1100px){.layout{grid-template-columns:1fr auto;gap:35px;max-width:950px}.margin-note{display:none}.story{max-width:260px}h1{font-size:48px}}
@media(max-width:760px){header{height:62px;padding:14px 20px 8px}.layout{display:flex;justify-content:center;height:calc(100svh - 89px);padding:0 12px;gap:0}.story,.margin-note{display:none}.board{height:min(100%,calc((100vw - 24px)*12/7));width:auto;max-width:100%}footer{height:27px;font-size:7px;letter-spacing:1.4px;gap:9px}.tools button{width:33px;height:33px}.brand{font-size:8px;gap:8px}.brand b{font-size:12px}.brand img{width:27px;height:27px}.menu-copy{margin-top:10%}.panel{padding:22px}.panel h2{font-size:44px}.primary{min-height:43px;padding:11px 23px}.result-height b{font-size:75px}}
@media(max-height:600px) and (orientation:landscape){header{height:50px;padding-top:8px}.layout{height:calc(100svh - 63px);display:flex;justify-content:center;padding:0 10px}.story{display:none}.board{height:100%;max-width:none}footer{height:13px;font-size:6px}.panel{padding:10px}.panel h2{font-size:25px;margin:8px 0}.menu-copy{margin-top:0}.menu-copy>p{font-size:9px;line-height:1.4}.menu-copy .eyebrow{font-size:6px;margin:3px}.primary{padding:8px 15px;min-width:110px;min-height:31px;margin-top:9px;font-size:11px}.panel p.instruction,.panel p.permission{font-size:7px;margin-top:8px}.panel p.tiny{font-size:7px;margin:5px}.result-height{margin:8px}.result-height b{font-size:43px}.panel p{font-size:9px}.secondary,.quiet{margin-top:5px;padding:5px 12px;min-height:25px;font-size:9px}#hud{left:14px;right:14px;top:10px}#hud small{font-size:6px}#hud strong{font-size:20px}.best-hud strong{font-size:17px}#touch{bottom:10px;left:10px;right:10px}#touch button{width:39px;height:31px;font-size:22px}#sensor-notice{bottom:46px;left:13px;right:13px;padding:3px;font-size:7px}#sensor-notice button{font-size:8px}#toast{top:55px;font-size:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

#effect{position:absolute;top:80px;left:20px;right:20px;text-align:center;color:#b6e4e8;font-size:11px;pointer-events:none;padding:5px;background:#17382cbb;border-radius:15px}.panel p.extras{max-width:240px;margin:9px auto;font-size:10px;color:#e2c989;line-height:1.6}@media(max-height:600px) and (orientation:landscape){#effect{top:47px;font-size:8px;padding:2px}.panel p.extras{font-size:7px;max-width:150px;margin:4px auto}}