:root{--ink:#f4ecd8;--muted:#b7ad97;--gold:#e2b85a;--panel:#12100eb8;--panel-edge:#e2b85a59;--danger:#ff6b5a;--hp:linear-gradient(90deg, #a3241c, #e0493a);--exp:linear-gradient(90deg, #b5862a, #f3cf6b);color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{background:#1a1d1f;height:100%;margin:0;overflow:hidden}#scene{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}#overlay,#hud{pointer-events:none;position:fixed;inset:0}[hidden]{display:none!important}#screen{background:radial-gradient(#0a0a0a26,#0a0a0a99);place-items:center;padding:16px;display:grid;position:fixed;inset:0;overflow-y:auto}.card{background:var(--panel);border:1px solid var(--panel-edge);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:14px;width:min(440px,100%);padding:28px 28px 22px;box-shadow:0 20px 60px #00000073}.title{letter-spacing:.08em;text-align:center;color:var(--gold);text-shadow:0 2px 18px #e2b85a59;margin:0;font-family:Cinzel,Georgia,serif;font-size:2.6rem;font-weight:700}.subtitle{text-align:center;color:var(--muted);margin:4px 0 22px}h2{letter-spacing:.06em;color:var(--gold);margin:18px 0 10px;font-family:Cinzel,Georgia,serif;font-size:1.05rem}.stack{gap:10px;display:grid}input{width:100%;color:var(--ink);font:inherit;background:#00000059;border:1px solid #ffffff24;border-radius:8px;outline:none;padding:11px 12px}input:focus{border-color:var(--gold)}button{font:inherit;cursor:pointer;color:inherit}button.primary{color:#241a08;background:linear-gradient(#e9c46a,#c08f2e);border:0;border-radius:8px;padding:11px 16px;font-weight:600}button.primary:disabled{opacity:.6;cursor:progress}button.link{color:var(--muted);background:0 0;border:0;justify-self:center;padding:8px;text-decoration:underline}.error{min-height:1.2em;color:var(--danger);text-align:center;font-size:.9rem}.muted{color:var(--muted)}.char-list{gap:8px;display:grid}.char-row{background:#ffffff0d;border:1px solid #ffffff14;border-radius:10px;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;display:flex}.char-name{font-size:1.05rem;font-weight:600}.char-meta{color:var(--muted);font-size:.85rem}.class-picker{gap:6px;display:grid}.class-option{text-align:left;background:#00000040;border:1px solid #ffffff1a;border-radius:8px;gap:2px;padding:10px 12px;display:grid}.class-option span{color:var(--muted);font-size:.82rem}.class-option.selected{border-color:var(--gold);background:#e2b85a1f}.plate{white-space:nowrap;will-change:transform;justify-items:center;gap:3px;display:grid;position:absolute;top:0;left:0}.plate-name{text-shadow:0 1px 2px #000,0 0 6px #000c;font-size:12px;font-weight:600}.plate-mob .plate-name{color:#ffd9a0;font-weight:500}.plate-self .plate-name{color:#b8f0a8}.plate-hp{background:#0009;border-radius:3px;width:46px;height:5px;overflow:hidden;box-shadow:0 0 0 1px #00000080}.plate-hp>div{background:var(--hp);width:100%;height:100%;transition:width .15s ease-out}.plate-player .plate-hp>div,.plate-self .plate-hp>div{background:linear-gradient(90deg,#2e8b3a,#6fd36a)}.plate.targeted .plate-name{color:#ff8a7a}.floater{text-shadow:0 2px 3px #000;will-change:transform, opacity;font-size:18px;font-weight:700;position:absolute;top:0;left:0}.floater.dmg{color:#fff3c4}.floater.dmg-self{color:#ff6b5a}.floater.xp{color:#9fe6ff;font-size:15px}.floater.levelup{color:var(--gold);text-shadow:0 0 12px #ffc850cc,0 2px 3px #000;font-family:Cinzel,Georgia,serif;font-size:26px}.hud-top{top:calc(12px + env(safe-area-inset-top,0px));justify-content:space-between;gap:8px;display:flex;position:absolute;left:16px;right:16px}.hud-chip{background:var(--panel);color:var(--muted);border:1px solid #ffffff14;border-radius:999px;padding:6px 12px;font-size:13px}.hud-chip strong{color:var(--ink);font-family:Cinzel,Georgia,serif}.hud-bottom{left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:min(420px,100% - 32px);position:absolute;transform:translate(-50%)}.hud-panel{background:var(--panel);border:1px solid var(--panel-edge);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:12px;gap:7px;padding:12px 14px;display:grid}.hud-ident{align-items:center;gap:10px;display:flex}.level-badge{border:2px solid var(--gold);width:34px;height:34px;color:var(--gold);background:#0006;border-radius:50%;place-items:center;font-family:Cinzel,Georgia,serif;font-weight:700;display:grid}.hud-name{font-weight:600}.hud-class,.stat-line{color:var(--muted);font-size:12px}.bar{background:#00000080;border-radius:6px;height:18px;position:relative;overflow:hidden}.bar.thin{height:12px}.bar-fill{transition:width .2s ease-out;position:absolute;inset:0 auto 0 0}.bar-fill.hp{background:var(--hp)}.bar-fill.exp{background:var(--exp)}.bar-text{text-align:center;text-shadow:0 1px 2px #000;font-size:11px;font-weight:600;line-height:18px;position:relative}.bar.thin .bar-text{font-size:10px;line-height:12px}.chat{left:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));pointer-events:auto;gap:6px;width:min(340px,100% - 32px);display:grid;position:absolute}.chat-log{text-shadow:0 1px 2px #000;gap:2px;max-height:180px;font-size:13px;display:grid;overflow-y:auto;-webkit-mask-image:linear-gradient(#0000,#000 30%);mask-image:linear-gradient(#0000,#000 30%)}.chat-line.system{color:#d9c78f}.chat-input{background:#00000073;padding:7px 10px;font-size:13px}.help{top:calc(50px + env(safe-area-inset-top,0px));color:#f4ecd8b3;text-shadow:0 1px 2px #000;white-space:nowrap;font-size:12px;animation:1.5s 12s forwards fade-out;position:absolute;left:50%;transform:translate(-50%)}@keyframes fade-out{to{opacity:0}}.dead-banner{text-align:center;color:var(--muted);background:#280604b3;border:1px solid #ff6b5a66;border-radius:12px;padding:18px 28px;position:absolute;top:38%;left:50%;transform:translate(-50%,-50%)}.dead-title{color:var(--danger);font-family:Cinzel,Georgia,serif;font-size:1.6rem}@media (width<=760px){.help{display:none}.chat{bottom:calc(150px + env(safe-area-inset-bottom,0px))}}.perf-panel{top:calc(56px + env(safe-area-inset-top,0px));color:#c8f0c0;pointer-events:none;z-index:5;background:#0a0c10c7;border:1px solid #ffffff14;border-radius:8px;margin:0;padding:8px 10px;font:11px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;position:absolute;right:12px}