*{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%;font-family:Segoe UI,sans-serif;background:#0e1116;color:#eef3ff}#uiRoot{display:grid;grid-template-rows:auto auto 1fr;width:100%;height:100%}.topbar{padding:10px 14px;border-bottom:1px solid #2a3244;background:#111726}.topbar h1{margin:0 0 8px;font-size:18px}.statusRow{display:flex;gap:10px;flex-wrap:wrap;font-size:13px}.statusRow span{padding:4px 8px;border-radius:9999px;background:#1a2234}.lobbyPanel{display:grid;grid-template-columns:repeat(3,minmax(0,220px)) auto;gap:8px 10px;align-items:end;padding:10px 14px;border-bottom:1px solid #2a3244;background:#111726}.fieldGroup{display:grid;gap:4px}.fieldGroup label{font-size:12px;color:#bdd0ff}.fieldGroup input{width:100%;padding:8px 10px;border:1px solid #34415d;border-radius:8px;background:#111826;color:#eef3ff}.fieldGroup input[type=range]{padding:0;height:28px;accent-color:#4c8bff}.volumeGroup{min-width:180px}.btnRow{display:flex;gap:8px}.participantsBox{display:grid;gap:4px;min-width:220px}#participantsTitle{font-size:12px;color:#bdd0ff}#participantsList{min-height:36px;padding:8px 10px;border:1px solid #34415d;border-radius:8px;background:#111826;color:#d8e4ff;font-size:12px;line-height:1.5}button{padding:8px 12px;border:1px solid #3c4c71;border-radius:8px;background:#1d2b47;color:#eef3ff;cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}#lobbyMessage{grid-column:1 / -1;margin:0;font-size:13px;color:#9bb0e4}.gameWrap{position:relative;min-height:0;padding:8px}#gameCanvas{width:100%;height:100%;display:block;background:#0d1321;border:1px solid #25304a;border-radius:8px}.soundIndicator{position:absolute;right:20px;top:20px;padding:8px 12px;border-radius:8px;font-weight:700;background:#ffaa00e6;color:#231700}.itemHud{position:absolute;left:16px;bottom:16px;display:grid;gap:6px;padding:10px 12px;border-radius:10px;border:1px solid #34415d;background:#0a101ce0;min-width:180px}.itemHudLabel{font-size:12px;color:#bdd0ff}.itemStack{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-height:40px}.itemStackEmpty{font-size:12px;color:#7f92bf}.itemSlot{width:40px;height:40px;border-radius:8px;border:1px solid #4a5f8d;background:#141d31;display:grid;place-items:center}.itemSlot canvas{display:block}.hidden{display:none}