*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#112233;color:#eef6fb;font-family:'Segoe UI',Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:disabled{opacity:.4;cursor:default}a{color:inherit;text-decoration:none}#game{position:fixed;inset:0;outline:none;touch-action:none}canvas{display:block;width:100%;height:100%}header{position:fixed;inset:0 0 auto;padding:28px 34px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;background:linear-gradient(#101f3280,transparent);z-index:2}.brand{display:flex;align-items:center;gap:12px;pointer-events:auto;font-weight:650;font-size:14px;letter-spacing:2px}.brand>b{display:grid;place-items:center;width:43px;height:43px;border:1px solid #96bdd060;border-radius:12px;font-size:15px;letter-spacing:-1px;background:#10284090}.brand small{display:block;font-size:7px;letter-spacing:2.1px;margin-top:6px;color:#a6c1d0}.top-actions{display:flex;align-items:center;gap:22px;pointer-events:auto}.top-actions>span{font-size:8px;letter-spacing:1.8px;color:#abc2ce}#pause,footer button{border:1px solid #91bbc333;background:#172d4199;border-radius:8px;padding:8px 13px}#pause{font-size:15px}.mission{position:fixed;top:125px;left:35px;width:225px;pointer-events:none}.eyebrow{font-size:8px;font-weight:700;letter-spacing:2px;color:#8bdcec;margin:0 0 12px}h2{font-size:31px;line-height:1.05;letter-spacing:-1px;font-weight:500;margin:0 0 17px}.mission>p:not(.eyebrow){font-size:11px;color:#bfd0dc}.mission-meta{display:flex;justify-content:space-between;max-width:225px;margin-top:22px;padding-top:12px;border-top:1px solid #a4bbcb30;font-size:8px;letter-spacing:1px;color:#b8cad7}.mission-meta b{color:#92e1f0}.inventory{position:fixed;left:35px;bottom:104px;width:279px;padding:17px 18px;background:#112639de;backdrop-filter:blur(12px);border:1px solid #8db7c72e;border-radius:14px}.inventory-top{display:flex;justify-content:space-between;align-items:center}.inventory-top .eyebrow{margin:0;font-size:7px}.inventory-top>span:last-child{font-size:10px;color:#aec4d3}.inventory-top b{font-size:17px;font-weight:550;color:#ecfaff;font-variant-numeric:tabular-nums}ol{display:flex;gap:6px;list-style:none;padding:0;margin:15px 0 17px}li{flex:1;padding:8px 0;font-size:8px;text-align:center;color:#8ea9bc;border:1px solid #9fbbce20;border-radius:6px}li span{display:block;font-size:8px;margin-bottom:4px;opacity:.7}li.next{background:#89dceb1c;border-color:#9bdfecaa;color:#c9f7ff}li.past{opacity:.45}.next small{display:block;font-size:7px;letter-spacing:1.4px;color:#92aebe}.next strong{display:block;font-size:17px;letter-spacing:-.3px;font-weight:550;margin-top:5px}.panel{position:fixed;right:6%;top:50%;transform:translateY(-47%);width:345px;padding:29px 31px 24px;background:linear-gradient(135deg,#173146ed,#0d2235f0);border:1px solid #95b4c733;border-radius:19px;backdrop-filter:blur(18px);box-shadow:0 20px 80px #0003;z-index:5}h1{font-size:41px;font-weight:500;line-height:1.06;letter-spacing:-1.5px;margin:19px 0 22px}h1 em{color:#91e0ec;font-style:normal}.panel>p:not(.eyebrow){font-size:12px;line-height:1.8;color:#b8cddc;margin:0 0 23px}.how{display:flex;gap:12px;align-items:center;font-size:10px;color:#acc6d7;margin:10px 0}kbd{font:inherit;font-size:8px;border:1px solid #aec3d443;border-radius:5px;padding:5px 7px;letter-spacing:.5px}.how kbd{min-width:57px;text-align:center}.primary{width:100%;padding:13px;margin-top:20px;border:1px solid #c1f0f6;background:#92deeb;color:#113648;font-size:12px;font-weight:650;border-radius:8px}.primary:hover{background:#b6edf5}.panel .quiet{font-size:9px!important;color:#a3bac9!important;margin:13px 0 0!important;text-align:center}.play-actions{position:fixed;right:34px;bottom:104px;display:flex;gap:12px}.play-actions button{display:flex;align-items:center;gap:14px;padding:15px 21px;border:1px solid #a8d6e052;border-radius:12px;background:#142e43da;backdrop-filter:blur(8px);font-size:13px;min-width:122px}.play-actions button:last-child{border-color:#93deec9e;background:#23516bdc}.play-actions kbd{font-size:8px}.play-actions button:active:not(:disabled){transform:translateY(2px);background:#3b7898}footer{position:fixed;bottom:0;width:100%;padding:24px 35px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;font-size:9px;color:#b5cad8;background:linear-gradient(transparent,#0d1d30bb)}footer button{pointer-events:auto;font-size:10px}footer i{font-style:normal;color:#7c98ab;margin:0 10px}.touch-hint{display:none}#toast{position:fixed;left:50%;top:99px;transform:translateX(-50%);padding:11px 19px;border:1px solid #98dbe63d;background:#122e46e8;border-radius:30px;color:#e4f8ff;font-size:11px;opacity:0;transition:opacity .2s;pointer-events:none;z-index:3;white-space:nowrap}#toast.show{opacity:1}#joystick{display:none;position:fixed;bottom:112px;left:25px;width:102px;height:102px;border-radius:50%;border:1px solid #c1e5ed6a;background:#87b2c520;touch-action:none;z-index:3;backdrop-filter:blur(3px)}#stick{position:absolute;left:33px;top:33px;width:36px;height:36px;border-radius:50%;background:#a7dceaa0;border:1px solid #d5f6fc;pointer-events:none}.hidden{display:none!important}body:not([data-phase=playing]) .play-actions,body:not([data-phase=playing]) #joystick{display:none}button:focus-visible,a:focus-visible{outline:2px solid #b1edf6;outline-offset:4px}
@media(max-width:900px){.mission{width:180px}.inventory{width:260px}.panel{right:25px}}
@media(max-width:700px){header{padding:18px 20px}.brand{font-size:12px;gap:9px}.brand>b{width:37px;height:37px}.brand small{font-size:6px}.top-actions>span{display:none}.mission{top:89px;left:21px;width:180px}.mission .eyebrow{font-size:7px}.mission h2{font-size:23px;margin-bottom:10px}.mission>p:not(.eyebrow){font-size:9px}.mission-meta{margin-top:11px;padding-top:9px;font-size:7px}.inventory{top:89px;right:18px;left:auto;bottom:auto;width:142px;padding:12px}.inventory-top{align-items:flex-start}.inventory-top .eyebrow{font-size:6px;letter-spacing:.5px;padding-top:5px}.inventory-top>span:last-child{font-size:0}.inventory-top b{font-size:19px}.inventory-top b:after{content:' left';font-size:8px}ol{gap:3px;margin:9px 0 12px}li{font-size:0;padding:5px 0}li span{font-size:7px;margin:0}.next small{font-size:6px;letter-spacing:.5px}.next strong{font-size:13px}.panel{top:auto;bottom:88px;left:20px;right:20px;width:auto;max-width:380px;margin:auto;transform:none;padding:24px}.panel h1{font-size:33px;margin:16px 0}.panel>p:not(.eyebrow){font-size:11px;margin-bottom:14px}.how{display:none}.primary{margin-top:14px}body:not([data-phase=playing]) .inventory{opacity:.4}body:not([data-phase=playing]) .mission{opacity:.4}.play-actions{right:20px;bottom:107px;gap:8px}.play-actions button{padding:18px 13px;font-size:12px;min-width:75px;justify-content:center;min-height:65px}.play-actions kbd{display:none}body[data-phase=playing] #joystick{display:block}footer{padding:20px}.desktop-hint{display:none}.touch-hint{display:block;font-size:8px}footer button{font-size:9px}#toast{top:238px;font-size:9px;max-width:94%;white-space:normal;text-align:center;width:max-content}}
@media(pointer:coarse){body[data-phase=playing] #joystick{display:block}.inventory{bottom:240px}.desktop-hint{display:none}.touch-hint{display:block}.play-actions kbd{display:none}}
@media(max-height:580px) and (min-width:701px){.inventory{bottom:85px;padding:12px}.mission{top:91px}.mission h2{font-size:25px}.panel{padding:20px}.panel h1{font-size:30px}.how{display:none}.play-actions{bottom:85px}}
.mission{padding:17px 18px;background:#112639c7;border:1px solid #8db7c72e;border-radius:13px;backdrop-filter:blur(9px)}
@media(max-width:700px){.mission{padding:12px;width:178px}.mission h2{font-size:22px}.mission-meta{font-size:6px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
#reticle{display:none;position:fixed;left:50%;top:50%;width:18px;height:18px;margin:-9px;border:1px solid #e3f8fbd9;border-radius:50%;pointer-events:none;box-shadow:0 1px 4px #00172288;z-index:3}#reticle i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;top:6px;left:6px}#aim-hint{display:none;position:fixed;bottom:190px;left:50%;transform:translateX(-50%);padding:9px 15px;border-radius:20px;background:#10273bc9;color:#cde7f0;font-size:8px;letter-spacing:1px;pointer-events:none;white-space:nowrap}#aim-hint span{margin:0 8px;color:#729aaa}body[data-aiming=true] #reticle,body[data-aiming=true] #aim-hint{display:block}body[data-aiming=true] .mission{opacity:0}body[data-aiming=true] .inventory{top:105px;right:35px;left:auto;bottom:auto;width:220px}body[data-aiming=true] .inventory ol{display:none}body[data-aiming=true] .inventory .next{margin-top:12px}#aim[aria-pressed=true]{background:#467f99d9;border-color:#b4e7f1}body[data-phase=paused] #reticle,body[data-phase=paused] #aim-hint{display:none}
@media(max-width:700px){.play-actions{gap:7px}.play-actions button{min-width:72px;max-width:75px;padding:14px 9px;font-size:11px;min-height:65px}body[data-aiming=true] .inventory{top:89px;right:18px;width:142px}#aim-hint{bottom:209px;font-size:0;letter-spacing:1px}#aim-hint span{display:none}#aim-hint:after{content:'DRAG TO AIM · TAP THROW';font-size:8px}#reticle{width:15px;height:15px;margin:-7px}#reticle i{top:5px;left:5px}}
#aim-hint{bottom:auto;top:calc(50% + 35px)}
body[data-mouse=locked],body[data-mouse=locked] *{cursor:none!important}body[data-mouse=locked] header,body[data-mouse=locked] .play-actions,body[data-mouse=locked] footer{pointer-events:none}body[data-mouse=locked] header *,body[data-mouse=locked] .play-actions *,body[data-mouse=locked] footer *{pointer-events:none}#aim-hint span{margin:0;color:inherit}#aim-hint:after{content:none}@media(max-width:700px){#aim-hint .touch-hint{display:block;font-size:8px}#aim-hint .desktop-hint{display:none}}

/* Physical screen cutouts and three-finger play, in either orientation. */
:root{--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}
html,body{overscroll-behavior:none}button{touch-action:manipulation;user-select:none;-webkit-user-select:none}.play-actions,#joystick{touch-action:none;user-select:none;-webkit-user-select:none}
.touch-intro{display:none}#phone-report{margin-top:14px;background:transparent;color:#afdce8;border:1px solid #82bec64a;border-radius:8px;padding:12px;width:100%;font-size:11px;min-height:44px}
body[data-touch=true] header{padding:calc(12px + var(--safe-top)) calc(18px + var(--safe-right)) 12px calc(18px + var(--safe-left))}
body[data-touch=true] .top-actions>span,body[data-touch=true] .desktop-hint,body[data-touch=true] .how,body[data-touch=true] .play-actions kbd{display:none}
body[data-touch=true] .touch-hint,body[data-touch=true] .touch-intro{display:block}
body[data-touch=true] #pause{min-width:46px;min-height:46px}
body[data-touch=true] .brand{font-size:11px;gap:8px}body[data-touch=true] .brand>b{width:36px;height:36px}
body[data-touch=true] .mission{top:calc(78px + var(--safe-top));left:calc(18px + var(--safe-left));width:142px;padding:12px}
body[data-touch=true] .mission h2{font-size:21px;margin:0 0 10px}body[data-touch=true] .mission .eyebrow{font-size:6px;letter-spacing:1px}body[data-touch=true] .mission>p:not(.eyebrow){font-size:9px}body[data-touch=true] .mission-meta{font-size:6px;margin-top:10px;padding-top:8px}
body[data-touch=true] .inventory,body[data-touch=true][data-aiming=true] .inventory{top:calc(78px + var(--safe-top));right:calc(18px + var(--safe-right));left:auto;bottom:auto;width:130px;padding:12px;backdrop-filter:none;background:#112639e8}
body[data-touch=true] .inventory-top .eyebrow{font-size:6px;letter-spacing:.4px}body[data-touch=true] .inventory-top>span:last-child{font-size:0}body[data-touch=true] .inventory-top b{font-size:18px}body[data-touch=true] .inventory-top b:after{content:' left';font-size:8px}
body[data-touch=true] .inventory ol{margin:8px 0;gap:3px}body[data-touch=true] .inventory li{font-size:0;padding:5px 0}body[data-touch=true] .inventory li span{font-size:7px;margin:0}body[data-touch=true] .next small{font-size:6px;letter-spacing:.4px}body[data-touch=true] .next strong{font-size:12px}
body[data-touch=true][data-phase=playing] #joystick{display:block;left:calc(18px + var(--safe-left));bottom:calc(54px + var(--safe-bottom));width:112px;height:112px;background:#193c5070;backdrop-filter:none}
body[data-touch=true] #stick{width:38px;height:38px;left:36px;top:36px}
body[data-touch=true] .play-actions{right:calc(18px + var(--safe-right));bottom:calc(54px + var(--safe-bottom));display:grid;grid-template-columns:69px 69px;grid-template-rows:56px 56px;gap:10px}
body[data-touch=true] .play-actions button{min-width:0;max-width:none;min-height:56px;padding:6px;font-size:11px;justify-content:center;backdrop-filter:none;background:#16374cec}
body[data-touch=true] #jump{grid-column:2;grid-row:1}body[data-touch=true] #aim{grid-column:1;grid-row:2}body[data-touch=true] #throw{grid-column:2;grid-row:2;border-color:#b4e7f1;background:#235b77f5}
body[data-touch=true] #aim[aria-pressed=true]{background:#80d4e4;color:#123344;border-color:#d3f6ff}
body[data-touch=true]:not([data-phase=playing]) .play-actions{display:none}
body[data-touch=true] footer{padding:7px calc(18px + var(--safe-right)) calc(6px + var(--safe-bottom)) calc(18px + var(--safe-left));font-size:8px}
body[data-touch=true] footer .touch-hint{max-width:170px;font-size:8px}body[data-touch=true] footer button{min-height:44px;padding:8px;font-size:9px}
body[data-touch=true] #aim-hint{font-size:8px;top:calc(50% + 28px);padding:7px 10px;max-width:95%}body[data-touch=true] #aim-hint .desktop-hint{display:none}body[data-touch=true] #aim-hint .touch-hint{display:block;font-size:8px}
body[data-touch=true] .panel{top:50%;bottom:auto;left:calc(18px + var(--safe-left));right:calc(18px + var(--safe-right));transform:translateY(-50%);width:auto;max-width:380px;max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 32px);overflow:auto;margin:auto;padding:22px}
body[data-touch=true] .panel h1{font-size:32px;margin:14px 0}body[data-touch=true] .panel>p:not(.eyebrow){font-size:11px;margin-bottom:12px}body[data-touch=true] .primary{margin-top:8px;min-height:48px}
body[data-touch=true] #toast{top:calc(232px + var(--safe-top));max-width:90%;white-space:normal;text-align:center;font-size:10px}
@media(max-height:550px){
 body[data-touch=true] .mission{top:calc(72px + var(--safe-top));width:180px;padding:8px 12px}
 body[data-touch=true] .mission h2,body[data-touch=true] .mission>.eyebrow{display:none}body[data-touch=true] .mission-meta{margin-top:6px;padding-top:6px}
 body[data-touch=true] .inventory,body[data-touch=true][data-aiming=true] .inventory{top:calc(72px + var(--safe-top));width:146px;padding:8px 12px}
 body[data-touch=true] .inventory ol,body[data-touch=true] .inventory .next small{display:none}body[data-touch=true] .inventory .next{margin-top:4px}
 body[data-touch=true] .play-actions,body[data-touch=true][data-phase=playing] #joystick{bottom:calc(35px + var(--safe-bottom))}
 body[data-touch=true] footer .touch-hint{display:none}body[data-touch=true] footer{justify-content:center;padding-bottom:var(--safe-bottom)}body[data-touch=true] footer button{min-height:35px}
 body[data-touch=true] .panel{padding:15px 22px}body[data-touch=true] .panel h1{font-size:26px;margin:9px 0}body[data-touch=true] .panel>p:not(.eyebrow){line-height:1.5;margin-bottom:8px}body[data-touch=true] .panel>.eyebrow{margin-bottom:5px}
 body[data-touch=true] #toast{top:calc(70px + var(--safe-top));max-width:35%}
}
/* Informational HUD panels must not swallow desktop look or right-click aim. */
body[data-phase=playing] .inventory{pointer-events:none}
body[data-phase=playing] #game{cursor:none}
