*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background:#0d0d1f;color:#e0e0e0;font-family:monospace;overflow:hidden;height:100vh}:root{--panel-bg: rgba(10, 15, 40, .82);--panel-border: rgba(80, 110, 200, .35);--accent: #6090e0;--accent-dim: #3a5a9a;--text-dim: #8090b0;--might: #e06060;--supply: #60c060;--prosperity: #c0a030;--radius: 6px}.hidden{display:none!important}#lobby{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:1.25rem;padding:2rem}.lobby-title{font-size:2.2rem;letter-spacing:.25em;color:var(--accent);text-shadow:0 0 20px rgba(96,144,224,.4)}.lobby-subtitle{font-size:.8rem;color:var(--text-dim);letter-spacing:.1em}.lobby-card{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:1.5rem;width:100%;max-width:440px;display:flex;flex-direction:column;gap:.8rem}.lobby-card h2{font-size:.75rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.12em;margin-bottom:.2rem}.lobby-card input,.lobby-card select{background:#0f1e50cc;border:1px solid var(--panel-border);border-radius:var(--radius);color:#e0e0e0;font-family:monospace;font-size:.95rem;padding:.55rem .8rem;width:100%;transition:border-color .15s}.lobby-card input:focus,.lobby-card select:focus{outline:none;border-color:var(--accent)}.lobby-card input{text-transform:inherit}#input-code{text-transform:uppercase}.lobby-row{display:flex;gap:.5rem;align-items:stretch}.lobby-row input,.lobby-row select{flex:1}.btn{background:#0f1e50cc;border:1px solid var(--accent-dim);border-radius:var(--radius);color:var(--accent);cursor:pointer;font-family:monospace;font-size:.9rem;padding:.55rem 1.1rem;white-space:nowrap;transition:background .15s,border-color .15s;pointer-events:auto}.btn:hover{background:#2846a0b3;border-color:var(--accent)}.btn:disabled{opacity:.35;cursor:default}.btn-primary{background:#1e3c8ccc;border-color:var(--accent);color:#d0e8ff}.btn-primary:hover{background:#325ab4cc}#lobby-log{width:100%;max-width:440px;font-size:.72rem;color:var(--text-dim);max-height:120px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}.player-entry{padding:3px 0;font-size:.85rem}.player-entry.connected{color:#90d090}.player-entry.disconnected{color:var(--text-dim)}#game{position:fixed;top:0;right:0;bottom:0;left:0;display:none}#canvas-container{position:absolute;top:0;right:0;bottom:0;left:0}#hud{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;pointer-events:none}#hud-opponents{display:flex;gap:.5rem;padding:.6rem .8rem;background:linear-gradient(to bottom,rgba(0,0,0,.65) 0%,transparent 100%);pointer-events:auto}.opponent-panel{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);padding:.4rem .75rem;font-size:.75rem;display:flex;flex-direction:column;gap:2px;min-width:140px}.opponent-panel.active-turn{border-color:var(--accent)}.opponent-name{color:#c0d8ff;font-size:.8rem}.opponent-resources{color:var(--text-dim)}.opponent-resources .m{color:var(--might)}.opponent-resources .s{color:var(--supply)}.opponent-resources .p{color:var(--prosperity)}.opponent-cards{color:var(--text-dim);font-size:.7rem}#hud-spacer{flex:1}#hud-events{padding:.4rem .8rem;pointer-events:none}.events-label{font-size:.65rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.3rem}.events-row{display:flex;gap:.4rem;overflow-x:auto}.event-chip{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);padding:.3rem .6rem;font-size:.72rem;white-space:nowrap;flex-shrink:0}.event-chip.demand{border-color:#c8505080;color:#e09090}.event-chip.opportunity{border-color:#50c85080;color:#90d090}.events-inactive{font-size:.72rem;color:var(--text-dim);font-style:italic}#hud-bottom{background:linear-gradient(to top,rgba(0,0,0,.75) 0%,transparent 100%);padding:.5rem .8rem .6rem;pointer-events:none}#hud-status{display:flex;justify-content:space-between;align-items:center;font-size:.78rem;margin-bottom:.35rem}#hud-phase-label{color:var(--text-dim)}#hud-phase-label.my-turn{color:#a8d8a8}#hud-phase-label strong{color:#d0f0d0}#hud-resources-row{display:flex;gap:1rem;font-size:.82rem;margin-bottom:.35rem}.res-val{font-weight:700}.res-might{color:var(--might)}.res-supply{color:var(--supply)}.res-prosperity{color:var(--prosperity)}.res-label{color:var(--text-dim);font-size:.72rem}#hud-actions-row{display:flex;gap:.4rem;margin-bottom:.5rem;flex-wrap:wrap;align-items:center}.tile-type-btn{font-size:.75rem;padding:.3rem .6rem}.tile-type-btn.active{background:#2850a0e6;border-color:var(--accent);color:#d0e8ff}#card-hand-area{position:relative;height:160px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:4px;overflow:visible}.hand-empty-label{font-size:.75rem;color:var(--text-dim);font-style:italic;padding-bottom:1rem}.game-card{position:absolute;width:90px;height:130px;background:linear-gradient(160deg,#14235af2,#0a1232f2);border:1px solid var(--panel-border);border-radius:var(--radius);display:flex;flex-direction:column;padding:.45rem;cursor:pointer;transform-origin:bottom center;transition:transform .18s ease,box-shadow .18s ease,border-color .15s;-webkit-user-select:none;user-select:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:auto}.game-card:hover{border-color:var(--accent);box-shadow:0 -4px 20px #6090e04d}.game-card.selected{border-color:#90e090;box-shadow:0 -4px 24px #50dc5066}.card-name{font-size:.68rem;color:#c0d8ff;font-weight:700;margin-bottom:.2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-type{font-size:.58rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;margin-bottom:auto}.card-body{font-size:.6rem;color:#a0b4d0;line-height:1.3}