.history-controls{display:flex;margin-left:15px;gap:3px}.history-controls button{border:0;color:var(--muted);font-size:18px;padding:5px;width:29px}.history-controls button:disabled{opacity:.2;cursor:default}.history-list{max-height:300px;overflow:auto;margin:15px 0}.history-entry{display:flex;align-items:center;justify-content:space-between;width:100%;gap:15px;text-align:left;border:0;border-bottom:1px solid #37412d;border-radius:0;padding:12px 3px;font-size:13px}.history-entry small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.history-entry.current{color:var(--acid);background:#c3f66d08}.vapor-preset .preset-art{background:linear-gradient(130deg,#779e9c,#b99bbd);color:#e9ddd8}.vapor-choice{color:#d5b0d8!important}.library .import-button{height:65px;margin-bottom:24px;background:#c3f66d0a;border:1px dashed #52673c;color:var(--acid)}.library .import-button small{font-size:8px;letter-spacing:.5px}.chromatic-view{flex:1;min-height:280px;overflow:auto;background:#141813;padding:25px 25px 15px;position:relative}.chromatic-top{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.chromatic-top h2{font-family:'Space Grotesk';font-size:25px;letter-spacing:-1px;font-weight:400;margin:12px 0 5px}.chromatic-top p{font-size:12px;color:var(--muted);margin:7px 0 20px}.chromatic-top .small-button{white-space:nowrap;margin-top:4px}.chromatic-body{display:grid;grid-template-columns:1fr 270px;gap:22px}.color-field{background:#e6e0cb;min-height:290px;overflow:hidden;position:relative;border:1px solid #424d38;border-radius:3px;display:flex;align-items:center;justify-content:center}.color-field.drag-over{outline:2px solid var(--acid)}.palette-composition{position:absolute;inset:0;overflow:hidden}.color-orbit{position:absolute;transform:translate(-35%,-25%);border-radius:50%;background:var(--c);mix-blend-mode:multiply;display:flex;align-items:center;justify-content:center;border:1px solid #0004}.color-orbit:nth-child(2){border-radius:1px;transform:rotate(-25deg) translate(-25%,-25%)}.color-orbit:nth-child(3){background:transparent;border:22px solid var(--c)}.color-orbit:nth-child(4){border-radius:0;clip-path:polygon(0 100%,50% 0,100% 100%)}.color-orbit span{font-family:'Space Grotesk';font-size:14px;mix-blend-mode:normal;color:#ece6d7;opacity:.8}.color-crosshair{position:absolute;inset:12% 16%;border-left:1px solid #3338;border-bottom:1px solid #3338;transform:rotate(14deg);pointer-events:none}.color-field-caption{position:absolute;bottom:14px;left:16px;font-size:8px;letter-spacing:2px;color:#3d4938}.source-image{max-width:100%;max-height:320px;object-fit:contain}.swatches{display:flex;justify-content:space-between;gap:8px}.swatch{display:flex;flex-direction:column;gap:9px;align-items:center;min-width:0;flex:1}.swatch input{width:100%;height:47px;padding:0;border:0;border-radius:3px;background:none;cursor:pointer}.swatch input::-webkit-color-swatch-wrapper{padding:0}.swatch input::-webkit-color-swatch{border:0;border-radius:3px}.swatch span{font-size:8px;font-family:monospace;color:var(--muted)}.swatch b{font-family:'Space Grotesk';font-size:12px;font-weight:400;color:#cad7bd}.color-settings{display:flex;gap:10px;margin-top:23px}.color-settings label{flex:1;font-size:10px;color:var(--muted)}.color-settings select{width:100%;margin-top:5px;font-size:12px}.color-motion{display:flex;gap:12px;align-items:center;font-size:11px;color:var(--muted);margin-top:15px}.color-motion input{width:100%}.color-mapping{display:grid;grid-template-columns:1fr 1fr;font-size:9px;color:#77866b;gap:9px;letter-spacing:.4px;margin:20px 0}.color-mapping b{color:#b9c7ad;font-weight:400;display:block;margin-top:3px;font-size:11px}.palette-controls>.primary{width:100%;font-size:12px}.palette-controls>.muted-info{font-size:10px}.chromatic-footer{display:flex;justify-content:space-between;margin-top:17px;gap:10px;font-size:8px;letter-spacing:1.2px;color:#6a7a5d}.chromatic-footer span:last-child{letter-spacing:0}.workspace-toolbar .view-tabs{gap:17px}.view-tabs button{font-size:12px}.node[style*="--node-color"]{--color:var(--node-color)}@media(max-width:1250px){.history-controls{margin-left:auto;gap:0}.history-controls button{font-size:17px;width:25px}.workspace-toolbar{padding:0 12px;gap:7px}.workspace-toolbar .small-button{margin-left:3px}.chromatic-body{grid-template-columns:1fr}.color-field{min-height:220px}.palette-controls{padding-bottom:15px}.chromatic-top{display:block}.chromatic-top .small-button{margin:0 0 15px}.chromatic-footer{display:none}}@media(max-width:760px){.workspace-toolbar .view-tabs{gap:13px}.workspace-toolbar .view-tabs button{font-size:12px}.workspace-toolbar #fitBtn{display:none}.history-controls{margin-left:auto}.history-controls #historyBtn{display:none}.workspace-toolbar #addNodeBtn{padding:6px;font-size:11px}.chromatic-view{padding:19px}.chromatic-top h2{font-size:25px}.color-field{min-height:210px}.chromatic-top .small-button{font-size:12px}.chromatic-body{gap:15px}.color-settings label,.color-mapping{font-size:12px}.palette-controls>.primary{font-size:14px;padding:12px}.swatch span{font-size:10px}.swatch b{font-size:14px}.library .import-button{font-size:14px}.library .import-button small{font-size:10px}.library-bottom .text-button{font-size:14px}.history-entry{font-size:14px}.history-entry small{font-size:12px}}
.zoom-controls{position:absolute;right:18px;bottom:35px;display:flex;background:#1c2318;border:1px solid #414e35;border-radius:5px;z-index:4;box-shadow:0 5px 15px #0005}.zoom-controls button{border:0;border-radius:0;font-size:13px;padding:7px 10px;color:#aabb9a}.zoom-controls #zoomFit{font-size:11px;min-width:48px}.sound-card strong,.preset-card,.text-button,.control-head,.control output,.control select,.toggle-row{font-size:14px}.node-title{font-size:13px;max-width:132px}.node-caption,.node-values,.node-footer{font-size:11px}.inspector-title p,.muted-info{font-size:12px}.view-tabs button{font-size:14px}.inspector-section{padding-top:20px;padding-bottom:20px}.inspector-title h3{font-size:21px}.timeline-row,.timeline-ruler{grid-template-columns:130px 1fr}.track-label{font-size:12px}.clip span{font-size:10px}.sound-card{gap:7px;grid-template-columns:26px 1fr 12px}.library-bottom .text-button{font-size:13px}.statusbar{font-size:10px}.node{width:192px}.panel-heading h2,.arrangement h2{font-size:11px}.topbar .wordmark small{font-size:10px}.import-button{font-size:14px!important}.canvas-annotation>span:last-child{font-size:12px}.canvas-annotation .tiny-label{font-size:11px}.color-field-caption,.chromatic-footer{font-size:10px}.color-mapping{font-size:11px}.color-settings label,.color-motion{font-size:12px}.palette-controls>.muted-info{font-size:12px}.swatch span{font-size:10px}dialog p,dialog li{font-size:14px}dialog .fineprint{font-size:12px}dialog label{font-size:13px}.history-entry small{font-size:12px}@media(max-width:760px){.node{width:190px}.statusbar{font-size:9px}.timeline-row,.timeline-ruler{grid-template-columns:104px 1fr}.track-label{font-size:11px}.zoom-controls{bottom:29px;right:14px}.color-field-caption{font-size:9px}.top-actions>#exportBtn span:after{content:'Export'}.studio{min-height:400px}.patch-view{min-height:220px}.workspace-toolbar .view-tabs button{font-size:12px}.topbar{position:sticky;top:0;z-index:8}.library-bottom{padding-bottom:40px}}
.workspace.chromatic-active .arrangement{display:none}.workspace.chromatic-active .color-field{min-height:340px}.color-orbit span{color:#152313;text-shadow:0 0 10px #ffffff70}.workspace.chromatic-active .chromatic-view{padding-bottom:28px}@media(max-width:760px){.workspace.chromatic-active .color-field{min-height:230px}}

/* Kandinsky-inspired color × shape orchestration */
.orchestration-composition{background:#e7dfc8}
.orchestration-mark{position:absolute;transform:translate(-50%,-50%);width:var(--size);height:var(--size);display:grid;place-items:center;color:var(--c);mix-blend-mode:multiply;animation:orchestration-breathe calc(7s + var(--i)*.8s) ease-in-out infinite alternate;pointer-events:none}
.orchestration-mark .shape-symbol{font-family:'Space Grotesk',sans-serif;font-size:clamp(42px,8vw,112px);line-height:1;text-shadow:0 0 16px #fff8;font-weight:400}
.orchestration-mark .shape-note{position:absolute;bottom:10%;left:50%;transform:translateX(-50%);font-family:'Space Grotesk';font-size:11px;color:#1d271b;background:#f1ead5bd;padding:2px 5px;border-radius:10px}
.orchestration-mark small{position:absolute;top:8%;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:8px;color:#293126;background:#f1ead59c;padding:2px 5px}
.shape-point{animation:orchestration-point 6.8s ease-in-out infinite}
.shape-line{animation:orchestration-line 7.2s linear infinite}
.shape-curve{animation:orchestration-curve 8s ease-in-out infinite}
.shape-zigzag{animation:orchestration-zigzag 1.5s steps(4,end) infinite}
.shape-triangle{animation:orchestration-triangle 2.8s ease-out infinite}
.shape-circle{animation:orchestration-circle 9s linear infinite}
.shape-square{animation:orchestration-square 3.4s steps(2,end) infinite}
.orchestration-swatch select{width:100%;font-size:10px;padding:5px 4px}
.orchestration-legend,.shape-legend{display:grid;grid-template-columns:1fr 1fr;gap:7px 9px;margin:16px 0;font-size:9px;color:#87927f}
.orchestration-legend span,.shape-legend span{border:1px solid #36402f;padding:7px;border-radius:4px;min-width:0}
.orchestration-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--legend);margin-right:5px}
.orchestration-legend b,.shape-legend b{display:block;color:#c6d1bd;font-weight:500;margin-top:3px}
.shape-legend small{display:block;color:#77836e;margin-top:4px;line-height:1.25}
.long-press-armed{box-shadow:inset 0 0 0 1px #d7e7bf55!important}
@keyframes orchestration-breathe{from{transform:translate(-50%,-50%) scale(.90)}to{transform:translate(-50%,-50%) scale(1.06)}}
@keyframes orchestration-point{0%,38%,63%,100%{opacity:.16;transform:translate(-50%,-50%) scale(.20)}50%{opacity:1;transform:translate(-50%,-50%) scale(.72)}}
@keyframes orchestration-line{from{transform:translate(-50%,-50%) translateX(-7%) rotate(-3deg)}to{transform:translate(-50%,-50%) translateX(7%) rotate(3deg)}}
@keyframes orchestration-curve{0%,100%{transform:translate(-50%,-50%) rotate(-7deg) scale(.92)}50%{transform:translate(-50%,-50%) rotate(8deg) scale(1.06)}}
@keyframes orchestration-zigzag{0%{transform:translate(-50%,-50%) translateX(-5%)}100%{transform:translate(-50%,-50%) translateX(5%)}}
@keyframes orchestration-triangle{0%{transform:translate(-50%,-50%) scale(.72);opacity:.45}22%{transform:translate(-50%,-50%) scale(1.08);opacity:1}100%{transform:translate(-50%,-50%) scale(.86);opacity:.62}}
@keyframes orchestration-circle{from{transform:translate(-50%,-50%) rotate(0deg) scale(.94)}to{transform:translate(-50%,-50%) rotate(360deg) scale(1.03)}}
@keyframes orchestration-square{0%,49%{transform:translate(-50%,-50%) scale(.90)}50%,100%{transform:translate(-50%,-50%) scale(1.04)}}
@media(max-width:760px){.orchestration-swatches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.orchestration-legend,.shape-legend{grid-template-columns:1fr}.orchestration-mark small{display:none}.orchestration-mark .shape-symbol{font-size:58px}}
@media(prefers-reduced-motion:reduce){.orchestration-mark{animation:none!important}}

/* The ribbon stays playable: selection, a split mark, and compact local actions. */
.arrangement-heading{gap:10px;flex-wrap:nowrap}
.arrangement-heading h2{white-space:nowrap;letter-spacing:1.3px}
.arrangement-heading .arrangement-history{display:flex;gap:2px;margin-left:auto}
.arrangement-heading .arrangement-history button{width:34px;height:34px;padding:0;font-size:24px;letter-spacing:0;margin:0}
.arrangement-heading .arrangement-history button:disabled{opacity:.25}
.arrangement-heading #snapBtn{margin-left:0;white-space:nowrap}
.arrangement .timeline-row{height:54px}
.arrangement .timeline-row,.arrangement .timeline-ruler{grid-template-columns:150px minmax(0,1fr)}
.arrangement .track-label{gap:2px;min-width:0;height:48px;padding-right:7px}
.arrangement .track-label .arrangement-mute{flex:0 0 32px;height:40px;width:32px;padding:4px;margin:0;display:grid;place-items:center;color:var(--track-color)}
.arrangement .arrangement-mute[aria-pressed=true]{opacity:.45}
.arrangement .track-label .arrangement-title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:left;flex:1;min-width:0;padding:7px 2px;margin:0;height:40px;font-size:11px;color:var(--text);touch-action:manipulation;-webkit-touch-callout:none;user-select:none}
.arrangement .track-lane{height:40px;touch-action:pan-y;overflow:visible}
.arrangement .arrangement-clip{height:38px;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;min-width:3px;overflow:visible;cursor:crosshair}
.arrangement-clip canvas,.arrangement-clip span,.arrangement-rate{pointer-events:none}
.arrangement .arrangement-clip canvas{border-radius:3px}
.arrangement .arrangement-clip>span{top:5px;left:12px;font-size:9px;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arrangement-clip .arrangement-rate{position:absolute;left:12px;bottom:4px;font-size:8px;color:var(--track-color);white-space:nowrap;opacity:0}
.arrangement-clip.selected{outline:1px solid var(--track-color);z-index:2}
.arrangement-clip.selected .arrangement-rate{opacity:.9}
.arrangement .arrangement-edge{position:absolute;top:0;width:15px;max-width:26%;height:100%;padding:0;border:0;border-radius:3px;opacity:0;pointer-events:none;touch-action:none;cursor:ew-resize;color:var(--track-color);background:color-mix(in srgb,var(--track-color) 18%,#111c);z-index:4}
.arrangement .arrangement-edge.start{left:0;border-right:1px solid #ffffff25}
.arrangement .arrangement-edge.end{right:0;border-left:1px solid #ffffff25}
.arrangement .arrangement-edge:after{content:'';position:absolute;left:50%;top:11px;height:16px;border-left:2px solid currentColor}
.arrangement .selected .arrangement-edge,.arrangement .arrangement-edge:focus-visible{opacity:1;pointer-events:auto}
.arrangement-clip.arrangement-moving{z-index:4;outline:2px solid var(--track-color);box-shadow:0 4px 18px #000b;cursor:grabbing}
.arrangement-clip.arrangement-resizing{z-index:4;outline:2px solid var(--track-color);cursor:ew-resize}
.arrangement-clip.arrangement-collision{outline-color:#ed8f88;opacity:.55!important}
.arrangement-cursor{position:absolute;top:0;bottom:0;width:0;z-index:5;pointer-events:none}
.arrangement-cursor>i{position:absolute;top:0;bottom:0;border-left:1px solid #f0f4e8;box-shadow:0 0 2px #000}
.arrangement .arrangement-cursor>button{position:absolute;left:-14px;top:-10px;width:28px;height:26px;padding:0;border:1px solid #84917a;border-radius:5px;background:#161e16;color:#ecf4de;pointer-events:auto;font-size:16px;line-height:24px;touch-action:manipulation;display:grid;place-items:center}
.arrangement .arrangement-cursor>button:disabled{opacity:.35;pointer-events:none;cursor:default}
.arrangement-popover{position:fixed;z-index:35;width:max-content;max-width:min(290px,calc(100vw - 16px));padding:5px 6px 7px;border:1px solid #617057;border-radius:9px;background:#141b15f5;box-shadow:0 8px 28px #0009;backdrop-filter:blur(14px)}
.arrangement-popover-head{display:flex;gap:12px;justify-content:space-between;align-items:center;padding-left:5px;color:#a4b29c;font-size:10px}
.arrangement-popover-head button{height:26px;width:26px;padding:0;border:0;font-size:20px;line-height:20px}
.arrangement-compact-actions{display:flex;gap:2px;flex-wrap:wrap;max-width:272px}
.arrangement-compact-actions button{border:0;min-height:38px;padding:7px 9px;font-size:12px}
.arrangement-compact-actions button:disabled{opacity:.3;cursor:default}
.arrangement-empty{font-size:12px;color:var(--muted);padding:8px 0}
.arrangement-dialog h2{overflow-wrap:anywhere;font-size:23px;padding-right:20px}
.arrangement-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:18px}
.arrangement-actions button{min-height:44px;font-size:13px;padding:10px 8px}
.arrangement-actions button:disabled{opacity:.3;cursor:default}
.arrangement-slider-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;margin-top:22px}
.arrangement-slider-grid .control{margin-bottom:10px;min-width:0}
.arrangement-slider-grid .control-head{font-size:12px}
.arrangement-slider-grid input[type=range]{height:30px;margin-top:0}
@media(max-width:760px){
 .arrangement{height:224px!important}
 .arrangement .timeline{max-height:177px;padding:0 10px}
 .arrangement-heading{height:46px;padding:0 10px;gap:4px}
 .arrangement-heading h2{font-size:10px;letter-spacing:.7px}
 .arrangement-heading .arrangement-history button{width:30px}
 .arrangement-heading #snapBtn{font-size:8px;padding:5px}
 .arrangement .timeline-row,.arrangement .timeline-ruler{grid-template-columns:104px minmax(0,1fr)}
 .arrangement .track-label .arrangement-title{font-size:10px}
 .arrangement-slider-grid{grid-template-columns:1fr;gap:4px}
 .arrangement-dialog .fineprint{font-size:11px}
}