:root{color-scheme:dark;--bg: #05070d;--bg-panel: #0b101c;--bg-panel-alt: #0e1526;--border: #1e2942;--border-bright: #2c3c5f;--text: #d9e6ff;--text-dim: #6f80a3;--blue: #22e0ff;--blue-dim: #0f6f85;--blue-glow: rgba(34, 224, 255, .55);--orange: #ff9d2e;--orange-dim: #8a5117;--orange-glow: rgba(255, 157, 46, .55);--accent: #ff2ea6;--accent-glow: rgba(255, 46, 166, .5);--font-hud: "JetBrains Mono", "Fira Code", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:var(--font-hud)}body{min-height:100vh;background:radial-gradient(circle at 20% 0%,rgba(34,224,255,.08),transparent 45%),radial-gradient(circle at 85% 100%,rgba(255,157,46,.08),transparent 45%),var(--bg)}#root{min-height:100vh;display:flex;align-items:flex-start;justify-content:center}button{font-family:inherit;cursor:pointer}.setup-screen{width:min(560px,92vw);margin:6vh auto;padding:2rem;background:var(--bg-panel);border:1px solid var(--border-bright);border-radius:14px;box-shadow:0 0 40px #22e0ff14,inset 0 0 30px #0006;text-align:center}.title{margin:0;font-size:1.9rem;letter-spacing:.08em;background:linear-gradient(90deg,var(--blue),var(--accent),var(--orange));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 30px rgba(255,46,166,.25)}.subtitle{margin:.25rem 0 1.75rem;letter-spacing:.3em;font-size:.75rem;color:var(--text-dim)}.setup-score{display:flex;justify-content:center;gap:1.5rem;margin-bottom:1.75rem;font-size:.85rem;letter-spacing:.05em}.setup-score .score-blue{color:var(--blue);text-shadow:0 0 10px var(--blue-glow)}.setup-score .score-orange{color:var(--orange);text-shadow:0 0 10px var(--orange-glow)}.setup-section{margin-bottom:1.5rem;text-align:left}.setup-section h2{margin:0 0 .6rem;font-size:.75rem;letter-spacing:.15em;color:var(--text-dim);text-transform:uppercase}.button-row{display:flex;gap:.5rem;flex-wrap:wrap}.mode-btn{flex:1;min-width:90px;padding:.6rem .75rem;background:var(--bg-panel-alt);border:1px solid var(--border-bright);border-radius:8px;color:var(--text);letter-spacing:.04em;font-size:.85rem;transition:all .15s ease}.mode-btn:hover{border-color:var(--accent)}.mode-btn.active{border-color:var(--accent);color:#fff;box-shadow:0 0 16px var(--accent-glow);background:#ff2ea61f}.mode-btn.blue.active{border-color:var(--blue);box-shadow:0 0 16px var(--blue-glow);background:#22e0ff1f}.mode-btn.orange.active{border-color:var(--orange);box-shadow:0 0 16px var(--orange-glow);background:#ff9d2e1f}.start-btn{margin-top:.5rem;padding:.75rem 2rem;font-size:.95rem;letter-spacing:.1em;background:linear-gradient(90deg,var(--blue-dim),var(--accent));border:1px solid var(--accent);border-radius:8px;color:#fff;box-shadow:0 0 24px var(--accent-glow);text-decoration:none;display:inline-block}.start-btn:hover{filter:brightness(1.15)}.app{width:min(560px,94vw);margin:4vh auto;display:flex;flex-direction:column;align-items:center;gap:1rem}.app-header{width:100%;display:flex;align-items:center;justify-content:space-between}.app-header h1{font-size:1.1rem;letter-spacing:.08em;margin:0;color:var(--text)}.ghost-btn{padding:.4rem .8rem;background:transparent;border:1px solid var(--border-bright);border-radius:6px;color:var(--text-dim);font-size:.75rem;letter-spacing:.05em;text-decoration:none;display:inline-block}.ghost-btn:hover{color:var(--text);border-color:var(--accent)}.header-actions{display:flex;align-items:center;gap:.5rem}.usage-banner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;margin-bottom:1.5rem;padding:.6rem .8rem;background:var(--bg-panel-alt);border:1px solid var(--border);border-radius:8px;font-size:.75rem}.usage-remaining{color:var(--text-dim)}.usage-paid{color:var(--blue);text-shadow:0 0 8px var(--blue-glow)}.usage-checking{margin-left:.4rem;color:var(--accent)}.ghost-btn:disabled,.start-btn:disabled{opacity:.6;cursor:default;filter:none}.upgrade-error{margin:.5rem 0 0;font-size:.75rem;color:var(--orange);text-align:center}.paywall{margin-top:.5rem;padding:1rem;border:1px solid var(--accent);border-radius:10px;background:#ff2ea60f;text-align:center}.paywall p{margin:0 0 .75rem;font-size:.85rem;color:var(--text)}.paywall--inline{width:100%}.scoreboard{width:100%;display:flex;align-items:center;justify-content:center;gap:1rem;padding:.6rem 1rem;background:var(--bg-panel);border:1px solid var(--border);border-radius:10px}.scoreboard-item{display:flex;flex-direction:column;align-items:center;min-width:64px}.scoreboard-label{font-size:.65rem;letter-spacing:.15em;color:var(--text-dim)}.scoreboard-value{font-size:1.3rem;font-weight:700}.scoreboard-item--blue .scoreboard-value{color:var(--blue);text-shadow:0 0 12px var(--blue-glow)}.scoreboard-item--orange .scoreboard-value{color:var(--orange);text-shadow:0 0 12px var(--orange-glow)}.scoreboard-divider{font-size:.65rem;letter-spacing:.2em;color:var(--text-dim)}.status{width:100%;padding:.7rem 1rem;border-radius:10px;border:1px solid var(--border);background:var(--bg-panel);text-align:center;font-size:.9rem;letter-spacing:.04em;display:flex;flex-direction:column;align-items:center;gap:.6rem}.status--blue{border-color:var(--blue-dim);color:var(--blue)}.status--orange{border-color:var(--orange-dim);color:var(--orange)}.status-turn-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor;margin-right:.4rem;vertical-align:middle}.status--winner{font-size:1rem}.status--winner.status--blue{box-shadow:inset 0 0 24px #22e0ff1f}.status--winner.status--orange{box-shadow:inset 0 0 24px #ff9d2e1f}.status-reveal{display:block;margin-top:.25rem;font-size:.75rem;color:var(--accent);text-shadow:0 0 10px var(--accent-glow);letter-spacing:.1em}.status--draw{color:var(--text-dim)}.autoplay-controls{display:flex;justify-content:center}.table{width:100%;display:flex;flex-direction:column;align-items:center;gap:.75rem}.board{display:grid;grid-template-columns:repeat(4,minmax(58px,82px));grid-template-rows:repeat(4,minmax(58px,82px));gap:6px;padding:6px;background:var(--bg-panel);border:1px solid var(--border-bright);border-radius:12px;box-shadow:0 0 30px #22e0ff0f,0 0 30px #ff9d2e0d}.cell{position:relative;background:var(--bg-panel-alt);border:1px solid var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0;transition:border-color .15s ease,box-shadow .15s ease}.cell--legal{border-color:var(--accent);box-shadow:0 0 16px var(--accent-glow) inset}.cell--selected{border-color:#fff}.cell-hint{width:14px;height:14px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent-glow);opacity:.8}.piece{position:relative;border-radius:50%;display:block}.piece--blue{background:radial-gradient(circle at 35% 30%,#baf6ff,var(--blue) 60%,var(--blue-dim));box-shadow:0 0 16px var(--blue-glow),inset 0 0 8px #fff6}.piece--orange{background:radial-gradient(circle at 35% 30%,#ffe1b0,var(--orange) 60%,var(--orange-dim));box-shadow:0 0 16px var(--orange-glow),inset 0 0 8px #fff6}.cell .piece--S{width:34%;height:34%}.cell .piece--M{width:56%;height:56%}.cell .piece--L{width:78%;height:78%}.piece-stack-hint{position:absolute;inset:auto 0 -6px 0;margin:0 auto;width:40%;height:4px;border-radius:2px;background:#ffffff59}.tray{width:100%;padding:.6rem;border-radius:10px;border:1px solid var(--border);background:var(--bg-panel);display:flex;align-items:center;gap:.75rem;opacity:.75;transition:opacity .15s ease,border-color .15s ease}.tray--active{opacity:1}.tray--blue.tray--active{border-color:var(--blue-dim);box-shadow:0 0 20px #22e0ff1a}.tray--orange.tray--active{border-color:var(--orange-dim);box-shadow:0 0 20px #ff9d2e1a}.tray-label{font-size:.7rem;letter-spacing:.15em;color:var(--text-dim);min-width:52px}.tray--blue .tray-label{color:var(--blue)}.tray--orange .tray-label{color:var(--orange)}.tray-pieces{display:flex;gap:.6rem;flex:1;justify-content:flex-end}.tray-group{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.3rem .4rem;background:transparent;border:1px solid transparent;border-radius:8px;transition:border-color .15s ease,box-shadow .15s ease}.tray-group:disabled{cursor:default}.tray-group--selected{border-color:#fff;box-shadow:0 0 12px #fff}.tray-group-pieces{display:flex;align-items:flex-end;gap:4px;min-height:26px}.tray-piece{border-radius:50%;display:block}.tray-piece.piece--S{width:14px;height:14px}.tray-piece.piece--M{width:19px;height:19px}.tray-piece.piece--L{width:24px;height:24px}.tray-piece--empty{background:transparent;box-shadow:none;border:1px solid var(--border-bright);opacity:.4}.tray-size-label{display:block;font-size:.6rem;letter-spacing:.05em;color:var(--text-dim)}@media (max-width: 420px){.board{grid-template-columns:repeat(4,minmax(48px,1fr));grid-template-rows:repeat(4,minmax(48px,1fr))}.tray-group-pieces{gap:3px}.tray-piece.piece--S{width:11px;height:11px}.tray-piece.piece--M{width:15px;height:15px}.tray-piece.piece--L{width:19px;height:19px}}