@font-face{font-family:Rubik;src:url('/assets/rubik.ttf') format('truetype');font-display:swap}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#041329;color:#f6f9ee;font-family:Rubik,sans-serif}button{font:inherit;cursor:pointer;border:0}button:disabled{opacity:.5;cursor:wait}button:focus-visible,summary:focus-visible{outline:3px solid #f9b76d;outline-offset:5px}::selection{background:#ffd0a1;color:#041329}[hidden]{display:none!important}#game{position:fixed;inset:0;width:auto;height:auto;isolation:isolate}#field{position:absolute;inset:0;width:100%;height:100%;touch-action:none}#camera{position:absolute;width:1px;height:1px;opacity:.001;pointer-events:none;left:0;bottom:0}#panel{position:absolute;inset:0;display:flex;align-items:center;padding:32px max(6vw,env(safe-area-inset-left));background:linear-gradient(90deg,rgba(4,19,41,.96),rgba(4,19,41,.86) 38%,rgba(4,19,41,0) 78%);overflow:auto}#panel-content{max-width:490px;width:100%;padding-block:20px}.brand{width:62px;height:62px;fill:none;stroke:#9cf0ff;stroke-width:2.6;margin-bottom:12px}h1{font-size:clamp(44px,6vw,84px);font-weight:700;letter-spacing:-.04em;line-height:1.05;margin:0 0 22px;text-wrap:balance}.intro{font-size:clamp(20px,2.5vw,29px);line-height:1.35;margin:0 0 30px;color:#d6e3ff}#rules{display:flex;gap:36px;margin-bottom:24px}#rules div{display:flex;flex-direction:column;gap:4px}#rules strong{font-size:32px;line-height:1.2;font-weight:600}#rules span{font-size:13px;color:#bac9cc}#hint{font-size:14px;line-height:1.6;color:#bac9cc;max-width:410px;margin:0 0 24px}#actions{display:flex;flex-direction:column;align-items:stretch;gap:10px;max-width:390px}#primary{border-radius:14px;min-height:58px;background:#9cf0ff;color:#041329;padding:14px 22px;font-weight:600;font-size:17px;display:flex;align-items:center;justify-content:space-between;gap:14px}#primary:hover{background:#c3f5ff}.secondary{min-height:48px;border-radius:12px;color:#edf4e9;background:#213751;font-size:14px;padding:12px 18px}.secondary:hover{background:#2c496a}.text{color:#c6dfd6;background:transparent;padding:12px;font-size:13px}.text:hover{color:#fff}#privacy{font-size:12px;color:#b9d3ca;margin:20px 0 0}#hud{position:absolute;inset:max(18px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) auto max(24px,env(safe-area-inset-left));display:flex;align-items:start;justify-content:space-between;pointer-events:none}.metric{min-width:100px;text-shadow:0 2px 12px #041329;display:flex;flex-direction:column}.metric span{font-size:clamp(42px,6vw,76px);font-weight:700;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.03em}.metric small{font-size:14px;margin-top:6px;color:#d7e9df}.time{position:absolute;left:50%;transform:translateX(-50%);text-align:center}.round{width:56px;height:56px;border-radius:50%;background:#9cf0ff;color:#041329;pointer-events:auto}.round svg,.screen-button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}#mode{position:absolute;left:24px;bottom:23px;color:#eff8cb;background:#112036;padding:8px 12px;border-radius:8px;font-size:12px}#tracking{position:absolute;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translateX(-50%);padding:9px 14px;border-radius:8px;background:#112036;color:#d7ecdb;font-size:13px;text-align:center}.screen-button{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));right:max(20px,env(safe-area-inset-right));width:48px;height:48px}#help{position:absolute;right:28px;bottom:80px;font-size:12px;color:#c3ddd5;max-width:300px}#help summary{cursor:pointer;padding:8px}#help p{background:#112036;padding:16px;border-radius:12px;line-height:1.6}.install{position:absolute;right:24px;top:20px;background:#213751;border-radius:10px}body.playing #help,body.playing #install{display:none}body.playing #panel{background:rgba(4,19,41,.87);justify-content:center;text-align:center}body.playing #panel-content{max-width:510px}body.playing #hint,body.playing #actions{margin-inline:auto}body.playing .brand{width:46px;height:46px}body.playing h1{font-size:clamp(36px,5vw,62px)}body.playing #rules{justify-content:center}
@media(max-width:600px) and (orientation:portrait){#panel{padding:24px 28px;background:linear-gradient(0deg,rgba(4,19,41,.97) 45%,rgba(4,19,41,.5));align-items:center}#panel-content{padding:24px 0 60px}.brand{width:48px;height:48px}h1{font-size:60px;margin-bottom:16px}.intro{font-size:23px;margin-bottom:24px}#rules{gap:32px}#help{bottom:16px;left:20px;right:75px;max-width:none}.metric{min-width:60px}.round{width:48px;height:48px}#tracking{bottom:78px;width:max-content;max-width:90vw}#mode{bottom:25px;font-size:10px;left:16px}}@media(max-height:500px){#panel{padding:16px 6vw;align-items:center}#panel-content{max-width:510px;padding:0}.brand{display:none}h1{font-size:46px;margin-bottom:10px}.intro{font-size:20px;margin-bottom:16px}.intro br{display:none}#rules{gap:28px;margin-bottom:12px}#rules strong{font-size:26px}#hint{margin-bottom:12px;font-size:12px;max-width:480px}#actions{max-width:460px;display:flex;flex-direction:row;flex-wrap:wrap}#primary{min-height:48px;font-size:15px;flex:1}.secondary{font-size:12px;flex:1}#privacy{margin-top:12px;font-size:11px}#help{bottom:70px;max-width:260px}.metric span{font-size:46px}body.playing #actions{justify-content:center}body.playing .intro{font-size:18px}body.playing #hint{max-width:400px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

#hand-cursors{position:absolute;inset:0;z-index:10;pointer-events:none}.hand-pointer{position:absolute;width:60px;height:60px;transform:translate(-50%,-50%);filter:drop-shadow(0 3px 6px rgba(0,0,0,.5))}.hand-pointer svg{width:100%;height:100%;overflow:visible}.hand-pointer circle{fill:none;stroke:currentColor}.hand-pointer .base{stroke-width:2;opacity:.55}.hand-pointer .fill{stroke-width:5;stroke-dasharray:1;transform:rotate(-90deg);transform-origin:30px 30px}.hand-pointer .dot{fill:#fff;stroke-width:2}button.hand-hover{outline:3px solid #fff;outline-offset:5px;background:#c3f5ff!important;color:#041329!important}

body.camera-mode #hud{left:var(--play-left,24px);right:var(--play-right,24px);top:var(--play-top,20px)}
@media(max-width:600px) and (orientation:portrait){body.camera-mode #panel-content{padding:0;max-width:350px}body.camera-mode h1{font-size:32px;margin-bottom:10px}body.camera-mode .intro{font-size:18px;margin-bottom:10px}body.camera-mode #hint{font-size:12px;margin-bottom:12px;line-height:1.4}body.camera-mode #actions{gap:6px}body.camera-mode #primary{min-height:44px;font-size:15px;padding:10px 16px}body.camera-mode .secondary{min-height:40px;padding:10px;font-size:12px}body.camera-mode #home{padding:8px}body.camera-mode .brand,body.camera-mode #privacy{display:none}}

body.camera-mode #panel{background:rgba(4,19,41,.4);text-shadow:0 2px 8px rgba(4,19,41,.8)}body.camera-mode #fullscreen{right:var(--play-right,20px);bottom:var(--play-bottom,16px)}

@media(max-height:500px){body.camera-mode #actions #primary{flex:1 0 100%}body.camera-mode #actions .secondary,body.camera-mode #actions #home{flex:1}body.camera-mode #panel-content{max-width:500px}body.camera-mode #privacy{display:none}}

#alignment{margin:0 auto 12px;max-width:460px}#alignment p{font-size:12px;line-height:1.45;margin:0 0 8px;color:#d6e3ff}.alignment-controls{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.cal-control{flex:1 1 40%;min-height:42px;border-radius:10px;background:#213751;color:#f6f9ee;padding:9px 12px;font-size:13px}.cal-control:hover{background:#2c496a}#align-reset{flex:0 1 auto}#alignment-value{display:block;font-size:11px;color:#bac9cc;margin-top:7px}#alignment-toggle{color:#9cf0ff}body.aligning .brand,body.aligning #hint,body.aligning #privacy{display:none}body.aligning h1{font-size:30px;margin-bottom:8px}body.aligning .intro{font-size:16px;margin-bottom:10px}body.aligning #actions{gap:5px}body.aligning #primary{min-height:44px}body.aligning #alignment-toggle{padding:8px}body.aligning #panel-content{padding-block:12px}@media(max-height:500px){body.aligning #panel{padding-block:8px}body.aligning #panel-content{padding-block:0}body.aligning #alignment{margin-bottom:8px}body.aligning #home{padding:8px}body.aligning #alignment-toggle{flex-basis:100%}body.aligning .cal-control{min-height:38px}body.aligning #alignment-value{margin-top:5px}body.camera-mode #alignment-toggle{flex-basis:100%;padding:8px}}

body.aligning #primary,body.aligning #secondary,body.aligning #home{display:none}body.aligning #alignment-toggle{min-height:44px;padding:10px 16px;border-radius:12px;background:#213751}body.aligning #panel-content{max-height:100%;overflow:auto}