*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}
html,body{margin:0;height:100%;overflow:hidden;background:#8fd0ff;font-family:'Baloo 2',system-ui,Arial,sans-serif;color:#fff;touch-action:none;overscroll-behavior:none;position:fixed;width:100%}
#app{position:fixed;left:0;top:0;width:100%;height:100%;transform-origin:0 0;overflow:hidden}
#cv{position:absolute;left:0;top:0;width:100%;height:100%;display:block}
.hide{display:none!important}
#hud{position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none}
#tl{position:absolute;left:10px;top:8px;display:flex;gap:6px}
.bdg{background:rgba(0,0,0,.45);border-radius:6px;padding:0 8px 0 0;display:flex;align-items:center;gap:6px;font-weight:800;line-height:1.5;text-shadow:0 1px 2px #000;overflow:hidden}
.bdg span{font-size:.66rem;padding:0 6px;align-self:stretch;display:flex;align-items:center;background:#d8352a}.bdg b{font-size:1rem;color:#fff}.bdg.al span{background:#1f9d55}
#zt{position:absolute;left:50%;top:8px;transform:translateX(-50%);background:rgba(10,20,50,.55);border-radius:10px;padding:0 10px;font-weight:800;font-size:.82rem;line-height:1.6;text-shadow:0 1px 2px #000;white-space:nowrap}
#zt:empty{display:none}
#feed{position:absolute;left:10px;top:44px;display:flex;flex-direction:column;gap:3px;max-width:44%}
#feed div{background:rgba(10,20,50,.5);border-left:3px solid #ffb02e;border-radius:6px;padding:0 8px;font-size:.76rem;font-weight:700;text-shadow:0 1px 2px #000;animation:fin .25s}
#feed div.me{border-color:#4dff9a;background:rgba(20,90,50,.55)}
@keyframes fin{from{transform:translateX(-20px);opacity:0}}
#mm{pointer-events:auto;cursor:pointer;position:absolute;right:10px;top:8px;width:104px;height:104px;border-radius:50%;overflow:hidden;border:3px solid rgba(255,255,255,.8);box-shadow:0 2px 8px rgba(0,0,0,.35)}
#mmc{width:100%;height:100%;display:block}
#xh{position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-15px 0 0 -15px;transition:opacity .15s}
#xh i{position:absolute;background:#fff;box-shadow:0 0 2px #000;border-radius:1px}
#xh i:nth-child(1){left:14px;top:0;width:2px;height:9px}#xh i:nth-child(2){left:14px;bottom:0;width:2px;height:9px}
#xh i:nth-child(3){top:14px;left:0;height:2px;width:9px}#xh i:nth-child(4){top:14px;right:0;height:2px;width:9px}
#xh b{position:absolute;left:13px;top:13px;width:4px;height:4px;border-radius:50%;background:#fff}
#xh.lock i,#xh.lock b{background:#ff4a4a}
#hm{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:28px;font-weight:800;color:#fff;text-shadow:0 0 6px #ff5a00;opacity:0;transition:opacity .15s}
#hm.on{opacity:1;transition:none}#hm.k{color:#ffd84a}
#dmg{position:absolute;left:0;top:0;right:0;bottom:0;box-shadow:inset 0 0 90px 30px rgba(255,140,0,.7);opacity:0;transition:opacity .4s}
#dmg.on{opacity:1;transition:none}
#dir{position:absolute;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;opacity:0;transition:opacity .4s}
#dir.on{opacity:1;transition:none}#dir i{position:absolute;left:65px;top:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:16px solid rgba(255,120,0,.9)}
#cd{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);font-size:5rem;font-weight:800;text-shadow:0 4px 0 #e65c00,0 8px 20px rgba(0,0,0,.4)}
#hpw{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);display:flex;align-items:center;gap:6px}
.bars{display:flex;flex-direction:column;gap:2px}
#hpb,#arb{width:180px;height:11px;background:rgba(0,0,0,.45);border:2px solid rgba(255,255,255,.8);border-radius:8px;overflow:hidden}
#arb{height:7px;border-width:1px}
#hpf{height:100%;width:100%;background:linear-gradient(#7dff9a,#26c45a);transition:width .2s}#hpf.low{background:linear-gradient(#ffb36b,#ff6a2a)}
#arf{height:100%;width:0;background:linear-gradient(#8fd3ff,#2a8cff);transition:width .2s}
#hpt{font-weight:800;font-size:.9rem;text-shadow:0 1px 2px #000;min-width:28px}
#slots{position:absolute;left:50%;transform:translateX(-50%);bottom:34px;display:flex;gap:4px}
.slot{pointer-events:auto;font-family:inherit;font-weight:800;font-size:.7rem;color:#fff;background:rgba(10,20,50,.5);border:2px solid rgba(255,255,255,.35);border-radius:8px;padding:1px 8px;min-width:62px}
.slot.on{border-color:#ffd84a;background:rgba(255,160,0,.45)}
#wp{position:absolute;left:50%;transform:translateX(-50%);bottom:60px;font-size:.85rem;background:rgba(10,20,50,.55);border-radius:10px;padding:0 10px;font-weight:800;text-shadow:0 1px 2px #000;line-height:1.5;white-space:nowrap}
#wp span{font-size:.7rem;margin-right:6px;color:#ffd84a}#wp b{font-size:1.1rem}#wp small{opacity:.8}
#joy{position:absolute;left:24px;bottom:20px;width:120px;height:120px;border-radius:50%;background:rgba(0,0,0,.22);border:2px solid rgba(255,255,255,.55)}
#jk{position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:rgba(255,255,255,.75);box-shadow:0 2px 6px rgba(0,0,0,.35)}
.btn{position:absolute;pointer-events:auto;border:2px solid rgba(255,255,255,.8);border-radius:50%;background:rgba(0,0,0,.35);color:#fff;font-size:30px;font-family:inherit;touch-action:none;outline:none;padding:0;display:flex;align-items:center;justify-content:center}
.btn svg{width:58%;height:58%;fill:#fff;pointer-events:none;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))}
.btn.on2{background:rgba(255,190,40,.55);border-color:#ffd84a}
#bf{right:24px;bottom:22px;width:92px;height:92px}
#bf.on,#bf2.on{background:rgba(255,120,40,.7);transform:scale(.94)}
.btn.sm{width:50px;height:50px;font-size:22px}
.btn.xs{width:42px;height:42px;font-size:18px}
#bj{right:136px;bottom:24px}#bc{right:128px;bottom:90px}#bs{right:82px;bottom:142px}#br{right:20px;bottom:130px}#bp{right:24px;top:140px}
#bf2{left:26px;bottom:160px;width:56px;height:56px}#ba{left:94px;bottom:186px}
#bw{left:158px;bottom:136px}#bc2{left:166px;bottom:84px}#bj2{left:166px;bottom:32px}
.btn.pk{left:50%;bottom:92px;transform:translateX(-50%);border-radius:24px;width:auto;height:auto;padding:2px 16px;font-size:1rem;font-weight:800;background:linear-gradient(#5dff8a,#14b84a);animation:pk .7s infinite alternate}
@keyframes pk{to{box-shadow:0 0 14px 4px rgba(120,255,160,.7)}}
#msg{position:absolute;left:50%;top:26%;transform:translateX(-50%);font-weight:800;font-size:1.25rem;text-align:center;text-shadow:0 2px 4px #000,0 0 12px rgba(0,0,0,.4);white-space:nowrap}
.big{position:absolute;left:50%;bottom:20%;transform:translateX(-50%);pointer-events:auto;font-family:inherit;font-weight:800;font-size:1.6rem;padding:4px 30px;border-radius:30px;border:3px solid #fff;background:linear-gradient(#ffb02e,#ff6a00);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4);box-shadow:0 4px 0 #b84a00,0 6px 14px rgba(0,0,0,.35);animation:pul 1s infinite alternate}
@keyframes pul{to{transform:translateX(-50%) scale(1.08)}}
.pill{position:absolute;pointer-events:auto;font-family:inherit;font-weight:800;border:2px solid rgba(255,255,255,.8);border-radius:20px;background:rgba(10,20,50,.55);color:#fff;padding:2px 12px;font-size:.9rem;z-index:20}
#bskip{right:20px;bottom:40%}
#mute{right:124px;top:10px}
#rot{position:absolute;left:50%;top:48px;transform:translateX(-50%);background:rgba(255,140,0,.92);border-radius:12px;padding:3px 12px;font-weight:800;font-size:.85rem;z-index:30;white-space:nowrap;pointer-events:auto}
#rot b{margin-left:8px}
#scope{position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,transparent 0,transparent 34vmin,rgba(0,0,0,.92) 35vmin)}
#scope i{position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(0,0,0,.8)}
#scope:after{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:rgba(0,0,0,.8)}
.ov{position:absolute;left:0;top:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,rgba(20,60,140,.1),rgba(10,20,60,.5));z-index:10}
.card{text-align:center;padding:12px 28px 10px;border-radius:22px;background:rgba(12,24,70,.5);border:2px solid rgba(255,255,255,.35);box-shadow:0 10px 40px rgba(0,0,0,.35);max-width:92%}
.ttl{font-weight:800;font-size:2.2rem;line-height:1;letter-spacing:1px;color:#fff;text-shadow:0 3px 0 #e65c00,0 6px 16px rgba(0,0,0,.4)}
.ttl span{font-size:1.6rem;background:linear-gradient(90deg,#ff9933 0,#ff9933 33%,#fff 33%,#fff 66%,#3ecf4a 66%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.ttl em{font-style:normal;font-size:.8rem;vertical-align:middle;background:#ff3b5c;border-radius:6px;padding:0 6px;text-shadow:none;letter-spacing:0}
.sub{margin:6px 0 4px;font-weight:700;font-size:.9rem;opacity:.95}
.nm{font-size:.9rem;margin:2px 0 6px}
.go{font-family:inherit;font-weight:800;font-size:1.4rem;padding:2px 44px;border-radius:30px;border:3px solid #fff;background:linear-gradient(#5dff8a,#14b84a);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4);box-shadow:0 4px 0 #0a7a30,0 6px 16px rgba(0,0,0,.35);cursor:pointer}
.hint{font-size:.72rem;opacity:.85;margin-top:6px}
.back,.back2{position:absolute;left:10px;top:8px;color:#fff;text-decoration:none;font-weight:800;background:rgba(10,20,50,.55);border-radius:12px;padding:2px 12px;font-size:.9rem;border:2px solid rgba(255,255,255,.5)}
.back2{position:static;display:inline-block;margin-top:8px}
.wm{position:absolute;bottom:6px;right:10px;font-size:.72rem;font-weight:700;opacity:.9;text-shadow:0 1px 2px #000}
@media (max-height:420px){.ttl{font-size:1.8rem}.ttl span{font-size:1.3rem}.card{padding:8px 22px 8px}}

#ld{margin:6px auto 4px;width:220px;max-width:80%}
#ldw{height:8px;border-radius:6px;background:rgba(255,255,255,.18);overflow:hidden}
#ldb{height:100%;width:0;background:linear-gradient(90deg,#ff9933,#ffd54f,#7ee36b);transition:width .2s}
#ldt{font-size:11px;opacity:.85;margin-top:3px}
#ld.done{display:none}
.go.wait{opacity:.6;filter:grayscale(.4)}
#scope.dot{background:radial-gradient(circle at 50% 50%,transparent 0,transparent 30vmin,rgba(0,0,0,.35) 46vmin,rgba(0,0,0,.55) 60vmin)}
#scope.dot i,#scope.dot:after{display:none}
#scope.dot b{position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:#ff2a2a;box-shadow:0 0 6px #ff2a2a}
#scope.dot u{position:absolute;left:50%;top:50%;width:26vmin;height:26vmin;margin:-13vmin 0 0 -13vmin;border-radius:50%;border:2px solid rgba(20,20,20,.55)}
#scope b,#scope u{display:none}
#scope.dot b,#scope.dot u{display:block}
#scope em{position:absolute;right:14px;top:50%;font-style:normal;font-weight:800;color:#fff;text-shadow:0 1px 3px #000;font-size:14px}

#diff{margin:6px 0 2px}
#diff button{font:inherit;font-size:12px;font-weight:700;color:#fff;background:rgba(255,255,255,.14);border:1.5px solid rgba(255,255,255,.35);border-radius:14px;padding:4px 10px;margin:0 3px}
#diff button.on{background:#ff9933;border-color:#ffd54f}
.cred{position:absolute;right:10px;bottom:8px;font-size:11px;color:rgba(255,255,255,.7)}
#esh .gzwa{margin:2px auto 6px;font-size:.85rem;padding:5px 13px}

.btn.pk.veh{bottom:104px;background:linear-gradient(#7fdcff,#1e88e5)}
.btn.pk.veh.out{background:linear-gradient(#ffd36f,#ff8f1a)}
#room .card.rc{padding:6px 18px 6px;max-width:94%}
.ttl.rt{font-size:1.5rem}
.rrow{display:flex;align-items:center;justify-content:center;margin:2px 0}
.rrow>div{margin-right:16px}
.rcode{font-weight:800;font-size:2rem;letter-spacing:4px;color:#ffd54f;line-height:1;text-shadow:0 2px 0 #b35c00}
.rpl{list-style:none;margin:0;padding:0;text-align:left;font-size:13px;font-weight:700}
.rpl li{background:rgba(10,20,60,.55);border-radius:10px;padding:1px 10px;margin:2px 0;min-width:140px;max-width:46vw;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.rpl li.emp{opacity:.7;font-weight:600;color:#cfd8ff}
.sub.rs{font-size:12px;margin:3px 0 5px}
.sub.err{color:#ffd6d6}
.lnk{background:none;border:0;color:#fff;opacity:.9;font-family:inherit;font-size:12px;font-weight:700;text-decoration:underline;padding:5px 6px;cursor:pointer}
.lnk.hide{display:none}
.go2{font-family:inherit;font-weight:800;font-size:1rem;padding:2px 22px;margin-left:8px;border-radius:30px;border:3px solid #fff;background:linear-gradient(#ffd36f,#ff8f1a);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4);box-shadow:0 4px 0 #b35c00,0 6px 16px rgba(0,0,0,.35);cursor:pointer;vertical-align:middle}
.go2.wait{opacity:.6;filter:grayscale(.4)}
#room .gzwa{margin:2px auto 2px}
@media (max-height:420px){.ttl.rt{font-size:1.25rem}.rcode{font-size:1.7rem}}
.btn.pk.veh.out{left:auto;right:26px;bottom:44px;transform:none;padding:8px 18px;font-size:1.05rem}

#mmh{position:absolute;right:10px;top:116px;width:110px;text-align:center;font-size:.62rem;font-weight:800;text-shadow:0 1px 2px #000;opacity:.85}
#bm{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:300px;height:300px;border-radius:14px;overflow:hidden;border:3px solid rgba(255,255,255,.85);box-shadow:0 4px 18px rgba(0,0,0,.5);pointer-events:auto;z-index:6;background:#6fb455}
#bm.pl{left:12px;top:50%;transform:translateY(-50%);z-index:4}
#bm.hide{display:none}
#bmc{width:100%;height:100%;display:block}
