html,body{overscroll-behavior:none;background:#05070f;width:100%;height:100%;margin:0;padding:0;overflow:hidden}body{font-family:system-ui,sans-serif;position:relative}header{z-index:2;pointer-events:none;justify-content:flex-end;padding:.3rem .5rem;display:flex;position:absolute;top:0;left:0;right:0}header nav{pointer-events:auto}header nav a{color:#6fb7ff;opacity:.6;font-size:.7rem;text-decoration:none}h1{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}main{box-sizing:border-box;justify-content:center;align-items:center;padding:.5rem;display:flex;position:absolute;inset:0}.cabinet{pointer-events:none;flex-direction:column;align-items:center;gap:clamp(3px,.6vh,10px);width:100%;max-width:min(96vw,1600px);height:100%;display:flex}.marquee{clip-path:polygon(0% 12%,4% 12%,4% 6%,8% 6%,8% 0%,92% 0%,92% 6%,96% 6%,96% 12%,100% 12%,100% 88%,96% 88%,96% 94%,92% 94%,92% 100%,8% 100%,8% 94%,4% 94%,4% 88%,0% 88%);background:repeating-linear-gradient(#ffce5c 0 4px,#ffb752 4px 8px,#ff7a3d 8px 12px,#d85a2c 12px 16px,#b03e1c 16px 20px);border:2px solid #3a1c10;flex:none;justify-content:center;align-items:center;width:min(100%,640px);height:clamp(14px,4vh,32px);display:flex;overflow:hidden;box-shadow:0 0 0 2px #ffaa5a80,inset 0 -3px #00000059,inset 0 -6px #0003}.marquee span{letter-spacing:.1em;color:#241005;text-shadow:0 1px #fff6;white-space:nowrap;font-size:clamp(9px,2.2vh,18px);font-weight:800}.cabinet-body{flex-direction:row;flex:auto;justify-content:center;align-items:stretch;gap:clamp(4px,1.5vw,22px);width:100%;min-height:0;display:flex}.side-panel{clip-path:polygon(0% 8%,4% 8%,4% 3%,8% 3%,8% 0%,92% 0%,92% 3%,96% 3%,96% 8%,100% 8%,100% 92%,96% 92%,96% 97%,92% 97%,92% 100%,8% 100%,8% 97%,4% 97%,4% 92%,0% 92%);background:repeating-linear-gradient(135deg,#23264a 0 8px,#1a1c38 8px 16px);flex:140px;justify-content:center;align-items:center;min-width:48px;max-width:220px;display:flex;box-shadow:inset 0 0 0 2px #0c0d1e}.screen-stack{flex-direction:column;flex:4 640px;align-items:center;min-width:0;min-height:0;display:flex}.bezel{box-sizing:border-box;clip-path:polygon(0% 6%,3% 6%,3% 2%,6% 2%,6% 0%,94% 0%,94% 2%,97% 2%,97% 6%,100% 6%,100% 94%,97% 94%,97% 98%,94% 98%,94% 100%,6% 100%,6% 98%,3% 98%,3% 94%,0% 94%);background:repeating-linear-gradient(160deg,#3a3f5c 0 6px,#262b45 6px 12px,#1c2038 12px 18px,#14152a 18px 24px);flex:auto;justify-content:center;align-items:center;width:100%;min-height:0;padding:clamp(6px,2vh,20px);display:flex;box-shadow:0 0 0 2px #05060f,0 6px #00000080,0 9px #0000004d,inset 0 0 0 3px #0009}.screen-frame{clip-path:polygon(0% 10%,5% 10%,5% 4%,10% 4%,10% 0%,90% 0%,90% 4%,95% 4%,95% 10%,100% 10%,100% 90%,95% 90%,95% 96%,90% 96%,90% 100%,10% 100%,10% 96%,5% 96%,5% 90%,0% 90%);pointer-events:auto;background:#05070f;flex:auto;justify-content:center;align-items:center;width:100%;min-width:0;height:100%;min-height:0;display:flex;overflow:hidden;box-shadow:inset 0 0 0 4px #000c,inset 0 0 0 8px #0006}#game{image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;touch-action:none;background:#05070f;display:block}.joystick{width:clamp(28px,6vh,64px);height:clamp(28px,6vh,64px);position:relative}.joystick-base{clip-path:polygon(40% 0%,60% 0%,60% 10%,80% 10%,80% 20%,90% 20%,90% 40%,100% 40%,100% 60%,90% 60%,90% 80%,80% 80%,80% 90%,60% 90%,60% 100%,40% 100%,40% 90%,20% 90%,20% 80%,10% 80%,10% 60%,0% 60%,0% 40%,10% 40%,10% 20%,20% 20%,20% 10%,40% 10%);background:repeating-radial-gradient(circle at 35% 30%,#4a4e63 0 4px,#363a52 4px 8px,#24273d 8px 12px,#16171f 12px 16px);position:absolute;inset:0;box-shadow:0 3px #00000080,0 5px #00000040}.joystick-stick{clip-path:polygon(20% 0%,80% 0%,80% 5%,90% 5%,90% 15%,100% 15%,100% 90%,95% 90%,95% 100%,5% 100%,5% 90%,0% 90%,0% 15%,10% 15%,10% 5%,20% 5%);background:repeating-linear-gradient(#ff5a5a 0 3px,#d94040 3px 6px,#a92828 6px 9px,#8a1c1c 9px 12px);width:22%;height:55%;position:absolute;top:16%;left:50%;transform:translate(-50%)}.button-row{flex-direction:column;align-items:center;gap:clamp(6px,1.8vh,16px);display:flex}.arcade-button{clip-path:polygon(40% 0%,60% 0%,60% 10%,80% 10%,80% 20%,90% 20%,90% 40%,100% 40%,100% 60%,90% 60%,90% 80%,80% 80%,80% 90%,60% 90%,60% 100%,40% 100%,40% 90%,20% 90%,20% 80%,10% 80%,10% 60%,0% 60%,0% 40%,10% 40%,10% 20%,20% 20%,20% 10%,40% 10%);width:clamp(14px,3.2vh,30px);height:clamp(14px,3.2vh,30px);box-shadow:0 2px #00000080,0 4px #00000040,inset 0 -2px #0000004d}.arcade-button--red{background:repeating-radial-gradient(circle at 35% 30%,#ff8a7a 0 3px,#e05a48 3px 6px,#c53a2a 6px 9px,#b3231c 9px 12px)}.arcade-button--yellow{background:repeating-radial-gradient(circle at 35% 30%,#ffe08a 0 3px,#eec25c 3px 6px,#ddab30 6px 9px,#c98a10 9px 12px)}.arcade-button--blue{background:repeating-radial-gradient(circle at 35% 30%,#8ac8ff 0 3px,#5fa8ef 3px 6px,#3a7fd0 6px 9px,#1d5fb3 9px 12px)}@media (width<=640px),(aspect-ratio<=3/4){.side-panel{display:none}.marquee{height:clamp(14px,3.5vh,26px)}.bezel{padding:clamp(3px,1.2vh,10px)}}
