:root { color-scheme: light; --ink:#15222b; --muted:#62717a; --calm:#087f5b; --alert:#b42318; --paper:#f7faf9; --line:#d8e2df; }
* { box-sizing:border-box; }
body { margin:0; font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--ink); background:var(--paper); }
.sb-shell { width:min(960px,calc(100% - 32px)); margin:0 auto; padding:64px 0; }
.sb-eyebrow { margin:0 0 8px; color:var(--calm); font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
h1 { margin:0; font-size:clamp(2.2rem,7vw,4.7rem); line-height:1; letter-spacing:-.055em; }
.sb-lead { max-width:680px; margin:20px 0 36px; color:var(--muted); font-size:1.2rem; }
.sb-toolbar { display:flex; gap:16px; align-items:center; flex-wrap:wrap; margin-bottom:24px; }
button { appearance:none; border:0; border-radius:999px; padding:12px 18px; background:var(--ink); color:#fff; font-weight:750; cursor:pointer; }
#alarm-state { color:var(--muted); font-size:.9rem; }
.sb-calm,.sb-incident { display:flex; justify-content:space-between; gap:24px; border:1px solid var(--line); border-left:6px solid var(--calm); border-radius:16px; padding:24px; background:#fff; box-shadow:0 14px 40px rgba(21,34,43,.06); }
.sb-calm { flex-direction:column; gap:4px; }
.sb-incident { border-left-color:var(--alert); align-items:center; }
.sb-incident p { margin:6px 0 0; color:var(--muted); }
.sb-incident button { background:var(--alert); flex:0 0 auto; }
@media (max-width:620px) { .sb-incident { align-items:stretch; flex-direction:column; } }
.sb-form { display:grid; gap:18px; max-width:660px; }
.sb-form label:not(.sb-check) { display:grid; gap:7px; font-weight:700; }
.sb-form input,.sb-form select { width:100%; border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:#fff; color:var(--ink); font:inherit; }
.sb-form fieldset { display:grid; gap:10px; border:1px solid var(--line); border-radius:16px; padding:18px; background:#fff; }
.sb-form legend { padding:0 7px; font-weight:800; }
.sb-check { display:flex; align-items:center; gap:10px; }
.sb-check input { width:auto; }
.sb-note { min-height:1.5em; margin:0; color:var(--muted); }
.sb-login { max-width:720px; }
.sb-error { border:1px solid #f1b8b3; border-radius:12px; padding:12px 14px; color:var(--alert); background:#fff4f2; }
a { color:#075e46; font-weight:700; }
.sb-alarming #alarm-state { color:var(--alert); font-weight:800; }

