/* Monolith Hub. House style: navy, Montserrat headings (installed with the Monolith app), no web fonts
   so an on-site hub works with no internet. */
:root{
  --bg:#f3f5f9; --surface:#fff; --ink:#14213a; --muted:#5a6780; --line:#dbe1ea; --navy:#16305c;
  --bar:#0f2347; --bar-ink:#e8eef9; --accent:#2f6fd0; --accent-soft:#e6eefb;
  --ok:#1f7a4d; --ok-soft:#e1f2e8; --warn:#9a5c06; --warn-soft:#fbefd8; --bad:#b3261e; --bad-soft:#fbe4e2;
  --grey:#6b7280; --grey-soft:#eceef2;
  --f-head:"Montserrat","Segoe UI",system-ui,sans-serif; --f-body:"Inter","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono","Cascadia Mono",ui-monospace,monospace;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#0c1424; --surface:#131e34; --ink:#e3e9f4; --muted:#9aa7bf; --line:#26354f; --navy:#a9c4f2;
  --bar:#08101f; --bar-ink:#dbe5f7; --accent:#6ea2f0; --accent-soft:#1b2d4f;
  --ok:#5fcf94; --ok-soft:#133227; --warn:#e8b25a; --warn-soft:#382a11; --bad:#f08a80; --bad-soft:#3b1b19;
  --grey:#9aa3b2; --grey-soft:#1f2a3e; color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.55 var(--f-body)}
a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline}
h1,h2,h3{font-family:var(--f-head);color:var(--navy);margin:0;line-height:1.25}
h1{font-size:1.45rem} h2{font-size:1.1rem} h3{font-size:.95rem;color:var(--ink)}
.top{background:var(--bar);color:var(--bar-ink);display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding:10px max(16px,env(safe-area-inset-left))}
.top .brand{font:700 1rem var(--f-head);letter-spacing:.04em;color:#fff}
.top .brand small{font-weight:500;opacity:.7;margin-left:6px}
.top nav{display:flex;gap:4px;flex-wrap:wrap}
.top nav a{color:var(--bar-ink);padding:6px 10px;border-radius:6px;font-weight:500}
.top nav a.on,.top nav a:hover{background:rgba(255,255,255,.12);text-decoration:none}
.top .who{margin-left:auto;display:flex;gap:10px;align-items:center;font-size:.85rem;opacity:.9}
.top .who form{margin:0}
.top .who button{background:none;border:1px solid rgba(255,255,255,.3);color:var(--bar-ink);padding:4px 10px;border-radius:6px;cursor:pointer}
main{max-width:1200px;margin:0 auto;padding:22px max(16px,env(safe-area-inset-left)) 60px;display:flex;flex-direction:column;gap:22px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px;display:flex;flex-direction:column;gap:12px;min-width:0}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:18px}
.muted{color:var(--muted)} .small{font-size:.82rem} .mono{font-family:var(--f-mono);font-size:.85em}
.tbl{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:.9rem}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{font:600 .7rem var(--f-head);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
tr:last-child td{border-bottom:0}
.pill{display:inline-flex;align-items:center;gap:6px;font:600 .72rem/1 var(--f-head);padding:5px 9px;border-radius:999px;white-space:nowrap}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.lv-ok{background:var(--ok-soft);color:var(--ok)} .lv-warn,.lv-late{background:var(--warn-soft);color:var(--warn)}
.lv-fault,.lv-offline{background:var(--bad-soft);color:var(--bad)} .lv-never,.lv-none{background:var(--grey-soft);color:var(--grey)}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:3px;vertical-align:middle}
.d-ok{background:var(--ok)} .d-warn,.d-late{background:var(--warn)} .d-fault,.d-offline{background:var(--bad)} .d-never{background:var(--grey)}
.stagebar{display:flex;gap:3px}
.stagebar span{flex:1;height:6px;border-radius:3px;background:var(--line);min-width:14px}
.stagebar span.done{background:var(--accent)} .stagebar span.now{background:var(--navy)}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.tile b{display:block;font:700 1.5rem var(--f-head);color:var(--navy);font-variant-numeric:tabular-nums}
.tile span{font-size:.8rem;color:var(--muted)}
.stages{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.stages div{border:1px solid var(--line);border-top:4px solid var(--line);border-radius:6px;padding:8px;font-size:.78rem;background:var(--surface)}
.stages div b{display:block;font:600 .8rem var(--f-head)}
.stages .done{border-top-color:var(--accent)} .stages .now{border-top-color:var(--navy);background:var(--accent-soft)}
@media (max-width:760px){.stages{grid-template-columns:repeat(3,minmax(0,1fr))}}
form.inline{display:inline}
label{display:flex;flex-direction:column;gap:4px;font-size:.82rem;color:var(--muted);font-weight:500}
input,select,textarea{font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:7px 9px;min-width:0}
textarea{min-height:60px}
input:focus,select:focus,textarea:focus,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;align-items:end}
label.check{flex-direction:row;align-items:center;gap:8px;color:var(--ink)}
button,.btn{font:600 .85rem var(--f-head);background:var(--navy);color:#fff;border:0;border-radius:6px;padding:8px 14px;cursor:pointer;display:inline-block}
@media (prefers-color-scheme: dark){button,.btn{background:var(--accent);color:#08101f}}
button.ghost,.btn.ghost{background:transparent;color:var(--accent);border:1px solid var(--line)}
button.danger{background:var(--bad);color:#fff}
.flash{padding:10px 14px;border-radius:8px;font-weight:500}
.flash.ok{background:var(--ok-soft);color:var(--ok)} .flash.bad{background:var(--bad-soft);color:var(--bad)}
.warnbar{background:var(--warn-soft);color:var(--warn);padding:8px max(16px,env(safe-area-inset-left));font-size:.85rem}
.launch{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.launch a.go{display:flex;flex-direction:column;gap:2px;border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:var(--bg)}
.launch a.go b{font-family:var(--f-head);color:var(--navy)}
.auth{max-width:380px;margin:9vh auto;padding:0 16px}
.secret{font:600 1.15rem var(--f-mono);letter-spacing:.06em;background:var(--bg);border:1px dashed var(--line);padding:10px;border-radius:8px;word-break:break-all}
details summary{cursor:pointer;color:var(--accent);font-weight:500}
.reasons{margin:4px 0 0;padding-left:1.1em;font-size:.82rem;color:var(--muted)}