:root{--ui: 1;--bg: #17140f;--panel: rgba(32, 26, 19, .94);--ink: #f4ecdf;--muted: #d7c6b0;--line: #6d5a44;--accent: #e09a3c;--accent-ink: #2a1c0c;--oil: #2c3136;--danger: #c4512c;--ok: #d7e2ad;color:var(--ink);background:var(--bg);font-family:Segoe UI,PT Sans,sans-serif;font-size:calc(16px * var(--ui))}*{box-sizing:border-box}html,body,#app{margin:0;height:100%;background:var(--bg);color:var(--ink)}body{overflow:hidden}button,input,select,textarea{font:inherit;color:var(--ink);background:#3a3126;border:1px solid var(--line);border-radius:4px;min-height:2.4rem;padding:.35rem .6rem}button{cursor:pointer}button.primary{background:var(--accent);color:var(--accent-ink);font-weight:700}button.ghost{background:transparent}button:disabled{opacity:.55;cursor:not-allowed}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}#canvas-host{position:absolute;top:0;right:0;bottom:0;left:0}#canvas-host canvas{width:100%;height:100%;display:block}#ui{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}#ui .panel,#ui .overlay,#ui .dock,#ui .banner,#hud button,#hud input,#bar button{pointer-events:auto}.hidden{display:none!important}.panel,.overlay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(44rem,calc(100% - 1.5rem));max-height:calc(100% - 1.5rem);overflow:auto;background:var(--panel);border:1px solid var(--line);box-shadow:0 16px 40px #00000059;padding:1rem 1.1rem 1.2rem}h1,h2,h3{margin:0 0 .6rem;font-weight:650}h1{font-size:2rem;letter-spacing:.04em}#about{max-width:40rem;margin:1.5rem auto;padding:0 1rem 2rem}#about h2,#about h3{margin-top:1rem}p{margin:.35rem 0;line-height:1.35}.muted{color:var(--muted)}.warn{color:var(--danger);font-weight:650}.stack{display:flex;flex-direction:column;gap:.45rem}.row{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center}.actions{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.6rem}label.field{display:flex;flex-direction:column;gap:.2rem}label.field span{color:var(--muted)}.grow{flex:1 1 12rem}.room{border:1px solid var(--line);padding:.55rem .7rem;margin:.45rem 0;background:#14100c73}#hud{position:absolute;top:0;right:0;bottom:0;left:0;padding:.6rem;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}.hud-card{background:#17140fc7;border:1px solid var(--line);padding:.35rem .55rem;max-width:min(42rem,94vw);line-height:1.35}.top-row,.mid-row{display:flex;justify-content:space-between;gap:.5rem;align-items:flex-start}#crosshair{position:absolute;left:50%;top:50%;width:1.15rem;height:1.15rem;transform:translate(-50%,-50%)}#crosshair:before,#crosshair:after{content:"";position:absolute;background:#f4ecdf}#crosshair:before{left:.52rem;top:0;width:2px;height:1.15rem}#crosshair:after{top:.52rem;left:0;height:2px;width:1.15rem}.dock{position:absolute;left:.6rem;bottom:.6rem;width:min(28rem,calc(100% - 1.2rem));display:flex;flex-direction:column;gap:.35rem}#chat-log{max-height:9rem;overflow:auto;background:#17140fb8;border:1px solid var(--line);padding:.35rem .5rem}.chat-who{font-weight:700}#map-panel,#inspect,#roster{position:absolute;right:.6rem;top:4.2rem;width:min(22rem,calc(100% - 1.2rem));max-height:calc(100% - 8rem);overflow:auto;background:var(--panel);border:1px solid var(--line);padding:.6rem .7rem;pointer-events:auto}.banner{position:absolute;left:50%;top:18%;transform:translate(-50%);width:min(32rem,calc(100% - 1.5rem));background:var(--panel);border:1px solid var(--danger);padding:.8rem 1rem}#bar{position:absolute;right:.6rem;bottom:.6rem;display:flex;gap:.35rem;pointer-events:none}#toast{position:absolute;left:50%;bottom:5.5rem;transform:translate(-50%);background:#17140fe0;border:1px solid var(--line);padding:.35rem .7rem;max-width:min(36rem,92vw);pointer-events:none}.key-row{display:flex;justify-content:space-between;gap:.5rem;align-items:center}@media(max-width:820px){.actions{grid-template-columns:1fr}h1{font-size:1.6rem}}