.ufrd2m0{color:#f8fafc;background-color:#020205;flex-direction:column;width:100vw;height:100vh;font-family:JetBrains Mono,BIZ UDPGothic,sans-serif;display:flex;overflow:hidden}
.ufrd2m1{background-color:#000;flex:65%;min-height:0;position:relative;overflow:hidden}
.ufrd2m2{position:absolute;inset:0}
.ufrd2m3{background-color:#0a0a0f;border-top:1px solid #1a1a24;flex-direction:column;flex:0 0 35%;min-height:0;display:flex;overflow:hidden}
.ufrd2m4{cursor:row-resize;touch-action:none;-webkit-user-select:none;user-select:none;background:linear-gradient(#0f172afa,#082f49e0,#0f172afa);border-top:1px solid #1a1a24;border-bottom:1px solid #1a1a24;flex:0 0 12px;justify-content:center;align-items:center;display:flex}
.ufrd2m5{background-color:#7dd3fce6;border-radius:999px;width:72px;height:4px;box-shadow:0 0 16px #38bdf859}
.ufrd2m6{border-bottom:1px solid #1a1a24;flex-wrap:wrap;align-items:center;gap:12px;padding:12px;display:flex}
.ufrd2m7{flex-wrap:wrap;align-items:center;gap:8px;display:flex}
.ufrd2m8{letter-spacing:.12em;color:#94a3b8;font-size:.68rem;font-weight:800}
.ufrd2m9{flex-wrap:wrap;align-items:center;gap:8px;display:flex}
.ufrd2ma{color:#f8fafc;cursor:pointer;background-color:#111;border:1px solid #1a1a24;border-radius:8px;min-width:46px;padding:8px 10px;font-size:.78rem;font-weight:700;transition:all .2s}
.ufrd2ma:hover{background-color:#161622;border-color:#38bdf8}
.ufrd2mb{cursor:ew-resize;accent-color:#38bdf8;width:160px}
.ufrd2mc{color:#f8fafc;text-align:center;background-color:#111;border:1px solid #1a1a24;border-radius:8px;width:64px;padding:8px 10px;font-size:.8rem;font-weight:700}
.ufrd2md{flex-direction:column;flex:1;gap:10px;padding:12px;display:flex;overflow-y:auto}
.ufrd2me{border-top:1px solid #1a1a24;flex-direction:column;gap:10px;padding-top:8px;display:flex}
.ufrd2mf{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}
.ufrd2mg{letter-spacing:.18em;color:#cbd5e1;margin:0;font-size:.78rem;font-weight:800}
.ufrd2mh{background-color:#0f172ad1;border:1px solid #ffffff0f;border-radius:999px;flex:1;min-width:220px;height:10px;position:relative;overflow:hidden}
.ufrd2mi{pointer-events:none;background-image:linear-gradient(90deg,#94a3b814 1px,#0000 1px);background-size:6.25% 100%;position:absolute;inset:0}
.ufrd2mj{pointer-events:none;background-color:#ffffff1f;border-left:1px solid #ffffffe6;border-right:1px solid #ffffff29;border-radius:999px;position:absolute;top:-1px;bottom:-1px;box-shadow:0 0 16px #ffffff1f}
.ufrd2mj[data-track=rhythm]{background-color:#f43f5e2e;border-left-color:#fda4aff2;box-shadow:0 0 16px #f43f5e38}
.ufrd2mj[data-track=harmony]{background-color:#38bdf824;border-left-color:#7dd3fcf2;box-shadow:0 0 16px #38bdf833}
.ufrd2mk{flex-direction:column;gap:10px;display:flex}
.ufrd2ml{flex-wrap:wrap;align-items:flex-start;gap:10px 16px;display:flex}
.ufrd2mm{flex-wrap:wrap;align-items:center;gap:8px;display:flex}
.ufrd2mn{letter-spacing:.12em;color:#94a3b8;font-size:.68rem;font-weight:800}
.ufrd2mo{flex-wrap:wrap;gap:8px;display:flex}
.ufrd2mp{flex-wrap:wrap;gap:8px;display:flex}
.ufrd2mq{color:#f8fafc;background-color:#0f172a8c;border:1px solid #1a1a24;border-radius:8px;min-width:92px;padding:7px 10px;font-size:.76rem;font-weight:700}
.ufrd2mr{align-items:center;gap:12px;display:flex}
.ufrd2ms{color:#64748b;letter-spacing:.1em;width:70px;font-size:.65rem;font-weight:800}
.ufrd2mt{flex:1;gap:4px;display:flex}
.ufrd2mu{cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;background-color:#ffffff08;border:1px solid #0000;border-radius:4px;flex:1;height:28px;transition:all .1s}
.ufrd2mu[data-active=true][data-lane=kick]{color:#f43f5e;background-color:#f43f5e}
.ufrd2mu[data-active=true][data-lane=snare]{color:#fb923c;background-color:#fb923c}
.ufrd2mu[data-active=true][data-lane=hihat]{color:#fbbf24;background-color:#fbbf24}
.ufrd2mu[data-active=true][data-lane=chord]{color:#0ea5e9;background-color:#0ea5e9}
.ufrd2mu[data-active=true][data-lane=melody]{color:#a78bfa;background-color:#a78bfa}
.ufrd2mu[data-active=true]{box-shadow:inset 0 0 8px,0 0 12px}
.ufrd2mu[data-playhead=true]{z-index:2;filter:brightness(1.5);border-color:#fff;transform:scaleY(1.15)}
.ufrd2mv{z-index:100;pointer-events:none;flex-direction:column;gap:10px;display:flex;position:absolute;top:20px;left:20px}
.ufrd2mw{color:#f8fafc;letter-spacing:.08em;text-transform:lowercase;text-shadow:0 0 18px #7dd3fc66,0 0 34px #38bdf833;margin:0;font-family:Apple Chancery,Snell Roundhand,URW Chancery L,Palatino Linotype,serif;font-size:clamp(1.35rem,2.7vw,2rem);font-style:italic;font-weight:500;line-height:.92}
.ufrd2mx{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#38bdf8;background-color:#000000bf;border:1px solid #ffffff1a;border-radius:4px;width:fit-content;padding:4px 12px;font-size:.65rem}
.ufrd2my{color:#fff;text-shadow:0 0 8px #38bdf8;font-size:1rem;font-weight:900}
.ufrd2mz{color:#f8fafc;cursor:pointer;pointer-events:auto;background-color:#111;border:1px solid #1a1a24;border-radius:8px;align-items:center;gap:6px;padding:8px 16px;font-size:.8rem;font-weight:700;transition:all .2s;display:flex}
.ufrd2mz:hover:not(:disabled){background-color:#161622;border-color:#38bdf8}
.ufrd2mz[data-primary=true]{color:#000;background-color:#38bdf8;border-color:#38bdf8}
.ufrd2mz:disabled{opacity:.3;cursor:not-allowed}
.ufrd2m10{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background-color:#000000d9;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}
.ufrd2m11{background-color:#0a0a0f;border:1px solid #1a1a24;border-radius:20px;flex-direction:column;width:100%;max-width:800px;max-height:90vh;display:flex;overflow:hidden}
.ufrd2m12{border-bottom:1px solid #1a1a24;justify-content:space-between;align-items:center;padding:20px;display:flex}
.ufrd2m13{flex:1;grid-template-columns:repeat(1,1fr);gap:12px;padding:20px;display:grid;overflow-y:auto}
.ufrd2m14{background-color:#020205;border:1px solid #1a1a24;border-radius:12px;flex-direction:column;gap:10px;padding:16px;transition:all .2s;display:flex}
.ufrd2m14:hover{border-color:#38bdf8}
.ufrd2m15{justify-content:space-between;align-items:flex-start;display:flex}
.ufrd2m16{color:#fff;font-size:1rem;font-weight:800}
.ufrd2m17{color:#fbbf24;font-size:.85rem;font-weight:900}
.ufrd2m18{color:#64748b;font-size:.75rem;line-height:1.5}
.ufrd2m19{flex-wrap:wrap;gap:8px;padding:10px 12px 0;display:flex}
.ufrd2m1a{color:#cbd5e1;background-color:#0f172a8c;border:1px solid #1a1a24;border-radius:999px;padding:6px 10px;font-size:.68rem}
.ufrd2m1b{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}
.ufrd2m1c{flex-wrap:wrap;align-items:center;gap:8px;display:flex}
.ufrd2m1d{letter-spacing:.16em;color:#e2e8f0;font-size:.78rem}
.ufrd2m1e{color:#64748b;font-size:.68rem}
.ufrd2m1f{border-top:1px solid #1a1a24;flex-direction:column;gap:10px;padding-top:8px;display:flex}
.ufrd2m1g{flex-wrap:wrap;gap:8px;display:flex}
.ufrd2m1h{color:#cbd5e1;cursor:pointer;background-color:#0f172a8c;border:1px solid #1a1a24;border-radius:999px;padding:6px 10px;font-size:.72rem;font-weight:700;transition:all .18s}
.ufrd2m1h[data-active=true]{color:#f8fafc;background-color:#0ea5e92e;border-color:#7dd3fc99;box-shadow:0 0 0 1px #7dd3fc33}
.ufrd2m1i{cursor:crosshair;background:linear-gradient(#0f172ae0,#020617f5);border:1px solid #1a1a24;border-radius:16px;min-height:92px;position:relative;overflow:hidden}
.ufrd2m1j{pointer-events:none;grid-template-columns:repeat(32,1fr);display:grid;position:absolute;inset:0}
.ufrd2m1k{border-right:1px solid #94a3b814}
.ufrd2m1k[data-strong=true]{border-right-color:#38bdf82e}
.ufrd2m1l{pointer-events:none;background-color:#0ea5e914;border-left:1px solid #7dd3fcd1;border-right:1px solid #7dd3fc24;position:absolute;top:0;bottom:0}
.ufrd2m1m{cursor:grab;background:linear-gradient(135deg,#0ea5e9e6,#22c55ed1);border:1px solid #ffffff29;border-radius:12px;justify-content:space-between;align-items:center;padding-left:10px;display:flex;position:absolute;top:14px;bottom:14px;overflow:hidden;box-shadow:0 10px 24px #0891b233}
.ufrd2m1m[data-selected=true]{background:linear-gradient(135deg,#facc15f5,#fb923ceb);box-shadow:0 0 0 1px #fef08ae6,0 10px 28px #fbbf244d}
.ufrd2m1m:active{cursor:grabbing}
.ufrd2m1n{color:#020617;letter-spacing:.05em;pointer-events:none;font-size:.72rem;font-weight:800}
.ufrd2m1o{cursor:ew-resize;background:linear-gradient(#ffffffb3,#ffffff14);border-left:1px solid #ffffff47;align-self:stretch;width:10px}
.ufrd2m1p{border-top:1px solid #1a1a24;flex-direction:column;gap:10px;padding-top:8px;display:flex}
.ufrd2m1q{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}
.ufrd2m1r{flex-wrap:wrap;align-items:center;gap:8px;display:flex}
.ufrd2m1s{color:#64748b;font-size:.68rem}
.ufrd2m1t{grid-template-columns:48px 1fr;gap:10px;min-height:280px;display:grid}
.ufrd2m1u{grid-template-rows:repeat(8,1fr);gap:4px;display:grid}
.ufrd2m1v{color:#64748b;background-color:#ffffff05;border:1px solid #ffffff0a;border-radius:8px;justify-content:center;align-items:center;font-size:.65rem;display:flex}
.ufrd2m1v[data-in-scale=true]{color:#dbeafe;background-color:#3b82f614;border-color:#60a5fa42}
.ufrd2m1w{cursor:crosshair;background:radial-gradient(circle at top,#38bdf824,#0000 50%),linear-gradient(#0f172ad9,#020617eb);border:1px solid #1a1a24;border-radius:16px;min-height:280px;position:relative;overflow:hidden}
.ufrd2m1x{pointer-events:none;grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(32,1fr);display:grid;position:absolute;inset:0}
.ufrd2m1y{border-bottom:1px solid #94a3b814;border-right:1px solid #94a3b814}
.ufrd2m1y[data-strong=true]{border-right-color:#38bdf833}
.ufrd2m1z{pointer-events:none;background-color:#38bdf814;border-left:1px solid #7dd3fccc;border-right:1px solid #7dd3fc29;position:absolute;top:0;bottom:0}
.ufrd2m20{cursor:grab;background:linear-gradient(135deg,#60a5faeb,#a78bfaeb);border:1px solid #ffffff38;border-radius:10px;align-items:center;gap:8px;padding-left:8px;padding-right:8px;display:flex;position:absolute;overflow:hidden;box-shadow:0 10px 24px #3b82f63d}
.ufrd2m20[data-fit=chord]{background:linear-gradient(135deg,#10b981f0,#2dd4bfeb);box-shadow:0 10px 24px #14b8a63d}
.ufrd2m20[data-fit=scale]{background:linear-gradient(135deg,#60a5faeb,#a78bfaeb)}
.ufrd2m20[data-fit=out]{background:linear-gradient(135deg,#f43f5eeb,#fb923ce6);box-shadow:0 10px 24px #ef44443d}
.ufrd2m20[data-selected=true]{background:linear-gradient(135deg,#facc15f5,#fb923ceb);box-shadow:0 0 0 1px #fef08ae6,0 10px 28px #fbbf2452}
.ufrd2m20:active{cursor:grabbing}
.ufrd2m21{color:#020617;letter-spacing:.04em;pointer-events:none;font-size:.68rem;font-weight:800}
.ufrd2m22{letter-spacing:.08em;color:#020617cc;pointer-events:none;background-color:#ffffff6b;border-radius:999px;padding:2px 6px;font-size:.58rem;font-weight:900}
.ufrd2m23{cursor:ew-resize;background:linear-gradient(#ffffffb3,#ffffff14);border-left:1px solid #ffffff47;align-self:stretch;width:10px}
@media (max-width:640px){.ufrd2mb{width:120px}}
@media (min-width:640px){.ufrd2m13{grid-template-columns:repeat(2,1fr)}}