:root{color-scheme:dark;font-family:SF Pro Text,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.35;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--app-bg: radial-gradient(circle at top left, rgba(255, 174, 102, .08), transparent 24%), radial-gradient(circle at top right, rgba(121, 205, 255, .07), transparent 20%), linear-gradient(180deg, #0a0d12 0%, #06080c 100%);--text: #f2f4f8;--panel: rgba(17, 22, 28, .92);--panel-soft: rgba(20, 25, 31, .9);--topbar-bg: rgba(18, 23, 29, .9);--surface: rgba(255, 255, 255, .02);--surface-strong: rgba(255, 255, 255, .03);--field-bg: rgba(7, 10, 14, .94);--field-text: #fff7eb;--button-text: #f7f1e6;--primary-text: #1a1009;--secondary-bg: rgba(136, 225, 255, .08);--drawer-bg: rgba(10, 13, 18, .96);--drawer-text: #dff7ff;--output-bg: rgba(255, 255, 255, .02);--output-major-bg: #071017;--output-text: #dff5ff;--line: rgba(255, 255, 255, .1);--line-strong: rgba(255, 185, 109, .36);--amber: #ffb96b;--amber-strong: #ff9a47;--cyan: #8fddff;--green: #79e6bc;--red: #ff927f;--text-muted: rgba(232, 237, 246, .66);--focus-ring: rgba(255, 182, 98, .08);--focus-line: rgba(255, 182, 98, .54);--status-good: rgba(114, 239, 190, .22);--status-warn: rgba(255, 138, 117, .22);--brand-ring: rgba(255, 255, 255, .06);--shadow: 0 10px 28px rgba(0, 0, 0, .24)}:root[data-theme=light]{color-scheme:light;--app-bg: radial-gradient(circle at top left, rgba(255, 174, 102, .16), transparent 26%), radial-gradient(circle at top right, rgba(121, 205, 255, .14), transparent 22%), linear-gradient(180deg, #f6f8fc 0%, #edf1f7 100%);--text: #18202a;--panel: rgba(255, 255, 255, .9);--panel-soft: rgba(255, 255, 255, .84);--topbar-bg: rgba(255, 255, 255, .82);--surface: rgba(18, 24, 32, .03);--surface-strong: rgba(18, 24, 32, .05);--field-bg: rgba(248, 250, 252, .98);--field-text: #18202a;--button-text: #18202a;--secondary-bg: rgba(121, 205, 255, .16);--drawer-bg: rgba(255, 255, 255, .96);--drawer-text: #183247;--output-bg: rgba(255, 255, 255, .72);--output-major-bg: rgba(244, 247, 251, .96);--output-text: #183247;--line: rgba(18, 24, 32, .1);--line-strong: rgba(73, 124, 216, .24);--text-muted: rgba(33, 44, 59, .66);--focus-ring: rgba(89, 132, 221, .12);--focus-line: rgba(89, 132, 221, .42);--status-good: rgba(72, 182, 136, .24);--status-warn: rgba(220, 109, 89, .24);--brand-ring: rgba(24, 32, 42, .08);--shadow: 0 12px 28px rgba(21, 38, 61, .08)}:root[data-theme=rainbow]{color-scheme:dark;--app-bg: radial-gradient(circle at 12% 8%, rgba(255, 165, 108, .12), transparent 24%), radial-gradient(circle at 88% 10%, rgba(120, 199, 255, .12), transparent 22%), radial-gradient(circle at 50% 100%, rgba(194, 152, 255, .08), transparent 26%), linear-gradient(180deg, #090d14 0%, #05070c 100%)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{min-height:100vh;color:var(--text);background:var(--app-bg);transition:background .18s ease,color .18s ease}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}.app-shell{min-height:100vh;padding:10px calc(10px + var(--drawer-space)) 10px 10px;transition:padding-right .22s ease}.drawer-rail{position:fixed;top:50%;right:0;transform:translateY(-50%);border:1px solid color-mix(in srgb,var(--line) 72%,var(--cyan));border-right:0;border-radius:14px 0 0 14px;padding:14px 10px;background:var(--drawer-bg);color:var(--drawer-text);writing-mode:vertical-rl;text-transform:uppercase;letter-spacing:.14em;font-size:.7rem}.topbar{display:grid;grid-template-columns:minmax(220px,auto) minmax(280px,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--topbar-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:var(--shadow)}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-mark{width:40px;height:40px;flex:0 0 auto;display:block;border-radius:14px;box-shadow:0 14px 28px #00000047,0 0 0 1px var(--brand-ring)}.brand h1{margin:0;font-size:.94rem;line-height:1.2;letter-spacing:-.01em}.brand p{margin:3px 0 0;color:var(--text-muted);font-size:.76rem}.status-banner{display:grid;gap:4px;min-width:0;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}.status-banner strong{font-size:.8rem;letter-spacing:-.01em}.status-banner span{color:var(--text-muted);font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-banner.good{border-color:var(--status-good)}.status-banner.warn{border-color:var(--status-warn)}.topbar-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.settings-wrap{position:relative}.settings-popover{position:absolute;top:calc(100% + 10px);right:0;z-index:30;width:250px;display:grid;gap:10px;padding:12px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--panel) 92%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:var(--shadow)}.settings-popover-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.settings-popover-head strong{font-size:.82rem}.settings-popover-head span,.settings-note{color:var(--text-muted);font-size:.74rem}.theme-menu{display:grid;gap:6px}.theme-option{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--surface-strong);color:var(--button-text);padding:9px 10px;text-align:left;font-size:.8rem}.theme-option.active,.toolbar-button.active{border-color:var(--line-strong);background:color-mix(in srgb,var(--surface-strong) 78%,var(--amber) 22%)}.mode-switch{display:inline-flex;padding:3px;border:1px solid var(--line);border-radius:999px;background:var(--surface-strong)}.mode-switch button,.toolbar-button,.play-toggle,.preset-chip,.family-card,.chip,.drawer-rail{transition:transform .14s ease,border-color .14s ease,background .14s ease,box-shadow .14s ease}.mode-switch button{border:0;background:transparent;color:var(--text-muted);padding:6px 10px;border-radius:999px;font-size:.82rem;line-height:1}.mode-switch button.active{background:color-mix(in srgb,var(--surface-strong) 86%,var(--text));color:var(--text)}.toolbar-button,.play-toggle{height:34px;border-radius:999px;border:1px solid var(--line);background:var(--surface-strong);color:var(--button-text);padding:0 12px;font-size:.82rem}.toolbar-button.primary,.play-toggle.active{background:linear-gradient(135deg,var(--amber),var(--amber-strong));color:var(--primary-text);border-color:#ffb66261}.toolbar-button.secondary{background:var(--secondary-bg)}.toolbar-button:hover,.play-toggle:hover,.preset-chip:hover,.family-card:hover,.chip:hover,.drawer-rail:hover{transform:none;border-color:var(--line-strong)}.toolbar-button:disabled,.play-toggle:disabled{opacity:.55;cursor:not-allowed;transform:none}.studio-grid,.preview-grid{display:grid;gap:10px;margin-top:10px}.studio-grid{grid-template-columns:repeat(8,minmax(0,1fr))}.preview-grid{grid-template-columns:1fr}.panel{--panel-accent: transparent;display:block;min-width:0;padding:10px;border:1px solid color-mix(in srgb,var(--line) 86%,var(--panel-accent));border-radius:12px;background:linear-gradient(180deg,color-mix(in srgb,var(--panel-accent) 11%,transparent),transparent 54%),var(--panel-soft);box-shadow:var(--shadow)}.panel-half{grid-column:span 4}.panel-wide{grid-column:span 8}.panel-full{grid-column:1 / -1}.panel-head h3{margin:0;font-size:.86rem;font-weight:600;letter-spacing:-.01em;color:color-mix(in srgb,var(--text) 92%,var(--panel-accent))}.panel-head p{margin:2px 0 0;color:var(--text-muted);font-size:.7rem}.panel-head-toggle{width:100%;border:0;background:transparent;color:inherit;padding:0;text-align:left}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.panel-caret{font-size:.78rem;color:var(--text-muted);transition:transform .12s ease}.panel.is-collapsed .panel-caret{transform:rotate(-90deg)}.panel-body{display:grid;gap:10px;margin-top:10px}.form-grid{display:grid;gap:8px}.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.form-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.field{display:grid;gap:4px}.field span{color:var(--text-muted);font-size:.7rem}.field input,.field select,.field textarea{width:100%;border:1px solid color-mix(in srgb,var(--line) 78%,transparent);border-radius:12px;background:var(--field-bg);color:var(--field-text);padding:10px 12px;outline:none}.field input::placeholder,.field textarea::placeholder{color:var(--text-muted)}.field textarea{resize:vertical;min-height:66px}.field input:focus,.field select:focus,.field textarea:focus,input[type=range]:focus{border-color:var(--focus-line);box-shadow:0 0 0 3px var(--focus-ring)}.range-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}input[type=range]{width:100%;accent-color:var(--amber)}.mini-stack{display:grid;gap:8px}.metric-row,.action-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.metric-row span{display:block;margin-top:2px;color:var(--text-muted);font-size:.74rem}.preset-list{display:grid;gap:6px}.preset-chip{display:flex;justify-content:space-between;gap:12px;align-items:center;text-align:left;border:1px solid var(--line);border-radius:10px;background:var(--surface-strong);color:inherit;padding:8px 10px;font-size:.82rem}.preset-chip span{color:var(--text-muted);font-size:.74rem}.family-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.family-card{--family-accent: var(--amber);text-align:left;padding:10px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(145deg,color-mix(in srgb,var(--family-accent) 10%,transparent),transparent 46%),var(--surface);color:inherit}.family-card strong{display:block;margin-bottom:4px}.family-card p{margin:0;color:var(--text-muted);font-size:.74rem}.family-card.active{border-color:color-mix(in srgb,var(--family-accent) 50%,white)}.subgenre-grid{display:grid;gap:8px}.subgenre-card{--family-accent: var(--amber);display:grid;gap:8px;padding:10px;border:1px solid color-mix(in srgb,var(--family-accent) 28%,rgba(255,255,255,.08));border-radius:10px;background:linear-gradient(180deg,color-mix(in srgb,var(--family-accent) 8%,transparent),transparent 36%),var(--surface)}.subgenre-head{display:flex;justify-content:space-between;gap:10px;align-items:baseline}.subgenre-head span{color:var(--text-muted);font-size:.7rem}.chip-bank{display:flex;flex-wrap:wrap;gap:6px}.chip{border:1px solid var(--line);border-radius:999px;padding:6px 10px;background:var(--surface-strong);color:inherit;font-size:.78rem}.chip.active{border-color:#ffb66266;background:linear-gradient(135deg,color-mix(in srgb,var(--amber) 22%,transparent),color-mix(in srgb,var(--cyan) 12%,transparent)),var(--surface)}.output-block{--block-accent: var(--amber);border:1px solid color-mix(in srgb,var(--line) 74%,var(--block-accent));border-radius:10px;padding:10px;background:linear-gradient(180deg,color-mix(in srgb,var(--block-accent) 10%,transparent),transparent 48%),var(--output-bg)}.output-block.major{background:linear-gradient(180deg,color-mix(in srgb,var(--block-accent) 8%,transparent),transparent 52%),var(--output-major-bg)}.output-block.compact{max-height:260px;overflow:auto}.output-label{margin-bottom:6px;color:var(--output-label-color, var(--amber));font-size:.66rem;letter-spacing:.14em;text-transform:uppercase}.output-label-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}.output-label-row .output-label{margin-bottom:0}.lyrics-edit-button{border:0;background:transparent;color:var(--text-muted);padding:0;font-size:.72rem}.lyrics-edit-button:hover{color:var(--output-label-color, var(--amber))}.lyrics-preview-button{width:100%;border:0;background:transparent;padding:0;text-align:left;color:inherit}.lyrics-preview-button pre{pointer-events:none}.lyrics-editor{width:100%;min-height:212px;border:0;background:transparent;color:var(--output-text-color, var(--output-text));padding:0;resize:vertical;outline:none;font-family:SF Mono,Monaco,Consolas,monospace;font-size:.8rem;line-height:1.46}.output-block pre{margin:0;white-space:pre-wrap;word-break:break-word;font-family:SF Mono,Monaco,Consolas,monospace;font-size:.8rem;line-height:1.46;color:var(--output-text-color, var(--output-text))}.preview-block-grid{display:grid;gap:10px}.empty-state{padding:10px;border:1px dashed color-mix(in srgb,var(--line) 78%,transparent);border-radius:10px;color:var(--text-muted);font-size:.78rem}@media (max-width: 1540px){.family-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 1260px){.app-shell{padding-right:14px}.drawer-rail{display:none}.topbar,.studio-grid{grid-template-columns:1fr}.panel-half,.panel-wide,.panel-full{grid-column:auto}}@media (max-width: 860px){.form-grid.two,.form-grid.three,.form-grid.four,.family-grid{grid-template-columns:1fr}}