:root{color-scheme:dark;--ink:#17152a;--cream:#f8f0d0;--mint:#7be0bd;--pink:#ff5f8f;--blue:#5650ad;--screen:#b9d58c;--screen-ink:#263a31;font-family:Inter,ui-rounded,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% 10%,#3a3566 0,#17152b 48%,#0c0b17 100%);color:var(--cream);touch-action:manipulation}.page{min-height:100vh;display:grid;place-items:center;padding:max(18px,env(safe-area-inset-top)) 14px max(16px,env(safe-area-inset-bottom))}.pocket{position:relative;width:min(94vw,460px);padding:22px 22px 18px;border:1px solid #7e7ad0;border-radius:38px 38px 70px 38px;background:linear-gradient(145deg,#6560bf 0,#4a459d 52%,#35317e 100%);box-shadow:0 32px 70px #060510aa,inset 5px 6px 10px #aaa6ef55,inset -7px -9px 16px #18154e77}.pocket:after{content:"";position:absolute;inset:8px;border:1px solid #aaa6eb44;border-radius:31px 31px 62px 31px;pointer-events:none}.brand-row{display:flex;justify-content:space-between;align-items:center;margin:0 9px 10px;letter-spacing:.09em}.brand{display:flex;align-items:baseline;gap:7px;font-size:12px}.brand b{font-weight:900}.brand span{font-size:9px;color:#b8f3dd}.power{display:flex;align-items:center;gap:6px;font:700 8px ui-monospace,monospace}.power i{width:8px;height:8px;border-radius:50%;background:#423c74;box-shadow:inset 0 1px 2px #0b0920}.power i.on{background:#ffdf5d;box-shadow:0 0 11px #ffdf5d}.bezel{padding:14px 18px 20px;border-radius:18px 18px 42px 18px;background:linear-gradient(145deg,#27243c,#151322);box-shadow:inset 3px 3px 4px #4e4a6d,inset -4px -4px 7px #090811}.screen{position:relative;aspect-ratio:10/9;overflow:hidden;background:var(--screen);border-radius:5px;box-shadow:0 0 0 3px #07070b,inset 0 0 22px #55704a77}.screen:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;background:repeating-linear-gradient(0deg,transparent 0 2px,#17251b 3px)}canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;background:#000;z-index:1}.system-view{position:absolute;inset:0;z-index:2;padding:8% 8% 5%;display:flex;flex-direction:column;color:var(--screen-ink);font:700 clamp(9px,2.6vw,13px)/1.2 ui-monospace,"Cascadia Mono",monospace}.system-view[hidden],canvas[hidden],.sound-gate[hidden]{display:none}.screen-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:6px;border-bottom:3px double var(--screen-ink);font-size:.85em}.screen-head span{font-size:.75em}.game-list,.menu-list{margin:auto 0;display:grid;gap:3px}.game-item,.menu-item{display:flex;align-items:center;gap:6px;min-height:24px;padding:3px 5px;border:0;background:transparent;color:inherit;text-align:left;font:inherit}.game-item.selected,.menu-item.selected{background:var(--screen-ink);color:var(--screen)}.game-item small{margin-left:auto;font-size:.67em;opacity:.8}.game-item:before,.menu-item:before{content:"  ";width:1em}.game-item.selected:before,.menu-item.selected:before{content:"▶"}.screen-help{display:flex;justify-content:space-between;font-size:.66em;border-top:1px solid currentColor;padding-top:5px}.loading-view{align-items:stretch;justify-content:center;text-align:center}.loading-view .screen-head{position:absolute;left:8%;right:8%;top:8%}.loading-art{margin-bottom:12px;font-size:1.6em;letter-spacing:.35em;animation:blink .7s steps(2) infinite}.progress{height:10px;border:2px solid var(--screen-ink);padding:1px}.progress i{display:block;width:0;height:100%;background:var(--screen-ink);transition:width .18s}.loading-view p{margin:6px}.credits-list{overflow:auto;margin:8px -2px 5px;padding-right:5px;font-size:.69em;line-height:1.35}.credit{padding:5px 0;border-bottom:1px dashed #263a3166}.credit b{display:block}.credit a{color:inherit}.error-view{justify-content:center;text-align:center}.error-view .screen-head{position:absolute;left:8%;right:8%;top:8%}.error-view button{border:2px solid currentColor;background:transparent;color:inherit;padding:7px;font:inherit}.sound-gate{position:absolute;z-index:4;inset:0;border:0;background:#263a31dd;color:#d8eba9;font:700 13px ui-monospace,monospace;display:grid;place-content:center;gap:5px;text-align:center}.sound-gate span{font-size:9px}.controls{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;margin:28px 7px 13px}.controls button{user-select:none;-webkit-user-select:none;cursor:pointer;color:#e9e6ff}.dpad{position:relative;width:116px;height:116px;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);filter:drop-shadow(4px 7px 5px #17133e99)}.dpad button,.dpad i{border:0;background:#232038}.dpad button{font-size:13px}.dpad button.active,.dpad button:active{background:#131124;color:var(--mint)}.dpad .up{grid-area:1/2}.dpad .left{grid-area:2/1}.dpad i{grid-area:2/2}.dpad .right{grid-area:2/3}.dpad .down{grid-area:3/2}.dpad .up{border-radius:7px 7px 0 0}.dpad .left{border-radius:7px 0 0 7px}.dpad .right{border-radius:0 7px 7px 0}.dpad .down{border-radius:0 0 7px 7px}.actions{display:flex;gap:9px;transform:rotate(-12deg);justify-self:end}.actions button{width:53px;height:53px;border:0;border-radius:50%;background:linear-gradient(145deg,#ff7aa2,#d83e70);box-shadow:3px 6px 0 #8e2850, inset 2px 2px 2px #ffb4ca;font:900 18px ui-monospace,monospace}.actions button.active,.actions button:active{transform:translate(2px,4px);box-shadow:1px 2px 0 #8e2850}.actions span{display:block;transform:rotate(12deg)}.utility{display:flex;align-self:end;gap:7px;margin-bottom:8px}.utility button{border:0;border-radius:12px;width:37px;height:13px;transform:rotate(-8deg);background:#232038;box-shadow:1px 3px 0 #121027;font:700 6px ui-monospace,monospace}.speaker{display:flex;gap:5px;justify-content:flex-end;transform:rotate(-22deg);margin:0 18px 10px}.speaker i{width:5px;height:24px;border-radius:5px;background:#262263;box-shadow:inset 1px 1px 2px #11103d}.dock{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.dock button{border:1px solid #928ee1;border-radius:8px;background:#3a3684;color:#e9e6ff;padding:8px 2px;font:700 7px ui-monospace,monospace}.dock button:hover{background:#49449c}.footnote{margin:13px 0 0;color:#aaa6c9;text-align:center;font-size:10px;letter-spacing:.04em}@keyframes blink{50%{opacity:.35}}@media(max-width:430px){.pocket{padding:16px 16px 14px;border-radius:30px 30px 54px 30px}.bezel{padding:11px 14px 16px}.controls{margin-top:20px;gap:8px}.dpad{width:96px;height:96px}.actions button{width:47px;height:47px}.utility{gap:4px}.utility button{width:32px}.dock button{font-size:6px}}@media(max-height:760px) and (orientation:landscape){.page{padding:8px}.pocket{width:min(92vw,680px);display:grid;grid-template-columns:1.12fr .88fr;column-gap:22px;border-radius:28px;padding:14px 20px}.brand-row{grid-column:1}.bezel{grid-column:1;grid-row:2/5}.controls{grid-column:2;grid-row:1/3;margin:30px 0 0;align-self:center}.speaker{grid-column:2;grid-row:3;align-self:end}.dock{grid-column:2;grid-row:4;align-self:end}.footnote{display:none}}:fullscreen{width:100vw!important;height:100vh!important;border-radius:0!important}:fullscreen .screen{height:100%;width:auto;max-width:100%;margin:auto}.bezel:fullscreen{display:grid;place-items:center;background:#08070e;padding:0}.bezel:fullscreen .screen{height:min(100vh,90vw);width:auto}
