:root{color-scheme:dark;--bg: #0b1c1c;--panel: #123030;--line: #1f4a46;--text: #e9f3ef;--muted: #88a8a1;--sand: #d8bf87;--sand-dark: #b99e67;--jungle: #2f6b45;--danger: #8f3b2e;--gold: #e2b64f;--online: #4f9a58;--offline: #c8443a}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;min-height:100vh;background:radial-gradient(circle at 20% 0%,#164040,var(--bg) 60%);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif}button,input,select{font:inherit}.app{max-width:1180px;margin:0 auto;padding:20px}.shell{display:flex;flex-direction:column;min-height:100%;max-width:520px;width:100%;margin:0 auto;padding:0}.shell-content{flex:1 1 auto;overflow-y:auto;overflow-x:hidden;padding:16px 16px 80px;min-width:0;width:100%}@media(min-width:480px){.shell{max-width:1180px}.shell-content{padding:24px 24px 96px}}.topbar,.game-header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px;flex-wrap:wrap}.eyebrow{margin:0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}h1,h2{margin:4px 0 0;font-size:clamp(24px,5vw,36px);letter-spacing:.04em}h2{font-size:clamp(20px,4vw,28px)}.turn{display:flex;align-items:baseline;gap:8px;font-size:14px;flex-wrap:wrap}.muted{color:var(--muted)}.layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:20px;align-items:start}@media(max-width:860px){.layout{grid-template-columns:1fr}}.board{position:relative;display:grid;gap:2px;padding:8px;border-radius:16px;background:linear-gradient(160deg,#0e2b2b,#082020);border:1px solid var(--line);box-shadow:0 24px 60px #00000059}.cell{position:relative;border:0;border-radius:6px;padding:0;cursor:pointer;font-size:clamp(8px,1.1vw,12px);color:#1c2a24;background:var(--sand);background-size:cover;background-position:center;transition:transform .08s ease,filter .08s ease}.cell:hover{filter:brightness(1.12);transform:translateY(-1px)}.cell.empty{background:var(--sand)}.cell.sand{background:linear-gradient(145deg,var(--sand),var(--sand-dark))}.cell.closed{background:repeating-linear-gradient(45deg,#163333,#163333 6px,#1a3b3a 6px,#1a3b3a 12px);color:var(--muted)}.cell.closed.peeked{outline:1px dashed var(--gold)}.cell.arrow{background:linear-gradient(145deg,#cbb27a,#a98d57)}.cell.jungle{background:linear-gradient(145deg,#3d7f52,var(--jungle));color:#e6f5e9}.cell.mountain{background:linear-gradient(145deg,#7a7264,#575146);color:#f0ece4}.cell.danger{background:linear-gradient(145deg,#b0523f,var(--danger));color:#ffe9e3}.cell.fort{background:linear-gradient(145deg,#5d6b78,#39444d);color:#eef4f8}.cell.treasure{background:linear-gradient(145deg,#f0cd6d,#c79a33);color:#3a2a07}.cell.tech{background:linear-gradient(145deg,#6f8fa8,#456179);color:#eaf4ff}.cell.rum{background:linear-gradient(145deg,#9a6a3f,#6d4626);color:#ffe7cf}.cell.odd{background:linear-gradient(145deg,#8a6f9c,#5d4a6b);color:#f3e9ff}.cell.selected{outline:2px solid var(--gold);outline-offset:1px}.cell:focus-visible{outline:3px solid var(--gold);outline-offset:2px;z-index:1;box-shadow:0 0 0 4px #e2b64f40}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.tile-label{position:absolute;top:2px;right:2px;bottom:2px;left:2px;overflow:hidden;text-align:left;line-height:1;opacity:.65;pointer-events:none}.unit{position:absolute;right:1px;bottom:1px;width:55%;height:55%;border-radius:50%;display:grid;place-items:center;font-size:9px;color:#10201b;background:#0000002e;border:2px solid rgba(255,255,255,.9);overflow:hidden}.unit img{width:100%;height:100%;object-fit:contain}.unit b{position:absolute;right:0;bottom:0;background:#10201b;color:#fff;border-radius:4px;padding:0 2px;font-size:8px}.loot{position:absolute;left:2px;bottom:2px;color:#5a3d00;font-size:10px}.ship{position:relative;display:grid;place-items:center;background:transparent!important;pointer-events:none}.ship img{width:92%;height:92%;object-fit:contain;filter:drop-shadow(0 2px 3px rgba(0,0,0,.5))}.ship-dot{position:absolute;top:2px;right:2px;width:8px;height:8px;border-radius:50%;border:1px solid rgba(0,0,0,.5);background:#fff}.team-t1{background:#f4f4f4}.team-t2{background:#f3d34a}.team-t3{background:#3d3d3d;color:#fff}.team-t4{background:#c8443a;color:#fff}.team-t5{background:#4f9a58;color:#fff}.team-t6{background:#4b7fc4;color:#fff}.ship.team-t1 .ship-dot,.unit.team-t1{border-color:#f4f4f4}.ship.team-t2 .ship-dot,.unit.team-t2{border-color:#f3d34a}.ship.team-t3 .ship-dot,.unit.team-t3{border-color:#3d3d3d}.ship.team-t4 .ship-dot,.unit.team-t4{border-color:#c8443a}.ship.team-t5 .ship-dot,.unit.team-t5{border-color:#4f9a58}.ship.team-t6 .ship-dot,.unit.team-t6{border-color:#4b7fc4}.panel,.lobby-card,.settings-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px}.panel h2{margin:18px 0 8px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.panel h2:first-child{margin-top:0}.teams{list-style:none;margin:0;padding:0;display:grid;gap:6px}.teams li{display:grid;grid-template-columns:1fr auto;gap:2px 8px;padding:8px 10px;border-radius:10px;background:#ffffff08;font-size:13px}.teams li span:last-child{grid-column:2;color:var(--muted);font-size:11px}.teams li.active{outline:1px solid var(--gold)}.cell-info{font-size:14px;line-height:1.5}.actions,.pending-cells{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}.actions code{background:#ffffff12;border-radius:6px;padding:3px 6px;font-size:11px}.actions button,.ghost,.pending-cells button{background:#ffffff14;color:inherit;border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:12px;cursor:pointer}.actions button:hover,.ghost:hover,.pending-cells button:hover{border-color:var(--gold)}.actions button:disabled{opacity:.5;cursor:default}.styles{display:inline-flex;gap:4px;margin-left:8px}.ghost.active{border-color:var(--gold);color:var(--gold)}.error{margin:0 0 12px;padding:10px 12px;border-radius:10px;background:#8f3b2e59;border:1px solid var(--danger)}.error-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px;padding:10px 12px;border-radius:10px;background:#8f3b2e59;border:1px solid var(--danger)}.pending{padding:8px 10px;border-radius:8px;background:#e2b64f29;border:1px dashed var(--gold);font-size:13px}.pending-panel{margin-top:8px}.pending-panel p{margin:0 0 6px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:8px;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:#0b1c1cf2;border-top:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:10}.bottom-nav button{flex:1 1 80px;max-width:120px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 8px;background:transparent;color:var(--muted);border:1px solid transparent;border-radius:12px;font-size:12px;cursor:pointer}.bottom-nav button.active{color:var(--gold);background:#e2b64f1f;border-color:#e2b64f59}.bottom-nav button span:first-child{font-size:18px;line-height:1}.connection-badge{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;font-size:10px;background:#ffffff14}.connection-badge.online{color:var(--online)}.connection-badge.connecting{color:var(--gold)}.connection-badge.offline{color:var(--offline)}.lobby-screen,.settings-screen{display:grid;gap:16px}.lobby-card,.settings-card{display:grid;gap:14px}.field{display:grid;gap:6px}.field.checkbox{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.field.checkbox input{width:18px;height:18px;accent-color:var(--gold)}.field>span:first-child{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}select,input[type=text]{width:100%;padding:10px 12px;background:#0003;border:1px solid var(--line);border-radius:10px;color:inherit}.primary{padding:12px 16px;background:var(--gold);color:#1c2a24;border:0;border-radius:12px;font-weight:600;cursor:pointer}.primary:disabled{opacity:.5;cursor:default}.lobby-code-row,.lobby-link-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.lobby-code{display:block;font-size:32px;letter-spacing:.12em;color:var(--gold)}.lobby-link-row input{flex:1 1 200px;font-size:12px}.lobby-members{display:grid;gap:8px}.lobby-seat{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;background:#ffffff08;border-radius:10px}.ready-badge{font-size:12px;color:var(--online)}.lobby-status{padding:10px 12px;border-radius:10px;background:#e2b64f1a;font-size:14px}.lobby-state.closed{padding:12px;border-radius:10px;background:#8f3b2e33;border:1px solid var(--danger)}.room-screen{display:grid;gap:16px}.room-actions{display:flex;gap:10px;flex-wrap:wrap}.room-actions .primary,.room-actions .ghost{flex:1 1 120px}.login-screen{display:grid;place-items:center;min-height:100%;padding:16px}.login-card{width:100%;max-width:360px;display:grid;gap:16px;text-align:center;padding:24px 20px;background:var(--panel);border:1px solid var(--line);border-radius:20px}.login-card h1{margin:0}.login-card>p{margin:0}.auth-error{margin:0;padding:12px;border-radius:12px;background:#8f3b2e59;border:1px solid var(--danger);color:var(--text);text-align:left;font-size:14px}.auth-error strong{color:#ff8a7a}.guest-form{display:grid;gap:12px;text-align:left}.guest-form .field>span:first-child{display:block;margin-bottom:6px}.login-divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px}.login-divider:before,.login-divider:after{content:"";flex:1;height:1px;background:var(--line)}.profile-row{display:flex;align-items:center;gap:14px;padding:12px;background:#ffffff08;border-radius:14px}.profile-row img,.avatar-placeholder{width:48px;height:48px;border-radius:50%;flex-shrink:0}.profile-row img{object-fit:cover;background:var(--line)}.avatar-placeholder{background:var(--line)}.profile-row>div{display:grid;gap:2px;min-width:0}.profile-row strong{font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-row .muted{font-size:12px}.logout-button{width:100%}.game-final{background:var(--panel);border:1px solid var(--gold);border-radius:16px;padding:16px;margin-bottom:16px}.game-final h2{margin-top:0}.game-final .winner{margin:8px 0 16px;color:var(--gold);font-size:18px;font-weight:600}.final-table{width:100%;border-collapse:collapse;margin:12px 0;font-size:14px}.final-table th,.final-table td{text-align:left;padding:8px;border-bottom:1px solid var(--line)}.final-table .winner-row{background:#e2b64f1f}.final-seed{margin:12px 0;font-size:13px;color:var(--muted);word-break:break-all}.final-seed code{background:#ffffff12;padding:2px 6px;border-radius:6px}.final-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.cell{transition:none}}