@import url('/assets/fonts/fonts.css');
:root{color-scheme:dark;--bg:#111715;--panel:#18201d;--edge:#344139;--text:#e4e9de;--dim:#a3aea1;--accent:#d0f78b;--mono:'IBM Plex Mono',monospace;--heading:'Saira Condensed',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:1.7}a{color:inherit;text-underline-offset:4px}button{font:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.55}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button[hidden],[hidden]{display:none!important}.skip{position:absolute;left:20px;top:-80px;z-index:20;background:var(--accent);color:var(--bg);padding:10px}.skip:focus{top:10px}.wrap{max-width:1280px;margin:auto;padding:0 48px}.nav{display:flex;align-items:center;justify-content:space-between;min-height:96px;border-bottom:1px solid var(--edge);gap:24px}.brand{text-decoration:none;font:700 27px/1 var(--heading);letter-spacing:.04em;display:flex;gap:10px;align-items:center}.brand img{width:31px;height:31px}.brand small{font:10px var(--mono);color:var(--dim);letter-spacing:0;margin-left:6px;border:1px solid var(--edge);padding:5px 7px}.navlinks{display:flex;align-items:center;gap:30px;font:11px var(--mono)}.navlinks a{text-decoration:none}.navlinks a:hover{color:var(--accent)}.navlinks .official{color:var(--accent)}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:36px;align-items:center;padding:64px 0 48px}.eyebrow{font:10px var(--mono);color:var(--accent);letter-spacing:.14em;text-transform:uppercase;display:flex;gap:10px;align-items:center}.dot{width:6px;height:6px;background:var(--accent);border-radius:50%;display:inline-block}.hero h1{font:600 clamp(72px,8vw,116px)/.88 var(--heading);letter-spacing:-.015em;margin:24px 0}.hero h1 span{color:var(--accent)}.intro{max-width:430px;color:var(--dim);font-size:16px;line-height:1.8}.byline{font:10px var(--mono);color:var(--dim);margin-top:25px}.lab-visual{position:relative;height:370px;border:1px solid var(--edge);background:radial-gradient(ellipse at center,#30443444,transparent 65%),linear-gradient(#8dba7710 1px,transparent 1px),linear-gradient(90deg,#8dba7710 1px,transparent 1px);background-size:auto,26px 26px,26px 26px;overflow:hidden;border-radius:3px}.visual-top,.visual-bottom{position:absolute;left:18px;right:18px;display:flex;justify-content:space-between;font:9px var(--mono);color:var(--dim);letter-spacing:.08em}.visual-top{top:17px}.visual-bottom{bottom:17px}.lab-visual>svg{height:286px;width:100%;margin-top:41px}.visual-tag{position:absolute;font:9px var(--mono);color:var(--accent);border-left:1px solid var(--accent);padding-left:8px;left:65%;top:37%}.visual-tag.two{left:12%;top:64%;color:var(--dim);border-color:var(--dim)}.specs{display:flex;gap:30px;padding:20px 0;border-top:1px solid var(--edge);border-bottom:1px solid var(--edge);font:10px var(--mono);color:var(--dim)}.specs b{color:var(--text);font-weight:400}.player-section{margin:44px 0 64px;scroll-margin-top:20px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px}.section-head h2{font:600 24px var(--heading);margin:0;letter-spacing:.03em}.section-head .small{font:9px var(--mono);color:var(--dim)}.player{border:1px solid #526447;background:#0b100d;border-radius:4px;overflow:hidden}.toolbar{min-height:54px;display:flex;align-items:center;justify-content:space-between;padding:9px 18px;gap:12px;border-bottom:1px solid var(--edge);background:#1c251e}.toolbar-label{display:flex;gap:9px;align-items:center;font:10px var(--mono);letter-spacing:.07em}.toolbar-label .dot{background:#768a6b}.tools{display:flex;gap:6px}.tools button{background:transparent;border:1px solid var(--edge);border-radius:3px;color:var(--text);font:10px var(--mono);padding:7px 10px}.tools button:hover{border-color:var(--accent);color:var(--accent)}.stage{position:relative;min-height:420px;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 100%,#31432c55,transparent 65%)}.cover{text-align:center;padding:48px 24px;max-width:620px}.cover .cross{width:42px;height:42px;display:grid;place-items:center;margin:0 auto 20px;border:1px solid #667858;color:var(--accent);font:32px var(--heading);border-radius:50%}.cover h3{font:600 34px var(--heading);margin:0 0 9px}.cover p{font-size:13px;color:var(--dim);max-width:440px;margin:0 auto 22px}.primary{display:inline-flex;align-items:center;justify-content:center;gap:30px;background:var(--accent);color:#162110;border:0;border-radius:3px;padding:15px 24px;min-height:50px;font:500 13px var(--mono);text-decoration:none}.primary:hover{background:#e1ffac}.cover small{display:block;margin-top:14px;font:9px var(--mono);color:var(--dim)}.frame-slot{width:100%;height:clamp(620px,78vh,980px)}iframe{display:block;width:100%;height:100%;border:0}.player:fullscreen{width:100vw;height:100dvh;border:0;border-radius:0;display:flex;flex-direction:column}.player:fullscreen .stage{flex:1;min-height:0}.player:fullscreen .frame-slot{height:100%;position:absolute;inset:0}.player:fullscreen .toolbar{flex:none}.statusbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:11px 18px;font:10px var(--mono);color:var(--dim);border-top:1px solid var(--edge)}.statusbar a{color:var(--text)}.loading-note{color:var(--accent)}.section{border-top:1px solid var(--edge);padding:38px 0 50px}.section-title{display:flex;gap:18px;align-items:baseline;margin-bottom:24px}.num{font:10px var(--mono);color:var(--accent)}h2{font:600 33px var(--heading);letter-spacing:.01em;margin:0}.section-title>a{margin-left:auto;font:11px var(--mono);color:var(--dim)}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.step{padding-right:26px;border-right:1px solid var(--edge)}.step:last-child{border:0}.step>span{font:10px var(--mono);color:var(--dim)}h3{font:600 23px var(--heading);margin:12px 0 8px}.step p,.about-copy p{color:var(--dim);font-size:14px;line-height:1.85;margin:0}.about-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:55px}.about-copy p+p{margin-top:15px}.fact-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}.chip{font:9px var(--mono);padding:6px 9px;background:var(--panel);border:1px solid var(--edge);color:var(--dim)}details{border-bottom:1px solid var(--edge);padding:19px 0}summary{cursor:pointer;font-size:14px;list-style:none;display:flex;justify-content:space-between;gap:20px}summary:after{content:'+';color:var(--accent);font:20px var(--mono)}details[open] summary:after{content:'−'}details p{max-width:780px;color:var(--dim);font-size:14px}.footer{border-top:1px solid var(--edge);padding:28px 0 35px;display:flex;justify-content:space-between;gap:25px;font:10px/1.9 var(--mono);color:var(--dim)}.footer nav{display:flex;gap:20px;flex-wrap:wrap}.footer a{text-decoration:none}.doc{max-width:800px;margin:60px auto 90px;min-height:50vh}.doc h1{font:600 60px/1 var(--heading);margin:16px 0 30px}.doc h2{font-size:28px;margin-top:30px}.doc p,.doc li{color:var(--dim);line-height:1.85}.doc a{color:var(--accent)}.doc strong{color:var(--text)}.doc .back{font:11px var(--mono)}.doc ul,.doc ol{padding-left:23px}dialog{max-width:440px;background:var(--panel);color:var(--text);border:1px solid var(--edge);padding:28px;border-radius:6px}dialog::backdrop{background:#000b}dialog h2{font-size:30px}dialog p{color:var(--dim);font-size:14px}.dialog-actions{display:flex;gap:12px;justify-content:flex-end}.secondary{background:transparent;border:1px solid var(--edge);color:var(--text);padding:10px 18px;border-radius:3px;font:12px var(--mono)}
@media(max-width:900px){.wrap{padding:0 26px}.hero{gap:24px;padding-top:44px}.hero h1{font-size:82px}.navlinks{gap:18px}.lab-visual{height:330px}.lab-visual>svg{height:250px}.specs{gap:22px}.frame-slot{height:75vh;min-height:550px}.brand small{display:none}}@media(max-width:600px){.wrap{padding:0 19px}.nav{min-height:77px;gap:12px}.brand{font-size:24px}.brand img{width:27px}.navlinks{gap:14px;font-size:10px}.navlinks .official{display:none}.hero{grid-template-columns:1fr;padding:35px 0 24px;gap:25px}.hero h1{font-size:94px;margin:22px 0}.intro{font-size:15px;max-width:100%}.byline{margin-top:18px}.lab-visual{height:230px}.lab-visual>svg{height:200px;margin-top:17px}.visual-tag{top:32%}.visual-tag.two{top:65%}.specs{flex-wrap:wrap;gap:12px 22px;font-size:9px;padding:15px 0}.player-section{margin:30px 0 44px}.section-head .small{font-size:8px}.toolbar{padding:9px 10px;flex-wrap:wrap}.toolbar-label{font-size:9px}.tools button{padding:7px 8px;font-size:9px}.stage{min-height:370px}.cover{padding:35px 18px}.cover h3{font-size:29px}.statusbar{padding:10px;font-size:9px;align-items:flex-start}.statusbar a{white-space:nowrap}.frame-slot{height:80dvh;min-height:580px}.steps,.about-grid{grid-template-columns:1fr;gap:22px}.step{border:0;border-bottom:1px solid var(--edge);padding:0 0 22px}.section{padding:28px 0 35px}.section-title{gap:12px}.section-title>a{font-size:9px}.section-title h2{font-size:29px}.footer{flex-direction:column;gap:16px}.doc{margin:40px auto 60px}.doc h1{font-size:48px}.doc p{font-size:14px}}@media(orientation:landscape) and (max-height:600px){.frame-slot{height:calc(100dvh - 120px);min-height:300px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.hero-play{margin-top:12px;min-width:195px}.hero .byline{margin-top:22px}
.game-subtitle{font:500 18px/1.4 var(--heading);letter-spacing:.03em;color:var(--accent);margin:0 0 18px}.mode-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:35px;align-items:start}.game-preview{margin:0}.game-preview img{width:100%;height:auto;border:1px solid var(--edge);border-radius:4px}.game-preview figcaption{color:var(--dim);font:10px/1.7 var(--mono);margin-top:10px}.mode-grid h3:first-child{margin-top:0}.mode-grid p+p{margin-top:18px}.breadcrumbs{display:flex;gap:12px;flex-wrap:wrap;font:11px/1.7 var(--mono);margin-bottom:22px;color:var(--dim)}.guide-links{border-top:1px solid var(--edge);margin-top:40px;padding-top:16px}.guide-links h2{font-size:25px;margin-top:10px}.guide-links nav{display:flex;gap:14px;flex-wrap:wrap;margin-top:16px;font-size:13px}.table-scroll{overflow:auto}table{border-collapse:collapse;font-size:13px;width:100%;margin:20px 0}th,td{text-align:left;vertical-align:top;padding:14px;border:1px solid var(--edge)}th{color:var(--accent);font-weight:500}td{color:var(--dim)}@media(max-width:650px){.mode-grid{grid-template-columns:1fr}.navlinks{gap:12px}.navlinks a{font-size:9px}.game-subtitle{font-size:17px}}
/* The same layout serves native fullscreen and the browser viewport fallback. */
.player.is-expanded{position:fixed;inset:0;z-index:1000;width:100%;height:100vh;height:100dvh;max-width:none;max-height:none;border:0;border-radius:0;display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);overscroll-behavior:contain}
.player.is-expanded .toolbar,.player.is-expanded .statusbar{flex:none}
.player.is-expanded .stage{flex:1;min-height:0}
.player.is-expanded .frame-slot{position:absolute;inset:0;height:100%;min-height:0}
@media(max-width:600px){.player.is-expanded .toolbar{gap:6px}.player.is-expanded .toolbar-label{font-size:8px}.player.is-expanded .tools button{min-height:36px}.player.is-expanded .statusbar{font-size:8px;gap:8px}}
/* Fallback fonts must not enlarge a grid track before the local heading font loads. */
.hero{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
.hero>*{min-width:0}
.hero h1{overflow-wrap:anywhere}
@media(max-width:600px){.hero{grid-template-columns:minmax(0,1fr)}}