@font-face{font-family:Manrope;src:url('/fonts/Manrope.ttf') format('truetype');font-weight:200 800;font-display:swap}*{box-sizing:border-box}html{scroll-behavior:auto}body{margin:0;background:#0a0a0e;color:#eeede9;font-family:Manrope,'PingFang SC',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid #c9dc9c;outline-offset:4px}header{position:fixed;inset:0 0 auto;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:24px 35px;font-size:13px;letter-spacing:.07em}header>a{font-size:16px}.dot{color:#8bac0f;margin-left:12px;font-size:9px}nav{display:flex;gap:30px;align-items:center}nav button{font-size:12px}#scene{height:320svh}.sticky{height:100svh;position:sticky;top:0;overflow:hidden}.sky{position:absolute;inset:0;background:radial-gradient(ellipse at 30% 0%,#171627,transparent 70%);pointer-events:none}.grid{position:absolute;left:50%;top:68%;width:200%;height:110%;background-image:radial-gradient(#383348 1px,transparent 1px);background-size:35px 35px;transform-origin:center top;opacity:.6;pointer-events:none}.intro{position:absolute;top:20%;left:50%;width:min(90%,700px);transform:translateX(-50%);text-align:center}.eyebrow{color:#8bac0f;letter-spacing:.25em;font:12px monospace}h1{font-size:clamp(36px,4.5vw,66px);line-height:1.4;font-weight:500;letter-spacing:.04em;margin:30px 0}h1 span{color:#8bac0f}.intro-note{font-size:16px;color:#b9b7af;margin:24px 0}#start{color:#9994a3;font-size:12px;margin-top:22px;padding:14px}.cart-position,.machine-position{position:absolute;left:50%;top:50%;will-change:transform,opacity}.cart-position{z-index:9}.machine-position{z-index:10}.cartridge{position:relative;width:170px;height:205px;background:linear-gradient(145deg,#54535a,#303037);border-radius:8px 8px 3px 3px;border-top:4px solid #73727a;box-shadow:inset -8px 0 0 #222229,0 15px 40px #0006;padding:22px 18px;transform:rotate(-4deg)}.cart-grooves{position:absolute;top:5px;left:12px;right:12px;height:4px;background:repeating-linear-gradient(90deg,#25252b 0 36px,transparent 36px 42px)}.cart-label{border:3px solid #77757d;background:#171720;border-radius:3px;color:#8bac0f;height:139px;padding:12px;text-align:center;box-shadow:inset 0 0 22px #000}.cart-label>span{font:6px monospace;color:#c9dc9c;letter-spacing:.08em}.cart-label b{font-size:27px;display:block;margin:10px 0;line-height:1.2}.cart-label small{font:6px monospace;color:#939878}.cart-notch{position:absolute;left:25px;right:25px;bottom:13px;height:6px;border-radius:4px;background:#24242a}.machine{position:relative;width:300px;height:496px;border-radius:14px 14px 14px 62px;background:linear-gradient(160deg,#d7d4ca,#b9b6ac);box-shadow:inset 0 3px 0 #ffffff99,inset 0 -6px 0 #0003,0 40px 80px -20px #000b;padding:22px 20px;color:#4a4750}.machine-note{font:8px monospace;letter-spacing:.15em;text-align:center;margin-bottom:8px;color:#8a8780}.bezel{background:#5a5560;border-radius:10px 10px 34px 10px;padding:14px 16px 18px}.power{display:flex;align-items:center;gap:6px;margin-bottom:8px;font:6px monospace;color:#c9a0a0;letter-spacing:.1em}.power i{width:7px;height:7px;border-radius:50%;background:#7a1f1f}.screen{position:relative;aspect-ratio:10/9;background:#8ba00a;border-radius:4px;overflow:hidden;box-shadow:inset 0 0 22px #0f380f80}.screen:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,#0f380f10 0 1px,transparent 1px 3px);pointer-events:none;z-index:6}.boot{position:absolute;inset:0;background:#c9dc9c;z-index:5;pointer-events:none}.os{position:absolute;inset:0;padding:12px 14px 10px;display:flex;flex-direction:column;color:#0f380f;opacity:0;font-family:monospace,'PingFang SC',sans-serif}.os-bar{display:flex;justify-content:space-between;border-bottom:2px solid #0f380f66;padding-bottom:6px;margin-bottom:7px;font-size:10px}.os-bar span{font-size:8px}.menu{display:flex;flex-direction:column;gap:3px}.menu [data-choice]{text-align:left;padding:5px 6px;display:flex;align-items:center;gap:7px;font-size:12px;min-height:26px;color:#0f380f}.menu [data-choice]>span{width:8px;font-size:9px}.menu small{margin-left:auto;font-size:7px;opacity:.7}.menu [data-choice][aria-selected=true]{background:#0f380f;color:#c9dc9c}.status{font-size:8px;line-height:1.5;margin-top:auto;padding-top:8px}.screen-help{font-size:7px;opacity:.75;margin:7px 0 0}.machine-brand{text-align:center;font-size:11px;margin-top:14px;letter-spacing:.1em}.machine-brand span{color:#8bac0f;font-size:6px;padding-left:6px}.controls{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding:0 6px}.pad{width:60px;height:60px;position:relative}.pad-v{position:absolute;left:20px;top:6px;width:20px;height:48px;border-radius:4px;background:#2b2b30;box-shadow:inset 0 -3px #0005}.pad-h{position:absolute;left:6px;top:20px;width:48px;height:20px;border-radius:4px;background:#2b2b30}.pad button{position:absolute;padding:0;color:#66636b;font-size:6px;z-index:2}.up{left:20px;top:6px;width:20px;height:22px}.down{left:20px;bottom:6px;width:20px;height:22px}.left{left:6px;top:20px;width:22px;height:20px}.right{right:6px;top:20px;width:22px;height:20px}.pad-note{position:absolute;bottom:-17px;left:-15px;width:90px;text-align:center;font:6px monospace;color:#8a8780;letter-spacing:.15em}.ab{position:relative;display:flex;gap:14px;transform:rotate(-24deg)}.ab button{width:30px;height:30px;border-radius:50%;background:#8e2e57;box-shadow:inset 0 -3px #0005;display:grid;place-items:center;font:9px monospace;color:#e6a4c9}.ab>span{position:absolute;bottom:-15px;left:-20px;width:130px;text-align:center;font:6px monospace;letter-spacing:.12em;color:#8a8780}.ab button:active,.small-controls button:active{transform:translateY(2px);box-shadow:none}.small-controls{display:flex;gap:14px;justify-content:center;margin-top:16px;transform:rotate(-24deg)}.small-controls>div{display:flex;flex-direction:column;align-items:center;gap:4px}.small-controls button{width:34px;height:11px;border-radius:6px;background:#7a7770;box-shadow:inset 0 -2px #0003}.small-controls span{font:6px monospace;color:#8a8780;letter-spacing:.12em}.speaker{position:absolute;right:22px;bottom:24px;display:flex;gap:6px;transform:rotate(-24deg)}.speaker i{width:4px;height:22px;background:#8d8a82;border-radius:3px}.outside-hint{position:absolute;bottom:3%;left:0;right:0;text-align:center;color:#aaa5b1;font-size:12px;line-height:1.9;opacity:0}.outside-hint span{font-size:11px;color:#77737e}footer{padding:25px 35px;border-top:1px solid #292630;display:flex;justify-content:space-between;font-size:11px;color:#a8a4ae}.leaving .sticky{transition:opacity .3s;opacity:0}@media(max-width:600px){header{padding:20px;font-size:12px}header>a{font-size:13px}nav{gap:16px}nav>a{display:none}.intro{top:18%}h1{font-size:38px}.intro-note{font-size:13px}footer{padding:22px 20px;gap:20px}footer>span:last-child{display:none}.outside-hint{font-size:10px;bottom:2%}}@media(prefers-reduced-motion:reduce){#scene{height:100svh}.intro,.cart-position,.grid{display:none}.machine-position{transform:translate(-50%,-50%)!important}.boot{display:none}.os,.outside-hint{opacity:1!important}}
@media(min-width:601px){.outside-hint{left:35px;right:auto;bottom:30px;text-align:left;}}

/* Direct cartridge insertion replaces scroll sequencing. */
#scene{height:100svh;min-height:620px;}.sticky{position:relative;height:100%;}.cart-position{left:0;top:0;z-index:20;cursor:grab;touch-action:none;user-select:none;outline-offset:8px;}.cart-position.dragging{cursor:grabbing;}.cart-position .cartridge{transform:none;}.machine-position{left:0;top:0;transform:none!important;}.slot{position:absolute;left:75px;top:-8px;width:150px;height:13px;background:#27252b;border:3px solid #8f8c84;border-radius:4px;box-shadow:inset 0 2px 4px #0008;transition:border-color .2s,box-shadow .2s;}.slot span{position:absolute;left:0;right:0;top:-30px;text-align:center;font-size:9px;color:#a5a19a;letter-spacing:.1em;white-space:nowrap;}.near-slot .slot{border-color:#c9dc9c;box-shadow:0 0 16px #8bac0f88;}.near-slot .slot span{color:#c9dc9c;}.inserted .slot span{opacity:0;}.screen{background:#66713a;transition:background .3s;}.inserted .screen{background:#8ba00a;}.boot{display:block;opacity:0;transform:translateY(-100%);}.os{opacity:0!important;}.inserted .os{opacity:1!important;transition:opacity .4s;}.outside-hint{left:0;right:0;bottom:20px;text-align:center;opacity:1!important;}#instruction{font-size:13px;color:#c7c2ce;}#secondary{font-size:11px;}header{position:absolute;}footer{display:none;}@media(max-width:600px){#scene{min-height:580px;}.outside-hint{bottom:20px;}#instruction{font-size:12px;}#secondary{font-size:10px;}.grid{top:75%;}}@media(prefers-reduced-motion:reduce){.cart-position{display:block;}.machine-position{transform:none!important;}.os{opacity:0!important;}.inserted .os{opacity:1!important;}.boot{display:block;}}

/* v13: physical controls only, enlarged direction pad. */
.menu [data-choice]{cursor:default;pointer-events:none;}
.controls{margin-top:25px;padding:0 14px 0 36px;align-items:center;}
.pad{transform:scale(1.3);transform-origin:center;}
.ab{margin-right:0;}.ab button{width:34px;height:34px;}
.speaker{bottom:26px;}.cart-position[aria-disabled=true]{cursor:wait;}.inserted .cart-position{cursor:grab;}

/* Classic layout restored: D-pad, B/A, SELECT/START. */
.controls{margin-top:14px;padding:0 6px;}.pad{transform:none;}.ab button{width:30px;height:30px;}.speaker{bottom:24px;}
.small-controls button:focus-visible{outline-offset:4px;}.small-controls button:hover{background:#68655f;}

/* Personal boot signature, inspired by the original monochrome handheld. */
.boot-logo{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#0f380f;pointer-events:none;text-align:center;font-family:monospace;filter:none;}
.boot-logo[hidden]{display:none!important;}.boot-logo strong{font-size:27px;font-weight:900;letter-spacing:.06em;line-height:1.1;text-shadow:1px 0 currentColor;}.boot-logo>span{font-size:11px;font-weight:700;letter-spacing:.22em;margin-top:8px;}.booting .os{opacity:0!important;transition:none;}.booting .slot span{opacity:0;}.booting .screen{background:#8ba00a;}
/* Larger D-pad with wider directional hit regions. */
.controls{padding-left:16px;}
.pad{width:82px;height:82px;transform:none;}
.pad-v{left:28px;top:5px;width:26px;height:72px;border-radius:5px;}
.pad-h{left:5px;top:28px;width:72px;height:26px;border-radius:5px;}
.pad button{font-size:8px;}
.pad .up{left:23px;top:0;width:36px;height:32px;}
.pad .down{left:23px;bottom:0;width:36px;height:32px;}
.pad .left{left:0;top:26px;width:32px;height:30px;}
.pad .right{right:0;top:26px;width:32px;height:30px;}
.pad-note{left:-4px;width:90px;bottom:-13px;}
.small-controls{margin-top:17px;}

/* v31: approved Blingee pixel city, river fading into black. */
body{background:#000;}
.sky{background:#000 url('/assets/portal/pixel-city-v31.webp') center top/100% 100% no-repeat;}
.grid{display:none;}
header{text-shadow:0 1px 5px #000,0 0 12px #000;}
.slot span{color:#e0dce7;text-shadow:0 1px 4px #000;}
.outside-hint{z-index:21;text-shadow:0 1px 5px #000;}
@media(max-width:600px){.sky{background-size:auto 78%;background-position:center top;}}

/* v32: animated pixel sky; background canvas never intercepts controls. */
.sky{background-image:url('/assets/portal/pixel-city-v32.webp');}
#pixel-night{display:block;width:100%;height:100%;pointer-events:none;image-rendering:pixelated;}
