:root{--mag:#e20074;--mag2:#ff4fa7;--ink:#0b0d1c;--panel:#15182e;--line:#2a2f52;--text:#f3f0fa;--mute:#a7a3c2}*{box-sizing:border-box}html,body{background:var(--ink);color:var(--text);margin:0;font-family:Noto Sans,system-ui,sans-serif}.wrap{max-width:1280px;margin:0 auto;padding:18px}header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:12px;display:flex}h1{margin:0;font-family:"M PLUS Rounded 1c",sans-serif;font-size:clamp(18px,2.4vw,24px);font-weight:700}h1 span{color:var(--mag)}.tag{letter-spacing:.16em;color:var(--mute);font-size:11px}.led{background:#000;border:6px solid #1b1d31;border-radius:12px;position:relative;overflow:hidden;box-shadow:0 0 0 1px #2a2f52,0 30px 80px -30px #e2007473}.led svg{width:100%;height:auto;display:block}.grain{pointer-events:none;mix-blend-mode:multiply;opacity:.38;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .55  0 0 0 0 .5  0 0 0 0 .45  0 0 0 .9 0'/></filter><rect width='220' height='220' filter='url(%23g)'/></svg>");position:absolute;inset:0}.preview{position:relative}.ledlabel{letter-spacing:.16em;color:#fff9;pointer-events:none;font-size:11px;position:absolute;top:10px;left:14px}.count{color:#fff;pointer-events:none;background:#e20074d9;border-radius:20px;padding:4px 10px;font-family:"M PLUS Rounded 1c";font-size:13px;font-weight:700;position:absolute;top:8px;right:14px}.caption{opacity:0;pointer-events:none;background:linear-gradient(#0000,#050612e6);padding:16px 22px 14px;font-family:"M PLUS Rounded 1c";font-size:clamp(13px,1.9vw,24px);font-weight:700;line-height:1.3;transition:opacity .5s;position:absolute;bottom:0;left:0;right:0}.caption.on{opacity:1}.caption b{color:var(--mag2)}.hint{color:var(--mute);margin:10px 2px 0;font-size:13px}.machine{border:1px solid var(--line);background:linear-gradient(#1c1f3a,#111326);border-radius:24px;grid-template-columns:190px 1fr 250px;gap:18px;margin-top:16px;padding:18px;display:grid;position:relative}.mtitle{background:var(--mag);color:#fff;letter-spacing:.16em;border-radius:12px;padding:4px 12px;font-family:"M PLUS Rounded 1c";font-size:12px;font-weight:700;position:absolute;top:-11px;left:24px}.preview{border:1px solid var(--line);background:#efeaf8;border-radius:16px;flex-direction:column;display:flex;overflow:hidden}.preview svg{flex:1;width:100%;height:auto;display:block}.preview .pl{letter-spacing:.14em;color:var(--mute);text-align:center;border-top:1px solid var(--line);background:#141734;padding:8px 10px;font-size:11px}.dials{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.dial{border:1px solid var(--line);background:#171a33;border-radius:16px;flex-direction:column;align-items:center;gap:6px;padding:10px 8px;display:flex}.dlabel{letter-spacing:.14em;color:var(--mute);font-size:11px;font-weight:600}.knob{cursor:pointer;touch-action:manipulation;width:92px;height:92px}.knob .ptr{transform-origin:0 0;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}.knob:active .cap{transform:scale(.95)}.dval{text-align:center;align-items:center;min-height:36px;font-family:"M PLUS Rounded 1c";font-size:14px;font-weight:700;display:flex}.chips{grid-template-columns:repeat(4,1fr);gap:4px;width:100%;display:grid}.chips button{cursor:pointer;background:#2a2f52;border:none;border-radius:4px;height:8px;padding:0}.chips button.on{background:var(--mag)}.right{flex-direction:column;gap:12px;display:flex}.songs{border:1px solid var(--line);background:#171a33;border-radius:16px;padding:10px}.songs .dlabel{text-align:center;margin-bottom:8px}.songs button{border:1px solid var(--line);width:100%;color:var(--text);text-align:left;cursor:pointer;background:#0f1126;border-radius:10px;margin:5px 0 0;padding:9px 10px;font:600 13px Noto Sans;display:block}.songs button.on{background:var(--mag);border-color:var(--mag)}.send{color:#fff;letter-spacing:.12em;cursor:pointer;background:radial-gradient(circle at 30% 20%,#ff3d9a,#e20074 55%,#a30054);border:none;border-radius:16px;flex:1;min-height:84px;font:800 20px "M PLUS Rounded 1c";transition:transform .12s,box-shadow .12s;position:relative;box-shadow:0 8px #6d0038,0 18px 30px -10px #e2007499}.send:active,.send.pulled{transform:translateY(6px);box-shadow:0 2px #6d0038}.send:disabled{filter:saturate(.3)brightness(.7);cursor:default}.send small{letter-spacing:.08em;opacity:.85;margin-top:4px;font:600 11px Noto Sans;display:block}.ticket{color:#1b1630;background:#fbf7ee;border-radius:6px;max-width:520px;margin-top:16px;padding:14px 16px;animation:1.2s ease-out print;display:none;position:relative;box-shadow:0 20px 40px -20px #000}.ticket.show{grid-template-columns:90px 1fr 74px;align-items:center;gap:14px;display:grid}.ticket:before,.ticket:after{content:"";background:radial-gradient(circle at 6px -2px,#0000 6px,#fbf7ee 6.5px) 0 0/12px 8px repeat-x;height:8px;position:absolute;left:0;right:0}.ticket:before{top:-8px;transform:rotate(180deg)}.ticket:after{bottom:-8px}@keyframes print{0%{clip-path:inset(0 0 100%)}to{clip-path:inset(0)}}.ticket h3{letter-spacing:.18em;color:var(--mag);margin:0 0 2px;font:800 11px Noto Sans}.ticket .no{margin:0;font:700 28px "M PLUS Rounded 1c"}.ticket p{margin:2px 0;font-size:12.5px}.ticket .qr{text-align:center;color:#6b6585;font-size:9px}.tw{animation:3s ease-in-out infinite tw}@keyframes tw{0%,to{opacity:.25}50%{opacity:1}}.link{fill:none;stroke:var(--mag2);stroke-width:3px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px;filter:drop-shadow(0 0 6px #ff2d95);transition:stroke-dashoffset 1.1s ease-out,opacity .8s}.link.on{stroke-dashoffset:0}.modes{border:1px solid var(--line);background:#0d0f22;border-radius:14px;grid-column:1/-1;gap:8px;margin-top:6px;padding:5px;display:flex}.modes button{color:var(--mute);letter-spacing:.12em;cursor:pointer;background:0 0;border:none;border-radius:10px;flex:1;padding:11px 8px;font:800 13px Noto Sans}.modes button.on{background:var(--mag);color:#fff}.aib{letter-spacing:.06em;color:var(--mag);vertical-align:1px;background:#fff;border-radius:6px;margin-left:4px;padding:1px 5px;font-size:10px;display:inline-block}.modes button:not(.on) .aib{color:#fff;background:#2a2f52}.photo{border:1px solid var(--line);background:#171a33;border-radius:16px;grid-column:1/-1;grid-template-columns:260px 1fr;gap:14px;padding:12px;display:grid}.photo[hidden]{display:none}.pbtn{text-align:center;color:#fff;letter-spacing:.1em;cursor:pointer;background:radial-gradient(circle at 30% 20%,#ff3d9a,#e20074 60%,#a30054);border-radius:12px;padding:14px;font:800 14px "M PLUS Rounded 1c";display:block}.pbtn input{display:none}.pdemo{border:1px dashed var(--line);width:100%;color:var(--mute);cursor:pointer;background:0 0;border-radius:10px;margin-top:6px;padding:7px;font:600 12px Noto Sans;display:block}.pstat{color:var(--mute);margin-top:8px;font-size:11.5px;line-height:1.45}.feats{grid-template-columns:repeat(4,1fr);align-self:start;gap:10px;display:grid}.fg{border:1px solid var(--line);background:#0f1126;border-radius:12px;padding:8px}.fg .fl{letter-spacing:.14em;color:var(--mute);justify-content:space-between;margin-bottom:6px;font-size:10.5px;font-weight:700;display:flex}.fg .fl i{color:var(--mag2);opacity:0;font-style:normal;transition:opacity .4s}.fg.ai .fl i{opacity:1}.fg .fo{flex-wrap:wrap;gap:5px;display:flex}.fg button{border:1px solid var(--line);color:var(--text);cursor:pointer;background:#171a33;border-radius:8px;padding:5px 8px;font:600 11.5px Noto Sans}.fg button.sw{width:26px;height:26px;box-shadow:0 0 0 1px var(--line);border:2px solid #0f1126;border-radius:50%;padding:0}.fg button.on{box-shadow:0 0 0 2px var(--mag2);border-color:var(--mag2)}.scan{background:#0d0f22;display:none;position:absolute;inset:0 0 34px;overflow:hidden}.scan.on{display:block}.simg{background-position:50%;background-size:cover;transition:opacity .6s,filter .6s;position:absolute;inset:0}.simg.gone{opacity:0;filter:blur(8px)}.sline{background:var(--mag2);height:3px;animation:1.4s ease-in-out infinite alternate sl;position:absolute;top:0;left:0;right:0;box-shadow:0 0 14px 4px #ff4fa799}@keyframes sl{to{top:100%}}.stags{flex-direction:column;gap:4px;display:flex;position:absolute;bottom:8px;left:8px;right:8px}.stags span{border:1px solid var(--mag2);color:#fff;background:#0d0f22d9;border-radius:7px;align-self:flex-start;padding:3px 7px;font:700 11px Noto Sans;animation:.3s ease-out tg}@keyframes tg{0%{opacity:0;transform:translate(-10px)}}.sdel{text-align:center;letter-spacing:.14em;color:#fff;opacity:0;justify-content:center;align-items:center;padding:10px;font:800 12px Noto Sans;transition:opacity .4s;display:flex;position:absolute;inset:0}.sdel.on{opacity:1}.after{flex-wrap:wrap;align-items:flex-start;gap:22px;margin-top:16px;display:flex}.after .ticket{margin-top:0}.phone{background:#0a0b16;border-radius:36px;width:250px;padding:10px;animation:.8s ease-out print;box-shadow:0 0 0 2px #2a2f52,0 24px 50px -20px #e2007480}.phone[hidden]{display:none}.pscr{text-align:center;background:linear-gradient(#1d2350,#2c2457);border-radius:28px;padding:16px 14px 18px;position:relative}.pnotch{background:#0a0b16;border-radius:4px;width:70px;height:6px;margin:0 auto 12px}.pscr h4{letter-spacing:.16em;color:var(--mag2);margin:0;font:800 10.5px Noto Sans}.pscr .pn{margin:2px 0 6px;font:700 22px "M PLUS Rounded 1c"}.pscr svg{background:#efeaf8;border-radius:50%;width:118px;height:auto;margin:0 auto 8px;padding:8px 6px 4px;display:block}.pscr button{background:var(--mag);color:#fff;letter-spacing:.1em;cursor:pointer;border:none;border-radius:14px;width:100%;margin-top:8px;padding:12px;font:800 12.5px Noto Sans;display:block}.pscr button.sec{background:#2a2f52}.pscr button:disabled{opacity:.45;cursor:default}.pscr .pfoot{color:var(--mute);margin-top:10px;font-size:10.5px}@media (width<=760px){.photo{grid-template-columns:1fr}.feats{grid-template-columns:repeat(2,1fr)}}@media (width<=980px){.machine{grid-template-columns:1fr 1fr}.dials{order:3;grid-column:1/-1;grid-template-columns:repeat(2,1fr)}.preview{order:1}.right{order:2}}@media (width<=560px){.machine{grid-template-columns:1fr}.dials{order:2}.right{order:3}.preview svg{max-height:200px}.knob{width:80px;height:80px}.ticket.show{grid-template-columns:70px 1fr}.ticket .qrbox{display:none}}