@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700&family=Space+Grotesk:wght@400;600&display=swap";:root{font-family:Space Grotesk,Segoe UI,sans-serif;line-height:1.6;font-weight:400;color:#e2e8f0;background-color:#0f172a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--neon-cyan: #22d3ee;--neon-violet: #a855f7;--text-muted: rgba(226, 232, 240, .7);--text-strong: #f8fafc;--panel-bg: rgba(15, 23, 42, .72);--panel-border: rgba(148, 163, 184, .25);--panel-shadow: 0 25px 60px rgba(15, 23, 42, .55)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background-image:url(/background.jpg);background-attachment:fixed;background-position:center;background-size:cover;background-repeat:no-repeat;color:var(--text-strong)}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at top,rgba(56,189,248,.15),transparent 55%),radial-gradient(circle at 20% 40%,rgba(168,85,247,.15),transparent 45%),#0f172ab3;pointer-events:none;z-index:0}#root{min-height:100vh;position:relative;z-index:1}h1,h2,h3{font-family:Orbitron,Space Grotesk,sans-serif;font-weight:700;margin:0}button{font-family:inherit;cursor:pointer;color:inherit;background:transparent}button:disabled{cursor:not-allowed;opacity:.7}.app-shell{max-width:1200px;margin:0 auto;padding:3rem 1.5rem 4rem;display:flex;flex-direction:column;gap:2.5rem;position:relative;z-index:1}.hero{text-align:left;max-width:640px}.eyebrow{text-transform:uppercase;letter-spacing:.4em;font-size:.7rem;color:var(--neon-cyan);margin:0 0 .75rem}.hero h1{font-size:clamp(2.3rem,3.2vw,3.4rem);margin:0 0 .6rem;display:flex;align-items:center;gap:.75rem}.install-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:12px;border:1px solid rgba(34,211,238,.5);background:linear-gradient(120deg,#22d3ee26,#a855f726);color:var(--neon-cyan);cursor:pointer;transition:all .25s ease;box-shadow:0 0 12px #22d3ee33;flex-shrink:0}.install-btn:hover{transform:translateY(-2px);box-shadow:0 0 22px #22d3ee73;border-color:#22d3eecc}.subtitle{color:var(--text-muted);font-size:1rem;margin:0}.game-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:2rem}.game-panel{background:#0f172a73;border:1px solid rgba(148,163,184,.35);border-radius:28px;padding:2rem;position:relative;box-shadow:0 8px 32px #0006,inset 0 1px 2px #ffffff1a;backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%)}.board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;position:relative;margin-bottom:1.5rem}.cell{aspect-ratio:1 / 1;border-radius:18px;border:1px solid rgba(148,163,184,.35);background:#0f172a73;display:grid;place-items:center;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border .2s ease;position:relative;box-shadow:0 8px 32px #0006,inset 0 1px 2px #ffffff1a;backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%)}.cell:hover{transform:translateY(-2px);border-color:#22d3ee8c;box-shadow:0 0 20px #22d3ee40}.cell:disabled{cursor:default;transform:none;box-shadow:none}.mark{font-size:clamp(2.4rem,4vw,3.2rem);font-weight:700;animation:pop-in .25s ease}.mark-X{color:var(--neon-cyan);text-shadow:0 0 18px rgba(34,211,238,.6)}.mark-O{color:var(--neon-violet);text-shadow:0 0 18px rgba(168,85,247,.6)}.winning-line{position:absolute;background:linear-gradient(90deg,var(--neon-cyan),var(--neon-violet));border-radius:999px;box-shadow:0 0 18px #22d3eeb3;animation:line-glow .6s ease;pointer-events:none}.game-status{display:inline-flex;padding:.6rem 1rem;border-radius:999px;border:1px solid rgba(148,163,184,.35);background:#0f172a73;font-size:.95rem;color:var(--text-muted);box-shadow:0 8px 32px #0006,inset 0 1px 2px #ffffff1a;backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%)}.control-panel{display:flex;flex-direction:column;gap:1.5rem}.mode-bar{background:#0f172a73;border:1px solid rgba(148,163,184,.35);border-radius:22px;padding:1.25rem;display:grid;gap:1rem;box-shadow:0 8px 32px #0006,inset 0 1px 2px #ffffff1a;backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%)}.mode-group,.difficulty-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.75rem}.mode-button,.difficulty-button{border-radius:999px;border:1px solid rgba(148,163,184,.3);background:#0f172a73;color:var(--text-muted);padding:.55rem .9rem;font-size:.85rem;transition:all .2s ease;backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%)}.mode-button.active,.difficulty-button.active{color:var(--text-strong);border-color:#22d3eea6;box-shadow:0 0 18px #22d3ee40}.scoreboard{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.8rem}.score-card{background:#0f172a73;border-radius:18px;padding:1rem 1.1rem;border:1px solid rgba(148,163,184,.35);display:flex;flex-direction:column;gap:.35rem;box-shadow:0 8px 32px #0006,inset 0 1px 2px #ffffff1a;backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%)}.score-label{color:var(--text-muted);font-size:.75rem;letter-spacing:.05em;text-transform:uppercase}.score-value{font-size:1.5rem;font-weight:700}.score-x .score-value{color:var(--neon-cyan)}.score-o .score-value{color:var(--neon-violet)}.game-controls{display:flex;flex-direction:column;gap:.75rem}.control-button{border-radius:14px;padding:.9rem 1rem;border:1px solid rgba(34,211,238,.5);background:linear-gradient(120deg,#22d3ee26,#a855f726);color:var(--text-strong);font-weight:600;box-shadow:0 8px 32px #0006,inset 0 1px 2px #ffffff1a;backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%)}.control-button.ghost{border-color:#94a3b84d;background:#0f172a73;color:var(--text-muted);backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%)}.offline-chip{text-align:center;font-size:.8rem;color:var(--text-muted);padding:.6rem 1rem;border-radius:999px;border:1px dashed rgba(148,163,184,.3);background:#0f172a73;box-shadow:0 8px 32px #0006,inset 0 1px 2px #ffffff1a;backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%)}@keyframes pop-in{0%{transform:scale(.7);opacity:.4}to{transform:scale(1);opacity:1}}@keyframes line-glow{0%{opacity:0;transform:scaleX(.3)}to{opacity:1;transform:scaleX(1)}}@media(max-width:960px){.game-grid{grid-template-columns:1fr}.app-shell{padding:2rem 1.25rem 3rem}}
