*{box-sizing:border-box}:root{--bg: #080a10;--panel: rgba(17, 21, 31, .92);--line: #26304a;--line-soft: #1b2338;--txt: #e9eefa;--sub: #8b98b0;--dim: #66738c;--enemy: #ff4d5e;--self: #3d9bff;--ok: #35c46b}html,body,#root{margin:0;padding:0;min-height:100%;background:var(--bg);color:var(--txt);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased}body{background:radial-gradient(1000px 560px at 12% -5%,rgba(61,155,255,.16) 0%,transparent 62%),radial-gradient(900px 520px at 92% 4%,rgba(255,77,94,.13) 0%,transparent 60%),radial-gradient(700px 420px at 50% 110%,rgba(120,90,255,.1) 0%,transparent 65%),var(--bg)}.wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}.card{position:relative;width:100%;max-width:400px;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:15px;box-shadow:0 24px 70px #0009,0 0 0 1px #ffffff05 inset;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);overflow:hidden}.card:before{content:"";position:absolute;top:0;left:12%;right:12%;height:1px;background:linear-gradient(90deg,transparent,rgba(120,170,255,.55),transparent)}.grip{position:absolute;top:6px;left:50%;transform:translate(-50%);width:40px;height:4px;border-radius:3px;background:#2f3a56}header{display:flex;align-items:center;gap:11px;margin-top:7px}.brand{display:flex;align-items:center;gap:11px;flex:1;min-width:0}.logo{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-weight:800;font-size:15px;letter-spacing:.5px;color:#fff;background:linear-gradient(145deg,#3d9bff,#7b5cff 55%,#ff4d5e);box-shadow:0 6px 18px #3d9bff59;flex:none}.titles{min-width:0}h1{margin:0;font-size:17px;letter-spacing:.2px;background:linear-gradient(90deg,#fff,#b9cdf5);-webkit-background-clip:text;background-clip:text;color:transparent}.sub{margin:2px 0 0;font-size:11px;color:var(--sub)}.pipBtn{width:34px;height:34px;padding:0;border-radius:10px;background:#1a2233;border:1px solid var(--line);color:#cfe0f5;font-size:15px;line-height:1;cursor:pointer;flex:none;transition:background .15s,border-color .15s,transform .1s}.pipBtn:hover{background:#232d44;border-color:#3a4a72}.pipBtn:active{transform:translateY(1px)}.row{display:flex;gap:8px;margin:13px 0 10px}input{flex:1;min-width:0;padding:10px 13px;border-radius:12px;border:1px solid var(--line);background:#0b0f18;color:var(--txt);font-size:15px;font-weight:600;letter-spacing:3px;text-transform:uppercase;outline:none;transition:border-color .15s,box-shadow .15s}input::placeholder{color:#4d5a73;letter-spacing:1px;font-weight:400}input:focus{border-color:#3d9bff;box-shadow:0 0 0 3px #3d9bff29}button[type=submit]{padding:10px 18px;border:0;border-radius:12px;background:linear-gradient(140deg,#3d9bff,#2f6fd0);color:#fff;font-size:13px;font-weight:700;letter-spacing:.3px;cursor:pointer;flex:none;box-shadow:0 6px 16px #3d9bff47;transition:transform .1s,filter .15s}button[type=submit]:hover{filter:brightness(1.08)}button[type=submit]:active{transform:translateY(1px)}.status{display:flex;align-items:center;gap:8px;font-size:12px;color:#9fb0c8;padding:8px 11px;border-radius:11px;background:#0b0f18;border:1px solid var(--line-soft)}.status .dot{width:7px;height:7px;border-radius:50%;background:#56627a;flex:none}.status.ok{color:#a6ecbf;border-color:#35c46b47;background:#35c46b0f}.status.ok .dot{background:var(--ok);box-shadow:0 0 9px var(--ok)}.status.wait{color:#f0cf8d;border-color:#f0a74242;background:#f0a7420f}.status.wait .dot{background:#f0a742;box-shadow:0 0 8px #f0a742b3}.status .meta{margin-left:auto;opacity:.7;font-size:11px}.pipMsg{margin-top:8px;font-size:11px;color:#f0cf8d;background:#f0a74214;border:1px solid rgba(240,167,66,.25);border-radius:9px;padding:7px 10px}.canvasBox{margin-top:11px;border-radius:14px;overflow:hidden;border:1px solid var(--line-soft);background:#0a0e15;aspect-ratio:1 / 1;box-shadow:0 10px 30px #00000059 inset}.canvasBox canvas{width:100%;height:100%;display:block}.list{margin-top:11px;border:1px solid var(--line-soft);border-radius:13px;background:#0b0f18;overflow:hidden}.listHead{display:flex;align-items:center;gap:8px;padding:8px 11px;font-size:11px;color:var(--sub);border-bottom:1px solid var(--line-soft)}.tag{font-size:10px;font-weight:800;letter-spacing:1px;padding:2px 7px;border-radius:6px}.tag.enemy{color:#fff;background:linear-gradient(140deg,#ff4d5e,#c8303f)}.list ul{list-style:none;margin:0;padding:0;max-height:132px;overflow-y:auto}.list li{display:flex;align-items:center;gap:9px;padding:7px 11px;font-size:12px;border-bottom:1px solid rgba(38,48,74,.45)}.list li:last-child{border-bottom:0}.av{width:26px;height:26px;border-radius:7px;overflow:hidden;flex:none;border:1.5px solid var(--enemy);background:#23161b;display:grid;place-items:center}.av img{width:100%;height:100%;object-fit:cover;display:block}.avFallback{width:9px;height:9px;border-radius:50%;background:var(--enemy)}.nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#dbe4f5}.hp{width:54px;height:5px;border-radius:3px;background:#1d2437;overflow:hidden;flex:none}.hp i{display:block;height:100%;background:linear-gradient(90deg,#35c46b,#8ee36f)}.ds{width:38px;text-align:right;color:var(--dim);font-variant-numeric:tabular-nums;flex:none}.hint{margin:11px 2px 0;font-size:11px;color:var(--dim);line-height:1.55}.toasts{position:absolute;bottom:14px;left:12px;right:12px;display:flex;flex-direction:column-reverse;gap:7px;z-index:5;pointer-events:none}.toast{display:flex;align-items:flex-start;gap:9px;padding:9px 11px;border-radius:12px;font-size:12px;line-height:1.45;color:#e6ecf8;background:#121722f7;border:1px solid #2a3350;box-shadow:0 12px 30px #0000008c;animation:toastIn .22s ease-out}@keyframes toastIn{0%{opacity:0;transform:translateY(-8px) scale(.97)}to{opacity:1;transform:none}}.toast .ico{width:17px;height:17px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;margin-top:1px}.toast.ok{border-color:#35c46b73}.toast.ok .ico{background:#35c46b2e;color:#6ee7a0}.toast.warn{border-color:#f0a74280}.toast.warn .ico{background:#f0a7422e;color:#f5c471}.toast.err{border-color:#ff4d5e80}.toast.err .ico{background:#ff4d5e2e;color:#ff8b98}.toast.info{border-color:#3d9bff73}.toast.info .ico{background:#3d9bff2e;color:#7db6ff}.toast .txt{flex:1;min-width:0}.pipBox{width:100vw;height:100vh;background:#0a0e15;display:grid;place-items:center}.pipBox canvas{width:100%;height:100%;display:block}@media (max-width: 430px){.card{padding:13px;border-radius:17px}.hp{width:40px}}