:root{--grid:#b7a69124;--grid-strong:#b5a08b40;--part-selected:#e8dfed;--part-border:#c3adca;--pitch-soft:#b7a6d428}.canvas-bar{height:47px;flex-shrink:0;display:flex;align-items:center;gap:9px;padding:0 4px 9px}.canvas-bar .icon-button{height:34px;width:38px;border-radius:12px}.draw-modes{display:flex;gap:3px;padding:3px;border-radius:16px;background:var(--dock);box-shadow:inset 0 1px 2px #ffffff80}.draw-modes .icon{width:19px;height:19px}.canvas-bar [aria-pressed=true]{background:var(--part-selected);color:#9680a7}.parts-toggle{margin-left:auto}.parts-toggle[aria-expanded=true]{background:var(--part-selected);color:#9680a7}.workspace{display:flex;flex:1;min-height:110px;min-width:0;gap:8px}.workspace .paper{flex:1;min-width:0;min-height:0}.pitch-scale{position:relative;width:70px;flex-shrink:0;user-select:none;color:var(--ink);font-variant-numeric:tabular-nums}.pitch-band{position:absolute;right:0;left:24px;display:flex;align-items:center;justify-content:flex-end;padding-right:8px;font-size:11px;border-top:1px solid var(--grid);border-radius:6px}.pitch-band.active{background:var(--pitch-soft);color:var(--ink);box-shadow:inset -2px 0 var(--stroke)}.pitch-band.root{font-weight:650}.register-label{position:absolute;left:0;font-size:10px;letter-spacing:.4px;writing-mode:vertical-rl;transform:rotate(180deg);opacity:.55;display:flex;align-items:center;justify-content:center;border-right:2px solid var(--part-border);border-radius:4px;padding:0 5px}.pitch-hint{position:absolute;top:17px;left:19px;pointer-events:none;z-index:3;background:var(--dock);border:1px solid var(--grid);border-radius:13px;padding:7px 11px;display:flex;gap:9px;align-items:center;font-size:12px;color:var(--ink);box-shadow:0 3px 10px rgba(var(--shadow),.05)}.pitch-hint small{font-size:10px;opacity:.65}.paper[data-mode=pixels]:before{opacity:.25}.paper[data-mode=pixels]:not(.erasing) .cursor{width:var(--cell);height:var(--cell);margin:calc(var(--cell) / -2) 0 0 calc(var(--cell) / -2);border-radius:3px;background:color-mix(in srgb,var(--stroke) 15%,transparent);border:1px solid var(--stroke)}.timeline{height:92px;flex-shrink:0;display:flex;align-items:center;gap:13px;padding:12px 5px 0}.sequence-play{width:65px;height:66px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#9e83aa;background:var(--dock);border-radius:20px;border:1px solid var(--grid);box-shadow:inset 0 1px 2px #ffffff40,0 3px 8px rgba(var(--shadow),.06)}.sequence-play .icon{height:24px;width:24px}.sequence-play small{font-size:10px;font-variant-numeric:tabular-nums;color:var(--ink);opacity:.65}.sequence-play[aria-pressed=true]{background:var(--part-selected);border-color:var(--part-border)}.part-list{position:relative;display:flex;align-items:center;gap:9px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--part-border) transparent;padding:5px 8px 7px;margin:0 -6px}.part-tab{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:4px;background:transparent;color:var(--ink);border-radius:15px;padding:0;font-size:10px;opacity:.7;touch-action:pan-x;cursor:grab;transition:transform .18s}.part-tab canvas{position:static;inset:auto;touch-action:auto;cursor:grab;display:block;width:104px;height:52px;background:var(--paper);border:1px solid var(--grid-strong);border-radius:12px;transition:border-color .2s,box-shadow .2s}.part-tab.drag-lift{position:relative;z-index:6;opacity:1;cursor:grabbing}.part-tab.drag-lift canvas{cursor:grabbing;border-color:var(--part-border);box-shadow:0 10px 24px rgba(var(--shadow),.26),0 0 0 2px var(--part-selected)}.part-list.dragging-part{scroll-behavior:auto;user-select:none}.part-tab[aria-selected=true]{opacity:1}.part-tab[aria-selected=true] canvas{border-color:var(--part-border);box-shadow:0 0 0 2px var(--part-selected)}.part-tab[data-playing=true] canvas{box-shadow:0 0 0 2px var(--stroke);border-color:var(--stroke)}.part-tab[data-enabled=false] canvas{opacity:.35}.part-tab[data-enabled=false] span{text-decoration:line-through}.part-actions{display:flex;gap:2px;flex-shrink:0}.part-actions .icon-button{width:32px;height:36px;border-radius:12px}.part-actions .icon{width:17px;height:17px}.part-actions [aria-pressed=true]{background:var(--pitch-soft)}:root[data-theme=dark]{--grid:#e0cde518;--grid-strong:#d0b6dd2e;--part-selected:#443849;--part-border:#987ba7;--pitch-soft:#b7a6d422}:root[data-theme=dark] .draw-modes{box-shadow:inset 0 1px 2px #ffffff08}:root[data-theme=dark] .sequence-play{color:#d1b4e4;box-shadow:inset 0 1px 2px #ffffff08,0 3px 8px #0002}:root[data-theme=dark] .canvas-bar [aria-pressed=true],:root[data-theme=dark] .parts-toggle[aria-expanded=true]{color:#e2c8e8}@media (max-width:1050px){.part-actions{display:grid;grid-template-columns:repeat(3,32px)}.timeline{gap:8px}.pitch-scale{width:58px}.pitch-band{padding-right:5px;left:20px}.register-label{padding:0 3px}.workspace{gap:4px}}@media (max-height:680px){.canvas-bar{height:40px}.timeline{height:82px}.part-tab canvas{height:44px;width:88px}.sequence-play{height:58px}}@media (max-width:540px){.pitch-scale{width:46px}.pitch-band{font-size:9px;padding-right:3px;left:16px}.register-label{font-size:8px;padding:0 1px}.part-actions{grid-template-columns:repeat(3,26px)}.part-actions .icon-button{width:26px;height:30px}.part-tab canvas{width:76px;height:42px}.timeline{height:78px;gap:6px}.sequence-play{width:48px;height:54px}.canvas-bar{height:42px}}