*{box-sizing:border-box}
body{margin:0;background:#fff;color:#000;font-family:'VT323',monospace;font-size:20px;
background-image:radial-gradient(#000 1px,transparent 1px);background-size:6px 6px}
header{text-align:center;padding:20px 10px;background:#000;color:#fff}
h1{font-family:'Press Start 2P';font-size:clamp(20px,5vw,40px);margin:0}
.cur{animation:b 1s steps(1) infinite}@keyframes b{50%{opacity:0}}
.sub{margin:8px 0;font-size:22px}
.badge{border:2px solid #fff;padding:2px 8px;font-size:16px}
main{display:grid;grid-template-columns:auto 1fr;gap:20px;padding:20px;max-width:1200px;margin:auto}
.stats{grid-column:1/-1}
.console{background:#f2f0e6;border:3px solid #000;border-radius:18px 18px 60px 18px;padding:18px;box-shadow:6px 6px 0 #000}
.bezel{background:#111;padding:14px;border-radius:8px}
.lbl{color:#fff;font-family:'Press Start 2P';font-size:8px;margin-bottom:8px}
#canvas{width:480px;height:480px;image-rendering:pixelated;display:block;background:#000}
.pad{display:flex;justify-content:space-between;align-items:center;margin-top:16px}
.dpad button{width:56px;height:56px;font-size:22px}
.ab{display:flex;gap:12px}
.round{width:64px;height:64px;border-radius:50%!important;font-family:'Press Start 2P';display:flex;flex-direction:column;align-items:center;justify-content:center}
.round small{font-size:7px;margin-top:3px}
.hint{font-size:16px;margin-top:10px}
.panel{background:#fff;border:2px solid #000;padding:14px;box-shadow:4px 4px 0 #000}
h2{font-family:'Press Start 2P';font-size:12px;margin:14px 0 8px;background:#000;color:#fff;padding:4px 6px}
h2:first-child{margin-top:0}
label{display:block;margin:6px 0}
input[type=range]{width:100%;accent-color:#000}
input[type=text],select{width:100%;font:inherit;border:2px solid #000;padding:4px;background:#fff;border-radius:0}
button{font-family:'Press Start 2P';font-size:10px;background:#fff;color:#000;border:2px solid #000;padding:8px 10px;cursor:pointer;border-radius:0}
button:active,button.on{background:#000;color:#fff}
.big{width:100%;font-size:14px;padding:14px;margin-top:10px;background:#000;color:#fff}
.big:active{background:#fff;color:#000}
.row{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0}
.drop{border:2px dashed #000;padding:12px;text-align:center;cursor:pointer}
.drop.over{background:#000;color:#fff}
.status{font-size:17px;min-height:20px}
.prog,.meter{height:16px;border:2px solid #000;margin:8px 0;background:repeating-linear-gradient(90deg,#fff 0 4px,#ddd 4px 8px)}
#bar,#cartBar{height:100%;width:0;background:repeating-linear-gradient(90deg,#000 0 10px,transparent 10px 12px)}
.grid{display:grid;grid-template-columns:repeat(3,auto auto);gap:4px 12px;align-items:center}
.grid b{font-family:'Press Start 2P';font-size:11px}
#chart{width:100%;height:90px;border:2px solid #000;margin-top:10px;image-rendering:pixelated}
.info{font-size:17px;border-left:4px solid #000;padding-left:8px}
footer{text-align:center;padding:16px;background:#000;color:#fff}
footer a{color:#fff}
@media(max-width:860px){main{grid-template-columns:1fr}#canvas{width:320px;height:320px}.console{justify-self:center}.grid{grid-template-columns:auto auto}}