:root{color-scheme:dark;font-family:Inter,Segoe UI,Arial,sans-serif;font-synthesis:none;background:#0c121c;color:#e9f0fc}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse 900px 500px at 90% 0%,#192e46 0%,#0c121c 65%);min-height:100vh}
a{color:#89d5f4;text-decoration:none}
a:hover{text-decoration:underline}
button,input{font:inherit}
.shell{max-width:1330px;margin:auto;min-height:100vh;display:flex;flex-direction:column}
.topbar{padding:22px 30px;border-bottom:1px solid #26364b;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;gap:12px;align-items:center;color:#edf7ff;font-size:1.1rem;font-weight:500;letter-spacing:.14em}
.brand-icon{border:1px solid #4d8caf;border-radius:12px;padding:8px;background:#14344c}
nav{display:flex;align-items:center;gap:20px}
nav a,.text-button{color:#bfd0df;font-size:.9rem}
.logout-form{margin:0}
.text-button{cursor:pointer;border:0;background:none;padding:0}
.content{padding:44px 30px;flex:1}
footer{border-top:1px solid #26364b;padding:20px 30px;color:#7c91a7;font-size:.78rem}
.heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px}
.heading p,.panel p{line-height:1.6;color:#a9b9ce}
h1{font-size:clamp(1.8rem,4vw,2.5rem);letter-spacing:-.035em;margin:8px 0}
h2{font-size:1.15rem;margin:0 0 14px}
.eyebrow{font-size:.74rem;font-weight:700;letter-spacing:.18em;color:#60d1d4}
.status{background:#123a41;border:1px solid #27666c;border-radius:99px;padding:8px 14px;color:#9af0e9;font-size:.8rem}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:24px}
.metric,.panel{background:#131f2e;border:1px solid #2b3c51;border-radius:16px;box-shadow:0 12px 32px #0002}
.metric{padding:20px;min-height:152px;display:flex;flex-direction:column;gap:14px}
.metric span{font-size:.82rem;color:#b9c9d9}
.metric strong{font-size:2.3rem}
.metric small{color:#7e95ac}
.panel{padding:26px;margin-bottom:20px}
.notice{border:1px solid #3d6171;background:#17313e;color:#c4e8f5;border-radius:10px;padding:13px 15px;margin:12px 0}
.notice.success{border-color:#29665a;background:#173730;color:#bcf4e1}
.notice.error{border-color:#934b4b;background:#3a2428;color:#ffd2d2}
.stack{display:flex;flex-direction:column;gap:10px;max-width:580px}
.stack label{font-weight:600;font-size:.88rem;margin-top:9px}
.stack input{border:1px solid #40556b;border-radius:9px;padding:12px 14px;background:#0e1926;color:#e9f0fc;outline:none;width:100%}
.stack input:focus{border-color:#58c9eb;box-shadow:0 0 0 3px #58c9eb20}
.primary{margin-top:18px;padding:12px 18px;background:#40bcca;border:0;border-radius:9px;color:#061c26;font-weight:700;cursor:pointer}
.primary:disabled{opacity:.65;cursor:wait}
.login-card{max-width:480px;margin:7vh auto;padding:32px}
.fineprint{font-size:.8rem;margin-top:20px}
@media(max-width:850px){.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar{padding:16px;align-items:flex-start;flex-direction:column}.content{padding:26px 16px}}
@media(max-width:500px){.metrics{grid-template-columns:1fr}.heading{align-items:flex-start;flex-direction:column}nav{gap:12px;flex-wrap:wrap}.panel{padding:19px}}

.archive-list{display:flex;flex-direction:column;gap:0;max-width:920px;overflow-wrap:anywhere}
.archive-row{padding:15px 0;display:flex;gap:16px;justify-content:space-between;align-items:center;border-bottom:1px solid #2b3c51}
.archive-row strong{font-size:.82rem;font-weight:600}
.archive-row small{display:block;color:#8197ad;margin-top:5px;font-size:.76rem}
.archive-row span{color:#a9b9ce;white-space:nowrap;font-size:.86rem}

/* Live telemetry dashboard */
.telemetry-head{display:flex;justify-content:space-between;align-items:start;flex-wrap:wrap;gap:22px}
.telemetry-filter{display:flex;flex-direction:column;gap:8px;min-width:min(100%,300px)}
.telemetry-filter label{font-size:.82rem;color:#b9c9d9}
.telemetry-filter select{width:100%;background:#0e1926;color:#e9f0fc;border:1px solid #40556b;border-radius:9px;padding:12px}
.telemetry-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0}
.telemetry-summary>div{border:1px solid #30455b;background:#0f1b2a;border-radius:12px;padding:15px;min-width:0}
.telemetry-summary span{display:block;color:#9daec4;font-size:.78rem;margin-bottom:10px}
.telemetry-summary strong{display:block;font-size:1.35rem;overflow-wrap:anywhere}
.telemetry-chart{background:#0e1926;border:1px solid #2b415a;border-radius:14px;padding:16px;margin:20px 0}
.telemetry-chart-title{display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap;align-items:center}
.telemetry-chart-title small{color:#91a7bd}
.telemetry-chart svg{width:100%;height:245px;display:block;margin-top:12px}
.telemetry-axis{display:flex;justify-content:space-between;color:#8fa4b9;font-size:.76rem}
.telemetry-table-wrap{width:100%;overflow-x:auto}
.telemetry-table{width:100%;border-collapse:collapse;text-align:left;font-size:.85rem}
.telemetry-table th,.telemetry-table td{padding:12px;border-bottom:1px solid #304156;vertical-align:top}
.telemetry-table th{color:#a8b9cc;font-size:.76rem;font-weight:600}
.telemetry-table td{font-variant-numeric:tabular-nums}
.telemetry-table summary{color:#7ad8eb;cursor:pointer;white-space:nowrap}
.telemetry-fields{display:grid;grid-template-columns:minmax(160px,1fr) minmax(120px,1fr);gap:7px 18px;padding:14px;background:#0e1926;border-radius:8px;min-width:310px;max-width:520px;overflow-wrap:anywhere}
.telemetry-fields dt{color:#93a9bc}.telemetry-fields dd{margin:0;color:#e9f0fc}
@media(max-width:850px){.telemetry-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:500px){.telemetry-head{flex-direction:column}.telemetry-filter{width:100%}.telemetry-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.telemetry-chart svg{height:190px}}