@import "https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap";:root{color:#0f0f0f;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg:#f9f9f9;--panel:#fff;--line:#e5e5e5;--muted:#606060;--quiet:#909090;--text:#0f0f0f;--lime:#f03;--mono:"Roboto",Arial,sans-serif;--display:"Roboto",Arial,sans-serif;background:#f9f9f9;font-family:Roboto,Arial,sans-serif}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f1f1f1;--bg:#0f0f0f;--panel:#181818;--line:#303030;--muted:#aaa;--quiet:#717171;--text:#f1f1f1;background:#0f0f0f}:root[data-theme=dark] *{scrollbar-color:#555 #181818}*{box-sizing:border-box}body{background:var(--bg);min-width:360px;margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.4}a{color:inherit;text-decoration:none}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--lime);outline-offset:3px}::selection{color:#fff;background:#f03}input[type=range]{accent-color:var(--track,var(--lime));cursor:pointer}input[type=number]::-webkit-inner-spin-button{appearance:none}button,summary{touch-action:manipulation}button{border:0}button:hover{filter:brightness(1.09)}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}*{scrollbar-width:thin;scrollbar-color:#bdbdbd #f1f1f1}#root,.app{min-height:100dvh}.topbar{border-bottom:1px solid var(--line);background:#151812;justify-content:space-between;align-items:center;gap:24px;height:72px;padding:0 36px;display:flex}.brand{font:600 20px var(--display);letter-spacing:-.9px;white-space:nowrap;align-items:center;gap:10px;display:flex}.brand-symbol{width:35px;height:35px;color:var(--lime);border:1px solid #495331;border-radius:50%;place-items:center;display:grid}.brand-period{font:10px var(--mono);color:var(--muted);vertical-align:super;margin-left:3px}.mode-switch{background:#10120e;border:1px solid #31372b;border-radius:8px;align-items:center;gap:4px;padding:4px;display:flex}.mode-switch button{color:#a1a794;background:0 0;border-radius:5px;align-items:center;gap:8px;height:32px;padding:0 14px;font-size:11px;display:flex}.mode-switch button span{font:7px var(--mono);letter-spacing:.5px;color:#79836a;margin-left:7px}.mode-switch button.active span{color:#a9ba83}.header-actions{align-items:center;gap:14px;display:flex}.save-status{color:#929b85;align-items:center;gap:6px;font-size:10px;display:flex}.save-status i,.connection-status i,.transport-status i,.write-dot{background:#a3b780;border-radius:50%;flex-shrink:0;width:5px;height:5px;display:inline-block}.save-status.unsaved i{background:#c0a665}.button{white-space:nowrap;background:#23291c;border:1px solid #3a4231;border-radius:5px;justify-content:center;align-items:center;gap:8px;height:34px;padding:0 13px;font-size:11px;font-weight:600;display:inline-flex}.button-primary{background:var(--lime);border-color:var(--lime);color:#1a2110}.share-button{height:35px}.share-button svg:last-child{margin-left:8px}.icon-button{color:#a2aa96;background:0 0;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:29px;height:29px;padding:0;display:inline-flex}.workspace{max-width:1720px;margin:auto;padding:32px 36px 0}.session-heading{justify-content:space-between;align-items:center;margin-bottom:25px;display:flex}.session-eyebrow{font:8px var(--mono);letter-spacing:.5px;color:#7d8771;align-items:center;gap:12px;display:flex}.section-index{font:8px var(--mono);letter-spacing:1px;color:#a5b28d}.small-divider{background:#3d4534;width:1px;height:9px}.project-title{font:500 clamp(24px,2.8vw,37px)/1.2 var(--display);letter-spacing:-1.3px;color:#eeeee6;outline-offset:5px;background:0 0;border:0;width:700px;max-width:100%;margin:8px 0 0;padding:0;display:block}.session-heading p{color:#858e79;margin:7px 0 0;font-size:11px}.project-menu{z-index:80;align-self:flex-end;position:relative}.project-menu summary{cursor:pointer;color:#9fa88f;border:1px solid #353d2d;border-radius:4px;padding:6px;list-style:none}.project-menu summary::-webkit-details-marker{display:none}.project-menu>div{z-index:81;background:#242a1d;border:1px solid #454e38;border-radius:6px;width:180px;padding:5px;position:absolute;top:40px;right:0;box-shadow:0 12px 30px #0007}.project-menu button{text-align:left;color:#d2d8c7;background:0 0;border-radius:3px;align-items:center;gap:8px;width:100%;padding:10px;font-size:11px;display:flex}.project-menu button:hover{background:#354027}.stage{min-width:0}.stage-heading{justify-content:space-between;align-items:center;gap:14px;margin-bottom:12px;display:flex}.stage-heading>div{align-items:center;gap:15px;display:flex}.stage-label{color:#88927a;font-size:10px}.connection-status{font:8px var(--mono);color:#a2ae90;white-space:nowrap;align-items:center;gap:6px;display:flex}.connection-problem{color:#e1aa86}.connection-problem i{background:#e1aa86}.quad{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.video-tile{background:#090b08;border:1px solid #343c2b;border-radius:5px;flex-direction:column;min-width:0;transition:border-color .2s;display:flex;overflow:hidden}.video-tile.video-playing{border-color:var(--track);box-shadow:0 0 0 1px color-mix(in srgb,var(--track) 15%,transparent)}.video-host{background:#090b08;width:100%;height:clamp(200px,24vh,310px);min-height:200px;position:relative}.video-host:empty{background:repeating-linear-gradient(0deg,#0b0d09 0 1px,#10130d 2px 3px)}.video-host iframe,.video-host>div{border:0;width:100%;height:100%;min-height:200px;display:block;position:absolute;inset:0}.video-caption{background:#1b2015;border-top:1px solid #2d3525;align-items:center;gap:12px;min-height:29px;padding:5px 11px;font-size:10px;display:flex}.video-name{white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:7px;min-width:0;display:flex;overflow:hidden}.track-dot{background:var(--track,var(--lime));border-radius:2px;flex-shrink:0;width:6px;height:6px;display:inline-block}.player-state{font:7px var(--mono);text-transform:uppercase;color:#929e82;white-space:nowrap;align-items:center;gap:5px;margin-left:auto;display:flex}.player-state i{background:#7b866b;border-radius:50%;width:4px;height:4px}.state-playing i{background:var(--track);box-shadow:0 0 6px var(--track)}.state-error,.state-blocked{color:#f2a482}.state-error i,.state-blocked i{background:#f2a482}.video-caption a{color:#859373;place-items:center;display:grid}.video-error{color:#e0b59b;background:#31231a;justify-content:space-between;align-items:center;gap:10px;padding:9px 11px;font-size:10px;line-height:1.5;display:flex}.video-error button{color:#f2c6a7;background:#493222;border:1px solid #785038;border-radius:3px;align-items:center;gap:4px;padding:5px 7px;font-size:9px;display:flex}.empty-video{color:#4b5740;background:#151911;border:1px solid #2b3223;border-radius:5px;flex-direction:column;justify-content:center;align-items:center;gap:12px;min-height:230px;display:flex;position:relative;overflow:hidden}.empty-video>span:not(.empty-video-cross){font:300 36px var(--display);letter-spacing:-1px}.empty-video small{font:7px var(--mono);letter-spacing:2px;color:#66725a}.empty-video-cross{background:#252e1d;position:absolute}.empty-video-cross.horizontal{width:100%;height:1px;top:50%}.empty-video-cross.vertical{width:1px;height:100%;left:50%}.empty-video>span:not(.empty-video-cross),.empty-video small{z-index:1;background:#151911;padding:0 12px;position:relative}.playback-help{color:#d2ae94;justify-content:space-between;gap:12px;padding:12px 2px;font-size:10px;display:flex}.playback-help a{white-space:nowrap;color:#d6f368;align-items:center;gap:5px;display:flex}.transport{border-bottom:1px solid #353e2b;justify-content:space-between;align-items:center;gap:20px;min-height:68px;margin-bottom:28px;display:flex}.transport-main{align-items:center;gap:15px;display:flex}.play-button{min-width:110px;height:34px;color:var(--lime);background:#27321a;border:1px solid #4f6036;border-radius:4px;justify-content:center;align-items:center;gap:10px;font-size:11px;display:flex}.play-button.is-playing{background:var(--lime);color:#1c250f}.transport-position{font:14px var(--mono);color:#e5eadb;white-space:nowrap}.transport-position i{color:#788663;margin:0 2px;font-style:normal}.transport-position small{font:9px var(--mono);color:#758465;margin-left:9px}.transport-rule,.toolbar-divider{background:#35402a;width:1px;height:18px}.tempo-input{align-items:center;gap:5px;display:flex}.tempo-input input{color:#e3e9d9;width:30px;font:12px var(--mono);outline-offset:4px;background:0 0;border:0;padding:0}.tempo-input span,.bpm-readout small{font:8px var(--mono);color:#838f74}.meter-input{align-items:center;gap:4px;display:flex}.meter-input select{appearance:none;color:#cad3bf;font:11px var(--mono);background:0 0;border:0;padding:5px 0}.meter-input svg{color:#728160}.meter-input option,.grid-select option,.quantize-popover option{color:#e8eddf;background:#1e2517}.loop-toggle{color:#7c886a}.transport-status{font:7px var(--mono);letter-spacing:1px;color:#828f70;align-items:center;gap:7px;display:flex}.transport-status i{background:#7b876a}.transport-status .playing-dot{background:var(--lime);animation:1s infinite pulse;box-shadow:0 0 8px #d6f36870}.master-volume{color:#8f9b7e;font:8px var(--mono);align-items:center;gap:9px;display:flex}.master-volume input{width:93px;height:3px}.master-volume output{color:#c3ceb2;width:30px;font-size:9px}.arranger{background:#181d14;border:1px solid #35402a;border-radius:6px;outline:none;min-width:0}.arranger-heading{justify-content:space-between;align-items:center;gap:16px;padding:18px 18px 16px;display:flex}.arranger-heading h2{font:500 19px var(--display);letter-spacing:-.5px;align-items:center;gap:8px;margin:6px 0 0;display:flex}.arranger-heading h2>span{font:8px var(--mono);color:#8f9c7c;letter-spacing:0;background:#252e1d;border-radius:3px;margin-left:9px;padding:3px 5px}.arranger-actions{gap:8px;display:flex}.separate-toggle{color:#9aa889;background:0 0;border-color:#37462a;font-size:10px;font-weight:400}.add-instrument-form{background:#222b19;border-top:1px solid #35402a;border-bottom:1px solid #35402a;padding:14px 18px}.add-instrument-form>label{font:9px var(--mono);color:#bacaa2;margin-bottom:8px;display:block}.add-instrument-form>div{gap:8px;display:flex}.add-instrument-form input{color:#e3ecd8;background:#141b0e;border:1px solid #455935;border-radius:4px;width:100%;min-width:0;padding:9px 11px;font-size:12px}.add-instrument-form small{color:#92a17f;margin-top:9px;font-size:10px;display:block}.arranger-toolbar{z-index:5;background:#1d2417;border-block:1px solid #303d25;flex-wrap:wrap;align-items:center;gap:8px;padding:9px 16px;display:flex;position:relative}.edit-tools{background:#151c10;border:1px solid #39472c;border-radius:4px;gap:2px;padding:2px;display:flex}.edit-tools button{color:#83966e;background:0 0;border-radius:2px;place-items:center;width:27px;height:25px;display:grid}.edit-tools button.selected{color:#d6f368;background:#334326}.toolbar-button{color:#a1af90;background:0 0;border:1px solid #0000;border-radius:3px;align-items:center;gap:6px;min-height:29px;padding:0 8px;font-size:10px;display:flex}.grid-select{font:8px var(--mono);color:#83966e;align-items:center;gap:7px;padding:0 6px;display:flex}.grid-select select{color:#d7e2ca;width:66px;height:28px;font:10px var(--mono);background:#171f11;border:1px solid #3d4d2f;border-radius:3px;padding:0 5px}.triplet-button{font:12px var(--mono);gap:4px}.triplet-button small{font:6px var(--mono)}.quantize-control{position:relative}.quantize-popover{background:#252f1d;border:1px solid #4d6339;border-radius:5px;flex-direction:column;gap:12px;width:240px;padding:16px;display:flex;position:absolute;top:37px;left:0;box-shadow:0 15px 35px #0009}.quantize-popover strong{font:11px var(--display);color:#e2ecd7}.quantize-popover label{color:#abbc97;justify-content:space-between;align-items:center;gap:12px;font-size:11px;display:flex}.quantize-popover select{color:#dae8cc;background:#182310;border:1px solid #485d34;border-radius:3px;padding:5px;font-size:10px}.quantize-popover .quantize-triplets{justify-content:flex-start}.zoom-tools{align-items:center;gap:6px;margin-left:auto;display:flex}.zoom-tools button{color:#a6b992;background:0 0;place-items:center;width:26px;height:28px;display:grid}.zoom-tools span{font:8px var(--mono);color:#91a47b;text-align:center;min-width:29px}.arranger-editor{min-width:0;display:flex}.instrument-list{background:#181f12;border-right:1px solid #35462a;flex-direction:column;flex:0 0 218px;width:218px;height:341px;min-height:0;max-height:341px;display:flex;overflow:hidden}.instrument-rows{overscroll-behavior:contain;scrollbar-gutter:stable;min-height:0;overflow-y:auto}.instrument-list-heading{color:#879b72;height:69px;font:7px var(--mono);letter-spacing:.8px;border-bottom:1px solid #34452a;justify-content:space-between;align-items:center;padding:0 13px;display:flex}.instrument-list-heading button{color:#c0d3a7;font:9px var(--mono);background:#26351b;border:1px solid #3a5129;border-radius:3px;align-items:center;gap:5px;padding:5px 7px;display:flex}.instrument-row{border-bottom:1px solid #2d3b23;min-height:86px;padding:12px 10px 10px 9px;position:relative}.track-select:before{content:"";background-color:#111;background-image:var(--video-thumbnail);background-position:50%;background-size:cover;border-radius:5px;flex:0 0 62px;width:62px;height:35px;box-shadow:inset 0 0 0 1px #0002}.track-meta{flex:1}.instrument-row.armed-instrument:before{content:"";background:var(--track);width:2px;position:absolute;top:10px;bottom:10px;left:0}.track-select{text-align:left;color:#bdc9af;background:0 0;align-items:center;gap:8px;width:100%;min-width:0;padding:0;display:flex}.track-meta{flex-direction:column;gap:6px;min-width:0;display:flex}.track-meta b{text-overflow:ellipsis;white-space:nowrap;max-width:134px;font-size:10px;font-weight:500;overflow:hidden}.track-meta small{font:7px var(--mono);color:#7d9368}.instrument-number{font:8px var(--mono);color:#71845e;align-self:flex-start;margin-top:2px}.selected-instrument .instrument-number{color:var(--track)}.track-actions{justify-content:flex-end;gap:3px;margin-top:-14px;display:flex}.track-actions .icon-button{width:23px;height:22px}.track-actions .icon-button[aria-pressed=true]{color:#f2a482}.instrument-list-footer{color:#82976c;font:7px var(--mono);flex-direction:column;align-items:flex-start;gap:6px;margin-top:auto;padding:15px 12px;line-height:1.5;display:flex}.instrument-list-footer kbd{color:#b7cba0;background:#26351b;border:1px solid #3e532c;border-radius:3px;padding:4px 6px;font-size:8px}.instrument-list-footer small{color:#617950;font-size:7px}.piano-scroll{overscroll-behavior-x:contain;flex:1;min-width:0;max-height:950px;overflow:auto}.piano-content{background:#171e12;min-width:100%;position:relative}.roll-heading{height:29px;font:7px var(--mono);letter-spacing:.5px;color:#9ab183;background:#1b2415;border-bottom:1px solid #303f25;justify-content:space-between;align-items:center;gap:10px;padding:0 12px;display:flex;position:sticky;left:0}.roll-heading>span{align-items:center;gap:6px;display:flex}.roll-heading b{font-weight:400}.write-dot{background:var(--lime);width:4px;height:4px}.ruler-row,.piano-ruler{display:flex}.ruler-spacer{z-index:3;width:104px;font:6px var(--mono);color:#758c60;letter-spacing:.6px;background:#1c2813;border-right:1px solid #3c502c;flex:0 0 104px;padding:5px 7px;position:sticky;left:0}.loop-ruler{cursor:crosshair;touch-action:none;background:#202d16;flex-shrink:0;height:20px;position:relative}.loop-range{color:#b8d08b;opacity:.5;pointer-events:none;background:#708d3340;border-block:1px solid #798e47;justify-content:space-between;align-items:center;min-width:10px;height:19px;display:flex;position:absolute}.loop-enabled .loop-range{opacity:1}.loop-range>span{font:6px var(--mono);letter-spacing:2px;overflow:hidden}.loop-range button{color:#122006;width:12px;height:19px;font:7px var(--mono);pointer-events:auto;cursor:ew-resize;touch-action:none;background:#718e40;flex-shrink:0}.piano-ruler{background:#1c2813;border-bottom:1px solid #3c502b;height:22px}.piano-ruler>span{z-index:3;width:104px;font:6px var(--mono);letter-spacing:1px;color:#839c6b;background:#1c2813;border-right:1px solid #3c502c;flex:0 0 104px;padding:6px 7px;position:sticky;left:0}.piano-ruler>div{flex-shrink:0;display:flex}.piano-ruler button{text-align:left;color:#b3c69c;height:22px;font:8px var(--mono);background:0 0;border-left:1px solid #435a2d;flex-shrink:0;align-items:center;gap:8px;padding:0 7px;display:flex;overflow:hidden}.piano-ruler button small{font:6px var(--mono);color:#627e4c}.piano-body{display:flex;position:relative}.piano-keyboard{z-index:3;background:#1c2813;border-right:1px solid #4a6333;flex:0 0 104px;width:104px;position:sticky;left:0}.piano-keyboard button{text-align:left;width:100%;height:27px;font:8px var(--mono);touch-action:none;-webkit-user-select:none;user-select:none;border-bottom:1px solid #3a4a2b;border-radius:0;align-items:center;gap:9px;padding:0 10px;display:flex;position:relative}.piano-white{color:#29351c;background:#b5bca4}.piano-black{color:#a5b197;background:#273021;box-shadow:inset -16px 0 #3f4b34}.piano-keyboard button b{min-width:9px;font-size:10px;font-weight:500}.piano-keyboard button>span{white-space:nowrap;align-items:center;gap:4px;font-size:7px;display:flex}.piano-keyboard button i{white-space:nowrap;font-size:5px;font-style:normal}.piano-keyboard button.middle-c{color:#21310e;background:#cfdfab}.piano-keyboard button:active{background:var(--track,var(--lime));color:#1a2510}.piano-grid{isolation:isolate;touch-action:none;background-color:#1b2913;background-image:linear-gradient(90deg,#40572c50 1px,#0000 1px),linear-gradient(90deg,#65884470 1px,#0000 1px);flex-shrink:0;position:relative;outline-offset:-2px!important}.piano-grid.draw-mode{cursor:crosshair}.piano-grid.select-mode{cursor:default}.piano-row{pointer-events:none;border-bottom:1px solid #40582b44}.piano-row.c-row{background:#5d853a0a;border-bottom-color:#759a4b70}.future-region{pointer-events:none;background:#0006;border-left:1px dashed #719747;position:absolute;top:0;bottom:0;right:0;overflow:hidden}.future-region>span{font:7px var(--mono);letter-spacing:1px;color:#637d4d;max-width:150px;padding:12px;line-height:1.8;display:block}.piano-note{background:var(--track);border:1px solid color-mix(in srgb,var(--track) 75%,white);color:#17260c;z-index:1;touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;border-radius:2px;justify-content:space-between;align-items:center;min-width:4px;height:21px;padding:0 4px;display:flex;position:absolute;overflow:hidden;box-shadow:0 1px 4px #07100040}.piano-note>span{font:8px var(--mono);pointer-events:none}.piano-note.selected-note{outline-offset:1px;z-index:2;outline:1px solid #f0f8e0;box-shadow:0 0 8px #d9efb125}.piano-note.muted-note{opacity:.3}.piano-note>i{cursor:ew-resize;touch-action:none;border-left:1px solid #213c1325;width:8px;position:absolute;top:0;bottom:0;right:0}.piano-note:active{cursor:grabbing}.piano-playhead{transform:translateX(var(--playhead-x,0px));z-index:2;pointer-events:none;opacity:.5;will-change:transform;background:#e6eddb;width:1px;position:absolute;top:0;bottom:0;left:0}.piano-playhead.active{opacity:1;background:#e1f3c3;box-shadow:0 0 7px #d6f36860}.piano-playhead:before{content:"";border-top:5px solid #e1f3c3;border-left:3px solid #0000;border-right:3px solid #0000;position:absolute;top:-4px;left:-3px}.selection-lasso{z-index:4;pointer-events:none;background:#d6f36815;border:1px solid #d6f36890;position:absolute}.separate-roll-label{color:#becfaf;background:#1e2b14;border-block:1px solid #435d2b;align-items:center;gap:8px;height:30px;padding:0 12px;font-size:10px;display:flex;position:sticky;left:0}.separate-roll-label .icon-button{margin-left:auto}.arranger-empty{color:#a8c485;flex-direction:column;align-items:center;gap:12px;padding:30px;display:flex}.arranger-empty h3{font:500 17px var(--display);margin:0}.note-toolbar{color:#99ad84;min-height:36px;font:7px var(--mono);letter-spacing:.3px;background:#202c17;border-top:1px solid #3a4d2a;border-radius:0 0 5px 5px;flex-wrap:wrap;align-items:center;gap:12px;padding:8px 12px;display:flex}.note-toolbar>span:first-child{color:#bfd2a7;white-space:nowrap}.note-toolbar label{align-items:center;gap:6px;display:flex}.note-toolbar label input{color:#d0e3b8;width:47px;font:8px var(--mono);background:#17240e;border:1px solid #4c6436;border-radius:3px;padding:3px}.note-toolbar button{color:#bed5a0;font:8px var(--mono);background:0 0;align-items:center;gap:5px;padding:3px;display:flex}.note-toolbar-hint{color:#7c9764;align-items:center;gap:9px;margin-left:auto;font-size:6px;display:flex}.note-toolbar-hint i{background:#657f51;border-radius:50%;width:2px;height:2px}.studio-footer{color:#7c8c6a;font:7px var(--mono);letter-spacing:.5px;justify-content:space-between;align-items:center;gap:20px;padding:18px 2px 23px;display:flex}.studio-footer>span{align-items:center;gap:7px;display:flex}.studio-footer kbd{font:7px var(--mono);color:#a4b68e;border:1px solid #39492c;border-radius:3px;padding:3px 4px}.studio-footer i{color:#4b603a;margin:0 4px;font-style:normal}.studio-footer button{color:#9eb888;font:8px var(--mono);letter-spacing:.3px;background:0 0;align-items:center;gap:7px;display:flex}.synth-backdrop{z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#090c06a8;justify-content:flex-end;display:flex;position:fixed;inset:0}.synth-panel{overscroll-behavior:contain;background:#1a2115;border-left:1px solid #53673b;outline:none;width:420px;max-width:100%;height:100dvh;padding:0 26px 24px;animation:.2s slide-in;position:relative;overflow-y:auto;box-shadow:-20px 0 100px #0008}.synth-header{z-index:5;background:#1a2115f5;border-bottom:1px solid #35442a;justify-content:space-between;align-items:center;height:61px;margin-bottom:22px;display:flex;position:sticky;top:0}.eyebrow{font:8px var(--mono);letter-spacing:1px;color:#96a784}.synth-name{align-items:center;gap:15px;display:flex}.synth-name label{flex:1;min-width:0}.synth-name label input{font:500 26px var(--display);letter-spacing:-.7px;color:#edf2e5;background:0 0;border:0;border-bottom:1px solid #465a33;width:100%;padding:0 0 6px}.synth-name>input{cursor:pointer;background:0 0;border:0;width:23px;height:23px;padding:0}.source-link{font:8px var(--mono);color:#80966b;align-items:center;gap:8px;margin-top:9px;display:flex}.synth-section-heading{font:8px var(--mono);letter-spacing:.7px;color:#afc499;justify-content:space-between;align-items:center;gap:10px;margin-top:26px;display:flex}.synth-section-heading>span:last-child:not(:first-child){letter-spacing:.5px;color:#6e8958;font-size:6px}.synth-section-heading output{font:10px var(--mono);color:var(--track)}.envelope-graph{width:100%;color:var(--track);touch-action:none;margin-top:10px;display:block;overflow:visible}.graph-guide{stroke:#45602d60;stroke-width:.6px;stroke-dasharray:3 5}.envelope-graph text{fill:#a0b58a;font:8px var(--mono)}.graph-handle-hit{cursor:move;touch-action:none}.synth-presets{background:#121b0c;border:1px solid #394c29;border-radius:4px;gap:5px;margin-top:5px;padding:4px;display:flex}.synth-presets button{color:#809969;background:0 0;border-radius:3px;flex:1;padding:6px 9px;font-size:9px}.synth-presets button[aria-pressed=true]{color:var(--track);background:#34472a;box-shadow:inset 0 0 0 1px #5a7540}.knob-grid{grid-template-columns:repeat(5,1fr);gap:8px;margin:25px 0 4px;display:grid}.knob-control{text-align:center;flex-direction:column;align-items:center;gap:6px;min-width:0;display:flex}.knob{background:conic-gradient(from 225deg,var(--track) 0deg,var(--track) var(--sweep),#354c24 var(--sweep),#354c24 270deg,transparent 270deg);border-radius:50%;place-items:center;width:50px;height:50px;display:grid;position:relative}.knob-body{background:linear-gradient(145deg,#47543d,#202d17);border:1px solid #576b43;border-radius:50%;width:40px;height:40px;display:block;position:relative;box-shadow:1px 3px 6px #0008}.knob-body>i{transform:rotate(var(--rotation));position:absolute;inset:5px}.knob-body>i:before{background:var(--track);content:"";border-radius:2px;width:2px;height:8px;position:absolute;top:0;left:50%}.knob input{opacity:0;cursor:ew-resize;width:100%;height:100%;margin:0;position:absolute;inset:0}.knob-label{color:#a4b98d;font-size:8px}.knob-control output{font:8px var(--mono);color:#d2e4bd}.source-duration>input,.fine-position>input{width:100%;height:4px;margin:17px 0 10px}.range-endpoints{font:7px var(--mono);color:#758f5e;justify-content:space-between;align-items:center;display:flex}.range-endpoints button{color:#a2bc88;font:7px var(--mono);background:0 0;padding:0}.synth-help{color:#869e70;margin:11px 0;font-size:9px;line-height:1.6}.synth-keys{gap:3px;height:65px;margin-top:12px;display:flex}.synth-keys>button{touch-action:none;border:1px solid #72825c;border-radius:0 0 4px 4px;flex-direction:column;flex:1;justify-content:flex-end;align-items:center;gap:7px;min-width:0;padding:0 0 9px;display:flex}.synth-keys .white-key{color:#2a3b19;background:#b4bea1}.synth-keys .black-key{color:#bdccab;background:#26321e;border-color:#4e6539;height:52px;box-shadow:0 2px 3px #0006}.synth-keys button.chosen{border-color:var(--track);box-shadow:inset 0 -3px var(--track)}.synth-keys button:active{background:var(--track);color:#203110}.synth-keys button>span{font:12px var(--display)}.key-speed{border-bottom:1px solid #e5e5e5;justify-content:space-between;align-items:center;gap:14px;padding:15px 0;display:flex}.key-speed>div{flex-direction:column;gap:4px;display:flex}.key-speed strong{color:#0f0f0f;font-size:11px;font-weight:500}.key-speed span{color:#606060;font-size:9px}.key-speed label{background:#f2f2f2;border-radius:16px;padding:3px 9px}.key-speed select{color:#0f0f0f;background:0 0;border:0;min-width:72px;padding:4px;font-size:11px}.synth-keys button small{font:6px var(--mono);opacity:.6}.key-mixer{margin-top:22px}.key-faders{grid-template-columns:repeat(10,1fr);gap:5px;margin-top:15px;display:grid}.key-faders label{font:8px var(--mono);color:#91ab79;flex-direction:column;align-items:center;gap:9px;transition:opacity .16s,filter .16s;display:flex}.key-faders label.inactive-key{opacity:.42;filter:saturate(.55)}.key-faders label.active-key{opacity:1}.key-fader-track{place-items:center;width:16px;height:64px;display:grid;position:relative}.key-fader-track input{z-index:2;position:relative}.key-fader-track i{z-index:1;pointer-events:none;background:#f03;border-radius:5px;width:5px;max-height:100%;transition:height 50ms linear;position:absolute;bottom:0;box-shadow:0 0 8px #f039}.key-faders output{color:#b2c69d;font-size:7px}.key-faders input{writing-mode:vertical-lr;appearance:auto;touch-action:none;direction:rtl;width:12px;height:64px;margin:0}.instrument-master-fader{background:#fff7f8;border:1px solid #ffd5dc;border-radius:10px;margin:24px 0 18px;padding:15px 16px 13px}.instrument-master-fader .synth-section-heading{margin:0 0 11px}.instrument-master-fader .synth-section-heading output{color:#f03;font-size:12px;font-weight:700}.instrument-master-fader>div:nth-child(2){color:#f03;align-items:center;gap:11px;display:flex}.instrument-master-fader input{z-index:2;accent-color:#f03;width:100%;position:relative}.master-fader-track{flex:1;min-width:0;display:flex;position:relative}.master-fader-track i{z-index:1;pointer-events:none;background:#f03;border-radius:4px;height:4px;transition:width 50ms linear;position:absolute;top:50%;left:0;transform:translateY(-50%);box-shadow:0 0 9px #f03a}.instrument-master-fader p{color:#606060;margin:9px 0 0;font-size:9px;line-height:1.5}.sample-loading-overlay,.workspace-loading-overlay{color:#fff;text-align:center;background:#0f0f0ff2;flex-direction:column;justify-content:center;align-items:center;gap:9px;display:flex}.sample-loading-overlay{z-index:90;width:420px;height:100dvh;position:fixed;top:0;right:0}.workspace-loading-overlay{z-index:200;position:fixed;inset:0}.sample-loading-overlay h2,.workspace-loading-overlay h2{margin:7px 0 0;font-size:23px}.sample-loading-overlay p,.workspace-loading-overlay p{color:#bbb;max-width:330px;margin:0 0 8px;font-size:12px;line-height:1.6}.sample-done{color:#54c96b}.sample-error{color:#ff8a9e}.workspace-loading-overlay.samples-done{color:#54c96b}.audition-button{touch-action:none;width:100%;height:39px;margin-top:25px}.audition-button>span{font:9px var(--mono);opacity:.6;margin-left:auto}.synth-footnote{text-align:center;color:#708a59;margin:13px 0 22px;font-size:9px;line-height:1.6}.remove-instrument{color:#ad957d;background:0 0;border-top:1px solid #3e512f;justify-content:center;align-items:center;gap:7px;width:100%;padding:19px 5px 0;font-size:10px;display:flex}.toast,.undo-toast{z-index:100;color:#e0ebd3;background:#2b3821;border:1px solid #677c4b;border-radius:6px;align-items:center;gap:17px;max-width:min(560px,100vw - 32px);padding:13px 16px;font-size:11px;line-height:1.5;display:flex;position:fixed;bottom:22px;left:50%;transform:translate(-50%);box-shadow:0 10px 40px #0009}.toast button,.undo-toast button{color:#b6c99f;background:0 0;place-items:center;padding:0;display:grid}.undo-toast{left:25px;transform:none}.undo-toast button{color:var(--lime);font-size:11px}dialog{color:var(--text);background:#1e2717;border:1px solid #51663c;border-radius:10px;max-height:calc(100dvh - 40px);overflow:auto;box-shadow:0 30px 100px #0009}.share-dialog,.help-dialog{width:500px;max-width:calc(100vw - 32px);padding:24px 28px 27px}.replicate-dialog{width:520px;max-width:calc(100vw - 32px);padding:24px 28px 27px}.replicate-dialog h2{color:#f0f3e9;letter-spacing:-1px;margin:19px 0 13px;font-size:28px}.replicate-dialog>p{color:#a1b38f;font-size:11px;line-height:1.8}.replicate-options{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:20px;display:grid}.replicate-options button{color:#0f0f0f;background:#f2f2f2;border:1px solid #ddd;border-radius:10px;flex-direction:column;align-items:center;gap:3px;padding:16px 8px;display:flex}.replicate-options button:hover:not(:disabled){color:#fff;background:#f03;border-color:#f03}.replicate-options strong{font-size:21px}.replicate-options span{font-size:10px;font-weight:600}.replicate-options small{opacity:.68;font-size:8px}.replicate-note{border-top:1px solid #ddd;padding-top:14px;margin-top:18px!important}.dialog-topline{justify-content:space-between;align-items:center;gap:15px;display:flex}.share-emblem{width:54px;height:54px;color:var(--lime);background:#29391c;border:1px solid #4e6a33;border-radius:50%;place-items:center;margin-top:23px;display:grid}.share-dialog h2,.help-dialog h2{font:500 28px/1.15 var(--display);letter-spacing:-1px;color:#f0f3e9;margin:19px 0 13px}.share-dialog p,.help-dialog p{color:#a1b38f;font-size:11px;line-height:1.8}.share-url{background:#131e0c;border:1px solid #4a6633;border-radius:5px;gap:5px;margin-top:22px;padding:5px;display:flex}.share-url input{color:#a1bb87;width:0;font:10px var(--mono);background:0 0;border:0;flex:1;padding:0 7px}.share-preview{color:#cee6af;justify-content:center;align-items:center;gap:7px;padding:16px 0;font-size:11px;display:flex}.share-note{color:#7f9b68;border-top:1px solid #3b512a;align-items:center;gap:8px;padding-top:15px;font-size:9px;line-height:1.5;display:flex}.copy-error{color:#e8ba93!important}.help-dialog ol{color:#9eb58b;padding-left:18px;font-size:11px;line-height:1.75}.help-dialog li{margin-bottom:13px;padding-left:5px}.help-dialog li strong{color:#d4e7be;font-weight:500}.browser-help{background:#2e3e20;border:1px solid #486132;border-radius:4px;padding:12px}.help-dialog .button{width:100%;margin-top:10px}.latency-note{color:#758f62!important;font-size:9px!important}.performance-mode{background:#090c07;flex-direction:column;height:100dvh;min-height:740px;display:flex}.performance-mode .topbar{background:#11160d;height:55px;min-height:55px;padding:0 22px}.performance-mode .brand{font-size:17px}.performance-mode .brand-symbol{width:29px;height:29px}.performance-mode .brand-symbol svg{width:19px}.performance-mode .workspace{flex-direction:column;flex:1;width:100%;max-width:none;min-height:0;margin:0;padding:0 12px 12px;display:flex}.performance-mode .session-heading{height:67px;min-height:67px;margin:0;padding:0 8px}.performance-mode .session-eyebrow,.performance-mode .session-eyebrow .section-index{font-size:6px}.performance-mode .project-title{font:500 21px var(--display);letter-spacing:-.5px;width:auto;margin-top:4px}.performance-mode .stage{flex-direction:column;flex:1;min-height:0;display:flex}.performance-mode .stage-heading{display:none}.performance-mode .quad{flex:1;grid-template-rows:repeat(2,minmax(0,1fr));gap:5px;height:100%;min-height:0}.performance-mode .video-host{flex:1;height:100%;min-height:200px}.performance-mode .video-caption{min-height:25px;padding:4px 9px;font-size:8px}.performance-mode .empty-video{min-height:200px}.performance-mode .transport{border:0;order:2;min-height:60px;margin:0;padding:0 10px}.performance-mode .mini-roll{order:3}.performance-mode .playback-help{order:1;padding:8px 10px;font-size:9px}.performance-mode .play-button{min-width:85px;height:32px}.bpm-readout{font:11px var(--mono);color:#c6d5b6;align-items:center;gap:6px;display:flex}.mini-roll{background:#141e0e;border:1px solid #354b25;border-radius:4px;height:86px;min-height:86px;display:flex;overflow:hidden}.mini-label{color:#9eb884;width:110px;min-width:110px;font:7px var(--mono);letter-spacing:1px;background:#1b2714;border-right:1px solid #354b25;flex-direction:column;justify-content:center;align-items:center;gap:7px;display:flex}.mini-label svg{color:#d6f368}.mini-label small{color:#677f50;letter-spacing:.5px;font-size:6px}.mini-viewport{scrollbar-width:none;flex:1;min-width:0;position:relative;overflow:auto hidden}.mini-score{background:repeating-linear-gradient(90deg,#0000 0 calc(6.25% - 1px),#49652d25 calc(6.25% - 1px) 6.25%);height:100%;position:relative}.mini-bars{color:#768f5b;height:18px;font:6px var(--mono);border-bottom:1px solid #36532240;justify-content:space-around;padding-top:5px;display:flex}.mini-bars>span{border-left:1px solid #4a6a2f40;flex:1;padding-left:8px}.mini-track{border-bottom:1px solid #36532225;height:15px;position:absolute;left:0;right:0}.mini-track>i{background:var(--track);border-radius:1px;height:4px;position:absolute}.mini-playhead{opacity:.6;pointer-events:none;background:#bdd4a0;width:1px;position:absolute;top:0;bottom:0}.mini-playhead.active{opacity:1;box-shadow:0 0 6px #d6f36840}.shared-session .header-actions{margin-left:auto}.shared-session .topbar{justify-content:flex-start}.shared-session .brand:after{content:"A VIDEO INSTRUMENT STUDIO";font:6px var(--mono);color:#667f50;letter-spacing:1px;margin-left:18px}@keyframes pulse{50%{opacity:.4}}@keyframes slide-in{0%{opacity:.5;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@media (width>=1600px){.workspace{padding:32px 50px 0}.video-host{height:clamp(240px,26vh,350px)}.instrument-list{flex-basis:244px;width:244px}.track-meta b{max-width:162px}}@media (width<=1100px){.topbar{gap:15px;padding:0 22px}.brand{font-size:18px}.header-actions{gap:8px}.save-status{display:none}.workspace{padding:26px 22px 0}.mode-switch button{padding:0 10px}.mode-switch button span{display:none}.transport{gap:14px}.transport-status{letter-spacing:.5px;font-size:6px}.transport-main{gap:10px}.master-volume input{width:64px}.instrument-list{flex-basis:190px;width:190px}.track-meta b{max-width:105px}.arranger-toolbar{gap:4px;padding:8px 10px}.toolbar-button{padding:0 6px}.studio-footer{gap:10px;font-size:6px}.studio-footer kbd{font-size:6px}.toolbar-divider{display:none}}@media (width<=800px){.topbar{gap:10px;height:62px;padding:0 15px}.brand{gap:7px;font-size:16px}.brand-symbol{width:30px;height:30px}.brand-symbol svg{width:20px}.mode-switch button{gap:5px;height:29px;padding:0 8px;font-size:10px}.mode-switch button svg{width:12px}.share-button{gap:6px;padding:0 9px;font-size:10px}.share-button svg:last-child,.guide-button{display:none}.workspace{padding:22px 15px 0}.session-eyebrow{gap:8px;font-size:6px}.session-eyebrow .section-index{font-size:6px}.project-title{letter-spacing:-.8px;width:100%;font-size:29px}.session-heading{margin-bottom:22px}.stage-label{display:none}.stage-heading{margin-bottom:9px}.quad{gap:6px}.video-caption{gap:5px;padding:5px 7px}.video-name{font-size:8px}.player-state{font-size:6px}.video-caption a svg{width:11px}.transport-status{display:none}.transport-main{gap:9px}.master-volume>span{display:none}.transport-position{font-size:12px}.transport-position small{margin-left:4px;font-size:8px}.transport-rule{display:none}.transport{gap:8px;margin-bottom:20px}.play-button{min-width:100px}.arranger-heading{padding:15px 12px}.arranger-heading h2{font-size:17px}.separate-toggle{padding:0 8px;font-size:9px}.separate-toggle svg{width:12px}.arranger-actions{gap:5px}.arranger-actions .button-primary{padding:0 9px;font-size:10px}.arranger-toolbar{gap:5px}.grid-select{padding:0 3px}.zoom-tools{gap:3px}.instrument-list{flex-basis:160px;width:160px}.instrument-list-heading{letter-spacing:.5px;padding:0 9px;font-size:6px}.instrument-row{min-height:76px;padding:10px 7px}.track-select{gap:6px}.instrument-number{font-size:7px}.track-meta b{max-width:97px;font-size:9px}.track-meta small{font-size:6px}.track-actions{margin-top:4px}.track-actions .icon-button{width:23px;height:18px}.instrument-list-footer{padding:12px 8px;font-size:6px}.instrument-list-footer kbd{font-size:7px}.instrument-list-footer small{font-size:6px}.note-toolbar{gap:9px}.note-toolbar-hint{display:none}.add-accessible-note{margin-left:auto}.studio-footer>span:nth-child(2){display:none}.performance-mode .transport-position{font-size:11px}.performance-mode .transport-main{gap:10px}.performance-mode .transport{padding:0 3px}.performance-mode .session-heading{padding:0 4px}.performance-mode .master-volume input{width:62px}.mini-label{width:85px;min-width:85px;font-size:6px}.mini-label small{font-size:5px}.performance-mode .quad .video-caption{font-size:8px}.shared-session .brand:after{margin-left:8px;font-size:5px}}@media (width<=580px){.topbar{flex-wrap:wrap;align-content:space-between;gap:8px 5px;height:105px;padding:12px 14px}.header-actions{margin-left:auto}.mode-switch{order:3;justify-content:center;width:100%;padding:3px}.mode-switch button{flex:1;height:25px}.mode-switch button span{margin-left:auto;font-size:6px;display:inline}.mode-switch button{padding:0 14px}.brand{font-size:17px}.share-button{height:29px}.workspace{padding:20px 12px 0}.project-title{font-size:27px}.session-eyebrow{flex-wrap:wrap;row-gap:4px;font-size:5px}.session-eyebrow .section-index{font-size:6px}.session-eyebrow .small-divider{height:7px}.session-heading p{font-size:10px}.quad{grid-template-columns:1fr;gap:8px}.video-host{aspect-ratio:16/9;height:auto;min-height:200px}.empty-video{min-height:200px}.video-caption{padding:6px 9px}.video-name{font-size:10px}.player-state,.stage-heading .section-index,.connection-status{font-size:7px}.transport-main{gap:5px}.play-button{gap:6px;min-width:77px;padding:0 8px;font-size:10px}.play-button svg{width:13px}.transport .icon-button{width:24px}.transport-position{font-size:10px}.transport-position small{display:none}.tempo-input input{width:25px;font-size:10px}.tempo-input span{font-size:6px}.meter-input select{font-size:9px}.meter-input svg{display:none}.master-volume{gap:5px}.master-volume input{width:45px}.master-volume output{width:24px;font-size:7px}.master-volume>svg{width:12px}.arranger-heading{flex-wrap:wrap;gap:12px}.arranger-heading>div:first-child{flex:1}.arranger-heading .section-index{font-size:6px}.arranger-heading h2{font-size:15px}.arranger-heading h2>span{margin-left:2px;font-size:6px}.arranger-heading h2 svg{width:15px}.arranger-actions{gap:4px}.arranger-actions .button{gap:5px;height:29px;padding:0 7px;font-size:8px}.arranger-actions .button svg{width:12px}.arranger-actions .separate-toggle{gap:0;padding:0 7px;font-size:0}.arranger-actions .separate-toggle svg{width:14px}.arranger-toolbar{gap:5px;padding:8px}.toolbar-button{gap:4px;padding:0 5px;font-size:9px}.triplet-button{font-size:11px}.triplet-button small{font-size:5px}.grid-select{gap:4px;font-size:7px}.grid-select select{width:53px;font-size:9px}.zoom-tools{margin-left:auto}.zoom-tools button{width:23px}.zoom-tools span{font-size:7px}.quantize-popover{width:220px;left:auto;right:0}.instrument-list{flex-basis:128px;width:128px}.instrument-list-heading{letter-spacing:.3px;padding:0 7px;font-size:5px}.instrument-list-heading button{gap:3px;padding:4px;font-size:7px}.instrument-list-heading svg{width:10px}.instrument-row{padding:11px 7px}.track-select{gap:5px}.instrument-number{display:none}.track-meta b{max-width:96px;font-size:9px}.track-meta small{font-size:6px}.track-actions{margin-top:6px}.instrument-list-footer kbd{font-size:6px}.instrument-list-footer>span{font-size:5px}.instrument-list-footer small{display:none}.note-toolbar{gap:7px;padding:8px;font-size:6px}.note-toolbar button{font-size:7px}.note-toolbar label{gap:3px;font-size:6px}.note-toolbar label input{width:37px;font-size:7px}.note-toolbar label>span{display:none}.note-toolbar .add-accessible-note{font-size:6px}.studio-footer{padding:15px 0 20px;font-size:5px}.studio-footer svg{width:11px}.studio-footer button{font-size:7px}.synth-panel{padding:0 21px 20px}.knob-grid{gap:6px}.knob{width:46px;height:46px}.knob-body{width:36px;height:36px}.synth-name label input{font-size:24px}.synth-section-heading{font-size:7px}.synth-section-heading>span:last-child:not(:first-child){font-size:5px}.playback-help{font-size:9px;line-height:1.6}.playback-help>span{max-width:65%}.playback-help a{font-size:8px}.performance-mode{height:auto;min-height:100dvh}.performance-mode .topbar{flex-wrap:nowrap;height:53px;min-height:53px;padding:0 14px}.performance-mode .mode-switch{order:0;width:auto;margin-left:auto}.performance-mode .mode-switch button{flex:initial;justify-content:center;gap:0;width:31px;padding:0;font-size:0}.performance-mode .mode-switch button span{display:none}.performance-mode .mode-switch button svg{width:14px}.performance-mode .header-actions{margin-left:4px}.performance-mode .session-heading{min-height:65px}.performance-mode .project-title{font-size:23px}.performance-mode .quad{grid-template-rows:auto}.performance-mode .video-host{aspect-ratio:16/9;flex:auto;height:auto}.performance-mode .video-caption{min-height:28px}.performance-mode .transport{gap:5px;min-height:60px}.performance-mode .transport-main{gap:5px}.performance-mode .master-volume input{width:47px}.performance-mode .play-button{min-width:70px}.performance-mode .bpm-readout{gap:4px;font-size:9px}.performance-mode .bpm-readout small{font-size:6px}.performance-mode .transport-position{font-size:10px}.mini-label{width:70px;min-width:70px;font-size:5px}.shared-session .brand:after{display:none}.share-dialog,.help-dialog{padding:20px}.share-dialog h2,.help-dialog h2{font-size:26px}.dialog-topline .eyebrow{font-size:6px}.share-url .button{padding:0 9px;font-size:10px}.share-note{font-size:8px}.undo-toast{bottom:12px;left:12px}.toast{font-size:10px;bottom:12px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.replace-source{margin-top:21px}.replace-source>label{font:7px var(--mono);letter-spacing:.8px;color:#80996b}.replace-source>div{background:#14200d;border:1px solid #3f562c;border-radius:4px;align-items:center;gap:5px;margin-top:7px;padding:4px;display:flex}.replace-source input{color:#afc796;min-width:0;font:8px var(--mono);background:0 0;border:0;flex:1;padding:5px}.replace-source button{width:25px;height:25px;color:var(--track);background:#354e24;border-radius:3px;place-items:center;display:grid}.replace-source small{color:#f2a482;margin-top:6px;font-size:9px;display:block}.track-actions{flex-wrap:wrap;gap:4px;margin-top:9px}.replace-source-button{color:#bed5a0;background:#26351b;border:1px solid #41572f;border-radius:3px;align-items:center;gap:5px;margin-right:auto;padding:4px 6px;font-size:8px;display:inline-flex}.track-actions .icon-button[title^=Remove]:hover{color:#f2a482;background:#3b2b1e}.replace-source button{justify-content:center;align-items:center;gap:5px;width:auto;padding:0 9px;font-size:9px;display:inline-flex}.replace-source p{color:#8fa97b;margin:9px 0 0;font-size:9px;line-height:1.6}.app{color:#0f0f0f;background:#f9f9f9}.topbar{z-index:40;color:#0f0f0f;background:#fff;border-color:#e5e5e5;height:64px;padding:0 28px;position:sticky;top:0}.brand{letter-spacing:-.5px;font-size:19px}.brand-symbol{color:#fff;background:#f03;border:0;border-radius:10px;width:38px;height:28px}.mode-switch{background:#f2f2f2;border:0;border-radius:20px}.mode-switch button{color:#606060;border-radius:18px;font-size:12px}.mode-switch button.active{color:#0f0f0f;background:#fff;box-shadow:0 1px 3px #0002}.mode-switch button span,.mode-switch button.active span{color:#777;font:500 8px var(--display);text-transform:none}.save-status,.icon-button{color:#606060}.save-status i,.connection-status i,.transport-status i,.write-dot{background:#2ba640}.icon-button:hover{color:#0f0f0f;background:#f2f2f2}.button{color:#0f0f0f;background:#f2f2f2;border-color:#e5e5e5;border-radius:18px}.button-primary{color:#fff;background:#f03;border-color:#f03}.workspace{max-width:1600px;padding-top:26px}.session-eyebrow,.section-index{color:#606060;font:500 11px var(--display);letter-spacing:0;text-transform:none}.project-title{color:#0f0f0f;letter-spacing:-.8px;font-weight:700}.session-heading p{color:#606060;font-size:13px}.small-divider{background:#d9d9d9}.project-menu summary{color:#606060;border-color:#ddd;border-radius:50%}.project-menu>div{color:#0f0f0f;background:#fff;border-color:#ddd;box-shadow:0 8px 24px #0002}.stage{background:#fff;border:1px solid #e5e5e5;border-radius:14px;padding:0;position:relative;overflow:hidden;box-shadow:0 1px 2px #0000000d}.stage-heading{color:#606060;background:#fff;border-color:#e5e5e5;flex-wrap:wrap;gap:12px;min-height:52px;padding:0 18px}.stage-label{color:#0f0f0f;font-size:13px;font-weight:500}.stage-layout-switch{background:#f2f2f2;border-radius:18px;align-items:center;gap:2px;margin-left:auto;padding:3px;display:flex}.stage-layout-switch>span{color:#606060;padding:0 7px;font-size:10px}.stage-layout-switch button{color:#606060;background:0 0;border-radius:14px;padding:5px 9px;font-size:10px}.stage-layout-switch button.active{color:#fff;background:#f03}.connection-status{color:#606060;font:400 11px var(--display);text-transform:none}.quad{background:#0f0f0f;gap:3px}.quad.grid-1{grid-template-columns:minmax(0,1fr)}.quad.grid-1 .video-host{height:clamp(360px,62vh,820px)}.quad.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.quad.grid-9{grid-template-columns:repeat(3,minmax(0,1fr))}.quad.grid-9 .video-host{height:clamp(140px,18vh,220px);min-height:140px}.quad.grid-9 .video-host iframe,.quad.grid-9 .video-host>div,.quad.grid-9 .empty-video{min-height:140px}.video-tile{background:#000;border:0;border-radius:0;position:relative}.video-tile.video-playing{box-shadow:inset 0 0 0 3px var(--track)}.video-host,.video-host:empty{background:#000}.video-caption{z-index:4;color:#fff;opacity:0;background:linear-gradient(#0000,#000d);border:0;min-height:50px;padding:20px 12px 8px;transition:opacity .16s;position:absolute;bottom:0;left:0;right:0}.video-tile:hover .video-caption,.video-tile:focus-within .video-caption{opacity:1}.video-name{font-size:12px;font-weight:500}.player-state{color:#ddd;font:400 10px var(--display);text-transform:none}.state-playing{color:#fff}.state-loading i,.state-buffering i{animation:none}.video-caption a{color:#fff}.video-error{color:#b91c1c;background:#fff2f2}.video-error button{color:#fff;background:#f03;border:0;border-radius:16px}.stage-hidden{pointer-events:none;opacity:0;width:320px;height:220px;top:0;left:-10000px;position:fixed!important}.empty-video{color:#777;background:#181818;border:0;border-radius:0}.empty-video>span:not(.empty-video-cross){font:500 28px var(--display)}.empty-video small{color:#aaa;text-transform:none;font-size:11px}.audience-loader{z-index:20;color:#fff;background:#0f0f0ff2;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:420px;display:flex;position:absolute;inset:52px 0 0}.audience-loader h2{margin:4px 0 0;font-size:22px}.audience-loader p{color:#bbb;margin:0 0 8px;font-size:13px}.audience-spinner{color:#f03;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.transport{color:#0f0f0f;background:#fff;border-color:#e5e5e5;border-radius:12px;box-shadow:0 1px 2px #0000000d}.play-button{color:#fff;background:#f03;border-radius:20px}.transport-position,.tempo-input input,.meter-input select,.bpm-readout{color:#0f0f0f}.transport-rule{background:#e5e5e5}.tempo-input,.meter-input,.play-mode{background:#f2f2f2;border-color:#ddd;border-radius:18px}.play-mode{color:#606060;align-items:center;gap:5px;padding:0 8px 0 11px;font-size:10px;display:flex}.play-mode select{color:#0f0f0f;appearance:none;background:0 0;border:0;outline:0;font-size:10px}.transport-status,.master-volume{color:#606060;font-family:var(--display);text-transform:none}.loop-toggle.enabled{color:#f03;background:#fff0f2}.arranger{background:#fff;border-color:#e5e5e5;border-radius:14px;overflow:hidden;box-shadow:0 1px 2px #0000000d}.arranger-heading{background:#fff;border-color:#e5e5e5}.arranger-heading h2{color:#0f0f0f}.arranger-heading h2 svg{color:#f03}.arranger-heading h2>span{color:#606060;font-family:var(--display);background:#f2f2f2}.separate-toggle{color:#606060;border-color:#ddd}.separate-toggle.selected{color:#0f0f0f;background:#eee;border-color:#ccc}.add-instrument-form{background:#fff7f8;border-color:#ffd5dc}.add-instrument-form>label{color:#0f0f0f;font:500 12px var(--display)}.add-instrument-form input{color:#0f0f0f;background:#fff;border-color:#ccc;border-radius:8px;font-size:13px}.add-instrument-form small{color:#606060}.arranger-toolbar{background:#fff;border-color:#e5e5e5}.toolbar-hint{color:#606060;margin-right:4px;font-size:11px}.toolbar-button{color:#606060;border-radius:16px}.toolbar-button.selected{color:#0f0f0f;background:#eee;border-color:#ddd}.grid-select{color:#606060;font:500 10px var(--display);text-transform:none}.grid-select select{color:#0f0f0f;font-family:var(--display);background:#f2f2f2;border-color:#ddd;border-radius:16px}.quantize-popover{color:#0f0f0f;background:#fff;border-color:#ddd;box-shadow:0 10px 30px #0002}.quantize-popover strong,.quantize-popover label{color:#0f0f0f;font-family:var(--display)}.quantize-popover select{color:#0f0f0f;background:#f2f2f2;border-color:#ddd}.zoom-tools button,.zoom-tools span{color:#606060;font-family:var(--display)}.instrument-list{background:#fafafa;border-color:#e5e5e5}.instrument-list-heading{color:#606060;font:500 10px var(--display);letter-spacing:0;border-color:#e5e5e5}.instrument-list-heading button{color:#0f0f0f;font-family:var(--display);background:#eee;border:0;border-radius:14px}.instrument-row{background:#fff;border-color:#e5e5e5}.instrument-row.selected-instrument{background:#f2f2f2}.track-select{color:#0f0f0f}.track-meta b{font-size:11px}.track-meta small,.instrument-number{color:#606060;font-family:var(--display)}.instrument-number{background:#eee;border-radius:50%;place-items:center;width:20px;height:20px;display:grid}.instrument-list-footer{color:#606060;font-family:var(--display)}.instrument-list-footer kbd{color:#0f0f0f;font-family:var(--display);background:#eee;border-color:#ddd}.replace-source-button{color:#065fd4;background:#eef5ff;border:0;border-radius:13px}.piano-content{background:#fff}.roll-heading,.separate-roll-label{color:#606060;font-family:var(--display);background:#fafafa;border-color:#e5e5e5}.ruler-row,.piano-ruler,.loop-ruler{background:#fafafa;border-color:#e5e5e5}.piano-ruler,.ruler-spacer{color:#606060;font-family:var(--display)}.piano-grid{cursor:crosshair;background-color:#fff}.piano-row{border-color:#ededed}.piano-row.shaded{background:#fafafa}.piano-row.c-row{background:#fff5f6}.selection-lasso{background:#065fd41a;border-color:#065fd4}.piano-playhead.active{background:#f03;box-shadow:0 0 7px #f036}.piano-playhead:before{border-top-color:#f03}.note-toolbar{color:#606060;font-family:var(--display);background:#fff;border-color:#e5e5e5}.note-toolbar>span:first-child,.note-toolbar button{color:#0f0f0f;font-family:var(--display)}.note-toolbar label input{color:#0f0f0f;font-family:var(--display);background:#f2f2f2;border-color:#ddd}.note-toolbar-hint{color:#777}.studio-footer,.studio-footer button,.studio-footer kbd{color:#606060;font-family:var(--display)}.synth-backdrop{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0003}.synth-panel{color:#0f0f0f;background:#fff;border-color:#e5e5e5;box-shadow:-10px 0 35px #0003}.synth-header{background:#fffffff5;border-color:#e5e5e5}.eyebrow,.synth-section-heading,.source-link{color:#606060;font-family:var(--display);letter-spacing:0}.synth-name label input{color:#0f0f0f;border-color:#ddd}.graph-guide{stroke:#d9d9d9}.envelope-graph text{fill:#606060;font-family:var(--display)}.synth-presets{background:#f2f2f2;border:0;border-radius:18px}.synth-presets button{color:#606060;border-radius:15px}.synth-presets button[aria-pressed=true]{color:#fff;box-shadow:none;background:#f03}.knob{background:conic-gradient(from 225deg,var(--track) 0deg,var(--track) var(--sweep),#ddd var(--sweep),#ddd 270deg,transparent 270deg)}.knob-body{background:#fff;border-color:#ccc;box-shadow:0 2px 4px #0002}.knob-label,.knob-control output,.range-endpoints,.synth-help,.synth-footnote{color:#606060;font-family:var(--display)}.per-key-toggle{color:#0f0f0f;align-items:center;gap:7px;font-size:11px;display:flex}.per-key-toggle input{accent-color:#f03}.synth-keys .white-key{color:#0f0f0f;background:#fff;border-color:#aaa}.synth-keys .black-key{color:#fff;background:#212121;border-color:#000;box-shadow:0 2px 3px #0003}.key-faders label,.key-faders output,.replace-source>label{color:#606060;font-family:var(--display)}.replace-source>div{background:#f2f2f2;border-color:#ddd;border-radius:8px}.replace-source input{color:#0f0f0f;font-family:var(--display)}.replace-source button{color:#fff;background:#f03;border-radius:16px}.replace-source p{color:#606060}.remove-instrument{color:#b91c1c;border-color:#e5e5e5}.toast,.undo-toast{color:#fff;background:#212121;border:0;border-radius:8px;box-shadow:0 8px 30px #0004}.undo-toast button{color:#ff8aa1}dialog{color:#0f0f0f;background:#fff;border-color:#ddd}dialog::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0005}.share-dialog h2,.help-dialog h2{color:#0f0f0f}.share-dialog p,.help-dialog p{color:#606060}@media (width<=700px){.toolbar-hint{flex-basis:100%}.audience-loader{min-height:260px}.stage-layout-switch{order:3;margin:0}.quad.grid-9 .video-host,.quad.grid-9 .empty-video{height:110px;min-height:110px}}.artist-mode .workspace{flex-direction:column;width:100%;max-width:none;margin:0;padding-inline:24px;transition:width .2s;display:flex}.artist-mode,.artist-mode *{-webkit-user-select:none;user-select:none}.artist-mode input:not([type=range]):not([type=color]),.artist-mode textarea,.artist-mode [contenteditable=true]{-webkit-user-select:text;user-select:text}.artist-mode a,.artist-mode img,.artist-mode svg{-webkit-user-drag:none;user-drag:none}.artist-mode .session-heading{order:0}.artist-mode .transport{z-index:35;order:1;position:sticky;top:64px;box-shadow:0 5px 18px #00000014}.artist-mode .arranger{order:2;margin-bottom:28px}.artist-mode .stage{order:3}.artist-mode .playback-help{order:4}.artist-mode .studio-footer{order:5}.zoom-tools .fit-song{border:1px solid #ddd;border-radius:15px;gap:6px;width:auto;margin-right:5px;padding:0 9px;display:inline-flex}.zoom-tools .fit-song span{min-width:0;font-size:9px}.midi-quick-tools{background:#fafafa;border-bottom:1px solid #e5e5e5;align-items:center;gap:12px;min-height:42px;padding:6px 16px;display:flex}.midi-quick-tools .edit-tools{background:#eee;border-color:#ddd}.midi-quick-tools .edit-tools button{color:#606060;gap:5px;width:auto;padding:0 9px;display:flex}.midi-quick-tools .edit-tools button.selected{color:#fff;background:#f03}.midi-quick-tools .edit-tools span{font-size:9px}.pencil-hint{color:#777;font-size:10px}.snap-boundaries{align-items:center;gap:3px;margin-left:auto;display:flex}.snap-boundaries>span,.snap-boundaries small{color:#777;margin-inline:4px;font-size:8px}.snap-boundaries button{color:#606060;background:#eee;border-radius:13px;padding:5px 9px;font-size:9px}.snap-boundaries button.selected{color:#fff;background:#065fd4}.snap-boundaries.disabled{opacity:.48}.piano-grid.pencil-mode{cursor:cell}@media (width>=901px){.artist-mode.inspector-open .workspace,.artist-mode.inspector-open .topbar{width:calc(100% - 420px)}.artist-mode .synth-backdrop{pointer-events:none;background:0 0;width:420px;left:auto}.artist-mode .synth-panel{pointer-events:auto}}.quad.grid-4,.quad.grid-9{grid-auto-flow:row;align-items:stretch}.quad.grid-4{grid-auto-rows:clamp(220px,25vw,420px)}.quad.grid-9{grid-auto-rows:clamp(145px,16vw,250px)}.quad.grid-4 .video-tile,.quad.grid-4 .empty-video,.quad.grid-9 .video-tile,.quad.grid-9 .empty-video{height:100%;min-height:0}.quad.grid-4 .video-host,.quad.grid-9 .video-host{flex:1;height:100%;min-height:0}.quad.grid-4 .video-host iframe,.quad.grid-4 .video-host>div,.quad.grid-9 .video-host iframe,.quad.grid-9 .video-host>div{min-height:0}.video-host iframe{pointer-events:none}.performance-mode .quad.grid-1{grid-template-rows:minmax(0,1fr)}.performance-mode .quad.grid-4{grid-template-rows:repeat(2,minmax(0,1fr))}.performance-mode .quad.grid-9{grid-template-rows:repeat(3,minmax(0,1fr))}.performance-mode .quad.grid-4,.performance-mode .quad.grid-9{grid-auto-rows:minmax(0,1fr)}.arranger-actions{position:relative}.first-video-dimmer{z-index:70;pointer-events:none;background:#0008;position:fixed;inset:0}.first-video-target{z-index:72;position:relative;box-shadow:0 0 0 5px #fff4,0 0 28px #f038}.first-video-coach{z-index:72;color:#fff;text-align:center;white-space:nowrap;filter:drop-shadow(0 3px 8px #000);flex-direction:column;align-items:center;gap:2px;animation:1.15s ease-in-out infinite first-video-bounce;display:flex;position:absolute;top:calc(100% + 14px);right:-4px}.first-video-coach strong{font-size:15px}.first-video-coach span{color:#ddd;font-size:10px}@keyframes first-video-bounce{50%{transform:translateY(7px)}}.social-share-actions{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.social-share-actions .button{flex:1;min-width:120px}.embed-label{color:#606060;margin:20px 0 -12px;font-size:10px;font-weight:500;display:block}.embed-code{margin-top:16px}.embed-code .button{flex-shrink:0}.embed-session .topbar,.embed-session .session-heading,.embed-session .mini-roll{display:none}.embed-session .workspace{padding:0}.embed-session .stage{min-height:100dvh}.embed-session .quad{border-radius:0}.embed-session .transport{z-index:25;margin:8px;position:fixed;bottom:0;left:0;right:0}.theme-dark{color:#f1f1f1;background:#0f0f0f}.theme-dark .topbar,.theme-dark .stage,.theme-dark .stage-heading,.theme-dark .transport,.theme-dark .arranger,.theme-dark .arranger-heading,.theme-dark .arranger-toolbar,.theme-dark .piano-content,.theme-dark .note-toolbar,.theme-dark .synth-panel,.theme-dark .synth-header,.theme-dark dialog{color:#f1f1f1;background:#181818;border-color:#303030}.theme-dark .project-title,.theme-dark .stage-label,.theme-dark .transport-position,.theme-dark .tempo-input input,.theme-dark .meter-input select,.theme-dark .bpm-readout,.theme-dark .arranger-heading h2,.theme-dark .track-select,.theme-dark .note-toolbar>span:first-child,.theme-dark .note-toolbar button,.theme-dark .per-key-toggle,.theme-dark .share-dialog h2,.theme-dark .help-dialog h2,.theme-dark .replicate-dialog h2{color:#f1f1f1}.theme-dark .session-heading p,.theme-dark .session-eyebrow,.theme-dark .section-index,.theme-dark .stage-heading,.theme-dark .connection-status,.theme-dark .transport-status,.theme-dark .master-volume,.theme-dark .toolbar-hint,.theme-dark .grid-select,.theme-dark .track-meta small,.theme-dark .instrument-number,.theme-dark .instrument-list-footer,.theme-dark .roll-heading,.theme-dark .separate-roll-label,.theme-dark .piano-ruler,.theme-dark .ruler-spacer,.theme-dark .note-toolbar,.theme-dark .studio-footer,.theme-dark .studio-footer button,.theme-dark .knob-label,.theme-dark .knob-control output,.theme-dark .range-endpoints,.theme-dark .synth-help,.theme-dark .synth-footnote,.theme-dark .key-faders label,.theme-dark .key-faders output,.theme-dark .replace-source>label,.theme-dark .replace-source p,.theme-dark .share-dialog p,.theme-dark .help-dialog p,.theme-dark .replicate-dialog>p,.theme-dark .embed-label{color:#aaa}.theme-dark .mode-switch,.theme-dark .tempo-input,.theme-dark .meter-input,.theme-dark .play-mode,.theme-dark .stage-layout-switch,.theme-dark .synth-presets,.theme-dark .replace-source>div{background:#272727;border-color:#3f3f3f}.theme-dark .mode-switch button.active{color:#f1f1f1;box-shadow:none;background:#3f3f3f}.theme-dark .icon-button{color:#aaa}.theme-dark .icon-button:hover{color:#fff;background:#272727}.theme-dark .button:not(.button-primary){color:#f1f1f1;background:#272727;border-color:#3f3f3f}.theme-dark .project-menu>div,.theme-dark .quantize-popover{color:#f1f1f1;background:#212121;border-color:#3f3f3f}.theme-dark .add-instrument-form{background:#28171a;border-color:#5a2931}.theme-dark .add-instrument-form>label,.theme-dark .quantize-popover strong,.theme-dark .quantize-popover label{color:#f1f1f1}.theme-dark input:not([type=range]):not([type=color]),.theme-dark select{color:#f1f1f1;background-color:#272727;border-color:#484848}.theme-dark .instrument-list,.theme-dark .midi-quick-tools,.theme-dark .roll-heading,.theme-dark .ruler-row,.theme-dark .piano-ruler,.theme-dark .loop-ruler{color:#aaa;background:#212121;border-color:#303030}.theme-dark .instrument-row{background:#181818;border-color:#303030}.theme-dark .instrument-row.selected-instrument{background:#272727}.theme-dark .instrument-list-heading{color:#aaa;border-color:#303030}.theme-dark .instrument-list-heading button,.theme-dark .instrument-number,.theme-dark .instrument-list-footer kbd{color:#f1f1f1;background:#333;border-color:#484848}.theme-dark .midi-quick-tools .edit-tools,.theme-dark .snap-boundaries button{color:#aaa;background:#272727;border-color:#484848}.theme-dark .midi-quick-tools .edit-tools button.selected{color:#fff;background:#f03}.theme-dark .snap-boundaries button.selected{color:#fff;background:#065fd4}.theme-dark .piano-grid{background-color:#181818}.theme-dark .piano-row{border-color:#303030}.theme-dark .piano-row.shaded{background:#212121}.theme-dark .piano-row.c-row{background:#2a171a}.theme-dark .knob{background:conic-gradient(from 225deg,var(--track) 0deg,var(--track) var(--sweep),#484848 var(--sweep),#484848 270deg,transparent 270deg)}.theme-dark .knob-body{background:#212121;border-color:#555}.theme-dark .synth-keys .white-key{color:#181818;background:#f1f1f1}.theme-dark .share-url{background:#212121;border-color:#484848}.theme-dark .share-url input{color:#ddd;background:0 0}.theme-dark .share-note{color:#aaa;border-color:#3f3f3f}.theme-dark .share-emblem{color:#ff6680;background:#321a1f;border-color:#6b2d38}.theme-dark .replicate-options button{color:#f1f1f1;background:#272727;border-color:#484848}.theme-dark .replicate-options button:hover:not(:disabled){background:#f03;border-color:#f03}.theme-dark .replicate-note{border-color:#3f3f3f}.theme-dark .instrument-master-fader{background:#28171a;border-color:#5a2931}.theme-dark .instrument-master-fader p{color:#aaa}.theme-dark dialog::backdrop{background:#0009}.piano-row,.piano-row.shaded,.piano-row.c-row{background-color:#fff;background-image:inherit;background-position:inherit;background-size:inherit}.theme-dark .piano-row,.theme-dark .piano-row.shaded,.theme-dark .piano-row.c-row{background-color:#181818}.roll-unit[data-active-pitch="9"] .piano-row:first-child,.roll-unit[data-active-pitch="8"] .piano-row:nth-child(2),.roll-unit[data-active-pitch="7"] .piano-row:nth-child(3),.roll-unit[data-active-pitch="6"] .piano-row:nth-child(4),.roll-unit[data-active-pitch="5"] .piano-row:nth-child(5),.roll-unit[data-active-pitch="4"] .piano-row:nth-child(6),.roll-unit[data-active-pitch="3"] .piano-row:nth-child(7),.roll-unit[data-active-pitch="2"] .piano-row:nth-child(8),.roll-unit[data-active-pitch="1"] .piano-row:nth-child(9),.roll-unit[data-active-pitch="0"] .piano-row:nth-child(10){background-color:color-mix(in srgb,var(--track) 11%,#fff)}.theme-dark .roll-unit[data-active-pitch] .piano-row{background-image:inherit}.theme-dark .roll-unit[data-active-pitch="9"] .piano-row:first-child,.theme-dark .roll-unit[data-active-pitch="8"] .piano-row:nth-child(2),.theme-dark .roll-unit[data-active-pitch="7"] .piano-row:nth-child(3),.theme-dark .roll-unit[data-active-pitch="6"] .piano-row:nth-child(4),.theme-dark .roll-unit[data-active-pitch="5"] .piano-row:nth-child(5),.theme-dark .roll-unit[data-active-pitch="4"] .piano-row:nth-child(6),.theme-dark .roll-unit[data-active-pitch="3"] .piano-row:nth-child(7),.theme-dark .roll-unit[data-active-pitch="2"] .piano-row:nth-child(8),.theme-dark .roll-unit[data-active-pitch="1"] .piano-row:nth-child(9),.theme-dark .roll-unit[data-active-pitch="0"] .piano-row:nth-child(10){background-color:color-mix(in srgb,var(--track) 18%,#181818)}.roll-unit[data-active-pitch="9"] .piano-keyboard button:first-child,.roll-unit[data-active-pitch="8"] .piano-keyboard button:nth-child(2),.roll-unit[data-active-pitch="7"] .piano-keyboard button:nth-child(3),.roll-unit[data-active-pitch="6"] .piano-keyboard button:nth-child(4),.roll-unit[data-active-pitch="5"] .piano-keyboard button:nth-child(5),.roll-unit[data-active-pitch="4"] .piano-keyboard button:nth-child(6),.roll-unit[data-active-pitch="3"] .piano-keyboard button:nth-child(7),.roll-unit[data-active-pitch="2"] .piano-keyboard button:nth-child(8),.roll-unit[data-active-pitch="1"] .piano-keyboard button:nth-child(9),.roll-unit[data-active-pitch="0"] .piano-keyboard button:nth-child(10){color:#fff;background:var(--track);box-shadow:inset -4px 0 #fff8}@media (width<=900px){.artist-mode .workspace{padding-inline:12px}.first-video-coach{right:0}.quad.grid-4{grid-auto-rows:clamp(170px,40vw,300px)}.quad.grid-9{grid-auto-rows:clamp(100px,25vw,180px)}.midi-quick-tools{flex-wrap:wrap}.pencil-hint{flex-basis:100%;order:3}.sample-loading-overlay{width:100%}}@media (width<=520px){.replicate-dialog{padding:20px}.replicate-options{grid-template-columns:1fr}.replicate-options button{flex-direction:row;justify-content:space-between;padding:11px 14px}}.landing-page{color:var(--text);background:var(--bg);min-height:100dvh}.landing-header{z-index:20;background:color-mix(in srgb, var(--panel) 94%, transparent);border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);justify-content:space-between;align-items:center;height:64px;padding:0 clamp(20px,5vw,72px);display:flex;position:sticky;top:0}.landing-brand{letter-spacing:-.6px;align-items:center;gap:10px;font-size:19px;font-weight:700;display:flex}.landing-brand>span{color:#fff;background:#f03;border-radius:10px;place-items:center;width:39px;height:31px;display:grid}.landing-header>div{align-items:center;gap:10px;display:flex}.landing-theme{color:var(--muted);background:0 0;border-radius:50%;place-items:center;width:38px;height:38px;display:grid}.landing-theme:hover{background:color-mix(in srgb, var(--text) 7%, transparent)}.landing-page main{width:min(1180px,100% - 40px);margin:auto}.landing-hero{text-align:center;flex-direction:column;align-items:center;padding:clamp(75px,11vw,140px) 20px clamp(70px,9vw,115px);display:flex}.landing-kicker{color:#f03;letter-spacing:1.7px;align-items:center;gap:8px;font-size:11px;font-weight:700;display:flex}.landing-hero h1{letter-spacing:clamp(-3px,-.3vw,-1px);max-width:850px;margin:19px 0 21px;font-size:clamp(48px,8vw,91px);line-height:.98}.landing-hero p{color:var(--muted);max-width:610px;margin:0 0 31px;font-size:clamp(15px,2vw,19px);line-height:1.55}.landing-create{color:#fff;background:#f03;border-radius:999px;justify-content:center;align-items:center;gap:10px;min-height:50px;padding:0 24px;font-size:15px;font-weight:700;display:inline-flex;box-shadow:0 9px 25px #ff00332e}.landing-create.compact{min-height:38px;padding:0 17px;font-size:12px}.chart-section{background:var(--panel);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 8px 35px #0000000a}.chart-heading{justify-content:space-between;align-items:flex-end;gap:24px;padding:32px 34px 26px;display:flex}.chart-heading>div:first-child>span{color:#f03;letter-spacing:1.3px;align-items:center;gap:7px;font-size:10px;font-weight:700;display:flex}.chart-heading h2{letter-spacing:-.8px;margin:8px 0 5px;font-size:clamp(25px,3vw,34px)}.chart-heading p{color:var(--muted);margin:0;font-size:11px}.chart-sizes{background:var(--bg);border:1px solid var(--line);border-radius:999px;gap:3px;padding:4px;display:flex}.chart-sizes button{color:var(--muted);background:0 0;border-radius:999px;padding:8px 13px;font-size:11px;font-weight:500}.chart-sizes button.selected{color:#fff;background:#f03}.tune-chart{margin:0;padding:0;list-style:none}.tune-chart li{border-top:1px solid var(--line)}.tune-chart a{grid-template-columns:45px 126px minmax(0,1fr) auto 20px;align-items:center;gap:20px;min-height:103px;padding:12px 32px;transition:background .14s;display:grid}.tune-chart a:hover{background:color-mix(in srgb, var(--text) 3.5%, transparent)}.chart-rank{color:var(--quiet);text-align:right;font-variant-numeric:tabular-nums;font-size:18px;font-weight:700}.chart-thumbnail{color:var(--quiet);background:var(--bg);aspect-ratio:16/9;border-radius:9px;place-items:center;width:126px;display:grid;position:relative;overflow:hidden}.chart-thumbnail img{object-fit:cover;width:100%;height:100%}.chart-thumbnail i{color:#fff;opacity:0;background:#f03;border-radius:50%;place-items:center;width:38px;height:38px;transition:opacity .14s,transform .14s;display:grid;position:absolute;transform:scale(.85)}.tune-chart a:hover .chart-thumbnail i{opacity:1;transform:scale(1)}.chart-title{min-width:0}.chart-title strong{text-overflow:ellipsis;white-space:nowrap;font-size:15px;display:block;overflow:hidden}.chart-title small{color:var(--muted);margin-top:8px;font-size:10px;display:block}.chart-views{color:var(--muted);font-variant-numeric:tabular-nums;align-items:center;gap:6px;min-width:82px;font-size:12px;display:flex}.chart-views small{color:var(--quiet);font-size:9px}.chart-open{color:var(--quiet)}.chart-message{color:var(--muted);border-top:1px solid var(--line);flex-direction:column;justify-content:center;align-items:center;gap:9px;min-height:230px;padding:35px;font-size:12px;display:flex}.chart-message strong{color:var(--text);font-size:17px}.chart-message a,.chart-message button{color:#f03;background:0 0;font-weight:700}.chart-error{color:#c92b46}.chart-spinner{color:#f03;animation:.8s linear infinite landing-spin}@keyframes landing-spin{to{transform:rotate(360deg)}}.landing-bottom{text-align:center;flex-direction:column;align-items:center;gap:20px;padding:105px 20px;display:flex}.landing-bottom h2{letter-spacing:-1.2px;margin:0;font-size:clamp(30px,5vw,50px)}.landing-footer{color:var(--muted);border-top:1px solid var(--line);grid-template-columns:auto minmax(300px,720px) auto;justify-content:space-between;align-items:center;gap:30px;padding:27px clamp(20px,5vw,72px);font-size:9px;line-height:1.55;display:grid}.landing-footer p{margin:0}.landing-footer p:first-child{color:var(--text);white-space:nowrap;font-weight:700}.landing-footer a{white-space:nowrap;align-items:center;gap:5px;font-weight:500;display:flex}@media (width<=720px){.landing-header{padding-inline:16px}.landing-create.compact{padding:0 12px}.landing-page main{width:min(100% - 24px,1180px)}.landing-hero{padding-inline:0}.chart-heading{flex-direction:column;align-items:flex-start;padding:25px 20px 20px}.tune-chart a{grid-template-columns:30px 86px minmax(0,1fr) 16px;gap:11px;min-height:83px;padding:10px 14px}.chart-thumbnail{width:86px}.chart-views{grid-column:3;gap:5px;min-width:0;margin-top:-22px;font-size:10px}.chart-open{grid-area:1/4/span 2}.chart-title strong{font-size:13px}.chart-title small{margin-top:5px;font-size:8px}.landing-footer{grid-template-columns:1fr;gap:11px}}