: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__stage{display:flex;gap:18px;align-items:flex-start;justify-content:center;width:min(560px,92%);min-height:0;flex:0 1 auto}.menu{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0;max-height:100%;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgba(255,46,136,.5) transparent}.menu::-webkit-scrollbar,.menu__rows::-webkit-scrollbar{width:4px}.menu::-webkit-scrollbar-track,.menu__rows::-webkit-scrollbar-track{background:#ffffff0d;border-radius:2px}.menu::-webkit-scrollbar-thumb,.menu__rows::-webkit-scrollbar-thumb{background:#ff2e888c;border-radius:2px}.preview{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 12px 10px;background:#ffffff0a;border:1px solid rgba(255,255,255,.07);border-radius:10px}.preview__canvas{display:block;width:clamp(88px,17vw,132px);height:clamp(88px,17vw,132px);border-radius:8px;background:var(--ink)}.preview__caption{font-family:var(--mono-font);font-size:clamp(8.5px,1.6vw,10.5px);font-weight:600;letter-spacing:1.4px;text-align:center;color:var(--gold);opacity:.8;max-width:15ch;line-height:1.4}@media(max-width:566px),(max-height:340px){.screen--menu .logo,.screen--menu .keys{display:none}.menu__item{padding-top:6px;padding-bottom:6px}.menu__body{padding:8px 12px;line-height:1.5}.screen--menu.is-gallery .menu__body{display:none}.preview__canvas{width:62px;height:62px}.menu__stage{flex:1 1 auto}}@media(max-width:560px){.screen--menu.is-gallery .menu__stage{flex-direction:column-reverse;align-items:center}.screen--menu.is-gallery .menu{width:100%}.preview{flex-direction:row;gap:12px;padding:8px 12px}.preview__caption{max-width:20ch;text-align:left}}.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;min-width:0}.menu__sub{display:block;margin-top:2px;font-size:.72em;font-weight:500;letter-spacing:.6px;text-transform:none;opacity:.52}.menu__item.is-current .menu__sub{opacity:.75}.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}.menu__rows{display:flex;flex-direction:column;gap:1px;width:min(560px,92%);max-height:min(42vh,340px);overflow-y:auto;scrollbar-width:thin;padding:10px 12px;font-family:var(--mono-font);font-size:clamp(9.5px,1.85vw,12px);text-align:left;background:#ffffff0a;border:1px solid rgba(255,255,255,.07);border-radius:8px}.menu__row{display:grid;grid-template-columns:2.6em 1fr auto auto;gap:10px;align-items:baseline;padding:4px 6px;border-radius:4px;opacity:.8}.menu__row span:nth-child(3),.menu__row span:nth-child(4){text-align:right}.menu__row span:nth-child(1){color:var(--paper);opacity:.45}.menu__row span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.menu__row span:nth-child(3){color:var(--gold);font-variant-numeric:tabular-nums}.menu__row span:nth-child(4){opacity:.55;font-variant-numeric:tabular-nums}.menu__row.is-strong{opacity:1;color:#fff;background:linear-gradient(90deg,#ff2e8838,#ff2e8805);box-shadow:inset 2px 0 0 var(--hot)}.menu__row.is-strong span:nth-child(1){color:var(--hot);opacity:1}.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}.btn:disabled{opacity:.55;cursor:progress;transform:none}.btn--ghost{color:#f4f1eacc;background:#ffffff0f;border:1px solid rgba(255,255,255,.14);box-shadow:none;padding:11px 22px;font-size:.9em;letter-spacing:2px}.btn--ghost:hover{color:#fff;background:#ffffff1f;transform:none;box-shadow:none}.btn--ghost:active{transform:translateY(2px);box-shadow:none}.screen--account{gap:12px;background:radial-gradient(90% 70% at 50% 40%,#0b0d14e0,#040509f7)}.account__title{font-size:clamp(17px,3.4vw,26px);font-weight:800;letter-spacing:2px;color:var(--hot);text-shadow:0 0 26px rgba(255,46,136,.5)}.account__lead{max-width:46ch;opacity:.85!important}.account__note{max-width:46ch;font-size:clamp(9.5px,1.8vw,11.5px)!important;line-height:1.55;opacity:.5!important}.account__form{display:flex;flex-direction:column;gap:10px;width:min(360px,88%);margin-top:2px}.account__field{display:flex;flex-direction:column;gap:5px;text-align:left}.account__field span{font-size:10px;font-weight:700;letter-spacing:2.4px;opacity:.55}.account__field input{font:inherit;font-family:var(--mono-font);font-size:16px;color:#fff;background:#ffffff0f;border:1px solid rgba(255,255,255,.16);border-radius:6px;padding:10px 12px;-webkit-user-select:text;user-select:text}.account__field input:focus{outline:none;border-color:var(--hot);background:#ff2e8814}.account__error{font-size:clamp(10px,2vw,12px)!important;line-height:1.45;color:var(--hot);opacity:1!important;max-width:none!important;text-align:left}.account__actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center}.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}}