:root{--ink: #0b0d14;--ink-soft: #161a26;--paper: #f4f1ea;--hot: #ff2e88;--hot-deep: #7a0d3f;--gold: #f2c94c;--ui-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--mono-font: ui-monospace, "SF Mono", "Courier New", monospace;--radius: 10px}*{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html,body{height:100%}body{background:#000;color:var(--paper);font-family:var(--ui-font);display:flex;align-items:center;justify-content:center;overflow:hidden;-webkit-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}#app{width:100vw;height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:0}#frame{position:relative;width:min(100vw,calc(100dvh * 5 / 3));height:min(100dvh,calc(100vw * 3 / 5));overflow:hidden;background:#000;box-shadow:0 0 120px -20px #ff2e8840}canvas{display:block;width:100%;height:100%}.hud{position:absolute;inset:0 0 auto;display:flex;gap:8px;padding:12px 14px;font-size:clamp(9px,1.7vw,12px);font-weight:600;letter-spacing:1.6px;pointer-events:none}.hud__item{padding:5px 10px;border-radius:999px;color:#f4f1eadb;background:#080a106b;border:1px solid rgba(255,255,255,.09);backdrop-filter:blur(6px)}.hud__item--right{margin-left:auto;color:var(--hot)}.hud b{color:#fff;font-variant-numeric:tabular-nums;font-family:var(--mono-font)}.taunt{position:absolute;left:0;right:0;top:34%;padding:0 20px;font-size:clamp(16px,3.6vw,30px);font-weight:800;letter-spacing:-.2px;text-shadow:0 4px 18px rgba(0,0,0,.9),0 0 30px rgba(255,46,136,.55);text-align:center;opacity:0;transform:translateY(8px) scale(.97);transition:opacity .14s ease,transform .14s ease;pointer-events:none}.taunt.is-on{opacity:1;transform:none}.screen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:22px;text-align:center;background:radial-gradient(90% 70% at 50% 40%,#0b0d1499,#06070ce6);backdrop-filter:blur(6px) saturate(.9);animation:fade-in .2s ease both;overflow-y:auto}.screen.is-hidden{display:none!important}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.logo{font-size:clamp(24px,5.6vw,46px);font-weight:800;line-height:.92;letter-spacing:-1.5px;text-shadow:0 6px 30px rgba(0,0,0,.8)}.logo span{display:block;color:var(--hot);font-size:.54em;letter-spacing:9px;text-shadow:0 0 26px rgba(255,46,136,.75)}.screen p{font-size:clamp(11px,2.2vw,14px);line-height:1.6;max-width:52ch;opacity:.78}.tagline{max-width:46ch}.keys{opacity:.4!important;font-size:clamp(9px,1.8vw,11px)!important;letter-spacing:1.2px}.screen--menu.is-compact .logo{display:none}.screen--menu.is-compact .tagline{font-size:clamp(13px,2.6vw,18px)!important;font-weight:700;letter-spacing:2px;opacity:1;color:var(--hot)}.menu{display:flex;flex-direction:column;gap:2px;width:min(560px,92%)}.menu__item{display:flex;align-items:baseline;gap:14px;width:100%;padding:9px 16px 9px 30px;font:inherit;font-size:clamp(12px,2.3vw,16px);font-weight:700;letter-spacing:2px;text-align:left;color:#f4f1eab8;background:transparent;border:0;border-radius:6px;cursor:pointer;position:relative;transition:color .1s ease,background-color .1s ease,transform .1s ease}.menu__item:before{content:"▸";position:absolute;left:10px;color:var(--hot);opacity:0;transform:translate(-6px);transition:opacity .1s ease,transform .1s ease}.menu__item.is-current{color:#fff;background:linear-gradient(90deg,#ff2e8838,#ff2e8805);transform:translate(3px)}.menu__item.is-current:before{opacity:1;transform:none}.menu__item.is-locked{color:#f4f1ea42;cursor:not-allowed}.menu__item:focus-visible{outline:2px solid var(--hot);outline-offset:2px}.menu__label{flex:1}.menu__value{font-family:var(--mono-font);font-size:.78em;font-weight:600;letter-spacing:.5px;color:var(--gold);opacity:.85}.menu__item.is-locked .menu__value{color:inherit}.menu__hint{min-height:1.4em;font-size:clamp(10px,2vw,13px)!important;opacity:.6!important;color:var(--hot)}.menu__body{display:flex;flex-direction:column;gap:6px;width:min(560px,92%);padding:14px 18px;text-align:left;font-family:var(--mono-font);font-size:clamp(10px,1.9vw,12.5px);line-height:1.75;background:#ffffff0a;border:1px solid rgba(255,255,255,.07);border-radius:8px}.menu__body p{font-size:inherit!important;opacity:.8;max-width:none}.btn{font:inherit;font-weight:800;letter-spacing:2.5px;color:#fff;background:linear-gradient(180deg,#ff4d9b,var(--hot));border:0;padding:13px 30px;border-radius:8px;cursor:pointer;box-shadow:0 4px 0 var(--hot-deep),0 12px 30px -10px #ff2e88cc;transition:transform .08s ease,box-shadow .08s ease}.btn:hover{transform:translateY(-1px);box-shadow:0 5px 0 var(--hot-deep),0 16px 34px -10px #ff2e88e6}.btn:active{transform:translateY(4px);box-shadow:0 0 0 var(--hot-deep)}.btn:focus-visible{outline:3px solid #fff;outline-offset:3px}.pad{position:absolute;inset:auto 0 0;display:none;justify-content:space-between;gap:10px;padding:14px}.pad__group{display:flex;gap:12px;align-items:center}.pad__key{width:66px;height:66px;border-radius:50%;font:inherit;font-size:24px;font-weight:700;color:#fff;background:#f4f1ea1f;border:1.5px solid rgba(244,241,234,.34);backdrop-filter:blur(4px)}.pad__key--menu{width:46px;height:46px;font-size:15px;opacity:.7}.pad__key:active{background:var(--hot);border-color:var(--hot)}body.is-touch .pad{display:flex}.footer{position:absolute;bottom:10px;left:0;right:0;font-size:11px;letter-spacing:1px;text-align:center;opacity:.3;pointer-events:none}@media(min-aspect-ratio:5 / 3){.footer{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}