:root{--bg:#0f0c08;--bg-surface:#1c1710;--bg-surface-2:#241e14;--bg-hover:#2c2418;--bg-input:#130f09;--gold:#c8933a;--gold-light:#daa94e;--gold-faint:#c8933a12;--gold-dim:#c8933a26;--gold-mid:#c8933a47;--gold-border:#c8933a6b;--text:#ede3cd;--text-2:#9a8e78;--text-muted:#5c5248;--green:#5a9e4c;--green-dim:#5a9e4c24;--red:#b03a2e;--red-dim:#b03a2e24;--blue:#3a6e9e;--orange:#c97d3a;--tile-face:#f2e6c6;--tile-shade:#e4d29e;--tile-border-top:#d4ac5a;--tile-border-side:#a07a30;--tile-border-bot:#7a5818;--tile-ink:#1c1208;--tile-ink-value:#7a6020;--board-wood:#130e08;--cell-bg:#1e1912;--cell-tw:#3d0c0c;--cell-dw:#2e1414;--cell-tl:#0d1b3a;--cell-dl:#12213a;--cell-center:#38121a;--f-serif:"Playfair Display", Georgia, serif;--f-sans:"Outfit", "Helvetica Neue", sans-serif;--f-mono:"Space Mono", "Courier New", monospace;--r-sm:3px;--r-md:7px;--r-lg:12px}*{box-sizing:border-box}body{font-family:var(--f-sans);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overscroll-behavior:none;background-image:radial-gradient(80% 40% at 50% 0,#c8933a0d 0%,#0000 70%);margin:0}#root{min-height:100vh}a{color:var(--gold)}button{font-family:var(--f-sans)}:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.game-list{max-width:600px;margin:0 auto}.list-section{margin-bottom:28px}.list-section h3{font-family:var(--f-serif);color:var(--text-2);letter-spacing:.02em;margin:0 0 12px;font-size:1.05rem;font-weight:600}.game-card{background:var(--bg-surface);border-radius:var(--r-md);cursor:pointer;border:1px solid #ffffff0f;align-items:center;gap:12px;margin-bottom:6px;padding:12px 16px;transition:background .15s,border-color .15s;display:flex}.game-card:hover{background:var(--bg-hover);border-color:var(--gold-dim)}.status-badge{text-transform:uppercase;letter-spacing:.06em;border-radius:10px;padding:3px 9px;font-size:.68rem;font-weight:700}.status-waiting{color:var(--orange);background:#c97d3a26;border:1px solid #c97d3a4d}.status-active{background:var(--green-dim);color:var(--green);border:1px solid #5a9e4c4d}.status-finished{color:var(--text-muted);background:#ffffff0d;border:1px solid #ffffff14}.game-mode{text-transform:capitalize;color:var(--text-2);flex:1;font-size:.9rem}.game-scores{font-family:var(--f-mono);color:var(--text);font-size:1em;font-weight:700}.opponent-name{flex:1;font-size:.92rem;font-weight:500}.empty{color:var(--text-muted);text-align:center;padding:20px;font-size:.88rem;font-style:italic}.create-game{background:var(--bg-surface);border:1px solid var(--gold-dim);border-radius:var(--r-lg);text-align:center;max-width:420px;margin:0 auto 28px;padding:28px 24px}.opponent-picker{text-align:left;margin:14px 0 18px;position:relative}.search-input-wrapper{align-items:center;display:flex;position:relative}.opponent-search{border-radius:var(--r-sm);background:var(--bg-input);width:100%;color:var(--text);font-family:var(--f-sans);border:1px solid #ffffff1a;outline:none;padding:10px 36px 10px 14px;font-size:15px;transition:border-color .15s,box-shadow .15s}.opponent-search:focus{border-color:var(--gold-border);box-shadow:0 0 0 3px var(--gold-dim)}.clear-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:4px 8px;font-size:17px;transition:color .15s;position:absolute;right:8px}.clear-btn:hover{color:var(--text)}.search-spinner{border:2px solid #ffffff14;border-top-color:var(--gold);border-radius:50%;width:14px;height:14px;animation:.6s linear infinite spin;position:absolute;right:12px}.user-dropdown{background:var(--bg-surface-2);border:1px solid var(--gold-dim);border-radius:0 0 var(--r-md) var(--r-md);z-index:10;border-top:none;max-height:200px;position:absolute;top:100%;left:0;right:0;overflow-y:auto}.user-option{width:100%;color:var(--text);cursor:pointer;font-family:var(--f-sans);text-align:left;background:0 0;border:none;border-bottom:1px solid #ffffff0d;justify-content:space-between;padding:10px 14px;font-size:.88rem;transition:background .12s;display:flex}.user-option:hover{background:var(--bg-hover)}.user-option:last-child{border-bottom:none}.user-rating{font-family:var(--f-mono);color:var(--text-muted);font-size:.78rem}.user-rating:before{content:"Rating: "}.refresh-btn{margin-bottom:12px;padding:5px 12px;font-size:.75rem}.turn-dot{background:var(--gold);width:8px;height:8px;box-shadow:0 0 6px var(--gold);border-radius:50%;flex-shrink:0;animation:1.8s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}.matchmake-btn{padding:13px 32px;font-size:.92rem}.divider{color:var(--text-muted);letter-spacing:.06em;margin:18px 0;font-size:.8rem}.matchmaking-status{flex-direction:column;align-items:center;gap:12px;padding:16px;display:flex}.matchmaking-status p{color:var(--text-2);font-size:.88rem}.spinner{border:2px solid #c8933a1f;border-top-color:var(--gold);border-radius:50%;width:30px;height:30px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.push-prompt{text-align:center;margin-bottom:16px}.ios-install-prompt{background:var(--bg-surface);border-radius:var(--r-md);border:1px solid #ffffff14;align-items:center;gap:12px;max-width:420px;margin:0 auto 16px;padding:14px 16px;display:flex}.ios-install-prompt p{color:var(--text-2);text-align:left;margin:0;font-size:.84rem;line-height:1.45}.btn-small{white-space:nowrap;padding:5px 12px;font-size:.72rem}.push-enabled{color:var(--green);letter-spacing:.02em;font-size:.82rem}.invitation-card{background:var(--bg-surface);border-radius:var(--r-md);border:1px solid #c97d3a4d;align-items:center;gap:12px;margin-bottom:6px;padding:12px 16px;display:flex}.invitation-from{color:var(--text);flex:1;font-size:.9rem}.invitation-actions{flex-shrink:0;gap:8px;display:flex}.challenge-sent{background:var(--green-dim);border-radius:var(--r-md);text-align:left;border:1px solid #5a9e4c4d;margin-bottom:8px;padding:16px}.challenge-sent p{color:var(--text);margin:0 0 6px;font-size:.9rem}.challenge-sent p:last-of-type{margin-bottom:12px}.challenge-subtext{color:var(--text-2);font-size:.82rem!important}.lobby-notice{background:var(--bg-surface);border:1px solid var(--gold-dim);border-radius:var(--r-md);max-width:420px;color:var(--text-2);text-align:center;margin:0 auto 12px;padding:10px 16px;font-size:.88rem}.list-error,.create-error{color:#e05a4a;background:var(--red-dim);border-radius:var(--r-sm);border:1px solid #b03a2e33;margin-bottom:12px;padding:8px 12px;font-size:.84rem}.tile{border:1px solid var(--tile-border-top);border-bottom:3px solid var(--tile-border-bot);border-right:2px solid var(--tile-border-side);cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;background:linear-gradient(145deg,#f8edd2 0%,#edda9e 55%,#dfc880 100%);border-radius:3px;justify-content:center;align-items:center;width:36px;height:36px;transition:transform .1s,box-shadow .1s;display:flex;position:relative;box-shadow:0 3px 7px #0000008c,0 1px 2px #0006,inset 0 1px #ffffff8c;container-type:inline-size}.tile:active{cursor:grabbing}.tile-letter{font-family:var(--f-serif);color:var(--tile-ink);letter-spacing:-.02em;font-size:18px;font-weight:700;line-height:1}.tile-value{font-family:var(--f-mono);color:var(--tile-ink-value);font-size:8px;font-weight:700;line-height:1;position:absolute;bottom:1px;right:2px}.tile-pending{background:linear-gradient(145deg,#fff5d8 0%,#f5df8c 55%,#e8c84e 100%);border-color:#c8a020 #a87818 #906010 #c8a020;box-shadow:0 3px 7px #00000073,0 1px 2px #0000004d,inset 0 1px #ffffffa6,0 0 0 2px #c8a0204d}.tile-dragging{opacity:.45}.tile-selected{outline:2px solid var(--gold);outline-offset:1px;box-shadow:0 6px 14px #00000080, inset 0 1px 0 #ffffff8c, 0 0 0 3px var(--gold-dim);transform:translateY(-5px)}.board-cell .tile{width:100%;height:100%;box-shadow:none;border-bottom-width:2px;border-radius:2px}.board-cell .tile-letter{font-size:min(18px, calc(var(--cell-size,40px) * .48))}.board-cell .tile-value{font-size:min(8px, calc(var(--cell-size,40px) * .22));bottom:0;right:1px}@media (width<=768px){.tile-rack .tile{aspect-ratio:1;box-sizing:border-box;border-bottom-width:2px;width:100%;height:auto}.tile-rack .tile-letter{font-size:50cqi}.tile-rack .tile-value{font-size:25cqi;bottom:0;right:1px}}.board{background:var(--board-wood);border-radius:var(--r-md);box-shadow:0 0 0 1px var(--gold-dim), 0 6px 30px #000000b3, inset 0 1px 0 #ffffff08;flex-direction:column;gap:1px;padding:5px;display:inline-flex}.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:filter .12s;display:flex;position:relative}.board-cell:hover{filter:brightness(1.18);z-index:1}.cell-hover{outline:2px solid var(--gold);outline-offset:-1px;z-index:2}.cell-pending{outline:2px solid var(--orange);outline-offset:-1px;z-index:2}.premium-label{font-family:var(--f-sans);font-size:min(9px, calc(var(--cell-size) * .26));letter-spacing:.04em;color:#ffffff47;-webkit-user-select:none;user-select:none;text-align:center;font-weight:700;line-height:1}.score-badge{font-family:var(--f-mono);z-index:10;pointer-events:none;white-space:nowrap;border-radius:8px;padding:2px 5px;font-size:10px;font-weight:700;line-height:1.3;position:absolute;top:-9px;right:-9px}.score-valid{background:var(--green);color:#fff;box-shadow:0 1px 6px #5a9e4c80}.score-invalid{background:var(--red);color:#fff;box-shadow:0 1px 6px #b03a2e80}@media (width<=768px){.board{box-sizing:border-box;gap:0;width:100%;padding:3px}.board-row{gap:0}.board-cell{--cell-size:calc((100vw - 24px) / 15);width:var(--cell-size);height:var(--cell-size)}.board-cell:hover{filter:none}.score-badge{padding:1px 3px;font-size:9px;top:-6px;right:-6px}}@media (width<=480px){.board{padding:2px}.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:var(--board-wood);border-radius:var(--r-md);box-shadow:0 0 0 1px var(--gold-dim), 0 4px 16px #00000080, inset 0 1px 0 #ffffff08;justify-content:center;align-items:center;gap:5px;min-height:56px;padding:10px 16px;display:flex}.rack-slot{box-sizing:border-box;border:1px dashed #c8933a33;border-radius:3px;width:36px;height:36px}.rack-slot.empty{opacity:.25}@media (width<=768px){.tile-rack{box-sizing:border-box;gap:3px;width:100%;padding:7px 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{background:var(--bg-surface);border:1px solid var(--gold-dim);color:var(--text);border-radius:var(--r-md);min-width:160px;padding:16px}.scoreboard h3{text-align:center;font-family:var(--f-serif);letter-spacing:.1em;text-transform:uppercase;color:var(--text-2);margin:0 0 12px;font-size:.85rem;font-weight:600}.score-entry{border-radius:var(--r-sm);justify-content:space-between;align-items:center;margin-bottom:4px;padding:7px 8px;display:flex}.score-entry.active-turn{background:var(--gold-faint);border:1px solid var(--gold-dim)}.score-entry.my-score{font-weight:600}.player-score{font-family:var(--f-mono);color:var(--gold);font-size:1.15em;font-weight:700}.tiles-remaining{text-align:center;color:var(--text-muted);font-family:var(--f-mono);letter-spacing:.04em;margin-top:12px;font-size:.78rem}.presence-dot{vertical-align:middle;border-radius:50%;width:7px;height:7px;margin-left:6px;display:inline-block}.presence-dot.online{background:var(--green);box-shadow:0 0 5px var(--green)}.presence-dot.offline{background:var(--text-muted)}.score-preview{color:var(--gold);font-family:var(--f-mono);text-align:center;padding:4px;font-size:15px;font-weight:700}@media (width<=600px){.scoreboard{flex-flow:wrap;align-items:center;gap:4px 12px;width:100%;min-width:0;padding:8px 12px;display:flex}.scoreboard h3{display:none}.score-entry{flex-shrink:0;margin-bottom:0;padding:4px 8px}.tiles-remaining{margin-top:0;margin-left:auto;font-size:.72rem}}.exchange-overlay{z-index:100;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.exchange-panel{background:var(--bg-surface);border:1px solid var(--gold-mid);border-radius:var(--r-lg);text-align:center;width:min(380px,92vw);min-width:0;padding:28px;box-shadow:0 16px 50px #0009}.exchange-panel h3{font-family:var(--f-serif);color:var(--text);margin:0 0 6px;font-size:1.3rem;font-weight:700}.exchange-panel>p,.exchange-panel>small{color:var(--text-2);margin:0 0 16px;font-size:.82rem;display:block}.exchange-tiles{flex-wrap:wrap;justify-content:center;gap:7px;margin-bottom:20px;display:flex}.exchange-tile{border:1px solid var(--tile-border-top);border-bottom:3px solid var(--tile-border-bot);border-right:2px solid var(--tile-border-side);cursor:pointer;background:linear-gradient(145deg,#f8edd2 0%,#edda9e 55%,#dfc880 100%);border-radius:3px;flex-direction:column;justify-content:center;align-items:center;width:46px;height:46px;transition:transform .12s,box-shadow .12s;display:flex;position:relative;box-shadow:0 2px 5px #00000080}.exchange-tile.selected{border-color:var(--red);background:linear-gradient(145deg,#fde8e4 0%,#f0c0b8 55%,#e09888 100%);border-bottom-color:#6a1c16;transform:scale(1.08)translateY(-2px);box-shadow:0 5px 12px #00000073,0 0 0 2px #b03a2e4d}.exchange-tile .letter{font-family:var(--f-serif);color:var(--tile-ink);font-size:20px;font-weight:700;line-height:1}.exchange-tile .value{font-family:var(--f-mono);color:var(--tile-ink-value);font-size:8px;position:absolute;bottom:2px;right:3px}.exchange-actions{justify-content:center;gap:10px;display:flex}.move-controls{flex-direction:column;align-items:center;gap:8px;display:flex}.controls-row{gap:8px;display:flex}.btn{border-radius:var(--r-sm);cursor:pointer;font-family:var(--f-sans);letter-spacing:.05em;text-transform:uppercase;border:1px solid #0000;padding:9px 20px;font-size:.83rem;font-weight:600;transition:background .15s,border-color .15s,color .15s,box-shadow .15s,opacity .15s}.btn:disabled{opacity:.38;cursor:not-allowed}.btn-primary{background:var(--gold);color:#1a1208;border-color:var(--gold)}.btn-primary:hover:not(:disabled){background:var(--gold-light);border-color:var(--gold-light);box-shadow:0 2px 10px #c8933a4d}.btn-secondary{color:var(--text-2);background:0 0;border-color:#ffffff1f}.btn-secondary:hover:not(:disabled){color:var(--text);background:#ffffff0a;border-color:#ffffff38}.btn-exchange{color:#6a9ec8;background:0 0;border-color:#3a6e9e66}.btn-exchange:hover:not(:disabled){background:#3a6e9e1a;border-color:#3a6e9eb3}.btn-warn{color:var(--orange);background:0 0;border-color:#c97d3a66}.btn-warn:hover:not(:disabled){background:#c97d3a1a;border-color:#c97d3ab3}.move-error{color:#e05a4a;background:var(--red-dim);border-radius:var(--r-sm);border:1px solid #b03a2e33;padding:5px 10px;font-size:.82rem}.status-msg{color:var(--text-muted);font-size:.85rem}.turn-indicator{color:var(--gold);font-size:.85rem;font-weight:600}@media (width<=480px){.controls-row{justify-content:center;width:100%}.controls-row .btn{flex:1;min-height:44px;padding:12px 8px;font-size:.78rem}}.move-history{background:var(--bg-surface);border:1px solid var(--gold-dim);border-radius:var(--r-md);min-width:160px;max-height:300px;padding:14px;overflow-y:auto}@media (width<=600px){.move-history{width:100%;min-width:0;max-height:150px}}.move-history h3{letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin:0 0 10px;font-size:.72rem;font-weight:600}.move-list{flex-direction:column;gap:3px;display:flex}.move-entry{border-radius:var(--r-sm);align-items:center;gap:8px;padding:4px 8px;font-size:.8rem;display:flex}.move-entry.my-move{background:var(--gold-faint)}.move-player{color:var(--text-muted);min-width:28px;font-size:.75rem;font-weight:700}.move-detail{flex:1;align-items:center;gap:6px;display:flex}.move-score{font-family:var(--f-mono);color:var(--gold);margin-left:auto;font-size:.8rem;font-weight:700}.move-type{color:var(--text-muted);font-style:italic}.chat{background:var(--bg-surface);border:1px solid var(--gold-dim);border-radius:var(--r-md);min-width:200px;overflow:hidden}.chat-header{background:var(--bg-surface-2);border:none;border-bottom:1px solid var(--gold-dim);width:100%;color:var(--text-2);cursor:pointer;letter-spacing:.08em;text-transform:uppercase;align-items:center;gap:8px;padding:10px 14px;font-size:.78rem;font-weight:600;transition:color .15s;display:flex}.chat-header:hover{color:var(--text)}.chat-badge{background:var(--gold);color:#1a1208;border-radius:10px;padding:1px 7px;font-size:10px;font-weight:700}.chat-messages{flex-direction:column;gap:4px;max-height:200px;padding:8px;display:flex;overflow-y:auto}.chat-empty{color:var(--text-muted);text-align:center;margin-top:80px;font-size:.82rem;font-style:italic}.chat-msg{word-break:break-word;border-radius:10px;max-width:80%;padding:6px 10px;font-size:.82rem;line-height:1.4}.chat-mine{background:var(--gold);color:#1a1208;border-bottom-right-radius:3px;align-self:flex-end;font-weight:500}.chat-theirs{background:var(--bg-surface-2);color:var(--text);border:1px solid #ffffff0f;border-bottom-left-radius:3px;align-self:flex-start}.chat-input{border-top:1px solid var(--gold-dim);gap:4px;padding:8px;display:flex}.chat-input input{background:var(--bg-input);border-radius:var(--r-sm);color:var(--text);font-family:var(--f-sans);border:1px solid #ffffff14;flex:1;padding:8px 10px;font-size:14px;transition:border-color .15s}.chat-input input:focus{border-color:var(--gold-border);outline:none}.chat-input button{background:var(--gold);border-radius:var(--r-sm);color:#1a1208;cursor:pointer;font-family:var(--f-sans);letter-spacing:.04em;border:none;padding:6px 14px;font-size:.78rem;font-weight:700;transition:background .15s}.chat-input button:hover:not(:disabled){background:var(--gold-light)}.chat-input button:disabled{opacity:.4}@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;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#000000bf;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.game-over-modal{background:var(--bg-surface);border:1px solid var(--gold-mid);border-radius:var(--r-lg);text-align:center;width:min(380px,92vw);min-width:0;box-shadow:0 0 0 1px var(--gold-dim), 0 20px 60px #000000b3;padding:36px 28px 28px}.game-over-modal h2{font-family:var(--f-serif);letter-spacing:.03em;margin:0 0 24px;font-size:2rem;font-weight:900;line-height:1.1}.win-text{color:var(--gold)}.lose-text{color:var(--red)}.tie-text{color:var(--orange)}.final-scores{justify-content:center;gap:20px;margin-bottom:28px;display:flex}.final-score{border-radius:var(--r-md);background:var(--bg-surface-2);letter-spacing:.06em;text-transform:uppercase;color:var(--text-2);border:1px solid #ffffff0f;flex-direction:column;gap:5px;padding:14px 22px;font-size:.78rem;font-weight:600;display:flex}.final-score.winner{border-color:var(--gold-border);background:var(--gold-faint)}.final-points{font-family:var(--f-mono);color:var(--text);letter-spacing:-.02em;font-size:2.2rem;font-weight:700}.final-score.winner .final-points{color:var(--gold)}.modal-actions{justify-content:center;gap:12px;display:flex}.blank-picker-overlay{z-index:200;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#000000b8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.blank-picker{background:var(--bg-surface);border:1px solid var(--gold-mid);border-radius:var(--r-lg);text-align:center;max-width:min(360px,92vw);padding:28px;box-shadow:0 16px 50px #000000a6}.blank-picker h3{font-family:var(--f-serif);color:var(--text);margin:0 0 18px;font-size:1.25rem;font-weight:700}.letter-grid{grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:16px;display:grid}.letter-btn{background:var(--bg-surface-2);width:44px;height:44px;color:var(--text);font-family:var(--f-serif);border-radius:var(--r-sm);cursor:pointer;border:1px solid #ffffff1a;font-size:1.1rem;font-weight:700;transition:background .12s,border-color .12s,color .12s}.letter-btn:hover{background:var(--gold);border-color:var(--gold);color:#1a1208}@media (width<=400px){.letter-grid{grid-template-columns:repeat(7,1fr);gap:4px}.letter-btn{aspect-ratio:1;width:auto;height:auto;font-size:.95rem}}.word-approval-overlay{z-index:100;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.word-approval-dialog{background:var(--bg-surface);border:1px solid var(--gold-mid);border-radius:var(--r-lg);text-align:center;width:92%;max-width:400px;padding:28px;box-shadow:0 16px 50px #0009}.word-approval-dialog h3{font-family:var(--f-serif);color:var(--text);margin:0 0 10px;font-size:1.25rem;font-weight:700}.word-approval-dialog p{color:var(--text-2);margin:6px 0;font-size:.88rem}.invalid-words-list{flex-wrap:wrap;justify-content:center;gap:8px;margin:14px 0;display:flex}.invalid-word{background:var(--red-dim);color:#e05a4a;border-radius:var(--r-sm);font-family:var(--f-serif);text-transform:uppercase;letter-spacing:.1em;border:1px solid #b03a2e40;padding:5px 14px;font-size:1rem;font-weight:700}.approval-hint{color:var(--text-muted);margin-top:4px;font-size:.75rem}.approval-buttons{justify-content:center;gap:12px;margin-top:18px;display:flex}.pending-approval-banner{color:var(--orange);border-radius:var(--r-sm);text-align:center;letter-spacing:.02em;background:#c97d3a1a;border:1px solid #c97d3a40;padding:9px 16px;font-size:.84rem;font-weight:500}.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;width:100%}.game-sidebar{flex-direction:column;gap:4px}}@media (width<=600px){.game-sidebar{flex-flow:wrap;align-items:flex-start;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{text-align:left;border-bottom:1px solid var(--gold-dim);letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);padding:8px 12px;font-size:.72rem;font-weight:700}.leaderboard td{text-align:left;border-bottom:1px solid #ffffff0a;padding:11px 12px;font-size:.9rem}.leaderboard td:last-child{font-family:var(--f-mono);color:var(--gold);font-weight:700}.leaderboard tr:hover td{background:var(--gold-faint)}.loading{text-align:center;color:var(--text-muted);padding:40px;font-size:.88rem;font-style:italic}@media (width<=480px){.leaderboard{padding:0 2px}.leaderboard th,.leaderboard td{padding:8px;font-size:.82rem}.leaderboard th:last-child,.leaderboard td:last-child{text-align:right}}.navbar{background:var(--bg-surface);border-bottom:1px solid var(--gold-mid);justify-content:space-between;align-items:center;height:52px;padding:0 24px;display:flex;position:relative}.navbar:after{content:"";background:linear-gradient(to right, transparent, var(--gold-border), transparent);pointer-events:none;width:60%;height:1px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.nav-brand{font-family:var(--f-serif);color:var(--gold-light);letter-spacing:.04em;font-size:1.4em;font-weight:700;text-decoration:none}.nav-links{align-items:center;gap:16px;display:flex}.nav-links a{color:var(--text-2);letter-spacing:.02em;padding:8px 4px;font-size:.875rem;font-weight:500;text-decoration:none;transition:color .15s}.nav-links a:hover{color:var(--text)}.nav-user{color:var(--gold);font-size:.875rem;font-weight:600}.nav-logout{border:1px solid var(--gold-mid);color:var(--text-2);border-radius:var(--r-sm);cursor:pointer;letter-spacing:.03em;background:0 0;padding:6px 14px;font-size:.8rem;font-weight:500;transition:border-color .15s,color .15s}.nav-logout:hover{border-color:var(--red);color:var(--red)}@media (width<=480px){.navbar{padding:0 12px}.nav-brand{font-size:1.15em}.nav-links{gap:8px;font-size:13px}.nav-user{display:none}.nav-logout{padding:5px 10px;font-size:11px}}main{min-height:calc(100vh - 52px)}.page{padding:24px}.auth-page{flex-direction:column;justify-content:center;align-items:center;gap:28px;min-height:60vh;display:flex}.auth-page:before{content:"W O R D S";font-family:var(--f-serif);letter-spacing:.35em;color:var(--gold);opacity:.9;font-size:2.2rem;font-weight:900}.auth-form{background:var(--bg-surface);border:1px solid var(--gold-mid);border-radius:var(--r-lg);flex-direction:column;gap:12px;width:100%;max-width:380px;padding:32px;display:flex;box-shadow:0 8px 40px #00000080}.auth-form h2{text-align:center;font-family:var(--f-serif);color:var(--text);letter-spacing:.02em;margin:0 0 4px;font-size:1.5rem;font-weight:600}.auth-form label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-2);margin-bottom:-6px;font-size:.75rem;font-weight:600}.auth-form input{background:var(--bg-input);border-radius:var(--r-sm);color:var(--text);font-family:var(--f-sans);border:1px solid #ffffff14;padding:11px 14px;font-size:15px;transition:border-color .15s,box-shadow .15s}.auth-form input:focus{border-color:var(--gold-border);box-shadow:0 0 0 3px var(--gold-dim);outline:none}.auth-form button[type=submit]{background:var(--gold);color:#1a1208;border-radius:var(--r-sm);cursor:pointer;font-family:var(--f-sans);letter-spacing:.06em;text-transform:uppercase;border:none;min-height:48px;margin-top:4px;padding:13px;font-size:.9rem;font-weight:700;transition:background .15s,box-shadow .15s}.auth-form button[type=submit]:hover:not(:disabled){background:var(--gold-light);box-shadow:0 2px 12px #c8933a4d}.auth-form button[type=submit]:disabled{opacity:.45;cursor:not-allowed}.auth-form p{text-align:center;color:var(--text-2);margin:2px 0 0;font-size:.85rem}.link-btn{color:var(--gold);cursor:pointer;text-underline-offset:2px;font-family:var(--f-sans);font-size:inherit;background:0 0;border:none;padding:0;text-decoration:underline}.link-btn:hover{color:var(--gold-light)}.error{color:#e05a4a;background:var(--red-dim);border-radius:var(--r-sm);text-align:center;border:1px solid #b03a2e40;padding:9px 12px;font-size:.85rem}
