:root {
  --ink: #0b0c10;
  --panel: #121319;
  --paper: #f2eee3;
  --muted: #9b9ca4;
  --blue: #4b6fff;
  --lime: #c9ff4d;
  --line: rgba(242, 238, 227, .16);
  --max: 1240px;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --display: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ink); color: var(--paper); font-family: Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 20; opacity: .045; 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='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E"); }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a { color: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; left: 12px; top: -60px; z-index: 100; padding: 12px 18px; background: var(--paper); color: var(--ink); font-weight: 800; transition: top .2s; }
.skip-link:focus { top: 12px; }

.site-header { width: min(calc(100% - 48px), var(--max)); height: 92px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); position: relative; z-index: 10; }
.brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.brand-lockup { display: flex; align-items: center; gap: 15px; }
.brand-origin { border-left: 1px solid var(--line); padding: 4px 0 4px 15px; color: #777981; text-decoration: none; font: 700 9px/1.35 var(--mono); letter-spacing: .08em; transition: color .2s; }
.brand-origin strong { display: block; color: var(--paper); font-size: 10px; }
.brand-origin:hover { color: var(--lime); }
.brand img { width: 50px; height: 50px; object-fit: contain; }
.brand-copy { display: grid; line-height: .83; letter-spacing: -.04em; }
.brand-copy b { font-size: 19px; }
.brand-copy em { color: var(--blue); font-family: var(--mono); font-size: 12px; letter-spacing: .28em; font-style: normal; margin-top: 7px; }
.site-nav { display: flex; align-items: center; gap: 32px; }
.site-nav a { text-decoration: none; font: 700 12px/1 var(--mono); letter-spacing: .07em; text-transform: uppercase; transition: color .2s; }
.site-nav a:hover { color: var(--lime); }
.site-nav .nav-cta { border: 1px solid var(--line); padding: 15px 18px; }
.site-nav .nav-cta span { margin-left: 15px; color: var(--blue); }
.language-picker { display: flex; align-items: center; }
.language-picker select { min-height: 38px; padding: 0 28px 0 10px; border: 1px solid #34353d; border-radius: 0; background: #111217; color: var(--paper); cursor: pointer; font: 800 10px var(--mono); letter-spacing: .05em; }
.language-picker select:focus { outline: 2px solid var(--lime); outline-offset: 2px; }
.menu-button { display: none; background: none; color: inherit; border: 0; padding: 10px; }

.hero { width: min(calc(100% - 48px), var(--max)); margin: 0 auto; min-height: 710px; display: grid; grid-template-columns: 1fr .92fr; gap: 70px; align-items: center; padding: 74px 0 86px; }
.eyebrow, .kicker { margin: 0 0 24px; font: 700 11px/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.status-dot { display: inline-block; width: 7px; height: 7px; margin-right: 9px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 14px var(--lime); }
.hero h1 { font-family: var(--display); font-size: clamp(82px, 10vw, 154px); line-height: .73; letter-spacing: -.055em; margin: 0; font-weight: 900; text-transform: uppercase; }
.hero h1 span { color: transparent; -webkit-text-stroke: 2px var(--blue); text-stroke: 2px var(--blue); }
.hero-lead { max-width: 580px; margin: 36px 0 0; color: #bbb9b2; font-size: 17px; line-height: 1.65; }
.hero-actions { display: flex; gap: 12px; margin-top: 36px; }
.button { min-height: 50px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: center; gap: 26px; border: 1px solid transparent; text-decoration: none; cursor: pointer; font: 800 12px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; transition: transform .2s, background .2s, color .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--blue); color: white; }
.button-primary:hover { background: #6382ff; }
.button-ghost { background: transparent; color: var(--paper); border-color: var(--line); }
.button-ghost:hover { border-color: var(--paper); }
.trust-list { list-style: none; display: flex; flex-wrap: wrap; padding: 0; margin: 42px 0 0; gap: 18px; color: #8e8e94; font: 700 10px/1 var(--mono); text-transform: uppercase; letter-spacing: .05em; }
.trust-list li::before { content: "✓"; color: var(--lime); margin-right: 7px; }

.hero-machine { position: relative; border: 1px solid #34353d; background: #17181e; box-shadow: 18px 18px 0 #07080a, 19px 19px 0 #30313a; transform: rotate(1.2deg); }
.machine-top { height: 42px; padding: 0 15px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #34353d; font: 700 9px var(--mono); letter-spacing: .08em; }
.live-label { color: var(--lime); }
.screen { margin: 14px; height: 395px; border: 3px solid #272831; position: relative; overflow: hidden; background: linear-gradient(#14162a 0 54%, #1c1832 54%); }
.screen-grid { position: absolute; inset: 54% -40% -20%; transform: perspective(280px) rotateX(57deg); transform-origin: top; background-image: linear-gradient(var(--blue) 1px, transparent 1px), linear-gradient(90deg, var(--blue) 1px, transparent 1px); background-size: 40px 26px; opacity: .6; }
.pixel-sun { width: 170px; height: 85px; border-radius: 170px 170px 0 0; background: repeating-linear-gradient(to bottom, #ff686e 0 9px, transparent 9px 14px); position: absolute; left: 50%; top: 80px; transform: translateX(-50%); opacity: .95; }
.road { position: absolute; bottom: -10px; width: 10px; height: 185px; background: var(--paper); transform-origin: bottom; opacity: .8; }
.road-left { left: 31%; transform: rotate(19deg); }.road-right { right: 31%; transform: rotate(-19deg); }
.pixel-car { position: absolute; left: 50%; bottom: 42px; width: 74px; height: 42px; transform: translateX(-50%); background: var(--blue); clip-path: polygon(18% 0, 82% 0, 100% 40%, 92% 100%, 8% 100%, 0 40%); box-shadow: inset 0 -12px #284bc5; }
.pixel-car::before, .pixel-car::after { content: ""; position: absolute; top: 8px; width: 12px; height: 8px; background: var(--lime); }
.pixel-car::before { left: 9px; }.pixel-car::after { right: 9px; }
.pixel-car i { position: absolute; width: 34px; height: 14px; background: #151728; left: 20px; top: -10px; clip-path: polygon(20% 0, 80% 0, 100% 100%, 0 100%); }
.score { position: absolute; top: 15px; color: var(--lime); font: 9px var(--mono); letter-spacing: .04em; }.score-left { left: 15px; }.score-right { right: 15px; }
.screen-title { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; transform: translateY(-28px) skewY(-3deg); font-family: var(--display); line-height: .73; text-shadow: 4px 4px #10111a; }
.screen-title span { font-size: 66px; letter-spacing: .08em; }.screen-title strong { font-size: 102px; color: var(--blue); letter-spacing: -.04em; }
.scanlines { position: absolute; inset: 0; background: repeating-linear-gradient(to bottom, transparent 0 3px, rgba(0,0,0,.2) 3px 5px); pointer-events: none; }
.machine-bottom { min-height: 90px; padding: 12px 16px 15px; border-top: 1px solid #34353d; display: grid; grid-template-columns: 1fr 1fr auto; gap: 18px; align-items: center; }
.machine-bottom > div:first-child { display: grid; grid-template-columns: auto auto; gap: 5px; width: min-content; }
.machine-bottom small { grid-column: 1 / 3; font: 8px var(--mono); color: #777981; text-align: center; }
.key { display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid #444650; font: 12px var(--mono); }
.machine-message { font: 10px/1.5 var(--mono); color: #7b7d84; border-left: 1px solid #33343d; padding-left: 17px; }.machine-message b { color: var(--paper); }
.round-play { width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--lime); color: var(--ink); cursor: pointer; transition: transform .2s; }.round-play:hover { transform: scale(1.08); }
.sticker { position: absolute; right: -30px; top: -35px; width: 76px; height: 76px; border-radius: 50%; background: var(--lime); color: var(--ink); display: grid; place-items: center; text-align: center; transform: rotate(12deg); font: 900 11px/1.15 var(--mono); border: 4px solid var(--ink); }

.ticker { height: 48px; overflow: hidden; background: var(--blue); color: white; display: flex; align-items: center; transform: rotate(-.6deg) scale(1.02); }
.ticker div { width: max-content; white-space: nowrap; font: 800 11px var(--mono); letter-spacing: .08em; animation: ticker 28s linear infinite; }
@keyframes ticker { to { transform: translateX(-50%); } }

.games-section, .principles { width: min(calc(100% - 48px), var(--max)); margin: 0 auto; padding: 132px 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 54px; }
.section-heading .kicker { color: var(--blue); margin-bottom: 18px; }
.section-heading h2 { font-family: var(--display); font-size: clamp(48px, 6vw, 82px); line-height: .88; text-transform: uppercase; letter-spacing: -.03em; margin: 0; }
.section-heading > p { color: var(--muted); font-size: 14px; line-height: 1.65; margin: 0 0 5px; }
.filters { display: flex; gap: 8px; margin-bottom: 24px; }
.filter { color: #777981; background: transparent; border: 1px solid #30313a; padding: 11px 14px; cursor: pointer; font: 700 10px var(--mono); text-transform: uppercase; }
.filter span { color: #484a52; margin-left: 8px; }.filter.is-active { color: var(--ink); background: var(--paper); border-color: var(--paper); }.filter.is-active span { color: #777; }
.game-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.game-card { border: 1px solid #2a2b32; background: #111217; min-width: 0; transition: opacity .25s, transform .25s; }
.game-card[hidden] { display: none; }
.game-card:hover { transform: translateY(-5px); border-color: #444650; }
.game-art { height: 360px; position: relative; overflow: hidden; background: #1a1b21; }
.card-index { position: absolute; top: 17px; left: 17px; z-index: 3; width: 29px; height: 29px; border: 1px solid rgba(255,255,255,.4); display: grid; place-items: center; font: 9px var(--mono); }
.game-badge, .coming { position: absolute; right: 14px; top: 14px; z-index: 3; padding: 8px 10px; background: var(--lime); color: var(--ink); font: 900 9px var(--mono); transform: rotate(2deg); }
.coming { background: var(--paper); }
.art-word { position: absolute; left: 24px; bottom: 23px; z-index: 3; font-family: var(--display); font-size: 56px; letter-spacing: -.02em; line-height: .78; text-transform: uppercase; text-shadow: 3px 3px rgba(0,0,0,.2); }
.art-word b { color: var(--lime); font-weight: inherit; }.art-word small { display: block; font: 8px var(--mono); letter-spacing: .16em; margin-bottom: 12px; }
.art-ruta { background: linear-gradient(150deg, #33245e, #111321 65%); }
.art-ruta::before { content: ""; position: absolute; inset: 45% -10% -25%; transform: perspective(250px) rotateX(60deg); background-image: linear-gradient(rgba(75,111,255,.6) 1px, transparent 1px), linear-gradient(90deg, rgba(75,111,255,.6) 1px, transparent 1px); background-size: 45px 28px; }
.mini-road { position: absolute; right: 15%; top: 18%; width: 160px; height: 160px; border-radius: 50%; border: 1px solid rgba(255,255,255,.22); }
.mini-road::before, .mini-road::after { content: ""; position: absolute; left: 50%; top: 0; width: 2px; height: 100%; background: var(--lime); transform: rotate(45deg); }.mini-road::after { transform: rotate(-45deg); }
.mini-road i { position: absolute; width: 32px; height: 54px; background: var(--paper); right: 15px; bottom: 20px; transform: rotate(44deg); }
.art-bloques { background: #2155da; }.art-bloques::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 80% 18%, var(--lime) 0 2px, transparent 3px), radial-gradient(circle at 75% 12%, var(--paper) 0 1px, transparent 2px); background-size: 41px 41px, 27px 27px; opacity: .7; }
.block-stack { position: absolute; right: 15%; top: 50px; width: 190px; height: 205px; transform: rotate(-7deg); }.block-stack i { position: absolute; width: 55px; height: 55px; border: 5px solid var(--paper); box-shadow: 7px 7px 0 rgba(0,0,0,.25); }.block-stack i:nth-child(1){left:0;top:55px}.block-stack i:nth-child(2){left:60px;top:55px;background:var(--lime)}.block-stack i:nth-child(3){left:120px;top:55px}.block-stack i:nth-child(4){left:60px;top:0}.block-stack i:nth-child(5){left:0;top:115px}.block-stack i:nth-child(6){left:60px;top:115px}.block-stack i:nth-child(7){left:120px;top:115px;background:var(--paper)}
.art-naipes { background: #342f2a; }.art-naipes::after { content: ""; position: absolute; inset: 0; opacity: .1; background-image: radial-gradient(var(--paper) 1px, transparent 1px); background-size: 12px 12px; }
.cards-fan { position: absolute; right: 16%; top: 48px; width: 190px; height: 220px; }.cards-fan i { position: absolute; width: 118px; height: 170px; background: var(--paper); color: var(--blue); border: 6px solid var(--paper); outline: 2px solid #342f2a; display: grid; place-items: center; font: 900 44px var(--display); box-shadow: 8px 12px 0 rgba(0,0,0,.24); }.cards-fan i:nth-child(1){transform:rotate(-16deg);left:0;top:14px}.cards-fan i:nth-child(2){transform:rotate(2deg);left:35px;color:#e64949}.cards-fan i:nth-child(3){transform:rotate(18deg);left:72px;top:16px;color:#16171c}
.art-naipes .art-word b { color: #ff6767; }
.art-orbita { background: #192221; }.art-orbita::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 49.5%, rgba(201,255,77,.14) 50%, transparent 50.5%), linear-gradient(transparent 49.5%, rgba(201,255,77,.14) 50%, transparent 50.5%); background-size: 42px 42px; }
.orbit { position: absolute; right: 8%; top: 25px; width: 270px; height: 270px; border: 1px solid #5e6d5d; border-radius: 50%; }.orbit::before, .orbit::after { content:"";position:absolute;border:1px solid #5e6d5d;border-radius:50%;inset:28px}.orbit::after{inset:62px}.orbit i,.orbit b,.orbit em{position:absolute;border-radius:50%;background:var(--lime)}.orbit i{width:12px;height:12px;top:28px;left:50px}.orbit b{width:28px;height:28px;right:30px;top:115px;background:var(--blue)}.orbit em{width:70px;height:70px;left:100px;top:100px;box-shadow:0 0 45px rgba(201,255,77,.4)}
.art-pasillo { background: #8f8558; }.art-pasillo::before { content:""; position:absolute; inset:0; background:repeating-linear-gradient(0deg,transparent 0 23px,rgba(20,18,12,.18) 24px); }.corridor-art { position:absolute; right:4%; top:30px; width:310px; height:270px; overflow:hidden; background:#c8bb7b; clip-path:polygon(0 0,100% 0,78% 100%,22% 100%); }.corridor-art::before,.corridor-art::after { content:""; position:absolute; top:0; bottom:0; width:44%; background:#5d5740; }.corridor-art::before { left:0; clip-path:polygon(0 0,100% 28%,100% 72%,0 100%); }.corridor-art::after { right:0; clip-path:polygon(0 28%,100% 0,100% 100%,0 72%); }.corridor-art i { position:absolute; z-index:2; left:50%; top:42%; width:32px; height:92px; transform:translateX(-50%); background:#2b2520; box-shadow:0 0 0 6px #d4c78c; }.corridor-art b,.corridor-art em { position:absolute; z-index:3; width:8px; height:8px; top:56%; background:#ef5c57; }.corridor-art b { left:46%; }.corridor-art em { right:46%; }
.art-minotauro { background:#32234b; }.art-minotauro::before { content:""; position:absolute; inset:0; opacity:.35; background-image:linear-gradient(#8f78ff 4px,transparent 4px),linear-gradient(90deg,#8f78ff 4px,transparent 4px); background-size:42px 42px; }.maze-art { position:absolute; right:12%; top:70px; width:180px; height:180px; border-radius:50%; background:#d64a45; box-shadow:0 0 60px rgba(214,74,69,.35); }.maze-art::before,.maze-art::after { content:""; position:absolute; top:-28px; width:76px; height:70px; border:15px solid var(--paper); border-bottom:0; border-radius:70% 70% 0 0; }.maze-art::before { left:-18px; transform:rotate(-30deg); }.maze-art::after { right:-18px; transform:rotate(30deg); }.maze-art i,.maze-art b { position:absolute; z-index:2; top:70px; width:24px; height:18px; background:#17101f; }.maze-art i { left:42px; }.maze-art b { right:42px; }.art-minotauro .art-word b { color:#f2d66b; }
.art-dominio { background:#163249; }.art-dominio::before { content:""; position:absolute; inset:0; opacity:.18; background:radial-gradient(circle,#68a4ff 1px,transparent 2px); background-size:18px 18px; }.world-art { position:absolute; right:7%; top:60px; width:280px; display:grid; grid-template-columns:repeat(3,78px); gap:9px; transform:rotate(-5deg); }.world-art i { display:block; height:72px; background:#56616c; clip-path:polygon(10% 8%,88% 0,100% 72%,78% 100%,5% 88%,0 32%); box-shadow:8px 8px 0 rgba(0,0,0,.25); }.world-art i:nth-child(1),.world-art i:nth-child(4),.world-art i:nth-child(5){background:#4b86e8}.world-art i:nth-child(3),.world-art i:nth-child(6){background:#d84f4b}.art-dominio .art-word b { color:#68a4ff; }
.art-wave { background:var(--wave-bg); }.art-wave::before { content:""; position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(255,255,255,.42) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.42) 1px,transparent 1px); background-size:28px 28px; }.art-wave::after { content:""; position:absolute; right:-55px; top:-70px; width:290px; height:290px; border:38px solid color-mix(in srgb,var(--wave-accent) 42%,transparent); border-radius:50%; }.art-wave .art-word b { color:var(--wave-accent); }.wave-token { position:absolute; z-index:2; right:10%; top:58px; min-width:180px; color:var(--wave-accent); font:900 92px/.82 var(--display); letter-spacing:-.06em; text-align:center; text-shadow:9px 9px 0 rgba(0,0,0,.23); transform:rotate(-7deg); }.wave-token-stack { font-size:48px; line-height:.58; }
.game-info { min-height: 100px; padding: 20px 22px; display: flex; justify-content: space-between; align-items: center; gap: 20px; }.game-info p { margin: 0 0 8px; color: #777981; font: 700 8px var(--mono); letter-spacing: .1em; }.game-info h3 { margin: 0; font-size: 21px; }
.play-link { background: none; border: 0; color: var(--paper); cursor: pointer; font: 700 11px var(--mono); text-transform: uppercase; }.play-link span { color: var(--lime); margin-left: 10px; font-size: 18px; }
.play-link-disabled { color: #5c5d64; cursor: not-allowed; }.play-link-disabled span { color: #45464d; font-size: 10px; letter-spacing: 0; }

.stories-section { background: #17181e; border-top: 1px solid #2a2b32; border-bottom: 1px solid #2a2b32; padding: 132px 0; }
.stories-inner { width: min(calc(100% - 48px), var(--max)); margin: 0 auto; }
.stories-heading .kicker { color: var(--lime); }
.platform-legend { max-width: 390px; display: flex; flex-wrap: wrap; gap: 8px; }
.platform-legend > span { border: 1px solid #484a52; padding: 9px 12px; color: var(--paper); font: 800 9px var(--mono); letter-spacing: .08em; }
.platform-legend p { flex-basis: 100%; margin: 12px 0 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.story-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.story-card { border: 1px solid #35363e; background: var(--ink); min-width: 0; transition: transform .25s, border-color .25s; }
.story-card:hover { transform: translateY(-5px); border-color: #565862; }
.story-art { height: 430px; position: relative; overflow: hidden; }
.story-number { position: absolute; z-index: 4; left: 18px; top: 18px; color: rgba(255,255,255,.72); font: 700 9px var(--mono); letter-spacing: .1em; }
.platform-tag { position: absolute; z-index: 4; right: 16px; top: 16px; background: var(--paper); color: var(--ink); padding: 9px 11px; font: 900 9px var(--mono); letter-spacing: .08em; }
.story-title-art { position: absolute; z-index: 4; left: 26px; bottom: 28px; color: white; font: 900 70px/.76 var(--display); letter-spacing: -.025em; text-transform: uppercase; text-shadow: 5px 5px rgba(0,0,0,.24); }
.story-title-art small { display: block; margin-bottom: 14px; font: 800 8px var(--mono); letter-spacing: .17em; text-shadow: none; }
.story-title-art b { color: var(--lime); font-weight: inherit; }
.story-wandergrave .story-art { background: radial-gradient(circle at 70% 28%, rgba(201,255,77,.13), transparent 26%), linear-gradient(150deg, #1d3229, #0b1010 70%); }
.story-wandergrave .story-art::before { content: ""; position: absolute; inset: 45% 0 0; opacity: .28; background: linear-gradient(35deg, transparent 36%, #83a87c 37% 40%, transparent 41%), linear-gradient(-35deg, transparent 36%, #83a87c 37% 40%, transparent 41%); background-size: 75px 65px; }
.grave-moon { position: absolute; width: 220px; height: 220px; right: 8%; top: 56px; border: 1px solid rgba(201,255,77,.45); border-radius: 50%; box-shadow: 0 0 60px rgba(201,255,77,.08), inset 0 0 60px rgba(201,255,77,.05); }
.grave-moon::before, .grave-moon::after { content: ""; position: absolute; bottom: -75px; width: 95px; height: 180px; background: #0a0d0c; clip-path: polygon(50% 0, 64% 16%, 72% 52%, 100% 100%, 0 100%, 30% 52%, 36% 16%); }
.grave-moon::before { left: -58px; transform: rotate(-9deg); }.grave-moon::after { right: -64px; transform: rotate(11deg) scale(.8); }
.grave-moon i { position: absolute; left: 86px; bottom: -24px; width: 48px; height: 92px; background: #d9d7cd; border-radius: 22px 22px 4px 4px; box-shadow: 8px 8px #080b0a; }
.grave-moon i::after { content: "+"; position: absolute; left: 15px; top: 13px; color: #1d3229; font: 900 23px var(--mono); }
.grave-moon b, .grave-moon em { position: absolute; border-radius: 50%; background: var(--lime); width: 8px; height: 8px; box-shadow: 0 0 12px var(--lime); }.grave-moon b { left: 28px; top: 62px; }.grave-moon em { right: 35px; top: 104px; }
.story-tortle .story-art { background: linear-gradient(#376fa7 0 52%, #87c958 52% 69%, #d7b45d 69% 78%, #2d6b93 78%); }
.story-tortle .story-art::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 2px, transparent 2px 18px); }
.story-shot > img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center top; transition: transform .6s ease; }
.story-card:hover .story-shot > img { transform: scale(1.025); }
.story-wandergrave .story-shot::before, .story-tortle .story-shot::before { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(to bottom, rgba(5,6,9,.08) 35%, rgba(5,6,9,.62)); pointer-events: none; }
.story-tortle .story-title-art b { color: #ffe06a; }
.island-scene { position: absolute; right: 2%; top: 34px; width: 310px; height: 290px; }
.island-scene::before { content: ""; position: absolute; width: 160px; height: 160px; right: 27px; top: 15px; border-radius: 50%; background: #ffe06a; box-shadow: 0 0 40px rgba(255,224,106,.25); }
.island-scene i { position: absolute; z-index: 2; width: 90px; height: 155px; right: 70px; top: 82px; background: #2f5f35; clip-path: polygon(50% 0, 62% 28%, 100% 42%, 70% 51%, 88% 79%, 58% 72%, 50% 100%, 40% 72%, 8% 79%, 30% 51%, 0 42%, 38% 28%); }
.island-scene b { position: absolute; z-index: 3; width: 72px; height: 42px; right: 104px; bottom: 31px; background: #33543a; border-radius: 48% 48% 30% 30%; box-shadow: inset 0 -10px #203625; }
.island-scene b::before { content: ""; position: absolute; left: 19px; top: -26px; width: 35px; height: 35px; border-radius: 50%; background: #7fac55; border: 5px solid #33543a; }
.island-scene em { position: absolute; z-index: 2; left: 20px; bottom: 22px; width: 280px; height: 45px; border-radius: 50%; background: #75a94b; box-shadow: 0 15px #c59f4a; }
.island-scene strong { position: absolute; z-index: 4; right: 116px; bottom: 38px; width: 8px; height: 8px; border-radius: 50%; background: #ffe06a; box-shadow: 27px 0 #ffe06a; }
.story-copy { min-height: 245px; padding: 26px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: 24px; }
.story-copy > div > p:first-child { margin: 0 0 9px; color: #777981; font: 700 8px var(--mono); letter-spacing: .1em; }
.story-copy h3 { margin: 0; font-size: 25px; }
.story-description { max-width: 510px; margin: 13px 0 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.story-link { display: inline-flex; align-items: center; gap: 30px; min-height: 45px; padding: 0 15px; background: var(--blue); color: white; text-decoration: none; font: 800 10px var(--mono); text-transform: uppercase; letter-spacing: .05em; transition: transform .2s, background .2s; }
.story-link:hover { transform: translateY(-2px); background: #6382ff; }.story-link span { color: var(--lime); font-size: 16px; }
.next-story { margin-top: 24px; min-height: 64px; border: 1px dashed #3a3b43; padding: 0 20px; display: flex; align-items: center; gap: 14px; color: #777981; font: 9px var(--mono); letter-spacing: .06em; }.next-story .status-dot { margin: 0; }.next-story b { color: var(--paper); }.next-story > span:last-child { margin-left: auto; }

.manifesto { background: var(--paper); color: var(--ink); display: grid; grid-template-columns: 1fr 2fr; gap: 100px; padding: 120px max(24px, calc((100% - var(--max))/2)); align-items: center; position: relative; overflow: hidden; }
.manifesto::after { content: "PLAY / REPEAT"; position: absolute; bottom: -30px; right: -10px; font: 900 120px var(--display); color: rgba(11,12,16,.035); white-space: nowrap; }
.manifesto-mark { display: grid; place-items: center; position: relative; }.manifesto-mark::before { content: ""; position: absolute; width: 265px; height: 265px; border: 1px dashed #aaa79f; border-radius: 50%; animation: spin 24s linear infinite; }.manifesto-mark img { filter: drop-shadow(12px 12px 0 rgba(11,12,16,.1)); transform: rotate(-7deg); }
@keyframes spin { to { transform: rotate(360deg); } }
.manifesto-copy { position: relative; z-index: 1; }.manifesto-copy .kicker { color: var(--blue); }.manifesto blockquote { max-width: 830px; margin: 0; font: 900 clamp(40px,5.2vw,75px)/.98 var(--display); text-transform: uppercase; letter-spacing: -.02em; }.manifesto blockquote em { color: var(--blue); font-style: normal; }.manifesto-copy > p:not(.kicker) { max-width: 580px; font-size: 15px; line-height: 1.7; color: #53534f; }.manifesto-copy a { display: inline-flex; gap: 40px; margin-top: 12px; font: 800 11px var(--mono); text-transform: uppercase; text-underline-offset: 6px; }

.principles { padding-bottom: 160px; }.principle-grid { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }.principle-grid article { min-height: 310px; padding: 22px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); position: relative; }.principle-grid article > span { position: absolute; right: 16px; top: 16px; color: #595a62; font: 9px var(--mono); }.principle-icon { font: 38px var(--mono); color: var(--lime); margin: 20px 0 70px; }.principle-grid h3 { font-size: 19px; margin: 0 0 15px; }.principle-grid p { color: var(--muted); font-size: 13px; line-height: 1.6; margin: 0; }

.support-section { min-height: 820px; padding: 130px 24px 90px; display: grid; place-items: center; position: relative; overflow: hidden; background: var(--paper); color: var(--ink); text-align: center; }
.support-inner { width: min(900px, 100%); position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; }
.support-section .kicker { color: var(--blue); margin-bottom: 24px; }
.support-section h2 { max-width: 900px; margin: 0; font: 900 clamp(68px, 9vw, 126px)/.78 var(--display); text-transform: uppercase; letter-spacing: -.035em; }
.support-section h2 span { color: transparent; -webkit-text-stroke: 2px var(--blue); }
.support-lead { max-width: 650px; margin: 38px auto 0; color: #53534f; font-size: 16px; line-height: 1.75; }
.support-stats { width: 100%; margin: 48px 0 42px; display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid rgba(11,12,16,.18); }
.support-stats div { min-height: 112px; display: grid; place-items: center; align-content: center; gap: 7px; border-right: 1px solid rgba(11,12,16,.18); }.support-stats div:last-child { border: 0; }
.support-stats strong { font: 900 39px var(--display); color: var(--blue); }.support-stats span { font: 800 9px var(--mono); letter-spacing: .12em; }
.support-button { min-height: 58px; padding: 0 25px; background: var(--ink); color: var(--paper); }.support-button span:last-child { color: var(--lime); }.support-button:hover { background: var(--blue); }
.support-inner > small { margin-top: 15px; color: #76756f; font: 9px var(--mono); }
.support-orbit { position: absolute; width: min(880px, 90vw); aspect-ratio: 1; border: 1px solid rgba(75,111,255,.12); border-radius: 50%; animation: spin 40s linear infinite; }
.support-orbit::before, .support-orbit::after { content:""; position:absolute; border: 1px solid rgba(75,111,255,.09); border-radius: 50%; inset: 13%; }.support-orbit::after { inset: 27%; }
.support-orbit i { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: var(--blue); }.support-orbit i:nth-child(1) { left: 12%; top: 21%; }.support-orbit i:nth-child(2) { right: 7%; top: 48%; background: var(--lime); }.support-orbit i:nth-child(3) { left: 45%; bottom: -5px; }

.final-cta { min-height: 600px; background: var(--blue); color: white; display: grid; place-items: center; align-content: center; text-align: center; position: relative; overflow: hidden; }.final-cta::before { content:"";position:absolute;inset:-30%;background:repeating-radial-gradient(circle at center,transparent 0 35px,rgba(255,255,255,.07) 36px 37px); }.final-cta > * { position: relative; }.final-cta > p { font: 800 10px var(--mono); letter-spacing: .2em; }.final-cta h2 { margin: 16px 0 30px; font: 900 clamp(76px,10vw,150px)/.73 var(--display); text-transform: uppercase; letter-spacing: -.04em; }.final-cta h2 span { color: transparent; -webkit-text-stroke: 2px white; }.button-light { background: var(--paper); color: var(--ink); }.corner-note { position: absolute; right: 35px; bottom: 32px; text-align: left; font: 700 9px/1.4 var(--mono); opacity: .7; }

footer { width: min(calc(100% - 48px), var(--max)); min-height: 150px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 25px; color: #707178; font: 10px var(--mono); text-transform: uppercase; }.footer-brand { color: var(--paper); }.footer-brand img { width: 42px; height: 42px; }.footer-brand .brand-copy b { font-size: 15px; }.footer-brand .brand-copy em { font-size: 9px; }footer > p { flex: 1; margin-left: 45px; }footer > div:last-child { display: flex; gap: 25px; }footer a { text-decoration: none; }.footer-lockup .brand-origin { padding-top: 2px; padding-bottom: 2px; }

[dir="rtl"] .brand-origin { border-left: 0; border-right: 1px solid var(--line); padding-left: 0; padding-right: 15px; }
[dir="rtl"] .site-nav .nav-cta span, [dir="rtl"] .play-link span { margin-left: 0; margin-right: 15px; }
[dir="rtl"] .story-number { left: auto; right: 18px; }[dir="rtl"] .platform-tag { right: auto; left: 16px; }

.game-dialog { width: min(900px, calc(100% - 32px)); padding: 0; color: var(--paper); background: #111217; border: 1px solid #3c3d45; box-shadow: 24px 24px 0 rgba(0,0,0,.55); }.game-dialog::backdrop { background: rgba(4,5,8,.82); backdrop-filter: blur(7px); }.dialog-bar { height: 44px; border-bottom: 1px solid #34353d; display: flex; align-items: center; justify-content: space-between; padding-left: 15px; font: 8px var(--mono); letter-spacing: .1em; }.dialog-bar b { color: var(--lime); }.dialog-bar button { width: 44px; height: 44px; border: 0; border-left: 1px solid #34353d; background: transparent; color: white; cursor: pointer; font-size: 25px; }.dialog-game { position: relative; background: #080910; aspect-ratio: 16/9; overflow: hidden; }.dialog-game iframe { width: 100%; height: 100%; display: block; border: 0; background: #080910; }.dialog-controls { min-height: 55px; display: flex; align-items: center; justify-content: center; gap: 32px; font: 8px var(--mono); color: #777981; }.dialog-controls b { color: var(--paper); margin-left: 6px; }

@media (max-width: 960px) {
  .hero { grid-template-columns: 1fr; padding-top: 90px; }.hero-copy { max-width: 720px; }.hero-machine { width: min(100%, 610px); margin: 0 auto; }.principle-grid { grid-template-columns: repeat(2,1fr); }.manifesto { grid-template-columns: 1fr; gap: 80px; }.manifesto-mark { order: 2; }.site-nav { gap: 18px; }.site-nav a:not(.nav-cta) { display: none; }.story-art { height: 380px; }.story-title-art { font-size: 58px; }
}

@media (max-width: 640px) {
  .site-header, .hero, .games-section, .principles, footer, .stories-inner { width: min(calc(100% - 32px), var(--max)); }
  .site-header { height: 76px; }.brand img { width: 42px; height: 42px; }.brand-copy b { font-size: 16px; }
  .site-header .brand-origin { display: none; }
  .menu-button { display: grid; gap: 4px; }.menu-button span:not(.sr-only) { display: block; width: 24px; height: 2px; background: var(--paper); transition: transform .2s; }
  .site-nav { display: none; position: absolute; left: 0; right: 0; top: 75px; padding: 20px; background: #111217; border: 1px solid #30313a; flex-direction: column; align-items: stretch; }.site-nav.is-open { display: flex; }.site-nav a:not(.nav-cta) { display: block; padding: 12px; }
  .hero { min-height: auto; gap: 70px; padding: 66px 0 90px; }.hero h1 { font-size: clamp(67px, 24vw, 98px); }.hero-lead { font-size: 15px; }.hero-actions { flex-direction: column; align-items: stretch; }.trust-list { display: grid; grid-template-columns: 1fr 1fr; }.hero-machine { transform: none; }.screen { height: 300px; }.screen-title span { font-size: 48px; }.screen-title strong { font-size: 76px; }.machine-message { display: none; }.machine-bottom { grid-template-columns: 1fr auto; }.sticker { right: -12px; }
  .games-section, .principles { padding: 100px 0; }.section-heading { align-items: start; flex-direction: column; }.section-heading h2 { font-size: 54px; }.filters { overflow-x: auto; padding-bottom: 5px; }.filter { flex: 0 0 auto; }.game-grid { grid-template-columns: 1fr; }.game-art { height: 300px; }.art-word { font-size: 46px; }.block-stack, .cards-fan { right: 4%; transform: scale(.82) rotate(-7deg); transform-origin: top right; }.orbit, .corridor-art, .maze-art, .world-art, .wave-token { transform: scale(.78); transform-origin: top right; right: 0; }
  .stories-section { padding: 100px 0; }.story-grid { grid-template-columns: 1fr; }.story-art { height: 340px; }.story-title-art { font-size: 55px; }.grave-moon { transform: scale(.82); transform-origin: top right; }.island-scene { transform: scale(.78); transform-origin: top right; right: -20px; }.next-story { padding: 16px; align-items: flex-start; flex-wrap: wrap; }.next-story > span:last-child { width: 100%; margin-left: 21px; }
  .support-section { min-height: 720px; padding: 100px 16px 75px; }.support-section h2 { font-size: 67px; }.support-lead { font-size: 14px; }.support-stats { margin: 36px 0; }.support-stats div { min-height: 90px; }.support-stats strong { font-size: 31px; }
  .manifesto { padding: 95px 24px; }.manifesto blockquote { font-size: 45px; }.manifesto-mark::before { width: 230px; height: 230px; }.manifesto-mark img { width: 160px; height: 160px; }.principle-grid { grid-template-columns: 1fr; }.principle-grid article { min-height: 250px; }.principle-icon { margin-bottom: 45px; }
  .final-cta { min-height: 520px; }.final-cta h2 { font-size: 78px; }.corner-note { display: none; }
  footer { padding: 35px 0; flex-wrap: wrap; }footer > p { flex-basis: 100%; margin: 0; order: 3; }footer > div:last-child { gap: 14px; }.footer-lockup .brand-origin { display: block; }
  .dialog-controls { gap: 12px; }.dialog-controls span:last-child { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}