:root{--bg-start:#0f172a;--bg-end:#111827;--panel:#0b1220;--panel-2:#111827;--stroke:#2a3759;--accent-1:#22d3ee;--accent-2:#6366f1;--text:#e5e7eb;--muted:#9ca3af;--tile:#1f2937;--shadow:0 10px 30px rgba(0,0,0,.35);--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}html,body{height:100%}body{color:var(--text);background:radial-gradient(1200px 800px at 30% 10%,var(--bg-start),var(--bg-end));margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol}.page{min-height:100dvh;padding:12px;padding-top:calc(12px + var(--safe-top));padding-bottom:calc(12px + var(--safe-bottom));flex-direction:column;align-items:center;gap:24px;display:flex}.brand{justify-content:space-between;align-items:baseline;width:min(1200px,94vw);display:flex}.brand h1{letter-spacing:.5px;background:linear-gradient(90deg,var(--accent-2),var(--accent-1));color:transparent;-webkit-background-clip:text;background-clip:text;margin:0;font-size:40px;font-weight:800}.statusbar{color:var(--muted);gap:18px;font-weight:600;display:flex}.stage{grid-template-columns:auto 320px;justify-content:center;align-items:start;gap:24px;width:min(1200px,94vw);display:grid}@media (max-width:900px){.stage{grid-template-columns:1fr;justify-items:center;gap:12px;width:100%;display:grid}.boardCard{transform-origin:top;position:relative}.hudOverlay{top:calc(var(--safe-top,0px) + 8px);z-index:10;flex-wrap:wrap;gap:8px;display:flex;position:absolute;left:12px;right:65px}.chip{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);white-space:nowrap;background:rgba(17,24,39,.9);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:8px 12px;font-size:13px;font-weight:600}.nextChip{align-items:center;gap:6px;display:flex}.nextMini{background:rgba(255,255,255,.1);border-radius:4px;justify-content:center;align-items:center;width:24px;height:20px;font-size:10px;display:flex}.pauseBtn{top:calc(var(--safe-top,0px) + 8px);color:#fff;z-index:15;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:rgba(17,24,39,.9);border:1px solid rgba(255,255,255,.25);border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;font-size:16px;transition:all .2s;display:flex;position:absolute;right:12px}.pauseBtn:hover,.pauseBtn:active{background:rgba(255,255,255,.12);transform:scale(.95)}.nextChip{align-items:center;gap:6px;margin-left:auto;display:flex}.nextMini{background:rgba(255,255,255,.05);border:1px dashed rgba(255,255,255,.2);border-radius:8px;width:44px;height:44px;position:relative}.sidebar{display:none}.tile{font-size:20px}}.boardCard{background:linear-gradient(180deg,var(--panel),var(--panel-2));width:auto;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:18px}.hudCard{background:linear-gradient(180deg,var(--panel),var(--panel-2));width:100%;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:18px}.boardFrame{border:2px solid var(--stroke);background:#0b1020;border-radius:12px;justify-content:center;align-items:center;width:100%;max-width:312px;height:600px;padding:12px;display:flex}.boardInner{background:repeating-linear-gradient(90deg,transparent 0,transparent 1px,#131b2e 1px,#131b2e 48px),repeating-linear-gradient(transparent 0,transparent 1px,#131b2e 1px,#131b2e 48px);width:288px;height:576px;position:relative;overflow:hidden}.hudCard{flex-direction:column;gap:16px;display:flex}.hudGroup{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:12px 14px}.hudGroup h2{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-size:14px}.statRow{justify-content:space-between;align-items:center;padding:6px 0;display:flex}.nextPreview{height:120px;color:var(--muted);background:rgba(255,255,255,.03);border:1px dashed rgba(255,255,255,.15);border-radius:10px;justify-content:center;align-items:center;display:flex;position:relative}.piecePreview{width:100px;height:80px;position:relative}.previewTile{color:#2d1810;background:linear-gradient(135deg,#f4e5b8 0%,#e6d29b 25%,#dcc788 50%,#d4bf7a 75%,#cab56c 100%);border:1px solid #b8a372;border-radius:3px;place-items:center;width:18px;height:18px;font-family:Inter,sans-serif;font-size:10px;font-weight:900;display:grid;position:absolute;box-shadow:inset 0 1px rgba(255,255,255,.4),inset 0 -1px rgba(0,0,0,.2),0 2px 3px rgba(0,0,0,.4)}.btnPrimary,.btnGhost{cursor:pointer;border-radius:10px;width:100%;margin-bottom:8px;padding:12px 14px;font-size:15px;font-weight:700}.btnPrimary{color:#fff;background:linear-gradient(90deg,var(--accent-2),var(--accent-1));border:none;transition:transform 80ms,filter .2s;box-shadow:0 6px 16px rgba(34,211,238,.25)}.btnPrimary:hover{filter:brightness(1.08);transform:translateY(-1px)}.btnGhost{color:var(--text);background:0 0;border:1px solid rgba(255,255,255,.16);transition:background .2s}.btnGhost:hover{background:rgba(255,255,255,.05)}.loading{text-align:center;color:var(--accent-1);font-weight:600}.gameOver{text-align:center}.gameOver h3{color:#ff6b6b;margin:0 0 8px;font-size:18px}.gameOver p{color:var(--muted);margin:0 0 16px}.recentWordsList{flex-wrap:wrap;gap:6px;display:flex}.recentWord{background:linear-gradient(45deg,var(--accent-2),var(--accent-1));color:#fff;white-space:nowrap;border-radius:6px;padding:4px 8px;font-size:12px;font-weight:600}.instructionsList{color:var(--muted);font-size:13px;line-height:1.5}.instructionsList div{padding:2px 0}.tile{color:#2d1810;text-shadow:0 1px 1px rgba(255,255,255,.3);background:linear-gradient(135deg,#f4e5b8 0%,#e6d29b 25%,#dcc788 50%,#d4bf7a 75%,#cab56c 100%);border:1px solid #b8a372;border-radius:8px;place-items:center;width:48px;height:48px;font-family:Inter,sans-serif;font-size:24px;font-weight:900;display:grid;position:absolute;box-shadow:inset 0 1px rgba(255,255,255,.4),inset 0 -1px rgba(0,0,0,.2),0 3px 6px rgba(0,0,0,.4),0 1px 2px rgba(0,0,0,.3)}.tile.rare{background:linear-gradient(135deg,#ffeaa7 0%,#fdcb6e 25%,#f39c12 50%,#e67e22 75%,#d35400 100%);border:1px solid #d68910;box-shadow:inset 0 1px rgba(255,255,255,.5),inset 0 -1px rgba(0,0,0,.3),0 3px 8px rgba(230,126,34,.4),0 1px 3px rgba(0,0,0,.4)}.mobileControls{z-index:1000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(0,0,0,.8);border:1px solid rgba(255,255,255,.1);border-radius:15px;flex-direction:column;gap:10px;padding:15px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.controlRow{justify-content:center;gap:10px;display:flex}.controlBtn{background:var(--card-bg);border:1px solid var(--border);color:var(--text);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border-radius:8px;justify-content:center;align-items:center;min-width:50px;height:50px;padding:12px 16px;font-size:18px;font-weight:600;transition:all .2s;display:flex}.controlBtn:hover,.controlBtn:active{background:var(--primary);border-color:var(--primary);color:#fff;transform:scale(.95)}.controlBtn.wide{min-width:80px;font-size:14px}@media (max-width:768px){.boardFrame{margin-top:50px}.sidebar{display:none}.gameContainer{flex-direction:column;gap:10px}.gameBoard{width:100%;max-width:400px;margin:0 auto}.sidebar{width:100%;padding:15px}.hudGroup{margin-bottom:15px}.controlBtn{min-width:45px;height:45px;padding:10px 14px;font-size:16px}}