:root{color-scheme:dark;--bg: #0d0912;--edge: rgba(255, 255, 255, .08)}*{box-sizing:border-box}html,body{margin:0;height:100%;background:radial-gradient(900px 520px at 50% -8%,#35254a 0%,transparent 70%),radial-gradient(700px 500px at 92% 108%,#1e2b3d 0%,transparent 68%),var(--bg);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#e9e0f2;overscroll-behavior:none;touch-action:manipulation;-webkit-font-smoothing:antialiased}#app{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:16px}canvas#screen{display:block;width:min(100%,calc((100dvh - 132px) * 1152 / 672));aspect-ratio:1152 / 672;height:auto;border-radius:14px;border:1px solid var(--edge);background:#0b0810;box-shadow:0 1px #ffffff0f inset,0 30px 70px -24px #000000e6,0 0 90px -30px #ffaa6e59}#touch{display:flex;width:min(100%,680px);justify-content:space-between;gap:20px;user-select:none}#touch .pad,#touch .acts{display:flex;gap:10px}#touch button{width:64px;height:64px;font-size:22px;font-weight:600;color:#efe6f8;border-radius:18px;border:1px solid var(--edge);background:linear-gradient(180deg,#ffffff17,#ffffff05);backdrop-filter:blur(12px);box-shadow:0 8px 20px -10px #000c;-webkit-tap-highlight-color:transparent;transition:transform 90ms ease,background 90ms ease}#touch button:active{transform:translateY(2px) scale(.97);background:linear-gradient(180deg,#ffffff2e,#ffffff0f)}@media (hover: hover) and (pointer: fine){#touch[hidden]{display:none}}@media (prefers-reduced-motion: reduce){#touch button{transition:none}}