:root{--bg: #0f1115;--surface: #171a21;--surface-raised: #1f232c;--border: #2a2f3a;--text: #e6e8ec;--text-muted: #8b92a3;--accent: #4f8cff;--accent-hover: #6ba0ff;--green: #3ecf8e;--red: #f0576b;--radius: 8px}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}input,select,button,textarea{font-family:inherit;font-size:14px}input,select,textarea{background:var(--surface-raised);border:1px solid var(--border);color:var(--text);border-radius:var(--radius);padding:8px 10px}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px}button{cursor:pointer;background:var(--accent);color:#fff;border:none;border-radius:var(--radius);padding:9px 16px;font-weight:600}button:hover:not(:disabled){background:var(--accent-hover)}button:disabled{opacity:.5;cursor:not-allowed}button.secondary{background:var(--surface-raised);color:var(--text);border:1px solid var(--border)}button.secondary:hover:not(:disabled){background:var(--border)}button.danger{background:var(--red)}table{border-collapse:collapse;width:100%}th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--border)}th{color:var(--text-muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.04em}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px}.error{color:var(--red);font-size:13px}.positive{color:var(--green)}.negative{color:var(--red)}.page{max-width:1200px;margin:0 auto;padding:24px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.page-header h1{margin:0;font-size:22px}.muted{color:var(--text-muted)}.actions{display:flex;gap:12px;align-items:center;white-space:nowrap}.actions a{color:var(--accent);text-decoration:none;font-size:13px}.actions a:hover{text-decoration:underline}.actions button{padding:5px 10px;font-size:12px}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;background:var(--surface-raised);border:1px solid var(--border);color:var(--text-muted)}.badge-live{background:#f0576b26;border-color:var(--red);color:var(--red)}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:14px}.field label{font-size:12px;color:var(--text-muted)}.field:has(:required)>label:after,label.required:after{content:" *";color:var(--red)}.field-row{display:flex;gap:16px}.field-row .field{flex:1;min-width:0}.field-row .field select,.field-row .field input{min-width:0;max-width:100%}.checkbox-field{display:flex;align-items:center;gap:8px;margin-bottom:14px}.checkbox-field input{width:auto}.page.wide{max-width:1200px}.table-scroll{overflow-x:auto}table.compact th,table.compact td{padding:6px 8px;font-size:13px}.small{font-size:12px}.badge-ok{background:#3ecf8e26;border-color:var(--green);color:var(--green)}.sharpe-poor{color:var(--red)}.sharpe-weak{color:#e8a33d}.sharpe-good{color:var(--green)}.sharpe-great,.drawdown-shallow{color:var(--green);font-weight:700}.drawdown-moderate{color:var(--green)}.drawdown-deep{color:#e8a33d}.drawdown-severe{color:var(--red)}tr.expandable{cursor:pointer}tr.expandable:hover,tr.expandable.open{background:var(--surface-raised)}tr.detail-row>td{background:var(--surface-raised)}.label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}.value{font-size:15px;font-weight:600;margin-top:2px}.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:16px}.filters .field{margin-bottom:0}@media(max-width:600px){.page{padding:16px}}.typeahead-list{position:fixed;z-index:1000;margin:0;padding:4px 0;list-style:none;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 4px 12px #0006;font-size:13px}.typeahead-list li{display:flex;gap:10px;align-items:baseline;padding:6px 10px;cursor:pointer}.typeahead-list li span{color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.typeahead-list li:hover,.typeahead-list li.active{background:var(--border)}.spinner{width:22px;height:22px;border:3px solid color-mix(in srgb,var(--accent) 25%,transparent);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
