*{box-sizing:border-box}body{color:#e0e0e0;-webkit-font-smoothing:antialiased;overscroll-behavior:none;background:#121212;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#root{min-height:100vh}a{color:#4caf50}button{font-family:inherit}:focus-visible{outline-offset:2px;outline:2px solid #4caf50}.game-list{max-width:600px;margin:0 auto}.list-section{margin-bottom:24px}.list-section h3{margin-bottom:12px}.game-card{cursor:pointer;background:#2c2c2c;border-radius:8px;align-items:center;gap:12px;margin-bottom:8px;padding:12px 16px;transition:background .2s;display:flex}.game-card:hover{background:#3c3c3c}.status-badge{text-transform:uppercase;border-radius:12px;padding:2px 8px;font-size:12px;font-weight:700}.status-waiting{color:#000;background:#ff9800}.status-active{color:#fff;background:#4caf50}.status-finished{color:#fff;background:#666}.game-mode{text-transform:capitalize;flex:1}.game-scores{font-size:1.1em;font-weight:700}.empty{color:#888;text-align:center;padding:16px}.create-game{text-align:center;background:#2c2c2c;border-radius:8px;max-width:400px;margin:0 auto 24px;padding:24px}.opponent-picker{text-align:left;margin:12px 0 16px;position:relative}.search-input-wrapper{align-items:center;display:flex;position:relative}.opponent-search{color:#eee;background:#1e1e1e;border:2px solid #555;border-radius:6px;outline:none;width:100%;padding:10px 36px 10px 12px;font-size:16px}.opponent-search:focus{border-color:#4caf50}.clear-btn{color:#aaa;cursor:pointer;background:0 0;border:none;padding:4px 8px;font-size:18px;position:absolute;right:8px}.clear-btn:hover{color:#fff}.search-spinner{border:2px solid #333;border-top-color:#4caf50;border-radius:50%;width:14px;height:14px;animation:.6s linear infinite spin;position:absolute;right:12px}.user-dropdown{z-index:10;background:#2c2c2c;border:1px solid #555;border-radius:0 0 6px 6px;max-height:200px;position:absolute;top:100%;left:0;right:0;overflow-y:auto}.user-option{color:#eee;cursor:pointer;text-align:left;background:0 0;border:none;border-bottom:1px solid #3a3a3a;justify-content:space-between;width:100%;padding:10px 12px;font-size:14px;display:flex}.user-option:hover{background:#3c3c3c}.user-option:last-child{border-bottom:none}.user-rating{color:#888;font-size:12px}.user-rating:before{content:"Rating: "}.refresh-btn{margin-bottom:12px;padding:6px 12px;font-size:12px}.turn-dot{background:#4caf50;border-radius:50%;width:10px;height:10px;animation:1.5s infinite pulse;box-shadow:0 0 6px #4caf50}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.matchmake-btn{padding:12px 32px;font-size:16px}.divider{color:#666;margin:16px 0;font-size:13px}.matchmaking-status{flex-direction:column;align-items:center;gap:12px;padding:16px;display:flex}.matchmaking-status p{color:#aaa}.spinner{border:3px solid #333;border-top-color:#4caf50;border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.push-prompt{text-align:center;margin-bottom:16px}.ios-install-prompt{background:#2c2c2c;border:1px solid #555;border-radius:8px;align-items:center;gap:12px;max-width:400px;margin:0 auto 16px;padding:16px;display:flex}.ios-install-prompt p{color:#ddd;text-align:left;margin:0;font-size:14px;line-height:1.4}.btn-small{white-space:nowrap;padding:4px 12px;font-size:12px}.push-enabled{color:#4caf50;font-size:13px}.list-error,.create-error{color:#f44336;background:#f443361a;border-radius:4px;margin-bottom:12px;padding:8px 12px;font-size:14px}.tile{cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;background:linear-gradient(135deg,#f5e6c8 0%,#e8d5a3 100%);border:1px solid #c4a35a;border-radius:3px;justify-content:center;align-items:center;width:36px;height:36px;display:flex;position:relative;box-shadow:1px 1px 2px #0003;container-type:inline-size}.tile:active{cursor:grabbing}.tile-letter{color:#333;font-size:18px;font-weight:700;line-height:1}.tile-value{color:#666;font-size:9px;line-height:1;position:absolute;bottom:1px;right:3px}.tile-pending{background:linear-gradient(135deg,#ffe0b2 0%,#ffcc80 100%);border-color:#ff9800}.tile-dragging{opacity:.5}.tile-selected{outline:3px solid #4caf50;transform:translateY(-4px);box-shadow:0 4px 8px #0000004d}.board-cell .tile{width:100%;height:100%;box-shadow:none;border-radius:2px}.board-cell .tile-letter{font-size:min(18px, calc(var(--cell-size,40px) * .48))}.board-cell .tile-value{font-size:min(9px, calc(var(--cell-size,40px) * .24));bottom:0;right:1px}@media (width<=768px){.tile-rack .tile{aspect-ratio:1;box-sizing:border-box;width:100%;height:auto}.tile-rack .tile-letter{font-size:50cqi}.tile-rack .tile-value{font-size:25cqi;bottom:0;right:1px}}.board{background:#8b7355;border-radius:4px;flex-direction:column;gap:1px;padding:4px;display:inline-flex;box-shadow:0 2px 8px #0000004d}.board-row{gap:1px;display:flex}.board-cell{--cell-size:40px;width:var(--cell-size);height:var(--cell-size);cursor:pointer;border-radius:2px;justify-content:center;align-items:center;transition:transform .1s;display:flex;position:relative}.board-cell:hover{z-index:1;transform:scale(1.05)}.cell-hover{outline:2px solid #4caf50}.cell-pending{outline:2px solid #ff9800}.premium-label{font-size:min(10px, calc(var(--cell-size) * .28));color:#00000080;-webkit-user-select:none;user-select:none;font-weight:700}.score-badge{z-index:10;pointer-events:none;white-space:nowrap;border-radius:8px;padding:1px 4px;font-size:11px;font-weight:700;line-height:1.3;position:absolute;top:-8px;right:-8px}.score-valid{color:#fff;background:#4caf50;box-shadow:0 1px 3px #0000004d}.score-invalid{color:#fff;background:#f44336;box-shadow:0 1px 3px #0000004d}@media (width<=768px){.board{box-sizing:border-box;gap:0;width:100%;padding:2px}.board-row{gap:0}.board-cell{--cell-size:calc((100vw - 28px) / 15);width:var(--cell-size);height:var(--cell-size)}.board-cell:hover{transform:none}.score-badge{padding:0 3px;font-size:10px;top:-6px;right:-6px}}@media (width<=480px){.board{padding:1px}.board-cell{--cell-size:calc((100vw - 10px) / 15)}}@media (orientation:landscape) and (height<=500px){.board{gap:0;width:auto;padding:1px}.board-row{gap:0}.board-cell{--cell-size:calc((100vh - 100px) / 15)}}.tile-rack{background:#8b7355;border-radius:4px;justify-content:center;align-items:center;gap:4px;min-height:52px;padding:8px 16px;display:flex}.rack-slot{box-sizing:border-box;border:2px dashed #ffffff4d;border-radius:3px;width:36px;height:36px}.rack-slot.empty{opacity:.3}@media (width<=768px){.tile-rack{box-sizing:border-box;gap:3px;width:100%;padding:6px 4px}.tile-rack>*{flex:1 1 0;min-width:0;max-width:calc(14.2857% - 2.57143px)}.rack-slot{aspect-ratio:1;width:auto;height:auto}}.scoreboard{color:#fff;background:#2c2c2c;border-radius:8px;min-width:160px;padding:16px}.scoreboard h3{text-align:center;margin:0 0 12px}.score-entry{border-radius:4px;justify-content:space-between;margin-bottom:4px;padding:8px;display:flex}.score-entry.active-turn{background:#4caf5033;border-left:3px solid #4caf50}.score-entry.my-score{font-weight:700}.player-score{font-size:1.2em;font-weight:700}.tiles-remaining{text-align:center;color:#aaa;margin-top:12px;font-size:.9em}.presence-dot{vertical-align:middle;border-radius:50%;width:8px;height:8px;margin-left:6px;display:inline-block}.presence-dot.online{background:#4caf50;box-shadow:0 0 4px #4caf50}.presence-dot.offline{background:#666}.score-preview{color:#4caf50;text-align:center;padding:4px;font-size:16px;font-weight:700}@media (width<=480px){.scoreboard{width:100%;min-width:0}}.exchange-overlay{z-index:100;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.exchange-panel{text-align:center;background:#2a2a2a;border-radius:8px;width:min(380px,90vw);min-width:0;padding:24px}.exchange-panel h3{color:#fff;margin:0 0 16px}.exchange-tiles{flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:16px;display:flex}.exchange-tile{cursor:pointer;background:#f5e6c8;border:2px solid #555;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;width:44px;height:44px;transition:border-color .15s,transform .15s;display:flex;position:relative}.exchange-tile.selected{background:#ffcdd2;border-color:#f44336;transform:scale(1.1)}.exchange-tile .letter{color:#333;font-size:18px;font-weight:700}.exchange-tile .value{color:#666;font-size:9px;position:absolute;bottom:2px;right:3px}.exchange-actions{justify-content:center;gap:8px;display:flex}.move-controls{flex-direction:column;align-items:center;gap:8px;display:flex}.controls-row{gap:8px;display:flex}.btn{cursor:pointer;border:none;border-radius:4px;padding:10px 20px;font-size:14px;font-weight:700;transition:opacity .2s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{color:#fff;background:#4caf50}.btn-primary:hover:not(:disabled){background:#45a049}.btn-secondary{color:#fff;background:#666}.btn-secondary:hover:not(:disabled){background:#555}.btn-exchange{color:#fff;background:#2196f3}.btn-exchange:hover:not(:disabled){background:#1976d2}.btn-warn{color:#fff;background:#ff9800}.btn-warn:hover:not(:disabled){background:#e68a00}.move-error{color:#f44336;background:#f443361a;border-radius:4px;padding:4px 8px;font-size:14px}.status-msg{color:#aaa;font-size:14px}.turn-indicator{color:#4caf50;font-weight:700}@media (width<=480px){.controls-row{justify-content:center;width:100%}.controls-row .btn{flex:1;min-height:44px;padding:12px 8px;font-size:13px}}.move-history{background:#2c2c2c;border-radius:8px;min-width:160px;max-height:300px;padding:12px;overflow-y:auto}@media (width<=480px){.move-history{width:100%;min-width:0;max-height:150px}}.move-history h3{color:#aaa;margin:0 0 8px;font-size:14px}.move-list{flex-direction:column;gap:4px;display:flex}.move-entry{border-radius:4px;align-items:center;gap:8px;padding:4px 8px;font-size:13px;display:flex}.move-entry.my-move{background:#4caf501a}.move-player{color:#888;min-width:28px;font-weight:700}.move-detail{flex:1;align-items:center;gap:6px;display:flex}.move-score{color:#4caf50;margin-left:auto;font-weight:700}.move-type{color:#888;font-style:italic}.chat{background:#2c2c2c;border-radius:8px;min-width:200px;overflow:hidden}.chat-header{width:100%;color:inherit;cursor:pointer;background:#1a1a1a;border:none;align-items:center;gap:8px;padding:10px 16px;font-size:14px;font-weight:700;display:flex}.chat-badge{color:#fff;background:#4caf50;border-radius:10px;padding:1px 7px;font-size:11px}.chat-messages{flex-direction:column;gap:4px;max-height:200px;padding:8px;display:flex;overflow-y:auto}.chat-empty{color:#666;text-align:center;margin-top:80px;font-size:13px}.chat-msg{word-break:break-word;border-radius:12px;max-width:80%;padding:6px 10px;font-size:13px}.chat-mine{color:#fff;background:#4caf50;border-bottom-right-radius:4px;align-self:flex-end}.chat-theirs{color:#ddd;background:#444;border-bottom-left-radius:4px;align-self:flex-start}.chat-input{border-top:1px solid #333;gap:4px;padding:8px;display:flex}.chat-input input{color:#fff;background:#1a1a1a;border:1px solid #444;border-radius:4px;flex:1;padding:8px 10px;font-size:16px}.chat-input input:focus{border-color:#4caf50;outline:none}.chat-input button{color:#fff;cursor:pointer;background:#4caf50;border:none;border-radius:4px;padding:6px 12px;font-size:13px}.chat-input button:disabled{opacity:.5}@media (width<=480px){.chat{width:100%;min-width:0}.chat-messages{max-height:120px}.chat-input button{min-height:44px;padding:6px 16px}}.modal-overlay{z-index:100;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.game-over-modal{text-align:center;background:#2c2c2c;border-radius:16px;width:min(360px,90vw);min-width:0;padding:24px;box-shadow:0 8px 32px #00000080}.game-over-modal h2{margin:0 0 24px;font-size:28px}.win-text{color:#4caf50}.lose-text{color:#f44336}.tie-text{color:#ff9800}.final-scores{justify-content:center;gap:24px;margin-bottom:24px;display:flex}.final-score{color:#aaa;background:#1a1a1a;border-radius:8px;flex-direction:column;gap:4px;padding:12px 24px;font-size:14px;display:flex}.final-score.winner{border:2px solid #4caf50}.final-points{color:#fff;font-size:32px;font-weight:700}.modal-actions{justify-content:center;gap:12px;display:flex}.blank-picker-overlay{z-index:200;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.blank-picker{text-align:center;background:#2c2c2c;border-radius:12px;max-width:min(360px,90vw);padding:24px}.blank-picker h3{color:#fff;margin:0 0 16px}.letter-grid{grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:16px;display:grid}.letter-btn{color:#fff;cursor:pointer;background:#1a1a1a;border:1px solid #555;border-radius:4px;width:44px;height:44px;font-size:18px;font-weight:700;transition:background .15s}@media (width<=400px){.letter-grid{grid-template-columns:repeat(7,1fr);gap:4px}.letter-btn{aspect-ratio:1;width:auto;height:auto;font-size:16px}}.letter-btn:hover{background:#4caf50;border-color:#4caf50}.word-approval-overlay{z-index:100;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.word-approval-dialog{text-align:center;background:#2a2a2a;border-radius:8px;width:90%;max-width:400px;padding:24px}.word-approval-dialog h3{color:#fff;margin:0 0 12px}.word-approval-dialog p{color:#ccc;margin:8px 0}.invalid-words-list{flex-wrap:wrap;justify-content:center;gap:8px;margin:12px 0;display:flex}.invalid-word{color:#f44336;text-transform:uppercase;background:#f4433633;border-radius:4px;padding:4px 12px;font-size:16px;font-weight:700}.approval-hint{color:#888;font-size:12px}.approval-buttons{justify-content:center;gap:12px;margin-top:16px;display:flex}.pending-approval-banner{color:#ff9800;text-align:center;background:#ff980026;border-radius:4px;padding:10px 16px;font-size:14px}.game-page{flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:24px;padding:24px;display:flex}.game-sidebar{flex-direction:column;gap:16px;max-height:calc(100vh - 48px);display:flex;overflow-y:auto}.game-main{flex-direction:column;align-items:center;gap:16px;display:flex}.connection-status{text-align:center;font-size:12px}.connected{color:#4caf50}.disconnected{color:#f44336}@media (width<=900px){.game-page{flex-direction:column;align-items:center;gap:8px;padding:12px}.game-main{width:100%;max-width:620px}.game-sidebar{flex-flow:wrap;justify-content:center;gap:8px;width:100%;max-width:620px;max-height:none;overflow-y:visible}}@media (width<=480px){.game-page{gap:4px;padding:4px}.game-main{gap:4px}.game-sidebar{flex-direction:column;gap:4px}}@media (orientation:landscape) and (height<=500px){.game-page{flex-flow:row;align-items:flex-start;gap:8px;padding:4px 8px}.game-sidebar{flex-direction:column;order:-1;gap:6px;width:auto;min-width:140px;max-width:180px;max-height:calc(100vh - 56px);overflow-y:auto}.game-main{flex:1;gap:4px;min-width:0}}.leaderboard{max-width:600px;margin:0 auto}.leaderboard table{border-collapse:collapse;width:100%}.leaderboard th,.leaderboard td{text-align:left;border-bottom:1px solid #333;padding:10px 12px}.leaderboard th{color:#aaa;text-transform:uppercase;font-size:.9em}.leaderboard tr:hover td{background:#ffffff0d}.loading{text-align:center;color:#aaa;padding:32px}@media (width<=480px){.leaderboard{padding:0 4px}.leaderboard th,.leaderboard td{padding:8px 6px;font-size:13px}.leaderboard th:last-child,.leaderboard td:last-child{text-align:right}}.navbar{background:#1a1a1a;border-bottom:1px solid #333;justify-content:space-between;align-items:center;padding:12px 24px;display:flex}.nav-brand{color:#f5e6c8;font-size:1.5em;font-weight:700;text-decoration:none}.nav-links{align-items:center;gap:16px;display:flex}.nav-links a{color:#ccc;padding:8px 4px;text-decoration:none}.nav-links a:hover{color:#fff}.nav-user{color:#4caf50;font-weight:700}.nav-logout{color:#ccc;cursor:pointer;background:0 0;border:1px solid #666;border-radius:4px;padding:8px 14px}.nav-logout:hover{color:#f44336;border-color:#f44336}@media (width<=480px){.navbar{padding:8px 12px}.nav-brand{font-size:1.2em}.nav-links{gap:8px;font-size:13px}.nav-user{display:none}.nav-logout{padding:6px 10px;font-size:12px}}main{min-height:calc(100vh - 53px)}.page{padding:24px}.auth-page{justify-content:center;align-items:center;min-height:60vh;display:flex}.auth-form{background:#2c2c2c;border-radius:8px;flex-direction:column;gap:12px;width:100%;max-width:400px;padding:32px;display:flex}.auth-form h2{text-align:center;margin:0 0 8px}.auth-form label{color:#aaa;margin-bottom:-8px;font-size:13px}.auth-form input{color:#fff;background:#1a1a1a;border:1px solid #555;border-radius:4px;padding:12px;font-size:16px}.auth-form input:focus{border-color:#4caf50;outline:none}.auth-form button[type=submit]{color:#fff;cursor:pointer;background:#4caf50;border:none;border-radius:4px;min-height:48px;padding:14px;font-size:16px;font-weight:700}.auth-form button[type=submit]:disabled{opacity:.5}.auth-form p{text-align:center;color:#aaa;font-size:14px}.link-btn{color:#4caf50;cursor:pointer;background:0 0;border:none;text-decoration:underline}.error{color:#f44336;text-align:center;background:#f443361a;border-radius:4px;padding:8px;font-size:14px}