*{box-sizing:border-box}body{margin:0;background:#111827;color:#e5e7eb;font-family:system-ui}main{height:100vh;display:flex;flex-direction:column}header{display:flex;align-items:center;gap:24px;padding:12px 24px}h1{font-size:20px;margin:0}button{margin-left:auto;padding:8px 16px;cursor:pointer}canvas{flex:1}main>div{flex:1;min-height:0}p,footer{padding:12px 24px}footer{font-size:12px;color:#9ca3af}.auth{max-width:420px;margin:10vh auto;padding:24px}.auth form,.auth label{display:flex;flex-direction:column;gap:12px}.auth input{padding:10px;font:inherit}.auth button{margin:12px 0}.logout{position:fixed;right:24px;bottom:48px;z-index:10}.characters{max-width:520px;margin:8vh auto;padding:24px}.characters ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:8px}.characters li{display:flex;align-items:center;gap:12px;padding:10px 12px;background:#1f2937;border-radius:6px}.characters form,.characters label{display:flex;flex-direction:column;gap:10px}.characters input,.characters select{padding:10px;font:inherit}.characters form button{margin:8px 0 0}.game{position:relative}.game .notice{position:absolute;top:56px;left:50%;transform:translate(-50%);background:#111827d9;border-radius:6px;z-index:5}.game header button{margin-left:0}.game header button:first-of-type{margin-left:auto}.hud{position:absolute;left:24px;bottom:56px;display:flex;flex-direction:column;gap:6px;width:280px;z-index:5;background:#111827cc;padding:10px 12px;border-radius:6px}.bar{position:relative;height:16px;background:#1f2937;border-radius:3px;overflow:hidden}.bar i{position:absolute;inset:0 auto 0 0;display:block}.bar.hp i{background:#dc2626}.bar.exp i{background:#2563eb}.bar span{position:relative;font-size:11px;padding-left:6px;line-height:16px}.combat-log{position:absolute;right:24px;bottom:56px;width:300px;list-style:none;margin:0;padding:8px 12px;font-size:12px;background:#111827b3;border-radius:6px;z-index:5}.combat-log:empty{display:none}.panel{position:absolute;right:24px;top:72px;width:320px;max-height:60vh;overflow:auto;background:#111827;border:1px solid #374151;border-radius:6px;padding:12px;z-index:6}.panel header{padding:0;display:flex;align-items:center}.panel h3{margin:0;font-size:15px}.panel ul{list-style:none;padding:0;margin:8px 0 0}.panel li{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid #1f2937;font-size:13px}.death{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0000008c;z-index:7}.death p{font-size:22px}.death button{margin:0}