@font-face { font-family:'Big Shoulders Display'; font-weight:700 900; font-display:swap; src:url('fonts/bigshoulders-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+20AC; }
@font-face { font-family:'IBM Plex Sans'; font-weight:400 600; font-display:swap; src:url('fonts/plexsans-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+2013, U+2014, U+20AC; }
:root { --bg:#e2e4e7; --grid:rgba(21,23,27,.075); --card:#fbfbfa; --ink:#15171b; --ink2:#555c67; --accent:#ffc800; --ok:#1d7a3a; --bad:#b3261e; }
@media (prefers-color-scheme: dark) { :root { --bg:#16181c; --grid:rgba(255,255,255,.05); --card:#20232a; --ink:#eceef1; --ink2:#9aa1ad; --ok:#5cd17f; --bad:#ff8a80; } }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background-color:var(--bg); color:var(--ink); font:16px/1.5 'IBM Plex Sans', system-ui, sans-serif;
  background-image:linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px); background-size:24px 24px; }
main { max-width:900px; margin:0 auto; padding:32px 16px 56px; }
h1 { font:800 clamp(2.2rem,7vw,3.4rem)/1 'Big Shoulders Display', 'Arial Narrow', Impact, sans-serif; text-transform:uppercase; letter-spacing:.02em; margin:28px 0 6px; }
h2 { font:800 1.5rem/1 'Big Shoulders Display', 'Arial Narrow', Impact, sans-serif; text-transform:uppercase; margin:0 0 14px; }
.bar { width:72px; height:8px; background:var(--accent); margin:0 0 20px; }
.lead { color:var(--ink2); margin:0 0 24px; }
.nav { display:flex; flex-wrap:wrap; gap:6px 18px; align-items:center; padding-bottom:12px; border-bottom:2px solid var(--ink); font-weight:600; font-size:.95rem; }
.nav a { color:var(--ink); text-decoration:none; padding:2px 0; border-bottom:3px solid transparent; }
.nav a:hover, .nav a:focus-visible, .nav a.on { border-bottom-color:var(--accent); outline:none; }
.nav .sp { flex:1; }
.nav .who { color:var(--ink2); }
form.inline { display:inline; margin:0; }
button.link { background:none; border:0; padding:2px 0; font:inherit; font-weight:600; color:var(--ink); cursor:pointer; border-bottom:3px solid transparent; }
button.link:hover, button.link:focus-visible { border-bottom-color:var(--accent); outline:none; }
.card { background:var(--card); border:2px solid var(--ink); box-shadow:5px 5px 0 var(--ink); padding:20px 22px; margin:0 0 24px; max-width:520px; }
.card p { margin:0; color:var(--ink2); }
.form label { display:block; font-weight:600; font-size:.9rem; margin:0 0 14px; }
.form input { display:block; width:100%; margin-top:4px; padding:9px 10px; font:inherit; color:var(--ink); background:var(--bg); border:2px solid var(--ink); border-radius:0; }
.form input:focus-visible { outline:3px solid var(--accent); outline-offset:1px; }
.btn { font:inherit; font-weight:600; color:#15171b; background:var(--accent); border:2px solid var(--ink); padding:9px 18px; cursor:pointer; box-shadow:3px 3px 0 var(--ink); }
.btn:hover, .btn:focus-visible { transform:translate(-1px,-1px); box-shadow:4px 4px 0 var(--ink); outline:none; }
.msg { max-width:520px; padding:10px 14px; margin:0 0 20px; border:2px solid; font-weight:600; background:var(--card); }
.msg.ok { color:var(--ok); border-color:var(--ok); }
.msg.bad { color:var(--bad); border-color:var(--bad); }
.kv { display:grid; grid-template-columns:max-content 1fr; gap:6px 18px; margin:0; }
.kv dt { color:var(--ink2); }
.kv dd { margin:0; font-weight:600; }
footer { margin-top:48px; color:var(--ink2); font-size:.85rem; }
.lead.wide, .tiles { max-width:none; }
.tiles { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
a.tile { display:block; background:var(--card); color:inherit; text-decoration:none; padding:22px 22px 20px; border:2px solid var(--ink); box-shadow:5px 5px 0 var(--ink); transition:transform .12s, box-shadow .12s; }
a.tile:hover, a.tile:focus-visible { transform:translate(-2px,-2px); box-shadow:7px 7px 0 var(--accent); outline:none; }
a.tile:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.tile h2 { font-size:1.9rem; margin:0 0 8px; }
.tile p { margin:0 0 14px; color:var(--ink2); }
.tile span { font-size:.85rem; font-weight:600; border-bottom:3px solid var(--accent); }
h2.group { font-size:1.1rem; letter-spacing:.12em; color:var(--ink2); margin:44px 0 14px; padding-top:18px; border-top:2px solid var(--ink); }
.tiles.system { grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); }
.tiles.system .tile { padding:16px 18px 14px; box-shadow:4px 4px 0 var(--ink2); border-color:var(--ink2); }
.tiles.system .tile h2 { font-size:1.4rem; margin-bottom:4px; }
.tiles.system .tile p { margin-bottom:8px; font-size:.9rem; }
.msg.warn { color:var(--ink); border-color:var(--accent); }
table.cmp { width:100%; border-collapse:collapse; font-size:.95rem; table-layout:fixed; }
table.cmp th, table.cmp td { text-align:left; padding:8px 12px; border-bottom:1px solid var(--grid); vertical-align:top; }
table.cmp thead th { font:800 1.2rem/1.1 'Big Shoulders Display', 'Arial Narrow', Impact, sans-serif; text-transform:uppercase; border-bottom:2px solid var(--ink); }
table.cmp thead th small { display:block; font:500 .75rem/1.3 'IBM Plex Sans', system-ui, sans-serif; text-transform:none; color:var(--ink2); }
table.cmp tbody th[scope=row] { font-weight:500; color:var(--ink2); width:34%; }
table.cmp tr.grp th { font:800 1.05rem/1 'Big Shoulders Display', 'Arial Narrow', Impact, sans-serif; text-transform:uppercase; letter-spacing:.1em; background:var(--bg); border-top:2px solid var(--ink); padding-top:12px; }
table.cmp td { font-weight:600; overflow-wrap:anywhere; }
table.cmp td.ok { color:var(--ok); }
table.cmp td.bad { color:var(--bad); }
table.cmp td.warn { box-shadow:inset 4px 0 0 var(--accent); }
table.cmp tr.diff td { box-shadow:inset 4px 0 0 var(--accent); }
@media (max-width:560px) { table.cmp th, table.cmp td { padding:7px 8px; font-size:.88rem; } table.cmp tbody th[scope=row] { width:30%; } }
details.panel { margin:0 0 16px; background:var(--card); border:2px solid var(--ink); }
details.panel.top { box-shadow:5px 5px 0 var(--ink); background:transparent; border:0; box-shadow:none; }
details.panel summary { cursor:pointer; list-style:none; display:flex; align-items:baseline; gap:12px; padding:12px 14px; user-select:none; }
details.panel summary::-webkit-details-marker { display:none; }
details.panel summary::before { content:""; flex:none; width:0; height:0; border-left:8px solid var(--ink); border-top:6px solid transparent; border-bottom:6px solid transparent; transform:translateY(1px); transition:transform .12s; }
details.panel[open] > summary::before { transform:translateY(1px) rotate(90deg); }
details.panel summary:hover, details.panel summary:focus-visible { background:var(--bg); outline:none; }
details.panel summary:focus-visible { outline:3px solid var(--accent); outline-offset:-3px; }
details.panel summary h2, details.panel summary h3 { margin:0; }
details.panel summary h3 { font:800 1.15rem/1 'Big Shoulders Display', 'Arial Narrow', Impact, sans-serif; text-transform:uppercase; letter-spacing:.08em; }
details.panel summary .hint { color:var(--ink2); font-size:.85rem; }
details.panel.top > summary { padding-left:0; border-bottom:2px solid var(--ink); }
details.panel.top > details.panel { margin-top:16px; box-shadow:4px 4px 0 var(--ink); }
.foldall { color:var(--ink2); font-size:.9rem; margin:20px 0 0; }
.foldall button.link { color:var(--ink2); }
.badge { font-size:.8rem; font-weight:600; padding:2px 10px; border:2px solid; background:var(--card); }
.badge.ok { color:var(--ok); border-color:var(--ok); }
.badge.warn { color:var(--ink); border-color:var(--accent); background:var(--accent); }
.badge.bad { color:var(--bad); border-color:var(--bad); }
ul.alist { list-style:none; margin:12px 0 0; padding:0; }
ul.alist li { background:var(--card); border:2px solid var(--ink); border-left-width:8px; padding:9px 12px; margin:0 0 8px; font-weight:600; overflow-wrap:anywhere; }
ul.alist li.bad { border-left-color:var(--bad); }
ul.alist li.warn { border-left-color:var(--accent); }
ul.alist li.info { border-left-color:var(--ink2); }
ul.alist .lvl { font-size:.75rem; text-transform:uppercase; letter-spacing:.06em; color:var(--ink2); margin-right:6px; }
.none { color:var(--ink2); margin:12px 0 0; }
details.panel.alerts { margin-bottom:24px; }
details.panel.alerts > summary { border-bottom:2px solid var(--ink); }
.pgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:14px; margin-top:16px; }
a.pcard { display:flex; flex-direction:column; gap:3px; background:var(--card); color:inherit; text-decoration:none; border:2px solid var(--ink); border-top-width:8px; box-shadow:4px 4px 0 var(--ink); padding:12px 14px 14px; transition:transform .12s, box-shadow .12s; }
a.pcard:hover, a.pcard:focus-visible { transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--accent); outline:none; }
a.pcard.ok { border-top-color:var(--ok); }
a.pcard.warn { border-top-color:var(--accent); }
a.pcard.bad { border-top-color:var(--bad); }
.pstat { font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; display:flex; align-items:center; gap:6px; color:var(--ink2); }
.pstat .dot { width:10px; height:10px; border-radius:50%; background:var(--ink2); }
.pcard.ok .dot { background:var(--ok); }
.pcard.warn .dot { background:var(--accent); }
.pcard.bad .dot { background:var(--bad); }
a.pcard h3 { font:800 1.5rem/1.1 'Big Shoulders Display', 'Arial Narrow', Impact, sans-serif; text-transform:uppercase; margin:4px 0 0; }
a.pcard h3 small { font:600 .8rem/1 'IBM Plex Sans', system-ui, sans-serif; text-transform:none; color:var(--ink2); margin-left:4px; }
.phost { font-size:.85rem; color:var(--ink2); overflow-wrap:anywhere; }
.pver { font-weight:600; }
.pfacts { font-size:.9rem; color:var(--ink2); }
.pprob { font-size:.85rem; font-weight:600; color:var(--bad); margin-top:4px; }
.pcard.warn .pprob { color:var(--ink); }