@font-face{font-family:Pixel;src:url('assets/PressStart2P-Regular.ttf') format('truetype');font-display:swap}
:root{color-scheme:dark;--ink:#111210;--paper:#eee8d7;--accent:#e8b744}*{box-sizing:border-box}body{margin:0;background:#080908;color:var(--paper);font:15px/1.5 var(--type-reading)}button,a{font:inherit}button{cursor:pointer}a{color:inherit}button{color:inherit}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.demo-bar{max-width:1600px;margin:auto;padding:10px 24px;display:flex;justify-content:space-between;gap:16px;font:11px var(--type-reading);color:#a4a69d}.demo-bar a{text-decoration:none}.game{max-width:1600px;margin:0 auto 24px;border:1px solid #45463e;background:#111210}.game-header{padding:18px 28px;display:flex;align-items:center;gap:30px;border-bottom:2px solid var(--accent);min-height:85px}.brand{padding:0;border:0;background:none;width:128px;flex:none}.brand img{display:block;width:100%;filter:grayscale(1) invert(1) contrast(4);mix-blend-mode:screen}.game-header nav{display:flex;gap:22px;flex:1}.game-header button:not(.brand){border:0;background:none;font:9px/1.6 var(--type-arcade);padding:8px 0}.game-header nav span{color:var(--accent)}#sound{color:var(--accent)}#screen{position:relative;min-height:620px}.game-footer{display:flex;gap:20px;justify-content:space-between;align-items:center;padding:17px 28px;border-top:1px solid #484b40;font:9px/1.6 var(--type-arcade);color:#b6b8a9}.game-footer button{border:0;background:none;font:inherit;color:#b6b8a9}.title-screen{min-height:620px;padding:48px 7% 34px;display:flex;flex-direction:column;align-items:center;text-align:center;background:#121410}.eyebrow{font:10px/1.8 var(--type-arcade);letter-spacing:.07em;color:var(--accent);margin:0 0 18px}.title-screen h1{font:clamp(30px,6.4vw,82px)/1.35 var(--type-arcade);margin:0 0 14px;letter-spacing:-.06em}.title-screen .tag{margin:0 0 26px;font-size:16px;letter-spacing:.08em}.title-worlds{display:grid;grid-template-columns:repeat(3,1fr);width:100%;gap:14px;margin:12px 0 30px}.title-worlds button{padding:0;border:1px solid #62614c;background:#171913;text-align:left}.title-worlds img{width:100%;aspect-ratio:16/9;object-fit:cover;image-rendering:pixelated;display:block}.title-worlds span{font:9px/1.6 Pixel;display:block;padding:13px;color:var(--paper)}.pixel-button{background:var(--accent);color:#10130f;border:0;box-shadow:4px 4px 0 #615137;padding:17px 22px;font:11px/1.6 var(--type-arcade);text-decoration:none;display:inline-flex;gap:12px;align-items:center;justify-content:center}.pixel-button::before{content:"▶";font-family:var(--type-reading)}.pixel-button.secondary{background:transparent;color:var(--paper);box-shadow:none;border:1px solid #858477}.title-actions{display:flex;gap:18px;align-items:center}.return-note{font-size:11px;color:#aaa996;margin:15px 0 0}.selection{padding:40px 40px 28px}.selection h1,.shop-screen h1{font:clamp(18px,2.5vw,32px)/1.55 Pixel;margin:0 0 12px}.selection>p,.shop-screen>p{color:#b8b8aa;margin:0 0 26px}.memory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.memory-card{padding:0;border:2px solid #3d4237;background:#1b1e17;text-align:left;transition:border-color .15s}.memory-card:hover{border-color:var(--color)}.memory-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;image-rendering:pixelated}.memory-card .label{display:block;padding:18px}.memory-card strong{display:block;font:10px/1.7 Pixel;color:var(--color)}.memory-card small{display:block;color:#b7bbad;margin-top:7px;font-size:13px}.scene{position:relative;overflow:hidden;aspect-ratio:16/9;isolation:isolate;touch-action:pan-y}.scene-bg{display:block;width:100%;height:100%;object-fit:cover;image-rendering:pixelated}.scene-title{position:absolute;left:3%;top:4%;background:#121310ed;padding:14px 18px;border-left:4px solid var(--accent);max-width:74%}.scene-title strong{display:block;font:clamp(10px,1.45vw,18px)/1.6 Pixel;color:var(--accent)}.scene-title small{display:block;font-size:12px;color:#d2ccbc;margin-top:5px}.actor{position:absolute;height:51%;aspect-ratio:0.3;bottom:-1%;left:12%;background:url('assets/player-atlas.png') no-repeat;background-size:500% 100%;image-rendering:pixelated;transition:left .7s steps(8);pointer-events:none;z-index:2}.actor.walking{animation:step .16s steps(2) 5}.hotspot{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:8px;border:0;background:transparent;padding:14px;z-index:3}.hotspot .target{width:52px;height:45px;border:3px solid var(--accent);box-shadow:0 0 0 3px #10110b88;animation:pulse 2s steps(2) infinite}.hotspot span:last-child{font:9px/1.5 Pixel;background:var(--accent);color:#12150e;padding:10px 12px;white-space:nowrap}.scene-actions{position:absolute;right:3%;bottom:5%;display:flex;gap:10px;z-index:4}.scene-actions .pixel-button{font-size:9px;padding:13px 16px}.scene-actions .secondary{background:#10130fe8}.scene-caption{position:absolute;bottom:5%;left:3%;max-width:36%;font:10px/1.7 Pixel;color:#eee8d7;text-shadow:2px 2px #000}.scene-meta{display:flex;justify-content:space-between;gap:20px;padding:16px 28px;background:#1c1e17;font-size:12px}.scene-meta strong{color:var(--accent)}.shop-screen{padding:35px}.products{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:15px}.product-card{background:#1c1f18;border:1px solid #4d5345;padding:15px;text-align:center;color:var(--paper)}.product-card strong{display:block;font:9px/1.8 Pixel}.product-card .mini-actor{height:210px;margin:0 auto 12px}.mini-actor{height:300px;aspect-ratio:0.3;background:url('assets/player-atlas.png') no-repeat;background-size:500% 100%;image-rendering:pixelated}.product-card small{display:block;margin-top:8px;color:#aeb7a1}dialog{width:min(960px,94vw);max-height:90svh;overflow:auto;border:3px solid var(--accent);padding:0;background:#171a14;color:var(--paper)}dialog::backdrop{background:#050805cc}.dialog-head{padding:20px 25px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #4f5645;font:11px/1.6 Pixel}.dialog-head button{font:20px var(--type-reading);background:transparent;border:0}.item-layout{display:grid;grid-template-columns:1fr 1fr}.item-picture{background:#eae7df;min-height:410px;display:flex;align-items:center;justify-content:center;padding:25px}.item-picture img{width:100%;max-height:420px;object-fit:contain;mix-blend-mode:multiply}.item-picture .mini-actor{height:390px}.item-copy{padding:30px}.item-copy h2{font:19px/1.7 Pixel;margin:0 0 18px}.item-copy p{color:#cccdbd;font-size:14px;line-height:1.6}.item-copy .sub{font:9px/1.8 Pixel;color:var(--accent)}.item-copy .pixel-button{font-size:9px;padding:13px;margin-top:12px}.size-row{display:flex;gap:8px;margin:17px 0}.size-row button{background:transparent;border:1px solid #8a8d7d;width:43px;height:39px;font:11px Pixel}.size-row button[aria-pressed=true]{background:var(--accent);color:#111}.item-actions{display:flex;flex-wrap:wrap;gap:12px}.item-actions button{background:transparent;border:1px solid #7f866f;padding:10px;font-size:12px}.item-note{font-size:11px!important;color:#9ea594!important}.collection-body{padding:26px;min-height:170px}.collection-item{display:grid;grid-template-columns:55px 1fr auto;align-items:center;gap:20px;padding:14px 0;border-bottom:1px solid #424a39}.collection-item .mini-actor{height:120px}.collection-item strong{font:10px/1.8 Pixel}.collection-item p{font-size:12px;color:#b6c0a8}.collection-item button{padding:8px 12px;background:none;border:1px solid #667058}.collection-item a{font-size:12px}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);padding:14px 20px;background:#ece7d3;color:#101610;font:11px/1.6 Pixel;display:none;z-index:20}.toast.visible{display:block}.reduced *{animation:none!important;transition:none!important}@keyframes pulse{50%{opacity:.55}}@keyframes step{50%{transform:translateY(-3px)}}
.role-icon{width:24px;height:24px;flex:none;display:inline-block;vertical-align:middle}
.actor.cast-actor{background:none;aspect-ratio:2/3;height:53%;bottom:0}
.cast-actor img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}
.item-picture[data-view=character]{flex-direction:column;background:#222820;padding:18px 20px;gap:10px;color:var(--paper)}
.fitting-heading{font:8px/1.8 Pixel;align-self:flex-start;color:var(--accent)}
.fitting-stage{height:310px;display:flex;justify-content:center;align-items:center;width:100%}
.fitting-stage .cast-sprite{height:100%;aspect-ratio:2/3}
.item-picture .cast-sprite img{height:100%;width:100%;max-height:none;mix-blend-mode:normal;object-fit:contain;image-rendering:pixelated}
.item-picture .fitting-stage .mini-actor{height:290px}
.fitting-caption{display:flex;align-items:center;gap:12px;width:100%;padding:8px 0;border-top:1px solid #4c5747}
.fitting-caption .role-icon{color:var(--accent);width:28px;height:28px}
.fitting-caption strong{display:block;font:11px/1.7 Pixel}
.fitting-caption small{display:block;font-size:10px;letter-spacing:.04em;margin-top:4px;color:#b6c0ad}
.model-select{display:flex;width:100%;gap:6px}
.model-select button{display:flex;flex:1;align-items:center;flex-direction:column;justify-content:center;gap:6px;padding:9px 4px;min-height:62px;background:#121810;border:1px solid #58634f;font-size:10px;color:#dedccc}
.model-select button[aria-pressed=true]{border-color:var(--accent);background:var(--accent);color:#101710}
.model-select .role-icon{width:20px;height:20px}
.shop-product-photo{width:100%;height:210px;object-fit:contain;background:#eae7df;display:block;margin-bottom:15px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(max-width:850px){.game-header{padding:16px;gap:20px;flex-wrap:wrap}.game-header nav{gap:18px;justify-content:flex-end}.game-header nav button{font-size:8px!important}.brand{width:104px}#sound{display:none}.title-screen{padding:38px 20px;min-height:580px}.title-screen h1{font-size:42px}.title-worlds{gap:7px}.title-worlds span{font-size:7px;padding:9px}.selection{padding:28px 22px}.memory-grid{grid-template-columns:repeat(2,1fr);gap:15px}.products{grid-template-columns:repeat(3,1fr)}.game-footer{font-size:7px;padding:14px}.scene-title{padding:9px 12px}.scene-title small{font-size:10px}.scene-caption{display:none}.hotspot .target{width:35px;height:30px}.hotspot span:last-child{font-size:7px;padding:7px}.scene-actions .pixel-button{font-size:7px;padding:10px}.scene-meta{padding:12px 16px;font-size:11px}#screen{min-height:0}}
@media(max-width:550px){.demo-bar{font-size:9px;padding:8px 12px}.demo-bar span:last-child{display:none}.game{margin-bottom:0;border-left:0;border-right:0}.game-header{gap:12px;padding:12px}.brand{width:88px}.game-header nav{gap:12px;flex-wrap:wrap;max-width:230px}.game-header nav button{font-size:7px!important}.title-screen{min-height:610px}.title-screen h1{font-size:32px}.title-screen .tag{font-size:12px}.title-worlds{grid-template-columns:1fr;gap:8px;margin-top:3px}.title-worlds button{display:grid;grid-template-columns:42% 1fr;align-items:center}.title-worlds span{font-size:9px;padding-left:17px}.title-actions{flex-direction:column;gap:12px}.pixel-button{font-size:10px;padding:13px 18px}.selection h1{font-size:19px}.memory-grid{grid-template-columns:1fr}.memory-card{display:grid;grid-template-columns:45% 1fr;align-items:center}.memory-card img{height:100%;min-height:110px}.memory-card strong{font-size:9px}.memory-card small{font-size:11px}.scene{aspect-ratio:4/5}.scene-bg{object-position:var(--focus,35%) center}.actor{height:42%;bottom:2%;left:15%}.scene-title{max-width:90%;top:3%}.scene-title strong{font-size:10px}.scene-title small{font-size:10px}.scene-actions{left:4%;right:4%;bottom:3%;justify-content:space-between}.scene-actions .pixel-button{font-size:7px;padding:10px}.hotspot{left:clamp(30%,var(--mobile-x,40%),70%)!important;top:var(--mobile-y,58%)!important}.hotspot span:last-child{font-size:7px}.scene-meta{font-size:11px;flex-direction:column;gap:6px}.game-footer{gap:8px;font-size:6px}.game-footer #hint{display:none}.products{grid-template-columns:repeat(2,1fr)}.shop-screen{padding:25px 17px}.product-card{padding:10px}.product-card .mini-actor{height:180px}.item-layout{grid-template-columns:1fr}.item-picture{min-height:220px;max-height:250px;padding:15px}.item-picture img{max-height:225px}.item-picture .mini-actor{height:235px}.item-copy{padding:22px}.item-copy h2{font-size:14px}.item-copy p{font-size:13px}.dialog-head{font-size:8px;padding:14px 18px}.collection-body{padding:18px}.collection-item{gap:10px;grid-template-columns:35px 1fr auto}.collection-item .mini-actor{height:95px}.collection-item strong{font-size:8px}.collection-item button{font-size:10px;padding:6px}.toast{width:90%;text-align:center;font-size:9px}}

@media(max-width:550px){.game-header .brand{width:100px}.game-header nav{flex-basis:100%;max-width:none;justify-content:space-between;gap:8px}.game-header nav button{font-size:8px!important;min-height:44px;padding:9px 0!important}.scene-actions .pixel-button{min-height:44px}.size-row button{width:44px;height:44px}.item-actions button{min-height:44px}.dialog-head button{width:32px;min-height:32px}.game-footer button{min-height:32px}}
@media(max-width:550px){.item-picture[data-view=character]{max-height:none;min-height:0;padding:15px;gap:8px}.fitting-stage{height:240px}.item-picture .fitting-stage .mini-actor{height:225px}.fitting-caption strong{font-size:10px}.fitting-heading{font-size:7px}.model-select button{min-height:60px}.actor.cast-actor{height:44%}.shop-product-photo{height:180px}.demo-bar{align-items:center}.demo-bar a:nth-child(2){font-size:8px;max-width:190px;text-align:right}}

.game-header .menu-link{border:0;background:none;font:9px/1.6 var(--type-arcade);padding:8px 0;text-decoration:none;align-self:center}.game{margin-bottom:0}.game-header nav{align-items:center}@media(max-width:850px){.game-header .menu-link{font-size:8px}}@media(max-width:550px){.game-header .menu-link{min-height:44px;display:flex;align-items:center}}

/* Keep the complete skater clear of the mobile scene controls and prop label. */
@media(max-width:550px){.scene .actor{left:var(--mobile-actor-x,62%);bottom:14%}.scene .actor.cast-actor{bottom:14%}.scene .hotspot span:last-child{max-width:180px;white-space:normal;text-align:center}}
