:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background:#0b1018; color:#e8edf5; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 15% -10%,#182744 0,transparent 36rem),#0b1018; }
a { color:inherit; }
.topbar { min-height:68px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 32px; border-bottom:1px solid #243044; background:rgba(10,15,23,.9); backdrop-filter:blur(16px); position:sticky; top:0; z-index:10; }
.brand { font-size:18px; font-weight:750; text-decoration:none; letter-spacing:-.02em; }.brand span { color:#7db2ff; font-weight:550; }
.topbar-left,.topbar-left nav { display:flex; align-items:center; gap:24px; }.topbar-left nav { gap:6px; }.topbar-left nav a { padding:8px 10px; border-radius:8px; color:#9daabd; font-size:13px; text-decoration:none; }.topbar-left nav a:hover { background:#172131; color:#e8edf5; }
.account { display:flex; align-items:center; gap:16px; color:#aab6c8; font-size:13px; }.account form { margin:0; }
button { border:0; border-radius:9px; padding:11px 16px; background:#79aefc; color:#08101d; font:inherit; font-weight:750; cursor:pointer; }button:hover { background:#9bc3ff; }.quiet { background:#182233; color:#c9d4e6; padding:8px 12px; }
.shell { width:min(1320px,calc(100% - 40px)); margin:0 auto; padding:40px 0 64px; }.login-shell { min-height:100vh; display:grid; place-items:center; padding:24px; }
.login-card { width:min(440px,100%); border:1px solid #2a3850; border-radius:18px; padding:34px; background:rgba(17,24,36,.94); box-shadow:0 24px 80px rgba(0,0,0,.35); }.login-card h1 { margin:8px 0 10px; font-size:30px; }.login-card p { margin:0 0 24px; color:#9eacc0; line-height:1.55; }
.login-form { display:grid; gap:16px; }.login-form label { display:grid; gap:7px; font-size:13px; font-weight:650; color:#bac6d8; }.login-form input { width:100%; border:1px solid #33435c; border-radius:9px; padding:12px 13px; background:#0d1420; color:#f4f7fb; font:inherit; outline:none; }.login-form input:focus { border-color:#78adfa; box-shadow:0 0 0 3px rgba(120,173,250,.13); }.login-form button { margin-top:4px; }
.alert { margin:0 0 18px; padding:11px 13px; border:1px solid #7d3b45; border-radius:9px; background:#351b22; color:#ffbec6; font-size:14px; }
.alert.success { border-color:#285c4b; background:#12352a; color:#9ae5c5; }
.eyebrow { color:#79aefc; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }.page-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:24px; }.page-heading h1 { margin:5px 0 0; font-size:34px; letter-spacing:-.035em; }.page-heading p { margin:6px 0 0; color:#98a7ba; }.generated,.role { color:#8f9db0; font-size:13px; }.back { display:inline-block; margin-bottom:12px; color:#87b6fc; text-decoration:none; font-size:13px; }
.stats { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:24px; }.stats article { min-height:112px; padding:20px; border:1px solid #253248; border-radius:13px; background:linear-gradient(145deg,rgba(25,35,51,.9),rgba(15,22,33,.9)); }.stats strong { display:block; font-size:30px; letter-spacing:-.04em; }.stats span { display:block; margin-top:8px; color:#93a2b7; font-size:12px; line-height:1.35; }.stats .warning { border-color:#75414a; }.stats .warning strong { color:#ff9da9; }
.job-stats { grid-template-columns:repeat(5,minmax(0,1fr)); }
.analytics-section { margin:34px 0 30px; }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:16px; }.section-heading h2 { margin:5px 0 0; font-size:25px; letter-spacing:-.025em; }.section-heading p { margin:5px 0 0; color:#8f9eb2; font-size:13px; }.status-pill { align-self:center; padding:5px 9px; border:1px solid #34445d; border-radius:999px; color:#96a5b9; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.status-pill.healthy { border-color:#285c4b; background:#12352a; color:#85dfba; }.status-pill.warning { border-color:#75414a; background:#351b22; color:#ffabb6; }.analytics-stats { grid-template-columns:repeat(4,minmax(0,1fr)); }.analytics-stats article { min-height:98px; }.chart-panel { overflow:hidden; }.chart-legend { color:#7f91a8; font-size:11px; }.chart-legend span::before { display:inline-block; width:8px; height:8px; margin-right:6px; border-radius:2px; background:#6da9ff; content:""; }.volume-chart-wrap { padding:15px 20px 12px; }.volume-chart { display:block; width:100%; height:auto; min-height:210px; }.volume-chart line { stroke:#2b394e; stroke-width:1; }.volume-chart rect { fill:#6da9ff; opacity:.88; transition:opacity .15s ease; }.volume-chart rect:hover { opacity:1; }.volume-chart text { fill:#74849a; font-size:10px; }.chart-caption { display:flex; justify-content:space-between; margin-top:-10px; color:#66768c; font-size:10px; }.breakdown-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }.breakdown-panel { margin-bottom:22px; }.breakdown-list { margin:0; padding:10px 18px 15px; list-style:none; }.breakdown-list li { padding:8px 0; }.breakdown-list li>div { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:6px; font-size:12px; }.breakdown-list li span { color:#aab6c8; }.breakdown-list li strong { color:#e8edf5; font-size:11px; font-variant-numeric:tabular-nums; }.breakdown-list progress { display:block; width:100%; height:5px; overflow:hidden; border:0; border-radius:999px; background:#1c2738; color:#6da9ff; }.breakdown-list progress::-webkit-progress-bar { background:#1c2738; }.breakdown-list progress::-webkit-progress-value { border-radius:999px; background:#6da9ff; }.breakdown-list progress::-moz-progress-bar { border-radius:999px; background:#6da9ff; }.breakdown-list .empty { color:#74849a; font-size:12px; }.analytics-error { display:grid; gap:5px; padding:18px 20px; border:1px solid #75414a; border-radius:12px; background:#27171d; color:#ffb6c0; font-size:13px; }.analytics-error span { color:#ae7f87; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px; overflow-wrap:anywhere; }
.panel { border:1px solid #253248; border-radius:14px; background:rgba(15,22,33,.88); overflow:hidden; margin-bottom:22px; }.panel-heading { min-height:72px; padding:17px 20px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #222f42; }.panel-heading h2 { margin:0; font-size:17px; }.panel-heading p { margin:5px 0 0; color:#8898ad; font-size:12px; }.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; font-size:13px; }th { padding:12px 16px; text-align:left; color:#7f8ea3; font-size:10px; text-transform:uppercase; letter-spacing:.09em; background:#101824; }td { padding:15px 16px; border-top:1px solid #202c3e; color:#bdc8d8; white-space:nowrap; }tbody tr:hover { background:#141e2c; }td:first-child a { display:inline-grid; gap:3px; min-width:180px; text-decoration:none; }td:first-child a strong { color:#eef2f8; }td:first-child a span { color:#8392a8; font-size:11px; }td em { margin-left:8px; padding:3px 6px; border-radius:5px; background:#203a60; color:#9bc3ff; font-size:10px; font-style:normal; }
.job-toolbar { gap:20px; }.job-filters { display:flex; align-items:end; gap:9px; }.job-filters label { display:grid; gap:5px; color:#8291a6; font-size:10px; font-weight:750; letter-spacing:.07em; text-transform:uppercase; }.job-filters input,.job-filters select { min-width:130px; border:1px solid #33435c; border-radius:8px; padding:8px 9px; background:#0d1420; color:#e8edf5; font:inherit; font-size:12px; }.jobs-table td:first-child { max-width:340px; }.jobs-table td:first-child strong,.jobs-table td:first-child span,.jobs-table td small { display:block; }.jobs-table td:first-child strong { margin-bottom:4px; color:#edf2f8; }.jobs-table td small { margin-top:4px; max-width:300px; overflow:hidden; color:#74849a; font-size:10px; text-overflow:ellipsis; }.job-status { display:inline-flex; padding:4px 7px; border:1px solid #34445d; border-radius:999px; color:#a7b4c7; font-size:10px; font-weight:800; text-transform:uppercase; }.job-status.running,.job-status.queued { border-color:#315a84; background:#142b45; color:#9bc9ff; }.job-status.succeeded { border-color:#285c4b; background:#12352a; color:#85dfba; }.job-status.failed { border-color:#75414a; background:#351b22; color:#ffabb6; }.job-error { display:block; max-width:280px; overflow:hidden; color:#b9a4a9; text-overflow:ellipsis; }.job-actions { display:flex; align-items:center; gap:6px; }.job-actions form { margin:0; }.job-actions button { padding:7px 9px; font-size:11px; }.job-actions .danger { background:#5d2932; color:#ffd0d5; }.muted { color:#74849a; font-size:11px; }
.manual-job-form { display:grid; grid-template-columns:minmax(170px,1fr) minmax(300px,2fr) minmax(140px,1fr) auto; align-items:end; gap:12px; padding:20px 20px 12px; }.manual-job-form label { display:grid; gap:6px; color:#8291a6; font-size:10px; font-weight:750; letter-spacing:.07em; text-transform:uppercase; }.manual-job-form select { width:100%; border:1px solid #33435c; border-radius:8px; padding:10px; background:#0d1420; color:#e8edf5; font:inherit; font-size:12px; }.manual-job-note { margin:0; padding:0 20px 20px; color:#7f8ea3; font-size:11px; line-height:1.5; }
.split { display:grid; grid-template-columns:1fr 1fr; gap:22px; }.compact { margin:0; }.compact dl { margin:0; }.compact dl div { display:flex; align-items:start; justify-content:space-between; gap:20px; padding:13px 18px; border-top:1px solid #202c3e; }.compact dl div:first-child { border-top:0; }.compact dt { color:#8c9bb0; font-size:12px; }.compact dd { margin:0; text-align:right; font-size:13px; }.mono { max-width:320px; overflow-wrap:anywhere; white-space:normal; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px!important; color:#9db4d6; }.audit-list { margin:0; padding:0; list-style:none; }.audit-list li { display:flex; justify-content:space-between; gap:16px; padding:12px 18px; border-top:1px solid #202c3e; font-size:12px; color:#aab6c8; }.audit-list li:first-child { border-top:0; }.audit-list time { color:#74849a; white-space:nowrap; }
@media (max-width:1050px) { .stats { grid-template-columns:repeat(3,1fr); }.analytics-stats { grid-template-columns:repeat(4,1fr); }.breakdown-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:720px) { .topbar { padding:0 18px; }.account>span { display:none; }.topbar-left { gap:10px; }.topbar-left nav a { padding:7px 6px; }.shell { width:min(100% - 24px,1320px); padding-top:24px; }.stats,.analytics-stats,.job-stats { grid-template-columns:repeat(2,1fr); }.split,.breakdown-grid,.manual-job-form { grid-template-columns:1fr; }.page-heading,.section-heading,.job-toolbar { align-items:start; flex-direction:column; }.job-filters { align-items:stretch; flex-wrap:wrap; }.login-card { padding:25px; }.volume-chart-wrap { padding-inline:8px; }.volume-chart { min-width:680px; }.chart-panel { overflow:auto; } }
