*{box-sizing:border-box}html,body{touch-action:none;-webkit-user-select:none;user-select:none;background:#a7d3ee;height:100%;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}#app,canvas{width:100%;height:100%;display:block}.hud{pointer-events:none;color:#fff;text-shadow:0 1px 2px #000000b3;font-size:13px;position:fixed;inset:0}.hidden{display:none!important}.frame{background:#14181e8c;border:1px solid #ffffff26;border-radius:8px;padding:6px 8px;position:absolute}.player-frame{width:220px;top:10px;left:10px}.target-frame{text-align:center;width:240px;top:10px;left:50%;transform:translate(-50%)}.name{margin-bottom:4px;font-weight:600}.lv{color:#ffd966;font-weight:400}.bar{background:#00000073;border-radius:4px;height:14px;margin-top:3px;position:relative;overflow:hidden}.bar i{background:#d64545;transition:width .15s;position:absolute;top:0;bottom:0;left:0}.bar.mp i{background:#3f7fd8}.bar.exp i{background:#e0b43a}.bar span{text-align:center;font-size:11px;line-height:14px;display:block;position:relative}.bar.exp{border-radius:0;height:16px;margin:0;position:absolute;bottom:0;left:0;right:0}.bar.exp span{line-height:16px}.gold{color:#ffe08a;margin-top:4px;font-size:12px}.minimap{border:2px solid #fff6;border-radius:8px;width:160px;height:160px;position:absolute;top:10px;right:10px}.messages{flex-direction:column;gap:2px;width:300px;display:flex;position:absolute;bottom:120px;left:10px}.msg{background:#00000059;border-radius:4px;width:-moz-fit-content;width:fit-content;padding:2px 6px;transition:opacity 1s}.msg.fade{opacity:0}.msg.exp{color:#ffe08a}.msg.gold{color:#ffd23f}.msg.warn{color:#ffb0a0}.msg.bad{color:#ff6b6b}.msg.good{color:#9dff9d}.skillbar{pointer-events:auto;gap:8px;display:flex;position:absolute;bottom:26px;left:50%;transform:translate(-50%)}.skill{color:#fff;width:64px;height:64px;font:inherit;cursor:pointer;touch-action:none;background:#1e242ebf;border:2px solid #ffffff59;border-radius:10px;padding:0;font-size:11px;position:relative;overflow:hidden}.skill:active{transform:scale(.94)}.skill .key{color:#ffd966;font-size:10px;position:absolute;top:2px;left:4px}.skill .label{padding:16px 2px 0;line-height:1.15;display:block}.skill .cd{justify-content:center;align-items:center;font-size:20px;font-style:normal;font-weight:700;display:flex;position:absolute;inset:0}.skill.nomp{filter:grayscale(.8)brightness(.7)}.banner{color:#ffe066;text-shadow:0 2px 8px #000000b3;font-size:34px;font-weight:800;position:absolute;top:28%;left:50%;transform:translate(-50%)}.death{background:#50000099;border-radius:8px;padding:12px 18px;font-size:18px;position:absolute;top:40%;left:50%;transform:translate(-50%)}.floaters{position:absolute;inset:0;overflow:hidden}.floater{white-space:nowrap;will-change:transform;font-size:18px;font-weight:800;position:absolute;top:0;left:0}.floater.crit{color:#fc3;font-size:26px}.floater.hurt{color:#f55}.floater.miss{color:#ccc;font-size:14px}.help{pointer-events:auto;background:#14181e99;border-radius:8px;width:220px;padding:8px 10px;font-size:12px;line-height:1.5;position:absolute;top:222px;right:10px}.fps{font-size:12px;position:absolute;bottom:24px;right:10px}.mute{color:#fff;pointer-events:auto;cursor:pointer;background:#14181e99;border:1px solid #ffffff4d;border-radius:8px;width:36px;height:36px;padding:0;font-size:18px;position:absolute;top:178px;right:10px}.hurt-flash{opacity:0;position:absolute;inset:0;box-shadow:inset 0 0 90px 24px #ff1e1e99}.hurt-flash.on{animation:.4s ease-out hurt}@keyframes hurt{0%{opacity:1}to{opacity:0}}@media (max-width:700px){.player-frame{width:170px}.target-frame{width:200px;top:64px}.minimap{width:110px;height:110px}.skill{width:58px;height:58px}.messages{width:220px;font-size:12px;bottom:110px}.help{width:180px;top:172px}.mute{top:128px}}