:root { --surface-1: #f7f7f7; --surface-2: #f0f0f0; --card: #fff; --input: #fff; --hover: #e9e9e9; --track: #eee; --fill: #444; --warning: #e8791b; --success: #16845b; --border: #d7d7db; --radius: 8px; --panel-radius: 14px; --text-primary: #202124; --text-secondary: #5f6368; --text-muted: #80868b; --bg-accent: #e8f0fe; --text-accent: #174ea6; --text-heading: color-mix(in srgb, var(--text-primary) 88%, var(--text-accent)); --border-accent: #8ab4f8; --scale-a-accent: #174ea6; --scale-a-accent-bg: #e8f0fe; --scale-a-accent-subtle: color-mix(in srgb, #174ea6 7%, var(--card)); --scale-b-accent: #e8791b; --scale-b-accent-bg: color-mix(in srgb, #e8791b 18%, var(--card)); --scale-b-accent-subtle: color-mix(in srgb, #e8791b 7%, var(--card)); --bg-danger: #fce8e6; --border-danger: #d93025; --text-danger: #d93025; --matrix-cell-fill: color-mix(in srgb, var(--warning) 22%, var(--card)); --matrix-cell-fill-border: color-mix(in srgb, var(--warning) 78%, var(--card)); --font-ui: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; --compact-field-width: 64px; --form-control-height: 34px; } * { box-sizing: border-box; } body { margin: 0; padding: 24px; font-family: var(--font-ui); color: var(--text-primary); background: var(--surface-2); } button, input, select, textarea { font: inherit; } .material-symbol-icon { fill: currentColor; } input, select, textarea, button { border: 1px solid var(--border); border-radius: var(--radius); background: var(--input); color: var(--text-primary); } input, select, textarea { padding: 8px 10px; } button { padding: 8px 12px; cursor: pointer; } button:disabled { cursor: not-allowed; opacity: .5; } button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid color-mix(in srgb, var(--border-accent) 55%, transparent); outline-offset: 2px; } main { width: 100%; margin: 0; } .notice-stack { position: relative; isolation: isolate; margin: 0 8px 22px 0; } .notice-stack[hidden] { display: none; } .notice-stack::before, .notice-stack::after { position: absolute; inset: 0; z-index: 0; display: none; border: 1px solid var(--status-warning); border-radius: var(--panel-radius); background: color-mix(in srgb, var(--status-warning) 7%, var(--card)); content: ''; pointer-events: none; } .notice-stack.has-stack::before { display: block; transform: translate(5px, 5px); } .notice-stack.has-deep-stack::after { display: block; transform: translate(9px, 9px); opacity: .72; } .notice-card { position: relative; z-index: 2; display: flex; min-height: 44px; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 12px 10px 14px; border: 1px solid var(--border); border-radius: var(--panel-radius); background: var(--card); color: var(--text-secondary); box-shadow: 0 5px 18px color-mix(in srgb, var(--text-primary) 6%, transparent); } .notice-card.is-info { border-color: var(--border); background: var(--card); color: var(--text-secondary); } .notice-card.is-success { border-color: var(--status-success); background: color-mix(in srgb, var(--status-success) 18%, var(--card)); color: color-mix(in srgb, var(--status-success) 72%, var(--text-primary)); } .notice-card.is-warning { border-color: var(--status-warning); background: color-mix(in srgb, var(--status-warning) 18%, var(--card)); color: color-mix(in srgb, var(--status-warning) 72%, var(--text-primary)); } .notice-card.is-failure { border-color: var(--status-failure); background: color-mix(in srgb, var(--status-failure) 18%, var(--card)); color: color-mix(in srgb, var(--status-failure) 72%, var(--text-primary)); } .notice-content { min-width: 0; font-size: 13px; line-height: 1.4; } .notice-dismiss-button { flex: 0 0 auto; width: 28px; min-width: 28px; height: 28px; padding: 0; border-color: color-mix(in srgb, currentColor 28%, transparent); background: color-mix(in srgb, var(--card) 62%, transparent); color: inherit; font-size: 20px; line-height: 1; } .notice-dismiss-button:hover, .notice-dismiss-button:focus-visible { border-color: currentColor; background: color-mix(in srgb, var(--card) 84%, transparent); } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .app-tooltip { position: fixed; z-index: 1000; max-width: min(280px, calc(100vw - 16px)); padding: 6px 8px; border: 1px solid color-mix(in srgb, var(--border-accent) 45%, var(--border)); border-radius: 6px; background: color-mix(in srgb, var(--card) 96%, var(--surface-1)); color: var(--text-primary); box-shadow: 0 4px 14px color-mix(in srgb, var(--text-primary) 16%, transparent); font-size: 11px; line-height: 1.3; pointer-events: none; text-align: center; } .app-header { display: grid; gap: 6px; margin-bottom: 12px; } .app-header-top-row { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; } .app-brand { display: grid; justify-items: start; gap: 4px; } .app-header h1 { margin: 0; font-size: clamp(1.4rem, 3vw, 2rem); } .app-header p { margin: 0; color: var(--text-secondary); } .app-header-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; } .header-reset-actions, .header-appearance-controls { display: flex; align-items: center; gap: 10px; } .header-appearance-field { display: flex; width: auto; min-width: 0; align-items: center; gap: 6px; } .header-appearance-field select { width: 150px; min-width: 0; height: 1.8rem !important; min-height: 1.8rem; padding: .22rem 26px .22rem .52rem !important; } .theme-select-actions { display: flex; align-items: center; gap: 0; min-width: 0; } .theme-random-button { width: 26px; min-width: 26px; height: 26px; padding: 3px; border-color: transparent; background: transparent; color: var(--text-secondary); } .system-preferences-button { width: 30px; min-width: 30px; height: 30px; padding: 5px; border-color: transparent; background: transparent; color: var(--text-secondary); } .theme-random-button:hover, .theme-random-button:focus-visible, .system-preferences-button:hover, .system-preferences-button:focus-visible { border-color: var(--border); background: var(--hover); color: var(--text-primary); } .theme-random-button svg { display: block; width: 18px; height: 18px; } .system-preferences-gear-icon { display: block; width: 18px; height: 18px; background: currentColor; -webkit-mask: url("data:image/png;base64,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") center / contain no-repeat; mask: url("data:image/png;base64,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") center / contain no-repeat; } .interface-reset-button { white-space: nowrap; } button.compact-action-button { min-height: 1.8rem; padding: .22rem .52rem; font-size: .78rem; line-height: 1.2; white-space: nowrap; } .version-badge { padding: 4px 8px; border: 1px solid var(--border); border-radius: 999px; color: var(--text-secondary); font-size: 12px; white-space: nowrap; } .release-link-badge { display: inline-flex; align-items: center; padding: 4px 8px; border: 1px solid color-mix(in srgb, var(--border-accent) 62%, var(--border)); border-radius: 999px; background: var(--bg-accent); color: var(--text-accent); font-size: 12px; line-height: 1.2; text-decoration: none; white-space: nowrap; } .release-link-badge:hover, .release-link-badge:focus-visible { border-color: var(--border-accent); color: var(--text-primary); } .app-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 10px; margin-top: 24px; padding: 16px 0 2px; border-top: 1px solid var(--border); color: var(--text-secondary); font-size: 12px; } .app-footer a { color: inherit; text-decoration-color: color-mix(in srgb, currentColor 58%, transparent); text-underline-offset: 2px; } .app-footer a:hover { color: var(--text-primary); } .panel { min-width: 0; padding: 20px; border: 1px solid var(--border); border-radius: var(--panel-radius); background: var(--surface-1); box-shadow: 0 10px 30px color-mix(in srgb, var(--text-primary) 6%, transparent); } .scale-b-panel { --bg-accent: var(--scale-b-accent-bg); --text-accent: var(--scale-b-accent); --border-accent: var(--scale-b-accent); --text-heading: color-mix(in srgb, var(--text-primary) 88%, var(--scale-b-accent)); } .scale-a-panel, .scale-b-panel { transition: background-color 140ms ease, border-color 140ms ease; } .scale-a-panel.is-playback-scale-active { border-color: color-mix(in srgb, var(--scale-a-accent) 44%, var(--border)); background: var(--scale-a-accent-subtle); } .scale-b-panel.is-playback-scale-active { border-color: color-mix(in srgb, var(--scale-b-accent) 44%, var(--border)); background: var(--scale-b-accent-subtle); } .panel-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 8px 24px; margin-bottom: 20px; } .panel-heading > div { min-width: 0; grid-column: 1; grid-row: 1; } .panel-heading > button { grid-column: 2; grid-row: 1; } .panel-heading h2 { margin: 0; font-size: 1.15rem; line-height: 1.2; } .panel-heading > p { width: 100%; max-width: none; grid-column: 1 / -1; grid-row: 2; margin: 0; color: var(--text-secondary); font-size: 13px; line-height: 1.5; text-align: left; } .eyebrow { margin: 0 0 4px; color: var(--text-accent); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .sound-strip { position: relative; width: 100%; margin-bottom: 20px; background: var(--surface-1); } .sound-strip-heading { margin-bottom: 18px; } .sound-strip-heading > .section-collapse-button { flex: 0 0 auto; } .sound-strip.is-collapsed .sound-strip-heading { margin-bottom: 0; } .sound-grid { display: grid; grid-template-columns: repeat(5, minmax(150px, 170px)); gap: 16px; align-items: start; justify-content: start; } .sound-grid > .field { width: 100%; min-width: 0; } .sound-shaping-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr) minmax(0, .88fr); gap: 16px; margin-top: 18px; } .sound-control-box { min-width: 0; padding: 14px; border: 1px solid var(--border); border-radius: calc(var(--panel-radius) - 2px); background: var(--card); } .sound-control-box label { color: var(--text-secondary); font-size: 13px; font-weight: 500; } .sound-control-header { display: flex; min-height: 34px; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; } .sound-control-header .section-label { margin: 0; } .sound-control-header-actions { display: flex; min-width: 0; align-items: center; justify-content: flex-end; gap: 8px; } .section-collapse-button { width: 30px; min-width: 30px; height: 30px; padding: 4px; border-color: transparent; background: transparent; color: var(--text-secondary); } .section-collapse-button:hover, .section-collapse-button:focus-visible { border-color: var(--border); background: var(--hover); color: var(--text-primary); } .section-collapse-icon { display: none; width: 22px; height: 22px; } .section-collapse-button[aria-expanded="true"] .section-collapse-icon-expanded, .section-collapse-button[aria-expanded="false"] .section-collapse-icon-collapsed { display: block; } .panel-heading > .panel-display-actions { display: inline-flex; grid-column: 2; grid-row: 1; align-items: flex-start; justify-content: flex-end; gap: 6px; } .panel-display-mode-button { width: 30px; min-width: 30px; height: 30px; padding: 4px; } .panel-display-icon { display: none; width: 21px; height: 21px; } .panel-display-mode-button[aria-pressed="false"] .panel-display-icon-compact, .panel-display-mode-button[aria-pressed="true"] .panel-display-icon-full { display: block; } .sound-control-box.is-collapsed .sound-control-header { margin-bottom: 0; } .envelope-preset-control { display: flex; align-items: center; gap: 6px; margin: 0; white-space: nowrap; } .envelope-preset-control select { width: 112px; min-width: 0; padding: 5px 26px 5px 8px; font-size: 13px; } .envelope-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; } .compact-slider-field, .mixer-channel { min-width: 0; } .compact-slider-field label, .mixer-channel > label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .envelope-grid input, .mixer-channel input, .effects-control-grid input { width: 100%; min-width: 0; padding: 0; } .envelope-shape-selector { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; margin-top: 4px; } .envelope-shape-button { display: inline-grid; width: 24px; min-width: 24px; height: 20px; padding: 2px; place-items: center; border: 1px solid var(--border); border-radius: 5px; background: transparent; color: var(--text-muted); } .envelope-shape-button:hover, .envelope-shape-button:focus-visible { border-color: var(--text-secondary); background: var(--hover); color: var(--text-primary); } .envelope-shape-button[aria-pressed="true"] { border-color: var(--border-accent); background: var(--bg-accent); color: var(--text-accent); } .envelope-shape-button svg { display: block; width: 18px; height: 12px; overflow: visible; } .envelope-shape-button path, .envelope-shape-button polyline { fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; } .envelope-help { grid-column: 1 / -1; margin: 2px 0 0; color: var(--text-muted); font-size: 12px; line-height: 1.4; } .mixer-controls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: 8px; } .mixer-channel > label { display: block; color: var(--text-secondary); font-size: 13px; font-weight: 500; } .effect-routing { grid-column: 1 / -1; margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--border); } .effect-routing h4 { margin: 0 0 8px; color: var(--text-secondary); font-size: 13px; font-weight: 700; } .effect-routing-matrix { display: grid; grid-template-columns: minmax(78px, .9fr) repeat(4, minmax(58px, 1fr)); align-items: end; gap: 6px 8px; } .effect-routing-heading { overflow: hidden; color: var(--text-secondary); font-size: 12px; font-weight: 600; line-height: 1.2; text-align: center; text-overflow: ellipsis; } .effect-routing-source { align-self: center; color: var(--text-secondary); font-size: 12px; font-weight: 600; } .effect-routing-cell { display: grid; min-width: 0; gap: 2px; text-align: center; } .effect-routing-cell > span { color: var(--text-secondary); font-size: 11px; font-variant-numeric: tabular-nums; } .effect-routing-cell input { width: 100%; min-width: 0; padding: 0; } .effect-routing-help { margin: 8px 0 0; color: var(--text-muted); font-size: 11px; line-height: 1.35; } .channel-control-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 6px; } .channel-mute-button { width: 28px; min-width: 28px; height: 28px; padding: 2px; } .channel-mute-button[aria-pressed="false"] { border-color: var(--border-accent); background: var(--bg-accent); color: var(--text-accent); } .channel-mute-icon { display: none; width: 18px; height: 18px; } .channel-mute-button[aria-pressed="false"] .channel-unmuted-icon, .channel-mute-button[aria-pressed="true"] .channel-muted-icon { display: block; } input[type="range"].is-shift-muted { opacity: .38; filter: grayscale(1); } .mixer-channel.is-shift-muted > label, .effect-routing-cell.is-shift-muted > span { color: var(--text-muted); } .effects-controls { display: grid; gap: 12px; } .effects-section { min-width: 0; } .effects-section + .effects-section { padding-top: 12px; border-top: 1px solid var(--border); } .effects-section-header { display: flex; min-height: 26px; align-items: center; justify-content: flex-start; gap: 6px; margin-bottom: 8px; } .effects-section-header h4 { margin: 0; color: var(--text-secondary); font-size: 13px; font-weight: 700; } .effects-section.is-bypassed .effects-section-header h4 { color: var(--text-muted); } .effect-bypass-button { width: 24px; min-width: 24px; height: 24px; padding: 2px; color: var(--text-muted); } .effect-bypass-button svg { display: block; width: 15px; height: 15px; } .effect-bypass-button[aria-pressed="true"] { border-color: var(--border-accent); background: var(--bg-accent); color: var(--text-accent); } .effects-control-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); align-items: end; gap: 8px; } .effects-control-grid input, .effects-control-grid select { width: 100%; min-width: 0; } .sequence-playback-action { display: flex; align-items: center; justify-content: flex-start; gap: 12px; margin: 10px 0; padding: 0; border: 0; } .sequence-action-buttons { display: flex; align-items: center; gap: 8px; } .playback-scale-control { display: flex; flex: 0 0 auto; align-items: center; justify-content: flex-start; gap: 6px; min-width: 0; margin-block: 10px; } .playback-scale-switch { white-space: nowrap; } .playback-key-select { width: 168px; min-width: 138px; } .tempo-source-control { display: inline-flex; align-items: center; gap: 5px; color: var(--text-secondary); font-size: 13px; white-space: nowrap; } .tempo-source-control[hidden] { display: none; } .tempo-source-label { white-space: nowrap; } .tempo-source-switch { width: max-content; white-space: nowrap; } .scale-comparison-box { overflow-x: auto; } .sequence-playback-row.scale-comparison-controls { width: max-content; min-width: 100%; flex-wrap: nowrap; align-items: center; justify-content: flex-start; gap: 10px 14px; } .scale-comparison-toggle-field, .scale-comparison-field { display: flex; align-items: center; gap: 5px; color: var(--text-secondary); font-size: 13px; white-space: nowrap; } .scale-comparison-label { white-space: nowrap; } .scale-comparison-field select { min-width: 76px; } .scale-comparison-bars-field { transition: opacity 160ms ease; } .scale-comparison-bars-field.is-faded { opacity: .18; pointer-events: none; } .scale-comparison-bars-field input { width: 52px; } .scale-comparison-controls.is-disabled { opacity: .56; } #generateBtn, #mutateMelodyBtn { transition: opacity 160ms ease, filter 160ms ease; } #mutateMelodyBtn .die-icon { width: 15px; height: 15px; overflow: visible; } #mutateMelodyBtn .die-icon rect { fill: none; stroke: currentColor; stroke-width: 1.5; } #mutateMelodyBtn .die-icon circle { fill: currentColor; stroke: none; } #generateBtn.is-deemphasized, #mutateMelodyBtn.is-deemphasized { opacity: .48; filter: saturate(.65); } #generateBtn.is-deemphasized:hover, #generateBtn.is-deemphasized:focus-visible, #mutateMelodyBtn.is-deemphasized:hover, #mutateMelodyBtn.is-deemphasized:focus-visible { opacity: .78; filter: saturate(.85); } @keyframes generate-confirmation { 0% { transform: scale(1); } 45% { transform: scale(1.06); background: color-mix(in srgb, var(--border-accent) 18%, var(--input)); } 100% { transform: scale(1); } } #generateBtn.is-generated { animation: generate-confirmation 420ms ease-out; } .status-chip.is-info { border-color: var(--border); background: var(--card); color: var(--text-secondary); } .status-chip.is-success { border-color: var(--status-success); background: color-mix(in srgb, var(--status-success) 18%, var(--card)); color: color-mix(in srgb, var(--status-success) 72%, var(--text-primary)); } .status-chip.is-warning { border-color: var(--status-warning); background: color-mix(in srgb, var(--status-warning) 18%, var(--card)); color: color-mix(in srgb, var(--status-warning) 72%, var(--text-primary)); } .status-chip.is-failure { border-color: var(--status-failure); background: color-mix(in srgb, var(--status-failure) 18%, var(--card)); color: color-mix(in srgb, var(--status-failure) 72%, var(--text-primary)); } .sequence-settings-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-bottom: 20px; } .sequence-playback-box { min-width: 0; margin: 0; padding: 14px; border: 1px solid var(--border); border-radius: calc(var(--panel-radius) - 2px); background: var(--card); } .sequence-playback-title { margin-bottom: 10px; } .sequence-playback-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; } .inline-field { display: flex; align-items: center; gap: 6px; } .inline-field label { color: var(--text-secondary); font-size: 13px; } .status-chip { max-width: min(60vw, 560px); justify-self: end; overflow: hidden; padding: 6px 10px; border: 1px solid var(--border); border-radius: 999px; background: var(--card); color: var(--text-secondary); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; } .shared-controls-status { position: absolute; top: -40px; right: 0; z-index: 3; cursor: default; pointer-events: auto; } .workspace-grid { --scale-creator-share: .38; --melody-player-share: .62; --scale-a-share: .5; --scale-b-share: .5; --comparison-melody-share: .333334; display: flex; height: clamp(820px, calc(100vh - 110px), 1240px); min-height: 820px; flex-direction: column; align-items: stretch; } .scale-workspace { display: flex; flex: var(--scale-creator-share) 1 0; min-width: 0; min-height: 300px; align-items: flex-start; overflow: auto; transition: flex-basis 160ms ease, min-height 160ms ease; } .scale-panel { flex: 1 1 0; min-width: 0; transition: flex-basis 160ms ease, min-width 160ms ease, padding 160ms ease; } .melody-player-panel { container-type: inline-size; flex: var(--melody-player-share) 1 0; min-width: 0; min-height: 320px; overflow: auto; transition: flex-basis 160ms ease, min-height 160ms ease, padding 160ms ease; } .workspace-grid.has-scale-b .scale-workspace { display: flex; } .workspace-grid.has-scale-b .scale-a-panel { flex: var(--scale-a-share) 1 0; min-width: 300px; } .workspace-grid.has-scale-b .scale-b-panel { flex: var(--scale-b-share) 1 0; min-width: 300px; } .workspace-grid.has-scale-b .melody-player-panel { flex: var(--melody-player-share) 1 0; min-width: 0; } .workspace-divider[aria-hidden="true"] { display: none; } .workspace-divider { position: relative; display: flex; justify-content: center; border-radius: 999px; touch-action: none; } .workspace-grid > .workspace-divider { flex: 0 0 20px; width: 100%; min-height: 20px; align-items: center; cursor: row-resize; } .workspace-grid > .workspace-divider .workspace-divider-handle { width: 100%; height: 2px; min-height: 0; } .scale-workspace > .scale-divider { flex: 0 0 20px; width: 20px; min-height: 140px; align-self: stretch; cursor: col-resize; } .scale-workspace > .scale-divider .workspace-divider-handle { width: 2px; min-height: 100%; } .workspace-divider-handle { border-radius: 999px; background: var(--border); transition: width 120ms ease, height 120ms ease, background 120ms ease, box-shadow 120ms ease; } .workspace-grid > .workspace-divider:hover .workspace-divider-handle, .workspace-grid > .workspace-divider:focus-visible .workspace-divider-handle, .workspace-grid.is-resizing > .workspace-divider .workspace-divider-handle { height: 4px; background: var(--border-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--border-accent) 18%, transparent); } .scale-workspace > .scale-divider:hover .workspace-divider-handle, .scale-workspace > .scale-divider:focus-visible .workspace-divider-handle, .scale-workspace.is-resizing-scales > .scale-divider .workspace-divider-handle { width: 4px; background: var(--border-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--border-accent) 18%, transparent); } .workspace-divider:focus-visible { outline: none; } .workspace-grid.is-resizing, .workspace-grid.is-resizing * { cursor: row-resize !important; user-select: none; } .scale-workspace.is-resizing-scales, .scale-workspace.is-resizing-scales * { cursor: col-resize !important; user-select: none; } .workspace-grid .panel-heading { grid-template-columns: minmax(0, 1fr) auto; } .panel-heading > .scale-panel-heading-actions { grid-column: 2; grid-row: 1; } .scale-panel-heading-actions { display: flex; align-items: flex-start; justify-content: flex-end; flex-wrap: wrap; gap: 6px; } .scale-workspace-action-button { min-height: 1.8rem; padding: .22rem .52rem; font-size: .78rem; white-space: nowrap; } .workspace-panel-intro { min-height: 190px; } .workspace-panel-intro { display: flex; min-height: 148px; flex-direction: column; } .scale-creator-panel .workspace-panel-intro { min-height: 0; } .melody-player-panel .workspace-panel-intro { min-height: 0; } .scale-creator-panel .workspace-panel-intro .panel-heading { min-height: 0; margin-bottom: 8px; } .melody-player-panel .workspace-panel-intro .panel-heading { min-height: 0; margin-bottom: 12px; } .workspace-panel-intro .panel-heading { min-height: 64px; margin-bottom: 12px; } .creator-fields { display: grid; gap: 16px; margin-bottom: 20px; } .settings-section { padding: 16px; border: 1px solid var(--border); border-radius: calc(var(--panel-radius) - 2px); background: var(--card); } .roll-section { min-width: 0; margin-bottom: 20px; } .roll-section > .drone-control { margin-top: 16px; } .roll-section-heading { margin-bottom: 6px; } .roll-section-heading .section-label { margin-bottom: 0; } .roll-title-control { display: grid; min-width: 0; gap: 8px; } .roll-title-row { display: flex; min-width: 0; flex-wrap: nowrap; align-items: center; gap: 10px; overflow-x: auto; scrollbar-gutter: stable; } .roll-toggle-row { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 8px; } .roll-content-switch { flex: 0 0 auto; } .roll-view-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px 14px; margin-top: 6px; } .roll-row-controls, .roll-zoom-controls { display: flex; align-items: center; gap: 6px; } .roll-row-controls label { color: var(--text-muted); font-size: 11px; } .roll-row-controls select { width: auto; min-width: 92px; padding: 5px 24px 5px 8px; font-size: 12px; } #rollContextSelect { min-width: 84px; } .roll-zoom-value { min-width: 44px; color: var(--text-secondary); font-size: 12px; text-align: right; } .roll-zoom-button { display: inline-flex; min-width: 32px; height: 28px; min-height: 28px; align-items: center; justify-content: center; padding: 4px 8px; line-height: 1; } .roll-zoom-reset { min-width: 52px; font-size: 12px; } .roll-stretch-button { min-width: 58px; font-size: 12px; } .field { min-width: 0; } .field label { display: block; margin: 0 0 6px; color: var(--text-secondary); font-size: 13px; font-weight: 500; } .section-label { display: block; margin: 0 0 6px; color: var(--text-heading); font-size: 13px; font-weight: 700; letter-spacing: .01em; } .field input, .field select { width: 100%; } .compact-field { min-width: 0; } .picker { position: relative; } .scale-library-control { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin-bottom: 10px; } .scale-library-control .section-label { margin-bottom: 0; } .scale-library-switch { display: inline-flex; gap: 4px; padding: 3px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-1); } .scale-library-button { padding: 5px 10px; border: 1px solid transparent; border-radius: 999px; background: transparent; color: var(--text-secondary); font-size: 12px; font-weight: 600; } .scale-library-button:hover, .scale-library-button:focus-visible { background: var(--hover); color: var(--text-primary); } .scale-library-button.is-selected, .scale-library-button[aria-pressed="true"] { border-color: var(--border-accent); background: var(--bg-accent); color: var(--text-accent); } #playbackScaleABtn.is-selected, #playbackScaleABtn[aria-pressed="true"] { border-color: var(--scale-a-accent); background: var(--scale-a-accent-bg); color: var(--scale-a-accent); } #playbackScaleBBtn.is-selected, #playbackScaleBBtn[aria-pressed="true"] { border-color: var(--scale-b-accent); background: var(--scale-b-accent-bg); color: var(--scale-b-accent); } .playback-scale-switch .scale-library-button.is-incompatible:not(:disabled) { border-color: color-mix(in srgb, var(--warning) 34%, transparent); color: var(--text-muted); } .playback-scale-switch .scale-library-button.is-incompatible:not(:disabled):hover, .playback-scale-switch .scale-library-button.is-incompatible:not(:disabled):focus-visible { border-color: var(--warning); background: color-mix(in srgb, var(--warning) 10%, transparent); color: var(--text-primary); } .scale-picker-control { display: grid; grid-template-columns: minmax(0, 1fr) minmax(118px, .34fr) auto; column-gap: 8px; row-gap: 6px; align-items: end; } .scale-picker-control .scale-name-label-row, .scale-picker-control .root-pitch-label { margin: 0; } .scale-picker-label-spacer { min-width: 0; } .root-pitch-input { min-width: 0; } .parameter-panel { min-width: 0; padding-top: 14px; border-top: 1px solid var(--border); } .parameter-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; } .parameter-panel-heading .section-label { margin-bottom: 0; } .parameter-add-button { min-height: 1.8rem; padding: .22rem .52rem; font-size: .78rem; line-height: 1.2; white-space: nowrap; } .parameter-list { display: grid; gap: 8px; } .parameter-row { display: grid; grid-template-columns: 24px minmax(150px, 1fr) auto auto; align-items: start; gap: 8px; } .parameter-name { padding-top: 9px; color: var(--text-heading); font-weight: 700; text-align: center; } .parameter-picker-control { position: relative; min-width: 0; } .parameter-picker-control .dropdown { top: 100%; } .parameter-input { width: 100%; } .parameter-actions { display: flex; gap: 6px; } .parameter-action-button { width: 36px; min-width: 36px; padding: 7px; } .parameter-action-icon { display: block; width: 18px; height: 18px; } .parameter-remove-button { min-width: 72px; padding: 7px 10px; } .parameter-value { grid-column: 2 / -1; margin-top: -4px; color: var(--text-secondary); font-size: 12px; } .parameter-row.is-invalid .parameter-input { border-color: var(--danger); } .parameter-panel .field-help { margin-bottom: 0; } .instrument-field, .theme-field, .typeface-field { width: auto; } .field-label-row { display: flex; align-items: center; gap: 6px; } .field-label-row label { margin: 0; } .field-help { display: block; margin-top: .35rem; color: var(--text-secondary); font-size: .75rem; line-height: 1.35; } .dropdown { position: absolute; top: 100%; right: 0; left: 0; z-index: 10; max-height: 220px; margin-top: 4px; overflow: auto; border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); box-shadow: 0 10px 24px color-mix(in srgb, var(--text-primary) 12%, transparent); } .dropdown[hidden] { display: none; } .dropdown-group { padding: 8px 12px 5px; color: var(--text-muted); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .dropdown-group:not(:first-child) { border-top: 1px solid var(--border); } .dropdown-item, .dropdown-empty { display: block; width: 100%; padding: 8px 12px; border: 0; border-radius: 0; text-align: left; font-size: 13px; } .dropdown-item:hover, .dropdown-item.is-active { background: var(--hover); } .dropdown-empty { color: var(--text-muted); } .help { color: var(--text-secondary); font-size: 13px; line-height: 1.45; } .stack { margin-bottom: 20px; } #notesInput, #notesInputB { width: 100%; resize: vertical; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 13px; } .scale-notes-heading, .section-info-heading { display: flex; align-items: center; gap: 6px; } .scale-notes-heading { justify-content: space-between; } .scale-notes-heading .section-label, .section-info-heading .section-label { margin-bottom: 0; } .scale-notes-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; } .scale-random-resample-button { min-height: 26px; padding: 3px 8px; color: var(--text-secondary); font-size: 11px; } .scale-notes-help-button, .section-info-button { width: 26px; min-width: 26px; height: 26px; padding: 3px; border-color: transparent; background: color-mix(in srgb, var(--text-accent) 8%, var(--card)); color: var(--text-accent); } .scale-notes-help-button:hover, .scale-notes-help-button:focus-visible, .section-info-button:hover, .section-info-button:focus-visible { border-color: color-mix(in srgb, var(--text-accent) 34%, var(--border)); background: color-mix(in srgb, var(--text-accent) 14%, var(--card)); color: var(--text-accent); } .scale-notes-help-button svg, .section-info-button svg { display: block; width: 18px; height: 18px; } .scale-notes-editor .primary-action { margin-top: 10px; align-self: flex-start; } #notesInput { background: var(--surface-1); } #notesInputB { background: var(--surface-1); } .icon-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; } .primary-action { border-color: var(--border-accent); background: var(--bg-accent); color: var(--text-accent); font-weight: 600; } .button-icon { display: inline-block; width: 1em; text-align: center; font-style: normal; } .note-gate-select { width: 84px; min-width: 84px; padding-right: 28px; } .meter-select { width: 88px; min-width: 88px; padding-right: 28px; } .bar-count-input { width: 54px; min-width: 54px; } .loop-duration-field { display: inline-flex; align-items: center; gap: 6px; color: var(--text-secondary); font-size: 13px; transition: opacity 120ms ease; } .loop-duration-field input { width: 54px; min-width: 54px; } .loop-duration-field.is-disabled { opacity: .52; } .loop-option { display: inline-flex; align-items: center; gap: 6px; color: var(--text-secondary); font-size: 13px; } .loop-option input { width: auto; } .loop-option.is-disabled { opacity: .52; } .muted { color: var(--text-secondary); } .parse-error-line { color: var(--text-danger); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; } .is-invalid { border-color: var(--border-danger) !important; background: var(--bg-danger) !important; color: var(--text-primary) !important; } #notesRow, #notesRowB { display: flex; flex-wrap: wrap; gap: 8px; } #notesRow, #notesRowB { margin-bottom: 8px; } .cents-ladder-section { margin: 0 0 10px; } .cents-ladder-section .section-info-heading { margin-bottom: 6px; } .cent-ruler-wrap { max-width: 100%; margin: 0; overflow-x: hidden; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-1); } .cent-ruler { box-sizing: border-box; width: 100%; min-width: 0; padding: 8px 24px 0; } .cent-ruler + .cent-ruler { border-top: 1px solid var(--border); } .cent-ruler-bracket-layer { position: relative; min-height: 0; } .cent-ruler-bracket { position: absolute; height: 16px; color: var(--text-secondary); pointer-events: none; } .cent-ruler-bracket.is-drone-related { opacity: .48; } .cent-ruler-bracket-line { position: absolute; top: 10px; right: 0; left: 0; border-top: 2px solid color-mix(in srgb, var(--text-secondary) 78%, transparent); } .cent-ruler-bracket-cap { position: absolute; top: 6px; height: 9px; border-left: 2px solid; } .cent-ruler-bracket-cap.is-start { left: 0; border-left-color: var(--interval-start-color); } .cent-ruler-bracket-cap.is-end { right: 0; border-left-color: var(--interval-end-color); } .cent-ruler-bracket-label { position: absolute; top: -1px; left: 50%; z-index: 1; padding: 0 4px; border-radius: 3px; background: var(--surface-1); color: var(--text-primary); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; font-variant-numeric: tabular-nums; line-height: 1.25; white-space: nowrap; transform: translateX(-50%); } .cent-ruler-plot { position: relative; height: calc(66px + var(--cent-ruler-foreground-headroom, 28px)); } .cent-ruler-axis { position: absolute; right: 0; bottom: 22px; left: 0; border-top: 1px solid var(--text-secondary); } .cent-ruler-tick { position: absolute; bottom: 22px; width: 1px; border-left: 1px solid var(--text-secondary); transform: translateX(-.5px); } .cent-ruler-tick.is-major { height: 11px; } .cent-ruler-tick.is-minor { height: 6px; opacity: .7; } .cent-ruler-label { position: absolute; top: 13px; left: 0; color: var(--text-muted); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 10px; font-variant-numeric: tabular-nums; transform: translateX(-50%); } .cent-ruler-note { position: absolute; bottom: 22px; width: 2px; height: 37px; background: var(--cent-ruler-note-color); transform: translateX(-50%); } .cent-ruler-note::after { position: absolute; top: -3px; left: 50%; width: 12px; height: 12px; border: 1px solid color-mix(in srgb, var(--cent-ruler-note-color) 72%, var(--text-primary)); border-radius: 50%; background: var(--cent-ruler-note-color); content: ''; transform: translateX(-50%); } .cent-ruler-drone-dot { position: absolute; top: 1px; left: 50%; z-index: 1; width: 4px; height: 4px; border-radius: 50%; background: #000; pointer-events: none; transform: translateX(-50%); } .cent-ruler-note-label { position: absolute; top: 14px; left: 50%; padding: 0 2px; border-radius: 3px; background: color-mix(in srgb, var(--card) 82%, transparent); color: var(--text-primary); font-size: 9px; font-weight: 700; line-height: 1.2; text-align: center; transform: translateX(-50%); } .keyboard-note-help { margin: 0 0 20px; } .keyboard-note-help kbd { padding: .08rem .28rem; border: 1px solid var(--border); border-radius: 4px; background: var(--surface-2); color: var(--text-primary); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .92em; } .note-chip { min-width: 42px; color: var(--text-secondary); background: transparent; font-size: 13px; } #notesRow .note-chip.is-active-note, #notesRowB .note-chip.is-active-note { border-color: color-mix(in srgb, var(--note-chip-color) 72%, var(--text-primary)); background: var(--note-chip-color); color: var(--note-chip-foreground); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--note-chip-foreground) 24%, transparent); } #notesRow .note-chip.is-active-drone, #notesRowB .note-chip.is-active-drone { border-color: color-mix(in srgb, var(--note-chip-color) 62%, var(--text-primary)); background: color-mix(in srgb, var(--note-chip-color) 42%, var(--card)); color: var(--text-primary); box-shadow: inset 0 -3px 0 color-mix(in srgb, var(--note-chip-color) 72%, transparent); } .drone-note-chip.is-active:not(.is-drone-selected) { border-color: var(--border-accent); background: var(--bg-accent); color: var(--text-accent); } .drone-control { display: grid; gap: 8px; margin-bottom: 12px; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); } .drone-control-heading { display: grid; } .drone-control-heading .section-label, .drone-control-heading .field-help { margin: 0; } .drone-clear-button { flex: 0 0 auto; margin-left: 8px; padding: 6px 10px; border-style: dashed; color: var(--text-secondary); font-size: 12px; } .drone-note-chip.is-drone-selected { border-color: color-mix(in srgb, var(--drone-note-color) 72%, var(--text-primary)); background: color-mix(in srgb, var(--drone-note-color) 38%, var(--card)); color: var(--text-primary); box-shadow: inset 0 -3px 0 color-mix(in srgb, var(--drone-note-color) 82%, transparent); } .drone-note-chip.is-drone-selected.is-active { background: color-mix(in srgb, var(--drone-note-color) 62%, var(--card)); box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--drone-note-color) 78%, var(--text-primary)); } .scroll-frame { max-width: 100%; overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); } #rollWrap { max-height: 560px; margin-bottom: 0; overflow: auto; } #rollInner { position: relative; } .roll-label, .roll-line { position: absolute; border-top: 1px solid var(--border); } .roll-line { cursor: pointer; } .roll-label { left: 0; z-index: 2; display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 3px; padding: 0 5px; background: var(--card); color: var(--text-muted); font-size: 10px; } .roll-label.has-scale-b { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; } .roll-label-note { display: flex; height: 100%; min-width: 0; appearance: none; align-items: center; overflow: hidden; padding: 0; border: 0; background: transparent; color: var(--text-secondary); font: inherit; font-size: 10px; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; } .roll-label-note:disabled { cursor: default; } .roll-label-note:not(:disabled):hover { background: color-mix(in srgb, var(--hover) 72%, transparent); } .roll-label-note:focus-visible { outline: 1px solid var(--border-accent); outline-offset: -1px; } .roll-label-note-b { padding-left: 5px; border-left: 1px solid var(--border); color: var(--text-muted); } .roll-label-note-b.is-empty { color: transparent; } #rollInner.is-playback-source-a .roll-label-note-a { background: color-mix(in srgb, var(--scale-a-accent) 13%, transparent); } #rollInner.is-playback-source-b .roll-label-note-b { background: color-mix(in srgb, var(--scale-b-accent) 13%, transparent); } .roll-label-degree { color: var(--text-muted); font-size: 10px; font-variant-numeric: tabular-nums; } .roll-line.is-period-even { background: color-mix(in srgb, var(--surface-1) 40%, transparent); } .roll-line.is-period-odd { background: color-mix(in srgb, var(--hover) 46%, transparent); } .roll-line.is-period-boundary, .roll-label.is-period-boundary { border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 62%, var(--border)); } .roll-line.is-root, .roll-label.is-root { border-bottom: 2px solid var(--border-accent); background: color-mix(in srgb, var(--bg-accent) 45%, var(--card)); color: var(--text-accent); } .roll-label.is-root .roll-label-note, .roll-label.is-root .roll-label-degree { color: var(--text-accent); font-weight: 700; } .roll-gap-row { position: absolute; z-index: 2; display: flex; align-items: center; justify-content: center; overflow: hidden; border-top: 1px dashed color-mix(in srgb, var(--text-muted) 48%, transparent); border-bottom: 1px dashed color-mix(in srgb, var(--text-muted) 48%, transparent); background: color-mix(in srgb, var(--surface-1) 78%, transparent); color: var(--text-muted); font-size: 10px; font-style: italic; letter-spacing: .02em; white-space: nowrap; } .measure-boundary { position: absolute; top: 0; z-index: 1; width: 1px; border-left: 1px dashed color-mix(in srgb, var(--text-muted) 55%, transparent); pointer-events: none; } .measure-boundary.is-edge { border-left-color: color-mix(in srgb, var(--text-secondary) 70%, transparent); border-left-style: solid; } .roll-block { position: absolute; z-index: 3; padding: 0; border: 1px solid color-mix(in srgb, var(--note-color, var(--border-accent)) 72%, var(--text-primary)); border-radius: 4px; background: var(--note-color, var(--bg-accent)); } .roll-note-block { appearance: none; cursor: pointer; } .roll-note-block:hover { filter: brightness(1.08); } .roll-note-block:focus-visible { outline: 2px solid var(--text-primary); outline-offset: 1px; } .roll-accent-dot, .roll-quiet-dot { position: absolute; top: 50%; left: 50%; box-sizing: border-box; width: 4px; height: 4px; border-radius: 50%; pointer-events: none; transform: translate(-50%, -50%); } .roll-accent-dot { background: #000; } .roll-quiet-dot { border: 1px solid #000; background: transparent; } .roll-drone-block { z-index: 2; border-style: dashed; background: color-mix(in srgb, var(--note-color, var(--bg-accent)) 42%, var(--card)); opacity: .88; } .playback-bar-highlight { position: absolute; top: 0; z-index: 2; display: none; pointer-events: none; } .playback-bar-highlight.is-visible { display: block; } .playback-bar-highlight.is-scale-a { background: color-mix(in srgb, var(--scale-a-accent) 11%, transparent); } .playback-bar-highlight.is-scale-b { background: color-mix(in srgb, var(--scale-b-accent) 11%, transparent); } .playhead { position: absolute; top: 0; z-index: 4; display: none; width: 2px; background: var(--scale-a-accent); } .playhead.is-visible { display: block; } .playhead.is-scale-a { background: var(--scale-a-accent); } .playhead.is-scale-b { background: var(--scale-b-accent); } .scale-table { width: 100%; border-collapse: collapse; font-size: 13px; } .scale-table th, .scale-table td { padding: 8px 12px; border-bottom: 1px solid var(--border); text-align: left; } .scale-table th { color: var(--text-secondary); font-weight: 500; } .scale-table .degree-column { text-align: right; } .scale-table tbody tr.is-active-note td { background: color-mix(in srgb, var(--active-note-color) 50%, transparent); } .scale-table tbody tr.is-active-drone td { background: color-mix(in srgb, var(--active-note-color) 28%, transparent); } .scale-table tbody tr:last-child td { border-bottom: 0; } .interval-matrix-section { margin-top: 22px; } .interval-matrix-section .section-info-heading { margin-bottom: 8px; } .interval-matrix-heading-actions { display: flex; align-items: center; gap: 3px; margin-left: auto; } .interval-matrix-frame { position: relative; } .interval-matrix-transport { display: flex; align-items: center; gap: 3px; } .interval-matrix-transport-button { width: 21px; min-width: 21px; height: 21px; padding: 1px; border-color: transparent; border-radius: 50%; background: transparent; color: var(--text-muted); } .interval-matrix-transport-button svg { display: block; width: 17px; height: 17px; } .interval-matrix-transport-button:disabled { opacity: .42; } .interval-matrix-play-state.is-active { background: color-mix(in srgb, var(--success) 13%, transparent); color: var(--success); opacity: 1; } .interval-matrix-stop-button:not(:disabled):hover, .interval-matrix-stop-button:not(:disabled):focus-visible { border-color: color-mix(in srgb, var(--text-muted) 55%, transparent); background: var(--hover); color: var(--text-primary); } .interval-matrix-stop-button.is-flashing { animation: interval-matrix-stop-flash 220ms ease-out; } @keyframes interval-matrix-stop-flash { 0% { background: color-mix(in srgb, var(--warning) 50%, transparent); color: var(--warning); opacity: 1; transform: scale(1); } 55% { background: color-mix(in srgb, var(--warning) 22%, transparent); color: var(--warning); opacity: 1; transform: scale(.88); } 100% { background: transparent; color: var(--text-muted); opacity: .42; transform: scale(1); } } .interval-matrix-wrap { max-height: min(68vh, 720px); overflow: auto; } .interval-matrix { min-width: max-content; border-collapse: separate; border-spacing: 0; font-size: 11px; } .interval-matrix th, .interval-matrix td { padding: 0; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); } .interval-matrix tr:last-child th, .interval-matrix tr:last-child td { border-bottom: 0; } .interval-matrix th:last-child, .interval-matrix td:last-child { border-right: 0; } .interval-matrix th { background: var(--surface-1); color: var(--text-secondary); font-weight: 600; text-align: center; } .interval-matrix-corner { position: sticky; top: 0; left: 0; z-index: 4; width: 34px; min-width: 34px; padding: 7px 2px !important; box-shadow: inset 0 -1px 0 var(--border); } .interval-matrix-column-header { position: sticky; top: 0; z-index: 3; min-width: 64px; } .interval-matrix-row-header { position: sticky; left: 0; z-index: 2; width: 34px; min-width: 34px; text-align: center !important; } .interval-matrix-column-header.is-active, .interval-matrix-row-header.is-active { background: color-mix(in srgb, var(--matrix-note-color) 48%, var(--card)); color: var(--text-primary); } .interval-header-button { width: 100%; min-height: 36px; padding: 7px 4px; border: 0; border-radius: 0; background: transparent; color: inherit; font-weight: inherit; text-align: inherit; } .interval-matrix-column-header .interval-header-button { text-align: center; } .interval-header-button:hover { background: color-mix(in srgb, var(--matrix-note-color) 18%, transparent); } .interval-matrix-cell { background: var(--card); } .interval-cell-button { position: relative; display: grid; width: 100%; min-width: 64px; min-height: 64px; align-content: center; justify-items: center; gap: 1px; padding: 5px 4px; border: 0; border-radius: 0; background: transparent; color: var(--text-primary); text-align: center; } .interval-cell-button:hover { background-color: color-mix(in srgb, var(--hover) 80%, transparent); } .interval-matrix-cell.is-diagonal .interval-cell-button { background-color: color-mix(in srgb, var(--surface-1) 72%, var(--card)); background-image: linear-gradient(135deg, transparent calc(50% - .5px), color-mix(in srgb, var(--border) 82%, transparent) 50%, transparent calc(50% + .5px)); } .interval-matrix-cell.is-diagonal .interval-cell-button::after { position: absolute; z-index: 8; inset: 4px; display: grid; place-items: center; padding: 4px; border: 1px solid color-mix(in srgb, var(--border-accent) 48%, var(--border)); border-radius: 5px; background: color-mix(in srgb, var(--card) 94%, transparent); color: var(--text-primary); content: attr(data-tooltip); font-size: 9px; font-weight: 600; line-height: 1.2; opacity: 0; pointer-events: none; text-align: center; transform: scale(.97); transition: opacity 100ms ease, transform 100ms ease; white-space: normal; } .interval-matrix-cell.is-diagonal .interval-cell-button:hover::after, .interval-matrix-cell.is-diagonal .interval-cell-button:focus-visible::after { opacity: 1; transform: scale(1); } .interval-cell-cents { font-weight: 700; font-variant-numeric: tabular-nums; } .interval-cell-approximation, .interval-cell-error { color: var(--text-secondary); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 10px; font-variant-numeric: tabular-nums; white-space: nowrap; } .interval-cell-error { font-size: 9px; } .interval-cell-approximation.is-exact-ratio { color: var(--text-primary); font-weight: 800; } .interval-matrix-cell.is-active-row .interval-cell-button { background: color-mix(in srgb, var(--row-note-color) 20%, var(--card)); } .interval-matrix-cell.is-active-column .interval-cell-button { background: color-mix(in srgb, var(--column-note-color) 20%, var(--card)); } .interval-matrix-cell.is-active-row.is-active-column .interval-cell-button { background: linear-gradient(135deg, color-mix(in srgb, var(--row-note-color) 24%, var(--card)) 0 50%, color-mix(in srgb, var(--column-note-color) 24%, var(--card)) 50% 100%); } .interval-matrix-cell.is-playing-interval .interval-cell-button { position: relative; z-index: 1; background: var(--matrix-cell-fill); box-shadow: inset 0 0 0 1px var(--matrix-cell-fill-border); } .interval-matrix-cell.is-playing-interval.is-drone-only-interval .interval-cell-button { background: color-mix(in srgb, var(--warning) 13%, var(--card)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--warning) 50%, var(--card)); } .interval-matrix-cell.is-active-interval .interval-cell-button, .interval-matrix-cell.is-active-row.is-active-column.is-active-interval .interval-cell-button { position: relative; z-index: 2; background: color-mix(in srgb, var(--warning) 34%, var(--card)); box-shadow: inset 0 0 0 2px var(--warning); } .interval-matrix-cell.is-active-interval .interval-cell-approximation, .interval-matrix-cell.is-playing-interval .interval-cell-approximation, .interval-matrix-cell.is-active-interval .interval-cell-error, .interval-matrix-cell.is-playing-interval .interval-cell-error { color: var(--text-primary); } .interval-matrix-empty { margin: 0; padding: 14px; color: var(--text-secondary); } .mono { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; } [hidden] { display: none !important; } @media (max-width: 1320px) { .sound-shaping-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .effects-block { grid-column: 1 / -1; } } @media (max-width: 1180px) { .sound-grid { grid-template-columns: repeat(3, minmax(150px, 170px)); } } @media (max-width: 920px) { .workspace-grid { display: flex; height: auto; min-height: 0; flex-direction: column; } .scale-workspace, .workspace-grid.has-scale-b .scale-workspace { flex: 0 0 auto; width: 100%; min-width: 0; min-height: 0; overflow: visible; } .melody-player-panel, .workspace-grid.has-scale-b .melody-player-panel { flex: 0 0 auto; width: 100%; min-width: 0; min-height: 0; overflow: visible; } .workspace-grid > .workspace-divider { display: none; } .workspace-panel-intro { min-height: 0; } .workspace-panel-intro .panel-heading { min-height: 0; margin-bottom: 12px; } .scale-panel, .melody-player-panel { padding: 20px; } } @media (max-width: 700px) { .scale-workspace, .workspace-grid.has-scale-b .scale-workspace { display: grid; grid-template-columns: 1fr; gap: 0; } .scale-workspace > .scale-divider { display: none; } .workspace-grid.has-scale-b .scale-a-panel, .workspace-grid.has-scale-b .scale-b-panel { min-width: 0; } } @media (max-width: 760px) { .sound-shaping-grid { grid-template-columns: 1fr; } .effects-block { grid-column: auto; } } @media (max-width: 700px) { .effect-routing { overflow-x: auto; } .effect-routing-matrix { min-width: 430px; } body { padding: 14px; } .panel { padding: 16px; } .panel-heading, .workspace-grid .panel-heading { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; } .sound-grid { grid-template-columns: repeat(2, minmax(130px, 170px)); } .envelope-grid, .mixer-controls { grid-template-columns: repeat(2, minmax(120px, 1fr)); } } @media (max-width: 520px) { .status-chip { max-width: calc(100vw - 48px); } .app-header-top-row { align-items: flex-start; flex-direction: column; } .app-header-actions { width: 100%; justify-content: flex-start; } .header-reset-actions, .header-appearance-controls { flex-wrap: wrap; } .header-appearance-controls { width: 100%; } .header-appearance-field { flex: 1 1 260px; } .header-appearance-field select { flex: 1 1 150px; width: auto; } .sound-grid, .envelope-grid, .mixer-controls { grid-template-columns: 1fr; } .sound-shaping-grid { grid-template-columns: 1fr; } .sequence-action-buttons { width: 100%; } .sequence-playback-action .icon-button { flex: 1 1 0; } .sequence-playback-action { flex-wrap: wrap; } input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea { font-size: 16px !important; } .parameter-row { grid-template-columns: 24px minmax(0, 1fr); } .parameter-actions, .parameter-remove-button { grid-column: 2; } .parameter-actions { justify-content: flex-start; } .parameter-value { grid-column: 2; } .sequence-playback-row { align-items: flex-start; flex-direction: column; } .drone-clear-button { margin-left: auto; } .drone-timbre-group, .drone-playback-group { grid-template-columns: 1fr; } } @media (prefers-color-scheme: dark) { :root { --surface-1: #202124; --surface-2: #151617; --border: #3c4043; --text-primary: #f1f3f4; --text-secondary: #bdc1c6; --text-muted: #9aa0a6; --bg-accent: #1f3b63; --text-accent: #aecbfa; --border-accent: #669df6; --bg-danger: #4c1d1a; --border-danger: #f28b82; --text-danger: #f28b82; } } /* Scala file import and export */ .scale-file-actions { display: flex; gap: 6px; } .scale-file-button { width: 36px; min-width: 36px; padding: 7px; } .scale-file-icon { display: block; width: 18px; height: 18px; } .scala-dialog { width: min(560px, calc(100vw - 32px)); max-height: min(80vh, 720px); padding: 0; overflow: auto; border: 1px solid var(--border); border-radius: var(--panel-radius); background: var(--card); color: var(--text-primary); box-shadow: 0 24px 70px color-mix(in srgb, var(--text-primary) 28%, transparent); } .scala-dialog::backdrop { background: color-mix(in srgb, var(--text-primary) 38%, transparent); } .scala-dialog-card { display: grid; gap: 14px; padding: 22px; } .scala-dialog-card h2, .scala-dialog-card p { margin: 0; } .scala-dialog-details { display: grid; grid-template-columns: minmax(120px, auto) 1fr; gap: 7px 14px; margin: 0; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-1); font-size: 13px; } .scala-dialog-details dt { color: var(--text-secondary); font-weight: 600; } .scala-dialog-details dd { min-width: 0; margin: 0; overflow-wrap: anywhere; } .scala-dialog-subtitle { margin: 0 0 6px; color: var(--text-heading); font-size: 13px; } .scala-issue-list { margin: 0; padding-left: 20px; color: var(--text-secondary); font-size: 13px; line-height: 1.45; } .scala-import-option { display: flex; align-items: center; gap: 8px; color: var(--text-secondary); font-size: 13px; } .scala-import-option input { margin: 0; } .scala-replace-notice { padding: 10px 12px; border-left: 3px solid var(--warning); background: color-mix(in srgb, var(--warning) 11%, var(--card)); color: var(--text-secondary); font-size: 13px; } .scala-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; } /* Scale-note syntax dialog */ .scale-notes-help-dialog { width: min(720px, calc(100vw - 32px)); } .feature-help-dialog { width: min(760px, calc(100vw - 32px)); } .info-dialog { max-height: 80vh; max-height: 80dvh; overflow: hidden; } .info-dialog-card { position: relative; grid-template-rows: auto minmax(0, 1fr); max-height: 80vh; max-height: 80dvh; overflow: hidden; padding-top: 24px; } .info-dialog-card > h2 { padding-right: 48px; } .info-dialog-content { min-height: 0; overflow: auto; padding: 2px 4px 2px 2px; scrollbar-gutter: stable; } .info-dialog-close { position: absolute; z-index: 2; top: 10px; right: 10px; display: grid; width: 38px; min-width: 38px; height: 38px; place-items: center; padding: 0 0 3px; border: 2px solid color-mix(in srgb, var(--border-accent) 72%, var(--text-primary)); border-radius: 999px; background: var(--text-primary); color: var(--card); box-shadow: 0 4px 14px color-mix(in srgb, var(--text-primary) 24%, transparent); font-size: 26px; font-weight: 700; line-height: 1; } .info-dialog-close:hover, .info-dialog-close:focus-visible { border-color: var(--text-primary); background: var(--text-accent); color: var(--card); transform: scale(1.05); } .system-preferences-dialog { width: min(560px, calc(100vw - 32px)); } .system-preferences-card { position: relative; padding-top: 24px; } .system-preferences-card > h2 { padding-right: 48px; } .system-preferences-section { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-1); } .system-preferences-section-heading { display: grid; gap: 4px; } .system-preferences-section-heading h3 { margin: 0; color: var(--text-heading); font-size: 14px; } .system-preferences-section-heading p { margin: 0; color: var(--text-secondary); font-size: 12px; line-height: 1.45; } .display-precision-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; } .display-precision-grid .field { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 6px; } .display-precision-grid .field > span { color: var(--text-secondary); font-size: 12px; font-weight: 500; white-space: nowrap; } .display-precision-grid select { width: 100%; } .note-color-interpolation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 320px)); gap: 12px; } .note-color-interpolation-grid .field { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 6px; } .note-color-interpolation-grid .field > span { color: var(--text-secondary); font-size: 12px; font-weight: 500; white-space: nowrap; } .note-color-interpolation-grid select { width: 100%; } @media (max-width: 520px) { .display-precision-grid, .note-color-interpolation-grid { grid-template-columns: 1fr; } } .theme-catalog-dialog { width: min(1180px, calc(100vw - 32px)); } .theme-catalog-content { display: grid; min-height: 0; grid-template-rows: auto auto minmax(0, 1fr); gap: 14px; overflow: hidden; } .theme-catalog-table-scroll { min-height: 0; overflow: auto; scrollbar-gutter: stable; } .theme-catalog-settings { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-1); } .theme-catalog-setting-field { display: inline-flex; align-items: center; gap: 7px; color: var(--text-secondary); font-size: 12px; } .theme-catalog-setting-label { font-weight: 600; white-space: nowrap; } .theme-catalog-setting-toggle { flex: 0 0 auto; } .theme-catalog-table { width: 100%; border-collapse: collapse; font-size: 12px; } .theme-catalog-table thead th { position: sticky; top: 0; z-index: 1; background: var(--card); } .theme-catalog-table th, .theme-catalog-table td { padding: 8px 10px; border-bottom: 1px solid var(--border); vertical-align: top; text-align: left; } .theme-catalog-table thead th:first-child, .theme-catalog-table .theme-catalog-name { text-align: right; } .theme-catalog-name { min-width: 150px; color: var(--text-heading); font-weight: 600; } .theme-preview-unavailable { color: var(--text-secondary); font-style: italic; } .theme-catalog-table .theme-catalog-group-row th { padding-top: 16px; text-align: left; background: var(--surface-1); color: var(--text-heading); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .theme-catalog-row { cursor: pointer; } .theme-catalog-row:hover > *, .theme-catalog-row:focus-visible > * { background: var(--hover); } .theme-catalog-row:focus-visible { outline: 2px solid var(--border-accent); outline-offset: -2px; } .theme-catalog-row.is-selected > * { background: color-mix(in srgb, var(--bg-accent) 44%, transparent); } .theme-swatch-row, .theme-degree-row { display: flex; flex-wrap: wrap; gap: 6px; } .theme-swatch { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 4px; border: 1px solid color-mix(in srgb, var(--border) 72%, transparent); border-radius: 6px; font-size: 10px; font-weight: 700; line-height: 1; } .theme-degree-row .theme-swatch { min-width: 24px; } .theme-twelve-tet-row .theme-swatch { min-width: 30px; padding-inline: 5px; } @media (max-width: 780px) { .theme-catalog-table, .theme-catalog-table thead, .theme-catalog-table tbody, .theme-catalog-table tr, .theme-catalog-table th, .theme-catalog-table td { display: block; } .theme-catalog-table thead { display: none; } .theme-catalog-row { border-bottom: 1px solid var(--border); } .theme-catalog-row > th, .theme-catalog-row > td { padding: 8px 0; border: 0; } } .scale-notes-help-content, .feature-help-content { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .scale-notes-help-content section, .feature-help-content section { min-width: 0; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-1); } .scale-notes-help-content h3, .feature-help-content h3 { margin: 0 0 6px; color: var(--text-heading); font-size: 13px; } .scale-notes-help-content p, .feature-help-content p { margin: 0; color: var(--text-secondary); font-size: 13px; line-height: 1.45; } .user-action { padding: .04em .28em; border: 1px solid color-mix(in srgb, var(--border) 58%, var(--text-primary)); border-radius: 4px; background: color-mix(in srgb, var(--card) 72%, var(--surface-1)); box-decoration-break: clone; color: var(--text-primary); font-weight: 700; -webkit-box-decoration-break: clone; } .scale-notes-help-content code { overflow-wrap: anywhere; } @media (max-width: 620px) { .scale-notes-help-content, .feature-help-content { grid-template-columns: 1fr; } } /* Independent drone/chord layers */ .drone-layers-list { display: grid; gap: 10px; } .drone-layer-card { display: grid; gap: 10px; padding: 10px; border: 1px solid var(--border); border-radius: calc(var(--radius) - 2px); background: var(--card); transition: opacity 120ms ease; } .drone-layer-card.is-muted { opacity: .68; } .drone-layer-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; } .drone-layer-title { margin: 0; color: var(--text-primary); font-size: 13px; font-weight: 700; } .drone-layer-heading-actions { display: flex; align-items: center; gap: 6px; } .drone-layer-remove-button, .drone-clear-button { padding: 5px 8px; color: var(--text-secondary); font-size: 12px; } .drone-instructions-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; color: var(--text-secondary); font-size: 12px; line-height: 1.45; } .drone-inspect-options { display: inline-flex; flex-wrap: wrap; gap: 5px; } .drone-inspect-chip { min-width: 28px; padding: 3px 7px; border-color: var(--border); border-radius: 999px; background: transparent; color: var(--text-secondary); font-size: 11px; line-height: 1.2; } .drone-inspect-chip.is-selected { border-width: 2px; border-color: color-mix(in srgb, var(--border) 42%, var(--text-primary)); background: var(--card); color: var(--text-primary); box-shadow: none; } .drone-layer-notes { display: flex; flex-wrap: wrap; gap: 6px; } .drone-layer-controls { --drone-mode-select-width: 150px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; } .drone-layer-field { display: grid; gap: 4px; min-width: 0; color: var(--text-secondary); font-size: 12px; } .drone-timbre-group { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr); flex: 1 1 360px; min-width: min(100%, 320px); align-items: end; gap: 10px; } .drone-playback-group { display: grid; grid-template-columns: repeat(2, max-content); flex: 0 0 auto; align-items: end; gap: 10px; } .drone-playback-field, .drone-arpeggio-direction-field { grid-template-columns: auto var(--drone-mode-select-width); align-items: center; } .drone-level-transpose-group { display: grid; grid-template-columns: minmax(0, 248px) max-content; flex: 0 1 512px; min-width: 470px; align-items: center; gap: 10px; } .drone-layer-level-field { grid-template-columns: max-content minmax(108px, 138px) 32px; align-items: center; gap: 6px; } .drone-layer-inline-label { white-space: nowrap; } .drone-transpose-field { grid-template-columns: auto 58px auto 58px auto; align-items: center; gap: 6px; white-space: nowrap; } .drone-position-window-group { display: grid; grid-template-columns: max-content max-content; flex: 0 0 auto; min-width: 0; align-items: center; gap: 10px; } .drone-position-field { grid-template-columns: auto var(--drone-mode-select-width); align-items: center; } .drone-layer-field input[type="range"] { width: 100%; padding: 0; } .drone-layer-field input, .drone-layer-field select { min-width: 0; max-width: 100%; } .drone-layer-field > select, .drone-window-field > select { width: 100%; } .drone-layer-field input[type="number"] { width: var(--compact-field-width); } .drone-layer-value { color: var(--text-primary); font-variant-numeric: tabular-nums; } .drone-window-field, .drone-activity-field { grid-template-columns: auto minmax(54px, 64px) minmax(76px, 1fr); align-items: center; } .drone-activity-field { flex: 1 0 100%; grid-template-columns: auto var(--drone-mode-select-width) 96px minmax(110px, auto); justify-content: start; } .drone-activity-value:disabled { opacity: .52; border-color: color-mix(in srgb, var(--border) 72%, transparent); background: color-mix(in srgb, var(--card) 70%, var(--background)); color: var(--text-muted); cursor: not-allowed; } .drone-list-actions { display: flex; justify-content: flex-end; gap: 8px; } .drone-list-actions button { font-size: inherit; } .drone-empty-message { margin: 0; padding: 8px 0; } .drone-layer-mute-button { width: 32px; min-width: 32px; height: 30px; padding: 5px; } .roll-drone-block.is-muted { border-style: dotted; background: transparent; opacity: .42; } .cent-ruler-note.is-drone-dimmed .cent-ruler-drone-dot { opacity: .34; } .cent-ruler-note.is-drone-dimmed::after { opacity: .62; } @media (max-width: 760px) { .sound-shaping-grid { grid-template-columns: 1fr; } .effects-block { grid-column: auto; } } @media (max-width: 700px) { .effect-routing { overflow-x: auto; } .effect-routing-matrix { min-width: 430px; } .drone-level-transpose-group { flex-basis: 100%; min-width: min(100%, 470px); } .drone-playback-group, .drone-position-window-group { flex-basis: 100%; grid-template-columns: max-content max-content; } .drone-window-field, .drone-activity-field { grid-template-columns: auto minmax(58px, auto) minmax(76px, 1fr); } .drone-activity-field { grid-template-columns: auto var(--drone-mode-select-width) 96px minmax(110px, auto); } .drone-list-actions { flex-wrap: wrap; } } /* Application identity and feedback */ .app-brand-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; } .app-footer-link { padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; font-size: inherit; text-decoration: underline; text-decoration-color: color-mix(in srgb, currentColor 58%, transparent); text-underline-offset: 2px; } .app-footer-link:hover, .app-footer-link:focus-visible { color: var(--text-primary); } .feedback-dialog { width: min(680px, calc(100vw - 32px)); } .feedback-form { gap: 16px; } .feedback-delivery-note { color: var(--text-secondary); font-size: 13px; line-height: 1.45; } .feedback-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .feedback-field { display: grid; gap: 6px; color: var(--text-secondary); font-size: 13px; font-weight: 600; } .feedback-field input, .feedback-field select, .feedback-field textarea { width: 100%; min-width: 0; font-weight: 400; } .feedback-field textarea { resize: vertical; line-height: 1.45; } .feedback-optional { color: var(--text-muted); font-weight: 400; } .feedback-options { display: grid; gap: 8px; margin: 0; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-1); color: var(--text-secondary); font-size: 13px; } .feedback-options legend { padding: 0 4px; color: var(--text-heading); font-weight: 700; } .feedback-options label { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 8px; line-height: 1.4; } .feedback-options input { margin-top: 2px; } .feedback-delivery-note { margin: 0; padding: 10px 12px; border-left: 3px solid var(--border-accent); background: color-mix(in srgb, var(--bg-accent) 54%, transparent); } .feedback-turnstile { min-height: 65px; } .feedback-status { min-height: 1.4em; margin: 0; color: var(--text-secondary); font-size: 13px; } .feedback-status.is-success { color: var(--success); } .feedback-status.is-error { color: var(--text-danger); } .feedback-fallback-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-1); } .feedback-fallback-actions[hidden] { display: none; } .feedback-email-link { display: inline-flex; align-items: center; justify-content: center; padding: 8px 12px; border: 1px solid var(--border); border-radius: var(--radius); color: var(--text-primary); font: inherit; text-decoration: none; cursor: pointer; } .feedback-email-link:focus-visible { outline: 3px solid color-mix(in srgb, var(--border-accent) 55%, transparent); outline-offset: 2px; } @media (max-width: 620px) { .feedback-grid { grid-template-columns: 1fr; } } /* Environment/evolution melody generator */ .composition-workspace { min-width: 0; padding-top: 2px; } .composition-workspace-heading { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 10px 18px; margin-bottom: 12px; } .composition-workspace-heading .eyebrow { margin-bottom: 4px; } .composition-tabs { display: inline-flex; max-width: 100%; align-items: center; gap: 4px; padding: 3px; border: 1px solid var(--border); border-radius: calc(var(--radius) + 2px); background: var(--surface-1); overflow-x: auto; } .composition-tab { flex: 0 0 auto; min-height: 30px; padding: 5px 11px; border: 1px solid transparent; border-radius: var(--radius); background: transparent; color: var(--text-secondary); font-size: 12px; font-weight: 700; } .composition-tab:hover, .composition-tab:focus-visible { border-color: var(--border); background: var(--hover); color: var(--text-primary); } .composition-tab.is-selected, .composition-tab[aria-selected="true"] { border-color: var(--border-accent); background: var(--bg-accent); color: var(--text-accent); } .composition-tab-panel { min-width: 0; } .composition-tab-panel > .drone-control, .composition-tab-panel > .melody-generation-section, .composition-tab-panel > .composition-modulation-panel { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; } .composition-modulation-panel { display: grid; gap: 14px; } .composition-modulation-panel.is-probe-disabled { opacity: .42; filter: saturate(.55); } .melody-generation-section { gap: 0; } .melody-generator-rows { display: grid; gap: 14px; } .melody-generator-row { min-width: 0; padding: 14px; border: 1px solid var(--border); border-radius: calc(var(--panel-radius) - 2px); background: var(--surface-1); } .melody-generator-row-unboxed { padding: 0; border: 0; border-radius: 0; background: transparent; } .melody-generator-row-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; } .melody-generator-row-heading .section-label { margin: 0; } .melody-generator-row-heading p { margin: 0; color: var(--text-muted); font-size: 12px; line-height: 1.4; text-align: right; } .melody-modulator-grid { display: grid; gap: 12px; } .environment-modulators { grid-template-columns: repeat(2, minmax(260px, 1fr)); } .evolution-modulators { grid-template-columns: repeat(2, minmax(260px, 1fr)); } .melody-modulator { display: grid; grid-template-columns: minmax(112px, .58fr) minmax(160px, 1.82fr) minmax(122px, auto); grid-template-areas: "label slider output" ". footer footer"; align-items: center; gap: 7px 14px; min-width: 0; padding: 10px; border: 1px solid color-mix(in srgb, var(--border) 75%, transparent); border-radius: var(--radius); background: var(--card); } .melody-modulator > label { grid-area: label; min-width: 0; padding-right: 3px; color: var(--text-secondary); font-size: 13px; font-weight: 600; line-height: 1.2; text-align: right; overflow-wrap: normal; } .melody-modulator-label-control { grid-area: label; display: grid; justify-items: end; gap: 5px; min-width: 0; padding-right: 3px; } .melody-modulator-label-control > label { color: var(--text-secondary); font-size: 13px; font-weight: 600; line-height: 1.2; text-align: right; } .melody-mutation-switch .scale-library-button { min-height: 22px; padding: 2px 7px; font-size: 10px; font-weight: 700; } .melody-modulator > output { grid-area: output; color: var(--text-accent); font-size: 12px; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; } .melody-modulator-slider { grid-area: slider; position: relative; min-width: 0; height: 32px; } .melody-modulator-range-track { position: absolute; top: 50%; right: 8.5px; left: 8.5px; height: 5px; border-radius: 999px; transform: translateY(-50%); background: var(--track); pointer-events: none; } .melody-modulator-range-fill { position: absolute; top: 0; bottom: 0; left: 0; width: 0; border-radius: inherit; background: color-mix(in srgb, var(--border-accent) 48%, transparent); pointer-events: none; } .melody-modulator-slider input[type="range"] { position: absolute; z-index: 3; inset: 0; width: 100%; height: 32px; margin: 0; padding: 0; appearance: none; -webkit-appearance: none; background: transparent; pointer-events: none; } .melody-modulator-slider input[type="range"]::-webkit-slider-runnable-track { height: 5px; background: transparent; } .melody-modulator-slider input[type="range"]::-moz-range-track { height: 5px; background: transparent; } .melody-modulator-slider input[type="range"]::-moz-range-progress { height: 5px; background: transparent; } .melody-modulator-slider input[type="range"]::-webkit-slider-thumb { width: 17px; height: 17px; margin-top: -6px; border: 2px solid var(--card); border-radius: 50%; background: var(--text-accent); box-shadow: 0 0 0 1px var(--border); appearance: none; -webkit-appearance: none; pointer-events: auto; cursor: grab; } .melody-modulator-slider input[type="range"]::-moz-range-thumb { width: 17px; height: 17px; border: 2px solid var(--card); border-radius: 50%; background: var(--text-accent); box-shadow: 0 0 0 1px var(--border); pointer-events: auto; cursor: grab; } .melody-modulator-slider input.melody-modulator-current[type="range"] { z-index: 4; } .melody-modulator-slider input.melody-modulator-current[type="range"]::-webkit-slider-thumb { width: 5px; height: 27px; margin-top: -11px; border: 1px solid var(--card); border-radius: 999px; background: var(--warning); box-shadow: 0 0 0 1px var(--border); cursor: ew-resize; } .melody-modulator-slider input.melody-modulator-current[type="range"]::-moz-range-thumb { width: 5px; height: 27px; border: 1px solid var(--card); border-radius: 999px; background: var(--warning); box-shadow: 0 0 0 1px var(--border); cursor: ew-resize; } .melody-modulator-footer { grid-area: footer; display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; } .melody-waveform-selector { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; } .melody-waveform-button { display: inline-grid; width: 24px; min-width: 24px; height: 20px; padding: 2px; place-items: center; border: 1px solid var(--border); border-radius: 5px; background: transparent; color: var(--text-muted); } .melody-waveform-button:hover, .melody-waveform-button:focus-visible { border-color: var(--text-secondary); background: var(--hover); color: var(--text-primary); } .melody-waveform-button[aria-pressed="true"] { border-color: var(--border-accent); background: var(--bg-accent); color: var(--text-accent); } .melody-waveform-button svg { display: block; width: 18px; height: 12px; overflow: visible; } .melody-waveform-button path, .melody-waveform-button polyline { fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; } .melody-cycle-control { display: flex; justify-content: flex-end; align-items: center; gap: 5px; color: var(--text-muted); font-size: 11px; white-space: nowrap; } .melody-cycle-control input { width: 52px; padding: 4px 6px; font-variant-numeric: tabular-nums; } .melody-global-grid { display: grid; grid-template-columns: repeat(2, minmax(260px, 1fr)); gap: 10px 16px; } .melody-global-control { display: grid; grid-template-columns: minmax(100px, auto) minmax(0, 1fr); align-items: center; gap: 8px 12px; min-width: 0; } .melody-global-control > span:first-child, .melody-global-control > label { color: var(--text-secondary); font-size: 13px; font-weight: 600; } .global-melody-waveforms { gap: 4px; } .global-melody-waveforms .melody-waveform-button { width: 28px; min-width: 28px; height: 23px; } .melody-global-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; min-width: 0; } .melody-global-actions button { padding: 6px 9px; font-size: 12px; } .melody-global-actions input { width: 64px; padding: 6px 8px; } .melody-global-modulators-heading { align-items: center; } .melody-generation-parameter-group, .melody-global-grid { transition: opacity 120ms ease, filter 120ms ease; } .melody-generation-section.is-generation-disabled .melody-generation-parameter-group, .melody-global-modulators.is-modulation-disabled .melody-global-grid { opacity: .42; filter: saturate(.55); } .melody-modulation-switch { flex: 0 0 auto; } .binary-toggle .scale-library-button { min-height: 28px; padding: 4px 10px; font-weight: 700; } @media (max-width: 1180px) { .environment-modulators, .evolution-modulators { grid-template-columns: 1fr; } } @container (max-width: 900px) { .environment-modulators, .evolution-modulators { grid-template-columns: 1fr; } } @media (max-width: 700px) { .effect-routing { overflow-x: auto; } .effect-routing-matrix { min-width: 430px; } .roll-section-heading { align-items: flex-start; flex-direction: column; } .roll-view-controls { justify-content: flex-end; } .melody-generator-row-heading { align-items: flex-start; flex-direction: column; gap: 4px; } .melody-generator-row-heading p { text-align: left; } .melody-global-grid { grid-template-columns: 1fr; } } @media (max-width: 520px) { .sequence-playback-row.scale-comparison-controls { align-items: center; flex-direction: row; } .roll-row-controls { flex-wrap: wrap; } .melody-global-control { grid-template-columns: 1fr; } } @container (max-width: 480px) { .melody-modulator { grid-template-columns: minmax(112px, auto) minmax(0, 1fr); grid-template-areas: "label output" "slider slider" "footer footer"; } .melody-modulator > output { text-align: right; } .melody-modulator-label-control { justify-items: start; padding-right: 0; } .melody-modulator-label-control > label { text-align: left; } .melody-modulator-footer { align-items: flex-start; flex-direction: column; } .melody-cycle-control { justify-content: flex-start; } } /* Composition pane headers and persistent pane contents */ .composition-pane-header { display: grid; min-width: 0; min-height: 32px; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 14px; } .composition-pane-header .section-info-heading { min-width: 0; } .composition-pane-toggle { grid-column: 2; grid-row: 1; justify-self: end; align-self: center; } .drone-control .collapsible-section-content { display: grid; gap: 8px; transition: opacity 120ms ease, filter 120ms ease; } .drone-header-actions, .melody-generation-header-actions { display: flex; align-items: center; gap: 6px; } .drone-enabled-switch, .melody-generation-switch, .melody-modulation-switch { flex: 0 0 auto; } .drone-control.is-drone-disabled .collapsible-section-content { opacity: .42; filter: saturate(.55); } .melody-generation-section > .collapsible-section-content { display: grid; gap: 14px; } .melody-generation-section.is-probe-disabled .melody-generation-switch, .melody-generation-section.is-probe-disabled > .collapsible-section-content, .melody-generation-section.is-probe-disabled .melody-generation-header .section-label { opacity: .42; filter: saturate(.55); } .melody-generation-section.is-probe-disabled .melody-generation-switch { pointer-events: none; } .melody-length-settings { margin-top: 16px; } .melody-preset-section { display: flex; align-items: center; } .melody-preset-section select { width: min(220px, 100%); min-width: 0; } @media (max-width: 700px) { .effect-routing { overflow-x: auto; } .effect-routing-matrix { min-width: 430px; } } .scale-name-label-row { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 8px; } .my-scale-modified-badge { flex: 0 0 auto; padding: 2px 7px; border: 1px solid color-mix(in srgb, var(--border-accent) 72%, var(--border)); border-radius: 999px; background: color-mix(in srgb, var(--bg-accent) 72%, var(--card)); color: var(--text-accent); font-size: 11px; font-weight: 700; line-height: 1.25; } .my-scale-modified-badge[hidden] { display: none; } .my-scale-actions { display: flex; flex-wrap: wrap; gap: 0.38rem; margin-top: 0.45rem; } .my-scale-actions[hidden] { display: none; } .my-scale-action-button { min-height: 1.8rem; padding: 0.22rem 0.52rem; font-size: 0.78rem; } .my-scale-action-button:disabled { opacity: 0.42; cursor: not-allowed; } .my-scale-save-button.is-unsaved { border-color: var(--border-accent); background: color-mix(in srgb, var(--bg-accent) 74%, var(--input)); color: var(--text-accent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--border-accent) 24%, transparent); } .my-scale-description-field { margin-top: 0.45rem; } .my-scale-description-field[hidden] { display: none; } .my-scale-description-field textarea { width: 100%; min-width: 0; resize: vertical; line-height: 1.35; } /* Keep text-entry fields and native menus visually consistent with Drone controls. */ input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select { height: var(--form-control-height) !important; min-height: var(--form-control-height); padding: 6px 8px !important; font-size: 12px !important; line-height: 1.2; } select { padding-right: 26px !important; } /* Adaptive musical probes */ .probe-selector-field { display: flex; width: 100%; max-width: 100%; min-width: 0; flex-wrap: wrap; align-items: center; gap: 6px 10px; color: var(--text-secondary); font-size: 12px; } .probe-selector-field[hidden] { display: none; } .probe-selector-field > label:first-child { flex: 0 0 auto; } .probe-selector-field > #probeSelect { flex: 0 1 320px; min-width: min(220px, 100%); max-width: 100%; } .probe-parameter-panel { display: flex; width: 100%; min-width: 0; flex-wrap: wrap; align-items: end; gap: 8px 12px; overflow: visible; padding: 8px; border: 1px solid var(--border-subtle); border-radius: 6px; background: color-mix(in srgb, var(--bg-secondary) 75%, transparent); } .probe-preset-field, .probe-parameter-field { min-width: 140px; color: var(--text-secondary); font-size: 11px; } .probe-preset-field { display: flex; flex: 0 1 240px; align-items: center; gap: 6px; } .probe-preset-field span { flex: 0 0 auto; } .probe-preset-field select { flex: 1 1 auto; } .probe-parameter-controls { flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 8px 10px; min-width: 0; } .probe-parameter-field { display: grid; flex: 1 1 160px; max-width: 260px; gap: 4px; } .probe-parameter-control { display: flex; min-width: 0; align-items: center; gap: 5px; } .probe-parameter-control input, .probe-parameter-control select, .probe-preset-field select { width: 100%; min-width: 0; } .probe-parameter-degree-pattern, .probe-parameter-rhythm-pattern { flex-basis: 280px; max-width: 460px; } .probe-parameter-unit { flex: 0 0 auto; color: var(--text-muted); font-size: 10px; white-space: nowrap; } .probe-mode-notice { display: block; width: 100%; padding: 6px 8px; border-left: 3px solid var(--border-accent); border-radius: 3px; background: color-mix(in srgb, var(--bg-accent) 42%, transparent); background-clip: padding-box; color: var(--text-primary); font-size: 12px; font-weight: 600; line-height: 1.45; } .drone-probe-notice { flex: 1 0 100%; margin: 0 0 6px; } .drone-control.is-probe-bypassed .drone-instructions-row { margin-top: 3px; } .melody-generation-probe-notice { margin: 0 0 10px; } .drone-control.is-probe-bypassed .drone-layers-list, .drone-control.is-probe-bypassed .drone-list-actions, .drone-control.is-probe-bypassed .drone-inspect-options, .drone-control.is-probe-bypassed .drone-instructions-row > span:not(.drone-probe-notice) { opacity: .42; } @media (max-width: 700px) { .probe-selector-field { width: 100%; } .probe-selector-field > #probeSelect, .probe-preset-field { flex: 1 1 100%; min-width: 0; } .roll-view-controls { justify-content: flex-end; } } /* Editable melody notation */ .melody-notes-field { display: grid; gap: 6px; width: min(100%, 920px); margin-top: 8px; } .melody-notes-field label { color: var(--text-heading); font-size: 12px; font-weight: 700; } .melody-notes-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 8px 14px; flex-wrap: wrap; } .melody-notes-heading { justify-content: flex-start; } .melody-tune-preset-control { display: inline-flex; align-items: center; gap: 6px; } .melody-tune-preset-field { display: inline-flex; align-items: center; gap: 6px; margin: 0; } .melody-tune-preset-field select { min-width: min(360px, 62vw); } .melody-tune-reload-button { flex: 0 0 auto; width: 32px; height: 32px; padding: 5px; } .melody-notes-field textarea { width: 100%; min-height: 82px; resize: vertical; background: var(--surface-1); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; line-height: 1.45; } .melody-notes-field .field-help { margin: 0; } .melody-notes-error { min-height: 1.2em; margin: 0; color: var(--text-danger); font-size: 12px; line-height: 1.35; } .melody-notes-field.is-invalid textarea { border-color: var(--border-danger); background: var(--bg-danger); } .roll-pitch-alteration { position: absolute; top: -8px; right: -3px; z-index: 2; padding: 0 2px; border-radius: 3px; background: color-mix(in srgb, var(--surface-1) 88%, transparent); color: var(--text-primary); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 10px; font-weight: 700; line-height: 1.2; pointer-events: none; white-space: nowrap; } .cent-ruler-foreground-note { position: absolute; bottom: 22px; z-index: 3; width: 2px; height: 37px; background: var(--cent-ruler-foreground-color); transform: translateX(-50%); pointer-events: none; } .cent-ruler-foreground-note::after { position: absolute; top: -3px; left: 50%; width: 12px; height: 12px; border: 1px solid color-mix(in srgb, var(--cent-ruler-foreground-color) 72%, var(--text-primary)); border-radius: 50%; background: var(--cent-ruler-foreground-color); content: ''; transform: translateX(-50%); } .cent-ruler-foreground-period-stack { position: absolute; right: auto; bottom: calc(100% + 4px); left: 50%; z-index: 5; display: flex; flex-direction: column; align-items: center; color: var(--cent-ruler-foreground-color); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 11px; font-weight: 900; line-height: 9px; text-align: center; transform: translateX(-50%); } .cent-ruler-foreground-period-mark { display: block; height: 9px; min-width: 11px; text-shadow: 0 .35px 0 currentColor, 0 -.35px 0 currentColor; } .cent-ruler-foreground-label { position: absolute; top: 14px; left: 50%; z-index: 4; padding: 0 2px; border-radius: 3px; background: color-mix(in srgb, var(--card) 88%, transparent); color: var(--text-primary); font-size: 9px; font-weight: 700; line-height: 1.2; white-space: nowrap; transform: translateX(-50%); } .info-markdown-table { width: 100%; margin: 8px 0; border-collapse: collapse; color: var(--text-secondary); font-size: 12px; line-height: 1.4; } .info-markdown-table th, .info-markdown-table td { padding: 5px 7px; border: 1px solid var(--border); text-align: left; vertical-align: top; } .info-markdown-table th { background: var(--surface-2); color: var(--text-heading); font-weight: 700; } .info-markdown-table code { overflow-wrap: anywhere; } .note-ladder-heading { flex-wrap: wrap; } .note-ladder-unit-controls { display: inline-flex; align-items: center; gap: 4px; } .note-ladder-unit-button { min-height: 24px; padding: 2px 7px; font-size: 11px; } /* 1.6.0-pre2 workspace: paired scale comparison above paired performance tools. */ .workspace-grid { display: grid; height: auto; min-height: 0; gap: 16px; } .scales-panel { min-width: 0; padding: 20px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-1); } .scales-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 10px; } .scales-panel-heading .eyebrow { margin-bottom: 4px; } .scales-panel-heading h2, .composition-workspace-heading h2 { margin: 0; font-size: 1.15rem; line-height: 1.2; } .scales-panel-actions { display: inline-flex; align-items: center; gap: 6px; } .scales-rollup-button { width: 34px; min-width: 34px; height: 32px; padding: 4px; } .scales-minimize-button { border-color: transparent; background: transparent; color: var(--text-secondary); } .scales-minimize-button:hover, .scales-minimize-button:focus-visible { border-color: var(--border); background: var(--hover); color: var(--text-primary); } .scales-rollup-icon { display: none; width: 22px; height: 22px; } #scaleLadderOnlyBtn[aria-pressed="false"] .scales-ladder-icon-full, #scaleLadderOnlyBtn[aria-pressed="true"] .scales-ladder-icon-ladder, #scaleMinimizeBtn[aria-expanded="true"] .scales-minimize-icon-expanded, #scaleMinimizeBtn[aria-expanded="false"] .scales-minimize-icon-collapsed { display: block; } .scales-panel.is-minimized { padding-bottom: 10px; } .scales-panel.is-minimized .scales-panel-heading { margin-bottom: 0; } .scales-panel-content { min-width: 0; } .scales-panel .scale-panel { background: var(--card); } .scale-workspace { display: flex; width: 100%; min-width: 0; min-height: 0; align-items: stretch; overflow: visible; } .workspace-grid.has-scale-b .scale-a-panel { flex: var(--scale-a-share) 1 0; min-width: 300px; } .workspace-grid.has-scale-b .scale-b-panel { flex: var(--scale-b-share) 1 0; min-width: 300px; } .workspace-grid:not(.has-scale-b) .scale-a-panel { flex: 1 1 auto; min-width: 0; } .scale-workspace > .scale-divider { flex: 0 0 20px; width: 20px; min-height: 140px; align-self: stretch; cursor: col-resize; } .scale-workspace > .scale-divider .workspace-divider-handle { width: 2px; min-height: 100%; } .scale-structure-section { margin: 0; } .scale-structure-intro { min-height: 0; margin-bottom: 4px; } .scale-structure-heading { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px 16px; } .scale-structure-intro .scale-structure-heading { min-height: 52px; margin-bottom: 6px; } .scale-structure-heading > div:first-child { min-width: 0; } .scale-structure-map-controls { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-end; gap: 6px 12px; color: var(--text-secondary); font-size: 12px; } .scale-structure-control-group { display: inline-flex; align-items: center; gap: 6px; } .scale-structure-map-controls .scale-structure-group-label { margin-bottom: 0; } .scale-structure-map-controls.is-disabled { opacity: .72; } .scale-structure-map-toggle { gap: 0; } .scale-structure-map-toggle .scale-library-button { white-space: nowrap; } .scale-structure-frame { margin: 0; overflow: visible; } .scale-structure-plot { position: relative; width: 100%; min-width: 0; overflow: visible; --scale-structure-dash-color: var(--text-secondary); --scale-structure-inline-left: 70px; --scale-structure-inline-right: 40px; --scale-structure-grid-top: 50px; --scale-structure-grid-bottom: 43px; } .scale-structure-plot > .cent-ruler { position: relative; z-index: 1; padding-right: var(--scale-structure-inline-right); padding-left: var(--scale-structure-inline-left); border-top: 0; } .scale-structure-reference-ruler { padding-top: 0; padding-bottom: 0; } .scale-structure-reference-ruler.is-top { padding-top: 8px; } .scale-structure-reference-ruler .cent-ruler-axis, .scale-structure-reference-ruler .cent-ruler-tick { bottom: 10px; } .scale-structure-reference-plot { height: 52px; --cent-ruler-foreground-headroom: 0px; } .scale-structure-scale-ruler { padding-top: 0; padding-bottom: 0; } .scale-structure-scale-ruler.is-a { margin-top: -10px; } .scale-structure-reference-ruler.is-bottom { margin-top: -10px; } .scale-structure-scale-plot { height: calc(58px + var(--cent-ruler-foreground-headroom, 0px)); } .scale-structure-row-name { position: absolute; top: 50%; left: -42px; color: var(--text-primary); font-size: 11px; font-weight: 700; transform: translateY(-50%); } .scale-structure-reference-ruler.is-top .scale-structure-row-name, .scale-structure-reference-ruler.is-bottom .scale-structure-row-name { color: var(--text-secondary); font-size: 10px; font-weight: 700; } .scale-structure-reference-ruler.is-top .scale-structure-reference-ratio-label { top: auto; bottom: 11px; } .scale-structure-reference-ruler.is-top .scale-structure-reference-interval-label { top: auto; bottom: 25px; color: var(--text-muted); font-weight: 400; } .scale-structure-reference-ruler.is-bottom .cent-ruler-tick { top: 40px; bottom: auto; } .scale-structure-reference-ruler.is-bottom .cent-ruler-axis { bottom: auto; top: 9px; } .scale-structure-reference-ruler.is-bottom .cent-ruler-tick { top: 9px; bottom: auto; } .scale-structure-reference-ruler.is-bottom .cent-ruler-label { top: 12px; } .scale-structure-reference-ruler.is-bottom .scale-structure-reference-interval-label { display: none; } .scale-structure-grid-layer { position: absolute; pointer-events: none; } .scale-structure-grid-control-group { gap: 4px 8px; } .scale-structure-grid-layer.is-comparison-grid { top: var(--scale-structure-grid-top); right: var(--scale-structure-inline-right); bottom: var(--scale-structure-grid-bottom); left: var(--scale-structure-inline-left); z-index: 0; } .scale-structure-grid-line { position: absolute; top: 0; bottom: 0; width: 1px; background-image: repeating-linear-gradient(to bottom, var(--scale-structure-dash-color) 0 4px, transparent 4px 6px); opacity: .5; transform: translateX(-.5px); } .scale-structure-step-line { position: absolute; top: calc(var(--cent-ruler-foreground-headroom, 0px) + 3px); height: 1px; background-image: repeating-linear-gradient(to right, var(--scale-structure-dash-color) 0 4px, transparent 4px 6px); opacity: .7; } .scale-structure-step-label { top: calc(var(--cent-ruler-foreground-headroom, 0px) + 3px); bottom: auto; padding: 0 2px; border-radius: 3px; background: color-mix(in srgb, var(--surface-1) 88%, transparent); transform: translate(-50%, -50%); } .scale-structure-mapping-layer { position: relative; z-index: 2; box-sizing: border-box; padding: 0 var(--scale-structure-inline-right) 0 var(--scale-structure-inline-left); } .scale-structure-mapping-lines { position: relative; width: 100%; height: 100%; } .scale-structure-mapping-segment { position: absolute; display: block; opacity: .7; transform-origin: 0 0; pointer-events: none; } .scale-structure-mapping-segment.is-horizontal { height: 1px; background-image: repeating-linear-gradient(to right, var(--scale-structure-dash-color) 0 4px, transparent 4px 6px); } .scale-structure-mapping-segment.is-vertical { width: 1px; background-image: repeating-linear-gradient(to bottom, var(--scale-structure-dash-color) 0 4px, transparent 4px 6px); } .scale-structure-mapping-label { top: 50%; bottom: auto; padding: 0 2px; border-radius: 3px; background: color-mix(in srgb, var(--surface-1) 88%, transparent); transform: translate(-50%, -50%); } .scales-panel.is-ladder-only .scale-panel > :not(.workspace-panel-intro):not(.creator-fields):not(.cents-ladder-section):not(.keyboard-note-help) { display: none !important; } .scales-panel.is-ladder-only .scale-panel .creator-fields { display: block; margin-bottom: 12px; } .scales-panel.is-ladder-only .scale-panel .creator-fields > :not(.picker), .scales-panel.is-ladder-only .scale-panel .picker > :not(.scale-library-control):not(.scale-picker-control):not(.dropdown) { display: none !important; } .scales-panel.is-ladder-only .scale-panel .scale-library-control { margin-bottom: 10px; } .scales-panel.is-ladder-only .scale-panel .workspace-panel-intro { min-height: 0; } .scales-panel.is-ladder-only .scale-panel .panel-heading { display: grid; min-height: 0; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 8px 12px; margin-bottom: 10px; } .scale-panel-title-row { display: flex; min-width: 0; align-items: center; gap: 8px; } .scale-root-chip { display: none; flex: 0 1 auto; max-width: 42%; overflow: hidden; padding: 2px 7px; border: 1px solid var(--border-accent); border-radius: 999px; background: var(--bg-accent); color: var(--text-accent); font-size: 11px; font-weight: 700; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; } .scales-panel.is-ladder-only .scale-root-chip { display: inline-flex; } .scales-panel.is-ladder-only .scale-panel .panel-heading .eyebrow, .scales-panel.is-ladder-only .scale-panel .panel-heading > p { display: none !important; } .scales-panel.is-ladder-only .scale-panel .scale-panel-heading-actions { display: flex; } .scales-panel.is-ladder-only .scale-panel { padding-bottom: 18px; } .scales-panel.is-ladder-only .cents-ladder-section { margin-top: 0; } .performance-workspace { --melody-player-share: .5; --composition-tools-share: .5; display: flex; min-width: 0; align-items: stretch; } .workspace-grid .performance-workspace > .melody-player-panel { container-type: inline-size; flex: var(--melody-player-share) 1 0; min-width: 420px; min-height: 0; overflow: visible; } .performance-workspace > .composition-tools-panel { flex: var(--composition-tools-share) 1 0; min-width: 320px; min-height: 0; overflow: visible; } .performance-workspace > .performance-divider { flex: 0 0 20px; width: 20px; min-height: 180px; align-self: stretch; cursor: col-resize; } .performance-workspace > .performance-divider .workspace-divider-handle { width: 2px; min-height: 100%; } .performance-workspace > .performance-divider:hover .workspace-divider-handle, .performance-workspace > .performance-divider:focus-visible .workspace-divider-handle, .performance-workspace.is-resizing > .performance-divider .workspace-divider-handle { width: 4px; background: var(--border-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--border-accent) 18%, transparent); } .performance-workspace.is-resizing, .performance-workspace.is-resizing * { cursor: col-resize !important; user-select: none; } .composition-tools-panel { container-type: inline-size; } .composition-workspace { padding-top: 0; } @media (max-width: 920px) { .workspace-grid { display: grid; height: auto; min-height: 0; } .performance-workspace { display: grid; grid-template-columns: 1fr; gap: 14px; } .performance-workspace > .melody-player-panel, .performance-workspace > .composition-tools-panel { width: 100%; min-width: 0; } .performance-workspace > .performance-divider { display: none; } } @media (max-width: 700px) { .scales-panel { padding: 20px; } .scale-workspace, .workspace-grid.has-scale-b .scale-workspace { display: grid; grid-template-columns: 1fr; gap: 12px; } .scale-workspace > .scale-divider { display: none; } .workspace-grid.has-scale-b .scale-a-panel, .workspace-grid.has-scale-b .scale-b-panel { min-width: 0; } } /* 1.6.0-pre12: scale-first workflow and per-scale reference tuning. */ .scales-panel { position: relative; } .scales-status { position: absolute; top: -40px; right: 0; z-index: 3; cursor: default; pointer-events: auto; } .scale-picker-control { grid-template-columns: minmax(0, 1fr) minmax(108px, .28fr) minmax(92px, .22fr) auto; } .scale-picker-control .reference-pitch-label { margin: 0; } .reference-a4-input { min-width: 0; } .scale-root-chip, .scale-reference-chip { display: none; flex: 0 1 auto; max-width: 42%; overflow: hidden; padding: 2px 7px; border: 1px solid var(--border-accent); border-radius: 999px; background: var(--bg-accent); color: var(--text-accent); font-size: 11px; font-weight: 700; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; } .scales-panel.is-ladder-only .scale-root-chip, .scales-panel.is-ladder-only .scale-reference-chip { display: inline-flex; } .voice-controls { display: grid; gap: 12px; } .voice-controls .field { min-width: 0; } .voice-controls select { width: 100%; } .tempo-settings-row { align-items: end; } .tempo-bpm-field { min-width: 88px; } .tempo-bpm-field input { width: 88px; } .tempo-box .tempo-source-control { align-self: end; } @media (max-width: 700px) { .scale-picker-control { grid-template-columns: minmax(0, 1fr) minmax(96px, .38fr); } .scale-picker-control .reference-pitch-label, .scale-picker-control .reference-a4-input { grid-column: 2; } .scale-picker-control .scale-file-actions { grid-column: 1 / -1; justify-self: end; } } /* 1.6.0-pre21: roomier content-sized top tabs and balanced Note Player control spacing. */ .performance-workspace { --composition-tab-height: 30px; padding-top: var(--composition-tab-height); } .melody-player-panel, .composition-tools-panel { position: relative; } .composition-tools-panel { container-type: inline-size; } .composition-workspace { padding-top: 0; } .composition-workspace-heading { display: block; margin-bottom: 10px; } .composition-workspace-heading .eyebrow { margin: 0; } .note-player-tabs, .composition-tabs { position: absolute; right: 12px; bottom: calc(100% - 1px); left: 12px; z-index: 5; display: flex; max-width: none; align-items: flex-end; gap: 14px; overflow-x: auto; overflow-y: hidden; padding: 0; border: 0; border-radius: 0; background: transparent; scrollbar-width: thin; } .note-player-tab, .composition-tab { display: inline-flex; min-width: 0; min-height: var(--composition-tab-height); flex: 0 0 auto; align-items: center; justify-content: center; gap: 6px; padding: 4px 10px 5px; border: 1px solid var(--border); border-bottom-color: var(--border); border-radius: 8px 8px 0 0; background: color-mix(in srgb, var(--surface-1) 92%, var(--card)); color: var(--text-secondary); font-size: 12px; font-weight: 700; white-space: nowrap; } .note-player-tab:hover, .note-player-tab:focus-visible, .composition-tab:hover, .composition-tab:focus-visible { border-color: var(--border-accent); background: var(--hover); color: var(--text-primary); } .note-player-tab.is-selected, .note-player-tab[aria-selected="true"], .composition-tab.is-selected, .composition-tab[aria-selected="true"] { position: relative; z-index: 2; border-color: var(--border-accent); border-bottom-color: var(--surface-1); background: var(--bg-accent); color: var(--text-accent); box-shadow: 0 2px 0 var(--surface-1); } .composition-tab-label { display: inline; } .composition-tab-panel { min-width: 0; } .composition-pane-title { margin: 0; color: var(--text-heading); font-size: 1.15rem; font-weight: 700; letter-spacing: 0; line-height: 1.2; } .composition-pane-standalone-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 6px 12px; margin-bottom: 14px; } .composition-pane-standalone-heading p { margin: 0; color: var(--text-muted); font-size: 12px; line-height: 1.4; } .composition-melody-modulation { margin-top: 14px; } .composition-instrument-grid { display: grid; grid-template-columns: 1fr; align-items: start; gap: 18px; } .composition-instrument-grid .envelope-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .composition-instrument-grid .voice-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .composition-instrument-grid .envelope-header { margin-bottom: 14px; } #compositionPaneInstrument .sound-control-box, #compositionPaneFx > .sound-control-box { width: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; } #compositionPaneVolume .mixer-controls { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 16px; } #compositionPaneVolume .mixer-channel > label { margin-bottom: 5px; } .composition-mix-sends { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; border-top: 0; } .composition-mix-sends .effect-routing-help { grid-column: 1 / -1; margin-top: 0; } .send-source-group { display: grid; gap: 10px; } .send-source-group + .send-source-group { padding-top: 0; border-top: 0; } .send-source-group .section-label { margin: 0 0 2px; } .send-routing-control { display: grid; gap: 4px; text-align: left; } .send-routing-label { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; } .send-routing-label > span:first-child { color: var(--text-secondary); font-size: 13px; font-weight: 500; } .send-routing-label > span:last-child { color: var(--text-secondary); font-size: 11px; font-variant-numeric: tabular-nums; } .send-routing-control input { width: 100%; min-width: 0; padding: 0; } @container (max-width: 620px) { .note-player-tab, .composition-tab { min-width: 0; padding-inline: 5px; font-size: 11px; } .composition-instrument-grid .voice-controls { grid-template-columns: 1fr; } #compositionPaneVolume .mixer-controls { grid-template-columns: 1fr; gap: 14px; } .composition-mix-sends { grid-template-columns: 1fr; } .send-source-group + .send-source-group { padding-top: 14px; border-top: 1px solid var(--border); } } @container (max-width: 470px) { .note-player-tab, .composition-tab { min-width: 0; padding-inline: 5px; } } @media (max-width: 920px) { .performance-workspace { padding-top: 0; } .performance-workspace > .melody-player-panel, .performance-workspace > .composition-tools-panel { margin-top: var(--composition-tab-height); } }