.gba{zoom:calc(var(--gba-w,var(--w)) / 1000px);width:1000px;height:620px;font-family:var(--sans);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;position:relative}.gba__body{z-index:1;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.gba__print{font:700 13px var(--sans);letter-spacing:.12em;fill:#d4cff2;fill-opacity:.7}.gba__print--tiny{font-size:11px}.gba__logo{color:#ecebf4;opacity:.92}.gba__led{fill:#3a3446;transition:fill .3s}.gba--board .gba__led,.gba-inspect.is-open .gba__led{fill:#9dff5c;filter:drop-shadow(0 0 6px #9dff5c)}.gba__screen-wrap{z-index:2;background:#0b0a12;width:420px;height:280px;position:absolute;top:124px;left:290px;overflow:hidden}.gba__screen{width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;display:block}.gba__screen-wrap:after{content:"";pointer-events:none;background:repeating-linear-gradient(0deg,#00000029 0 .4px,#0000 .4px 1.75px),repeating-linear-gradient(90deg,#0000001f 0 .4px,#0000 .4px 1.75px);position:absolute;inset:0}.gba__btn{z-index:2;color:inherit;font:inherit;touch-action:none;background:0 0;border:0;margin:0;padding:0;position:absolute}button.gba__btn{cursor:pointer}button.gba__btn:focus-visible{outline-offset:4px;outline:4px solid #fff}.gba__round{background:radial-gradient(circle at 38% 30%,#fff,#f1eff4 45%,#d6d2df 85%,#c6c1d1);border-radius:50%;width:64px;height:64px;transition:transform 50ms ease-out,box-shadow 50ms ease-out;box-shadow:0 5px #a59fb6,0 8px 10px #10083280,inset 0 -3px 5px #5a508238}.gba__round:after{font:800 24px/1 var(--sans);color:#c2bdd0;text-shadow:0 1px #fff,0 -1px #50467840;place-items:center;display:grid;position:absolute;inset:0}.gba__a:after{content:"A"}.gba__b:after{content:"B"}.gba__a{top:192px;left:883px}.gba__b{top:227px;left:793px}.gba__round.is-down{transform:translateY(4px);box-shadow:0 1px #a59fb6,0 2px 4px #10083273,inset 0 3px 6px #463c6e59}.gba__small{background:radial-gradient(circle at 38% 32%,#fff,#ebe8f0 55%,#cbc6d6);border-radius:50%;width:30px;height:30px;transition:transform 50ms ease-out,box-shadow 50ms ease-out;box-shadow:0 3px #a59fb6,0 5px 6px #10083273}.gba__start{top:368px;left:168px}.gba__select{top:425px;left:164px}.gba__small.is-down{transform:translateY(3px);box-shadow:0 0 #a59fb6,0 1px 2px #10083266,inset 0 2px 4px #463c6e66}.gba__dpad{perspective:420px;--dx:0;--dy:0;width:144px;height:144px;top:164px;left:50px}.gba__cross{transform-style:preserve-3d;transform:rotateX(calc(var(--dy) * -17deg)) rotateY(calc(var(--dx) * 17deg));filter:drop-shadow(calc(var(--dx) * -2px) calc(5px + var(--dy) * -2px) 0 #a59fb6) drop-shadow(0 7px 7px #10083280);transition:transform 60ms ease-out;position:absolute;inset:0}.gba__dpad.is-down .gba__cross{filter:drop-shadow(calc(var(--dx) * -1px) calc(2px + var(--dy) * -1px) 0 #a59fb6) drop-shadow(0 3px 4px #10083273)}.gba__cross-v,.gba__cross-h{background:linear-gradient(155deg,#fff,#f0eef3 45%,#d9d5e1);border-radius:8px;position:absolute}.gba__cross-v{width:46px;height:144px;top:0;left:49px}.gba__cross-h{width:144px;height:46px;top:49px;left:0}.gba__cross-v:before,.gba__cross-h:before{content:"";border-radius:inherit;opacity:0;transition:opacity 60ms;position:absolute;inset:0}.gba__cross-v:before{background:linear-gradient(calc(90deg - var(--dy) * 90deg), #3c326459, transparent 45%);opacity:calc(var(--dy) * var(--dy))}.gba__cross-h:before{background:linear-gradient(calc(180deg + var(--dx) * 90deg), #3c326459, transparent 45%);opacity:calc(var(--dx) * var(--dx))}.gba__cross-dot{background:radial-gradient(circle at 50% 60%,#d8d4e0,#ebe8f0 70%);border-radius:50%;width:36px;height:36px;position:absolute;top:54px;left:54px;box-shadow:inset 0 2px 3px #463c6e4d}.gba__shoulder{z-index:0;background:linear-gradient(#f4f2f7,#c9c4d4);width:250px;height:70px;transition:translate 50ms ease-out;top:50px;box-shadow:inset 0 2px #fffc}.gba__l{border-radius:70px 30px 8px 8px;left:55px;rotate:-16.5deg}.gba__r{border-radius:30px 70px 8px 8px;left:695px;rotate:16.5deg}.gba__shoulder.is-down{translate:0 7px}.gba__speaker{border-radius:30px;width:145px;height:120px;top:318px;left:790px}.gba__wheel{z-index:0;background:repeating-linear-gradient(90deg,#dcd8e4 0 4px,#8f89a6 4px 8px);background-position-x:calc(var(--vol,.6) * 64px);touch-action:none;border-radius:0 0 8px 8px;width:90px;height:32px;position:absolute;top:580px;left:285px;box-shadow:inset 0 -3px 4px #00000059}.gba--big .gba__wheel{cursor:ew-resize}.obj[data-kind=gba] .obj__inner{cursor:zoom-in;overflow:visible}.gba--board .gba__body{filter:drop-shadow(0 6px 8px #1e0f0059)}.gba-inspect__wrap{opacity:0;justify-items:center;gap:22px;transition:opacity .3s,transform .4s cubic-bezier(.2,.8,.2,1);display:grid;transform:translateY(24px)scale(.96)}.gba-inspect.is-open .gba-inspect__wrap{opacity:1;transform:none}.gba-inspect .gba{--gba-w:min(94vw, 900px, calc((100dvh - 130px) * 1000 / 620))}.gba-inspect .gba__body{filter:drop-shadow(0 30px 40px #00000080)}.gba-inspect__keys{font:500 13px/1.3 var(--sans);color:#fffc;flex-wrap:wrap;justify-content:center;gap:6px 14px;margin:0;padding:0 16px;display:flex}.gba-inspect__keys kbd{min-width:18px;font:600 12px/1.4 var(--sans);text-align:center;background:#ffffff29;border-radius:4px;margin-right:3px;padding:1px 5px;display:inline-block}@media (hover:none){.gba-inspect__keys{display:none}}@media (prefers-reduced-motion:reduce){.gba-inspect__wrap,.gba__cross,.gba__round,.gba__small,.gba__shoulder,.gba__cross-v:before,.gba__cross-h:before{transition:none}}