html, body { margin: 0; min-height: 100%; background: #0b0f13; color: #edf3f6; }
body { font-family: "IBM Plex Sans", sans-serif; }
a { color: #76e4b8; }
.telemetry-page { min-height: 100vh; min-height: 100dvh; --blazor-telemetry-min-height: 100vh; --blazor-telemetry-min-height: 100dvh; }
.content { padding: 1.5rem; }
.valid.modified:not([type=checkbox]) { outline: 1px solid #76e4b8; }
.invalid { outline: 1px solid #ff7b72; }
.validation-message { color: #ff7b72; }
.blazor-error-boundary { padding: 1rem; color: #fff; background: #8b1c1c; }
#blazor-error-ui { position: fixed; z-index: 1000; right: 1rem; bottom: 1rem; display: none; padding: .75rem 1rem; color: #111; background: #f3bd62; border-radius: .5rem; }
.auth-page { min-height: 100vh; display: grid; place-items: center; }
.auth-card { width: min(100%, 34rem); padding: clamp(1.5rem, 4vw, 2.75rem); border: 1px solid #27343d; border-radius: 1rem; background: #111820; box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, .35); }
.auth-card h1 { margin: .4rem 0 .75rem; }
.auth-card p { color: #aebdc6; }
.auth-label { color: #76e4b8; font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.auth-help { margin: 1.5rem 0 0; }