.m1-frame{background:linear-gradient(135deg,#ffe08a,#f3a6d8 40%,#b98cf0 70%,#9fdcff);border-radius:26px;padding:10px;box-shadow:0 14px 40px #6e48aa4d}.m1-label{color:#4b2f86;margin-bottom:.4rem;font-size:.85rem;font-weight:800}.m1-tool{color:#4b2f86;text-align:center;background:#fff;border:2px solid #e3d4ff;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:.2rem;min-height:60px;padding:.35rem;font-size:.72rem;font-weight:800;line-height:1.1;transition:all .15s;display:flex}.m1-tool:hover:not(:disabled){border-color:#a77cf0;transform:translateY(-1px)}.m1-tool.is-active{color:#fff;background:linear-gradient(#a77cf0,#7b4fd1);border-color:#7b4fd1;box-shadow:0 4px 14px #7b4fd159}.m1-tool:disabled{opacity:.4;cursor:not-allowed}.m1-tool-danger{color:#c2255c}.m1-tool:focus-visible,.m1-swatch:focus-visible,.m1-sticker:focus-visible,.m1-card-btn:focus-visible{outline-offset:2px;outline:4px solid #ffd166}.m1-swatch{aspect-ratio:1;border:3px solid #fff;border-radius:999px;min-width:28px;transition:transform .12s;position:relative;box-shadow:0 0 0 1px #dccbff}.m1-swatch:hover{transform:scale(1.12)}.m1-swatch.is-active{transform:scale(1.1);box-shadow:0 0 0 2px #fff,0 0 0 5px #7b4fd1}.m1-swatch-custom{cursor:pointer;background:conic-gradient(#f0646d,#f7c948,#5cc8a8,#6ea8fe,#cc5de8,#f0646d);overflow:hidden}.m1-swatch-custom input{opacity:0;cursor:pointer;position:absolute;inset:0}.m1-sticker{aspect-ratio:1;background:#fff;border:2px solid #efe6ff;border-radius:12px;min-width:34px;font-size:1.3rem;transition:transform .12s}.m1-sticker:hover{transform:scale(1.1)}.m1-sticker.is-active{background:#f1e8ff;border-color:#7b4fd1}.m1-range{accent-color:#7b4fd1;height:28px}.m1-emo-card{animation:.5s ease-out both m1-card-in}@keyframes m1-card-in{0%{opacity:0;transform:translateY(20px)rotate(-2deg)}to{opacity:1;transform:none}}.m1-card-btn{text-align:left;border-radius:24px;transition:transform .15s,box-shadow .15s}.m1-card-btn:hover{transform:translateY(-4px);box-shadow:0 14px 30px #6e48aa47}.m1-art{background:#fff;border:6px solid #fff;border-radius:18px;box-shadow:0 0 0 4px #ffd978,0 14px 34px #6e48aa4d}@media (prefers-reduced-motion:reduce){.m1-emo-card{animation:none}}.eq-bars{align-items:flex-end;gap:4px;height:34px;display:flex}.eq-bars span{opacity:.55;background:currentColor;border-radius:4px;width:7px;height:6px}.eq-bars.is-on span{opacity:1;animation:.9s ease-in-out infinite eq-bounce}.eq-bars.is-on span:nth-child(2){animation-delay:-.2s}.eq-bars.is-on span:nth-child(3){animation-delay:-.45s}.eq-bars.is-on span:nth-child(4){animation-delay:-.1s}.eq-bars.is-on span:nth-child(5){animation-delay:-.6s}@keyframes eq-bounce{0%,to{height:6px}50%{height:32px}}.mood-card{transition:transform .2s,box-shadow .2s}.mood-card.is-playing{transform:translateY(-3px);box-shadow:0 0 0 4px #ffffffe6,0 14px 36px #6e48aa59}.pad{-webkit-user-select:none;user-select:none;touch-action:manipulation;border:3px solid #fffffff2;transition:transform 80ms,box-shadow 80ms,filter 80ms;position:relative;box-shadow:0 6px #50328c40,0 8px 18px #6e48aa33}.pad.is-pressed,.pad:active{filter:brightness(1.15);transform:translateY(4px)scale(.97);box-shadow:0 2px #50328c40}.pad.is-pressed:after{content:"";border-radius:inherit;pointer-events:none;border:3px solid #fff7c2;animation:.35s ease-out forwards pad-ring;position:absolute;inset:-6px}@keyframes pad-ring{0%{opacity:1;transform:scale(.9)}to{opacity:0;transform:scale(1.15)}}.seq-cell{background:#fff;border:2px solid #e3d4ff;border-radius:9px;flex-shrink:0;width:30px;height:30px;transition:transform .1s,background .1s}.seq-cell:hover{transform:scale(1.08)}.seq-cell.is-beat{background:#f6f0ff}.seq-cell.is-on{border-color:#fff;box-shadow:0 2px 6px #6e48aa59}.seq-cell.is-head{outline-offset:1px;outline:3px solid #ffd166}.seq-cell.is-on.is-head{transform:scale(1.15)}.seq-compact .seq-cell{border-radius:7px;width:24px;height:24px}@media (width<=640px){.seq-cell{width:26px;height:26px}}.rec-dot{background:#f0646d;border-radius:999px;width:12px;height:12px}.rec-dot.is-on{animation:1s ease-in-out infinite rec-pulse}@keyframes rec-pulse{50%{opacity:.3}}.note-float{color:#9b6bd8;pointer-events:none;font-size:1.6rem;animation:1.4s ease-out forwards note-up;position:absolute}@keyframes note-up{0%{opacity:1;transform:translateY(0)rotate(-10deg)}to{opacity:0;transform:translateY(-70px)rotate(15deg)}}
