@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=IBM+Plex+Sans:wght@400;500;600&display=swap";:root{color-scheme:dark;font-family:IBM Plex Sans,system-ui,sans-serif;--bg: #081019;--bg-soft: rgba(17, 24, 34, .9);--panel: rgba(11, 18, 28, .8);--panel-strong: rgba(17, 24, 34, .96);--line: rgba(255, 255, 255, .08);--text: #f2f6fa;--muted: rgba(242, 246, 250, .65);--danger: #ff5a6f;--success: #38e6a7;--warning: #ffba43;--info: #53b7ff;--radius: 1.4rem;--shadow: 0 30px 80px rgba(0, 0, 0, .3);--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box}html{background:var(--bg);color:var(--text);-webkit-text-size-adjust:100%}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at top left,rgba(60,225,255,.22),transparent 26%),radial-gradient(circle at 80% 12%,rgba(83,183,255,.16),transparent 18%),radial-gradient(circle at bottom right,rgba(56,230,167,.12),transparent 22%),linear-gradient(180deg,#101826,#080d14 48%,#06090f);overflow-x:hidden;-webkit-user-select:none;user-select:none;touch-action:manipulation;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}button,input,select{font:inherit}button{cursor:pointer}#root{min-height:100vh}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0}.app-shell{min-height:100vh;padding-bottom:calc(8.8rem + var(--safe-bottom));position:relative}.app-shell.bottom-bar-collapsed{padding-bottom:calc(3.8rem + var(--safe-bottom))}.app-bg{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.06),transparent 20%),radial-gradient(circle at 70% 80%,rgba(60,225,255,.09),transparent 25%)}.app-container{width:min(100%,78rem);margin:0 auto;padding:calc(1rem + var(--safe-top)) 1rem 1.5rem;display:grid;gap:1rem}.topbar,.beat-deck,.pad-card,.bottom-bar,.welcome-card,.sheet-panel,.notice-card{-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}.topbar{display:grid;gap:.9rem;padding:1.15rem;border-radius:calc(var(--radius) + .45rem);background:linear-gradient(135deg,#0a101bfa,#070c15eb 56%,#121a26f0),linear-gradient(180deg,#0d131ef5,#0a0f18db);border:1px solid rgba(111,145,176,.16);box-shadow:inset 0 1px #ffffff0d,0 30px 80px #00000057;position:relative;overflow:hidden}.topbar:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at right top,rgba(255,196,87,.12),transparent 22%),radial-gradient(circle at 12% 100%,rgba(60,225,255,.12),transparent 32%),linear-gradient(90deg,rgba(255,255,255,.03),transparent 28%);pointer-events:none}.topbar:after{content:"";position:absolute;top:1rem;right:1rem;bottom:1rem;left:1rem;border-radius:calc(var(--radius) + .1rem);border:1px solid rgba(255,255,255,.03);pointer-events:none}.topbar-main{position:relative;z-index:1;display:grid;gap:1.15rem}.topbar-copy,.topbar-side{display:grid;gap:.9rem}.topbar-copy{align-content:space-between}.topbar-copy-panel{display:grid;gap:1rem;min-height:100%;padding:.15rem}.beat-deck{display:grid;gap:1rem;padding:1rem;border-radius:calc(var(--radius) + .3rem);background:radial-gradient(circle at top right,rgba(60,225,255,.1),transparent 28%),linear-gradient(180deg,#0d131ef0,#0a0f18e0);border:1px solid var(--line);box-shadow:var(--shadow)}.brand-block,.topbar-row,.beat-head,.beat-current,.beat-actions,.beat-state,.bpm-panel,.meter-row,.pad-header,.pad-actions,.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.brand-mark{display:grid;place-items:center;width:3rem;height:3rem;border-radius:1rem;background:linear-gradient(145deg,#3ce1ff38,#38e6a72e);border:1px solid rgba(60,225,255,.18);font-family:Space Grotesk,sans-serif;font-weight:700;letter-spacing:.06em}.brand-block{justify-content:flex-start;align-items:flex-start}.brand-block>div:last-child{min-width:0}.topbar-description{max-width:32rem;margin:0;color:#e2ecf7b8;font-size:.98rem;line-height:1.7}.topbar-status-cluster{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.topbar-stat-strip{display:grid;grid-template-columns:minmax(0,1fr);gap:.75rem;max-width:34rem}.topbar-stat-card{display:grid;gap:.28rem;padding:.95rem 1rem;border-radius:1.15rem;border:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,#ffffff0b,#ffffff08),radial-gradient(circle at top left,rgba(60,225,255,.08),transparent 60%);box-shadow:inset 0 1px #ffffff0a}.topbar-stat-card span{color:#e2ecf78c;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase}.topbar-stat-card strong{font-family:Space Grotesk,sans-serif;font-size:.95rem;font-weight:600}.eyebrow{margin:0 0 .2rem;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:#f2f6fa85}.topbar h2,.beat-deck h3,.sheet-panel h3,.project-card h4,.welcome-card h1{margin:0;font-family:Space Grotesk,sans-serif}.status-pill,.toggle-chip,.icon-button,.tap-button,.hero-button,.ghost-button,.control-button,.tiny-action{min-height:48px}.status-pill{display:inline-flex;align-items:center;gap:.6rem;padding:.78rem 1rem;border-radius:999px;background:linear-gradient(180deg,#ffffff0f,#ffffff09),radial-gradient(circle at left,rgba(60,225,255,.12),transparent 38%);border:1px solid rgba(255,255,255,.09)}.status-pill strong,.toggle-chip,.topbar-settings,.tap-button{white-space:nowrap}.status-dot{width:.6rem;height:.6rem;border-radius:999px;background:linear-gradient(180deg,#3ce1ff,#34e39f);box-shadow:0 0 .9rem #3ce1ff80}.mini-meter,.level-meter,.progress-track{position:relative;overflow:hidden}.mini-meter{width:3.2rem;height:.44rem;border-radius:999px;background:#ffffff14}.mini-meter span,.level-meter span,.progress-track span{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:left center;border-radius:inherit}.mini-meter span{background:linear-gradient(90deg,#3ce1ff,#34e39f)}.topbar-status-pill{box-shadow:inset 0 1px #ffffff0a}.toggle-chip,.icon-button,.tap-button,.ghost-button,.control-button,.tiny-action{border:1px solid var(--line);color:var(--text);background:#ffffff0a;border-radius:1rem;padding:.75rem .95rem}.toggle-chip.active,.control-button.active,.tiny-action.active{background:#3ce1ff24;border-color:#3ce1ff4d;box-shadow:0 0 0 1px #3ce1ff2e inset}.topbar-metro-chip{background:linear-gradient(180deg,#ffffff0b,#ffffff08),radial-gradient(circle at top left,rgba(83,183,255,.09),transparent 58%)}.icon-button,.tap-button,.control-button,.tiny-action{display:inline-flex;align-items:center;justify-content:center}.bpm-panel{display:grid;gap:1rem;align-items:start}.bpm-info span,.bpm-info small,.beat-current p,.field-block span,.slider-block span,.project-card p,.welcome-copy,.notice-card,.waveform-empty{color:var(--muted)}.bpm-info strong{display:block;font-size:clamp(1.7rem,5vw,2.4rem);line-height:1;font-family:Space Grotesk,sans-serif}.bpm-card{padding:.95rem 1rem 1rem;border-radius:1.35rem;border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,#ffffff0f,#ffffff09),radial-gradient(circle at top left,rgba(83,183,255,.11),transparent 42%);box-shadow:inset 0 1px #ffffff0d,0 18px 34px #0000002e}.bpm-card-premium{display:grid;gap:1rem}.bpm-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:.8rem}.bpm-card-top .eyebrow{margin-bottom:.35rem}.bpm-card-caption{margin:0;color:#e2ecf7a3;font-size:.84rem}.bpm-sync-indicator{display:inline-flex;align-items:center;justify-content:center;min-width:4.2rem;min-height:2rem;padding:.35rem .7rem;border-radius:999px;border:1px solid rgba(255,255,255,.09);background:#ffffff0a;color:#e2ecf7a8;font-size:.72rem;font-weight:700;letter-spacing:.14em}.bpm-sync-indicator.live{color:#dffcff;border-color:#3ce1ff47;background:linear-gradient(180deg,#3ce1ff24,#38e6a71f),#ffffff0a;box-shadow:0 0 0 1px #3ce1ff1f inset}.bpm-info{display:grid;gap:.2rem}.bpm-controls{display:grid;grid-template-columns:auto minmax(4.5rem,6rem) auto;gap:.55rem;align-items:center}.bpm-stepper{min-width:3rem;font-size:1.1rem}.bpm-controls input,.field-block input,.field-block select{width:100%;min-height:48px;border-radius:1rem;border:1px solid var(--line);background:#ffffff0a;color:var(--text);padding:.75rem .9rem}.field-block select,.field-block select option{background-color:#171e2a;color:var(--text)}.field-block select option:checked,.field-block select option:hover{background-color:#27384f;color:#f7fbff}.tap-button{grid-column:1 / -1;width:100%}.beat-state{padding:.7rem .95rem;border-radius:999px;background:#ffffff0d;border:1px solid rgba(255,255,255,.08)}.status-pulse{width:.7rem;height:.7rem;border-radius:999px;background:#ffffff38}.status-pulse.live{background:#39e29f;box-shadow:0 0 .9rem #39e29f80}.beat-current{flex-wrap:wrap;align-items:flex-start}.beat-current strong{display:block;font-family:Space Grotesk,sans-serif;font-size:1.2rem}.beat-current p{margin:.3rem 0 0}.beat-actions{flex-wrap:wrap}.settings-button{background:linear-gradient(135deg,#ffc45738,#ff8f4c24);border-color:#ffba4347;color:#ffe3a6;box-shadow:0 0 0 1px #ffba4314 inset}.topbar-settings{justify-self:start;padding-inline:1.15rem}.beat-primary-button{background:linear-gradient(135deg,#3ce1ff2e,#38e6a729);border-color:#3ce1ff4d;color:#dffcff;box-shadow:0 0 0 1px #3ce1ff14 inset}.beat-upload-button{background:linear-gradient(135deg,#7b61ff2e,#55a7ff1f);border:1px solid rgba(123,97,255,.24);color:#ddd8ff;box-shadow:0 0 0 1px #7b61ff14 inset}.beat-progress{position:relative;height:.38rem;border-radius:999px;background:#ffffff14;overflow:hidden}.beat-progress span{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:left center;background:linear-gradient(90deg,#3ce1ff,#39e29f,#ffc857);border-radius:inherit}.beat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.beat-chip{min-height:72px;border-radius:1.05rem;border:1px solid var(--line);background:#ffffff0a;color:var(--text);padding:.85rem;text-align:left;display:grid;gap:.24rem}.beat-chip strong{font-family:Space Grotesk,sans-serif}.beat-chip span{color:var(--muted);font-size:.83rem}.beat-chip.active{border-color:#3ce1ff52;background:linear-gradient(180deg,#3ce1ff24,#ffffff0d);box-shadow:0 0 0 1px #3ce1ff1f inset}.loop-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.pad-card{display:grid;gap:.7rem;padding:.75rem;border-radius:calc(var(--radius) + .1rem);border:1px solid var(--line);background:linear-gradient(180deg,#101824e0,#0a0e16db);min-height:0;--pad-accent: #3ce1ff;--pad-accent-soft: rgba(60, 225, 255, .16)}.pad-card.has-recording{border-color:color-mix(in srgb,var(--pad-accent) 42%,rgba(255,255,255,.08));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--pad-accent) 18%,transparent),0 0 2rem color-mix(in srgb,var(--pad-accent) 14%,transparent)}.state-empty{box-shadow:inset 0 0 0 1px #ffffff08}.state-recording{box-shadow:inset 0 0 0 1px #ff5a6f29,0 0 2.2rem #ff5a6f26}.state-ready{box-shadow:inset 0 0 0 1px #ffba432e,0 0 2rem #ffba4314}.state-playing{box-shadow:inset 0 0 0 1px #38e6a738,0 0 2.4rem #38e6a71a}.state-stopped{box-shadow:inset 0 0 0 1px #53b7ff2e,0 0 2rem #53b7ff14}.pad-name{width:100%;border:none;background:transparent;color:var(--text);font-family:Space Grotesk,sans-serif;font-weight:600;padding:0;font-size:.95rem;min-width:0}.status-tag{display:inline-flex;align-items:center;gap:.35rem;color:var(--muted);font-size:.74rem;white-space:nowrap;flex-shrink:0}.pad-hit{width:100%;aspect-ratio:1 / .5;min-height:5.15rem;border:none;border-radius:1.15rem;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.12),transparent 22%),linear-gradient(160deg,#ffffff14,#ffffff05);color:var(--text);box-shadow:inset 0 1px #ffffff14,inset 0 -20px 42px #0000002e,0 16px 30px #00000038;display:grid;place-items:center;gap:.22rem;padding:.55rem .45rem}.pad-hit.has-recording{background:radial-gradient(circle at 30% 25%,color-mix(in srgb,var(--pad-accent) 24%,white 8%),transparent 24%),linear-gradient(160deg,color-mix(in srgb,var(--pad-accent-soft) 75%,rgba(255,255,255,.08)),#ffffff05);box-shadow:inset 0 1px #ffffff1a,inset 0 -14px 28px color-mix(in srgb,var(--pad-accent) 10%,rgba(0,0,0,.18)),0 14px 28px #00000038}.pad-icon{font-size:clamp(1.15rem,4vw,1.7rem);line-height:1}.pad-label{font-family:Space Grotesk,sans-serif;font-weight:700;font-size:.82rem}.pad-timer{color:#f2f6fac7;font-size:.72rem}.pad-body{display:grid;gap:.65rem}.waveform-card{position:relative;height:3.35rem;border-radius:1rem;border:1px solid rgba(255,255,255,.06);background:#ffffff08;overflow:hidden}.waveform-empty{display:grid;place-items:center;height:100%;font-size:.82rem}.waveform-svg{width:100%;height:100%}.waveform-svg polygon{fill:#3ce1ff5c}.pad-card.has-recording .waveform-svg polygon{fill:color-mix(in srgb,var(--pad-accent) 52%,rgba(255,255,255,.08))}.progress-track{position:absolute;left:.5rem;right:.5rem;bottom:.45rem;height:.24rem;border-radius:999px;background:#ffffff1a}.progress-track span{background:linear-gradient(90deg,#3ce1ff,#34e39f)}.pad-card.has-recording .progress-track span{background:linear-gradient(90deg,color-mix(in srgb,var(--pad-accent) 82%,white 10%),color-mix(in srgb,var(--pad-accent) 58%,#ffffff 6%))}.meter-row{gap:.65rem;font-size:.76rem;color:var(--muted)}.level-meter{flex:1;height:.5rem;border-radius:999px;background:#ffffff14}.level-meter span{background:linear-gradient(90deg,#55a7ff,#34e39f)}.pad-card.has-recording .level-meter span{background:linear-gradient(90deg,color-mix(in srgb,var(--pad-accent) 78%,white 12%),color-mix(in srgb,var(--pad-accent) 48%,#34e39f 22%))}.slider-block,.field-block{display:grid;gap:.55rem}.slider-block span{font-size:.78rem}input[type=range]{width:100%;accent-color:#3ce1ff}.pad-actions{flex-wrap:wrap}.tiny-action{flex:1 1 4.2rem;min-height:44px;padding:.65rem .8rem}.tiny-action.danger{border-color:#ff5a6f33;color:#ffc2ca}.bottom-bar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;padding:2.25rem 1rem calc(.95rem + var(--safe-bottom));margin:0 auto;background:linear-gradient(180deg,#090d14a3,#090d14f0);border-top:1px solid rgba(255,255,255,.06);-webkit-backdrop-filter:blur(26px);backdrop-filter:blur(26px)}.bottom-bar-dock{position:fixed;left:0;right:0;bottom:calc(.75rem + var(--safe-bottom));z-index:21;display:flex;justify-content:center;pointer-events:none}.bottom-bar-toggle{position:absolute;top:.55rem;left:50%;transform:translate(-50%);width:2.35rem;height:2.35rem;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#141c28f5,#0a0f18f0);color:#dff7ff;box-shadow:0 10px 24px #00000047;display:inline-flex;align-items:center;justify-content:center;z-index:2}.bottom-bar-toggle.collapsed{position:static;transform:none;pointer-events:auto}.control-button.subtle{background:#ffffff08}.bottom-action-play,.bottom-action-stop,.bottom-action-export{position:relative;overflow:hidden;font-weight:600;box-shadow:inset 0 1px #ffffff0a}.bottom-action-play{border-color:#38e6a742;background:linear-gradient(135deg,#38e6a738,#54cbff1f),#ffffff0a;color:#dcfff2}.bottom-action-stop{border-color:#ff5a6f3d;background:linear-gradient(135deg,#ff5a6f33,#ff9a601a),#ffffff0a;color:#ffd7dd}.bottom-action-export{border-color:#3ce1ff47;background:linear-gradient(135deg,#3ce1ff3d,#48e3aa29),#ffffff0a;color:#e3fcff}.master-slider{grid-column:1 / -1;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.8rem;padding:.78rem .9rem;border-radius:1.1rem;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#ffffff0d,#ffffff08),radial-gradient(circle at left,rgba(60,225,255,.12),transparent 45%);box-shadow:inset 0 1px #ffffff0a}.master-slider-label{color:#dcecf8;font-size:.8rem;font-weight:600;letter-spacing:.01em;white-space:nowrap}.master-slider .master-slider-value{min-width:3rem;text-align:right;color:#9feeff;font-size:.78rem;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}.master-slider input{min-width:0}.overlay-shell,.sheet-shell{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;pointer-events:none}.overlay-shell{display:grid;place-items:center;padding:1rem;background:#02050abd;pointer-events:auto}.welcome-card{width:min(34rem,100%);display:grid;gap:1rem;padding:1.4rem;border-radius:2rem;background:linear-gradient(180deg,#0d121df5,#090e16eb);border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow)}.welcome-badge{display:inline-flex;width:fit-content;padding:.5rem .75rem;border-radius:999px;background:#3ce1ff1f;color:#b8f1ff;font-size:.84rem}.welcome-card h1{font-size:clamp(2rem,7vw,3.2rem);line-height:.95}.welcome-copy{margin:0;font-size:1rem;line-height:1.7}.welcome-steps{display:grid;gap:.75rem}.welcome-steps div{display:grid;grid-template-columns:2.4rem 1fr;gap:.75rem;align-items:center;padding:.85rem 1rem;border-radius:1rem;background:#ffffff0a;border:1px solid rgba(255,255,255,.06)}.welcome-steps strong{display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:999px;font-family:Space Grotesk,sans-serif;background:#3ce1ff1f}.hero-button,.ghost-button{border-radius:1.1rem;border:none;padding:.95rem 1.2rem}.hero-button{background:linear-gradient(135deg,#46ddff,#39e29f);color:#041018;font-weight:700;box-shadow:0 18px 36px #3ad7da33}.hero-button.compact,.ghost-button.full{width:100%}.ghost-button{background:#ffffff0d;color:var(--text);border:1px solid var(--line)}.notice-card{padding:.9rem 1rem;border-radius:1rem;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;line-height:1.6}.notice-card.warning{border-color:#ffba433d;color:#ffe4ab}.notice-card.danger{border-color:#ff5a6f3d;color:#ffd1d7}.sheet-shell.open{pointer-events:auto}.sheet-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#04070c99;opacity:0;transition:opacity .18s ease}.sheet-panel{position:absolute;left:0;right:0;bottom:0;display:grid;align-content:start;gap:.95rem;max-height:min(84vh,50rem);overflow:auto;padding:.9rem 1rem calc(1.4rem + var(--safe-bottom));border-radius:1.8rem 1.8rem 0 0;background:linear-gradient(180deg,#0e141ff7,#090d14f5);border-top:1px solid rgba(255,255,255,.08);transform:translateY(100%);transition:transform .22s ease}.sheet-shell.open .sheet-panel{transform:translateY(0)}.sheet-shell.open .sheet-backdrop{opacity:1}.sheet-handle{width:4rem;height:.3rem;border-radius:999px;background:#ffffff2e;margin:0 auto}.sheet-panel h3{font-size:1.45rem}.sheet-head{align-items:flex-start;flex-wrap:wrap}.sheet-head>div:first-child{min-width:0}.sheet-head .icon-button{flex-shrink:0}.sheet-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:.75rem;align-items:stretch}.sheet-actions>*,.project-actions>*{min-width:0}.sheet-actions .hero-button,.sheet-actions .ghost-button,.project-actions .tiny-action,.binding-controls .tiny-action{width:100%;white-space:nowrap}.field-block small{color:var(--muted)}.field-block{min-width:0}.field-block span{font-size:.92rem;font-weight:600}.export-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:.8rem}.export-card{min-height:82px;border-radius:1.1rem;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;color:var(--text);padding:1rem;display:grid;gap:.3rem;text-align:left}.export-card strong{font-family:Space Grotesk,sans-serif;font-size:1.05rem}.export-card span{color:var(--muted);font-size:.85rem}.export-card.active{border-color:#3ce1ff52;background:linear-gradient(180deg,#3ce1ff24,#ffffff0d);box-shadow:0 0 0 1px #3ce1ff1f inset}.toggle-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:.8rem;padding:.95rem 1rem;border-radius:1.1rem;border:1px solid rgba(255,255,255,.06);background:#ffffff0a}.toggle-row p{margin:.32rem 0 0;color:var(--muted);font-size:.88rem;line-height:1.5}.toggle-row input[type=checkbox]{width:1.2rem;height:1.2rem;accent-color:#3ce1ff;margin-top:.2rem}.binding-section{display:grid;gap:.9rem;margin-top:.15rem}.binding-head{justify-content:flex-start}.binding-groups{display:grid;gap:1rem}.binding-group{display:grid;gap:.7rem}.binding-group h4{margin:0;font-family:Space Grotesk,sans-serif;font-size:1rem}.binding-list{display:grid;gap:.75rem}.binding-row{display:grid;gap:.75rem;padding:.95rem 1rem;border-radius:1.1rem;border:1px solid rgba(255,255,255,.06);background:#ffffff0a}.binding-row p{margin:.35rem 0 0;color:var(--muted);font-size:.88rem;line-height:1.5}.binding-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;width:100%}.binding-key{grid-column:1 / -1;min-width:6rem;min-height:48px;display:inline-flex;align-items:center;justify-content:center;padding:.75rem .95rem;border-radius:1rem;border:1px dashed rgba(60,225,255,.26);background:#3ce1ff14;color:#bff6ff}.project-list{display:grid;gap:.8rem;margin-top:.15rem}.project-card{display:grid;gap:.75rem;padding:1rem;border-radius:1.2rem;border:1px solid rgba(255,255,255,.06);background:#ffffff0a}.project-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.toast{position:fixed;left:50%;bottom:calc(7.1rem + var(--safe-bottom));transform:translate(-50%);z-index:40;width:min(calc(100% - 2rem),28rem);padding:.95rem 1rem;border-radius:1rem;border:1px solid rgba(60,225,255,.18);background:#0a121deb;box-shadow:0 20px 36px #00000047;text-align:center}@media (min-width: 480px){.topbar-stat-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar-side{grid-template-columns:auto minmax(0,1fr);align-items:start}.topbar-settings{justify-self:end;align-self:start}.beat-grid,.loop-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.pad-hit{aspect-ratio:1 / .54;min-height:5.55rem}}@media (min-width: 900px){.app-shell{padding-bottom:9.2rem}.app-container{padding:calc(1.2rem + var(--safe-top)) 1.25rem 1.5rem}.topbar-main{grid-template-columns:minmax(0,1.45fr) minmax(20rem,24rem);align-items:stretch;gap:1.4rem}.topbar-copy{align-content:space-between;min-height:100%}.topbar-side{grid-template-columns:minmax(0,1fr);justify-items:stretch;align-content:space-between}.topbar-settings{justify-self:end}.loop-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.pad-hit{aspect-ratio:1 / .58;min-height:6.1rem}.sheet-panel{padding-inline:1.25rem}.sheet-actions{grid-template-columns:minmax(0,1fr) minmax(12rem,14rem)}.export-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.toggle-row{align-items:center}.binding-row{grid-template-columns:minmax(0,1fr) auto;align-items:center}.binding-controls{width:auto;grid-template-columns:auto minmax(7.25rem,8.5rem) minmax(7.25rem,8.5rem);align-items:center}.binding-key{grid-column:auto}.bottom-bar{max-width:78rem;left:50%;transform:translate(-50%);border-radius:1.4rem 1.4rem 0 0;grid-template-columns:repeat(5,minmax(0,1fr))}.master-slider{grid-column:1 / -1;padding-inline:1rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}