@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600&family=Space+Grotesk:wght@500;700&display=swap";:root{color-scheme:dark;--bg: #071019;--bg2: #10283b;--panel: rgba(9, 16, 25, .72);--panel-border: rgba(125, 211, 252, .18);--text: #edf6ff;--muted: #aac0d4;--accent: #f6c177;--accent2: #7dd3fc;--danger: #ff9c8f;--shadow: 0 20px 80px rgba(0, 0, 0, .34)}*{box-sizing:border-box}html,body,#root{min-width:0;overflow-x:hidden}body{margin:0;min-height:100vh;font-family:IBM Plex Sans,sans-serif;color:var(--text);background:radial-gradient(circle at top left,rgba(246,193,119,.18),transparent 35%),radial-gradient(circle at top right,rgba(125,211,252,.16),transparent 28%),linear-gradient(180deg,var(--bg) 0%,#0e2131 100%)}p,h1,h2,h3{overflow-wrap:break-word;word-break:normal}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{max-width:1480px;margin:0 auto;padding:32px 20px 56px}.panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:24px;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:var(--shadow)}.hero{display:flex;flex-wrap:wrap;justify-content:space-between;gap:32px;padding:30px;margin-bottom:24px}.hero-copy h1,.overview-panel h2,.section-title-row h2{margin:0;font-family:Space Grotesk,sans-serif;line-height:1.02}.hero-copy h1{font-size:clamp(2rem,4vw,3.75rem);max-width:12ch;margin-top:8px}.hero-text{margin:16px 0 0;color:var(--muted);line-height:1.72}.hero-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.hero-actions{display:grid;align-content:start;gap:18px;min-width:min(360px,100%)}.hero-bottom-row{flex:0 0 100%;display:flex;justify-content:flex-end;padding-top:22px;border-top:1px solid rgba(125,211,252,.12)}.hero-saved-link{display:inline-flex;align-items:center;gap:12px;text-decoration:none}.primary,.ghost{max-width:100%;border-radius:999px;border:0;padding:14px 20px;line-height:1.35;transition:transform .16s ease,opacity .16s ease}.primary{background:linear-gradient(135deg,var(--accent) 0%,#ff8a70 100%);color:#1a0d05;font-weight:700}.wide{width:100%}.ghost{background:#7dd3fc1a;color:var(--text);text-align:left;white-space:normal}.primary:hover,.ghost:hover{transform:translateY(-1px)}.primary:disabled{opacity:.6;cursor:not-allowed}.workspace-grid{display:grid;grid-template-columns:1fr;gap:24px;align-items:start}.control-panel,.overview-panel,.side-panel,.preview-panel,.debug-panel,.placeholder-panel,.saved-list-panel{padding:24px}.debug-panel{height:440px;overflow:auto;overscroll-behavior:contain}.control-panel{display:grid;grid-template-columns:1fr;gap:20px;align-items:start;min-width:0}.control-panel>.section-title-row,.control-panel>.error-banner{grid-column:1 / -1}.control-panel>.field,.control-panel>.sample-block{margin:0}.control-panel>.wide{justify-self:start;width:min(240px,100%)}.result-column,.columns,.debug-grid{display:grid;gap:26px;min-width:0}.result-column>*,.columns>*,.debug-grid>*{min-width:0}.columns{grid-template-columns:repeat(2,minmax(0,1fr))}.debug-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:24px}.section-title-row{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:20px;min-width:0}.section-title-row>*{min-width:0}.field{display:grid;gap:10px;margin-bottom:18px}.field>span,.mode-picker legend{color:var(--text);font-weight:600;line-height:1.45}.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.field-row.compact{grid-template-columns:repeat(2,max-content)}textarea,select,input{width:100%;border:1px solid rgba(170,192,212,.16);border-radius:18px;background:#04080e85;color:var(--text);padding:16px;line-height:1.55}textarea{resize:vertical}.control-header-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:12px}.llm-select-field{display:grid;gap:8px;width:min(100%,360px);min-width:260px;position:relative}.llm-select-field span{color:var(--muted);font-size:.78rem}.llm-select-field select{-webkit-appearance:none;-moz-appearance:none;appearance:none;min-height:40px;border-radius:999px;padding:8px 42px 8px 14px}.llm-select-field:after{content:"";position:absolute;right:18px;bottom:15px;width:8px;height:8px;border-right:2px solid var(--accent2);border-bottom:2px solid var(--accent2);pointer-events:none;transform:rotate(45deg)}.mode-picker{display:grid;gap:16px;margin:0 0 18px;padding:0;border:0}.mode-picker legend{padding:0}.mode-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.mode-option{display:grid;grid-template-columns:auto 1fr;gap:6px 10px;align-items:start;min-height:82px;padding:14px;border-radius:16px;border:1px solid rgba(170,192,212,.16);background:#04080e6b}.mode-option.is-selected{border-color:#f6c1777a;background:#f6c1771f}.mode-option.is-disabled{opacity:.55}.mode-option input{width:auto;margin:3px 0 0;accent-color:var(--accent)}.mode-option span{font-weight:700}.mode-option small{grid-column:2;color:var(--muted);line-height:1.45}.sample-row{display:flex;flex-wrap:wrap;overflow:visible;gap:12px;margin-top:16px}.sample-block{margin-top:18px;min-width:0}.saved-list-page{max-width:1120px}.saved-list-panel{display:grid;gap:18px;min-width:0}.saved-run-list{display:grid;gap:10px}.saved-run-button{display:grid;gap:6px;width:100%;min-width:0;padding:14px;border:1px solid rgba(170,192,212,.14);border-radius:16px;background:#04080e6b;color:var(--text);text-align:left;text-decoration:none}.saved-run-button.is-selected{border-color:#f6c1777a;background:#f6c1771f}.saved-run-button:hover{border-color:#7dd3fc5c;background:#7dd3fc1a}.saved-run-title{font-weight:700;line-height:1.35}.saved-run-meta,.saved-run-prompt{color:var(--muted);font-size:.84rem;line-height:1.45}.saved-run-prompt{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical}.saved-detail-hero .hero-copy h1{max-width:18ch}.saved-list-hero .hero-copy h1{max-width:10ch}.detail-nav-row{display:flex;flex-wrap:wrap;gap:12px}.detail-back-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}.sample-title-row{margin-bottom:2px}.sample-title-actions{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px}.sample-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:42px;padding:9px 14px;font-size:.84rem;line-height:1.25}.sample-toggle-icon{width:10px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transition:transform .16s ease}.sample-toggle-icon.is-open{transform:rotate(-135deg) translate(-1px,-1px)}.sample-toggle-icon.is-closed{transform:rotate(45deg) translate(-1px,-1px)}.status-text,.muted{color:var(--muted)}.error-banner{margin:16px 0 0;padding:14px 16px;border-radius:16px;background:#ff6c581f;color:var(--danger)}.badge,.status-chip{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:9px 13px;border-radius:999px;font-size:.84rem;line-height:1.25;background:#f6c17724;color:var(--accent);white-space:normal}.badge.subtle,.status-chip{background:#7dd3fc1f;color:var(--accent2)}.score-badge.score-strong{background:#6ee7b729;color:#9ef0c7}.score-badge.score-steady{background:#f6c17729;color:var(--accent)}.score-badge.score-weak{background:#ff9c8f24;color:var(--danger)}.status-chip.danger{background:#ff6c581f;color:var(--danger)}.summary-row,.track-meta{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px}.match-report-panel{padding:24px}.match-score-stack{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}.match-metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}.match-metric-card{padding:16px;border-radius:18px;border:1px solid rgba(170,192,212,.16);background:#04080e6b}.match-metric-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.match-metric-card strong{font-size:.96rem}.match-metric-card p{margin:10px 0 0;color:var(--muted);line-height:1.58}.side-time-stack{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.track-list{display:grid;gap:16px}.track-card{display:grid;grid-template-columns:72px 1fr;gap:16px;padding:16px;border-radius:18px;background:#030a128f;border:1px solid rgba(125,211,252,.1);align-items:start;min-width:0}.track-card.is-playing{border-color:#f6c17770;background:#f6c1771a}.track-media{display:grid;gap:10px;justify-items:start}.track-index{font-family:Space Grotesk,sans-serif;color:var(--accent);font-size:1.1rem;line-height:1}.track-artwork{width:72px;aspect-ratio:1;border-radius:12px;overflow:hidden;display:grid;place-items:center;background:linear-gradient(135deg,#f6c1772e,#7dd3fc1f),#071019d6;border:1px solid rgba(255,255,255,.1);box-shadow:0 12px 28px #0000003d}.track-artwork img{width:100%;height:100%;object-fit:cover;display:block}.track-artwork span{font-family:Space Grotesk,sans-serif;color:var(--accent);font-size:1.4rem}.track-title-row{display:flex;justify-content:space-between;gap:14px;align-items:start;min-width:0}.track-title-row strong{min-width:0;font-size:1rem;line-height:1.35}.track-action-row{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px;flex-shrink:0}.play-button{border:1px solid rgba(246,193,119,.34);border-radius:999px;background:#f6c17729;color:var(--accent);font-size:.78rem;font-weight:700;padding:6px 10px}.play-button:disabled{cursor:not-allowed;opacity:.58}.track-card.is-playing .play-button{background:#f6c17747;border-color:#f6c1778f}.stop-button{background:#ff6c5824;border-color:#ff6c5857;color:var(--danger)}.track-artist,.track-reason,.track-pack-reason,.candidate-list li span{margin:8px 0 0;color:var(--muted);line-height:1.58}.track-pack-reason{color:#ffe8bd}.tape-preview-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:20px}.jcard{min-height:260px;border-radius:22px;padding:16px;position:relative;overflow:hidden}.jcard:before{content:"";position:absolute;top:12px;right:12px;bottom:12px;left:12px;border:1px solid rgba(255,255,255,.12);border-radius:16px}.jcard-panel{position:relative;z-index:1;min-height:100%;padding:18px;border-radius:16px;display:grid;align-content:start;gap:14px}.jcard h3{margin:0;font-family:Space Grotesk,sans-serif;font-size:clamp(1.6rem,2.8vw,2.8rem)}.jcard-subtitle,.jcard-copy{margin:0;line-height:1.62}.spine-card .jcard-copy{font-size:.92rem}.eyebrow{margin:0;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;color:var(--accent2);line-height:1.45}pre{margin:0;overflow:auto;max-width:100%;padding:16px;border-radius:18px;background:#04080e94;color:#dbeafe;white-space:pre-wrap;overflow-wrap:break-word;word-break:normal}.bullet-list,.candidate-list{margin:0;padding-left:20px;color:var(--muted);line-height:1.65}.candidate-list li{margin-bottom:14px}.placeholder-panel{min-height:360px;display:grid;align-content:center}@media (max-width: 1120px){.workspace-grid,.debug-grid,.tape-preview-grid,.field-row,.match-metric-grid,.control-panel,.columns,.mode-options{grid-template-columns:1fr}.hero{flex-direction:column;gap:24px}.hero-bottom-row{justify-content:stretch}.hero-saved-link,.detail-nav-row,.detail-back-link{width:100%}.hero-saved-link,.detail-back-link{justify-content:center}.track-card{grid-template-columns:60px 1fr;gap:12px;padding:14px}.track-artwork{width:60px;border-radius:10px}}@media (max-width: 640px){.app-shell{padding:18px 12px 40px}.panel{border-radius:18px}.hero,.control-panel,.overview-panel,.side-panel,.preview-panel,.debug-panel,.placeholder-panel,.saved-list-panel{padding:18px}.hero-copy h1{max-width:none;font-size:2.25rem}.saved-detail-hero .hero-copy h1,.saved-list-hero .hero-copy h1{max-width:none}.hero-meta,.summary-row,.track-meta{gap:8px}.section-title-row{flex-direction:column;align-items:flex-start;gap:12px}.control-header-actions,.llm-select-field,.control-panel>.wide{width:100%;min-width:0}.sample-title-actions{width:100%;justify-content:flex-start}.mode-option{min-height:0}.sample-row{display:grid;grid-template-columns:1fr}.sample-row .ghost{width:100%}.saved-run-button{padding:12px}.track-card{grid-template-columns:52px 1fr}.track-artwork{width:52px}.track-title-row{display:grid;gap:10px}.track-action-row,.side-time-stack{justify-content:flex-start}.tape-preview-grid{gap:14px}.jcard,.jcard-panel{border-radius:16px}.jcard-panel{padding:14px}}@media (max-width: 420px){.app-shell{padding-inline:10px}.hero,.control-panel,.overview-panel,.side-panel,.preview-panel,.debug-panel,.placeholder-panel,.saved-list-panel{padding:14px}.hero-copy h1{font-size:2rem}.primary,.ghost{width:100%;justify-content:center;text-align:center}.badge,.status-chip,.play-button{font-size:.76rem}textarea,select,input{border-radius:14px;padding:13px 14px}.track-card{grid-template-columns:1fr}.track-media{grid-template-columns:auto 1fr;align-items:center}}