*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#152b24;color:#f2f4e9;font-family:Arial,sans-serif;overscroll-behavior:none}#scene{position:fixed;inset:0}canvas{display:block;width:100%;height:100%;touch-action:none}button{font:inherit;min-height:44px;padding:10px 14px;border:1px solid #92ac91;border-radius:12px;background:#193b32e6;color:#f3f2df;cursor:pointer;touch-action:none}button:disabled{opacity:.4}header{position:fixed;left:env(safe-area-inset-left);right:env(safe-area-inset-right);top:env(safe-area-inset-top);display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px;pointer-events:none}header>*{pointer-events:auto}header>div{text-align:center;text-shadow:0 2px 8px #000;background:#162e24b8;padding:8px 14px;border-radius:12px}header strong{font-family:Georgia,serif;letter-spacing:3px;font-size:20px}header small{display:block;font-size:10px;letter-spacing:1px;margin-top:5px;color:#d4e3ca}#mission{position:fixed;top:calc(env(safe-area-inset-top) + 90px);left:16px;max-width:270px;background:#193224db;border:1px solid #8b9a63;padding:10px 14px;border-radius:12px;font-size:14px;line-height:1.4;pointer-events:none}.bottom{position:fixed;bottom:calc(env(safe-area-inset-bottom) + 18px);left:calc(env(safe-area-inset-left) + 18px);right:calc(env(safe-area-inset-right) + 18px);display:flex;justify-content:space-between;align-items:end;pointer-events:none}.bottom>*{pointer-events:auto}#joystick{width:105px;height:105px;background:#173b3366;border:2px solid #c7dec577;border-radius:50%;position:relative;touch-action:none}#stick{position:absolute;left:32px;top:32px;width:37px;height:37px;background:#d3e3baaa;border-radius:50%;box-shadow:0 4px 12px #0005;pointer-events:none}.actions{display:flex;flex-direction:column;gap:6px}.actions #bind,#seal,#begin{background:#edcf8b;color:#263a29;font-weight:bold}#toast{position:fixed;bottom:145px;left:50%;transform:translateX(-50%);background:#163428e8;padding:10px 16px;border-radius:12px;font-size:14px;line-height:1.4;max-width:80%;text-align:center;pointer-events:none}#toast:empty{display:none}.modal{position:fixed;inset:0;background:#0b231adb;display:grid;place-items:center;padding:20px;z-index:20;overflow:auto}.modal section{width:min(100%,560px);background:linear-gradient(145deg,#35513b,#152f2b);border:1px solid #a4b27a;padding:28px;border-radius:22px;box-shadow:0 20px 80px #0006;max-height:95dvh;overflow:auto}.modal span{font-size:11px;letter-spacing:2px;color:#e0ca92}h1{font-family:Georgia,serif;font-size:clamp(38px,6vw,65px);line-height:1.05;margin:20px 0;color:#f5dea8}h2{font-family:Georgia,serif}p{font-size:16px;line-height:1.6;color:#d6e2cd}.modal small{display:block;font-size:13px;line-height:1.5;color:#bcd1bc;margin-top:20px}.modal button{margin:5px}a{display:block;color:#ead499;margin:20px 5px}#binding{position:fixed;bottom:calc(env(safe-area-inset-bottom) + 20px);left:50%;transform:translateX(-50%);width:min(90%,440px);background:#15382af5;padding:18px;border:1px solid #ddc788;border-radius:16px;z-index:10;text-align:center}.track{position:relative;height:28px;background:#112a2b;margin:12px 0;border-radius:7px;overflow:hidden}#zone{position:absolute;left:38%;width:24%;height:100%;background:#e1c86c88;border-left:2px solid #ffe9a4;border-right:2px solid #ffe9a4}#marker{position:absolute;width:4px;height:100%;background:white}[hidden]{display:none!important}@media(orientation:landscape) and (max-height:500px){header{padding:7px}header small{display:none}#mission{top:65px;font-size:12px;max-width:240px}.actions{flex-direction:row}.bottom{bottom:12px}#joystick{width:85px;height:85px}#stick{left:24px;top:24px}#toast{bottom:108px}.modal section{padding:20px}h1{font-size:38px;margin:12px 0}.modal p{font-size:14px}}@media(max-width:430px){header strong{font-size:15px}header button{font-size:12px;padding:9px}header small{font-size:8px}header>div{padding:7px}#mission{font-size:13px}}