:root{--ink:#1d2433;--paper:#fffcf4eb;--green:#2bd96b;--red:#ff4646;--gold:#f2c14e;--dark:#141821c7;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica Neue,Arial,sans-serif}html,body{overscroll-behavior:none;height:100%;color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;background:#9ecbe6;margin:0;overflow:hidden}*{touch-action:none;box-sizing:border-box}#game{outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}#hud{pointer-events:none;position:fixed;inset:0}#hud button{pointer-events:auto}[hidden]{display:none!important}button{font:inherit;cursor:pointer;color:inherit;border:0}#tags{position:absolute;inset:0}.tag{will-change:transform;white-space:nowrap;flex-direction:column;align-items:center;gap:2px;display:flex;position:absolute;top:0;left:0;transform:translate(-50%,-100%)}.tag .name{color:#fff;text-shadow:0 1px 2px #000000e6,0 0 4px #0009;font-size:13px;font-weight:700}.tag.me .name{color:#ffe9a8}.tag.away{opacity:.55}.tag.away .name:after{content:" (disconnected)";font-weight:400}.tag .hp{background:#0000008c;border:1px solid #000000b3;border-radius:4px;width:56px;height:7px;overflow:hidden}.tag.raider .hp{width:46px}.tag .hp-fill{background:#4ee06f;width:100%;height:100%;transition:width .12s linear}.tag.raider .hp-fill{background:#ff6b5b}.tag.down .name:after{content:" (down)";color:#ffb3b3;font-weight:400}.tag.dead{opacity:0;transition:opacity .6s}#target-box{--c:var(--green);will-change:transform, width, height;position:absolute;top:0;left:0}#target-box[data-state=out]{--c:var(--red)}#target-box .c{border:3px solid var(--c);filter:drop-shadow(0 0 2px #000c);width:14px;height:14px;position:absolute}#target-box .tl{border-bottom:0;border-right:0;top:0;left:0}#target-box .tr{border-bottom:0;border-left:0;top:0;right:0}#target-box .bl{border-top:0;border-right:0;bottom:0;left:0}#target-box .br{border-top:0;border-left:0;bottom:0;right:0}#click-marker{border:3px solid #ffffffe6;border-radius:50%;width:22px;height:22px;margin:-11px 0 0 -11px;animation:.45s ease-out forwards ping;position:absolute;top:0;left:0}@keyframes ping{0%{transform:var(--at) scale(.4);opacity:1}to{transform:var(--at) scale(1.4);opacity:0}}#top-left{position:absolute;top:10px;left:12px}#roster{flex-direction:column;gap:4px;display:flex}#roster .who{background:var(--dark);color:#fff;border-radius:12px;padding:4px 10px 4px 22px;font-size:13px;position:relative}#roster .who:before{content:"";background:var(--green);border-radius:50%;width:8px;height:8px;margin-top:-4px;position:absolute;top:50%;left:8px}#roster .who.away:before{background:#888}#roster .who.me{font-weight:700}#top-right{align-items:flex-start;gap:8px;display:flex;position:absolute;top:10px;right:12px}#reset-btn{background:var(--dark);color:#fff;border-radius:10px;padding:8px 14px;font-size:14px}#mute-btn{background:var(--dark);color:#fff;border-radius:10px;justify-content:center;align-items:center;width:40px;height:36px;padding:0;display:flex}#mute-btn[data-muted=true]{color:#ffb3b3}#mute-btn[data-muted=true] .on,#mute-btn[data-muted=false] .off{display:none}#quit-btn{background:var(--dark);color:#fff;border-radius:10px;height:36px;padding:8px 14px;font-size:14px}#quit-confirm{background:#0a0e1673;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#quit-confirm .box{background:var(--paper);text-align:center;border-radius:18px;min-width:260px;padding:20px 26px 22px;box-shadow:0 6px 24px #00000059}#quit-confirm h2{margin:0 0 16px;font-size:22px}#quit-confirm .row{justify-content:center;gap:12px;display:flex}#quit-confirm button{color:#fff;border-radius:12px;min-width:96px;padding:12px 26px;font-size:17px;font-weight:700}#quit-leave-btn{background:#b3261e}#quit-stay-btn{background:#2f7d4f}#banner{background:var(--dark);color:#fff;letter-spacing:.02em;border-radius:14px;padding:10px 22px;font-size:22px;font-weight:800;position:absolute;top:16%;left:50%;transform:translate(-50%)}#hint{background:var(--paper);border-radius:12px;padding:8px 16px;font-size:15px;font-weight:600;position:absolute;top:9%;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #00000040}#notice{color:#fff;background:#781414d9;border-radius:10px;padding:6px 14px;font-size:15px;position:absolute;bottom:150px;left:50%;transform:translate(-50%)}#down-banner{color:#fff;background:#5a0a0ad1;border-radius:12px;padding:10px 20px;font-size:18px;font-weight:700;position:absolute;top:40%;left:50%;transform:translate(-50%)}#done-panel{background:var(--paper);text-align:center;pointer-events:auto;border-radius:18px;min-width:280px;padding:18px 26px 22px;position:absolute;top:30%;left:50%;transform:translate(-50%);box-shadow:0 6px 24px #00000059}#done-panel h2{margin:0 0 4px;font-size:24px}#done-panel p{margin:0 0 14px}#play-again-btn{color:#fff;background:#2f7d4f;border-radius:14px;padding:14px 24px;font-size:18px;font-weight:700}#bottom{left:0;right:0;bottom:max(14px, env(safe-area-inset-bottom));pointer-events:none;justify-content:center;align-items:flex-end;display:flex;position:absolute}#attack-bar{background:#1418218c;border-radius:18px;gap:10px;padding:8px;display:flex}#attack-btn{color:#3a2400;background:radial-gradient(circle at 50% 35%,#ffe08a,#e0a425 70%);border:3px solid #fff3c4;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;width:92px;height:92px;transition:filter 80ms,box-shadow 80ms;display:flex;position:relative;overflow:hidden;box-shadow:0 0 14px #ffd25ae6}#attack-btn .label{font-size:18px;font-weight:800;position:relative}#attack-btn .key{opacity:.8;font-size:12px;font-weight:800;position:absolute;top:4px;right:6px}#attack-btn .cd{background:#0000008c;height:0%;position:absolute;bottom:0;left:0;right:0}#attack-btn[data-ready=false]{filter:grayscale()brightness(.45);box-shadow:none}#attack-btn[data-range=out]{border-color:var(--red)}#next-target-btn{right:max(18px, env(safe-area-inset-right));background:var(--dark);color:#fff;border:3px solid #ffffffbf;border-radius:50%;width:84px;height:84px;font-size:14px;font-weight:700;line-height:1.15;position:absolute;bottom:6px}#help,#help-touch{color:#fff;text-shadow:0 1px 2px #000000e6;max-width:46%;font-size:12px;position:absolute;bottom:8px;left:12px}#help-touch{max-width:30%}#conn{color:#fff;background:#b3261e;border-radius:0 0 12px 12px;padding:8px 18px;font-size:15px;font-weight:700;position:absolute;top:0;left:50%;transform:translate(-50%)}#conn[data-status=connecting]{background:#44546a}#loading,#name-form,#fatal,#left-screen{text-align:center;background:linear-gradient(#9ecbe6,#f0dcae);flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:24px;display:flex;position:fixed;inset:0}#loading h1,#name-form h1,#left-screen h1{letter-spacing:.04em;color:#2b3a52;margin:0;font-size:40px}#left-screen p{margin:0;font-size:20px}#join-again-btn{color:#fff;background:#2f7d4f;border-radius:12px;padding:12px 34px;font-size:18px;font-weight:700}#loading-bar{background:#00000026;border-radius:5px;width:min(320px,80vw);height:10px;overflow:hidden}#loading-fill{background:#2f7d4f;width:0%;height:100%;transition:width .15s}#name-form label{max-width:360px;font-size:16px}#name-form input{font:inherit;text-align:center;touch-action:manipulation;-webkit-user-select:text;user-select:text;border:2px solid #2b3a52;border-radius:12px;width:min(320px,80vw);padding:10px 14px;font-size:20px}#name-go{color:#fff;background:#2f7d4f;border-radius:12px;padding:12px 34px;font-size:18px;font-weight:700}#fatal{color:#6b1d12;z-index:10;background:#f4e2d8;font-size:18px}
