:root{color-scheme:dark;font:14px/1.4 system-ui,sans-serif;color:#f4f1df;background:#5c8996}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;touch-action:none}#app-container,#canvas-container,#canvas{width:100%!important;height:100%!important;position:absolute;inset:0}#canvas{outline:none;display:block}button{font:inherit;font-weight:650;border:1px solid #80968a;background:#16362ee8;color:inherit;border-radius:9px;padding:9px 13px;cursor:pointer;touch-action:manipulation}button:hover,button:focus-visible{background:#315549;border-color:#dbe8c4;outline:2px solid #dbe8c4;outline-offset:2px}button:disabled{opacity:.45;cursor:default}#hud{position:fixed;inset:0;pointer-events:none;z-index:10}#hud button,#hud input,#hud dialog{pointer-events:auto}#scorebar{position:absolute;top:calc(12px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;gap:18px;align-items:center;background:#142d28e8;border:1px solid #879587;border-radius:10px;padding:6px 20px;box-shadow:0 4px 16px #0003}#scorebar .team{font-size:28px;font-weight:850;min-width:32px;text-align:center}.red{color:#ff7777}.blue{color:#77aaff}#round-label{font-size:10px;text-align:center;color:#ccd6c4;white-space:nowrap}#clock{font-size:21px;font-variant-numeric:tabular-nums;font-weight:750;text-align:center}#top-left{position:absolute;left:calc(14px + env(safe-area-inset-left));top:calc(12px + env(safe-area-inset-top));text-shadow:0 2px 4px #17352d}#brand{font-size:18px;font-weight:850;letter-spacing:-.6px}#population,#connection{font-size:11px;color:#ecf0db;max-width:210px}#top-right{position:absolute;right:calc(14px + env(safe-area-inset-right));top:calc(12px + env(safe-area-inset-top));display:flex;gap:6px}#notice{position:absolute;top:120px;left:50%;transform:translateX(-50%);background:#18372ee3;border-radius:8px;text-align:center;padding:6px 12px;max-width:90%;font-size:13px;font-weight:650}#notice:empty{display:none}#bottom{position:absolute;bottom:calc(18px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);text-align:center;white-space:nowrap}#shell-state{padding:6px 13px;background:#18372ee8;border:1px solid #839681;border-radius:8px;font-size:13px;font-weight:750}#shell-state.exposed{color:#ffd49e;border-color:#fca668;background:#492d27ed}#hint{margin-top:7px;font-size:11px;color:#f2efdb;text-shadow:0 2px 3px #14281e}#toast{position:absolute;top:164px;left:50%;transform:translateX(-50%);color:#fff5c9;font-weight:700;text-align:center;text-shadow:0 2px 3px #102b26}#reticle{position:absolute;left:50%;top:50%;width:22px;height:22px;transform:translate(-50%,-50%);border:2px solid #fffce0;border-radius:50%;filter:drop-shadow(0 1px 2px #071b16)}#reticle i{position:absolute;left:8px;top:8px;width:2px;height:2px;background:#fffce0;border-radius:50%}#reticle.blocked{border-color:#ffad66;border-radius:3px;transform:translate(-50%,-50%) rotate(45deg)}#reticle.exposed{border-style:dashed}#objective{position:absolute;top:85px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:#fff4d5;text-shadow:0 1px 4px #071b16;background:#142d2877;padding:4px 9px;border-radius:6px}#objective-arrow{display:inline-block;font-size:21px;line-height:1}dialog{background:#16362e;color:#f4f1df;border:1px solid #839681;border-radius:14px;padding:22px;width:min(440px,90vw);box-shadow:0 24px 80px #0008;max-height:85dvh;overflow:auto}dialog::backdrop{background:#091e17c7}dialog h2{margin:0 0 14px}dialog p{color:#cbd7c2}#cosmetics{display:grid;grid-template-columns:1fr 1fr;gap:10px}.cosmetic{text-align:left;min-height:78px}.cosmetic.selected{border:2px solid #c5e2a8}.swatch{display:inline-block;width:21px;height:24px;border-radius:50%;vertical-align:middle;margin-right:8px}.cost{display:block;font-size:12px;color:#cbd7c2;margin-top:6px}#modal-close{margin-top:18px;width:100%}#room-dialog input{width:100%;margin:8px 0 16px;background:#0e271e;color:#fff;border:1px solid #839681;padding:12px;border-radius:8px;text-transform:uppercase;font:inherit}#results{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(420px,90vw);border-radius:14px;background:#143126f5;border:1px solid #839681;padding:24px;text-align:center;box-shadow:0 20px 60px #0006}#results[hidden]{display:none}#results h2{margin:0 0 10px}#result-score{font-size:40px;font-weight:800}#result-detail{margin:10px;color:#cbd7c2}#touch-controls{display:none}.touch #touch-controls{display:block}.touch #hint,.touch #look-button{display:none}.stick{position:absolute;bottom:calc(24px + env(safe-area-inset-bottom));width:112px;height:112px;border:2px solid #e2eaca66;border-radius:50%;background:#1e392c66;pointer-events:auto;touch-action:none;display:flex;align-items:center;justify-content:center}.stick span{color:#f0edcfaa;font-size:11px;font-weight:750;transform:translateY(34px)}.stick i{position:absolute;width:44px;height:44px;border:1px solid #d6dfbba6;border-radius:50%;background:#b7c59a66;pointer-events:none}#move-stick{left:calc(24px + env(safe-area-inset-left))}#aim-stick{right:calc(24px + env(safe-area-inset-right))}#aim-stick i{background:#b7c59a66}#throw-button{position:absolute;right:calc(38px + env(safe-area-inset-right));bottom:calc(153px + env(safe-area-inset-bottom));width:82px;height:58px;border:2px solid #f3c88b;background:#4d3a26e6;border-radius:18px;font-size:16px}#curve-button{position:absolute;right:calc(23px + env(safe-area-inset-right));bottom:calc(225px + env(safe-area-inset-bottom));padding:8px 10px;font-size:11px;background:#18372edd}.touch #bottom{left:calc(24px + env(safe-area-inset-left));bottom:calc(155px + env(safe-area-inset-bottom));transform:none;text-align:left}.touch #shell-state{max-width:180px;white-space:normal}#loading-status{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:15;color:#f4f1df;text-align:center}#loading-status[hidden]{display:none}
@media(max-width:650px){#brand{font-size:14px}#top-left{left:calc(10px + env(safe-area-inset-left));top:calc(9px + env(safe-area-inset-top))}#top-right{right:calc(10px + env(safe-area-inset-right));top:calc(9px + env(safe-area-inset-top));gap:4px}#top-right button{padding:7px 8px;font-size:11px}#population,#connection{font-size:10px;max-width:145px}#scorebar{gap:13px;padding:4px 15px;top:calc(64px + env(safe-area-inset-top))}#scorebar .team{font-size:24px}#clock{font-size:18px}#round-label{font-size:9px}#objective{top:calc(126px + env(safe-area-inset-top));font-size:11px}#notice{top:calc(161px + env(safe-area-inset-top));font-size:11px;padding:5px 10px}#toast{top:calc(199px + env(safe-area-inset-top));font-size:12px}#shell-state{font-size:11px;padding:6px 9px}.stick{width:104px;height:104px}#move-stick{left:calc(18px + env(safe-area-inset-left))}#aim-stick{right:calc(18px + env(safe-area-inset-right))}#throw-button{right:calc(32px + env(safe-area-inset-right));width:76px}.touch #bottom{left:calc(18px + env(safe-area-inset-left));max-width:155px}}
@media(max-height:480px){#brand{font-size:14px}#population,#connection{font-size:10px;max-width:180px}#scorebar{top:calc(8px + env(safe-area-inset-top));padding:3px 14px;gap:12px}#objective{top:calc(70px + env(safe-area-inset-top))}#notice{top:calc(103px + env(safe-area-inset-top));font-size:11px}#toast{top:137px}.stick{bottom:calc(16px + env(safe-area-inset-bottom));width:98px;height:98px}#throw-button{bottom:calc(130px + env(safe-area-inset-bottom));height:48px;width:76px}#curve-button{bottom:calc(192px + env(safe-area-inset-bottom))}.touch #bottom{left:50%;bottom:calc(12px + env(safe-area-inset-bottom));transform:translateX(-50%);max-width:240px}#hint{display:none}#top-right button{padding:7px 9px;font-size:11px}}