:root{--bg: #0b1029;--bg2: #131a3d;--panel: #1a2150;--panel-2: #222a63;--tile: #f7f5ef;--tile-text: #14183a;--accent: #ff2ea6;--accent-soft: rgba(255, 46, 166, .45);--valid: #2effb0;--valid-soft: rgba(46, 255, 176, .45);--error: #ff3b5c;--gold: #ffce3a;--cyan: #41e0ff;--text: #eef0ff;--text-dim: #9aa3d4}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{font-family:Nunito,system-ui,sans-serif;background:radial-gradient(1200px 700px at 80% -10%,#232c6e 0%,transparent 55%),radial-gradient(900px 600px at -10% 110%,#1c2466 0%,transparent 55%),var(--bg);color:var(--text);overflow-x:hidden}.screen{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 16px;gap:14px}.logo{font-size:56px;font-weight:900;margin:0;letter-spacing:1px;text-shadow:0 4px 30px rgba(255,46,166,.35)}.logo span{color:var(--accent)}.logo-small{font-size:36px}.tagline{margin:-6px 0 8px;color:var(--text-dim);font-weight:600}.card{background:linear-gradient(180deg,var(--panel) 0%,var(--bg2) 100%);border:1px solid rgba(255,255,255,.08);border-radius:22px;padding:26px;width:min(380px,94vw);display:flex;flex-direction:column;gap:12px;box-shadow:0 18px 60px #00000073}.field-label{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-dim)}.input{background:#0000004d;border:2px solid rgba(255,255,255,.12);border-radius:12px;color:var(--text);font:inherit;font-weight:800;font-size:18px;padding:12px 14px;outline:none;transition:border-color .15s}.input:focus{border-color:var(--accent)}.input-code{text-transform:uppercase;letter-spacing:8px;text-align:center;font-size:22px;flex:1;min-width:0}.btn{font:inherit;font-weight:900;font-size:17px;border:none;border-radius:14px;padding:14px 18px;cursor:pointer;transition:transform .08s,filter .15s,box-shadow .15s}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:default}.btn-primary{background:linear-gradient(180deg,#ff4db6,#e3128f);color:#fff;box-shadow:0 8px 24px #ff2ea666}.btn-primary:hover{filter:brightness(1.1)}.btn-secondary{background:linear-gradient(180deg,#4754d6,#3744b8);color:#fff}.btn-ghost{background:transparent;color:var(--text-dim);font-size:14px;padding:6px}.btn-ghost:hover{color:var(--text)}.divider{text-align:center;color:var(--text-dim);font-size:13px;font-weight:700}.join-row,.pve-row{display:flex;gap:10px}.difficulty-select{flex:1;min-width:0;font-size:15px;padding:10px 12px;cursor:pointer}.room-code{font:inherit;font-size:40px;font-weight:900;letter-spacing:12px;color:var(--gold);background:#0000004d;border:2px dashed rgba(255,206,58,.4);border-radius:14px;padding:14px 8px 14px 20px;cursor:pointer;position:relative}.copy-hint{position:absolute;right:10px;bottom:6px;font-size:11px;letter-spacing:1px;color:var(--text-dim)}.player-list{display:flex;flex-direction:column;gap:6px}.player-row{display:flex;align-items:center;gap:10px;background:#ffffff0d;border-radius:10px;padding:10px 12px;font-weight:800}.player-dot{width:9px;height:9px;border-radius:50%;background:var(--valid);box-shadow:0 0 8px var(--valid)}.host-tag,.you-tag{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:1px;padding:2px 8px;border-radius:999px}.host-tag{background:#ffce3a2e;color:var(--gold)}.you-tag{background:#41e0ff26;color:var(--cyan);margin-left:auto}.waiting-text{color:var(--text-dim);text-align:center;font-weight:700;margin:4px 0}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%);background:var(--error);color:#fff;font-weight:800;padding:12px 22px;border-radius:12px;box-shadow:0 10px 30px #ff3b5c73;animation:toast-in .25s ease;z-index:100}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%)}}.rush-progress{display:flex;align-items:center;justify-content:center;gap:8px;animation:fade-in .2s ease}.rush-label{font-size:13px;font-weight:800;color:var(--text-dim);background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:5px 14px}.rush-label.rush-live{color:var(--error);border-color:#ff3b5c66;background:#ff3b5c1a;animation:pulse .8s infinite}.rush-panel{display:flex;flex-direction:column;gap:6px}.rush-btn{font:inherit;font-weight:900;font-size:14px;border-radius:12px;padding:10px 14px;border:none;cursor:pointer;transition:transform .08s,filter .12s,box-shadow .15s;width:100%}.rush-btn:active{transform:scale(.97)}.rush-btn-ready{background:linear-gradient(180deg,#ff8c42,#e06010);color:#fff;box-shadow:0 6px 20px #ff641466;animation:rush-glow 1.4s infinite}.rush-btn-ready:hover{filter:brightness(1.12)}@keyframes rush-glow{50%{box-shadow:0 6px 28px #ff6414a6}}.rush-btn-voted{background:#ffffff12;border:1px solid rgba(255,255,255,.15);color:var(--text-dim);cursor:default}.rush-btn-disabled{background:#ffffff0d;border:1px solid rgba(255,255,255,.08);color:var(--text-dim);opacity:.55;cursor:not-allowed}.rush-peers{font-size:12px;color:var(--text-dim);margin:0;text-align:center}.rush-done-note{font-size:12px;color:var(--text-dim);margin:0;text-align:center;padding:8px 10px;border-radius:10px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08)}.rush-vote-dot{font-size:13px;font-weight:900;width:18px;text-align:center;flex-shrink:0}.rush-vote-dot.voted{color:var(--valid)}.rush-vote-dot.pending{color:#ffffff40}.turn-banner.rush-active{color:#fff;background:linear-gradient(90deg,#ff3b5c4d,#ff8c424d);border-color:var(--error);box-shadow:0 0 28px #ff3b5c66;animation:rush-banner-pulse .6s infinite}@keyframes rush-banner-pulse{50%{box-shadow:0 0 44px #ff3b5ca6}}.timer-fill.timer-idle{background:transparent}.game{justify-content:flex-start;gap:18px;padding-top:20px}.game-header{display:flex;align-items:center;gap:16px;width:min(720px,96vw)}.round-pill{background:var(--panel-2);border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:8px 18px;font-weight:900;font-size:16px;white-space:nowrap}.round-pill span{color:var(--text-dim)}.timer{flex:1;display:flex;align-items:center;gap:10px}.timer-bar{flex:1;height:10px;border-radius:999px;background:#ffffff14;overflow:hidden}.timer-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--cyan),var(--accent));transition:width .25s linear}.timer-fill.timer-low{background:var(--error)}.timer-secs{font-weight:900;width:38px;text-align:right}.timer-low-text{color:var(--error);animation:pulse .8s infinite}@keyframes pulse{50%{opacity:.5}}.game-body{display:flex;gap:22px;align-items:flex-start;flex-wrap:wrap;justify-content:center}.board-wrap{position:relative}.board{position:relative;background:#0a0e24;border:3px solid #2a3370;border-radius:24px;padding:14px;touch-action:none;-webkit-user-select:none;user-select:none;box-shadow:0 20px 60px #00000080,inset 0 0 40px #141c5099;transition:box-shadow .2s}.board-error{animation:shake .4s;box-shadow:0 0 0 3px var(--error),0 20px 60px #00000080}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-7px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(3px)}}.grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;width:min(78vw,56vh,460px);aspect-ratio:1}.tile{position:relative;background:var(--tile);border-radius:16%;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px #c9c4b8,0 6px 10px #00000059;transition:transform .12s ease,box-shadow .15s ease,background .15s;z-index:1}.tile-letter{font-size:clamp(22px,4.6vh,38px);font-weight:900;color:var(--tile-text);pointer-events:none}.tile-points{position:absolute;right:9%;bottom:5%;font-size:clamp(9px,1.4vh,13px);font-weight:800;color:#8c87a8;pointer-events:none}.tile.selected{transform:scale(1.08);box-shadow:0 0 0 3px var(--accent),0 0 22px var(--accent-soft),0 4px #c9c4b8}.tile.tile-valid{box-shadow:0 0 0 3px var(--valid),0 0 22px var(--valid-soft),0 4px #c9c4b8}.tile.tile-error{box-shadow:0 0 0 3px var(--error),0 0 22px #ff3b5c80,0 4px #c9c4b8;animation:tile-wiggle .3s}.tile.tile-success{box-shadow:0 0 0 3px var(--valid),0 0 28px var(--valid),0 4px #c9c4b8;transform:scale(1.14)}@keyframes tile-wiggle{0%,to{transform:scale(1.08) rotate(0)}33%{transform:scale(1.08) rotate(-3deg)}66%{transform:scale(1.08) rotate(3deg)}}.badge{position:absolute;font-size:clamp(8px,1.3vh,11px);font-weight:900;color:#fff;border-radius:999px;padding:2px 5px;pointer-events:none;line-height:1.2}.badge-dl{top:-6px;left:-6px;background:#b8860b;background:linear-gradient(180deg,#ffce3a,#d99e00);color:#3a2a00;box-shadow:0 2px 6px #0006}.badge-2x{top:-6px;right:-6px;background:linear-gradient(180deg,#ff4db6,#d60f87);box-shadow:0 0 10px #ff2ea699}.tile-gem{position:absolute;left:7%;bottom:2%;font-size:clamp(11px,1.8vh,16px);color:#ff4dd2;text-shadow:0 0 6px rgba(255,77,210,.8);pointer-events:none;animation:gem-twinkle 1.6s infinite}@keyframes gem-twinkle{0%,to{opacity:1;transform:scale(1)}50%{opacity:.75;transform:scale(.9)}}.tile.tile-remote{transform:scale(1.06);box-shadow:0 0 0 3px var(--cyan),0 0 18px #41e0ff73,0 4px #c9c4b8}.tile.tile-hint{box-shadow:0 0 0 3px var(--gold),0 0 20px #ffce3a8c,0 4px #c9c4b8;animation:hint-pulse .9s infinite}@keyframes hint-pulse{50%{transform:scale(1.07)}}.tile.tile-drop{animation:tile-drop .5s cubic-bezier(.25,1.4,.45,1)}@keyframes tile-drop{0%{transform:translateY(-130%) scale(.85);opacity:0}60%{opacity:1}to{transform:translateY(0) scale(1);opacity:1}}.board-pick .tile{cursor:crosshair}.board-pick .tile:hover{transform:scale(1.1);box-shadow:0 0 0 3px var(--gold),0 0 20px #ffce3a80,0 4px #c9c4b8}.trail-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:2;overflow:visible}.trail{fill:none;stroke:var(--accent);stroke-width:7;stroke-linecap:round;stroke-linejoin:round;opacity:.95;filter:drop-shadow(0 0 6px var(--accent-soft))}.trail-under{stroke-width:15;opacity:.25;filter:none}.trail.valid{stroke:var(--valid);filter:drop-shadow(0 0 8px var(--valid-soft))}.trail.error{stroke:var(--error);filter:drop-shadow(0 0 8px rgba(255,59,92,.6))}.trail.remote{stroke:var(--cyan);filter:drop-shadow(0 0 8px rgba(65,224,255,.5))}.score-pop{position:absolute;transform:translate(-50%,-50%);background:#0d1130;border:2px solid var(--valid);border-radius:999px;padding:6px 14px;display:flex;gap:8px;align-items:baseline;pointer-events:none;z-index:3;box-shadow:0 0 18px var(--valid-soft);animation:pop-in .15s ease;white-space:nowrap}@keyframes pop-in{0%{opacity:0;transform:translate(-50%,-30%) scale(.8)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.score-pop-word{font-weight:900;font-size:16px;letter-spacing:1px}.score-pop-points{font-weight:900;font-size:18px;color:var(--valid)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.turn-banner{font-weight:900;font-size:18px;padding:8px 24px;border-radius:999px;background:var(--panel-2);border:1px solid rgba(255,255,255,.1);color:var(--text-dim)}.turn-banner.my-turn{color:#fff;background:linear-gradient(90deg,#ff2ea640,#41e0ff40);border-color:var(--accent);box-shadow:0 0 22px #ff2ea640;animation:banner-glow 1.6s infinite}@keyframes banner-glow{50%{box-shadow:0 0 34px #ff2ea673}}.play-banner{position:absolute;top:-8px;left:50%;transform:translate(-50%);background:#0d1130;border:2px solid var(--cyan);border-radius:999px;padding:8px 18px;font-weight:800;white-space:nowrap;z-index:10;box-shadow:0 0 18px #41e0ff59;animation:pop-in .2s ease}.play-name{color:var(--cyan)}.play-word{letter-spacing:2px;margin:0 4px}.play-points{color:var(--valid);margin-left:4px}.play-gems{color:#ff4dd2;margin-left:8px}.hint-banner,.pick-hint{position:absolute;bottom:-14px;left:50%;transform:translate(-50%);background:#0d1130;border:2px solid var(--gold);color:var(--text);border-radius:999px;padding:7px 16px;font-weight:800;white-space:nowrap;z-index:10;box-shadow:0 0 16px #ffce3a59;animation:pop-in .2s ease}.hint-banner b{color:var(--gold);letter-spacing:2px}.side-col{display:flex;flex-direction:column;gap:14px;min-width:220px}.abilities{background:linear-gradient(180deg,var(--panel) 0%,var(--bg2) 100%);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:8px}.abilities h3{margin:0 0 4px;font-size:13px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-dim);display:flex;justify-content:space-between;align-items:center}.my-gems{color:#ff4dd2;font-size:15px;text-shadow:0 0 8px rgba(255,77,210,.6)}.ability-btn{font:inherit;font-weight:800;font-size:15px;display:flex;justify-content:space-between;align-items:center;gap:8px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:var(--text);border-radius:12px;padding:10px 14px;cursor:pointer;transition:transform .08s,background .15s,border-color .15s}.ability-btn:hover:not(:disabled){background:#ff2ea626;border-color:var(--accent)}.ability-btn:active:not(:disabled){transform:scale(.97)}.ability-btn:disabled{opacity:.4;cursor:default}.ability-cost{color:#ff4dd2;font-weight:900}.pass-btn{font:inherit;background:transparent;border:none;cursor:pointer;margin-top:2px}.letter-picker h2{margin:0;text-align:center;font-size:20px}.swap-from{color:var(--gold)}.letter-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.letter-btn{font:inherit;font-weight:900;font-size:18px;aspect-ratio:1;background:var(--tile);color:var(--tile-text);border:none;border-radius:10px;cursor:pointer;transition:transform .08s,box-shadow .15s}.letter-btn:hover{transform:scale(1.1);box-shadow:0 0 0 2px var(--accent),0 0 14px var(--accent-soft)}.ai-tag{font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:1px;padding:1px 6px;border-radius:999px;background:#9d6fff33;color:#9d6fff;margin-left:6px;vertical-align:middle}.you-tag-sm{font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:1px;padding:1px 6px;border-radius:999px;background:#41e0ff26;color:var(--cyan);margin-left:4px;vertical-align:middle}.pve-badge{font-size:11px;font-weight:700;text-transform:none;letter-spacing:.5px;color:#9d6fff;background:#9d6fff26;padding:2px 8px;border-radius:999px;margin-left:auto}.scoreboard{background:linear-gradient(180deg,var(--panel) 0%,var(--bg2) 100%);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:16px;min-width:200px;display:flex;flex-direction:column;gap:8px}.scoreboard h3{margin:0 0 4px;font-size:13px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-dim)}.score-row{display:flex;align-items:center;gap:10px;background:#ffffff0a;border-radius:10px;padding:8px 12px;font-weight:800}.score-row.is-me{background:#41e0ff1a;border:1px solid rgba(65,224,255,.25)}.score-row.is-active{background:#ff2ea61f;border:1px solid rgba(255,46,166,.45);box-shadow:0 0 12px #ff2ea633}.score-gems{color:#ff4dd2;font-weight:900;font-size:13px;min-width:34px;text-align:right}.status-dot.turn{background:var(--accent);box-shadow:0 0 8px var(--accent);animation:pulse 1s infinite}.gem-bonus{color:#ff4dd2;font-size:12px;margin-left:8px}.status-dot{width:9px;height:9px;border-radius:50%;background:#fff3;flex-shrink:0}.status-dot.done{background:var(--valid);box-shadow:0 0 8px var(--valid)}.score-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.score-value{font-weight:900;color:var(--gold)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#040614b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:50;animation:fade-in .25s ease}.results-card h2{margin:0 0 6px;text-align:center}.results-list{display:flex;flex-direction:column;gap:6px}.result-row{display:grid;grid-template-columns:1fr auto auto auto;gap:12px;align-items:center;background:#ffffff0d;border-radius:10px;padding:10px 12px;font-weight:800}.result-row.is-me{background:#41e0ff1a}.result-word{letter-spacing:1px;color:var(--cyan)}.result-points{color:var(--valid)}.result-total{color:var(--gold);min-width:36px;text-align:right}.winner-crown{font-size:54px;text-align:center;animation:bounce 1.2s infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.winner-name{text-align:center;margin:0;font-size:28px}.standings{display:flex;flex-direction:column;gap:6px}.standing-row{display:flex;gap:12px;align-items:center;background:#ffffff0d;border-radius:10px;padding:10px 14px;font-weight:800}.standing-row.is-me{background:#41e0ff1a}.standing-rank{color:var(--text-dim);width:30px}.standing-name{flex:1}.standing-score{color:var(--gold);font-weight:900;font-size:18px}@media(max-width:700px){.game-body{flex-direction:column;align-items:center;width:100%}.side-col,.scoreboard{width:min(78vw,460px);min-width:0}}