:root{--dm-bg:#1a1d23;--dm-surface:#22262e;--dm-surface-alt:#2a2e38;--dm-border:#333842;--dm-text:#e2e8f0;--dm-text-muted:#94a3b8;--dm-primary:#6366f1;--dm-primary-glow:#6366f14d;--dm-accent:#22d3ee;--dm-accent-glow:#22d3ee40;--dm-step-off:#2a2e38;--dm-step-on:#6366f1;--dm-step-on-alt:#4f46e5;--dm-step-group-odd:#ffffff05;--dm-step-group-even:transparent;--dm-playhead:#22d3ee26;--dm-row-kick:#ef4444;--dm-row-snare:#f59e0b;--dm-row-hihat:#22d3ee;--dm-row-openhat:#06b6d4;--dm-row-clap:#a855f7;--dm-row-tom:#10b981;--dm-row-rim:#f97316;--dm-row-cymbal:#eab308;--dm-danger:#ef4444;--dm-danger-bg:#ef44441a;--dm-radius:6px;--dm-radius-sm:4px}._dm-container{max-width:1100px;color:var(--dm-text);margin:0 auto;font-size:.8125rem}._dm-label{text-transform:uppercase;letter-spacing:.05em;color:var(--dm-text-muted);white-space:nowrap;font-size:.6875rem;font-weight:600}._dm-select{background:var(--dm-surface);color:var(--dm-text);border-style:solid;border-width:1px;border-color:var(--dm-border);border-radius:var(--dm-radius-sm);cursor:pointer;outline:none;padding:.3rem .5rem;font-family:inherit;font-size:.8125rem}._dm-select:focus{border-color:var(--dm-primary);box-shadow:0 0 0 2px var(--dm-primary-glow)}._dm-btn-icon{background:var(--dm-surface);border-style:solid;border-width:1px;border-color:var(--dm-border);border-radius:var(--dm-radius-sm);width:32px;height:32px;color:var(--dm-text-muted);cursor:pointer;justify-content:center;align-items:center;padding:0;display:inline-flex}._dm-btn-icon:hover{color:var(--dm-text);border-color:var(--dm-text-muted)}._dm-btn-icon svg{width:14px;height:14px}@media (max-width:768px){._dm-container{padding-left:1rem;padding-right:1rem}}._dm-transport{background:var(--dm-surface);border-style:solid;border-width:1px;border-color:var(--dm-border);border-radius:var(--dm-radius);flex-wrap:wrap;align-items:center;gap:0;margin-bottom:.75rem;padding:0;display:flex;overflow:hidden}._dm-transport-group{flex-wrap:wrap;align-items:center;gap:1rem;padding:.625rem 1rem;display:flex}._dm-transport-group+._dm-transport-group{border-left-style:solid;border-left-width:1px;border-left-color:var(--dm-border)}._dm-btn-play{background:var(--dm-primary);color:#fff;cursor:pointer;width:40px;height:40px;box-shadow:0 2px 8px var(--dm-primary-glow);border:0 solid #0000;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}._dm-btn-play:hover{opacity:.9}._dm-btn-play.is-playing{background:var(--dm-accent);box-shadow:0 2px 12px var(--dm-accent-glow)}._dm-btn-play svg{width:18px;height:18px}._dm-bpm-control,._dm-swing-control{align-items:center;gap:.5rem;display:flex}._dm-bpm-slider,._dm-swing-slider,._dm-volume-slider{-webkit-appearance:none;appearance:none;background:var(--dm-border);cursor:pointer;border-radius:2px;outline:none;width:80px;height:4px}._dm-bpm-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--dm-primary);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}._dm-swing-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--dm-primary);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}._dm-volume-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--dm-primary);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}._dm-bpm-slider::-moz-range-thumb{background:var(--dm-primary);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}._dm-swing-slider::-moz-range-thumb{background:var(--dm-primary);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}._dm-volume-slider::-moz-range-thumb{background:var(--dm-primary);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}._dm-bpm-input{background:var(--dm-surface-alt);width:50px;color:var(--dm-text);border-style:solid;border-width:1px;border-color:var(--dm-border);border-radius:var(--dm-radius-sm);text-align:center;font-size:.8125rem;font-family:var(--main-font-mono);outline:none;padding:.25rem .375rem}._dm-bpm-input:focus{border-color:var(--dm-primary)}._dm-swing-value{color:var(--dm-text-muted);font-size:.75rem;font-family:var(--main-font-mono);min-width:2rem}._dm-volume-control,._dm-kit-select,._dm-preset-select{align-items:center;gap:.375rem;display:flex}._dm-btn-export:hover{color:var(--dm-accent);border-color:var(--dm-accent)}._dm-btn-clear:hover{color:var(--dm-danger);border-color:var(--dm-danger)}@media (max-width:640px){._dm-transport{flex-direction:column;align-items:stretch}._dm-transport-group{justify-content:center;gap:.625rem;padding:.5rem .75rem}._dm-transport-group+._dm-transport-group{border-top-style:solid;border-top-width:1px;border-left-width:0;border-top-color:var(--dm-border)}._dm-bpm-slider,._dm-swing-slider,._dm-volume-slider{width:60px}}._dm-sequencer{background:var(--dm-surface);border-style:solid;border-width:1px;border-color:var(--dm-border);border-radius:var(--dm-radius);overflow:hidden}._dm-grid-header{border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--dm-border);align-items:center;padding:.375rem 0;display:flex}._dm-header-label{flex-shrink:0;width:130px;padding-left:.75rem}._dm-header-steps{flex:1;gap:3px;padding:0 .5rem;display:flex}._dm-step-num{text-align:center;color:var(--dm-text-muted);font-size:.625rem;font-family:var(--main-font-mono);flex:1}._dm-step-num.is-beat{color:var(--dm-text);font-weight:600}._dm-row{border-bottom:1px solid #ffffff0a;align-items:center;padding:.3125rem 0;display:flex}._dm-row:last-child{border-bottom:none}._dm-row:hover{background:#ffffff05}._dm-row-info{flex-shrink:0;align-items:center;gap:.375rem;width:130px;padding-left:.75rem;display:flex}._dm-row-color{border-radius:2px;flex-shrink:0;width:4px;height:20px}._dm-row-name{color:var(--dm-text);white-space:nowrap;min-width:48px;font-size:.75rem;font-weight:500}._dm-row-vol{-webkit-appearance:none;appearance:none;background:var(--dm-border);cursor:pointer;border-radius:2px;outline:none;width:40px;height:3px}._dm-row-vol::-webkit-slider-thumb{-webkit-appearance:none;background:var(--dm-text-muted);cursor:pointer;border:none;border-radius:50%;width:10px;height:10px}._dm-row-vol::-moz-range-thumb{background:var(--dm-text-muted);cursor:pointer;border:none;border-radius:50%;width:10px;height:10px}._dm-row-mute{width:20px;height:20px;color:var(--dm-text-muted);cursor:pointer;background:0 0;border:0 solid #0000;border-radius:3px;justify-content:center;align-items:center;padding:0;font-size:.6875rem;font-weight:600;display:flex}._dm-row-mute:hover{color:var(--dm-text)}._dm-row-mute.is-muted{color:var(--dm-danger);background:var(--dm-danger-bg)}._dm-row-steps{flex:1;gap:3px;padding:0 .5rem;display:flex}._dm-step{aspect-ratio:1;border-radius:var(--dm-radius-sm);cursor:pointer;background:var(--dm-step-off);border:0 solid #0000;flex:1;max-height:32px;padding:0;transition:background-color 50ms}._dm-step:hover{opacity:.8}._dm-step.is-on{background:var(--dm-step-on);box-shadow:0 0 6px var(--dm-primary-glow)}._dm-step.is-group-odd{background:var(--dm-step-group-odd)}._dm-step.is-on.is-group-odd{background:var(--dm-step-on-alt)}._dm-step.is-current{box-shadow:inset 0 0 0 2px var(--dm-accent), 0 0 8px var(--dm-accent-glow)}._dm-step.is-triggered{background:var(--dm-accent)!important}@media (max-width:768px){._dm-row-info{gap:.25rem;width:90px;padding-left:.5rem}._dm-row-name{min-width:36px;font-size:.6875rem}._dm-row-vol{width:28px}._dm-header-label{width:90px;padding-left:.5rem}._dm-step{max-height:26px}._dm-row-steps,._dm-header-steps{gap:2px;padding:0 .375rem}}@media (max-width:480px){._dm-row-info{width:70px}._dm-row-vol{display:none}._dm-header-label{width:70px}._dm-step{border-radius:2px;max-height:22px}}