:root{--ink:#f5f3ee;--muted:#aaa9a5;--black:#08090b;--red:#e50914;--line:rgba(255,255,255,.14);--ease:cubic-bezier(.2,.8,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:var(--ink);font-family:"DM Sans",sans-serif;overflow-x:hidden}button,input{font:inherit}button,a{color:inherit}button{cursor:pointer}.grain{position:fixed;inset:0;z-index:20;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}
.site-header{position:fixed;top:0;left:0;right:0;height:86px;z-index:50;display:flex;align-items:center;padding:0 4.5vw;gap:4vw;transition:.35s;background:linear-gradient(#08090bd9,transparent)}.site-header.scrolled{height:70px;background:#08090bf2;backdrop-filter:blur(18px);border-bottom:1px solid #ffffff0d}.brand{text-decoration:none;line-height:.78;letter-spacing:-.04em;font-family:Syne,sans-serif;font-size:15px;display:flex;flex-direction:column}.brand strong{font-size:25px;letter-spacing:-.07em}.site-header nav{display:flex;gap:28px}.site-header nav a{font-size:14px;color:#c9c9c9;text-decoration:none}.site-header nav a:hover,.site-header nav a.active{color:white}.header-actions{margin-left:auto;display:flex;align-items:center;gap:14px}.icon-btn,.sound-btn{background:none;border:0}.icon-btn svg{width:22px;fill:none;stroke:currentColor;stroke-width:1.7}.sound-btn{display:flex;gap:10px;align-items:center;color:#d0d0d0;font-size:12px}.sound-bars{height:16px;display:flex;gap:3px;align-items:center}.sound-bars i{display:block;width:2px;height:5px;background:#fff;transition:.25s}.sound-btn.playing .sound-bars i{animation:pulse .8s ease-in-out infinite alternate}.sound-btn.playing .sound-bars i:nth-child(2){animation-delay:.2s}.sound-btn.playing .sound-bars i:nth-child(3){animation-delay:.4s}@keyframes pulse{to{height:15px}}
.search-panel{position:absolute;top:100%;right:4.5vw;width:min(480px,91vw);display:flex;align-items:center;gap:12px;background:#16171b;border:1px solid var(--line);padding:16px 18px;transform:translateY(-20px);opacity:0;pointer-events:none;transition:.25s var(--ease)}.search-panel.open{transform:none;opacity:1;pointer-events:auto}.search-panel label{position:absolute;width:1px;height:1px;overflow:hidden}.search-panel input{width:100%;background:none;border:0;border-bottom:1px solid #555;color:#fff;padding:8px 0;outline:0}.search-panel button{font-size:24px;border:0;background:none}
.hero{min-height:100svh;position:relative;display:flex;align-items:center;padding:130px 7vw 100px;isolation:isolate}.hero-backdrop{position:absolute;inset:0;z-index:-2;background:url('assets/neon-divide.png') 68% center/cover no-repeat;animation:heroIn 1.4s var(--ease) both}@keyframes heroIn{from{transform:scale(1.05);filter:brightness(.55)}to{transform:scale(1);filter:brightness(1)}}.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#08090b 0%,#08090bd4 28%,transparent 68%),linear-gradient(0deg,#08090b 0%,transparent 35%),linear-gradient(180deg,#08090b66,transparent 28%)}.hero-content{max-width:590px;margin-top:5vh}.eyebrow,.kicker{font-size:11px;text-transform:uppercase;letter-spacing:.22em;font-weight:700}.eyebrow{display:flex;align-items:center;gap:10px}.eyebrow span{width:22px;height:2px;background:var(--red)}h1{font-family:Syne,sans-serif;font-size:clamp(62px,8.6vw,136px);line-height:.75;letter-spacing:-.085em;margin:26px 0 32px;max-width:700px;text-shadow:0 14px 50px #000}h1 span{display:block;font-weight:600;color:transparent;-webkit-text-stroke:1px #fff}.hero-copy{max-width:530px;font-size:clamp(16px,1.45vw,20px);line-height:1.55;color:#dedede}.meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;color:#ccc;margin:22px 0}.meta span:not(:last-child):after{content:"";display:inline-block;width:3px;height:3px;border-radius:50%;background:#777;margin-left:10px;vertical-align:middle}.meta .match{color:#68d391;font-weight:700}.hero-actions,.modal-actions{display:flex;gap:12px;margin-top:28px}.btn{border:0;border-radius:3px;padding:14px 21px;font-weight:700;display:flex;gap:10px;align-items:center;transition:.2s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:#fff;color:#08090b}.btn-primary:hover{background:var(--red);color:#fff}.btn-ghost{background:#6b6b6b66;backdrop-filter:blur(8px)}.btn-ghost span{font-size:25px;font-weight:400}.play-triangle{width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:10px solid currentColor}.scroll-cue{position:absolute;right:4.5vw;bottom:9vh;display:flex;flex-direction:column;align-items:center;gap:14px;font-size:9px;letter-spacing:.22em;text-transform:uppercase}.scroll-cue i{height:55px;width:1px;background:linear-gradient(#fff,transparent)}
.catalog{position:relative;padding:75px 4.5vw 120px;background:var(--black)}.section-heading{display:grid;grid-template-columns:1fr 320px;align-items:end;gap:60px;margin-bottom:70px}.section-heading h2{font:600 clamp(36px,5vw,74px)/1 Syne,sans-serif;letter-spacing:-.06em;margin:10px 0}.section-heading h2 em{font-weight:600;color:#777}.section-heading>p{color:var(--muted);line-height:1.6}.kicker{color:#777;margin:0}.rail-block{margin:0 0 70px}.rail-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.rail-title h3{font:600 21px Syne,sans-serif;margin:0}.rail-controls{display:flex;gap:8px}.rail-controls button{width:38px;height:38px;border:1px solid #333;background:#111;border-radius:50%}.rail-controls button:hover{border-color:#fff}.rail-note{font-size:12px;color:#777}.game-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(280px,31vw);gap:9px;overflow-x:auto;overflow-y:hidden;padding:10px 0 28px;scrollbar-width:none;scroll-snap-type:x proximity}.game-rail::-webkit-scrollbar{display:none}.game-card{position:relative;aspect-ratio:16/9;background:#222;overflow:hidden;border:0;padding:0;text-align:left;scroll-snap-align:start;isolation:isolate;transition:.35s var(--ease)}.game-card:before{content:"";position:absolute;inset:0;background:var(--art) center/cover;transition:.5s var(--ease);z-index:-2}.game-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#050608f0,transparent 65%);z-index:-1}.game-card:hover,.game-card:focus-visible{transform:scale(1.035);z-index:4;outline:0}.game-card:hover:before{transform:scale(1.06)}.card-content{position:absolute;left:20px;right:20px;bottom:17px}.card-index{font:600 10px Syne;letter-spacing:.16em;color:#aaa}.card-content h4{font:700 clamp(20px,2vw,32px)/1 Syne;margin:7px 0}.card-content p{font-size:11px;margin:0;color:#aaa}.card-hover{position:absolute;right:17px;bottom:18px;width:38px;height:38px;background:white;color:#000;border-radius:50%;display:grid;place-items:center;opacity:0;transform:translateY(8px);transition:.25s}.game-card:hover .card-hover,.game-card:focus-visible .card-hover{opacity:1;transform:none}.compact{grid-auto-columns:minmax(220px,23vw)}.compact .game-card{aspect-ratio:4/3}
.manifesto{padding:120px 7vw;background:#e9e6df;color:#111}.manifesto blockquote{font:700 clamp(50px,8vw,120px)/.92 Syne,sans-serif;letter-spacing:-.075em;margin:38px 0 80px}.manifesto blockquote span{color:transparent;-webkit-text-stroke:1.5px #111}.manifesto-bottom{display:grid;grid-template-columns:1fr 1fr;gap:12vw;border-top:1px solid #bbb6ac;padding-top:28px;align-items:end}.manifesto-bottom p{max-width:500px;line-height:1.65}.manifesto-bottom a{justify-self:end;color:#111;text-decoration:none;border-bottom:1px solid;padding-bottom:7px;font-weight:700}footer{display:flex;align-items:center;gap:50px;padding:45px 4.5vw;color:#777;border-top:1px solid #1e1e1e;font-size:11px}.footer-links{margin-left:auto;display:flex;gap:24px}.footer-links a{color:#888}.footer-brand{color:#fff}
.modal[hidden]{display:none}.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:4vh 16px}.modal-backdrop{position:absolute;inset:0;background:#000c;backdrop-filter:blur(8px)}.modal-card{position:relative;width:min(920px,96vw);max-height:92vh;overflow-y:auto;background:#15161a;border-radius:7px;box-shadow:0 30px 90px #000;animation:modalIn .35s var(--ease)}@keyframes modalIn{from{opacity:0;transform:translateY(20px) scale(.98)}}.modal-close{position:absolute;z-index:3;right:16px;top:16px;width:38px;height:38px;border-radius:50%;border:0;background:#111c;color:#fff;font-size:25px}.modal-art{height:min(52vw,470px);background:var(--modal-art) center/cover;position:relative;display:grid;place-items:center}.modal-art:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#15161a,transparent 45%)}.preview-scan{position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,#ffffff17 48%,transparent 60%);transform:translateX(-100%)}.modal.previewing .preview-scan{animation:scan 2.5s linear infinite}@keyframes scan{to{transform:translateX(100%)}}.big-play{position:relative;z-index:2;width:70px;height:70px;border-radius:50%;border:1px solid #fff;background:#0007;display:grid;place-items:center}.big-play span{border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:15px solid #fff;margin-left:5px}.modal.previewing .big-play span{width:13px;height:18px;border:0;border-left:4px solid #fff;border-right:4px solid #fff;margin:0}.modal-body{padding:0 38px 38px;margin-top:-35px;position:relative;z-index:2}.modal-body h2{font:700 clamp(38px,6vw,70px)/1 Syne;margin:12px 0 25px;letter-spacing:-.06em}.modal-grid{display:grid;grid-template-columns:1.6fr .7fr;gap:45px}.modal-grid p{color:#c2c2c2;line-height:1.6}.modal-grid dl{font-size:12px;margin:22px 0}.modal-grid dt{color:#777;margin-top:14px}.modal-grid dd{margin:4px 0}.circle-action{width:47px;height:47px;border-radius:50%;border:1px solid #777;background:none;color:#fff;font-size:26px}.circle-action.saved{background:#fff;color:#000}
@media(max-width:760px){.site-header{height:68px;padding:0 20px}.site-header nav{display:none}.sound-label{display:none}.hero{padding:110px 22px 80px;align-items:flex-end}.hero-backdrop{background-position:70% center}.hero:after{background:linear-gradient(0deg,#08090b 3%,#08090b66 65%,#08090b55),linear-gradient(90deg,#08090ba8,transparent)}h1{font-size:20vw}.scroll-cue{display:none}.catalog{padding:60px 0 80px}.section-heading,.rail-title{margin-left:20px;margin-right:20px}.section-heading{grid-template-columns:1fr;gap:10px;margin-bottom:45px}.game-rail,.compact{grid-auto-columns:82vw;overflow-x:scroll;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-left:20px;touch-action:pan-x;padding-left:20px;padding-right:20px;-webkit-overflow-scrolling:touch}.game-card{scroll-snap-align:start}.game-rail::-webkit-scrollbar{display:block;height:2px}.game-rail::-webkit-scrollbar-track{background:#1d1e22}.game-rail::-webkit-scrollbar-thumb{background:#777}.manifesto{padding:80px 22px}.manifesto-bottom{grid-template-columns:1fr;gap:30px}.manifesto-bottom a{justify-self:start}footer{align-items:flex-start;flex-direction:column;gap:20px}.footer-links{margin:0;flex-direction:column;gap:10px}.modal-body{padding:0 22px 28px}.modal-grid{grid-template-columns:1fr}.modal-art{height:58vw}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
