:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--void:#000;--ink:#21100c;--navy:#293f4b;--slate:#452015;--dusk:#955026;--paper:#fff2c7;--deep-red:#8a2b25;--coral:#d24d36;--orange:#c97532;--amber:#e99b43;--yellow:#ffc869;--deep-blue:#452015;--blue:#955026;--cyan:#ffe4a0;--green:#3d5630;--mint:#708a45;font-synthesis:none;font-family:SFMono-Regular,Cascadia Mono,Liberation Mono,monospace}*{box-sizing:border-box}html{background:var(--slate);min-width:320px;min-height:100%}body{min-width:320px;min-height:100vh;color:var(--paper);background:linear-gradient(90deg, var(--ink) 0 3px, transparent 3px 100%), var(--slate);border-top:4px solid var(--coral);margin:0}html:not(.bitmap-text-ready) :where(.sim-header h1,.sim-header p,.sim-header small,.panel-heading span,#fps-output,.tilt-pad small,.sim-button-grid button,.sim-tools button,.lab-tools>span,.lab-tools button,.device-sim-controls__heading span,#battery-value,.device-sim-controls button,.sim-hint,.sim-status){color:#0000!important;text-shadow:none!important}button,input{font:inherit}button{border-radius:0}.app-shell{width:min(100%,1040px);margin:0 auto;padding:42px 28px 36px}.sim-header{width:466px;margin-bottom:28px}.sim-header p,.sim-header small{--pixel-label-color:var(--dusk);color:var(--dusk);letter-spacing:.14em;margin:0;font-size:10px;display:block}.sim-header h1{--pixel-label-color:var(--paper);color:var(--paper);letter-spacing:-.06em;text-shadow:none;margin:7px 0 5px;font-size:clamp(28px,4vw,42px);line-height:1}.sim-stage{grid-template-columns:466px 250px;align-items:center;gap:64px;display:grid}.device{aspect-ratio:1;background:var(--void);width:466px;box-shadow:0 0 0 2px var(--ink), 0 0 0 6px var(--roast,#6b321b), 0 0 0 8px var(--amber), 0 18px 0 var(--deep-red);border-radius:50%;position:relative}#game-canvas{touch-action:none;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;border-radius:50%;outline:none;display:block}#game-canvas:focus-visible{outline:2px solid var(--yellow);outline-offset:4px}.sim-controls{border-left:3px solid var(--deep-blue);gap:18px;padding-left:24px;display:grid}.panel-heading{border-bottom:2px solid var(--blue);color:var(--yellow);letter-spacing:.1em;justify-content:space-between;gap:16px;padding-bottom:9px;font-size:10px;display:flex}.panel-heading span{--pixel-label-color:var(--yellow)}#fps-output{--pixel-label-color:var(--dusk);color:var(--dusk)}.tilt-pad{border:2px solid var(--blue);background:var(--void);cursor:crosshair;touch-action:none;width:132px;height:104px;margin-inline:auto;position:relative}.tilt-pad:focus-visible{outline:2px solid var(--yellow);outline-offset:3px}.tilt-pad small{--pixel-label-color:var(--dusk);color:var(--dusk);font-size:8px;position:absolute;bottom:8px;left:50%;translate:-50%}.tilt-axis{background:var(--slate);position:absolute}.tilt-axis--x{height:1px;top:50%;left:18px;right:18px}.tilt-axis--y{width:1px;top:14px;bottom:26px;left:50%}.tilt-knob{background:var(--yellow);width:10px;height:10px;box-shadow:3px 3px 0 var(--coral);pointer-events:none;position:absolute;top:50%;left:50%;translate:-50% -50%}.sim-button-grid{grid-template-columns:1fr 1fr;gap:8px 16px;display:grid}.sim-button-grid button,.sim-tools button,.lab-tools button,.device-sim-controls button{--pixel-label-color:var(--paper);border:0;border-bottom:2px solid var(--deep-blue);min-height:44px;color:var(--paper);cursor:pointer;background:0 0;font-size:9px}.sim-button-grid button:hover,.sim-button-grid button:focus-visible,.sim-tools button:hover,.sim-tools button:focus-visible,.lab-tools button:hover,.lab-tools button:focus-visible,.device-sim-controls button:hover,.device-sim-controls button:focus-visible{--pixel-label-color:var(--yellow);border-color:var(--yellow);color:var(--yellow);outline:none}.sim-button-grid button:active,.sim-tools button:active,.lab-tools button:active,.device-sim-controls button:active{--pixel-label-color:var(--void);color:var(--void);background:var(--blue)}.device-sim-controls{border-block:2px solid var(--deep-blue);gap:8px;padding:10px 0;display:grid}.device-sim-controls__heading,.device-sim-controls__actions{color:var(--dusk);justify-content:space-between;align-items:center;gap:12px;font-size:9px;display:flex}.device-sim-controls__heading span,#battery-value{--pixel-label-color:var(--dusk)}#battery-level{width:100%;accent-color:var(--yellow)}.charging-toggle{--pixel-label-color:var(--dusk);cursor:pointer;justify-content:center;align-items:center;min-height:44px;display:inline-flex}.charging-toggle[aria-pressed=true]{--pixel-label-color:var(--cyan);border-color:var(--cyan);background:var(--navy);box-shadow:inset 0 0 0 2px var(--void)}.device-sim-controls button{min-width:100px}.sim-hint,.sim-status{margin:0;font-size:9px;line-height:1.7}.sim-hint{--pixel-label-color:var(--dusk);color:var(--dusk)}.sim-status{--pixel-label-color:var(--cyan);min-height:28px;color:var(--cyan)}.sim-tools{--pixel-label-color:var(--dusk);border-top:2px solid var(--deep-blue);color:var(--dusk);padding-top:10px;font-size:9px}.sim-tools__toggle{cursor:pointer;-webkit-user-select:none;user-select:none;width:100%}.sim-tools__toggle[aria-expanded=true]{--pixel-label-color:var(--yellow);color:var(--yellow);margin-bottom:9px}.sim-tools__grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.lab-tools{--pixel-label-color:var(--coral);color:var(--coral);grid-template-columns:32px repeat(4,46px);justify-content:start;align-items:center;gap:6px;font-size:8px;display:grid}.pixel-label-host{color:#0000!important;text-shadow:none!important}.pixel-dom-text{width:auto;max-width:100%;height:auto;image-rendering:pixelated;image-rendering:crisp-edges;pointer-events:none;flex:none;display:block}.sim-header .pixel-label-host,.sim-hint.pixel-label-host,.sim-status.pixel-label-host{justify-content:flex-start;align-items:center;display:flex}.panel-heading .pixel-label-host,.tilt-pad .pixel-label-host,button.pixel-label-host,.lab-tools>span.pixel-label-host{justify-content:center;align-items:center;display:flex}[hidden]{display:none!important}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}body:has(#tilt-controls :focus-visible) .tilt-pad{outline:2px solid var(--blue);outline-offset:4px}:is(body:has(#tilt-x:focus-visible) .tilt-axis--x,body:has(#tilt-y:focus-visible) .tilt-axis--y){background:var(--yellow)}@media (max-width:860px){.app-shell{width:100%;padding:24px 20px 32px}.sim-header{width:min(466px,100%);margin-inline:auto}.sim-stage{grid-template-columns:minmax(0,466px);justify-content:center;gap:34px}.device{width:min(466px,100vw - 40px)}.sim-controls{border-left:0;border-top:2px solid var(--deep-blue);width:min(466px,100vw - 40px);padding:20px 0 0}.tilt-pad{width:150px}}@media (min-width:480px) and (max-width:500px){html,body{scrollbar-width:none;overflow-x:clip}html::-webkit-scrollbar{width:0;height:0}body::-webkit-scrollbar{width:0;height:0}.app-shell{padding-inline:7px}.device,.sim-controls{width:466px}.device{box-shadow:0 0 0 2px var(--ink), 0 0 0 6px var(--deep-blue), 0 0 0 7px var(--blue), 0 18px 0 var(--deep-red)}}@media (min-width:480px) and (max-width:500px) and (max-height:600px){body{border-top:0}.app-shell{padding-top:7px}.sim-header{display:none}.device{box-shadow:0 0 0 2px var(--ink), 0 0 0 6px var(--deep-blue), 0 0 0 7px var(--blue), 0 7px 0 var(--deep-red)}}@media (width:466px) and (height:466px){html,body{width:466px;height:466px;overflow:hidden}body{border-top:0;min-height:466px}.app-shell,.sim-stage,.device{width:466px;height:466px}.app-shell{margin:0;padding:0}.sim-header,.sim-controls{display:none}.sim-stage{display:block}.device{box-shadow:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important}}
