:root{--bg: #0f1419;--panel: #1a212b;--border: #2b3440;--text: #e6edf3;--muted: #8b98a5;--accent: #4f9cf9;--sio2: #5aa9e6;--ta2o5: #f4a259;--tio2: #8ac926}*{box-sizing:border-box}a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}a:visited{color:var(--accent)}a:hover{filter:brightness(1.15)}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.app{max-width:1280px;height:100vh;margin:0 auto;padding:16px 24px;display:flex;flex-direction:column;gap:12px}.app>*{width:100%;align-self:stretch}h1{font-size:18px;margin:0}.sub{color:var(--muted);margin:2px 0 0;font-size:13px}.nav{display:flex;align-items:center;justify-content:space-between;padding-bottom:8px;border-bottom:1px solid var(--border)}.nav-brand{font-size:19px;font-weight:700}.nav-tabs{display:flex;gap:6px}.nav-tab{background:transparent;color:var(--muted);border:1px solid transparent;padding:6px 14px;border-radius:6px;font-size:13px;font-weight:600}.nav-tab:hover{color:var(--text)}.nav-tab.active{background:var(--panel);color:var(--text);border-color:var(--border)}.view{flex:1;min-height:0;display:flex;flex-direction:column;gap:12px}[hidden]{display:none!important}.about{flex:1;min-height:0;overflow-y:auto}.about-content{max-width:760px;margin:0 auto;padding:0 8px;font-size:15px}.about-content h2{font-size:18px;margin:22px 0 6px}.about-content h2:first-child{margin-top:2px}.about-content ul,.about-content ol{padding-left:20px;margin:6px 0}.about-content li{margin:5px 0}.about-content code{background:var(--bg);padding:1px 5px;border-radius:4px}.panel{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:14px}.row{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}.row .generate-btn{margin-left:auto;align-self:stretch;padding-inline:24px;min-width:168px}select#band{min-width:200px}.budget-picker{min-width:220px}.budget-readout{color:var(--text);font-weight:600}.budget-picker input[type=range]{width:100%;accent-color:var(--accent);margin:0;padding:6px 0}.budget-picker input[type=range]:disabled{opacity:.5;cursor:not-allowed}.progress-slot{flex:1;min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center}.progress-slot .progress{margin-top:0}label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}select{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:8px 10px;min-width:320px;font-size:14px}button{background:var(--accent);color:#04121f;border:0;border-radius:6px;padding:9px 18px;font-size:14px;font-weight:600;cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}.results{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 500px;gap:16px}.results-main{min-width:0;min-height:0;display:flex;flex-direction:column;gap:12px}.results-side{min-height:0;display:flex}.results-side .panel{flex:1;min-height:0;display:flex;flex-direction:column}.results-main>.panel:first-child{flex:1;min-height:0;display:flex;flex-direction:column}.charts{flex:1;min-height:0;display:grid;grid-template-columns:1fr;grid-template-rows:1fr 1fr;gap:16px}.chart{min-height:0;display:flex;flex-direction:column}.chart-svg-wrap{flex:1;min-height:0;position:relative}.spectrum-svg{display:block;-webkit-user-select:none;user-select:none;touch-action:none}.pivot-dot{fill:#4f9cf9;stroke:#0c1015;stroke-width:1.5;cursor:grab}.pivot-dot:hover{fill:#7fb6ff}.pivot-dot:active{cursor:grabbing}.chart-title{font-size:13px;font-weight:600;margin:0 0 8px}.metrics{display:flex;gap:24px;flex-wrap:wrap}.metric .k{font-size:11px;color:var(--muted);text-transform:uppercase}.metric .v{font-size:18px;font-weight:600}.metric .v.sub{font-size:12px;color:var(--muted);font-weight:400}.stack{flex:1;min-height:0;display:flex;flex-direction:column}.stack-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px}.stack-actions{display:flex;gap:8px;flex-shrink:0}button.btn-sm{padding:5px 10px;font-size:12px;font-weight:500}button.btn-secondary{background:transparent;color:var(--text);border:1px solid var(--border)}button.btn-secondary:hover:not(:disabled){background:rgba(255,255,255,.04);border-color:var(--accent)}.table-wrap{flex:1;min-height:0;overflow-y:auto;border:1px solid var(--border);border-radius:6px}table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}th,td{padding:6px 12px;text-align:left}thead th{position:sticky;top:0;background:var(--panel);color:var(--muted);font-size:11px;text-transform:uppercase;border-bottom:1px solid var(--border)}tbody tr:nth-child(2n){background:rgba(255,255,255,.02)}td.num{text-align:right}.swatch{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:8px;vertical-align:middle}.bar{display:inline-block;height:8px;border-radius:2px;vertical-align:middle;margin-left:8px}tfoot td{border-top:1px solid var(--border);font-weight:600}.progress{margin-top:16px}.progress-head{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px}.progress-track{height:8px;background:var(--bg);border:1px solid var(--border);border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),#8ac926);border-radius:999px;transition:width .12s linear}.progress-steps{display:flex;gap:18px;margin-top:8px;font-size:12px}.pstep{color:var(--muted)}.pstep.active{color:var(--text);font-weight:600}.pstep.done{color:#8ac926}.error{color:#ff6b6b}.muted{color:var(--muted)}.status-screen{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:24px}.status-card{max-width:420px;text-align:center;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:32px 28px}.status-icon{font-size:40px;line-height:1;margin-bottom:10px}.status-card h2{font-size:18px;margin:0 0 10px}.status-card p{margin:6px 0}@media (max-width: 768px){html,body{height:auto}body{overflow:auto}.app{height:auto;min-height:100vh;padding:12px 14px}.nav{flex-direction:column;align-items:stretch;gap:8px}.nav-brand{font-size:17px}.nav-brand .muted{display:none}.nav-tabs{width:100%}.nav-tab{flex:1;text-align:center}.row{flex-direction:column;align-items:stretch}.row .generate-btn{margin-left:0;min-width:0}select,select#band,.budget-picker{min-width:0;width:100%}.results{display:flex;flex-direction:column}.results-main>.panel:first-child{flex:none}.charts{display:flex;flex-direction:column}.chart{height:260px}.results-side{min-height:360px}.about{overflow-y:visible}}
