@font-face{font-family:Barlow Display;src:url("fonts/barlow-condensed-black.ttf") format("truetype");font-weight:900;font-display:swap}
.studio{--bg:#141615;--white:#f3f5ed;--signal:#c3ff42;background:var(--bg);color:var(--white);font:16px/1.5 "DM Sans",Arial,sans-serif}
.mast,.film,.frames,.end,.game-list a>span{display:flex;align-items:center;justify-content:space-between}
.mast{padding:16px 4vw;border-bottom:1px solid #51534e}
.wordmark{font-size:23px;font-weight:750;letter-spacing:-.085em}.wordmark span{font-weight:400}
.mast nav{display:flex;gap:clamp(12px,3vw,46px);font-size:14px}.studio a:hover{color:var(--signal)}
.screen{position:relative;isolation:isolate;min-height:clamp(575px,78svh,820px);display:flex;align-items:center;overflow:hidden;background:#141615}
.still{position:absolute;inset:0 0 0 39%;z-index:-2;overflow:hidden;background:#333}
.still img{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 38%;animation:slide-in .6s cubic-bezier(.18,.7,.2,1) both}
.still::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#141615 0%,transparent 29%),linear-gradient(0deg,#101310bc,transparent 27%)}
@keyframes slide-in{from{transform:scale(1.055) translateX(1%);opacity:.55}to{transform:none;opacity:1}}
.screen-copy{margin:24px 0 76px 4vw;max-width:52%}
.studio h1,.studio h2{font:900 clamp(80px,12.6vw,205px)/.8 "Barlow Display","Arial Narrow",Impact,sans-serif;letter-spacing:-.035em;margin:0;text-transform:uppercase}
.screen-copy h1 span,.feature h2 span{color:var(--signal)}
.screen-copy p{font-size:clamp(17px,1.5vw,23px);max-width:29ch;line-height:1.38;margin:30px 0 0}
.film{position:absolute;bottom:22px;right:4vw;gap:16px}.frame-name{color:white;text-shadow:0 1px 5px black;font-size:14px;font-weight:650}
.frames{gap:5px}.frames button{background:#161816;border:2px solid transparent;padding:1px;width:clamp(44px,4.2vw,64px);aspect-ratio:1;cursor:pointer}
.frames button[aria-pressed=true]{border-color:var(--signal)}.frames img{width:100%;height:100%;object-fit:cover;display:block}
.feature,.arcade,.bench,.end{padding:clamp(50px,7vw,110px) 5vw}
.feature,.bench{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7vw}
.feature{background:#c3ff42;color:#171d11}.feature h2 span{font:500 .58em Arial;color:inherit;vertical-align:top}
.studio h2{font-size:clamp(66px,8vw,126px)}.section-label{margin:0 0 18px;font-size:14px;font-weight:650}
.feature>div:last-child{max-width:55ch}.feature>div>p:first-child:not(.section-label){font-size:clamp(19px,1.8vw,26px);line-height:1.35;margin-top:0}
.action,.desk-link,.end a{display:inline-block;text-decoration:underline;text-underline-offset:5px;font-weight:650}.feature .action:hover{color:#263d00}
.game-list{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:32px 0 18px}
.game-list a{min-width:0}.game-list img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#282a28}
.game-list a>span{border-bottom:1px solid #595b57;padding:12px 0;font-size:clamp(19px,2vw,32px);letter-spacing:-.04em}
.game-list b{color:var(--signal)}.desk-link{font-size:14px}
.bench{border-top:1px solid #525651;align-items:center}.bench>div:first-child>p:last-child{max-width:34ch}.bench .lab{color:#24251f;min-width:0}
.studio .souvenir{width:90%;max-width:none;margin:0 auto 50px}.studio .souvenir button{color:var(--white)}.studio .souvenir button#download{color:#24251f}
.end{align-items:flex-end;background:#2b302e;color:var(--white);border:0;gap:20px}.end h2{margin-bottom:19px}.end a{font-size:16px}
.studio dialog{color:#24251f}.studio :focus-visible{outline:3px solid #4d82ff;outline-offset:3px}
@media(max-width:740px){.mast{padding:14px 5vw}.mast nav{gap:14px;font-size:12px}.screen{min-height:0;display:grid;padding-top:0}.still{position:relative;inset:auto;grid-area:1/1;width:100%;height:clamp(390px,107vw,590px)}.still::after{background:linear-gradient(0deg,#141615 0%,#141615aa 16%,transparent 60%)}.screen-copy{grid-area:1/1;align-self:end;margin:0 5vw 5px;max-width:94%}.screen-copy h1{font-size:clamp(70px,17vw,115px)}.screen-copy h1 br{display:none}.screen-copy h1 br::after{content:" "}.screen-copy p{font-size:16px;max-width:34ch;margin:12px 0 0}.film{position:static;padding:15px 5vw 24px}.feature,.bench{grid-template-columns:minmax(0,1fr);gap:28px}.game-list{grid-template-columns:1fr}.end{align-items:flex-start;flex-direction:column}.studio .lab-controls{flex-wrap:wrap}.studio .stage{height:310px}}
@media(prefers-reduced-motion:reduce){.still img{animation:none}}
.film{align-items:flex-end;gap:18px}
.next-photo{background:#141615e8;color:#fff;padding:10px 12px;font:inherit;font-size:13px;cursor:pointer}
.play-portals{display:flex;gap:8px}
.play-portals a{position:relative;display:block;width:clamp(120px,12vw,182px);border:1px solid #dce6ce70;background:#121613;overflow:hidden}
.play-portals img{width:100%;aspect-ratio:2/1;object-fit:cover;display:block;transition:transform .2s}
.play-portals a:hover img{transform:scale(1.05)}
.play-portals a[href="/playground"] img{object-fit:contain;background:linear-gradient(160deg,#627e86,#243e47)}
@media(max-width:740px){.screen .film{display:grid;grid-template-columns:minmax(0,1fr)}.film .next-photo{justify-self:end}.film .play-portals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}}
.play-portals span{display:block;padding:5px 10px;color:var(--signal);font-size:14px;font-weight:700}
.self-print{padding:clamp(48px,7vw,100px) 5vw;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:5vw;align-items:center}
.studio .self-print h2{font-size:clamp(48px,6.5vw,104px)}
.self-print figure{margin:0}
.self-print figcaption{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px;padding-top:8px}
.self-print button{background:transparent;color:var(--signal);font:inherit;padding:10px 0}
.inkfield{position:relative;isolation:isolate;overflow:hidden;aspect-ratio:1.15;background:#243e92;--x:64%;--y:43%;--r:0px}
.inkfield::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.23;mix-blend-mode:soft-light;background:repeating-linear-gradient(0deg,#21354c 0 1px,transparent 1px 3px)}
.inkfield .disc{position:absolute;top:8%;right:8%;width:66%;aspect-ratio:1;border-radius:50%;background:#ffba72}
.inkfield .halos{position:absolute;inset:0;background:repeating-radial-gradient(circle at 60% 55%,transparent 0 22px,#efdfb535 23px,transparent 24px 40px)}
.inkfield .portrait{position:absolute;bottom:-5%;left:0;width:100%;height:106%;object-fit:contain;object-position:center bottom}
.ink-overlay{position:absolute;inset:0;background:#bd472e;clip-path:circle(var(--r) at var(--x) var(--y));pointer-events:none}
.ink-overlay .portrait{filter:grayscale(1) contrast(1.22);mix-blend-mode:screen}
.inkfield[data-alt] .ink-overlay{clip-path:inset(0)}
.inkfield .mark{position:absolute;color:#fff2c7;font:22px/1 monospace}.inkfield .tl{left:12px;top:10px}.inkfield .br{right:12px;bottom:10px}
@media(max-width:740px){.self-print{grid-template-columns:minmax(0,1fr);gap:24px}.inkfield{aspect-ratio:1.35}}
.studio.game-page{background:var(--bg);color:var(--white);padding:0;min-height:100vh}
.game-page main{width:min(92%,1240px);margin:auto}
.game-intro{display:flex;align-items:end;justify-content:space-between;gap:32px;padding:clamp(24px,4vw,55px) 0}
.game-page .game-intro h1{font-size:clamp(44px,6vw,92px);max-width:15ch}.game-intro p{max-width:31ch;margin:0}
.game-page h2{font-size:clamp(30px,3.3vw,56px);line-height:.95}
.game-page h2 em{font:inherit;color:var(--signal)}
.game-page :is(.game-shell,.bm-machine,.bm-mission,.bm-notebook,.game-info-card){border:1px solid #50564b;border-radius:0;box-shadow:none;background:#1c201e}
.game-page :is(.game-hud,.bm-hud,.game-controls,.bm-controls){background:#222724;color:#f3f5ed}
.game-page :is(.game-primary,.bm-primary){background:var(--signal);color:#141615;border:0;border-radius:0;box-shadow:none}
.game-page :is(.game-start h2 span,.bm-chapter,.game-eyebrow,.world-small-label){color:var(--signal)}
.game-exits{display:flex;justify-content:space-between;flex-wrap:wrap;padding:28px 0;gap:12px;border-top:1px solid #555c53;color:var(--white);font:600 14px "DM Sans",Arial}
@media(max-width:740px){.film{align-items:center;gap:8px}.play-portals{flex:1}.play-portals a{flex:1;width:auto}.next-photo{font-size:12px;padding:8px 5px}.play-portals span{font-size:12px;padding:4px 6px}.game-intro{display:block}.game-intro p{margin-top:12px;font-size:14px}.game-page main{width:94%}.game-page .game-intro h1{max-width:none}.game-page .game-start h2{font-size:27px}.game-page .mast nav{gap:12px}}
.screen button.still{padding:0;border:0;cursor:crosshair;--r:0px;--x:50%;--y:50%}
.screen button.still:focus-visible{outline:3px solid var(--signal);outline-offset:-4px}
.still .cover-ink{position:absolute;inset:0;pointer-events:none;background:#ae432e;clip-path:circle(var(--r) at var(--x) var(--y))}
.still .cover-ink img{filter:grayscale(1) contrast(1.18);mix-blend-mode:screen}
.still[data-alt] .cover-ink{clip-path:inset(0)}
.still::after,.screen-copy{pointer-events:none}
@media(prefers-reduced-motion:reduce){.screen .still img{animation:none}}
