:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#080b14;color:#f4f0ff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--panel: rgba(18, 22, 38, .72);--panel-strong: rgba(255, 255, 255, .1);--line: rgba(255, 255, 255, .1);--line-strong: rgba(167, 139, 250, .28);--muted: rgba(244, 240, 255, .58);--accent: #a78bfa;--accent-strong: #7c3aed;--cyan: #22d3ee;--good: #2dd4bf;--mid: #fbbf24;--bad: #fb7185;--radius-panel: 1.15rem;--radius-control: .75rem;--gap-panel: .85rem;--site-shell-max: 1320px;--site-shell-gutter: 1rem;--site-readable-max: 44rem;--site-page-padding-top: 2.5rem;--site-page-padding-bottom: 4rem}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 12% 0%,rgba(124,58,237,.22),transparent 26rem),radial-gradient(circle at 88% 8%,rgba(34,211,238,.12),transparent 24rem),linear-gradient(180deg,#0a0e18,#080b14)}button,input,select{font:inherit}button{border:1px solid var(--line);border-radius:var(--radius-control);background:#ffffff0f;color:#fff;cursor:pointer;padding:.62rem .9rem;transition:transform .14s ease,background .14s ease,border-color .14s ease,box-shadow .14s ease}button:hover:not(:disabled){transform:translateY(-1px);background:#ffffff1a;border-color:#fff3}button:disabled{cursor:not-allowed;opacity:.42}button.primary{border:0;background:linear-gradient(135deg,#a78bfaf2,#7c3aedf2);box-shadow:0 10px 28px #7c3aed47}button.primary:hover:not(:disabled){box-shadow:0 14px 32px #7c3aed5c}input,select{width:100%;border:1px solid var(--line);border-radius:var(--radius-control);background:#00000047;color:#fff;padding:.62rem .72rem}input:focus,select:focus,button:focus-visible{outline:2px solid rgba(167,139,250,.45);outline-offset:2px}input[type=range]{padding:0;accent-color:var(--accent)}.site-header{width:100%;height:75px;border-bottom:1px solid var(--line);background:#080b14b8;backdrop-filter:blur(16px);box-shadow:inset 0 1px #ffffff0a}.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:min(var(--site-shell-max),calc(100% - 2 * var(--site-shell-gutter)));height:100%;margin-inline:auto}.site-header__left{display:flex;align-items:center;gap:1.25rem;min-width:0}.site-header__logo{flex-shrink:0;color:#fff;font-size:.95rem;font-weight:700;letter-spacing:-.02em;text-decoration:none;white-space:nowrap}.site-header__logo:hover{color:#a78bfaf2}.site-header__nav{display:flex;align-items:center;gap:.85rem;min-width:0}.site-header__nav a{color:var(--muted);font-size:.82rem;text-decoration:none;white-space:nowrap}.site-header__nav a:hover{color:#fff}.site-header__support{flex-shrink:0;border:1px solid rgba(167,139,250,.28);border-radius:999px;padding:.42rem .85rem;background:#a78bfa1a;color:#f4f0ffeb;font-size:.82rem;font-weight:600;text-decoration:none;white-space:nowrap}.site-header__support:hover{background:#a78bfa2e;border-color:#a78bfa6b;color:#fff}.app-shell{width:min(var(--site-shell-max),calc(100% - 2 * var(--site-shell-gutter)));margin-inline:auto;padding:.85rem 0 1.75rem}.panel{border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--panel);box-shadow:inset 0 1px #ffffff0a,0 18px 48px #0000003d;backdrop-filter:blur(16px);padding:.95rem}.panel h2{margin:0;font-size:1.02rem;font-weight:650}.panel-header{display:flex;justify-content:space-between;gap:1rem;align-items:center;margin-bottom:.85rem}.panel-header.slim{margin-bottom:.45rem}.eyebrow{margin:0 0 .2rem;text-transform:uppercase;letter-spacing:.12em;font-size:.68rem;font-weight:700;color:#a78bfad1}.hint,.empty-state{color:var(--muted)}.layout-grid{display:grid;grid-template-columns:minmax(18.5rem,24.5rem) minmax(0,1fr);gap:var(--gap-panel);align-items:start}.left-column,.right-column{display:grid;gap:var(--gap-panel);align-content:start}.right-column{min-height:0}.control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.control-grid label{display:grid;gap:.35rem;color:var(--muted);font-size:.84rem}.control-grid-span{grid-column:1 / -1}.slider-label{display:flex;justify-content:space-between;gap:.75rem}.slider-label strong{color:#fff}.toggle-row{display:flex;gap:.65rem;align-items:flex-start;margin-top:.65rem;border:1px solid var(--line);border-radius:var(--radius-control);padding:.62rem .68rem;background:#ffffff08}.toggle-row input{width:auto;margin-top:.15rem;accent-color:var(--cyan)}.toggle-row span{display:grid;gap:.2rem}.toggle-row small{color:var(--muted);line-height:1.4;font-size:.82rem}.create-melody-panel{display:grid;gap:.55rem}.create-melody-fields{border:0;margin:0;padding:0;min-width:0;display:grid;gap:0}.create-melody-fields:disabled{opacity:.62}.create-melody-fields:disabled .advanced-tuning-toggle{cursor:not-allowed}.create-melody-section{display:grid;gap:.4rem}.create-melody-section+.create-melody-section{padding-top:.35rem;border-top:1px solid rgba(255,255,255,.06)}.section-title{margin:0;font-size:.78rem;font-weight:600;color:#f4f0ffb8;letter-spacing:.01em}.control-grid.compact{gap:.5rem}.control-grid.compact label{gap:.28rem;font-size:.8rem}.advanced-tuning{margin-top:.1rem}.advanced-tuning-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;gap:.5rem;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-control);padding:.48rem .62rem;background:#ffffff05;color:#f4f0ffad;font-size:.78rem;font-weight:550}.advanced-tuning-toggle:hover{background:#ffffff0d;color:#f4f0ffe0}.advanced-tuning-caret{color:var(--muted);font-size:.72rem}.advanced-tuning-body{margin-top:.45rem}.generate-button{width:100%;margin-top:.35rem;padding:.72rem 1rem;border-radius:999px;font-weight:650}.generate-locked-hint{margin:.45rem 0 0;color:var(--muted);font-size:.82rem;text-align:center;line-height:1.35}.seed-id-chip{display:inline-flex;align-items:center;gap:.35rem;max-width:min(100%,22rem);border:1px solid var(--line);border-radius:999px;padding:.18rem .22rem .18rem .55rem;background:#ffffff08}.seed-id-label{flex:0 0 auto;color:var(--muted);font-size:.68rem;text-transform:uppercase;letter-spacing:.06em}.seed-id-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#f4f0ffd1;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.72rem}.seed-id-copy{flex:0 0 auto;width:1.55rem;height:1.55rem;padding:0;border-radius:999px;font-size:.78rem;line-height:1}.current-melody-panel{display:grid;gap:.75rem}.current-melody-header{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;flex-wrap:wrap}.current-melody-empty{margin:0;font-size:.86rem}.output-meta-line{margin:0;color:#f4f0ff9e;font-size:.76rem;line-height:1.35}.status-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.55rem}.status-tag{display:inline-flex;align-items:center;border:1px solid rgba(167,139,250,.22);border-radius:999px;padding:.22rem .62rem;background:#a78bfa1a;color:#f4f0ffe0;font-size:.74rem;line-height:1.2;white-space:nowrap}.melody-stats-compact{display:grid;grid-template-columns:repeat(3,minmax(4.5rem,1fr));gap:.45rem;flex:0 0 auto}.melody-stats-compact--empty{opacity:.72}.mini-stat{display:grid;gap:.14rem;border:1px solid var(--line);border-radius:.75rem;padding:.42rem .5rem;background:#ffffff0a;min-width:4.5rem}.mini-stat-label{color:var(--muted);font-size:.68rem;line-height:1.2}.mini-stat-value{font-size:1rem;line-height:1;font-weight:700}.mini-stat-value small{margin-left:.12rem;font-size:.68rem;font-weight:500;color:var(--muted)}.mini-stat--good .mini-stat-value{color:var(--good)}.mini-stat--mid .mini-stat-value{color:var(--mid)}.mini-stat--bad .mini-stat-value{color:var(--bad)}.mini-stat--neutral .mini-stat-value{color:#f4f0ffb8}.mini-stat--muted{opacity:.62}.melody-transport-controls{display:flex;flex-wrap:wrap;gap:.65rem;align-items:center}.segmented-control{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:.18rem;background:#00000038}.segmented-control button{border:0;border-radius:999px;background:transparent;padding:.48rem .85rem;font-size:.86rem;color:var(--muted)}.segmented-control button:hover:not(:disabled){transform:none;background:#ffffff0f;color:#fff}.segmented-control button.is-active{background:linear-gradient(135deg,#a78bfa59,#22d3ee2e);color:#fff;box-shadow:inset 0 0 0 1px #a78bfa47}.download-control{display:inline-flex;align-items:stretch;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:#00000038}.download-control-action{display:inline-flex;align-items:center;gap:.45rem;border:0;border-radius:0;padding:.48rem .85rem;font-size:.86rem}.download-control-action:hover:not(:disabled){transform:none}.download-control-icon{font-size:.9rem;opacity:.85}.download-control-picker{position:relative;display:inline-flex;align-items:center;margin:0;border-left:1px solid var(--line)}.download-control-picker select{position:absolute;inset:0;width:100%;opacity:0;cursor:pointer}.download-control-caret{pointer-events:none;padding:0 .72rem;color:var(--muted);font-size:.72rem}.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}.piano-roll-stack{display:flex;flex-direction:column;gap:.45rem}.piano-roll-lane-wrap{position:static}.piano-roll-lane-label{margin:0;color:#f4f0ff9e;font-size:.72rem;font-weight:650;letter-spacing:.04em;text-transform:uppercase}.piano-roll-lane-header{display:flex;align-items:baseline;gap:.45rem .65rem;margin-bottom:.28rem}.piano-roll-lane-header--melody{flex-wrap:wrap;justify-content:flex-start}.piano-roll-lane-meta{min-width:0;text-transform:none;font-weight:400;letter-spacing:normal;line-height:1.35}.piano-roll-lane-header--chord{align-items:center;justify-content:space-between;gap:.65rem 1rem;flex-wrap:wrap}.chord-layer-header-left{display:flex;align-items:center;gap:.45rem .65rem;flex-shrink:0}.chord-layer-performance-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:.45rem .75rem;margin-left:auto;margin-bottom:0}.chord-layer-performance-control{display:inline-flex;align-items:center;gap:.38rem;min-width:0}.chord-layer-performance-label{color:#f4f0ff94;font-size:.68rem;font-weight:650;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}.chord-layer-performance-control select{min-width:7.5rem;padding:.28rem .45rem;font-size:.72rem}.piano-roll-lane-header--bass{align-items:center;justify-content:space-between;gap:.65rem 1rem;flex-wrap:wrap}.bass-layer-header-left{display:flex;align-items:center;gap:.45rem .65rem;flex-shrink:0}.bass-layer-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:.45rem .75rem;margin-left:auto;margin-bottom:0}.bass-layer-control{display:inline-flex;align-items:center;gap:.38rem;min-width:0}.bass-layer-control-label{color:#f4f0ff94;font-size:.68rem;font-weight:650;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}.bass-layer-control select{min-width:7.5rem;padding:.28rem .45rem;font-size:.72rem}.layer-switch{flex-shrink:0;border:0;padding:0;background:transparent;cursor:pointer;line-height:0}.layer-switch:focus-visible .layer-switch__track{outline:2px solid rgba(45,212,191,.72);outline-offset:2px}.layer-switch__track{position:relative;display:block;width:2.75rem;height:1.375rem;border-radius:999px;background:#ffffff24;transition:background .18s ease}.layer-switch__thumb{position:absolute;top:2px;left:2px;width:1.125rem;height:1.125rem;border-radius:50%;background:#f4f0ffb8;box-shadow:0 1px 2px #00000038;transition:transform .18s ease,background .18s ease}.layer-switch.is-on .layer-switch__track{background:#2dd4bfe0}.layer-switch.is-on .layer-switch__thumb{transform:translate(calc(1.625rem - 4px));background:#fff}.piano-roll-lane-wrap.is-layer-disabled{opacity:.58}.piano-roll-lane-wrap.is-layer-disabled .piano-note--chord,.piano-roll-lane-wrap.is-layer-disabled .piano-note--bass{opacity:.72}.icon-circle-button{display:inline-flex;align-items:center;justify-content:center;padding:0;line-height:1;border-radius:999px;background:#080b14d1;color:#f4f0ffeb;cursor:pointer}.icon-circle-button__icon{display:block;flex-shrink:0;width:14px;height:14px}.melody-lock-icon-button{position:absolute;top:.42rem;right:.42rem;z-index:2;width:1.85rem;height:1.85rem;border:1px solid rgba(255,255,255,.14)}.melody-lock-icon-button:hover{border-color:#a78bfa6b;background:#a78bfa1f}.melody-lock-icon-button.is-locked{border-color:#2dd4bf94;background:#2dd4bf3d;color:#f4f0fffa;box-shadow:0 0 0 1px #2dd4bf29}.melody-lock-icon-button.is-locked:hover{border-color:#2dd4bfc7;background:#2dd4bf57}.chord-regenerate-icon-button{position:absolute;top:.42rem;right:.42rem;z-index:2;width:1.85rem;height:1.85rem;border:1px solid rgba(255,255,255,.14);pointer-events:auto}.chord-regenerate-icon-button:hover{border-color:#a78bfa6b;background:#a78bfa1f}.bass-regenerate-icon-button{position:absolute;top:.42rem;right:.42rem;z-index:2;width:1.85rem;height:1.85rem;border:1px solid rgba(255,255,255,.14);pointer-events:auto}.bass-regenerate-icon-button:hover{border-color:#a78bfa6b;background:#a78bfa1f}.piano-roll-stack-footer{display:flex;justify-content:flex-end;align-items:center;min-height:1.85rem;padding-top:.1rem}.add-layer-footer-action{position:relative}.add-layer-trigger{width:1.75rem;height:1.75rem;border:1px solid rgba(255,255,255,.16);background:#080b14e0}.add-layer-trigger:hover,.add-layer-trigger[aria-expanded=true]{border-color:#a78bfa6b;background:#a78bfa24}.add-layer-menu{position:absolute;right:0;bottom:calc(100% + .35rem);min-width:11.5rem;padding:.28rem;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-control);background:#080b14f5;box-shadow:0 10px 28px #0000006b}.add-layer-menu-item{display:flex;flex-direction:column;align-items:flex-start;gap:.12rem;width:100%;padding:.42rem .55rem;border:none;border-radius:calc(var(--radius-control) - 2px);background:transparent;color:#f4f0ffeb;text-align:left;cursor:pointer}.add-layer-menu-item:not(:disabled):hover{background:#a78bfa1f}.add-layer-menu-item:disabled{opacity:.58;cursor:not-allowed}.add-layer-menu-item-label{font-size:.78rem;font-weight:650;line-height:1.2}.add-layer-menu-item-hint{color:#f4f0ff85;font-size:.68rem;line-height:1.25}.melody-chord-playback-hint{margin:0;font-size:.72rem;line-height:1.2}.piano-roll-shell{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-control);background:#00000047}.piano-roll-shell--chord{background:#00000038}.piano-roll-shell--bass{background:#0000002e}.piano-roll-shell.piano-roll-fixed{flex-shrink:0}.piano-roll-keys{display:flex;flex-direction:column;flex-shrink:0;border-right:1px solid rgba(255,255,255,.1);background:#0000006b}.pitch-key{flex:none;height:var(--pitch-row-height, 18px);display:flex;align-items:center;justify-content:flex-end;padding-right:.38rem;color:#f4f0ff7a;font-size:.68rem;line-height:1;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.pitch-key--alt{background:#ffffff06}.pitch-key--c{color:#f4f0ffc7;font-weight:650}.piano-roll-viewport{overflow-x:auto;overflow-y:hidden;min-width:0}.piano-roll-timeline{position:relative;flex-shrink:0;background:linear-gradient(to bottom,rgba(255,255,255,.03) 1px,transparent 1px),#0000002e;background-size:100% var(--pitch-row-height, 18px)}.piano-roll-grid{position:relative;overflow:hidden;min-width:0;background:linear-gradient(to bottom,rgba(255,255,255,.03) 1px,transparent 1px),#0000002e;background-size:100% var(--pitch-row-height, 18px)}.piano-roll{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-control);background:linear-gradient(to bottom,rgba(255,255,255,.03) 1px,transparent 1px),#00000047;background-size:100% 22px}.piano-roll-fixed{flex-shrink:0}.piano-roll-placeholder{position:absolute;inset:0;display:grid;place-items:center;color:#f4f0ff47;font-size:.88rem;letter-spacing:.04em;text-transform:uppercase}.beat-line{position:absolute;top:0;bottom:0;width:1px;background:#ffffff12}.beat-line.bar-line{width:2px;background:#a78bfa47}.timeline-playhead{position:absolute;top:0;bottom:0;width:2px;pointer-events:none;z-index:3;background:var(--cyan);box-shadow:0 0 6px #22d3eee6,0 0 14px #22d3ee73}.piano-note{position:absolute;min-width:6px;border:1px solid rgba(255,255,255,.28);border-radius:.3rem;background:linear-gradient(135deg,#a78bfaf2,#22d3eec7);color:#080b14;font-size:.62rem;font-weight:800;line-height:1;padding:0 .22rem;display:flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box}.piano-note--chord{border-color:#fff3;background:linear-gradient(135deg,#2dd4bfd1,#34d3999e);color:#080b14eb}.piano-note--bass{border-color:#ffffff2e;background:linear-gradient(135deg,#fbbf24d1,#f59e0b9e);color:#080b14eb}.melody-meta-row{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center;padding-top:.1rem}.melody-footer-actions{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.55rem}.melody-lock-controls,.melody-chord-controls{display:inline-flex;align-items:center;gap:.35rem;flex-wrap:wrap}.melody-chord-hint{margin:0;font-size:.72rem;line-height:1.2}.melody-chord-ready-chip{display:inline-flex;align-items:center;border:1px solid rgba(167,139,250,.28);border-radius:999px;padding:.18rem .55rem;background:#a78bfa1a;color:#f4f0ffe0;font-size:.72rem;line-height:1.2;white-space:nowrap}.melody-lock-chip{display:inline-flex;align-items:center;border:1px solid rgba(45,212,191,.28);border-radius:999px;padding:.18rem .55rem;background:#2dd4bf1a;color:#f4f0ffe0;font-size:.72rem;line-height:1.2;white-space:nowrap}.melody-lock-button{padding:.28rem .62rem;border-radius:999px;font-size:.72rem;font-weight:600;line-height:1.2}@media(max-width:980px){.site-header__left{gap:.85rem}.site-header__nav{gap:.55rem}.site-header__nav a{font-size:.76rem}.site-header__logo{font-size:.88rem}.layout-grid{grid-template-columns:1fr}.current-melody-header{flex-direction:column}.melody-stats-compact{width:100%}}@media(max-width:720px){.site-header__inner{flex-wrap:wrap;align-content:center;row-gap:.35rem;height:auto;min-height:75px;padding:.55rem 0}.site-header__left{flex:1 1 100%;flex-wrap:wrap}.site-header__nav{flex-wrap:wrap}}@media(max-width:560px){.site-header__support{padding:.38rem .68rem;font-size:.76rem}.control-grid,.melody-stats-compact{grid-template-columns:repeat(2,minmax(0,1fr))}.melody-stats-compact .mini-stat:last-child{grid-column:1 / -1}.seed-id-chip{max-width:100%}.melody-transport-controls{flex-direction:column;align-items:stretch}.segmented-control,.download-control{width:100%}.download-control-action{flex:1;justify-content:center}}.project-restore{display:grid;gap:.45rem;border:1px solid rgba(255,255,255,.06);border-radius:var(--radius-control);padding:.55rem .62rem;background:#ffffff05}.project-drop-zone{display:flex;align-items:center;gap:.55rem;border:1px dashed rgba(255,255,255,.1);border-radius:calc(var(--radius-control) - 2px);padding:.45rem .55rem;transition:border-color .15s ease,background-color .15s ease}.project-drop-zone .hint{flex:1;margin:0;min-width:0;color:#f4f0ff7a;font-size:.76rem;line-height:1.35}.project-drop-zone.is-drag-over{border-color:#a78bfab8;background:#a78bfa14}.project-open-button{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:#ffffff0a;color:#f4f0ffe0}.project-open-button:hover{border-color:#a78bfa6b;background:#a78bfa1f}.project-open-button__icon{display:block;width:14px;height:14px}.project-status{margin:0;font-size:.82rem;line-height:1.45}.project-status--success{color:#86efaceb}.project-status--error{color:#fca5a5f2}