*,*:before,*:after{box-sizing:border-box;touch-action:manipulation}:root{--background-color: #1c1c1c;--main-font-color: #aeadad;--color-accent: rgb(60, 171, 255);--color-sine: rgb(60, 171, 255);--color-sawtooth: rgb(255, 94, 94);--color-triangle: rgb(0, 205, 0);--color-square: rgb(179, 88, 255);--color-sine-dim: rgb(40, 113, 167);--color-sawtooth-dim: rgb(167, 62, 62);--color-triangle-dim: rgb(0, 134, 0);--color-square-dim: rgb(117, 58, 167);--color-pulse: rgb(255, 175, 50);--color-pulse-dim: rgb(167, 115, 33);--color-triangle-muted: color-mix(in srgb, var(--color-triangle) 40%, var(--color-triangle-dim));--color-active: var(--color-accent);--color-active-bright: color-mix(in srgb, var(--color-active), white 18%);--color-spectrum: #b8b8b8;--chrome-1: #444;--chrome-2: #666;--chrome-3: #999;--chrome-4: #bbb;--chrome-5: #d1d1d1;--color-play: #6abf6a;--color-play-border: #4a9e5a;--color-play-hover: #88d488;--color-stop: #c45050;--color-stop-hover: #d46a6a;--color-discord: #5865f2;--color-danger: #f83e3e;--color-danger-active: #ff7979;--color-warning: #ff9a3d;--color-caution: #f8ff3be1;--color-solo: #c9a000;--color-mute: #c03030;--color-eq-hp: #ff5566;--color-eq-hp-tag: #ff8290;--color-eq-lp: #5599ff;--color-eq-lp-tag: #82b6ff;--meter-led-green: #26aa44;--meter-led-amber: #d4b41e;--meter-led-red: #cc2222;--meter-led-green-dim: #082811;--meter-led-amber-dim: #2a2405;--meter-led-red-dim: #2b0707;--meter-led-green-peak: #2dcb52;--meter-led-amber-peak: #ecd03a;--meter-led-red-peak: #e23434;--meter-bezel: #0a0a0a;--meter-bezel-inner: rgba(0, 0, 0, .85);--dash-lcd-face: #b2c098;--dash-lcd-face-low: #a1b088;--dash-lcd-ink: #1d2416;--dash-lcd-ghost: rgba(29, 36, 22, .1);--dash-lcd-bezel: #0d0d0d;--dash-vfd-face: color-mix(in srgb, var(--background-color) 40%, black);--dash-vfd-ink: var(--color-active);--dash-vfd-dim: color-mix(in srgb, var(--color-active) 55%, var(--dash-vfd-face));--dash-vfd-ghost: color-mix(in srgb, var(--color-active) 25%, var(--dash-vfd-face));--dash-vfd-off: color-mix(in srgb, var(--color-active) 20%, var(--dash-vfd-face));--dash-vfd-glow: color-mix(in srgb, var(--color-active) 55%, transparent);--dash-vfd-hot: var(--color-pulse);--dash-vfd-hot-glow: color-mix(in srgb, var(--color-pulse) 60%, transparent);--dash-matrix-face: color-mix(in srgb, var(--background-color) 40%, black);--dash-matrix-edge: color-mix(in srgb, var(--color-active) 18%, var(--dash-matrix-face));--dash-face-edge: #2a2b2d;--dash-hot: #ffb347;--dash-keys-edge: #2c2c30;--dash-keys-white: #e8e5de;--dash-keys-black: #1b1b1e;--dash-keys-ink: #f4f1ea;--dash-keys-dim: #7e8088;--dash-scope-bezel: #1f2220;--dash-scope-edge: #3c403d;--dash-scope-face: color-mix(in srgb, var(--color-triangle) 5%, color-mix(in srgb, var(--background-color) 25%, black));--dash-scope-grid: color-mix(in srgb, var(--color-triangle) 12%, transparent);--dash-scope-trace: color-mix(in srgb, var(--color-triangle), white 40%);--dash-scope-glow: var(--color-triangle);--dash-pixel-0: color-mix(in srgb, var(--color-triangle) 25%, black);--dash-pixel-1: color-mix(in srgb, var(--color-triangle) 45%, black);--dash-pixel-2: color-mix(in srgb, var(--color-triangle) 75%, var(--dash-pixel-tint));--dash-pixel-3: color-mix(in srgb, var(--color-triangle) 65%, var(--dash-pixel-tint));--dash-pixel-tint: #b8bca0;--dash-pixel-bezel: #4b4a5c;--dash-pixel-bezel-edge:#5d5c70;--dash-pixel-grid: color-mix(in srgb, var(--dash-pixel-0) 10%, transparent);--dash-pixel-led: #ff3838;--dash-pixel-led-off: #3a1414;--surface-tint-1: #ffffff08;--surface-tint-2: #ffffff0d;--surface-tint-3: #ffffff14;--surface-tint-4: #ffffff21;--surface-band: #ffffff2b;--surface-tint-5: #ffffff47;--surface-dark: color-mix(in srgb, var(--background-color), white 3%);--surface-darker: color-mix(in srgb, var(--background-color), black 29%);--window-alpha: 100%;--surface-panel: color-mix(in srgb, var(--background-color) var(--window-alpha), transparent);--surface-popover: color-mix(in srgb, var(--surface-dark) var(--window-alpha), transparent);--surface-modal: color-mix(in srgb, var(--surface-darker) var(--window-alpha), transparent);--grid-ring-soft: #ffffff66;--grid-ring: #ffffff80;--grid-ring-strong: #ffffffbf;--piano-sounding-natural: rgba(64, 64, 64, .3);--piano-sounding-accidental: rgba(220, 220, 220, .22);--chrome-border: #a6a6a6a3;--chrome-tab: #7f7f7f;--surface-border: #2a2a2a;--strip-border: #66666694;--slider-thumb: #c8c8c8;--slider-track: #9e9e9e60;--song-bar-divider: #ffffff3b;--border-control: 1px;--popup-border: color-mix(in srgb, var(--chrome-1), transparent 50%);--toggle-border: #ffffff96;--toggle-border-hover: #ffffff6f;--toggle-border-active: #e9e9e9;--toggle-track: #a1a1a114;--overlay-soft: rgba(0, 0, 0, .35);--overlay-mid: rgba(0, 0, 0, .45);--overlay: rgba(0, 0, 0, .7);--overlay-heavy: rgba(0, 0, 0, .85);--overlay-frosted: rgba(0, 0, 0, .55);--blur-scrim: 6px;--shadow-modal: 0 24px 48px -12px rgba(0, 0, 0, .5), 0 2px 8px rgba(0, 0, 0, .35);--shadow-popover: 0 8px 24px -6px rgba(0, 0, 0, .4), 0 1px 4px rgba(0, 0, 0, .3);--ink-dark: #000;--ink-light: #fff;--ink-light-dim: rgba(255, 255, 255, .6);--ink-light-faint: rgba(255, 255, 255, .4);--surface-toast: rgba(20, 20, 20, .95);--color-danger-deep: #b71c1c;--color-danger-text: var(--color-danger-active);--surface-terms: rgb(23 33 49);--tab-accent-1: #cc6677;--tab-accent-2: #cc9955;--tab-accent-3: #66aa77;--tab-accent-4: #6699bb;--tab-accent-5: #9977bb;--tab-accent-6: #bb7799;--chrome-selected: white;--color-modified: var(--color-caution);--text-3xs: 9px;--text-2xs: 10px;--text-xs: 11px;--text-sm: 13px;--text-md: 14px;--text-base: 15px;--text-lg: 20px;--text-title: 22px;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--tracking-tight: .3px;--tracking-body: .5px;--tracking-control: .8px;--tracking-label: 1.2px;--tracking-display: 3px;--opacity-disabled: .4;--icon-xs: 12px;--icon-sm: 14px;--icon-md: 16px;--icon-lg: 18px;--icon-xl: 22px;--control-height-sm: 26px;--control-height-md: 28px;--control-height-lg: 32px;--space-1: 2px;--space-2: 4px;--space-3: 6px;--space-4: 8px;--space-5: 12px;--space-6: 16px;--space-7: 20px;--space-8: 24px;--space-9: 32px;--radius-sm: 2px;--radius: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-pill: 999px;--radius-full: 50%;--panel-width-mobile: 320px;--scrollbar-width: 6px;--scrollbar-radius: 3px;--focus-halo: 0 0 0 3px color-mix(in srgb, var(--color-active) 25%, transparent);--focus-halo-strong: 0 0 0 4px color-mix(in srgb, var(--color-active) 35%, transparent);--duration-instant: 50ms;--duration-fast: .15s;--duration-reveal: .2s;--duration-slow: .3s;--duration-spin: .8s;--transition-instant: var(--duration-instant) ease-out;--transition-fast: var(--duration-fast) ease-out;--transition-slow: var(--duration-slow) ease-out;--transition-reveal: var(--duration-reveal) var(--ease-out-expo);--ease-out-quart: cubic-bezier(.25, 1, .5, 1);--ease-out-expo: cubic-bezier(.16, 1, .3, 1);--z-grid: 0;--z-playhead: 2;--z-rail: 10;--z-panel: 20;--z-dropdown: 100;--z-overlay: 1000;--z-fullscreen: 9999;--z-top: 99999;--bp-mobile: 768px;--bp-compact: 430px;--bp-tiny: 380px}body{margin:0;display:flex;flex-direction:column;min-height:100dvh;background-color:var(--background-color);color:var(--chrome-5);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;letter-spacing:var(--tracking-body)}@media(min-width:769px){body{margin:var(--space-5)}}button,select,input,textarea{font-family:inherit}@media(hover:none){button{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}}#pageContainer{flex:1;display:flex;position:relative;width:100%;max-width:100vw;margin:0;gap:var(--space-3);visibility:hidden}[data-tooltip]{position:relative}.tooltip{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);padding:var(--space-2) var(--space-4);background:color-mix(in srgb,var(--surface-dark) 55%,transparent);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);color:var(--chrome-5);border:1px solid var(--chrome-border);font-family:inherit;font-size:var(--text-xs);font-weight:400;line-height:1.55;letter-spacing:normal;text-transform:none;border-radius:var(--radius);white-space:nowrap;pointer-events:none;z-index:var(--z-dropdown);opacity:0;animation:tooltipFadeIn var(--duration-fast) var(--ease-out-quart) forwards}.tooltip kbd{font-family:var(--font-mono);font-size:var(--text-2xs);padding:0 var(--space-2);border:1px solid var(--chrome-border);border-radius:var(--radius)}.tooltip-below{bottom:auto;top:calc(100% + 6px)}.tooltip-align-left{left:0;transform:none}.tooltip-align-right{left:auto;right:0;transform:none}.tooltip-right{bottom:auto;top:50%;left:calc(100% + 6px);transform:translateY(-50%)}.tooltip-options{z-index:calc(var(--z-overlay) + 1);white-space:normal;max-width:220px;text-align:center}.tooltip-panel{width:max-content;max-width:min(280px,calc(100vw - 16px));white-space:normal}.tooltip-titled{display:flex;flex-direction:column;gap:var(--space-1);white-space:normal;width:max-content;max-width:240px;text-align:center}.tooltip-title{font-weight:600;color:var(--chrome-5);text-align:left}.tooltip-desc{font-size:var(--text-2xs);color:var(--chrome-3)}@keyframes tooltipFadeIn{to{opacity:1}}@media only screen and (max-width:768px){.tooltip{display:none!important}html{overflow-x:hidden}body{min-height:100svh;overflow-x:hidden;padding-bottom:calc(44px + env(safe-area-inset-bottom))}#pageContainer{flex-direction:column;width:100%;min-height:0;gap:0;touch-action:pan-y}#sidebarArea{order:0}}:focus-visible{outline:2px solid var(--color-active);outline-offset:var(--space-1)}[data-focus-trap]:focus{outline:none}#audioWarning{color:var(--chrome-selected);background-color:var(--color-danger);padding:var(--space-5);text-align:center;font-size:var(--text-lg);position:fixed;width:100%;top:0;z-index:calc(var(--z-overlay) + 1);display:none}.audio-warning-action{margin-left:var(--space-3);padding:var(--space-1) var(--space-4);border:1px solid currentColor;border-radius:var(--radius-md);background:transparent;color:inherit;font:inherit;font-weight:600;cursor:pointer}.skip-link{position:absolute;left:50%;top:-100px;transform:translate(-50%);z-index:var(--z-top);padding:var(--space-4) var(--space-6);background:var(--surface-border);color:var(--chrome-5);border:1px solid var(--chrome-3);border-radius:var(--radius);font-size:var(--text-md);text-decoration:none}.skip-link:focus-visible{top:var(--space-4)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.thin-scrollbar{scrollbar-width:thin;scrollbar-color:var(--chrome-1) transparent}.thin-scrollbar::-webkit-scrollbar,.popover::-webkit-scrollbar,.popover ::-webkit-scrollbar,.options-popup-content::-webkit-scrollbar,.options-popup-content .panel-body::-webkit-scrollbar,.modal-shell-body::-webkit-scrollbar,.modal-shell-surface::-webkit-scrollbar,.keyboard-help-modal::-webkit-scrollbar,.slide-panel::-webkit-scrollbar{width:var(--scrollbar-width)}.thin-scrollbar::-webkit-scrollbar-track,.popover::-webkit-scrollbar-track,.popover ::-webkit-scrollbar-track,.options-popup-content::-webkit-scrollbar-track,.options-popup-content .panel-body::-webkit-scrollbar-track,.modal-shell-body::-webkit-scrollbar-track,.modal-shell-surface::-webkit-scrollbar-track,.keyboard-help-modal::-webkit-scrollbar-track,.slide-panel::-webkit-scrollbar-track{background:transparent}.thin-scrollbar::-webkit-scrollbar-thumb,.popover::-webkit-scrollbar-thumb,.popover ::-webkit-scrollbar-thumb,.options-popup-content::-webkit-scrollbar-thumb,.options-popup-content .panel-body::-webkit-scrollbar-thumb,.modal-shell-body::-webkit-scrollbar-thumb,.modal-shell-surface::-webkit-scrollbar-thumb,.keyboard-help-modal::-webkit-scrollbar-thumb,.slide-panel::-webkit-scrollbar-thumb{background:var(--chrome-1);border-radius:var(--scrollbar-radius)}#matrix{display:grid;grid-template-columns:repeat(auto-fit,minmax(2px,1fr));gap:.5px;width:100%;touch-action:none;position:relative;z-index:1;contain:content;will-change:transform;flex:1;min-width:0;min-height:0;--grid-cell-lift: 3.1%;--grid-root-lift: 5.1%;--grid-fill: color-mix(in srgb, var(--grid-fill-color) var(--grid-fill-opacity), transparent);--grid-cell-bg: color-mix(in srgb, white var(--grid-cell-lift), var(--grid-fill));--grid-root-bg: color-mix(in srgb, white var(--grid-root-lift), var(--grid-fill));--grid-disabled-opacity: .15}:root{--grid-fill-color: transparent;--grid-fill-opacity: 0%;--grid-note-fill-opacity: 0%}:root:not([data-simple-mode=on]) body:not(.automation-mode-active):not(.eq-mode-active) #matrix{--grid-cell-lift: 1.57%;--grid-root-lift: 2.55%}#otherTrackDots{position:absolute;top:0;right:0;z-index:var(--z-grid);pointer-events:none;will-change:transform}#otherTrackDots[hidden]{display:none}.gridButton{padding:0;margin:0;background-color:var(--grid-cell-bg);border:1px solid transparent;outline:none;position:relative}#matrix .gridButton:focus-visible{outline:2px solid var(--color-active);outline-offset:-2px;z-index:calc(var(--z-playhead) + 1);opacity:1!important}.gridButton.active.note-chance:not(.playing){--chance-c: var(--note-color, var(--chrome-4));--chance-period: calc(var(--chance-dash, 2px) + var(--chance-gap, 2px));--chance-top: repeating-linear-gradient(90deg, var(--chance-c) 0 var(--chance-dash, 2px), transparent 0 var(--chance-period));--chance-l: repeating-linear-gradient(180deg, var(--chance-left, var(--chance-c)) 0 var(--chance-dash, 2px), transparent 0 var(--chance-period));--chance-r: repeating-linear-gradient(180deg, var(--chance-right, var(--chance-c)) 0 var(--chance-dash, 2px), transparent 0 var(--chance-period));border-color:transparent!important;background-image:var(--chance-top),var(--chance-top),var(--chance-l),var(--chance-r);background-size:100% 1px,100% 1px,1px 100%,1px 100%;background-position:top,bottom,left,right;background-repeat:no-repeat;background-origin:border-box}.gridButton.note-chance-1{--chance-dash: 1px;--chance-gap: 2px}.gridButton.note-chance-2{--chance-dash: 2px;--chance-gap: 2px}.gridButton.note-chance-3{--chance-dash: 4px;--chance-gap: 2px}.gridButton.note-chance-4{--chance-dash: 7px;--chance-gap: 2px}.gridButton.note-chance.note-head{--chance-right: transparent}.gridButton.note-chance.note-body{--chance-left: transparent;--chance-right: transparent}.gridButton.note-chance.note-tail{--chance-left: transparent}.gridButton.active[data-play-every]:after{content:attr(data-play-every);position:absolute;inset:auto;top:1px;right:2px;font-size:var(--text-3xs);line-height:1;color:var(--grid-ring-strong);background:none;pointer-events:none;z-index:1}#matrix[data-cols="8"] .gridButton.active[data-play-every]:after{font-size:var(--text-md);top:2px;right:4px}#matrix[data-cols="16"] .gridButton.active[data-play-every]:after{font-size:var(--text-2xs);top:2px;right:3px}#matrix[data-cols="8"] .gridButton.active[data-play-countdown]:after{font-size:var(--text-md);top:2px;right:4px}#matrix[data-cols="16"] .gridButton.active[data-play-countdown]:after{font-size:var(--text-2xs);top:2px;right:3px}.gridButton.active[data-play-countdown]:after{content:attr(data-play-countdown)}.gridButton.active[data-play-countdown="0"]:after{content:none}.gridButton.active.play-every-skipped{opacity:.35!important}.gridButton.root-note{background-color:var(--grid-root-bg)}:where(:root[data-hide-root-rows]) .gridButton.root-note{background-color:var(--grid-cell-bg)}.gridButton.outside-audio,.gridButton.root-note.outside-audio{background-color:var(--grid-cell-bg)}.gridButton.drum-disabled{opacity:var(--grid-disabled-opacity);pointer-events:none}.gridButton.loop-dimmed{opacity:var(--grid-disabled-opacity)}.gridButton.hover{border-color:color-mix(in srgb,var(--chrome-3) 45%,transparent)}#playhead{position:absolute;top:0;left:0;height:100%;background-color:var(--surface-tint-2);pointer-events:none;z-index:var(--z-playhead);display:none;will-change:transform}.gridButton.active[data-waveform=sine]{--note-color: var(--color-sine);border-color:var(--note-color)}.gridButton.active[data-waveform=sawtooth]{--note-color: var(--color-sawtooth);border-color:var(--note-color)}.gridButton.active[data-waveform=triangle]{--note-color: var(--color-triangle);border-color:var(--note-color)}.gridButton.active[data-waveform=square]{--note-color: var(--color-square);border-color:var(--note-color)}.gridButton.active[data-waveform=pulse]{--note-color: var(--color-pulse);border-color:var(--note-color)}.gridButton.playing,.gridButton.active.playing,.gridButton.root-note.playing{border-color:var(--glow-color, yellow);border-width:1.15px;border-style:solid}.gridButton.arp-ghost.playing{border-color:color-mix(in srgb,var(--glow-color) 50%,transparent)}.playheadRandom,.gridButton.root-note.playheadRandom{background-image:linear-gradient(var(--surface-tint-2),var(--surface-tint-2))}.gridButton.active.note-chance.playheadRandom:not(.playing){background-image:var(--chance-top),var(--chance-top),var(--chance-l),var(--chance-r),linear-gradient(var(--surface-tint-2),var(--surface-tint-2));background-size:100% 1px,100% 1px,1px 100%,1px 100%,auto;background-position:top,bottom,left,right,0 0}.gridButton.active.note-head,.gridButton.active.note-head.hover,.gridButton.active.note-head.playing,.gridButton.arp-ghost-head.playing,.gridButton.hover-head:not(.active){border-right-color:transparent!important}.gridButton.active.note-body,.gridButton.active.note-body.hover,.gridButton.active.note-body.playing,.gridButton.arp-ghost-body.playing,.gridButton.hover-body:not(.active){border-left-color:transparent!important;border-right-color:transparent!important}.gridButton.active.note-tail,.gridButton.active.note-tail.hover,.gridButton.active.note-tail.playing,.gridButton.arp-ghost-tail.playing,.gridButton.hover-tail:not(.active){border-left-color:transparent!important}:root[data-note-fill] .gridButton.active:not(.selection-preview){background-color:color-mix(in srgb,var(--note-color, transparent) var(--grid-note-fill-opacity),var(--grid-cell-bg))}.gridButton.selection-preview{background-color:var(--surface-tint-3)}.gridButton.selected{box-shadow:inset 0 0 0 1.5px var(--grid-ring)}.gridButton.active.selected{box-shadow:inset 0 0 0 1.5px var(--grid-ring-strong)}.gridButton.active.note-head.selected{box-shadow:inset 0 1.5px 0 0 var(--grid-ring-strong),inset 0 -1.5px 0 0 var(--grid-ring-strong),inset 1.5px 0 0 0 var(--grid-ring-strong)}.gridButton.active.note-body.selected{box-shadow:inset 0 1.5px 0 0 var(--grid-ring-strong),inset 0 -1.5px 0 0 var(--grid-ring-strong)}.gridButton.active.note-tail.selected{box-shadow:inset 0 1.5px 0 0 var(--grid-ring-strong),inset 0 -1.5px 0 0 var(--grid-ring-strong),inset -1.5px 0 0 0 var(--grid-ring-strong)}.gridButton.move-ghost{opacity:.3!important}.gridButton.move-preview{box-shadow:inset 0 0 0 1px var(--grid-ring-soft);background-color:var(--surface-tint-2)}.gridButton.active[data-arp-mark]:before{position:absolute;top:0;left:2px;font-size:var(--text-2xs);line-height:1;color:var(--grid-ring-strong);pointer-events:none}.gridButton.active[data-arp-mark=up]:before{content:"↑"}.gridButton.active[data-arp-mark=down]:before{content:"↓"}.gridButton.active[data-arp-mark=updown]:before{content:"↕"}.gridButton.active[data-arp-mark=random]:before{content:"?"}.gridButton.active[data-arp-mark=pedal]:before{content:"↥"}.gridButton.active[data-arp-mark=converge]:before{content:"⇅"}.gridButton.active[data-arp-mark=diverge]:before{content:"⇕"}#matrix[data-cols="8"]:not(.show-notes) .gridButton.active[data-arp-mark]:before,#matrix[data-cols="8"].show-notes .gridButton.active[data-arp-mark]:not([data-step],[data-note]):before{font-size:var(--text-md);top:2px;left:4px}.gridButton.chord-root-ghost{background-image:radial-gradient(circle,var(--grid-ring-strong) 0 2px,transparent 2.5px)}.chord-hover-label{position:absolute;transform:translateY(-100%);margin-top:calc(-1 * var(--space-1));padding:var(--space-1) var(--space-2);font-size:var(--text-2xs);line-height:1;white-space:nowrap;color:var(--chrome-5);background-color:var(--surface-dark);border:1px solid var(--chrome-border);border-radius:var(--radius-sm);pointer-events:none;z-index:calc(var(--z-playhead) + 1)}.chord-hover-label--below{transform:none;margin-top:var(--space-1)}.show-notes .gridButton[data-step]:before{content:attr(data-step);position:absolute;top:1px;left:50%;transform:translate(-50%);font-size:clamp(6px,1vw,var(--text-sm));line-height:1;color:var(--chrome-3);opacity:.7;pointer-events:none;z-index:1;white-space:nowrap;font-family:var(--font-mono)}.show-notes .gridButton[data-note]:before{content:attr(data-note);position:absolute;right:1px;top:50%;transform:translateY(-50%);font-size:clamp(6px,1vw,var(--text-sm));line-height:1;color:var(--chrome-3);opacity:.7;pointer-events:none;z-index:1;white-space:nowrap;font-family:var(--font-mono)}.show-notes .gridButton[data-step][data-note]:before{content:attr(data-note);left:auto;top:50%;right:1px;transform:translateY(-50%)}.show-notes .gridButton[data-step-bottom]:before{content:attr(data-step-bottom);position:absolute;bottom:1px;left:50%;transform:translate(-50%);font-size:clamp(6px,1vw,var(--text-sm));line-height:1;color:var(--chrome-3);opacity:.7;pointer-events:none;z-index:1;white-space:nowrap;font-family:var(--font-mono)}.show-notes .gridButton[data-step-bottom][data-note]:before{content:attr(data-note);left:auto;bottom:auto;top:50%;right:1px;transform:translateY(-50%)}#matrix[data-cols="64"].show-notes .gridButton[data-step]:before,#matrix[data-cols="64"].show-notes .gridButton[data-note]:before,#matrix[data-cols="64"].show-notes .gridButton[data-step-bottom]:before{font-size:clamp(5px,.55vw,8px)}.gridButton.hidden-note-above{box-shadow:inset 0 2px 0 0 var(--indicator-color)}.gridButton.hidden-note-below{box-shadow:inset 0 -2px 0 0 var(--indicator-color)}@media only screen and (max-width:768px){#gridArea{order:1;width:100%;padding:0 var(--space-1);overflow:visible;touch-action:pan-y;position:relative}#matrix{width:100%;height:auto;max-width:100%;flex:1;min-height:0}}@media(hover:none)and (min-width:769px){#gridArea{touch-action:pan-y}}#gridMatrixRow{display:flex;flex-direction:row;align-items:stretch;width:100%}#matrixStack{flex:1;min-width:0;display:flex;flex-direction:column}.matrix-row{flex:1;display:flex;flex-direction:row;min-width:0;min-height:0;align-items:stretch;position:relative}.grid-song-title{display:none;--grid-song-title-x: 0px;--grid-song-title-y: 0px}@media only screen and (max-width:768px){.grid-song-title:not([hidden]){display:block;position:absolute;top:calc(var(--grid-song-title-y) + var(--space-2));left:calc(var(--grid-song-title-x) + var(--space-3));z-index:calc(var(--z-playhead) + 1);max-width:60%;overflow:hidden;color:var(--color-active);opacity:.6;font-size:var(--text-xs);font-weight:500;letter-spacing:var(--tracking-body);white-space:nowrap;text-overflow:ellipsis;pointer-events:none}}.grid-empty-hint{position:absolute;top:0;right:0;bottom:0;left:0;z-index:var(--z-dropdown);display:flex;align-items:center;justify-content:center;padding:var(--space-5);pointer-events:none}.grid-empty-hint-text{margin:0;max-width:28em;padding:var(--space-4) var(--space-5);border-radius:var(--radius-md);background:var(--surface-toast);color:var(--ink-light);font-size:var(--text-sm);text-align:center}.grid-loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:var(--z-dropdown);display:flex;align-items:center;justify-content:center;background:var(--overlay-soft);pointer-events:none;opacity:0;animation:grid-loading-reveal var(--duration-slow) ease forwards}@keyframes grid-loading-reveal{0%,40%{opacity:0}to{opacity:1}}.grid-loading-spinner{width:44px;height:44px;border:3px solid var(--chrome-border);border-top-color:var(--chrome-5);border-radius:var(--radius-full);animation:spin var(--duration-spin) linear infinite}@media(prefers-reduced-motion:reduce){.grid-loading-spinner{animation:none!important}}.grid-scrollbar{position:relative;width:0;overflow:hidden;background:var(--surface-tint-1);touch-action:none;flex-shrink:0}#gridArea.gridbars-on .grid-scrollbar{width:10px;margin-left:var(--space-1)}.grid-scrollbar-thumb{position:absolute;left:0;right:0;top:0;height:24px;background:var(--surface-tint-2);border-radius:var(--scrollbar-radius);cursor:grab;transition:background var(--transition-fast)}.grid-scrollbar-thumb:hover{background:var(--surface-band)}.grid-scrollbar-thumb.dragging{background:var(--surface-tint-5);cursor:grabbing}#gridArea.gridbars-on .grid-scrollbar.inert{width:0;margin-left:0}.grid-scrollbar.inert .grid-scrollbar-thumb{cursor:default}.grid-loop-bar{--loop-start-pct: 0%;--loop-end-pct: 100%;position:relative;height:0;overflow:hidden;background:var(--surface-tint-1);touch-action:none;flex-shrink:0;cursor:ew-resize;contain:paint;will-change:transform}#gridArea.gridbars-on .grid-loop-bar{height:10px;margin-top:var(--space-1)}.grid-loop-fill{position:absolute;top:0;bottom:0;left:var(--loop-start-pct);right:calc(100% - var(--loop-end-pct));background:var(--surface-tint-2);border-radius:var(--scrollbar-radius);transition:background var(--transition-fast)}.grid-loop-bar:hover .grid-loop-fill{background:var(--surface-band)}.grid-loop-bar.dragging .grid-loop-fill{background:var(--surface-tint-5)}.grid-loop-thumb{position:absolute;top:1px;bottom:1px;width:5px;box-sizing:border-box;background:var(--surface-tint-5);border:1px solid var(--chrome-2);border-radius:var(--radius-sm);pointer-events:none}.grid-loop-thumb-start{left:var(--loop-start-pct)}.grid-loop-thumb-end{left:var(--loop-end-pct);transform:translate(-100%)}.grid-loop-bar:hover .grid-loop-thumb,.grid-loop-bar.dragging .grid-loop-thumb{border-color:var(--chrome-4)}.grid-loop-bar.dragging{cursor:grabbing}.grid-loop-bar.has-window .grid-loop-fill{cursor:grab}.grid-loop-bar.moving,.grid-loop-bar.moving .grid-loop-fill{cursor:grabbing}.beat-guides{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:calc(var(--z-playhead) - 1)}.beat-guide{position:absolute;top:0;bottom:0;width:1px;transform:translate(-50%);background:color-mix(in srgb,var(--chrome-2) 15%,transparent)}.beat-guide--bar{background:color-mix(in srgb,var(--chrome-2) 30%,transparent)}.beat-guide--edge{left:0;transform:none;background:transparent}.beat-guide{transition:background-color var(--transition-slow)}.beat-guide.is-pulse{background:color-mix(in srgb,var(--chrome-4) 22%,transparent);transition:none}.beat-guide.is-pulse[data-pulse=bar]{background:color-mix(in srgb,var(--chrome-4) 45%,transparent)}:root[data-hide-beat-guides] .beat-guides{display:none}.tabContainer{width:100%}.tabs{display:flex;gap:0;margin-top:var(--space-2);margin-bottom:var(--space-2);white-space:nowrap;border-bottom:var(--border-control) solid var(--chrome-border)}.tabButton,.fm-section-tab,.songs-panel-tab{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-4) var(--space-3);background:transparent;color:var(--chrome-3);border:none;border-bottom:2px solid transparent;border-radius:0;margin-bottom:-.5px;cursor:pointer;font-size:var(--text-sm);font-weight:600;letter-spacing:var(--tracking-body);transition:color var(--transition-fast),border-color var(--transition-fast)}:lang(ja) :is(.tabButton,.fm-section-tab,.songs-panel-tab),:lang(ko) :is(.tabButton,.fm-section-tab,.songs-panel-tab),:lang(zh) :is(.tabButton,.fm-section-tab,.songs-panel-tab){letter-spacing:normal}.tabButton:hover,.fm-section-tab:not(.fm-section-tab--active):hover,.songs-panel-tab:not([aria-selected=true]):hover{background:transparent;color:var(--chrome-4)}.tabContent>div{display:none;grid-template-columns:repeat(2,1fr);gap:var(--space-4);min-width:0}.tabContent{min-width:0}.tabs,.tabContent{grid-column:1 / -1}.tabContainer:has(#fxTab1:checked) .tabContent #fxTab1Content,.tabContainer:has(#fxTab3:checked) .tabContent #fxTab3Content,.tabContainer:has(#fxTab2:checked) .tabContent #fxTab2Content,.tabContainer:has(#editTab1:checked) .tabContent #editTab1Content{display:grid}.tabContainer:has(#oscTab1:checked) .tabContent #oscTab1Content,.tabContainer:has(#oscTab3:checked) .tabContent #oscTab3Content{display:flex;flex-direction:column}.tabContainer:has(#oscTab4:checked) .tabContent #oscTab4Content,.tabContainer:has(#oscTab5:checked) .tabContent #oscTab5Content,.tabContainer:has(#editTab2:checked) .tabContent #editTab2Content,.tabContainer:has(#editTab3:checked) .tabContent #editTab3Content,.tabContainer:has(#modTab1:checked) .tabContent #modTab1Content,.tabContainer:has(#modTab2:checked) .tabContent #modTab2Content{display:block}.tabContainer:has(#optionsTab1:checked) .tabContent #optionsTab1Content,.tabContainer:has(#optionsTab2:checked) .tabContent #optionsTab2Content,.tabContainer:has(#songSettingsTabSong:checked) .tabContent #songSettingsTabSongContent,.tabContainer:has(#songSettingsTabTheme:checked) .tabContent #songSettingsTabThemeContent,.tabContainer:has(#songSettingsTabGrid:checked) .tabContent #songSettingsTabGridContent{display:flex;flex-direction:column;gap:var(--space-5)}#oscTab3Content,#oscTab4Content{gap:var(--space-6)}.fm-section-tab--active,.songs-panel-tab[aria-selected=true],.tabContainer:has(#oscTab1:checked) label[for=oscTab1],.tabContainer:has(#oscTab3:checked) label[for=oscTab3],.tabContainer:has(#oscTab4:checked) label[for=oscTab4],.tabContainer:has(#oscTab5:checked) label[for=oscTab5],.tabContainer:has(#fxTab1:checked) label[for=fxTab1],.tabContainer:has(#fxTab3:checked) label[for=fxTab3],.tabContainer:has(#fxTab2:checked) label[for=fxTab2],.tabContainer:has(#optionsTab1:checked) label[for=optionsTab1],.tabContainer:has(#optionsTab2:checked) label[for=optionsTab2],.tabContainer:has(#songSettingsTabSong:checked) label[for=songSettingsTabSong],.tabContainer:has(#songSettingsTabTheme:checked) label[for=songSettingsTabTheme],.tabContainer:has(#songSettingsTabGrid:checked) label[for=songSettingsTabGrid],.tabContainer:has(#editTab1:checked) label[for=editTab1],.tabContainer:has(#editTab2:checked) label[for=editTab2],.tabContainer:has(#editTab3:checked) label[for=editTab3],.tabContainer:has(#modTab1:checked) label[for=modTab1],.tabContainer:has(#modTab2:checked) label[for=modTab2]{color:var(--color-active);border-bottom-color:var(--color-active)}.fm-section-tab--active:hover,.songs-panel-tab[aria-selected=true]:hover,.tabContainer:has(#oscTab1:checked) label[for=oscTab1]:hover,.tabContainer:has(#oscTab3:checked) label[for=oscTab3]:hover,.tabContainer:has(#oscTab4:checked) label[for=oscTab4]:hover,.tabContainer:has(#oscTab5:checked) label[for=oscTab5]:hover,.tabContainer:has(#fxTab1:checked) label[for=fxTab1]:hover,.tabContainer:has(#fxTab3:checked) label[for=fxTab3]:hover,.tabContainer:has(#fxTab2:checked) label[for=fxTab2]:hover,.tabContainer:has(#optionsTab1:checked) label[for=optionsTab1]:hover,.tabContainer:has(#optionsTab2:checked) label[for=optionsTab2]:hover,.tabContainer:has(#songSettingsTabSong:checked) label[for=songSettingsTabSong]:hover,.tabContainer:has(#songSettingsTabTheme:checked) label[for=songSettingsTabTheme]:hover,.tabContainer:has(#songSettingsTabGrid:checked) label[for=songSettingsTabGrid]:hover,.tabContainer:has(#editTab1:checked) label[for=editTab1]:hover,.tabContainer:has(#editTab2:checked) label[for=editTab2]:hover,.tabContainer:has(#editTab3:checked) label[for=editTab3]:hover,.tabContainer:has(#modTab1:checked) label[for=modTab1]:hover,.tabContainer:has(#modTab2:checked) label[for=modTab2]:hover{color:var(--color-active-bright);border-bottom-color:var(--color-active-bright)}.tabButton--engine-on:after{content:"";display:inline-block;width:6px;height:6px;border-radius:var(--radius-full);background-color:var(--meter-led-green);box-shadow:0 0 4px var(--meter-led-green)}.tabContent .effectDimmedContainer:not(.voices-body){grid-column:1 / -1;display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6)}.tabContent .envDimmedContainer{grid-column:1 / -1;display:grid;grid-template-columns:1fr;gap:var(--space-6)}.tabContent .envToggleButton{grid-column:1 / -1;padding:var(--space-2) var(--space-2);color:var(--chrome-3)}input[type=radio]{position:absolute;width:1px;height:1px;margin:0;padding:0;opacity:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}@media only screen and (max-width:768px){.slide-panel .tabContainer>.tabs{position:sticky;top:0;z-index:var(--z-rail);margin-left:calc(var(--space-3) * -1);margin-right:calc(var(--space-3) * -1);padding:0 var(--space-3);background-color:var(--surface-panel)}}.voices-group{display:block;margin-top:var(--space-3)}.voices-group:first-child{margin-top:0}.voices-body{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-3) 0 0}.cols-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);align-items:start}.chip-group{display:flex;flex-direction:column;gap:var(--space-2)}.chip-group-label{font-size:var(--text-2xs);font-weight:700;letter-spacing:var(--tracking-control);text-transform:uppercase;color:var(--chrome-3);text-align:start}.chip-group-options{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center}.chip-group--equal-8 .chip-group-options{display:grid;grid-template-columns:repeat(8,1fr);gap:var(--space-2)}.chip-group--cluster .chip-group-options{display:inline-flex;flex-wrap:nowrap;align-self:start;border:1px solid var(--surface-border);border-radius:var(--radius-md);padding:var(--space-1);gap:0}.chip-group--cluster .chip-group-options>.controlButton{height:var(--control-height-md);border:none;border-radius:var(--radius);background-color:transparent;color:var(--chrome-3)}.chip-group--cluster .chip-group-options>.controlButton:hover{background-color:var(--surface-tint-2);color:var(--chrome-5)}.chip-group--cluster .chip-group-options>.controlButton.selected{background-color:var(--surface-tint-2);color:var(--color-active);box-shadow:0 0 0 .5px var(--chrome-1);border:none}.chip-group--cluster .chip-group-options>.controlButton.selected:hover{background-color:var(--surface-tint-2);color:var(--color-active)}.chip-group--cluster.chip-group--wrap .chip-group-options{display:flex;flex-wrap:wrap;align-self:stretch}.chip-group--cluster.chip-group--wrap .chip-group-options>.controlButton{flex:1 1 var(--chip-basis, 0);min-width:max-content;padding-inline:var(--space-3);white-space:nowrap}.chip-group--cluster.chip-group--equal-8 .chip-group-options{display:grid;grid-template-columns:repeat(8,1fr);gap:0;align-self:stretch}#oscTab3Content{gap:var(--space-3)}.section-title{position:relative;display:flex;align-items:center;gap:var(--space-3);text-transform:uppercase;margin:var(--space-1) 0 0 0;font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-label);color:var(--chrome-3);padding-inline:var(--space-4);padding-block:var(--space-2);background:var(--surface-tint-1);border-radius:0 var(--radius) var(--radius) 0}.section-title>span{flex:1 1 auto;min-width:0}.section-title:first-child{margin-top:0}.section-collapsible{cursor:pointer;-webkit-user-select:none;user-select:none}.section-collapsible:before{content:"";display:inline-block;width:.85em;height:.85em;vertical-align:-.1em;background-color:currentColor;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") no-repeat center / contain;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") no-repeat center / contain;transition:transform var(--transition-fast)}.section-collapsible.section-collapsed:before{transform:rotate(-90deg)}.section-collapse-hidden{display:none!important}#panelSequencer .section-title{margin-bottom:0}.section-title--grid{grid-column:1 / -1}.controlButton.inlineToggle{margin-left:auto;padding:var(--space-2) var(--space-2);font-size:var(--text-sm);line-height:1;color:var(--chrome-3)}.drum-track-active [data-drum-hide],[data-drum-show]{display:none!important}.drum-track-active [data-drum-show]{display:block!important}.drum-only-message{grid-column:1 / -1;text-align:center;color:var(--chrome-3);font-size:var(--text-md)}.drum-track-active .notesGridColumns{grid-template-columns:repeat(2,1fr)}.drum-track-active #drumRowEditGroup{display:block!important;grid-column:1 / -1}.drumRowEditContainer{display:flex;flex-direction:column;gap:var(--space-3)}#drumRowSelect{width:100%;padding:var(--space-4) var(--space-3)}.drumRowSlidersGrid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.drumRowChokeRow{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);align-items:center}.drumRowChokeGroup,.drumRowCutSelf{display:flex;align-items:center;gap:var(--space-3);min-width:0}#drumRowChokeSelect{flex:1;min-width:0;padding:var(--space-3)}.grooveSliderGrid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5) var(--space-6)}.drum-track-active .grooveSliderGrid>.sliderItem:nth-of-type(3){grid-column:1 / -1}.drum-row-selected{background-color:var(--surface-tint-4)!important;box-shadow:inset 0 0 0 1px var(--surface-band)}.drum-row-choke-mate{outline:1px dashed var(--surface-band);outline-offset:-1px}.delayModeContainer .delay-mode-stereo,.delayModeContainer .delay-mode-pitchshift,.delayModeContainer .delay-mode-slapback{display:none}.delay-mode-active-stereo .delay-mode-stereo,.delay-mode-active-pitchshift .delay-mode-pitchshift,.delay-mode-active-slapback .delay-mode-slapback{display:flex}.delay-mode-active-slapback .delayTimeContainer,.delay-label-level,.delay-mode-active-slapback .delay-label-feedback{display:none}.delay-mode-active-slapback .delay-label-level{display:inline}.delaySyncContainer.slapback-disabled{opacity:var(--opacity-disabled);pointer-events:none}.chordSettings{display:flex;flex-direction:column;gap:var(--space-4)}.chordSettings .chip-group[hidden]{display:none}.chordSettings .chord-type-group{--chip-basis: 21%}.presetContainer{margin:0 0 var(--space-2) 0;display:flex;gap:var(--space-3);align-items:center}#presetSelectBox{flex:1;min-width:0;padding:0 var(--space-8) 0 var(--space-5);font-size:var(--text-md);height:var(--control-height-lg);line-height:var(--control-height-lg);display:flex;align-items:baseline;gap:var(--space-2)}.preset-trigger-name{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preset-trigger-bank{flex:none;font-size:var(--text-3xs);color:var(--chrome-3);white-space:nowrap}#presetSelectBox[data-edited=true] .preset-trigger-name{font-style:italic}.presetContainer.loading #presetSelectBox{opacity:.6}.presetContainer.loading .spinner{display:inline-block}.preset-retry-btn{display:none;flex-shrink:0;width:var(--control-height-md);height:var(--control-height-md);padding:0;font-size:var(--text-md);line-height:1;color:var(--color-warning);background:transparent;border:var(--border-control) solid var(--color-warning);border-radius:var(--radius);cursor:pointer}.presetContainer.load-error #presetSelectBox{opacity:.6;border-color:var(--color-warning)}.presetContainer.load-error .preset-retry-btn{display:inline-flex;align-items:center;justify-content:center}.presetNavButton{flex-shrink:0;height:var(--control-height-lg);padding:0;font-size:var(--text-lg);line-height:1;color:var(--main-font-color);background-color:transparent;border:var(--border-control) solid var(--chrome-border);border-radius:var(--radius);cursor:pointer;transition:color var(--transition-fast),border-color var(--transition-fast)}.presetNavButton:hover{color:var(--chrome-5);border-color:var(--chrome-4)}.presetNavButton:active{color:var(--chrome-selected);border-color:var(--chrome-5)}@media(hover:none){.presetNavButton:hover{color:var(--main-font-color);border-color:var(--chrome-border)}}.texturePresetContainer{margin:var(--space-2) 0;justify-content:center}.customizeToggle{display:block;width:100%;margin:var(--space-2) 0;padding:var(--space-2) var(--space-4);font-size:var(--text-sm)}.customizeToggle.customizeActive{background-color:var(--surface-tint-2);border-color:var(--color-active);color:var(--color-active)}.customizeToggle.customizeActive:hover{border-color:var(--color-active-bright);color:var(--color-active-bright)}.slide-panel .sliderContainer.textureSliders--hidden{display:none}#playStopButton{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-7);font-size:var(--text-lg);color:var(--color-play);background-color:transparent;border:var(--border-control) solid var(--color-play-border);border-radius:var(--radius);text-align:center;cursor:pointer;transition:color var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast);letter-spacing:var(--tracking-control);margin:var(--space-3) 0 0 0}#playStopButton .play-stop-icon{flex-shrink:0}#playStopButton .stop-icon,#playStopButton.stopState .play-icon{display:none}#playStopButton.stopState .stop-icon{display:inline-block}#playStopButton:hover{border-color:var(--color-play-border);color:var(--color-play-hover)}#playStopButton:active{transform:scale(.97)}#playStopButton.stopState{border-color:var(--color-stop);color:var(--color-stop)}#playStopButton.stopState:hover{color:var(--color-stop-hover)}.controlButton{display:inline-block;padding:var(--space-3) var(--space-4);font-size:var(--text-sm);color:var(--main-font-color);background-color:transparent;border:var(--border-control) solid var(--chrome-border);border-radius:var(--radius);text-align:center;cursor:pointer;letter-spacing:var(--tracking-body);transition:color var(--transition-fast),border-color var(--transition-fast),background-color var(--transition-fast)}.controlButton:hover{color:var(--chrome-5);border-color:var(--chrome-4)}.controlButton:active{color:var(--chrome-selected);border-color:var(--chrome-5)}.controlButton:disabled{opacity:var(--opacity-disabled);cursor:not-allowed;pointer-events:none}@media(hover:none){.controlButton:hover{color:var(--main-font-color);border-color:var(--chrome-border)}}.controlButton.toggle-active:not(.effectToggle--outline){background-color:var(--surface-tint-2);border-color:var(--color-active);color:var(--color-active)}.controlButton.toggle-active:not(.effectToggle--outline):hover{background-color:color-mix(in srgb,var(--chrome-selected) 10%,transparent);border-color:var(--color-active-bright);color:var(--color-active-bright)}.controlButton.delaySyncButton.toggle-active:not(.effectToggle--outline),.controlButton.delaySyncButton.toggle-active:not(.effectToggle--outline):hover{background-color:transparent}#clearButton{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--space-2)}#clearButton>svg{width:13px;height:13px;flex-shrink:0}#clearButton:hover{border:var(--border-control) solid var(--chrome-4);color:var(--chrome-5)}@media(hover:none){#clearButton:hover{border:var(--border-control) solid var(--chrome-border);color:var(--chrome-3)}}#clearButton:active{border:var(--border-control) solid var(--color-danger-active)}#resetAllButton.confirm-pending{border-color:var(--color-danger);color:var(--color-danger)}.exportImportButton{padding:var(--space-3) var(--space-4)}.exportImportButton:active{border-color:var(--chrome-5)}.download-control-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3)}.utilButtons{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);grid-column:1 / -1}.utilButtons .download-control-button{grid-column:1 / -1}.utilButtons .controlButton{width:100%;padding-top:var(--space-4);padding-bottom:var(--space-4);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3)}.utilButtons .controlButton svg{flex-shrink:0;vertical-align:middle}.midi-record-btn{display:none}.effectToggle--outline{font-size:0;line-height:0;overflow:visible;position:relative;border:none;background:transparent;padding:0;width:28px;height:18px;display:flex;align-items:center;flex-shrink:0;cursor:pointer}.effectToggle--outline:before{content:"";position:absolute;width:26px;height:14px;border-radius:var(--radius-pill);background:transparent;border:1px solid var(--toggle-border);left:1px;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.effectToggle--outline:after{content:"";position:absolute;width:10px;height:10px;border-radius:var(--radius-full);background:var(--chrome-2);left:4px;transition:transform var(--transition-fast),background-color var(--transition-fast)}.effectToggle--outline:hover:before{border-color:var(--toggle-border-hover)}.effectToggle--outline:hover:after{background:var(--chrome-3)}.effectToggle--outline.toggle-active:before{background-color:var(--toggle-track);border-color:var(--toggle-border-active)}.effectToggle--outline.toggle-active:after{transform:translate(10px);background:var(--chrome-5)}.effectToggle--outline:focus-visible{border-radius:var(--radius-pill)}.effectToggle--outline:disabled{opacity:var(--opacity-disabled);cursor:not-allowed;pointer-events:none}@media only screen and (max-width:768px){#playStopButton{font-size:var(--text-lg);padding:var(--space-5) var(--space-5);border-width:1px}.controlButton,.exportImportButton{padding:var(--space-3)}#clearButton br{display:none}}.labelContainer{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);overflow:hidden;min-width:0}.labelContainer label{overflow:hidden;text-overflow:ellipsis}.labelContainer .sliderValueDisplay{flex-shrink:0}label{font-size:var(--text-sm);color:var(--main-font-color);font-weight:500;white-space:nowrap}.sliderItem label{text-transform:lowercase;font-weight:400;letter-spacing:normal}.sliderItem label:first-letter{text-transform:uppercase}.midi-device-selectors .sliderItem label{text-transform:none;font-weight:500;letter-spacing:normal}.selectBox{cursor:pointer;width:100%;border-radius:var(--radius);text-align:left;padding-left:var(--space-7);font-size:var(--text-xs);color:var(--main-font-color);border:var(--border-control) solid var(--chrome-border);letter-spacing:var(--tracking-body);transition:color var(--transition-fast),border-color var(--transition-fast);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;background-image:none;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjOTk5IiBzdHJva2Utd2lkdGg9IjEuNzUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cG9seWxpbmUgcG9pbnRzPSI2IDkgMTIgMTUgMTggOSIvPjwvc3ZnPg==);background-repeat:no-repeat;background-position:right 4px center;background-size:16px 16px;padding-right:var(--space-8)}.selectBox:hover{color:var(--chrome-5);border:var(--border-control) solid var(--chrome-4)}.selectBox:active{border-color:var(--chrome-4)}.selectBox:focus-visible{outline:2px solid var(--color-active);outline-offset:var(--space-1);border-color:var(--chrome-1);box-shadow:none;background-color:transparent}@media(hover:none){.selectBox:hover{background-color:transparent;color:var(--chrome-3)}}button.selectBox{font-family:inherit;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}button.selectBox:disabled{opacity:var(--opacity-disabled);cursor:not-allowed;pointer-events:none}.dropdown-popover{width:240px;max-height:360px;display:flex;flex-direction:column;padding:var(--space-2);z-index:var(--z-overlay);outline:none}.dropdown-popover.grid-size-popover{width:max-content;min-width:140px;max-width:min(300px,calc(100vw - 2 * var(--space-4)))}.grid-size-popover .dropdown-popover-item-label{flex:0 0 auto}.grid-size-popover .dropdown-popover-item-trailing{min-width:0;padding-left:var(--space-4);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-popover.time-sig-popover{width:120px;max-height:440px}.dropdown-popover-title{flex-shrink:0;padding:var(--space-1) var(--space-2) var(--space-2);margin-bottom:var(--space-1);border-bottom:1px solid color-mix(in srgb,var(--surface-border),var(--chrome-1) 28%);color:var(--chrome-4);font-size:var(--text-xs);font-weight:600;line-height:1.3}.time-sig-popover-note{padding:var(--space-1) var(--space-2) 0;color:var(--chrome-3);font-size:var(--text-3xs);line-height:1.3}.dropdown-popover-search{width:100%;height:var(--control-height-lg);flex-shrink:0;background:var(--surface-tint-1);border:1px solid var(--surface-border);border-radius:var(--radius);color:var(--chrome-5);padding:0 var(--space-2);font-size:var(--text-xs);margin-bottom:var(--space-2);font-family:inherit}.dropdown-popover-search-row{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2)}.dropdown-popover-search-row .dropdown-popover-search{flex:1;margin-bottom:0}.dropdown-popover-search-action{flex-shrink:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;padding:0;cursor:pointer}.dropdown-popover-search-action:disabled{opacity:var(--opacity-disabled);cursor:default}.dropdown-popover-list{overflow-y:auto;flex:1;min-height:0}.dropdown-popover-search:focus-visible,.dropdown-popover-list:focus-visible{outline:none}.dropdown-popover-group-header{position:sticky;top:0;background:var(--surface-dark);font-size:var(--text-3xs);color:var(--chrome-3);text-transform:uppercase;letter-spacing:var(--tracking-body);padding:var(--space-1) var(--space-2);border-bottom:1px solid color-mix(in srgb,var(--surface-border),var(--chrome-1) 28%);z-index:1}.dropdown-popover-group-header:not(:first-child){margin-top:var(--space-2)}.dropdown-popover-item{display:flex;justify-content:space-between;align-items:center;padding:var(--space-1) var(--space-2);cursor:pointer;font-size:var(--text-xs);color:var(--chrome-4);border-radius:var(--radius)}.dropdown-popover-item:hover,.dropdown-popover[data-keyboard-nav] .dropdown-popover-item[data-active=true]{background:var(--surface-tint-1);color:var(--chrome-5)}.dropdown-popover-item[aria-selected=true]{color:var(--color-active)}.dropdown-popover-item[aria-disabled=true]{opacity:var(--opacity-disabled);cursor:not-allowed}.dropdown-popover-item-leading{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;margin-right:var(--space-2);font-size:var(--text-sm);line-height:1}.dropdown-popover-item-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-popover-item-trailing{color:var(--chrome-3);font-size:var(--text-3xs);text-transform:uppercase;letter-spacing:var(--tracking-body);padding-left:var(--space-2)}.dropdown-popover-item-match{background:none;color:var(--chrome-5);font-weight:600}.dropdown-popover-item[aria-selected=true] .dropdown-popover-item-match{color:inherit}.dropdown-popover-empty{padding:var(--space-3);text-align:center;color:var(--chrome-3);font-size:var(--text-xs)}.dropdown-popover-status{padding:var(--space-3) var(--space-2);text-align:center;color:var(--chrome-3);font-size:var(--text-2xs)}.dropdown-popover-header{margin-bottom:var(--space-2)}.dropdown-popover-footer{flex-shrink:0;margin-top:var(--space-2);padding-top:var(--space-1);border-top:1px solid color-mix(in srgb,var(--surface-border),var(--chrome-1) 28%)}.dropdown-popover[data-drag-over=true]{outline:2px dashed var(--color-active);outline-offset:-2px}.dropdown-popover-row-action{display:inline-block;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;color:var(--chrome-3);font:inherit;font-size:var(--text-md);line-height:1;padding:0 var(--space-2);cursor:pointer;margin-left:var(--space-2);border-radius:var(--radius)}.dropdown-popover-row-action:hover{color:var(--chrome-5)}.dropdown-popover-row-action[data-active=true]{color:var(--color-active)}.dropdown-popover-row-action:focus-visible{outline:2px solid var(--color-active);outline-offset:var(--space-1)}#fileInput{display:none}#scaleSelectBox{margin-top:0;padding:var(--space-4) var(--space-3)}#scaleSelectBox:disabled{opacity:var(--opacity-disabled);cursor:not-allowed;pointer-events:none}#gridSizeSelectBox{padding:0 var(--space-8) 0 var(--space-6);font-family:var(--font-mono);font-size:var(--text-md);background-color:var(--surface-dark)}.scaleContainer{display:flex;flex-direction:column;width:100%}@media only screen and (max-width:768px){.selectBox{padding:var(--space-3)}label{font-size:var(--text-md)}.labelContainer{padding-right:var(--space-6)}#scaleSelectBox{padding-left:var(--space-5);padding-right:var(--space-8);font-size:var(--text-xs);text-overflow:ellipsis;overflow:hidden}.dropdown-popover-item,.dropdown-popover-search,.dropdown-popover-empty{font-size:var(--text-sm)}}@media only screen and (max-width:430px)and (orientation:portrait){.labelContainer{padding-right:var(--space-5)}}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;pointer-events:none}.hidden{display:none;visibility:hidden}.sliderValueDisplay{color:var(--chrome-3);font-family:var(--font-mono);font-size:var(--text-sm);white-space:nowrap}.tempoCol{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:var(--space-2);row-gap:0}.tempoHeader{display:contents}.transport-row .tempoCol #tempoSlider{grid-column:1 / -1;grid-row:2;width:100%;min-width:0;height:20px;margin:0;margin-top:calc(-1 * var(--space-2));transform:translateY(2px)}.transport-row .tempoCol #tapTempoButton{grid-column:1;grid-row:1;justify-self:start}.transport-row .tempoCol #tempoValue{grid-column:3;grid-row:1;justify-self:end;margin:calc(-1 * var(--space-5)) 0 0;padding:var(--space-5) var(--space-2) 0;font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-xs);line-height:1.4;color:var(--chrome-3);border-radius:var(--radius)}.tapTempoButton{padding:var(--space-1) var(--space-3);font-size:var(--text-xs);font-weight:600;letter-spacing:var(--tracking-control);text-transform:uppercase;color:var(--chrome-3);background:transparent;border:var(--border-control) solid var(--chrome-1);border-radius:var(--radius);cursor:pointer;transition:border-color var(--transition-fast),color var(--transition-fast)}.tapTempoButton:active{color:var(--main-font-color);border-color:var(--main-font-color)}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:95%;height:20px;border-radius:var(--radius);background:transparent;transition:opacity var(--transition-fast);cursor:pointer;will-change:transform}input[type=range]:hover{opacity:1}input[type=range]:focus{background:transparent}input[type=range]::-webkit-slider-runnable-track{width:100%;height:2px;background:linear-gradient(to right,var(--color-active) calc(9px + (100% - 18px) * var(--pct, 50%) / 100%),var(--slider-track) calc(9px + (100% - 18px) * var(--pct, 50%) / 100%));border-radius:var(--radius-sm)}input[type=range]::-moz-range-track{width:95%;height:2px;background:var(--slider-track);border-radius:var(--radius-sm)}input[type=range]::-moz-range-progress{height:2px;background:var(--color-active);border-radius:var(--radius-sm)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:15px;height:15px;padding:0;border-radius:var(--radius-full);background:var(--background-color);border:1.5px solid var(--chrome-4);cursor:pointer;transition:border-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast);margin-top:-7px}input[type=range]::-webkit-slider-thumb:hover{border-color:var(--chrome-5);box-shadow:var(--focus-halo)}input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15);border-color:var(--chrome-5);box-shadow:var(--focus-halo-strong)}input[type=range]::-moz-range-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:15px;height:15px;padding:0;border-radius:var(--radius-full);background:var(--background-color);border:1.5px solid var(--chrome-4);cursor:pointer;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}input[type=range]::-moz-range-thumb:hover{border-color:var(--chrome-5);box-shadow:var(--focus-halo)}input[type=range]::-moz-range-thumb:active{border-color:var(--chrome-5);box-shadow:var(--focus-halo-strong)}@media only screen and (max-width:768px){.sliderValueDisplay{font-size:var(--text-md)}}.randomizeDice{width:2rem;height:2rem;border-radius:var(--radius);border:var(--border-control) solid var(--chrome-3);cursor:pointer;background-color:transparent;transition:background-color var(--transition-fast),border-color var(--transition-fast);position:relative;justify-self:center;align-self:center}.randomizeDice:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:4px;height:4px;border-radius:var(--radius-full);background:var(--chrome-4);box-shadow:-7px -7px 0 var(--chrome-4),7px -7px 0 var(--chrome-4),-7px 7px 0 var(--chrome-4),7px 7px 0 var(--chrome-4)}.song-bar-picker .presetRandomButton{height:var(--song-bar-control-h);width:var(--space-8);display:inline-flex;border:none}.song-bar-picker .presetRandomButton:before,.themeBrowser .theme-random-button:before{width:3px;height:3px;background:currentColor;box-shadow:-5px -5px 0 currentColor,5px -5px 0 currentColor,-5px 5px 0 currentColor,5px 5px 0 currentColor}#header{visibility:hidden}.header{display:flex;justify-content:space-between;align-items:center;column-gap:var(--space-6);background-color:transparent;margin:0 auto;padding-left:var(--space-2);position:relative}.header-dash{flex:1 1 0;min-width:0;display:block}.header-dash[hidden]{display:none}:root[data-performance-mode=on] .header-dash{display:none}@media(min-width:769px){.header-dash{min-width:calc(var(--hd-min) + 2 * var(--hd-gutter))}#header.hf-dash .header-dash{min-width:calc(var(--hd-narrow) + 2 * var(--hd-gutter))}#header.hf-dash-min .header-dash{min-width:calc(var(--hd-phone-min) + 2 * var(--hd-gutter))}}@media(max-width:768px){.header-dash{min-width:calc(var(--hd-phone-min) + 2 * var(--hd-gutter))}#header.hm-dash .header-dash{display:none}:root:not([data-performance-mode=on]):not([data-simple-mode=on]) #header{min-height:calc(var(--control-height-lg) + 2 * var(--space-1))}#header:not(.hm-ready) .logo{visibility:hidden}#header.hm-logo .logo{width:27px;min-width:27px;height:28px;object-fit:cover;object-position:left center}}.header-items{display:flex;align-items:center;gap:var(--space-4)}.logo{width:364px;height:auto;display:block;cursor:pointer;flex-shrink:0}@media(min-width:769px){#header.hf-logo .logo{width:240px}}.header>.header-items{flex-shrink:0}.header-right,.header-right>.header-items{min-width:0}.header-song{--header-song-h: calc(var(--control-height-lg) + 2 * var(--space-1));display:flex;align-items:center;gap:var(--space-3);min-width:0}.header-song :is(.song-info-button,.new-song-button,.song-settings-button){width:var(--header-song-h);height:var(--header-song-h)}.song-info-button[hidden]{display:none}.song-title-group{display:flex;align-items:center;flex:0 1 auto;min-width:0;border-radius:var(--radius-md)}.song-title-group:has(>.song-info-button:not([hidden])){background-color:var(--surface-tint-1);outline:var(--border-control) solid var(--surface-tint-2);outline-offset:calc(-1 * var(--border-control))}.song-title-group:has(>.song-info-button:not([hidden])) .song-title-input{border-start-end-radius:0;border-end-end-radius:0}.song-title-group>.song-info-button{position:relative;border-start-start-radius:0;border-end-start-radius:0}.song-title-group>.song-info-button:before{content:"";position:absolute;inset-block:var(--space-3);inset-inline-start:0;border-inline-start:var(--border-control) solid var(--surface-tint-2)}.header-island{display:flex;align-items:center;gap:var(--space-1);padding:var(--space-1);flex-shrink:0}.header-island .header-island-btn{width:auto;height:var(--control-height-lg);padding:0 var(--space-4);gap:var(--space-3)}.header-island .header-island-btn[aria-expanded=true]{background:var(--surface-tint-2);color:var(--color-active)}.header-island .header-island-btn[aria-disabled=true]{opacity:var(--opacity-disabled);cursor:not-allowed}.header-island .header-island-btn[aria-disabled=true]:not([aria-expanded=true]):hover{color:var(--chrome-3);background-color:transparent}#header.hf-labels .header-island-text{display:none}.header-btn-text{display:none;white-space:nowrap;font-size:var(--text-sm);font-weight:500}#header .header-btn-text{display:inline}.song-title-wrap{position:relative;display:flex;align-items:center;flex:0 1 auto;min-width:0;cursor:text}.song-title-input{flex:0 1 auto;min-width:6ch;width:14ch;max-width:28ch;height:var(--header-song-h);padding:0 var(--space-3);padding-inline-end:calc(var(--space-3) * 2 + var(--icon-sm));background:transparent;border:var(--border-control) solid transparent;border-radius:var(--radius-md);color:var(--chrome-4);font-family:inherit;font-size:var(--text-sm);font-weight:400;text-overflow:ellipsis;transition:border-color var(--transition-fast),color var(--transition-fast)}.song-title-input::placeholder{color:var(--chrome-3);opacity:.6}.song-title-wrap:hover .song-title-input::placeholder{opacity:1}.song-title-input:hover{background-color:var(--surface-tint-1)}.song-title-input:not(:placeholder-shown){padding-inline-end:var(--space-3);color:var(--color-active)}.song-title-input:not(:placeholder-shown)+.song-title-pencil{display:none}.song-title-input:focus{border-color:var(--chrome-4);color:var(--chrome-5)}.song-title-input:focus:not(:focus-visible){outline:none}.song-title-pencil{position:absolute;inset-inline-end:var(--space-3);color:var(--chrome-3);opacity:.6;pointer-events:none;transition:opacity var(--transition-fast)}.song-title-wrap:hover .song-title-pencil{opacity:1}.song-title-input:focus+.song-title-pencil{opacity:0}:root[data-simple-mode=on] .song-title-wrap{display:none}@media only screen and (max-width:768px){.song-title-group:has(>.song-info-button:not([hidden])){background-color:transparent;outline:none}.song-title-group>.song-info-button:before{display:none}.song-title-wrap,.header .new-song-button,.header .song-settings-button,#header .header-btn-text{display:none}.header-island{gap:0}.header .header-island .help-button{height:30px;padding:0 var(--space-3);margin-left:0}.header{width:100%;margin:var(--space-3) auto var(--space-3);padding:0 var(--space-4)}.logo{width:min(48vw,calc(100vw - 200px));max-width:200px;position:static;transform:none}.undo-redo-group{display:none}.header .help-button{width:30px;height:30px;margin-left:var(--space-3)}.header .help-button svg{width:18px;height:18px}.header-right{margin-left:auto}.header-right .header-items{gap:var(--space-1)}#header :is(#mySongsButton,#explore-button,#helpButton,#optionsButton,.header-utility-divider){display:none}#header .header-menu-button{display:flex;position:relative}#header .header-menu-button svg{width:22px;height:22px}#header .header-menu-button:after{content:"";position:absolute;inset-block:calc(-1 * (var(--space-3) + var(--border-control)));left:calc(-1 * (var(--space-3) + var(--border-control)));right:calc(-1 * (var(--space-4) + var(--border-control)))}#header #share-button{width:auto;gap:var(--space-3)}#header #share-button .share-button-text{display:inline}.header-island{padding:0}}@media only screen and (max-width:430px){.logo{width:calc(100vw - 200px);min-width:84px;max-width:200px}}.explore-icon,.share-export-icon{width:18px;height:18px}#header.hf-share .share-button-text{display:none}#header.hf-menu :is(#mySongsButton,#explore-button,#helpButton,#optionsButton){display:none}#header.hf-menu .header-menu-button{display:flex}#header.hf-title .song-title-wrap{display:none}#header.hf-title .song-title-group:has(>.song-info-button:not([hidden])){background-color:transparent;outline:none}#header.hf-title .song-title-group>.song-info-button{border-radius:var(--radius-md)}#header.hf-title .song-title-group>.song-info-button:before{display:none}.header-right{display:flex;align-items:center;gap:var(--space-5)}.header-utility-divider{display:block;width:1px;height:20px;margin:0 var(--space-1);background:var(--song-bar-divider);flex-shrink:0}.help-button{display:flex;align-items:center;justify-content:center;width:35px;height:35px;padding:0;font-size:var(--text-sm);font-weight:600;color:var(--chrome-3);background-color:transparent;border:var(--border-control) solid transparent;border-radius:var(--radius);cursor:pointer;transition:color var(--transition-fast),background-color var(--transition-fast);flex-shrink:0}.help-button svg{width:18px;height:18px}.help-button:hover{color:var(--chrome-5);background-color:var(--surface-tint-4)}.help-button:focus-visible{color:var(--chrome-5);background-color:var(--surface-tint-4)}.help-button:active{color:var(--chrome-selected)}#helpButton{width:26px;height:26px;border-radius:var(--radius-full);border-color:color-mix(in srgb,currentColor 45%,transparent)}.spinner{width:var(--text-md);height:var(--text-md);border:1px solid var(--chrome-5);border-top-color:transparent;border-radius:var(--radius-full);animation:spin var(--duration-spin) linear infinite;display:none}@keyframes spin{to{transform:rotate(360deg)}}.mini-control-btn{position:relative;display:flex;align-items:center;justify-content:center;background:transparent;border:var(--border-control) solid var(--chrome-border);border-radius:var(--radius);color:var(--main-font-color);cursor:pointer;padding:var(--space-4) var(--space-4);transition:color var(--transition-fast),border-color var(--transition-fast)}.mini-control-btn:hover{border-color:var(--chrome-4);color:var(--chrome-5)}.mini-control-btn:active{border-color:var(--chrome-5);color:var(--chrome-selected)}.undo-redo-group{display:flex;align-items:center}.header-undo-redo{border-color:transparent;color:var(--chrome-3)}.header-undo-redo:hover{border-color:transparent;background-color:var(--surface-tint-2)}.header-undo-redo:active{border-color:transparent}.header-undo-redo[disabled]{color:color-mix(in srgb,var(--chrome-3) 50%,transparent);border-color:transparent}@media(hover:none){.help-button:hover{color:var(--chrome-3);background-color:transparent}}.header-menu-button{display:none}.header-menu-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--z-overlay);display:flex;align-items:flex-start;background:var(--overlay-frosted);backdrop-filter:blur(var(--blur-scrim));-webkit-backdrop-filter:blur(var(--blur-scrim));animation:modal-shell-fade var(--transition-fast)}.header-menu-overlay[hidden]{display:none}:root[data-performance-mode=on] .header-menu-overlay{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--overlay)}.header-menu-sheet{width:100%;max-height:85dvh;overflow-y:auto;padding:calc(var(--space-6) + env(safe-area-inset-top)) var(--space-6) var(--space-4);color:var(--main-font-color);background-color:var(--surface-modal);border-bottom:var(--border-control) solid var(--popup-border);border-end-start-radius:var(--radius-lg);border-end-end-radius:var(--radius-lg);animation:header-menu-drop var(--transition-reveal);touch-action:none;transition:translate var(--transition-fast)}.header-menu-sheet--scrolls{touch-action:pan-y}.header-menu-sheet--dragging{transition:none;user-select:none;-webkit-user-select:none}.header-menu-overlay--leaving{opacity:0;transition:opacity var(--duration-reveal) ease-in;pointer-events:none}.header-menu-overlay--leaving .header-menu-sheet{translate:0 -100%;transition:translate var(--duration-reveal) ease-in}@keyframes header-menu-drop{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.header-menu-overlay,.header-menu-sheet{animation:none}}.header-menu-grab{box-sizing:content-box;width:var(--space-9);height:var(--space-2);margin:var(--space-3) auto calc(-1 * var(--space-3));padding:var(--space-3) var(--space-9);border-radius:var(--radius-pill);background-color:var(--chrome-2);background-clip:content-box;touch-action:none}.header-menu-tiles{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.header-menu-tile{display:grid;justify-items:start;align-content:start;gap:var(--space-2);min-width:0;padding:var(--space-5);text-align:start;font:inherit;color:var(--main-font-color);background-color:var(--surface-tint-2);border:var(--border-control) solid transparent;border-radius:var(--radius-lg);cursor:pointer;transition:background-color var(--transition-fast)}.header-menu-tile svg{width:var(--text-lg);height:var(--text-lg);margin-bottom:var(--space-2);color:var(--color-active)}.header-menu-tile:last-child:nth-child(odd){grid-column:1 / -1}.header-menu-tile-title{font-size:var(--text-md);font-weight:600}.header-menu-tile-desc{font-size:var(--text-xs);color:var(--chrome-3)}@media(min-width:769px){.header-menu-tiles{grid-template-columns:repeat(3,1fr)}.header-menu-tile:is([data-target=newSongButton],[data-target=songSettingsButton]){display:none}}@media(hover:hover){.header-menu-tile:hover{background-color:var(--surface-tint-4)}}.header-menu-tile[aria-disabled=true],.header-menu-tile[aria-disabled=true]:hover{background-color:var(--surface-tint-2);opacity:var(--opacity-disabled);cursor:not-allowed}.header-menu-tile:focus-visible{outline:none;border-color:var(--color-active)}#songBar{--song-bar-control-h: var(--space-9);--song-bar-select-w: clamp(88px, calc((100vw - 820px)*.221 + 88px) , 150px);display:flex;flex-wrap:nowrap;align-items:center;gap:clamp(var(--space-4),calc((100vw - 1000px) * .025 + var(--space-4)),var(--space-9));padding:var(--space-5) 0;font-size:var(--text-xs);color:var(--main-font-color);position:relative}.song-bar-group{display:flex;align-items:center;gap:var(--space-4);flex-shrink:0}.undo-redo-group.song-bar-group{gap:0}.song-bar-divider{flex-shrink:0;align-self:center;width:1px;height:var(--space-8);background-color:var(--song-bar-divider)}#playStopButton.song-bar-play{--glow: var(--color-play);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:var(--song-bar-control-h);min-width:72px;padding:0 var(--space-3);margin:0;white-space:nowrap;background-color:transparent;color:var(--glow);border:1px solid var(--glow);border-radius:var(--radius);font-size:var(--text-sm);font-weight:600;letter-spacing:var(--tracking-body);cursor:pointer;text-shadow:0 0 2px color-mix(in srgb,var(--glow) 30%,transparent);box-shadow:0 0 4px color-mix(in srgb,var(--glow) 16%,transparent),0 0 10px color-mix(in srgb,var(--glow) 6%,transparent);transition:background-color var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast),text-shadow var(--transition-fast)}.song-bar-play:hover{--glow: var(--color-play-hover);background-color:color-mix(in srgb,var(--glow) 6%,transparent);box-shadow:0 0 5px color-mix(in srgb,var(--glow) 24%,transparent),0 0 12px color-mix(in srgb,var(--glow) 10%,transparent)}#playStopButton.song-bar-play.stopState{--glow: var(--color-stop)}#playStopButton.song-bar-play.stopState:hover{--glow: var(--color-stop-hover)}.song-bar-play .play-stop-icon{width:16px;height:16px;flex-shrink:0;filter:drop-shadow(0 0 1px color-mix(in srgb,var(--glow) 28%,transparent));transition:filter var(--transition-fast)}.song-bar-play .play-stop-label{display:grid;letter-spacing:var(--tracking-control);text-transform:uppercase}.song-bar-play .play-stop-label>span{grid-area:1 / 1;text-align:center}.song-bar-play .play-stop-label__stop,.song-bar-play.stopState .play-stop-label__play{visibility:hidden}.song-bar-play.stopState .play-stop-label__stop{visibility:visible}.song-bar-play.loading .play-stop-icon,.song-bar-play.loading .play-stop-label{visibility:hidden}.song-bar-play.loading:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:16px;height:16px;border:2px solid var(--chrome-border);border-top-color:var(--chrome-3);border-radius:var(--radius-full);animation:spin var(--duration-spin) linear infinite}@media(prefers-reduced-motion:reduce){.song-bar-play.loading:after{animation:none;border-color:var(--chrome-border);border-top-color:var(--chrome-3)}}.song-bar-icon-btn{display:none;align-items:center;justify-content:center;width:var(--song-bar-control-h);height:var(--song-bar-control-h);padding:0;background:transparent;border:var(--border-control) solid var(--chrome-border);border-radius:var(--radius);color:var(--chrome-3);cursor:pointer;transition:color var(--transition-fast),border-color var(--transition-fast)}.song-bar-icon-btn.midi-visible{display:inline-flex}.song-bar-icon-btn:hover{color:var(--chrome-5);border-color:var(--chrome-4)}.song-bar-icon-btn.midi-armed{color:var(--color-danger);border-color:var(--color-danger)}#songBar .header-undo-redo{width:var(--song-bar-control-h);height:var(--song-bar-control-h);padding:0}.clear-menu{z-index:var(--z-dropdown);display:flex;flex-direction:column;min-width:220px;padding:var(--space-2)}.clear-menu:focus{outline:none}.clear-menu-item{display:grid;grid-template-columns:1fr auto;column-gap:var(--space-4);row-gap:var(--space-1);align-items:center;padding:var(--space-3) var(--space-4);border:0;border-radius:var(--radius);background:transparent;color:var(--chrome-5);font:inherit;font-size:var(--text-sm);text-align:start;cursor:pointer}.clear-menu-item:hover,.clear-menu-item:focus-visible{background:var(--surface-tint-4);outline:none}.clear-menu-item-hint{grid-column:1;color:var(--chrome-3);font-size:var(--text-xs)}.clear-menu-item-key{grid-column:2;grid-row:1;font-family:var(--font-mono);font-size:var(--text-2xs);padding:0 var(--space-2);border:1px solid var(--chrome-border);border-radius:var(--radius);color:var(--chrome-3)}.clear-menu-item--armed,.clear-menu-item--armed:hover,.clear-menu-item--armed:focus-visible{background:var(--color-danger-deep);color:var(--ink-light)}.clear-menu-item--armed :is(.clear-menu-item-hint,.clear-menu-item-key){color:var(--ink-light-dim);border-color:var(--ink-light-faint)}.clear-menu-separator{height:1px;margin:var(--space-2) var(--space-3);background:var(--popup-border)}:is(#songBar,.transport-play-row,.transport-row,.mobile-preset-row) .song-bar-ghost{background-color:transparent;border-color:transparent;color:var(--chrome-3)}:is(#songBar,.transport-play-row,.transport-row,.mobile-preset-row) .song-bar-ghost:hover{background-color:var(--surface-tint-2);border-color:transparent;color:var(--chrome-5)}:is(#songBar,.transport-play-row,.transport-row,.mobile-preset-row) .song-bar-ghost:active{border-color:transparent;color:var(--chrome-selected)}@media(hover:none){:is(#songBar,.transport-play-row,.transport-row,.mobile-preset-row) .song-bar-ghost:hover{background-color:transparent;color:var(--chrome-3)}}.song-bar-action{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);height:var(--song-bar-control-h);width:auto;min-width:68px;padding:0 var(--space-2);line-height:1;white-space:nowrap}.song-bar-action svg{width:14px;height:14px;flex-shrink:0}.song-bar-action .controlButton-label{font-size:var(--text-xs);letter-spacing:var(--tracking-control);text-transform:uppercase;white-space:nowrap}.song-bar-grid-size{display:inline-flex;align-items:center;position:relative}.song-bar-grid-size #gridSizeSelectBox{height:var(--song-bar-control-h);padding:0 var(--space-8) 0 var(--space-3);font-size:var(--text-xs);font-family:var(--font-mono);font-variant-numeric:tabular-nums;min-width:64px;text-align:center}.song-bar-preset{display:inline-flex;align-items:center;gap:0;margin:0}.song-bar-preset #presetSelectBox{flex:none}.song-bar-picker .presetNavButton{height:var(--song-bar-control-h);width:var(--space-8);display:inline-flex;align-items:center;justify-content:center}.song-bar-group--tempo{flex-wrap:wrap;row-gap:0;column-gap:var(--space-2);width:120px}@media(min-width:1280px){#songBar:not(.sbf-gap){--song-bar-select-w: clamp(150px, calc((100vw - 1280px)*.1 + 150px) , 340px)}#songBar:not(.sbf-gap) .song-bar-group--tempo{width:clamp(120px,calc((100vw - 1280px)*.083 + 120px),280px)}}#songBar .song-bar-group--tempo{transform:translateY(2px)}.song-bar-tap{height:var(--space-6);padding:0 var(--space-2);font-size:var(--text-xs);line-height:1;letter-spacing:var(--tracking-control);text-transform:uppercase;background:transparent;border:var(--border-control) solid var(--chrome-1);border-radius:var(--radius);color:var(--chrome-3);cursor:pointer;transition:color var(--transition-fast),border-color var(--transition-fast)}#songBar .song-bar-tap:before,.transport-row #tapTempoButton:before{content:"";position:absolute;top:-6px;right:0;bottom:-4px;left:0}.transport-row #tapTempoButton:before{top:-9px;right:0;bottom:-1px;left:0;z-index:1}input[type=range].song-bar-tempo-slider{order:3;flex-basis:100%;width:100%;min-width:0;height:10px;margin-top:var(--space-3)}.song-bar-tempo-value{order:2;margin-left:auto;min-width:28px;text-align:right;font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-sm);line-height:1}#tempoValue{cursor:pointer;border-radius:var(--radius-sm);transition:background var(--transition-fast)}#tempoValue:hover{background:var(--surface-tint-1)}#tempoValue:focus-visible{outline:2px solid var(--color-active);outline-offset:var(--space-1)}#tempoValue.tempo-editing{cursor:text;outline:none;background:color-mix(in srgb,var(--chrome-5) 10%,transparent);color:var(--chrome-selected);-webkit-user-select:text;user-select:text}.song-bar-scale{display:inline-flex;flex-direction:row;align-items:center;gap:0;width:auto}.song-bar-scale #scaleSelectBox,.song-bar-preset #presetSelectBox{width:var(--song-bar-select-w, 150px);height:var(--song-bar-control-h);padding:0 var(--space-8) 0 var(--space-3);font-size:var(--text-xs);line-height:var(--song-bar-control-h);text-align:left}.song-bar-meter{display:inline-flex;align-items:center;position:relative}.song-bar-meter #timeSigSelectBox{height:var(--song-bar-control-h);padding:0 var(--space-8) 0 var(--space-3);font-size:var(--text-xs);font-family:var(--font-mono);font-variant-numeric:tabular-nums;min-width:56px;text-align:center}.song-bar-select,.song-bar-select:hover,.song-bar-select:active,.song-bar-select:focus-visible{background-color:var(--surface-tint-1);border-color:transparent}.song-bar-group--view-toggles{margin-left:auto;gap:var(--space-2)}.song-bar-mode-cluster{display:inline-flex;background:var(--surface-tint-1);border:var(--border-control) solid var(--surface-border);border-radius:var(--radius-md);padding:var(--space-1);gap:0}.song-bar-mode-cluster .song-bar-mode-btn{width:auto;min-width:30px;height:var(--control-height-md);border:none;border-radius:var(--radius)}.song-bar-mode-cluster .song-bar-mode-btn[aria-pressed=true]{background-color:var(--surface-tint-2);color:var(--color-active);box-shadow:0 0 0 .5px var(--chrome-1)}.song-bar-mode-cluster .song-bar-mode-btn[aria-pressed=true]:hover:not([disabled]){background-color:var(--surface-tint-2)}.song-bar-mode-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--song-bar-control-h);height:var(--song-bar-control-h);padding:0;background:transparent;border:var(--border-control) solid transparent;border-radius:var(--radius);color:var(--chrome-3);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast)}.song-bar-mode-icon{width:20px;height:20px;flex-shrink:0;display:inline-block;stroke-width:1.25}.song-bar-mode-icon circle{fill:currentColor}.song-bar-mode-btn:hover:not([disabled]){color:var(--chrome-5);background-color:var(--surface-tint-2)}.song-bar-mode-btn[aria-pressed=true]{background-color:transparent;color:var(--color-active);border-color:transparent}.song-bar-mode-btn[aria-pressed=true]:hover:not([disabled]){color:color-mix(in srgb,var(--color-active),white 40%)}.song-bar-mode-btn[disabled],.song-bar-mode-btn[aria-disabled=true]{opacity:var(--opacity-disabled);cursor:not-allowed}.song-bar-mode-btn:focus-visible{outline:2px solid var(--color-active);outline-offset:var(--space-1);position:relative;z-index:1}@media only screen and (max-width:768px){#songBar{display:none}.song-bar-scale #scaleSelectBox,.song-bar-preset #presetSelectBox{height:var(--space-9);padding:0 var(--space-8) 0 var(--space-3);font-size:var(--text-xs);line-height:var(--space-9);text-align:left}.song-bar-preset #presetSelectBox{min-width:0;max-width:none;width:100%}}#songBar.sbf-gap{gap:var(--space-2)}#songBar.sbf-gap .song-bar-divider,#songBar.sbf-declutter .song-bar-action .controlButton-label{display:none}#songBar.sbf-declutter .song-bar-action{width:auto;min-width:var(--song-bar-control-h)}#songBar.sbf-declutter .song-bar-action svg{width:16px;height:16px}#songBar.sbf-declutter .header-undo-redo svg{width:20px;height:20px}#songBar.sbf-shrink #playStopButton.song-bar-play{min-width:60px;padding:0 var(--space-2);font-size:var(--text-xs)}#songBar.sbf-shrink .song-bar-play .play-stop-icon{width:14px;height:14px}#songBar.sbf-shrink .song-bar-icon-btn svg{width:12px;height:12px}#songBar.sbf-shrink .song-bar-grid-size #gridSizeSelectBox{min-width:max-content;text-align:center}#songBar.sbf-shrink .song-bar-meter #timeSigSelectBox{min-width:max-content;font-size:var(--text-2xs)}#songBar.sbf-shrink .song-bar-scale #scaleSelectBox,#songBar.sbf-shrink .song-bar-preset #presetSelectBox{padding:0 var(--space-8) 0 var(--space-3);font-size:var(--text-2xs);line-height:var(--song-bar-control-h);text-align:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}#songBar.sbf-shrink .song-bar-picker .presetNavButton,#songBar.sbf-shrink .song-bar-picker .presetRandomButton{width:16px}#songBar.sbf-shrink .song-bar-group--tempo{width:92px}#songBar.sbf-shrink .song-bar-tempo-value{font-size:var(--text-xs)}#songBar.sbf-shrink .song-bar-mode-btn{width:28px}#songBar.sbf-drop-cluster .song-bar-group--view-toggles .song-bar-mode-cluster{display:none}.footer{display:flex;align-items:center;justify-content:flex-end;width:100%;flex-shrink:0;padding:var(--space-4) var(--space-5);font-size:var(--text-xs);color:var(--chrome-3);box-sizing:border-box}.footer-left{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:var(--space-3)}.footer a,.footer span{color:var(--chrome-3);text-decoration:none}.footer a:hover{color:var(--chrome-4)}.footer-sep{color:var(--chrome-1);-webkit-user-select:none;user-select:none}@media only screen and (max-width:768px){.footer{display:none}}#iconRail{display:flex;flex-direction:row;width:100%;max-width:280px;min-width:0;height:44px;min-height:44px;padding:0;gap:var(--space-1);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;align-self:stretch;z-index:var(--z-rail)}#iconRail::-webkit-scrollbar{height:0;display:none}.rail-icon{display:flex;align-items:center;justify-content:center;position:relative;width:44px;height:44px;flex-shrink:0;background:transparent;border:none;border-bottom:2px solid transparent;color:var(--chrome-4);cursor:pointer;padding:0;transition:color var(--transition-fast),background-color var(--transition-fast),border-color var(--transition-fast)}@media(hover:hover){.rail-icon:hover{color:var(--chrome-4);background-color:var(--surface-tint-2)}.rail-icon.active:hover{color:color-mix(in srgb,var(--color-active),white 40%);background-color:transparent}}.rail-icon:active{color:var(--chrome-5)}.rail-icon.active{color:var(--color-active);border-bottom:3px solid var(--color-active)}.rail-icon.hidden{display:none}.rail-icon:focus-visible{outline:1px solid var(--color-active);outline-offset:-2px}.rail-icon svg{width:18px;height:18px;pointer-events:none}#panelContainer{width:280px;min-width:280px;flex:1;align-self:stretch;border-right:none;overflow-anchor:none}.slide-panel{display:none;width:100%;height:100%;background-color:var(--surface-panel);overflow-y:auto;overflow-x:hidden;flex-direction:column}.slide-panel.open{display:flex}@media(min-width:769px){@supports (content-visibility: hidden){#panelContainer{position:relative}.slide-panel{display:flex;position:absolute;top:0;right:0;bottom:0;left:0;content-visibility:hidden;contain-intrinsic-size:100% 100%}.slide-panel:not(.open){background-color:transparent}.slide-panel.open{content-visibility:visible;z-index:1}}}@media(min-width:769px){#iconRail{flex-direction:column;width:44px;min-width:44px;max-width:none;height:auto;min-height:0;overflow-x:hidden;overflow-y:auto}.rail-icon{border-bottom:none;border-left:2px solid transparent}.rail-icon.active{border-bottom:none;border-left:3px solid var(--color-active)}#panelContainer{display:none}body.control-panel-open #panelContainer{display:block;flex:0 0 280px;width:280px;min-width:280px;overflow:visible}body.control-panel-restoring #panelContainer{position:relative;background-color:var(--surface-panel)}body.control-panel-restoring #panelContainer>.slide-panel{display:none}body.control-panel-restoring #panelContainer:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:44px;height:44px;border:3px solid var(--chrome-border);border-top-color:var(--chrome-5);border-radius:var(--radius-full);opacity:0;animation:grid-loading-reveal var(--duration-slow) ease forwards,spin var(--duration-spin) linear infinite}}@media(min-width:769px)and (prefers-reduced-motion:reduce){body.control-panel-restoring #panelContainer:before{animation:grid-loading-reveal var(--duration-slow) ease forwards!important}}.panel-header{display:none}.panel-title{font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:var(--tracking-display);color:var(--chrome-3);margin:0}.panel-body{padding:0 var(--space-2) var(--space-5) 0;flex:1;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:var(--space-1)}#panelSequencer .panel-body{gap:var(--space-5)}#panelEdit .panel-body,#panelOptions .panel-body,#panelSongSettings .panel-body{gap:var(--space-6)}.panel-body>.sliderContainer:first-child{padding-top:0}.panel-body>.sliderContainer:first-child>.tabs:first-of-type{margin-top:0}.slide-panel .sliderItem{visibility:visible}#sidebarArea{display:flex;flex-direction:column;align-self:stretch}#sidebarInner{display:flex;flex-direction:row;flex:1;min-height:0}#transportControls{display:none}.panel-more-toggle{display:block;width:100%;padding:var(--space-3) 0;background:transparent;border:none;border-top:1px solid var(--surface-tint-2);color:var(--chrome-3);cursor:pointer;font-size:var(--text-xs);letter-spacing:var(--tracking-control);text-transform:uppercase;text-align:center;margin-top:var(--space-4)}.panel-more-toggle:hover{color:var(--chrome-4)}.panel-more-toggle:active{color:var(--chrome-5)}.panel-more-content{display:none}.panel-more-content.expanded{display:block}.slide-panel .sliderContainer{display:grid;grid-template-columns:repeat(2,1fr);width:100%;padding:var(--space-1) 0;height:auto;overflow:visible;opacity:1}.slide-panel .sliderContainer.filterSection{display:flex;flex-direction:column}.slide-panel .sliderContainer.collapsed{height:auto}.lfo-pwm-hint{font-size:var(--text-sm);color:var(--chrome-3);margin-left:var(--space-2)}#fxTab2Content>.lfo-pwm-hint{grid-column:1 / -1}@media only screen and (max-width:768px){#iconRail{position:fixed;bottom:0;left:0;right:0;width:100%;max-width:none;height:calc(44px + env(safe-area-inset-bottom));flex-direction:row;justify-content:space-around;border-bottom:none;border-top:1px solid var(--surface-border);box-shadow:none;background-color:var(--surface-panel);padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);z-index:var(--z-dropdown)}.rail-icon{width:auto;flex:1;height:44px;border-bottom:none;border-top:2px solid transparent}.rail-icon svg{width:22px;height:22px}.rail-icon.active{color:var(--color-active);border-bottom:none;border-top-color:var(--color-active)}#panelBackdrop{display:none;position:fixed;top:0;left:0;right:0;bottom:calc(44px + env(safe-area-inset-bottom));z-index:var(--z-panel);background:transparent;-webkit-tap-highlight-color:transparent}#panelBackdrop.active{display:block}#panelContainer{position:fixed;left:0;right:0;width:var(--panel-width-mobile);min-width:0;max-width:100vw;bottom:calc(44px + env(safe-area-inset-bottom));top:auto;z-index:calc(var(--z-panel) + 1)}.slide-panel{width:100%;height:auto;max-height:80vh;top:auto;bottom:0;transform:translateY(100%);border-top:1px solid var(--surface-tint-4);border-right:1px solid var(--surface-tint-4);border-left:1px solid var(--surface-tint-4);border-top-left-radius:var(--radius);border-top-right-radius:var(--radius);background-color:var(--surface-panel)}.slide-panel.open{transform:translateY(0)}#panelContainer{--sheet-handle-height: 24px}#panelContainer>.sheet-handle{padding-block-start:var(--space-3)}body:not(.control-panel-open) #panelContainer>.sheet-handle{display:none}.slide-panel{padding-top:var(--sheet-handle-height)}#panelContainer.sheet--sized .slide-panel{max-height:min(var(--sheet-height),calc(100dvh - 44px - env(safe-area-inset-bottom) - env(safe-area-inset-top)))}.panel-body{padding:var(--space-1) var(--space-3);overscroll-behavior:contain}.slide-panel .panel-body .section-title{margin-left:calc(var(--space-3) * -1);margin-right:calc(var(--space-3) * -1)}#sidebarArea{flex-direction:column;align-self:auto;width:100%;flex-shrink:0}#sidebarInner{display:contents}#transportControls{display:flex;flex-direction:column;align-items:center;width:97vw;margin:0 auto;padding:0 0 var(--space-3);gap:var(--space-4);background-color:transparent;border:none}html:not([data-simple-mode=on]) #transportControls{min-height:calc(40px + 2 * var(--control-height-lg) + 2 * var(--space-4) + var(--space-3))}#transportControls>*{width:100%}.transport-play-row{display:flex;gap:var(--space-4);align-items:center}#transportControls #playStopButton{margin:0;height:40px;flex:1;min-width:0;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-4);font-size:var(--text-lg);font-weight:700;letter-spacing:var(--tracking-body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.transport-play-row #midiRecordButton{flex:0 0 auto}.transport-row{display:flex;gap:var(--space-3);align-items:center}.transport-row .tempoCol{flex:1;min-width:0;transform:translateY(1px)}.transport-row .controlButton{flex:0 0 auto;min-width:0;height:30px;padding:0 var(--space-3);font-size:var(--text-xs);line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.transport-row #clearButton{width:var(--control-height-md);height:var(--control-height-md);padding:0;justify-content:center}.transport-row #clearButton .controlButton-label{display:none}.transport-row #clearButton svg{width:16px;height:16px}.transport-row .header-undo-redo{flex:0 0 auto;width:var(--control-height-md);height:var(--control-height-md);padding:0}.transport-row .controlButton:has(.tooltip){overflow:visible}.transport-row .controlButton>.tooltip,.transport-row .gridSizeSelectContainer>.tooltip{max-width:min(260px,calc(100vw - 16px));white-space:normal}.transport-row :is(.gridSizeSelectContainer,.timeSigSelectContainer){flex:0 0 auto;position:relative;display:flex;align-items:stretch}.transport-row :is(#gridSizeSelectBox,#timeSigSelectBox){padding:0 var(--space-8) 0 var(--space-3);height:var(--control-height-md);font-size:var(--text-sm);font-family:var(--font-mono);font-variant-numeric:tabular-nums}#transportControls .presetContainer{margin:0}.transport-play-row{order:1}.transport-row{order:2}.mobile-preset-row{order:3}}#errorMessage{color:var(--color-stop);text-align:center}.exportImportButton:disabled{border-color:var(--chrome-tab);color:var(--chrome-tab);cursor:not-allowed}.popover{position:fixed;background:var(--surface-popover);border:1px solid var(--popup-border);border-radius:var(--radius-md);box-shadow:var(--shadow-popover);font-family:inherit;font-size:var(--text-xs);color:var(--chrome-4);-webkit-user-select:none;user-select:none;animation:popover-in var(--duration-fast) var(--ease-out-quart)}@keyframes popover-in{0%{opacity:0;transform:translateY(var(--space-1))}to{opacity:1;transform:translateY(0)}}#gridArea{display:flex;flex-direction:column;align-items:center;flex:1;min-width:0;min-height:0;position:relative;outline:none}#gridArea #matrix{aspect-ratio:1 / 1;max-height:calc(100dvh - 244px)}#pageStrip{position:relative;display:flex;align-items:flex-start;padding:var(--space-6) 0 var(--space-9) 0;width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--surface-tint-2) transparent;touch-action:pan-x;container-type:inline-size;container-name:mixer-rail}#pageStrip::-webkit-scrollbar{height:4px}#pageStrip::-webkit-scrollbar-thumb{background:var(--surface-tint-2);border-radius:var(--radius-sm)}#pageThumbnails{display:flex;flex-direction:column;flex:0 0 auto;min-width:max-content;gap:var(--space-3)}.page-thumb{position:relative;flex-shrink:0;cursor:pointer;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:pan-x}.page-thumb>.strip-drag-handle{left:0;width:3px;z-index:2}.page-thumb>.strip-drag-handle:before{left:-4px;right:0}body:not(.mixer-single-track) .page-thumb>.strip-drag-handle+.page-thumb-canvas-wrap{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0;margin-left:var(--space-2)}.track-row.active .page-thumb>.strip-drag-handle{width:4px;opacity:1;filter:brightness(1.25)}.track-row.dragging .page-thumb>.strip-drag-handle{cursor:grabbing}@keyframes page-thumb-glow-out{0%{opacity:1}to{opacity:0}}.page-thumb--new:after{content:"";position:absolute;top:0;right:0;bottom:0;width:64px;border-radius:var(--radius-sm);pointer-events:none;box-shadow:0 0 3px color-mix(in srgb,var(--chrome-5),transparent 55%);animation:page-thumb-glow-out .5s linear both}.page-thumb-canvas-wrap{position:relative;width:64px;height:64px;border:var(--border-control) solid var(--strip-border);border-radius:var(--radius-sm);overflow:hidden;content-visibility:auto}.page-thumb:hover .page-thumb-canvas-wrap{border-color:var(--chrome-1)}.page-thumb:not(.active):hover .page-thumb-canvas-wrap:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:var(--border-control) solid var(--chrome-1);border-radius:var(--radius-sm);pointer-events:none;z-index:4}.page-thumb.active .page-thumb-canvas-wrap{border-color:var(--chrome-3)}.page-thumb.active .page-thumb-canvas-wrap:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:var(--border-control) solid var(--chrome-3);border-radius:var(--radius-sm);pointer-events:none;z-index:4}.page-thumb.dragging .page-thumb-canvas-wrap{border:2px solid var(--chrome-3)}.page-thumb.dragging .page-thumb-canvas{opacity:.4}.page-thumb.drag-insert-before .page-thumb-canvas-wrap{border-left:4px solid var(--color-play-border)}.page-thumb.drag-insert-after .page-thumb-canvas-wrap{border-right:4px solid var(--color-play-border)}.drag-duplicate .page-thumb.drag-insert-before .page-thumb-canvas-wrap:after,.drag-duplicate .page-thumb.drag-insert-after .page-thumb-canvas-wrap:after{content:"+";position:absolute;top:-6px;font-size:var(--text-xs);font-weight:700;color:var(--color-play-border);pointer-events:none;z-index:1}.drag-duplicate .page-thumb.drag-insert-before .page-thumb-canvas-wrap:after{left:-4px}.drag-duplicate .page-thumb.drag-insert-after .page-thumb-canvas-wrap:after{right:-4px}.page-thumb-canvas{width:100%;height:100%;image-rendering:pixelated;display:block;opacity:.7}.page-repeat-countdown{position:absolute;top:var(--space-1);left:var(--space-1);font-size:var(--text-xs);line-height:1;color:var(--chrome-3);pointer-events:none;display:none}.page-thumb.playing .page-repeat-countdown.visible{display:block;z-index:1}.page-jump-badge{position:absolute;top:var(--space-1);right:var(--space-1);font-size:var(--text-xs);background:transparent;color:var(--chrome-3);padding:var(--space-1);border-radius:var(--radius);pointer-events:none;line-height:1;z-index:1}.page-thumb-repeat{box-sizing:border-box;flex:0 1 auto;height:16px;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);padding:0 var(--space-1);font-size:var(--text-xs);font-family:inherit;line-height:1;color:var(--chrome-3);cursor:pointer;border-radius:var(--radius-sm);transition:color var(--transition-fast),background var(--transition-fast)}.page-thumb-repeat:hover{color:var(--chrome-5);background:var(--surface-tint-3)}.page-repeat-dropdown{z-index:var(--z-overlay);padding:var(--space-4) var(--space-5);min-width:120px;display:flex;flex-direction:column;gap:var(--space-5)}.page-repeat-dropdown-label{display:flex;justify-content:space-between;align-items:center;font-size:var(--text-xs);color:var(--chrome-3)}.page-repeat-dropdown-value{font-variant-numeric:tabular-nums;min-width:20px;text-align:right}.page-repeat-slider-row{display:flex;align-items:center;gap:var(--space-3)}.page-repeat-dropdown input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:20px;background:transparent;cursor:pointer;margin:0}.page-repeat-dropdown input[type=range]::-webkit-slider-runnable-track{width:100%;height:2px;background:linear-gradient(to right,var(--color-active) var(--pct, 50%),var(--slider-track) var(--pct, 50%));border-radius:var(--radius-sm)}.page-repeat-dropdown input[type=range]::-moz-range-track{width:100%;height:2px;background:var(--slider-track);border-radius:var(--radius-sm)}.page-repeat-dropdown input[type=range]::-moz-range-progress{height:2px;background:var(--color-active);border-radius:var(--radius-sm)}.page-jump-row{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}.page-jump-row-label{color:var(--chrome-3);font-size:var(--text-xs);white-space:nowrap}.page-jump-select{flex:1;min-width:0;background:var(--surface-tint-2);color:var(--chrome-4);border:1px solid var(--chrome-2);border-radius:var(--radius);padding:var(--space-1) var(--space-2);font-size:var(--text-xs);cursor:pointer}.page-jump-select:focus{border-color:var(--color-active)}.page-jump-count-select{width:50px;background:var(--surface-tint-2);color:var(--chrome-4);border:1px solid var(--chrome-2);border-radius:var(--radius);padding:var(--space-1) var(--space-2);font-size:var(--text-xs);cursor:pointer}.page-jump-count-select:focus{border-color:var(--color-active)}.page-thumb-actions{position:absolute;top:0;left:0;right:0;display:flex;flex-direction:row;align-items:center;justify-content:space-around;gap:0;padding:var(--space-1) 0;background:var(--overlay-mid);z-index:5;white-space:nowrap;opacity:0;pointer-events:none}@media(hover:hover){.page-thumb:hover .page-thumb-actions{opacity:1;pointer-events:auto}}.page-thumb.show-actions .page-thumb-actions,.page-thumb:focus-within .page-thumb-actions{opacity:1;pointer-events:auto}.page-thumb-delete,.page-thumb-duplicate{box-sizing:border-box;flex:0 0 auto;width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;padding:0;background:none;border:none;color:var(--chrome-4);cursor:pointer;font-size:var(--text-xs);font-family:inherit;line-height:1;border-radius:var(--radius-sm);transition:color var(--transition-fast),background var(--transition-fast)}.page-thumb-delete{color:color-mix(in srgb,var(--color-danger) 75%,transparent)}.page-thumb-delete svg{stroke-width:3.5}.page-thumb-delete:hover{color:var(--color-danger-active);background:var(--surface-tint-3)}.page-thumb-delete.confirm-pending{background:var(--color-danger);color:var(--chrome-selected)}.page-thumb-delete.confirm-pending:hover{background:var(--color-danger-deep);color:var(--chrome-selected)}.page-thumb-duplicate:hover{color:var(--chrome-5);background:var(--surface-tint-3)}.page-thumb-repeat,.page-thumb-duplicate,.page-thumb-delete{position:relative}.page-thumb-repeat:before,.page-thumb-duplicate:before,.page-thumb-delete:before{content:"";position:absolute;top:-2px;right:0;bottom:-6px;left:0}.page-add-btn{width:64px;height:64px;flex-shrink:0;background:transparent;border:1px dashed var(--strip-border);border-radius:var(--radius-sm);color:var(--chrome-3);font-size:var(--text-lg);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color var(--transition-fast),color var(--transition-fast)}.page-add-btn:hover{border-color:var(--chrome-3);color:var(--chrome-4)}.page-add-btn:active:not(:disabled){border-color:var(--chrome-4);color:var(--chrome-5)}.page-add-btn:disabled{opacity:var(--opacity-disabled);cursor:not-allowed;pointer-events:none}.page-thumb-clone{opacity:.8;border:1px solid var(--chrome-1)}@media only screen and (max-width:768px){#gridArea #matrix{aspect-ratio:1 / 1;flex:0 0 auto;width:97vw;max-width:97vw;min-width:280px;max-height:max(48.5vw,min(97vw,calc(100svh - 390px)))}#pageStrip{flex:0 0 auto;min-height:0;min-width:0;max-width:100%;padding:var(--space-6) var(--space-1) var(--space-5);overflow:visible;touch-action:pan-y}#pageStrip #pageThumbnails{flex:1 1 auto;min-width:0;min-height:0;padding-top:calc(var(--space-4) * 2);margin-top:calc(-1 * var(--space-4));padding-bottom:var(--space-2);margin-bottom:calc(-1 * var(--space-2));overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;touch-action:pan-x pan-y}body.mobile-rail-mixer:not(.mixer-horizontal) #pageStrip #mixerView{flex:1 1 auto;min-width:0;min-height:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;touch-action:pan-x pan-y}.page-thumb{touch-action:pan-x pan-y}body.mobile-rail-mixer .track-row .page-thumb-canvas-wrap,body.mobile-rail-mixer .track-row .page-add-btn{display:none}@media(hover:none){.page-thumb-delete,.page-thumb-duplicate,.page-thumb-repeat{padding:var(--space-2) var(--space-2)}}}@media(hover:none)and (min-width:769px){#pageStrip,.page-thumb{touch-action:pan-x pan-y}}.mini-playhead{position:absolute;top:0;left:0;height:100%;width:1px;background:var(--grid-ring);pointer-events:none;z-index:2;will-change:transform}.fs-ghost-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--z-rail);pointer-events:none;transition:opacity var(--transition-slow)}.fs-ghost-layer--out{opacity:0}.fs-ghost-note{position:fixed;box-sizing:border-box;border:1px dashed var(--color-active);border-radius:var(--radius-sm);background:color-mix(in srgb,var(--color-active) 22%,transparent);animation:fs-ghost-in var(--duration-slow) var(--ease-out-expo) backwards;transition:opacity var(--transition-slow)}@keyframes fs-ghost-in{0%{opacity:0;scale:.6}}.fs-ghost-layer--rest .fs-ghost-note{opacity:.55}.fs-ghost-cursor{position:fixed;top:0;left:0;opacity:0;margin:-3px 0 0 -5px;transform-origin:5px 3px}.fs-ghost-cursor path{fill:var(--color-active);stroke:var(--ink-dark);stroke-width:1.5;stroke-linejoin:round}.fs-ghost-caption--pending{visibility:hidden;animation:none}#playStopButton.fs-play-pulse{animation:fs-play-pulse 1.8s ease-in-out infinite}@keyframes fs-play-pulse{0%,to{outline:2px solid color-mix(in srgb,var(--color-play) 0%,transparent);outline-offset:0}50%{outline:2px solid color-mix(in srgb,var(--color-play) 70%,transparent);outline-offset:4px}}@media(prefers-reduced-motion:reduce){#playStopButton.fs-play-pulse{animation:none;outline:2px solid color-mix(in srgb,var(--color-play) 70%,transparent);outline-offset:3px}}.fs-hint{--fs-hint-bg: var(--surface-dark);--fs-hint-edge: color-mix(in srgb, var(--color-active) 45%, var(--popup-border));--fs-hint-dot: 6px;--fs-arrow-at: 50%;position:relative;display:flex;flex-direction:column;gap:var(--space-1);width:max-content;max-width:min(288px,calc(100vw - 2 * var(--space-4)));box-sizing:border-box;padding:var(--space-4) var(--space-5);background:var(--fs-hint-bg);border:1px solid var(--fs-hint-edge);border-radius:var(--radius-md);box-shadow:var(--shadow-popover);pointer-events:none;animation:fs-hint-in var(--duration-slow) var(--ease-out-expo) backwards}@keyframes fs-hint-in{0%{opacity:0;translate:0 12px}}.fs-ghost-caption{animation-name:fs-ghost-caption-in}@keyframes fs-ghost-caption-in{0%{translate:0 12px}}.fs-hint-title{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-sm);font-weight:600;letter-spacing:var(--tracking-tight);color:var(--main-font-color)}.fs-hint-title:before{content:"";flex-shrink:0;width:var(--fs-hint-dot);height:var(--fs-hint-dot);border-radius:var(--radius-full);background:var(--color-active)}.fs-hint-body{padding-left:calc(var(--fs-hint-dot) + var(--space-3));font-size:var(--text-xs);line-height:1.45;color:var(--chrome-4)}.fs-hint:after{content:"";position:absolute;width:10px;height:10px;box-sizing:border-box;background:var(--fs-hint-bg);border:1px solid transparent}.fs-hint[data-arrow=none]:after,.fs-hint:not([data-arrow]):after{display:none}.fs-hint[data-arrow=top]:after{top:-6px;left:var(--fs-arrow-at);border-top-color:var(--fs-hint-edge);border-left-color:var(--fs-hint-edge);transform:translate(-50%) rotate(45deg)}.fs-hint[data-arrow=bottom]:after{bottom:-6px;left:var(--fs-arrow-at);border-bottom-color:var(--fs-hint-edge);border-right-color:var(--fs-hint-edge);transform:translate(-50%) rotate(45deg)}.fs-hint[data-arrow=left]:after{left:-6px;top:var(--fs-arrow-at);border-bottom-color:var(--fs-hint-edge);border-left-color:var(--fs-hint-edge);transform:translateY(-50%) rotate(45deg)}.fs-hint--floating{position:fixed;z-index:calc(var(--z-rail) + 1)}.fs-hint--inline{max-width:100%;margin-top:var(--space-5);box-shadow:none}.fs-hint--interactive{padding-right:var(--space-8);pointer-events:auto}.fs-hint--interactive.fs-hint--footer{padding-right:var(--space-5)}.fs-hint--docked{cursor:pointer}.fs-hint--docked .fs-hint-actions{cursor:auto}.fs-hint-actions{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);margin-top:var(--space-3);padding-left:calc(var(--fs-hint-dot) + var(--space-3))}.fs-hint-close{padding:var(--space-2) var(--space-5);background:transparent;border:none;border-radius:var(--radius);font-size:var(--text-xs);font-weight:600;color:var(--color-active);cursor:pointer;transition:background-color var(--transition-fast)}.fs-hint-close:hover{background-color:var(--surface-tint-2)}@media(hover:none){.fs-hint-close:hover{background-color:transparent}}.fs-hint-close:focus-visible{outline:2px solid var(--main-font-color);outline-offset:2px}.fs-hint-stop{padding:0;background:none;border:none;font-size:var(--text-2xs);color:color-mix(in srgb,var(--chrome-3),var(--chrome-2));text-align:right;cursor:pointer;transition:color var(--transition-fast)}.fs-hint-stop:hover,.fs-hint-stop:focus-visible{color:var(--main-font-color);text-decoration:underline}.fs-hint-dismiss{position:absolute;top:var(--space-3);right:var(--space-3);display:grid;place-items:center;padding:var(--space-1);background:none;border:none;border-radius:var(--radius);color:var(--chrome-3);cursor:pointer;transition:color var(--transition-fast),background-color var(--transition-fast)}.fs-hint-dismiss:hover,.fs-hint-dismiss:focus-visible{color:var(--main-font-color);background:var(--surface-tint-3)}.fs-step-glow{--fs-glow-ring-rest: 1.5px;--fs-glow-ring-peak: 2px;--fs-glow-alpha-rest: 65%;--fs-glow-alpha-peak: 90%;--fs-glow-bloom-rest: 6px;--fs-glow-bloom-peak: 16px;--fs-glow-bloom-alpha-rest: 12%;--fs-glow-bloom-alpha-peak: 30%;animation:fs-step-breathe 4.8s ease-in-out infinite}.rail-icon.fs-step-glow,.section-title.fs-step-glow,.waveformSelectContainer.fs-step-glow,.presetContainer.fs-step-glow,.page-add-btn.fs-step-glow,.mixer-add-track-btn.fs-step-glow{border-radius:var(--radius)}.page-add-btn.fs-step-glow,.mixer-add-track-btn.fs-step-glow{--fs-glow-ring-peak: 2px;--fs-glow-alpha-rest: 80%;--fs-glow-alpha-peak: 100%;--fs-glow-bloom-rest: 8px;--fs-glow-bloom-peak: 22px;--fs-glow-bloom-alpha-rest: 22%;--fs-glow-bloom-alpha-peak: 45%;border-style:solid;border-color:var(--color-active);color:var(--color-active);animation-duration:2.4s}.header-menu-tile.fs-step-glow{--fs-glow-bloom-peak: 22px;--fs-glow-bloom-alpha-rest: 18%;--fs-glow-bloom-alpha-peak: 35%;border-color:var(--color-active);border-radius:var(--radius-lg)}@keyframes fs-step-breathe{0%,to{box-shadow:inset 0 0 0 var(--fs-glow-ring-rest) color-mix(in srgb,var(--color-active) var(--fs-glow-alpha-rest),transparent),inset 0 0 var(--fs-glow-bloom-rest) 0 color-mix(in srgb,var(--color-active) var(--fs-glow-bloom-alpha-rest),transparent)}50%{box-shadow:inset 0 0 0 var(--fs-glow-ring-peak) color-mix(in srgb,var(--color-active) var(--fs-glow-alpha-peak),transparent),inset 0 0 var(--fs-glow-bloom-peak) 0 color-mix(in srgb,var(--color-active) var(--fs-glow-bloom-alpha-peak),transparent)}}#matrix.fs-step-glow{outline:1.5px solid color-mix(in srgb,var(--color-active) 60%,transparent);outline-offset:2px;border-radius:0;animation-name:fs-grid-breathe}@keyframes fs-grid-breathe{0%,to{outline-color:color-mix(in srgb,var(--color-active) 60%,transparent)}50%{outline-color:color-mix(in srgb,var(--color-active) 95%,transparent)}}.grooveSliderGrid.fs-step-glow,.grooveSliderGrid.fs-groove-settling{padding:var(--space-4)}.grooveSliderGrid.fs-step-glow{outline:1.5px solid color-mix(in srgb,var(--color-active) 60%,transparent);outline-offset:-1.5px;border-radius:var(--radius);animation-name:fs-grid-breathe}@media(prefers-reduced-motion:reduce){#matrix.fs-step-glow,.grooveSliderGrid.fs-step-glow{animation:none}.fs-step-glow:not(#matrix,.grooveSliderGrid){animation:none;box-shadow:inset 0 0 0 var(--fs-glow-ring-peak) color-mix(in srgb,var(--color-active) var(--fs-glow-alpha-peak),transparent),inset 0 0 var(--fs-glow-bloom-peak) 0 color-mix(in srgb,var(--color-active) var(--fs-glow-bloom-alpha-peak),transparent)}}#header.fs-tour-offer .header-dash{visibility:hidden}.fs-tour-banner{position:absolute;top:0;bottom:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.fs-tour-banner[hidden]{display:none}.fs-tour-banner-pill{display:flex;align-items:center;flex-shrink:0;gap:var(--space-1);height:var(--header-song-h);padding:0 var(--space-1);background:var(--surface-tint-1);border:1px solid color-mix(in srgb,var(--color-active) 45%,transparent);border-radius:var(--radius-pill);pointer-events:auto;animation:fs-tour-banner-in var(--duration-slow) var(--ease-out-expo) backwards;transition:opacity var(--transition-fast)}.fs-tour-banner--out{opacity:0;transition:opacity var(--transition-fast)}@keyframes fs-tour-banner-in{0%{opacity:0;translate:0 -6px}}.fs-tour-banner-cta{display:flex;align-items:center;gap:var(--space-3);height:100%;padding:0 var(--space-3) 0 var(--space-4);border:none;background:transparent;border-radius:var(--radius-pill);font-size:var(--text-sm);font-weight:600;letter-spacing:var(--tracking-body);white-space:nowrap;color:var(--chrome-4);cursor:pointer;transition:color var(--transition-fast),background-color var(--transition-fast)}.fs-tour-banner-cta svg{width:var(--icon-sm);height:var(--icon-sm);color:var(--color-active);flex-shrink:0}.fs-tour-banner-cta:hover,.fs-tour-banner-cta:focus-visible{color:var(--chrome-5);background:var(--surface-tint-3)}.fs-tour-banner-short,.fs-tour-banner--compact .fs-tour-banner-full{display:none}.fs-tour-banner--compact .fs-tour-banner-short{display:inline}.fs-tour-banner-dismiss{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;background:transparent;border-radius:var(--radius-full);color:var(--chrome-3);cursor:pointer;flex-shrink:0;transition:color var(--transition-fast),background-color var(--transition-fast)}.fs-tour-banner-dismiss svg{width:var(--icon-xs);height:var(--icon-xs)}.fs-tour-banner-dismiss:hover,.fs-tour-banner-dismiss:focus-visible{color:var(--chrome-4);background:var(--surface-tint-3)}#helpButton.fs-tour-hint,#headerMenuButton.fs-tour-hint{color:var(--color-active);outline:var(--border-control) solid color-mix(in srgb,var(--color-active) 80%,transparent);outline-offset:var(--space-1);transition:color var(--transition-fast),outline-color var(--transition-fast)}@media(prefers-reduced-motion:reduce){.fs-tour-banner-pill{animation:none}}:root{--sheet-handle-height: 40px}.sheet-handle{display:none}@media(max-width:768px){.sheet-handle{position:absolute;inset-block-start:0;inset-inline:25%;display:flex;justify-content:center;align-items:flex-start;height:var(--sheet-handle-height);padding-block-start:var(--space-3);cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent}.sheet-handle:before{content:"";width:36px;height:4px;border-radius:var(--radius-pill);background:var(--chrome-3);opacity:.6;transition:opacity var(--transition-fast)}.sheet--dragging .sheet-handle{cursor:grabbing}.sheet--dragging .sheet-handle:before{opacity:1}.sheet--dragging{transition:none;user-select:none;-webkit-user-select:none}.sheet--leaving{translate:0 100%;transition:translate var(--duration-reveal) ease-in;pointer-events:none}}.section-title--help{display:flex;align-items:center}.section-title--help>span{flex:1}.section-help-btn{width:16px;height:16px;padding:0;margin-left:var(--space-3);flex-shrink:0;border-radius:var(--radius-full);border:1px solid var(--chrome-1);background:transparent;color:var(--chrome-3);font-size:var(--text-xs);font-weight:600;line-height:1;cursor:pointer;transition:color var(--transition-fast),border-color var(--transition-fast)}.section-help-btn{position:relative}.section-help-btn:before{content:"";position:absolute;inset-block:-5px;inset-inline:-6px -4px}.section-help-btn:hover{color:var(--chrome-4);border-color:var(--chrome-3)}.section-help-btn:active{color:var(--chrome-5);border-color:var(--chrome-4)}@media(hover:none){.section-help-btn:hover{color:var(--chrome-3);border-color:var(--chrome-1)}}.section-help-popup{max-width:260px;max-height:calc(100svh - 16px);overflow-y:auto;padding:var(--space-5) var(--space-6);font-size:var(--text-sm);font-weight:400;text-transform:none;letter-spacing:var(--tracking-body);color:var(--main-font-color);line-height:1.45;z-index:var(--z-overlay);-webkit-user-select:text;user-select:text}.section-help-line+.section-help-line{margin-top:var(--space-7)}.song-info-popover{width:min(320px,calc(100vw - 16px));max-height:calc(100svh - 16px);overflow-y:auto;padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-6);font-size:var(--text-sm);font-weight:400;text-transform:none;letter-spacing:var(--tracking-body);color:var(--main-font-color);line-height:1.45;z-index:var(--z-overlay);-webkit-user-select:text;user-select:text}.song-info-popover-head{display:flex;flex-direction:column;gap:var(--space-2)}.song-info-popover-title{margin:0;font-size:var(--text-lg);font-weight:600;line-height:1.25;color:var(--color-active);overflow-wrap:anywhere}.song-info-popover-author,.song-info-popover-label{display:flex;align-items:center;gap:var(--space-2);margin:0;color:var(--chrome-3)}.song-info-popover-author>span,.song-info-popover-label>span{min-width:0;overflow-wrap:anywhere}.song-info-popover-icon{flex:none;width:var(--icon-sm);height:var(--icon-sm)}.song-info-popover-section{display:flex;flex-direction:column;gap:var(--space-3);padding-top:var(--space-5);border-top:var(--border-control) solid var(--surface-tint-2)}.song-info-popover-label{font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:var(--tracking-label)}.song-info-popover-notes{margin:0;padding:var(--space-4) var(--space-5);background:var(--surface-tint-1);border-radius:var(--radius);color:var(--chrome-5);white-space:pre-line;overflow-wrap:anywhere}.song-info-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3);margin:0}.song-info-detail{display:flex;flex-direction:column;gap:var(--space-1);min-width:0;padding:var(--space-3) var(--space-4);background:var(--surface-tint-1);border-radius:var(--radius)}.song-info-detail--wide{grid-column:1 / -1}.song-info-detail>dt{font-size:var(--text-xs);color:var(--chrome-3)}.song-info-detail>dd{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-1);margin:0;color:var(--chrome-5);overflow-wrap:anywhere}.song-info-detail-link{padding:0;border:none;background:none;font:inherit;text-align:start;color:var(--color-active);text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere;cursor:pointer}.song-info-detail-link:hover{color:var(--color-active-bright)}.undo-ledger{width:320px;max-width:calc(100vw - var(--space-9));display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:var(--space-2) 0;z-index:var(--z-dropdown);white-space:nowrap;text-align:left;pointer-events:auto;transform:translate(-50%)}.popover.undo-ledger{animation-name:undo-ledger-in}@keyframes undo-ledger-in{0%{opacity:0;transform:translate(-50%) translateY(var(--space-1))}to{opacity:1;transform:translate(-50%) translateY(0)}}.popover.undo-ledger--leaving{animation:undo-ledger-out var(--duration-fast) var(--ease-out-quart) forwards;pointer-events:none}@keyframes undo-ledger-out{0%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(calc(-1 * var(--space-1)))}}.undo-ledger-col{min-width:0;padding:0 var(--space-2)}.undo-ledger-col+.undo-ledger-col{border-left:var(--border-control) solid var(--surface-border)}.undo-ledger-head{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-3) var(--space-2);font-size:var(--text-2xs);font-weight:700;letter-spacing:var(--tracking-control);text-transform:uppercase;color:var(--chrome-3)}.undo-ledger-head svg{flex:none}.undo-ledger-name{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}.undo-ledger-kbd{flex:none;padding:0 var(--space-1);font-family:var(--font-mono);font-size:var(--text-3xs);font-weight:400;letter-spacing:0;text-transform:none;color:var(--chrome-3);border:var(--border-control) solid var(--surface-border);border-radius:var(--radius-sm)}.undo-ledger-list{list-style:none;margin:0;padding:0}.undo-ledger-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius);font-size:var(--text-xs);color:var(--chrome-4)}.undo-ledger-row:before{content:"";flex:none;width:var(--space-2);height:var(--space-2);border-radius:var(--radius-full);border:var(--border-control) solid var(--chrome-2)}.undo-ledger-row--next{color:var(--chrome-5);font-weight:500}.undo-ledger-row--next:before{background:var(--color-active);border-color:var(--color-active)}.undo-ledger-label{min-width:0;overflow:hidden;text-overflow:ellipsis}.undo-ledger-row--moved{position:relative;transition:transform var(--duration-slow) var(--ease-out-expo);animation:undo-ledger-land calc(var(--duration-slow) * 2) var(--ease-out-quart)}@keyframes undo-ledger-land{0%{background:color-mix(in srgb,var(--color-active) 25%,transparent)}to{background:transparent}}.undo-ledger-empty{padding:var(--space-2) var(--space-3);font-size:var(--text-xs);font-style:italic;color:var(--chrome-3)}.undo-ledger-more{padding:var(--space-1) var(--space-3) 0;font-family:var(--font-mono);font-size:var(--text-2xs);color:var(--chrome-3)}@media(prefers-reduced-motion:reduce){.popover.undo-ledger,.popover.undo-ledger--leaving{animation:none}.undo-ledger-row--moved{transition:none;animation:none}}html[lang=ar]{--text-xs: 12.5px;--text-sm: 14.5px;--text-md: 15.5px;--text-base: 16.5px;--text-lg: 22px;--text-title: 24px;line-height:1.4}[dir=rtl] .header-items,[dir=rtl] .header-right,[dir=rtl] .gen-toggle-row{flex-direction:row-reverse}[dir=rtl] .section-title{text-align:right}[dir=rtl] .panel-header,[dir=rtl] .tabs{flex-direction:row-reverse}[dir=rtl] .options-stacked{text-align:right}[dir=rtl] .utilButtons{flex-direction:row-reverse}[dir=rtl] #matrix{direction:ltr}[dir=rtl] #iconRail{flex-direction:row-reverse}@media only screen and (max-width:768px){[dir=rtl] .mobile-preset-row{flex-direction:row-reverse}}#automationOverlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:5}:root[data-performance-mode=on] input[type=range],:root[data-performance-mode=on] input[type=range]:focus,:root[data-performance-mode=on] input[type=range]:active,:root[data-performance-mode=on] input[type=range]::-moz-range-thumb,:root[data-performance-mode=on] input[type=range]::-moz-range-thumb:focus,:root[data-performance-mode=on] input[type=range]::-webkit-slider-thumb,:root[data-performance-mode=on] .mixer-strip-h .strip-fader-h input[type=range]:focus,:root[data-performance-mode=on] .led-seg.lit,:root[data-performance-mode=on] .led-seg.peak,:root[data-performance-mode=on] .gridButton.hover,:root[data-performance-mode=on] .gridButton.active,:root[data-performance-mode=on] .gridButton.note-head.playing,:root[data-performance-mode=on] .gridButton.note-tail.playing,:root[data-performance-mode=on] .note-glow{box-shadow:none!important;text-shadow:none!important}:root[data-performance-mode=on] #matrix .gridButton.playing{border-width:1px;--perf-ring-l: 2px;--perf-ring-r: 2px;box-shadow:inset var(--perf-ring-l) 0 0 0 var(--glow-color, yellow),inset calc(-1 * var(--perf-ring-r)) 0 0 0 var(--glow-color, yellow),inset 0 2px 0 0 var(--glow-color, yellow),inset 0 -2px 0 0 var(--glow-color, yellow)!important}:root[data-performance-mode=on] #matrix .gridButton.active.note-head.playing{--perf-ring-r: 0px}:root[data-performance-mode=on] #matrix .gridButton.active.note-body.playing{--perf-ring-l: 0px;--perf-ring-r: 0px}:root[data-performance-mode=on] #matrix .gridButton.active.note-tail.playing{--perf-ring-l: 0px}:root[data-performance-mode=on] .modal-shell-overlay{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--overlay)}:root[data-performance-mode=on] :where(:not(.page-thumb--new,.simple-pop,.simple-shrink,.fs-play-pulse,.fs-step-glow,.gi-spotlight-ring)),:root[data-performance-mode=on] :where(:not(.page-thumb--new,.simple-pop,.simple-shrink,.fs-play-pulse,.fs-step-glow,.gi-spotlight-ring)):before,:root[data-performance-mode=on] :where(:not(.page-thumb--new,.simple-pop,.simple-shrink,.fs-play-pulse,.fs-step-glow,.gi-spotlight-ring)):after{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important}:root[data-performance-mode=on] #loading-spinner,:root[data-performance-mode=on] .spinner,:root[data-performance-mode=on] .grid-loading-spinner,:root[data-performance-mode=on] .featured-spinner,:root[data-performance-mode=on] .song-library-loading{animation-duration:.8s!important;animation-iteration-count:infinite!important}:root[data-performance-mode=on] body.control-panel-restoring #panelContainer:before{animation-duration:var(--duration-slow),var(--duration-spin)!important;animation-iteration-count:1,infinite!important}:root[data-performance-mode=on] .midi-record-btn.midi-armed svg,:root[data-performance-mode=on] .midi-learn-active,:root[data-performance-mode=on] .automation-record-btn.automation-record-recording,:root[data-performance-mode=on] .admin-btn-record.recording:first-letter{animation-duration:1s!important;animation-iteration-count:infinite!important}:root[data-simple-mode=off] #simpleModeToolbar,:root[data-simple-mode=off] .simple-side-rail{display:none!important}:root[data-simple-mode=off] .simple-only-row{display:none!important}#pianoKeyboard{--piano-keyboard-width: 60px;--black-key-width: 60%;width:var(--piano-keyboard-width);flex-shrink:0;display:grid;grid-auto-rows:1fr;background:var(--background-color);border-right:1px solid var(--surface-border);-webkit-user-select:none;user-select:none;overflow:hidden;transition:width var(--transition-fast)}#gridArea:not(.piano-keyboard-on) #pianoKeyboard{display:none}#pianoKeyboard[data-drum-track=true]{width:0;border-right:0}#pianoKeyboard .piano-key{position:relative;background:linear-gradient(90deg,color-mix(in srgb,var(--background-color),white 62%),color-mix(in srgb,var(--background-color),white 76%));color:var(--chrome-1);font:var(--text-3xs)/1 var(--font-mono);letter-spacing:var(--tracking-tight);text-align:left;padding:0 var(--space-3);display:flex;align-items:center;justify-content:flex-start;margin:0;border:0;cursor:pointer;overflow:hidden;white-space:nowrap;-moz-appearance:none;appearance:none;-webkit-appearance:none;touch-action:none;z-index:0;transition:background var(--transition-fast),color var(--transition-fast)}#pianoKeyboard .piano-key-label{position:relative;z-index:2}#pianoKeyboard .piano-key:hover:not([disabled]){background:linear-gradient(90deg,color-mix(in srgb,var(--background-color),white 70%),color-mix(in srgb,var(--background-color),white 84%))}#pianoKeyboard .piano-key[disabled]{cursor:default;opacity:var(--opacity-disabled)}#pianoKeyboard .piano-key[data-key-type=accidental]:before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--black-key-width);background:linear-gradient(180deg,color-mix(in srgb,var(--background-color),black 72%),color-mix(in srgb,var(--background-color),black 88%));border-radius:0 3px 3px 0;z-index:1;pointer-events:none;transition:background var(--transition-fast)}#pianoKeyboard .piano-key[data-key-type=accidental]:hover:not([disabled]):before{background:linear-gradient(180deg,color-mix(in srgb,var(--background-color),black 62%),color-mix(in srgb,var(--background-color),black 80%))}#pianoKeyboard .piano-key[data-key-type=accidental]{color:var(--chrome-5)}#pianoKeyboard .piano-key[data-key-type=accidental]:after{content:"";position:absolute;left:var(--black-key-width);right:0;top:50%;height:1px;margin-top:-.5px;background:var(--background-color);pointer-events:none}#pianoKeyboard .piano-key[data-natural-seam=below]:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--background-color);pointer-events:none}#pianoKeyboard .piano-key[data-root=true]{font-weight:600}#pianoKeyboard .piano-key[data-key-type=natural][data-root=true]{box-shadow:inset 2px 0 0 var(--color-active)}#pianoKeyboard .piano-key[data-key-type=accidental][data-root=true]:before{box-shadow:inset 2px 0 0 var(--color-active)}#pianoKeyboard .piano-key[data-key-type=natural].piano-key-sounding{background-image:linear-gradient(var(--piano-sounding-natural),var(--piano-sounding-natural)),linear-gradient(90deg,color-mix(in srgb,var(--background-color),white 62%),color-mix(in srgb,var(--background-color),white 76%))}#pianoKeyboard .piano-key[data-key-type=accidental].piano-key-sounding:before{background-image:linear-gradient(var(--piano-sounding-accidental),var(--piano-sounding-accidental)),linear-gradient(180deg,color-mix(in srgb,var(--background-color),black 72%),color-mix(in srgb,var(--background-color),black 88%))}#pianoKeyboard .piano-key:focus-visible{outline:2px solid var(--color-active);outline-offset:-2px}#pianoKeyboard[data-rows="8"] .piano-key{font-size:var(--text-md);padding:0 var(--space-4)}#pianoKeyboard[data-rows="16"] .piano-key{font-size:var(--text-xs);padding:0 var(--space-4)}#pianoKeyboard[data-rows="64"] .piano-key{font-size:7.5px;padding:0 var(--space-2);letter-spacing:0}@media(max-width:768px){#pianoKeyboard{--piano-keyboard-width: 44px;--black-key-width: 50%}#pianoKeyboard .piano-key{font-size:8.5px;padding:0 var(--space-2)}#pianoKeyboard[data-rows="8"] .piano-key{font-size:var(--text-xs);padding:0 var(--space-3)}#pianoKeyboard[data-rows="16"] .piano-key{font-size:var(--text-3xs);padding:0 var(--space-2)}}.toast{--toast-accent: var(--color-active);--toast-edge: color-mix(in srgb, var(--toast-accent) 45%, var(--popup-border));position:fixed;left:50%;bottom:max(16px,env(safe-area-inset-bottom));transform:translate(-50%,12px);z-index:var(--z-fullscreen);box-sizing:border-box;padding:var(--space-4) var(--space-4) var(--space-4) var(--space-5);border:1px solid var(--toast-edge);border-radius:var(--radius-md);background:var(--surface-dark);box-shadow:var(--shadow-popover);color:var(--main-font-color);font-size:var(--text-sm);line-height:1.4;max-width:min(90vw,420px);display:flex;gap:var(--space-4);align-items:center;overflow:hidden;opacity:0;transition:opacity var(--duration-slow) var(--ease-out-expo),transform var(--duration-slow) var(--ease-out-expo)}.toast--error{--toast-accent: var(--color-danger);--toast-edge: color-mix(in srgb, var(--color-danger) 60%, var(--popup-border))}.toast--visible{opacity:1;transform:translate(-50%)}.toast--instant{transform:translate(-50%);transition:none}.toast-action,.app-banner-action{padding:var(--space-2) var(--space-4);background:transparent;border:0;border-radius:var(--radius);color:var(--color-active);font:inherit;font-size:var(--text-xs);font-weight:600;cursor:pointer;white-space:nowrap;transition:background-color var(--transition-fast)}.toast-action:hover,.app-banner-action:hover{background-color:var(--surface-tint-2)}@media(hover:none){.toast-action:hover,.app-banner-action:hover{background-color:transparent}}.toast-action:focus-visible,.app-banner-action:focus-visible{outline:2px solid var(--main-font-color);outline-offset:2px}.toast-close{display:grid;place-items:center;flex-shrink:0;padding:var(--space-1);background:none;border:0;border-radius:var(--radius);color:var(--chrome-3);line-height:1;cursor:pointer;transition:color var(--transition-fast),background-color var(--transition-fast)}.toast-close:hover,.toast-close:focus-visible{color:var(--main-font-color);background:var(--surface-tint-3)}.toast-timer{position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--toast-accent);opacity:.8;transform-origin:left center;pointer-events:none}.app-banner{position:fixed;top:var(--space-5);left:var(--space-5);right:var(--space-5);margin:0 auto;width:fit-content;max-width:520px;z-index:var(--z-fullscreen);display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-5);padding:var(--space-4) var(--space-5);border:1px solid color-mix(in srgb,var(--color-danger) 60%,var(--popup-border));border-left:3px solid var(--color-danger);border-radius:var(--radius-md);background:var(--surface-dark);box-shadow:var(--shadow-popover);color:var(--main-font-color);font-size:var(--text-sm);line-height:1.4}.app-banner-text{flex:1 1 16em}.app-banner-title{font-weight:600;margin-bottom:var(--space-1)}.app-banner-actions{display:flex;flex-wrap:wrap;gap:var(--space-3)}.app-banner-close{display:flex;background:transparent;border:0;border-radius:var(--radius);color:var(--chrome-3);cursor:pointer;padding:var(--space-1);transition:color var(--transition-fast),background-color var(--transition-fast)}.app-banner-close:hover,.app-banner-close:focus-visible{color:var(--main-font-color);background:var(--surface-tint-3)}@media(min-width:769px){html.preview-frame body{height:100dvh;min-height:0;margin:0;padding:var(--space-5);box-sizing:border-box;overflow:hidden}html.preview-frame .footer{display:none}html.preview-frame #pageContainer{min-height:0}html.preview-frame #gridMatrixRow{flex:1 1 0;min-height:55%}html.preview-frame #gridArea #matrix{max-height:100%}html.preview-frame #pageStrip{min-height:0;overflow-y:auto}html.preview-frame .track-tabs{top:0;justify-content:flex-end}html.preview-frame .track-tab{flex:0 1 35px;height:auto;min-height:0}}
