*{box-sizing:border-box}html,body{margin:0;overflow-x:hidden;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#111827;color:#e5e7eb}.lobby{max-width:640px;margin:60px auto;padding:24px}.lobby section{margin:24px 0;padding:16px;border:1px solid #374151;border-radius:8px}.lobby input{padding:8px;margin-right:8px;width:220px}.app-grid{display:grid;gap:12px;padding:10px;grid-template-columns:1fr;grid-template-areas:"header" "roomturn" "board" "actions" "feedback" "selected" "deploy" "log"}.app-header{grid-area:header;font-size:13px;font-weight:600;color:#e5e7eb;padding:4px 2px}.panel-room-turn{grid-area:roomturn}.panel-board{grid-area:board;min-width:0}.panel-actions{grid-area:actions}.panel-feedback{grid-area:feedback}.panel-selected{grid-area:selected}.panel-deploy{grid-area:deploy}.panel-log{grid-area:log}.panel-room-turn,.panel-actions,.panel-feedback,.panel-selected,.panel-deploy,.panel-log{display:flex;flex-direction:column;gap:12px;min-width:0}@media (min-width: 700px) and (orientation: landscape) and (max-width: 1024px){.app-grid{grid-template-columns:minmax(0,1fr) 280px;grid-template-areas:"board     roomturn" "board     actions" "board     selected" "deploy    feedback" "deploy    log"}.app-header{display:none}}@media (min-width: 1025px){.app-grid{gap:16px;padding:16px;grid-template-columns:1fr 340px;grid-template-areas:"board     roomturn" "board     actions" "board     selected" "deploy    feedback" "deploy    log"}.app-header{display:none}.panel-actions .turn-controls{background:transparent;padding:0;margin-top:-4px}}.board{width:min(100%,calc(100vw - 20px));max-width:760px;margin:0 auto;aspect-ratio:1 / 1;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;touch-action:manipulation;user-select:none;-webkit-user-select:none}.board-grid{display:grid;grid-template-columns:minmax(16px,7%) repeat(12,minmax(18px,1fr));grid-template-rows:minmax(16px,7%) repeat(12,minmax(18px,1fr));width:100%;height:100%;min-width:251px;min-height:251px;gap:1px;background:#1f2937;padding:3px;border-radius:6px}.corner,.col-head,.row-head{display:flex;align-items:center;justify-content:center;font-size:clamp(7px,1.8vw,12px);color:#9ca3af}.cell{position:relative;background:#0f172a;border:1px solid #1f2937;min-height:0;min-width:0;padding:1px;cursor:pointer;font-size:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.cell:hover{background:#1e293b}.cell.tree{background:#14532d}.cell.loading-zone{outline:1px dashed #f97316;outline-offset:-2px;background:#4b5563}.cell.airstrip{outline:1px dashed #38bdf8;outline-offset:-2px}.cell.legal-move{background:#14532d55;box-shadow:inset 0 0 0 2px #22c55e}.cell.legal-target{box-shadow:inset 0 0 0 2px #ef4444}.cell.selected{box-shadow:inset 0 0 0 2px #facc15}@keyframes combat-flash-white{0%,to{box-shadow:inset 0 0 0 3px #fff;background:#fff3}50%{box-shadow:inset 0 0 0 3px #fffa;background:transparent}}@keyframes combat-flash-red{0%,to{box-shadow:inset 0 0 0 3px #ef4444;background:#ef444455}50%{box-shadow:inset 0 0 0 3px #ef4444aa;background:transparent}}@keyframes combat-flash-amber{0%,to{box-shadow:inset 0 0 0 3px #f59e0b;background:#f59e0b55}50%{box-shadow:inset 0 0 0 3px #f59e0baa;background:transparent}}@keyframes combat-flash-grey{0%,to{box-shadow:inset 0 0 0 3px #9ca3af;background:#9ca3af44}50%{box-shadow:inset 0 0 0 3px #9ca3afaa;background:transparent}}@keyframes combat-flash-blue{0%,to{box-shadow:inset 0 0 0 3px #3b82f6;background:#3b82f655}50%{box-shadow:inset 0 0 0 3px #3b82f6aa;background:transparent}}@keyframes ammo-pulse{0%,to{transform:scale(1);font-weight:400}50%{transform:scale(1.35);font-weight:800}}.cell.combat-attacker{animation:combat-flash-white .4s ease-in-out 3;z-index:1}.cell.combat-destroyed{animation:combat-flash-red .4s ease-in-out 3;z-index:1}.cell.combat-secured{animation:combat-flash-amber .4s ease-in-out 3;z-index:1}.cell.combat-no-effect{animation:combat-flash-grey .4s ease-in-out 3;z-index:1}.cell.combat-protector{animation:combat-flash-blue .4s ease-in-out 3;z-index:1}.cell-ammo.ammo-changed{display:inline-block;animation:ammo-pulse .4s ease-in-out 3}.board-token{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;width:90%;height:90%;border-radius:18%;background:#166534;border:1px solid #bbf7d0;color:#fff;font-size:clamp(5px,2vw,8px);font-weight:700;letter-spacing:.02em;text-align:center;overflow:hidden}.board-token.destroyed{opacity:.35;text-decoration:line-through}.tree-icon{width:clamp(7px,3.4vw,16px);height:clamp(7px,3.4vw,16px);flex-shrink:0}.cell-unit-circle{display:flex;flex-direction:column;align-items:center;justify-content:center;width:92%;height:92%;border-radius:50%;line-height:1.05;text-align:center;overflow:hidden}.cell-unit-circle.owner-player1{background:#000;border:2px solid #ffffff;color:#fff}.cell-unit-circle.owner-player2{background:#fff;border:2px solid #000000;color:#000}.cell-unit-abbr{font-size:clamp(5px,2.1vw,9px);font-weight:800}.cell-ammo{font-size:clamp(5px,1.8vw,8px);font-weight:400;opacity:.85}.board-legend{font-size:12px;color:#9ca3af;margin-top:8px}.panel-room-turn section,.panel-actions section,.panel-selected section,.panel-log section,.panel-deploy .deploy-panel,.panel-deploy .pid-prompt{background:#1f2937;border-radius:8px;padding:12px}.panel-room-turn h3,.panel-selected h3,.panel-log summary{margin:0 0 8px;font-size:13px;text-transform:uppercase;color:#9ca3af}.panel-log summary{cursor:pointer;list-style:none}.panel-log summary::-webkit-details-marker{display:none}.panel-log summary:before{content:"▸ ";display:inline-block;transition:transform .15s ease}.panel-log details[open] summary:before{transform:rotate(90deg)}.turn-controls{background:#1f2937;border-radius:8px;padding:12px}.invite-row{display:flex;gap:4px;margin:6px 0}.invite-row input{flex:1;min-width:0}.hint{color:#9ca3af;font-size:12px}.button-row{display:flex;gap:8px;margin-top:8px}button{cursor:pointer;border:1px solid #374151;background:#374151;color:#e5e7eb;padding:6px 10px;border-radius:4px}button:disabled{opacity:.4;cursor:not-allowed}button:hover:not(:disabled){background:#4b5563}.error-box{background:#7f1d1d;color:#fecaca;padding:8px;border-radius:6px}.message-box{background:#14532d;color:#bbf7d0;padding:8px;border-radius:6px}.winner-banner{font-size:18px;font-weight:700;color:#facc15}.action-log{max-height:240px;overflow-y:auto;font-size:12px;display:flex;flex-direction:column-reverse;gap:4px}.log-line{border-bottom:1px solid #374151;padding-bottom:4px}.deploy-panel{margin-top:16px;background:#1f2937;border-radius:8px;padding:16px}.deploy-panel label{display:block;margin:8px 0;font-size:13px}.deploy-panel input,.deploy-panel select{display:block;margin-top:4px;padding:6px;width:100%}.deploy-row{display:flex;gap:8px;align-items:center;margin:6px 0}.deploy-row select,.deploy-row input{flex:1}.deploy-toggle{margin-top:12px}.pid-prompt{margin-top:16px;background:#422006;border:1px solid #eab308;border-radius:8px;padding:16px}@media (max-width: 768px){button{min-height:44px;padding:10px 14px;font-size:14px;touch-action:manipulation}input,select,textarea{font-size:16px;min-height:40px}.button-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.button-row button{width:100%}.deploy-row{flex-direction:column;align-items:stretch}.deploy-row select,.deploy-row input,.deploy-row button{width:100%}.action-log{max-height:220px}.lobby{margin:24px auto;padding:16px}.lobby input{width:100%;margin-right:0;margin-bottom:8px}}@media (max-width: 420px){.app-grid{gap:8px;padding:6px}.action-log{max-height:200px}button{padding:10px 8px;font-size:13px}}.auth-panel{width:min(440px,calc(100% - 32px));margin:64px auto;padding:32px;background:linear-gradient(180deg,#121a26fa,#090e16fa);border:1px solid rgba(255,255,255,.1);border-radius:18px;box-shadow:0 24px 70px #00000073}.auth-brand{text-align:center;margin-bottom:28px}.auth-logo{display:block;width:min(300px,86%);height:auto;margin:0 auto 14px}.auth-brand p{margin:0;color:#aeb8c6;font-size:14px;line-height:1.5}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:24px;padding:5px;background:#ffffff0d;border-radius:10px}.auth-tabs button{border:0;background:transparent;color:#9ca8b8;border-radius:7px;font-weight:700}.auth-tabs button.active{background:#fff;color:#111827}.auth-panel form{display:grid;gap:18px}.auth-panel label{display:grid;gap:7px;color:#dbe3ec;font-size:13px;font-weight:700}.auth-panel input{width:100%;box-sizing:border-box;padding:12px 13px;color:#fff;background:#0c131d;border:1px solid #344152;border-radius:9px;outline:none}.auth-panel input:focus{border-color:#e6392f;box-shadow:0 0 0 3px #e6392f2e}.auth-panel form>button{width:100%;margin-top:4px;padding:13px 18px;border:0;border-radius:9px;background:#e6392f;color:#fff;font-weight:800;letter-spacing:.02em;cursor:pointer}.auth-panel form>button:hover:not(:disabled){background:#f04439}.auth-panel form>button:disabled{opacity:.65;cursor:wait}.auth-panel .error-box{margin-top:18px}@media (max-width: 520px){.auth-panel{margin:28px auto;padding:24px 18px;border-radius:14px}.auth-logo{width:min(260px,90%)}}