*{box-sizing:border-box}:root{--paper:#f6f5ef;--ink:#293c35;--muted:#7c857b;--green:#43664c;--line:#dedfd5}body{margin:0;background:var(--paper);color:var(--ink);font:14px -apple-system,BlinkMacSystemFont,"PingFang SC","Segoe UI",sans-serif}button,a,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #a58952;outline-offset:4px}button:disabled{opacity:.4;cursor:not-allowed}[hidden]{display:none!important}
.site-header{height:76px;margin:auto;max-width:1040px;padding:0 40px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;line-height:0}
.brand img{display:block;width:192px;height:48px;image-rendering:pixelated}.text-button{background:none;border:0;padding:9px 0;color:var(--muted)}.contribute-link{display:inline-flex;gap:9px;align-items:center;padding:10px 17px;background:#e9ecdf;border:1px solid #d5ddc7;border-radius:5px;font-weight:600;font-size:12px}.contribute-link:hover{background:#dce4ce}.page{max-width:1260px;margin:auto;padding:0 40px}#play-page{max-width:1040px;padding-top:14px}.eyebrow{font-size:10px;letter-spacing:2.1px;color:#7b887a;margin:0 0 12px;font-weight:500}h1{font-size:32px;letter-spacing:2px;font-weight:600;margin:0;line-height:1.5}h2{font-size:15px;font-weight:600;margin:0 0 23px}.game-shell{border-radius:6px;overflow:hidden;border:1px solid #bdceba}.canvas-wrap{position:relative;aspect-ratio:16/9;background:#c6e4d6;overflow:hidden}canvas{display:block;image-rendering:pixelated;image-rendering:crisp-edges}#game,#preview-game{width:100%;height:100%;outline:none;touch-action:none}#game:focus-visible{box-shadow:inset 0 0 0 2px #779a67}.game-bottom{position:absolute;left:16px;bottom:13px;pointer-events:none;color:#faf7e4;text-shadow:0 1px 1px #253e33}.art-caption{opacity:.78;display:flex;gap:7px;align-items:baseline}.art-caption strong{font-size:9px;letter-spacing:.3px;font-weight:400}.art-caption small{font-size:8px;opacity:.8}.below-game{display:flex;justify-content:space-between;align-items:center;padding:18px 0 24px;gap:20px}.controls{display:flex;align-items:center;gap:8px}.key-control{background:#f9f9f1;border:1px solid #d8ddcf;border-bottom:3px solid #d8ddcf;border-radius:5px;padding:10px 12px;font-size:12px;font-family:monospace;touch-action:none;user-select:none}.key-control:active,.key-control.held{background:#dfe8cf;transform:translateY(1px);border-bottom-width:2px}.key-control span{color:#a3ae9b;margin:0 4px}.input-hint{font-size:10px;color:#939c8c;margin-left:6px}.utilities{display:flex;align-items:center;gap:20px}.utilities button{background:transparent;border:0;padding:8px 0;font-size:18px;color:#6d7b6b}.utilities span{font-size:10px;vertical-align:middle;margin-left:4px}.utilities button[aria-pressed=true]{color:#385d3c}.toast{position:absolute;top:25px;left:50%;transform:translateX(-50%);padding:10px 18px;background:#253d32e6;color:#fff5d8;border-radius:4px;font-size:11px;opacity:0;transition:opacity .25s;pointer-events:none;white-space:nowrap}.toast.show{opacity:1}kbd{font:10px monospace;padding:3px 5px;border:1px solid #8a9e6e66;border-bottom-width:2px;border-radius:3px;background:#fff6;margin:0 3px}.primary{display:block;width:100%;padding:13px 16px;background:var(--green);border:1px solid #36573e;color:#fffbea;border-radius:5px;font-size:12px;letter-spacing:1px}.primary:hover:not(:disabled){background:#34553d}dialog{border:1px solid #d5d9ca;background:var(--paper);color:var(--ink);border-radius:8px;padding:35px;max-width:calc(100% - 30px)}dialog::backdrop{background:#192e2b88}dialog h2{font-size:23px;margin-bottom:24px}dialog p{font-size:13px;line-height:2;margin:18px 0}dialog small{color:var(--muted);font-size:11px}.close{position:absolute;right:18px;top:18px;background:none;border:0;font-size:25px;color:#8b7b61;z-index:2}.door-prompt{position:absolute;left:39.5%;bottom:26%;transform:translateX(-50%);background:#f5edd9;border:1px solid #a49a79;border-radius:4px;padding:8px 11px;color:#685c43;font-size:11px}.floating-control{position:absolute;right:18px;top:18px;background:#f5f6e4d9;border:1px solid #f5f6e480;border-radius:5px;padding:10px 13px;color:#4e6755;font-size:11px;z-index:3}.immersive .site-header,.immersive .below-game{display:none}.immersive{background:#17271f;overflow:hidden}.immersive #play-page{position:fixed;inset:0;max-width:none;padding:0;display:flex;align-items:center;justify-content:center}.immersive .game-shell{width:min(100vw,177.777dvh);border:0;border-radius:0}.game-shell:fullscreen{display:flex;align-items:center;justify-content:center;background:#17271f;border:0;border-radius:0}.game-shell:fullscreen .canvas-wrap{width:min(100vw,177.777vh);height:min(100vh,56.25vw)}
#credits-dialog{padding:18px 12px;background:none;border:0;width:min(540px,94vw);max-width:none;max-height:96dvh;overflow:visible}#credits-dialog[open] .scroll-sheet{animation:unroll .65s cubic-bezier(.18,.8,.25,1)}.scroll-sheet{position:relative;height:min(710px,86dvh);padding:30px 38px 24px;display:flex;flex-direction:column;background:linear-gradient(90deg,#d6c39a 0%,#f4e6c7 5%,#faf0d9 50%,#eee0bd 95%,#ccb78d 100%);border-left:1px solid #b39c6d;border-right:1px solid #b39c6d;box-shadow:0 20px 70px #101d2770;color:#63543e}.scroll-rod{position:absolute;left:-14px;right:-14px;height:14px;background:linear-gradient(#a68755,#63492e 50%,#9b794a);border:1px solid #59422c;border-radius:5px;box-shadow:0 3px 4px #57432f22}.scroll-rod:before,.scroll-rod:after{content:"";position:absolute;width:8px;height:20px;top:-4px;background:#51452f;border-radius:2px}.scroll-rod:before{left:0}.scroll-rod:after{right:0}.top-rod{top:-6px}.bottom-rod{bottom:-6px}.credits-heading{text-align:center;position:relative;padding:4px 0 25px;flex-shrink:0}.credits-heading p{font-size:10px;letter-spacing:6px;margin:0 0 10px}.credits-heading h1{font-family:Georgia,serif;font-size:56px;letter-spacing:3px;line-height:1}.seal{display:inline-block;background:#a85943;color:#f4e7ca;font:12px serif;width:22px;line-height:22px;margin-top:13px;border:1px solid #b96d51}.thanks-heading{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #aa926944;padding-top:19px;margin-bottom:14px}.thanks-heading h2{font-size:16px;letter-spacing:4px;margin:0}.thanks-heading small{font-size:10px;color:#9d8d6e}.search-box{display:flex;align-items:center;gap:9px;padding:9px 12px;background:#fff9e744;border:1px solid #b6a47f66;border-radius:2px;flex-shrink:0}.search-box span{font-size:21px;color:#a08c68}.search-box input{min-width:0;width:100%;border:0;background:none;outline:none;color:#695b44;font-size:12px}.search-box input::placeholder{color:#b09e7a}.thanks-scroll{overflow-y:auto;min-height:80px;flex:1;margin:16px 0 20px;scrollbar-color:#b6a47c transparent;scrollbar-width:thin;overscroll-behavior:contain}.thanks-scroll ul{list-style:none;margin:0;padding:0}.thanks-scroll li{padding:12px 3px;border-bottom:1px solid #b29b6b22;font-size:13px;display:flex;gap:9px;align-items:baseline}.thanks-scroll li:before{content:"–";color:#a9946e}.thanks-scroll li small{margin-left:auto;font-size:10px;color:#a39170}.thanks-empty{text-align:center;font-size:11px;color:#ae9d7c;padding:30px 0}.scroll-music{text-align:center;font-size:9px;line-height:1.9;color:#a18c69;flex-shrink:0}.scroll-music a{border-bottom:1px solid #bca57d66}#music-dialog a{text-decoration:underline;text-underline-offset:3px}#music-info-button{font-size:13px;margin-left:-12px;color:#9aa28f}@keyframes unroll{from{transform:translateY(75vh);opacity:.3}to{transform:translateY(0);opacity:1}}
@media(max-width:760px){.site-header{height:64px;padding:0 18px}.brand img{width:128px;height:32px}.contribute-link{padding:8px 12px;font-size:11px}.page{padding:0 16px}#play-page{padding-top:5px}.game-bottom{left:10px;bottom:8px}.art-caption strong{font-size:8px}.art-caption small{font-size:7px}.below-game{flex-wrap:wrap;gap:12px;padding:14px 0}.utilities{margin-left:auto;gap:16px}.utilities span{font-size:10px}.input-hint{font-size:9px}.key-control{padding:12px}.eyebrow{font-size:8px;letter-spacing:1px}.toast{font-size:10px;padding:8px}.floating-control{top:10px;right:10px;padding:8px;font-size:10px}.scroll-sheet{padding:25px 25px 20px}.credits-heading{padding-bottom:19px}.credits-heading h1{font-size:44px}.door-prompt{font-size:10px;padding:5px 7px}.door-prompt kbd{font-size:9px}}
@media(max-height:520px){.credits-heading{padding-bottom:9px}.credits-heading p{display:inline;margin:0 10px 0 0}.credits-heading h1{display:inline;font-size:26px}.seal{margin:0 0 0 10px;vertical-align:middle}.thanks-heading{padding-top:10px;margin-bottom:8px}.scroll-sheet{padding:19px 30px 16px}.thanks-scroll{margin:8px 0}.scroll-music{font-size:8px}.thanks-empty{padding:10px 0}.close{top:5px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}

.site-header nav{display:flex;align-items:center;gap:24px}.site-header .utilities{gap:15px}.site-header .utilities span{font-size:10px}.immersive .game-bottom{display:none}@media(max-width:760px){.site-header{height:auto;min-height:72px;gap:12px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px}.site-header nav{gap:15px;margin-left:auto}.site-header .utilities{gap:12px}.site-header .utilities button{font-size:16px}.site-header #music-info-button{margin-left:-7px;font-size:12px}.site-header #fullscreen-button{display:none}}


/* Pixel studio: stepped corners via clip-path, chunky 4px bevels, no radius. */
:root{--px-step:polygon(0 4px,4px 4px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px));--px-font:"Silkscreen","Press Start 2P",ui-monospace,"SFMono-Regular",Menlo,monospace}
.secondary{padding-top:18px;padding-bottom:48px}
.studio{display:grid;grid-template-columns:220px 1fr;gap:20px;align-items:start}
.studio>.back{grid-column:1/-1;justify-self:start}
.px,.px-key,.px-frame{clip-path:var(--px-step)}
.px-link{background:none;border:0;padding:4px 0;font:12px var(--px-font);color:#6d7b6b;letter-spacing:.5px}
.px-link:hover{color:var(--green)}
.pad{display:flex;flex-direction:column;gap:12px;padding:14px;background:#3d5a45;clip-path:var(--px-step);box-shadow:inset 0 -6px 0 #2b4232,inset 0 4px 0 #557a5e}
.giant-size{display:flex;align-items:center;gap:7px;font-size:11px;white-space:nowrap;color:#e3edce}.giant-size input{width:100%;min-width:0;accent-color:#c6d9a2}.giant-size output{min-width:25px;font-variant-numeric:tabular-nums}
.slot{position:relative;aspect-ratio:1;display:flex;align-items:center;justify-content:center;cursor:pointer;background-color:#e9ecdc;background-image:conic-gradient(#d9dfca 25%,transparent 0 50%,#d9dfca 0 75%,transparent 0);background-size:16px 16px;box-shadow:inset 4px 4px 0 #b9c3a7}
.slot.dragging{background-color:#f6e7b4}
.slot input{position:absolute;width:1px;height:1px;opacity:0}
.slot:focus-within{outline:4px solid #e6c46b;outline-offset:-4px}
.slot canvas{width:100%;height:100%}
#slot-empty{display:flex;flex-direction:column;align-items:center;gap:6px;font:11px var(--px-font);color:#6d7b6b}
#slot-empty b{font-size:34px;line-height:1;color:#7d9d56}
.pad .px-link{color:#cfe0b8;align-self:center;font-size:11px}
.pad .px-link:hover{color:#fff3d4}
.px-input{width:100%;padding:10px;border:0;background:#f4f1df;color:var(--ink);font:13px var(--px-font);box-shadow:inset 0 3px 0 #c9c6ae}
.px-input:focus-visible{outline:4px solid #e6c46b;outline-offset:-4px}
.px-group{display:flex;gap:6px}
.px-key{flex:1;display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 10px;border:0;background:#e8e4cc;color:#3d5a45;font:13px/1 var(--px-font);letter-spacing:.5px;box-shadow:inset 0 -4px 0 #b2ad8f,inset 0 3px 0 #fffbea;user-select:none;touch-action:none;white-space:nowrap}
.px-key:hover:not(:disabled):not([aria-disabled=true]){background:#f3efd8}
.px-key:active:not(:disabled),.px-key.held{transform:translateY(2px);box-shadow:inset 0 -2px 0 #b2ad8f,inset 0 2px 0 #c9c4a6}
.px-key.selected{background:#e6c46b;color:#3d3420;box-shadow:inset 0 -4px 0 #b08c3a,inset 0 3px 0 #f8e3a0}
.px-key:focus-visible{outline:3px solid #fff3d4;outline-offset:-6px}
.px-key:disabled,.px-key[aria-disabled=true]{opacity:.45;cursor:not-allowed;pointer-events:none}
.primary-key{background:#7d9d56;color:#fffbea;box-shadow:inset 0 -4px 0 #4e6e39,inset 0 3px 0 #a7c27c}
.primary-key:hover:not([aria-disabled=true]){background:#8daf63}
.pad .status{margin:0;min-height:0;font:11px var(--px-font);color:#f3d6a0}
.pad .status:empty{display:none}
.pad .status.error{color:#ffb79b}
.stage{display:flex;flex-direction:column;gap:12px}
.px-frame{position:relative;aspect-ratio:16/9;background:#c6e4d6;padding:6px;background:#3d5a45}
.px-frame canvas{width:100%;height:100%;clip-path:var(--px-step)}
#preview-game:focus-visible{outline:none}
.px-frame:has(#preview-game:focus-visible){background:#e6c46b}
.stage-bar{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.stage-bar .px-group{background:#3d5a45;padding:6px;clip-path:var(--px-step)}
.dpad .px-key{min-width:52px;flex:none}
.volume{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted)}
.volume input{flex:1;accent-color:var(--green)}
.volume output{font:12px var(--px-font);min-width:3em;text-align:right}
.thanks-scroll li a{color:#5b4a2e;border-bottom:1px dashed #a9946e}
.thanks-scroll li a:hover{color:#a85943;border-bottom-style:solid}
@media(max-width:760px){.studio{grid-template-columns:1fr;gap:14px}
.pad{display:grid;grid-template-columns:120px 1fr;align-items:center}
.pad .slot{grid-row:span 4}
.pad .px-link,.pad .status{grid-column:1/-1}
.stage{order:-1}
.studio>.back{order:-2}
.px-key{min-height:34px;font-size:12px;padding:6px 8px}
.dpad .px-key{min-width:44px}
}
.management-open .utilities{display:none}

/* Repository shortcut stays available on the game and studio pages. */
.github-link{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:5px;color:#6d7b6b}
.github-link svg{display:block}
.github-link:hover{background:#e9ecdf;color:var(--ink)}
@media(max-width:760px){.site-header{position:relative}.site-header nav{flex-basis:100%;flex-wrap:wrap;justify-content:flex-end;gap:12px}.github-link{position:absolute;top:6px;right:18px;width:44px;height:44px}}
