:root{--bg: #0a0d14;--panel: #121826;--line: #1f293b;--ink: #eef3fb;--mut: #aab8d2;--cyan: #4da8e0;--green: #37d99a;--amber: #f5b14c;--red: #ff6b6b;color-scheme:dark}*{box-sizing:border-box}body{margin:0;font:15px/1.5 ui-sans-serif,system-ui,Segoe UI,Inter,sans-serif;color:var(--ink);background:radial-gradient(1100px 520px at 80% -10%,rgba(192,132,252,.1),transparent 60%),radial-gradient(900px 480px at -5% 0%,rgba(77,168,224,.12),transparent 55%),var(--bg);min-height:100vh}button{font:inherit;font-weight:600;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:8px 14px;cursor:pointer}button:hover{border-color:var(--cyan)}button.end{border-color:var(--amber);color:var(--amber)}input,select{font:inherit;color:var(--ink);background:#0e131c;border:1px solid var(--line);border-radius:8px;padding:8px 10px}.lobby{max-width:420px;margin:12vh auto;padding:28px}.lobby h1{font-size:30px;letter-spacing:-.02em;margin:0}.lobby .tagline{color:var(--mut);margin:6px 0 22px}.lobby .form{display:grid;gap:12px}.lobby label{display:grid;gap:5px;font-size:12px;color:var(--mut);text-transform:uppercase;letter-spacing:.08em}.room{max-width:1080px;margin:0 auto;padding:22px clamp(14px,4vw,40px)}.rhead{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}.rhead h2{margin:0;font-weight:650}.turn-you{color:var(--green)}.turn{color:var(--cyan)}.you{color:var(--mut);font-size:13px}.combatants{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:18px 0}.combatant{background:linear-gradient(180deg,var(--panel),#0e131c);border:1px solid var(--line);border-radius:13px;padding:13px}.combatant.active{border-color:var(--cyan);box-shadow:0 0 0 2px #4da8e026}.combatant.down{opacity:.55}.cname{font-weight:600;margin-bottom:8px}.hpbar{height:7px;background:#0a0d14;border-radius:99px;overflow:hidden}.hpfill{height:100%;background:linear-gradient(90deg,var(--green),var(--amber));transition:width .25s}.combatant.down .hpfill{background:var(--red)}.hp{font-size:12px;color:var(--mut);margin-top:6px}.actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-height:38px}.waiting{color:var(--mut);font-style:italic}.error{margin:12px 0;color:var(--red);background:#ff6b6b1a;border:1px solid rgba(255,107,107,.3);padding:8px 12px;border-radius:8px}.panes{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}@media (max-width: 720px){.panes{grid-template-columns:1fr}}.log,.chat{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:14px}.log h3{margin:0 0 8px;font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--mut)}.logline{font:12.5px ui-monospace,monospace;color:var(--mut);padding:2px 0}.chatlog{min-height:160px;max-height:240px;overflow:auto;display:flex;flex-direction:column;gap:4px}.chan{color:var(--cyan);font-size:11px}.chatinput{display:flex;gap:6px;margin-top:10px}.chatinput input{flex:1}.roster{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}.roster .on{color:var(--green)}.roster .off{color:var(--mut);opacity:.6}.fog-controls{display:flex;gap:8px;justify-content:center;margin:8px 0 0}.fog-controls button.active{background:var(--accent, #4da8e0);color:#06121e}.floor-controls{display:flex;gap:8px;justify-content:center;align-items:center;margin:8px 0 0;flex-wrap:wrap}.floor-controls .floor-label{color:var(--mut);font-size:13px}.floor-controls button.active{background:#32e0c4;color:#06121e;border-color:#32e0c4}.actions button.stairs{background:#32e0c424;border-color:#32e0c4;color:#bff5ec}.actions button.stairs.solo{background:transparent;color:#7fb2ff;border-color:#7fb2ff}.mapwrap{display:flex;flex-direction:column;align-items:center;margin:18px 0}.battlemap{border:1px solid var(--line);border-radius:12px;overflow:hidden;line-height:0;box-shadow:0 8px 30px #00000059}.battlemap canvas{display:block;cursor:pointer}.maphint{color:var(--mut);font-size:12px;margin:8px 0 0}.nomap{color:var(--mut);padding:24px;text-align:center;border:1px dashed var(--line);border-radius:12px}.charselect{margin:8px 0 4px}.charselect h3{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--mut);margin:0 0 10px}.charlist{display:flex;flex-wrap:wrap;gap:12px}.charcard{text-align:left;padding:13px 16px;min-width:160px}.charcard:disabled{opacity:.5;cursor:not-allowed}.cc-name{font-weight:700;font-size:15px}.cc-meta{color:var(--mut);font-size:12px;margin-top:3px}.cc-free{color:var(--green);font-size:11px;margin-top:6px}.cc-taken{color:var(--amber);font-size:11px;margin-top:6px}.mapframe{width:600px;max-width:100%;height:600px;border:1px solid var(--line);border-radius:12px;background:#0e131c;box-shadow:0 8px 30px #00000059}.maprow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;width:600px;max-width:100%}.home{max-width:760px;margin:0 auto;padding:48px 20px}.home-head h1{margin:0 0 4px;font-size:28px}.home-head .tagline{color:var(--mut);margin:0 0 24px}.home-create{display:flex;gap:10px;margin-bottom:20px}.home-create input{flex:1}.home-error{color:var(--red);background:#ff6b6b14;border:1px solid rgba(255,107,107,.3);border-radius:9px;padding:10px 14px;margin-bottom:16px}.home-muted{color:var(--mut);padding:28px;text-align:center;border:1px dashed var(--line);border-radius:12px}.campaign-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}.campaign-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 18px;background:var(--panel);border:1px solid var(--line);border-radius:12px}.campaign-card:hover{border-color:var(--cyan)}.campaign-main{display:flex;align-items:center;gap:10px;min-width:0}.campaign-name{font-weight:700;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.campaign-actions{display:flex;gap:8px;flex-shrink:0}.badge{font-size:11px;font-weight:700;letter-spacing:.04em;padding:3px 8px;border-radius:999px;border:1px solid var(--line);color:var(--mut)}.badge.role-dm{color:var(--cyan);border-color:#4da8e066}.badge.role-player{color:var(--mut)}.badge.ai{color:var(--green);border-color:#37d99a66;background:#37d99a14}button.ghost{background:transparent}.console{max-width:940px;margin:0 auto;padding:28px 20px}.console-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}.console-title{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.console-title h1{margin:0;font-size:22px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.console-section{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--mut);margin:0 0 10px}.console-map{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}.console-start{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:16px}.console-start-row{display:flex;gap:10px;align-items:center}.console-start-row select{flex:1;max-width:360px}.console-control-mode{display:flex;align-items:center;gap:12px;margin-bottom:16px}.console-control-mode label{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--mut)}.console-control-mode select{flex:1;max-width:360px}.narration{margin:12px 0;padding:14px 18px;border-left:3px solid var(--purple, #c084fc);background:#c084fc12;border-radius:0 10px 10px 0;font-style:italic;color:var(--ink);line-height:1.55}.narration-label{display:block;font-style:normal;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--purple, #c084fc);margin-bottom:4px}.mapstage{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:8px}.mapstage .battlemap{line-height:0}