:root{--bg: #07070d;--bg-elevated: #10101a;--bg-card: #141422;--bg-card-hover: #1a1a2e;--border: rgba(255, 255, 255, .08);--border-strong: rgba(255, 255, 255, .14);--text: #f4f4f8;--text-muted: #9b9bb0;--text-dim: #6b6b80;--accent: #7c5cff;--accent-2: #00f0ff;--accent-3: #ff3d81;--accent-warm: #ffb020;--success: #3dff9a;--danger: #ff4d6a;--radius: 16px;--radius-sm: 10px;--shadow: 0 20px 50px rgba(0, 0, 0, .45);--font: "Outfit", system-ui, sans-serif;--mono: "JetBrains Mono", ui-monospace, monospace;--header-h: 64px;--safe-bottom: env(safe-area-inset-bottom, 0px)}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}html{color-scheme:dark;scroll-behavior:smooth}body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse 80% 50% at 20% -10%,rgba(124,92,255,.22),transparent 55%),radial-gradient(ellipse 60% 40% at 90% 10%,rgba(0,240,255,.12),transparent 50%),radial-gradient(ellipse 50% 40% at 50% 100%,rgba(255,61,129,.08),transparent 50%)}a{color:inherit;text-decoration:none}button,input,select{font:inherit;color:inherit}button{cursor:pointer;border:none;background:none}img{max-width:100%;display:block}#root{position:relative;z-index:1}.app-shell{min-height:100dvh;display:flex;flex-direction:column}.container{width:min(1200px,calc(100% - 2rem));margin-inline:auto}.site-header{position:sticky;top:0;z-index:50;height:var(--header-h);display:flex;align-items:center;backdrop-filter:blur(16px);background:#07070db8;border-bottom:1px solid var(--border)}.site-header .inner{width:min(1200px,calc(100% - 2rem));margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:1rem}.logo{display:flex;align-items:center;gap:.65rem;font-weight:800;letter-spacing:-.03em;font-size:1.15rem}.logo-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;box-shadow:0 0 24px #7c5cff73}.logo-mark span{font-size:.85rem;font-weight:800}.nav-links{display:flex;gap:.35rem;align-items:center}.nav-links a{padding:.45rem .85rem;border-radius:999px;color:var(--text-muted);font-weight:500;font-size:.92rem;transition:.2s ease}.nav-links a:hover,.nav-links a.active{color:var(--text);background:#ffffff0f}.badge-agent{font-family:var(--mono);font-size:.7rem;padding:.3rem .55rem;border-radius:999px;border:1px solid var(--border-strong);color:var(--accent-2);background:#00f0ff14}.hero{padding:3.5rem 0 2rem;text-align:center}.hero-kicker{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .75rem;border-radius:999px;border:1px solid var(--border-strong);background:#ffffff08;color:var(--text-muted);font-size:.85rem;margin-bottom:1.25rem}.hero h1{margin:0 0 .75rem;font-size:clamp(2.4rem,6vw,4rem);line-height:1.05;letter-spacing:-.04em;font-weight:800}.hero h1 .grad{background:linear-gradient(120deg,var(--accent-2),var(--accent),var(--accent-3));-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{margin:0 auto 1.75rem;max-width:560px;color:var(--text-muted);font-size:1.1rem}.hero-stats{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap;margin-bottom:.5rem}.hero-stat{min-width:100px;padding:.85rem 1.1rem;border-radius:var(--radius-sm);background:#ffffff08;border:1px solid var(--border)}.hero-stat strong{display:block;font-size:1.35rem;font-weight:700;letter-spacing:-.02em}.hero-stat span{color:var(--text-dim);font-size:.8rem}.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.5rem 0 1.25rem}.chip{padding:.45rem .9rem;border-radius:999px;border:1px solid var(--border);background:#ffffff08;color:var(--text-muted);font-weight:500;font-size:.88rem;transition:.2s ease}.chip:hover{border-color:var(--border-strong);color:var(--text)}.chip.active{background:linear-gradient(135deg,#7c5cff40,#00f0ff1f);border-color:#7c5cff73;color:var(--text)}.game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem;padding-bottom:3rem}.game-card{position:relative;display:flex;flex-direction:column;border-radius:var(--radius);overflow:hidden;background:var(--bg-card);border:1px solid var(--border);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;box-shadow:0 8px 24px #00000040}.game-card:hover{transform:translateY(-4px);border-color:#7c5cff59;box-shadow:0 16px 40px #7c5cff26,var(--shadow)}.game-card-cover{aspect-ratio:16 / 10;position:relative;overflow:hidden}.game-card-cover .cover-art{position:absolute;inset:0;display:grid;place-items:center;font-size:3.5rem;transition:transform .35s ease}.game-card:hover .cover-art{transform:scale(1.06)}.game-card-cover .shine{position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.12) 50%,transparent 70%);transform:translate(-120%);transition:transform .6s ease}.game-card:hover .shine{transform:translate(120%)}.game-card-body{padding:1rem 1.1rem 1.15rem;display:flex;flex-direction:column;gap:.45rem;flex:1}.game-card-meta{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.tag{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--accent-2);padding:.2rem .5rem;border-radius:6px;background:#00f0ff1a}.tag.hot{color:var(--accent-3);background:#ff3d811f}.tag.td{color:var(--accent-warm);background:#ffb0201f}.tag.card{color:#9bff7c;background:#9bff7c1a}.playtime{font-size:.75rem;color:var(--text-dim);font-family:var(--mono)}.game-card h3{margin:0;font-size:1.2rem;letter-spacing:-.02em}.game-card p{margin:0;color:var(--text-muted);font-size:.9rem;flex:1}.play-btn{margin-top:.65rem;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;width:100%;padding:.7rem 1rem;border-radius:12px;font-weight:700;background:linear-gradient(135deg,var(--accent),#5b3fd4);color:#fff;transition:.2s ease}.play-btn:hover{filter:brightness(1.1);box-shadow:0 8px 24px #7c5cff59}.play-page{flex:1;display:flex;flex-direction:column;min-height:calc(100dvh - var(--header-h))}.play-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 1rem;border-bottom:1px solid var(--border);background:#10101ad9;backdrop-filter:blur(12px);flex-wrap:wrap}.play-toolbar h1{margin:0;font-size:1.05rem;font-weight:700}.toolbar-actions{display:flex;gap:.45rem;flex-wrap:wrap}.tool-btn{padding:.45rem .85rem;border-radius:10px;border:1px solid var(--border);background:#ffffff0a;color:var(--text-muted);font-weight:600;font-size:.85rem;transition:.15s ease}.tool-btn:hover{color:var(--text);border-color:var(--border-strong);background:#ffffff14}.game-stage{flex:1;position:relative;background:#000;min-height:0;display:flex}.game-stage>div,.game-stage canvas{width:100%!important;height:100%!important;max-height:calc(100dvh - var(--header-h) - 56px);touch-action:none}.game-mount{flex:1;width:100%;min-height:min(70vh,720px);position:relative;overflow:hidden}.app-shell.is-playing .game-mount{min-height:calc(100dvh - var(--header-h) - 56px)}.app-shell.is-playing .site-header{position:relative}.footer{margin-top:auto;border-top:1px solid var(--border);padding:2.5rem 0 calc(2rem + var(--safe-bottom));color:var(--text-dim);font-size:.88rem}.footer-grid{display:grid;gap:1.5rem;grid-template-columns:1.4fr 1fr 1fr}.footer h4{margin:0 0 .5rem;color:var(--text-muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em}.footer p,.footer li{margin:0;line-height:1.6}.footer ul{margin:0;padding:0;list-style:none}.footer a:hover{color:var(--accent-2)}@media(max-width:720px){.footer-grid{grid-template-columns:1fr}.nav-links{display:none}.hero{padding-top:2rem}}.loading-screen{position:absolute;inset:0;display:grid;place-items:center;background:#05050a;z-index:5}.spinner{width:42px;height:42px;border-radius:50%;border:3px solid rgba(255,255,255,.1);border-top-color:var(--accent-2);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.about-page{padding:2.5rem 0 4rem}.about-page h1{margin:0 0 .5rem;letter-spacing:-.03em}.about-page .lead{color:var(--text-muted);max-width:640px;font-size:1.1rem}.feature-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem;margin-top:2rem}.feature-card{padding:1.15rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-card)}.feature-card h3{margin:0 0 .35rem;font-size:1rem}.feature-card p{margin:0;color:var(--text-muted);font-size:.9rem}