/* The MCP Census — terminal/phosphor design system (v2) */
:root{
  --void:#080B09; --panel:#0E140F; --grid:#16241A;
  --phosphor:#4DF08A; --phosphor-dim:#2C7A4A;
  --ink:#CDE9D6; --dim:#6C8C77; --amber:#F2B34A; --danger:#FF6159;
  --font-mono:"JetBrains Mono",ui-monospace,"SF Mono","Cascadia Code",Menlo,Consolas,monospace;
  --font-sans:"Inter",-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
}
*{box-sizing:border-box;margin:0}
html{color-scheme:dark}
body{
  background:var(--void); color:var(--ink);
  font-family:var(--font-sans); font-size:16px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
/* fixed dot-grid + scanline atmosphere */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:radial-gradient(var(--grid) 1px, transparent 1px);
  background-size:26px 26px; opacity:.5;
}
body::after{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:repeating-linear-gradient(0deg, transparent 0 3px, rgba(0,0,0,.16) 3px 4px);
  opacity:.35; mix-blend-mode:multiply;
}
main{position:relative; z-index:1; max-width:820px; margin:0 auto; padding:28px 20px 100px}
.wide{max-width:1080px}

/* type */
h1,h2,h3{font-family:var(--font-mono); font-weight:700; letter-spacing:.02em}
h1{font-size:40px; line-height:1.14}
h2{font-size:22px; line-height:1.3; margin:0 0 14px; text-transform:uppercase; letter-spacing:.06em}
h3{font-size:15px}
a{color:var(--phosphor); text-decoration:none; border-bottom:1px solid var(--phosphor-dim)}
a:hover{text-shadow:0 0 8px var(--phosphor); border-bottom-color:var(--phosphor)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--phosphor); outline-offset:2px; box-shadow:0 0 10px color-mix(in srgb,var(--phosphor) 50%,transparent)}
.mono{font-family:var(--font-mono); font-variant-numeric:tabular-nums}
code{font-family:var(--font-mono); font-size:.9em; background:var(--panel); border:1px solid var(--grid); padding:1px 6px; border-radius:2px; color:var(--phosphor)}
pre{background:var(--panel); border:1px solid var(--grid); border-radius:2px; padding:14px 16px; overflow-x:auto; font-family:var(--font-mono); font-size:13px; line-height:1.55; margin:12px 0; color:var(--ink)}
pre code{background:none;border:0;padding:0;color:var(--ink)}
pre .cmt{color:var(--dim)}
pre .grn{color:var(--phosphor)}

/* terminal bits */
.label{font-family:var(--font-mono); font-size:12px; letter-spacing:.14em; color:var(--dim); text-transform:uppercase}
.prompt{font-family:var(--font-mono); font-size:12px; letter-spacing:.12em; color:var(--phosphor); text-transform:uppercase; margin-bottom:10px}
.prompt::before{content:"$ "; color:var(--phosphor-dim)}
.cursor{display:inline-block; width:.6em; height:1.05em; background:var(--phosphor); margin-left:4px; vertical-align:-2px; box-shadow:0 0 10px var(--phosphor); animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.cursor{animation:none}}
.glow{text-shadow:0 0 14px color-mix(in srgb,var(--phosphor) 60%,transparent)}

/* hero stream */
.hero{position:relative; padding:8px 0 4px; overflow:hidden}
#stream{position:absolute; inset:0; z-index:0; width:100%; height:100%; opacity:.10; pointer-events:none}
.hero > *{position:relative; z-index:1}

/* panels / layout */
section{border-top:1px solid var(--grid); padding:40px 0; margin-top:24px}
.panel{border:1px solid var(--grid); border-radius:2px; background:var(--panel); padding:18px 20px}
.leader{display:flex; justify-content:space-between; gap:16px; border-bottom:1px dotted var(--grid); padding:7px 0; font-size:14px}
.leader .k{color:var(--dim); font-family:var(--font-mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase}
.leader .v{font-family:var(--font-mono); text-align:right}

/* counters */
.counters{display:flex; flex-wrap:wrap; gap:14px; margin:28px 0}
.counter{flex:1 1 150px; border:1px solid var(--grid); border-radius:2px; padding:16px; background:var(--panel)}
.counter .v{font-family:var(--font-mono); font-size:30px; font-weight:700; line-height:1; color:var(--phosphor)}
.counter .l{font-size:11px; color:var(--dim); margin-top:8px; font-family:var(--font-mono); letter-spacing:.08em; text-transform:uppercase}

/* buttons */
.btn{display:inline-block; font-family:var(--font-mono); font-weight:700; font-size:15px; letter-spacing:.04em;
  background:var(--phosphor); color:var(--void); padding:12px 22px; border:1px solid var(--phosphor); border-radius:2px; cursor:pointer; text-decoration:none}
.btn:hover{box-shadow:0 0 18px color-mix(in srgb,var(--phosphor) 55%,transparent); border-bottom-color:var(--phosphor)}
.btn.ghost{background:transparent; color:var(--phosphor)}
.btn.ghost:hover{background:color-mix(in srgb,var(--phosphor) 12%,transparent)}

/* verdict badges */
.verdict{display:inline-block; font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; padding:3px 10px; border-radius:2px; border:1px solid; white-space:nowrap}
.v-healthy{color:var(--phosphor); border-color:var(--phosphor); box-shadow:inset 0 0 12px color-mix(in srgb,var(--phosphor) 18%,transparent)}
.v-issues{color:var(--amber); border-color:var(--amber)}
.v-unknown{color:var(--dim); border-color:var(--dim)}
.v-gone{color:var(--danger); border-color:var(--danger)}

/* tables */
table{border-collapse:collapse; width:100%; font-size:13px; font-family:var(--font-mono)}
th,td{text-align:left; padding:7px 10px; border-bottom:1px solid var(--grid)}
th{color:var(--dim); font-weight:400; font-size:11px; letter-spacing:.08em; text-transform:uppercase}
td.num{text-align:right}
.tbl summary{cursor:pointer; color:var(--dim); font-size:13px; margin:8px 0; font-family:var(--font-mono)}
.chartwrap{overflow-x:auto; margin:16px 0}

/* svg chart bars use phosphor via fill="var(--phosphor)" */

.nav{font-size:13px; margin-top:10px; font-family:var(--font-mono)}
.nav a{margin-right:14px}
.notice{border-left:2px solid var(--phosphor); background:var(--panel); padding:14px 18px; margin:22px 0; font-size:15px}
.foot{border-top:1px solid var(--grid); margin-top:44px; padding-top:22px; font-size:13px; color:var(--dim); font-family:var(--font-mono)}
.foot a{font-size:13px}
@media (max-width:640px){h1{font-size:30px}}
