*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#0b0806;color:#f3e6c8;font-family:Georgia,"Times New Roman",serif}
#app{position:fixed;inset:0}
#loading{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0b0806;z-index:50;font-size:18px;transition:opacity .6s}
#loading .crest{font-size:64px;color:#d4af37;animation:p 1.4s infinite}@keyframes p{50%{opacity:.4}}
#hud{position:fixed;top:10px;left:12px;z-index:10;max-width:min(560px,92vw);pointer-events:none}
#hud h1{margin:0;font-size:clamp(22px,4vw,34px);color:#f1c75b;text-shadow:0 2px 8px #000;letter-spacing:2px}
#sub{font-size:12px;opacity:.85;text-shadow:0 1px 3px #000}
#hud .btns{margin-top:6px;pointer-events:auto}
button{background:#3a2716cc;color:#f3e6c8;border:1px solid #b8893a;border-radius:6px;padding:6px 10px;font:inherit;font-size:14px;cursor:pointer}
button:hover{background:#5a3b1f}
#legend{font-size:11px;margin-top:6px;text-shadow:0 1px 2px #000}
.g{display:inline-block;width:9px;height:9px;border-radius:50%;margin:0 3px 0 8px;vertical-align:middle}
.g.active{background:#3ddc62;box-shadow:0 0 6px #3ddc62}.g.waiting{background:#ffb627;box-shadow:0 0 6px #ffb627}.g.problem{background:#ff4040;box-shadow:0 0 6px #ff4040}.g.idle{background:#9a9a9a}
#credit{position:fixed;bottom:4px;right:8px;font-size:10px;opacity:.55;z-index:5}
.label{pointer-events:auto;cursor:pointer;text-align:center;transform:translateY(-6px)}
.tag{display:inline-flex;align-items:center;gap:5px;background:#120c08d9;border:1px solid var(--c);border-radius:12px;padding:2px 8px;font-size:12px;white-space:nowrap;color:#f7ecd2}
.tag .g{margin:0;width:10px;height:10px;transform:rotate(45deg);border-radius:2px}
.tag.king{border-color:#f1c75b;color:#f1c75b;font-weight:bold}
.bubble{max-width:200px;margin:0 auto 6px;background:#fbf3df;color:#2a1c10;border-radius:10px;padding:5px 8px;font-size:11px;line-height:1.25;position:relative;opacity:0;transition:opacity .6s;box-shadow:0 2px 8px #0008;white-space:normal;text-align:left}
.bubble.on{opacity:.96}.bubble:after{content:"";position:absolute;bottom:-6px;left:50%;margin-left:-6px;border:6px solid transparent;border-bottom:0;border-top-color:#fbf3df}
.far .bubble{display:none}
#panel{position:fixed;top:0;right:0;bottom:0;width:min(400px,100vw);background:linear-gradient(#21160dee,#120c07f2);border-left:2px solid #b8893a;z-index:20;padding:16px 18px;overflow:auto;transition:transform .35s}
#panel.hidden{transform:translateX(105%)}
#panel h2{margin:0 0 2px;color:var(--c,#f1c75b)}#panel .st{font-size:13px;margin-bottom:10px}
#panel dl{margin:0}#panel dt{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#c9a35a;margin-top:10px}#panel dd{margin:2px 0 0;font-size:14px;line-height:1.35}
#panel ul{margin:2px 0;padding-left:18px;font-size:14px}
.close{position:absolute;top:8px;right:8px;padding:2px 8px}
#board{position:fixed;inset:4vh 4vw;background:#1b120bf2;border:2px solid #b8893a;border-radius:10px;z-index:30;padding:14px 18px;overflow:auto;box-shadow:0 0 40px #000}
#board.hidden,.hidden{display:none}
#board h2{margin:0 0 8px;color:#f1c75b}#board h3{color:#f1c75b;margin:8px 0 6px;font-size:16px}
.boardGrid{display:grid;grid-template-columns:2fr 1fr;gap:18px}@media(max-width:760px){.boardGrid{grid-template-columns:1fr}}
select{background:#2b1d11;color:#f3e6c8;border:1px solid #b8893a;border-radius:5px;padding:4px;font:inherit}
.msg{border-left:3px solid var(--c,#b8893a);background:#2a1d12aa;margin:8px 0;padding:6px 10px;border-radius:0 6px 6px 0;font-size:13px;line-height:1.35}
.msg .h{font-size:11px;color:#c9a35a;margin-bottom:2px}
#decisions{padding-left:18px;font-size:14px}#decisions li{margin-bottom:6px}#decisions small{display:block;opacity:.7}
#castle{font-size:13px;opacity:.9}
#enterBtn,#enterMute{margin-top:14px;font-size:18px;padding:10px 18px}#enterMute{font-size:13px;opacity:.8}#vol{vertical-align:middle;width:90px;accent-color:#d4af37}.speaking .tag{box-shadow:0 0 12px var(--c);transform:scale(1.12)}.msg button{font-size:11px;padding:1px 6px;float:right}
#ask{position:fixed;right:2vw;top:12vh;width:min(440px,94vw);background:#1b120bf2;border:2px solid #b8893a;border-radius:10px;z-index:35;padding:14px 18px;box-shadow:0 0 40px #000;color:#f3e6c8}
#ask h2{margin:0 0 8px;color:#f1c75b}#ask textarea{width:100%;box-sizing:border-box;margin:8px 0;background:#0e0905;color:#f3e6c8;border:1px solid #b8893a;border-radius:6px;padding:8px;font:inherit}
#ask.hidden{display:none}#askMsg{margin-top:6px;color:#f1c75b}.msg.pending{opacity:.85;border-style:dashed}