:root{--bg-1: #2a2730;--bg-2: #121116;color-scheme:dark}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;background:radial-gradient(120% 90% at 50% 30%,var(--bg-1),var(--bg-2));overflow:hidden;overscroll-behavior:none}body{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:manipulation;font-family:system-ui,sans-serif}.stage{height:100dvh;width:100vw;display:grid;place-items:center;padding:max(4px,env(safe-area-inset-top)) max(4px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(4px,env(safe-area-inset-left))}.device{display:block;width:min(100%,calc((100dvh - 8px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * 1058 / 1780));height:auto;max-height:100%;filter:drop-shadow(0 8px 16px rgba(0,0,0,.5));touch-action:none}.key{cursor:pointer}.key:focus{outline:none}.key-label{font-family:Arial Black,Helvetica Neue,Arial,system-ui,sans-serif;font-weight:900;font-size:58px;fill:#141318;pointer-events:none}.led-glow{animation:glow .9s ease-in-out infinite alternate;pointer-events:none}@keyframes glow{0%{opacity:.75}to{opacity:1}}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}