:root{color:#1c211b;background:#e8ece2;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}body{margin:0;min-width:320px;min-height:100vh}.appShell{align-items:start;display:grid;gap:28px;grid-template-columns:minmax(280px,420px) minmax(520px,1fr);min-height:100vh;padding:32px}.statusPanel{max-width:760px}.eyebrow{color:#58633e;font-size:.82rem;font-weight:700;letter-spacing:0;margin:0 0 12px;text-transform:uppercase}h1{font-size:clamp(3rem,5rem,6.5rem);line-height:.92;margin:0}.summary{font-size:1.15rem;line-height:1.55;max-width:680px}.facts{display:grid;gap:1px;grid-template-columns:repeat(3,minmax(0,1fr));margin:28px 0;max-width:620px}.facts div{background:#f8faf5;border:1px solid #cbd4bd;padding:16px}.facts dt{color:#56614d;font-size:.78rem;font-weight:700;margin-bottom:8px;text-transform:uppercase}.facts dd{font-size:1.25rem;font-weight:800;margin:0}.identity{border-left:4px solid #65744a;font-weight:700;margin:0;padding:10px 14px}.identity.denied{border-color:#a33c2f}.identity.ready{border-color:#28705a}.lobbyPanel{border-top:1px solid #cbd4bd;display:grid;gap:16px;margin-top:28px;max-width:760px;padding-top:24px}.lobbyPanelHeader{align-items:center;display:flex;justify-content:space-between}.lobbyPanelHeader .eyebrow{margin:0}.forms{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}.roomForm{background:#f8faf5;border:1px solid #cbd4bd;gap:10px;padding:14px}.roomForm h2{font-size:1rem;margin:0}form{display:grid;gap:8px}label{color:#56614d;font-size:.78rem;font-weight:700;text-transform:uppercase}input{background:#f8faf5;border:1px solid #b8c5a8;color:#1c211b;font:inherit;min-height:42px;padding:0 12px}input::placeholder{color:#77846d}select{background:#f8faf5;border:1px solid #b8c5a8;color:#1c211b;font:inherit;min-height:42px;padding:0 12px}button{background:#25351e;border:0;color:#f8faf5;cursor:pointer;font:inherit;font-weight:800;min-height:42px;padding:0 14px}.notice{background:#f8faf5;border:1px solid #cbd4bd;font-weight:700;margin:0;padding:12px 14px}.roomsHeader{align-items:center;border-bottom:1px solid #cbd4bd;display:flex;gap:12px;justify-content:space-between;padding-bottom:8px}.roomsHeader h2{font-size:1.05rem;margin:0}.roomsHeader span{color:#56614d;font-size:.82rem;font-weight:800;text-transform:uppercase}.rooms{display:grid;gap:12px}.room{background:#f8faf5;border:1px solid #cbd4bd;display:grid;gap:14px;grid-template-columns:minmax(0,1fr);padding:16px}.room.selected{border-color:#28705a;box-shadow:inset 4px 0 #28705a}.roomHeader{align-items:flex-start;display:flex;gap:12px;justify-content:space-between}.roomMain{display:grid;gap:8px;min-width:0}.roomMain h3{font-size:1.1rem;line-height:1.2;margin:0;overflow-wrap:anywhere}.room p{margin:0}.roomMeta{display:flex;flex-wrap:wrap;gap:8px}.roomMeta span{background:#e8ece2;border:1px solid #cbd4bd;color:#394531;font-size:.82rem;font-weight:800;padding:5px 8px;text-transform:uppercase}.roomActions{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(86px,1fr))}.roomActions button{min-width:0}.roomIdLine{color:#56614d;display:grid;font-size:.78rem;font-weight:700;gap:6px;grid-column:1 / -1;text-transform:uppercase}.roomId{background:#e8ece2;border:1px solid #cbd4bd;color:#394531;font-family:ui-monospace,Cascadia Mono,Segoe UI Mono,monospace;font-size:.82rem;font-weight:400;max-width:100%;overflow:hidden;padding:6px 8px;text-overflow:ellipsis;text-transform:none;white-space:nowrap}.lobbyInfoPanel{border-top:1px solid #cbd4bd;display:grid;gap:12px;margin-top:24px;padding-top:18px}.onlineSummary{align-items:baseline;background:#f8faf5;border:1px solid #cbd4bd;display:flex;gap:10px;padding:12px}.onlineSummary strong{font-size:1.6rem}.presenceGrid{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.presenceGrid section{background:#f8faf5;border:1px solid #cbd4bd;display:grid;gap:8px;padding:12px}.presenceGrid h2{font-size:1rem;margin:0}.presenceGrid p{margin:0}.presenceList{display:grid;gap:8px;list-style:none;margin:0;padding:0}.presenceList li{display:grid;gap:2px;min-width:0}.presenceList span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.presenceList small{color:#56614d;font-weight:700;text-transform:uppercase}.globalChatPanel,.coordinationPanel{border-top:1px solid #cbd4bd;display:grid;gap:12px;margin-top:24px;padding-top:18px}.coordinationHeader{align-items:center;display:flex;gap:16px;justify-content:space-between}.coordinationHeader h2{font-size:1.25rem;margin:0}.readyLine{font-weight:700;margin:0}.messages{background:#f8faf5;border:1px solid #cbd4bd;display:grid;gap:8px;max-height:220px;overflow-y:auto;padding:10px}.message{border-bottom:1px solid #dfe5d6;display:grid;gap:4px;padding-bottom:8px}.message:last-child{border-bottom:0;padding-bottom:0}.message p{display:flex;gap:10px;justify-content:space-between;line-height:1.35;margin:0}.message time{color:#56614d;font-size:.78rem}.messageForm{grid-template-columns:minmax(0,1fr) auto}.messageForm label{grid-column:1 / -1}.gamePanel{align-self:stretch;display:grid;gap:16px}.gameHeader{align-items:center;border-bottom:1px solid #cbd4bd;display:flex;justify-content:space-between;padding-bottom:12px}.gameHeader h2{font-size:1.4rem;margin:0;text-transform:capitalize}.board{aspect-ratio:1;background:#f8faf5;border:1px solid #aeba9b;box-sizing:border-box;max-height:min(68vh,760px);width:100%}.boardGround{fill:#d9dfcf}.terrain{stroke:#49513b;stroke-width:.12}.terrain.normal{fill:#b9c8a5}.terrain.difficult{fill:#8f9a68}.terrain.dangerous{fill:#b05a3d}.tank{fill:#315b4d;rx:.2;stroke:#16231e;stroke-width:.12}.tank.active{fill:#d6a63f}.turret{stroke:#16231e;stroke-linecap:round;stroke-width:.28}.commandGrid{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}.commandForm{background:#f8faf5;border:1px solid #cbd4bd;gap:10px;padding:12px}.commandForm h3{font-size:.95rem;margin:0}.commandForm p{line-height:1.35;margin:0}.commandForm label{display:grid;gap:6px}@media(max-width:640px){.appShell{align-items:flex-start;grid-template-columns:1fr;padding:24px 18px}.facts,.forms,.room{grid-template-columns:1fr}.roomActions button{flex:1 1 88px}.coordinationHeader{align-items:stretch;flex-direction:column}.messageForm,.presenceGrid,.commandGrid{grid-template-columns:1fr}}@media(min-width:641px)and (max-width:1100px){.appShell{grid-template-columns:1fr}.commandGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}