/* zed.wiki: brutalist. Near-black, warm off-white, hairline rules, no radius
   anywhere, Helvetica. Everything is a bordered box that shares its edge with
   the box above it. */

:root{
  --b:#0a0a0a; --c:#0a0a0a; --c2:#141414; --c3:#181818;
  --f:#e8e8e0; --m:#888; --m2:#5f5f5f;
  --e:#2a2a2a; --hd:#333;
  --a:#aadddd;          /* the only bright thing on the page */
  --red:#cc3333; --red2:#e57373; --green:#16a34a;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --sans:Helvetica,Arial,sans-serif;
  --wrap:1000px;
}
*{box-sizing:border-box;border-radius:0}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--b);color:var(--f);font-family:var(--sans);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit}
code,pre{font-family:var(--mono)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 16px}
.lab,.kicker,.eyebrow,.cap,label.f,.tag,nav.main a,.btn,.copy,.row .meta,.sweepbar{
  font-size:.75em;font-weight:600;text-transform:uppercase;letter-spacing:.08em}

/* ---------- sweep bar ---------- */
.sweepbar{position:sticky;top:0;z-index:50;background:var(--b);border-bottom:1px solid var(--e);font-size:11.5px}
.sweepbar .wrap{display:flex;align-items:center;gap:12px;height:34px;overflow:hidden}
.sweepbar .pulse{width:6px;height:6px;background:var(--red);flex:none;animation:blink 1.6s steps(1) infinite}
@keyframes blink{0%,60%{opacity:1}61%,100%{opacity:.25}}
.sweepbar .label{color:var(--m2);flex:none}
.sweepbar .victim{color:var(--red2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;font-family:var(--mono);text-transform:none;letter-spacing:0}
.sweepbar .count{margin-left:auto;color:var(--m);flex:none;font-family:var(--mono);text-transform:none;letter-spacing:0}
.sweepbar .count b{color:var(--f);font-weight:600}

/* ---------- header ---------- */
header.top{border-bottom:1px solid var(--hd);background:var(--b)}
header.top .wrap{display:flex;align-items:center;gap:20px;height:56px}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;flex:none}
.brand img{display:block;height:20px;width:auto;image-rendering:auto}
.brand .name{font-size:13px;letter-spacing:.16em;font-weight:700}
nav.main{display:flex;gap:1.35em;margin-left:auto;align-items:center}
nav.main a{color:var(--m);text-decoration:none;padding:4px 0;box-shadow:none}
nav.main a:hover{color:var(--f)}
nav.main a.on{color:var(--f);font-weight:700;box-shadow:inset 0 -2px 0 var(--f)}
nav.main a.cta{color:var(--b);background:var(--a);padding:6px 11px;font-weight:700}
nav.main a.cta:hover{background:var(--f)}
.navtoggle{display:none;margin-left:auto;background:none;border:1px solid var(--e);color:var(--m);
  padding:6px 9px;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.08em;cursor:pointer}

/* ---------- hero ---------- */
.hero{padding:56px 0 44px;border-bottom:1px solid var(--e)}
.hero h1{margin:0 0 16px;font-size:clamp(30px,5.4vw,52px);line-height:1.04;letter-spacing:-.03em;font-weight:700}
.hero h1 .z{color:var(--red2)}
.hero p.lede{margin:0 0 8px;max-width:660px;font-size:16px;color:var(--f)}
.hero p.sub{margin:0 0 26px;max-width:660px;font-size:14.5px;color:var(--m)}
.eyebrow{color:var(--red2);margin:0 0 16px;font-size:11px}
.btnrow{display:flex;gap:0;flex-wrap:wrap}
.btn{display:inline-block;font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;text-decoration:none;padding:11px 16px;border:1px solid var(--e);
  color:var(--f);background:transparent;cursor:pointer;margin:0 -1px -1px 0;transition:border-color .15s,color .15s}
.btn:hover{border-color:var(--f)}
.btn.primary{background:var(--a);color:var(--b);border-color:var(--a);font-weight:700}
.btn.primary:hover{background:var(--f);border-color:var(--f)}
.btn.danger{color:var(--red2);border-color:#3a2422}
.btn.danger:hover{border-color:var(--red)}
.btn.gold{color:var(--green);border-color:#1d3326}
.btn.gold:hover{border-color:var(--green)}
.btn[disabled]{opacity:.4;cursor:not-allowed}
.btn[disabled]:hover{border-color:var(--e)}

/* ---------- source strip ---------- */
.source{border-bottom:1px solid var(--e);background:var(--c2)}
.source .wrap{display:flex;gap:20px;align-items:stretch;padding:22px 16px}
.source .bar{width:2px;background:var(--red);flex:none}
.source .body{min-width:0}
.source .lab{color:var(--red2);margin:0 0 8px;font-size:11px}
.source p{margin:0 0 11px;color:var(--m);font-size:14px;max-width:720px}
.source p b{color:var(--f);font-weight:600}
.source .links{display:flex;gap:16px;flex-wrap:wrap;font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.source .links a{color:var(--a);text-decoration:none}
.source .links a:hover{text-decoration:underline}

/* ---------- sections ---------- */
section{padding:44px 0;border-bottom:1px solid var(--e)}
section h2{margin:0 0 8px;font-size:22px;letter-spacing:-.02em;font-weight:700}
section p.note{margin:0 0 22px;color:var(--m);max-width:680px;font-size:14.5px}
.kicker{color:var(--m2);margin:0 0 12px;font-size:11px}

.grid{display:grid;gap:0}
/* A grid track defaults to min-width:auto, so one wide <pre> pushes the whole
   page sideways however carefully the <pre> itself was told to scroll. */
.grid>*{min-width:0}
.grid.c4{grid-template-columns:repeat(4,1fr)}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c2{grid-template-columns:repeat(2,1fr);gap:22px}

.card{background:transparent;border:1px solid var(--e);padding:17px 16px;margin:0 -1px -1px 0}
.card h3{margin:0 0 7px;font-size:14px;font-weight:700}
.card p{margin:0;color:var(--m);font-size:13.5px}
.card .num{font-family:var(--mono);font-size:26px;font-variant-numeric:tabular-nums;line-height:1.1;letter-spacing:-.02em}
.card .num.red{color:var(--red2)} .card .num.gold{color:var(--green)} .card .num.live{color:var(--a)}
.card .cap{color:var(--m2);margin-top:7px;font-size:10.5px}
.card .step{color:var(--red2);margin-bottom:9px;font-size:10.5px;font-family:var(--mono)}

/* ---------- rows ---------- */
.rows{border:1px solid var(--e)}
.row{display:flex;align-items:baseline;gap:12px;padding:9px 13px;border-bottom:1px solid var(--e);font-family:var(--mono);font-size:12.5px}
.row:last-child{border-bottom:0}
.row:hover{background:var(--c2)}
.row .t{color:var(--f);text-decoration:none;flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .t:hover{color:var(--a);text-decoration:underline}
.row .t.gone{color:var(--m2);text-decoration:line-through}
.row .meta{color:var(--m2);font-size:10.5px;flex:none;font-variant-numeric:tabular-nums;font-family:var(--sans)}
.row .pos{color:var(--m2);font-size:11px;flex:none;width:40px;text-align:right;font-variant-numeric:tabular-nums}
.rows .empty{padding:22px 13px;color:var(--m2);font-family:var(--mono);font-size:12.5px;text-align:center}

.tag{font-size:9.5px;padding:1px 5px;border:1px solid var(--e);flex:none;font-family:var(--sans)}
.tag.anchor{color:var(--green);border-color:#1d3326}
.tag.zzz{color:var(--a);border-color:#243434}
.tag.doomed{color:var(--red2);border-color:#3a2422}

/* ---------- the page pane ---------- */
.paper{background:var(--c2);border:1px solid var(--e);color:var(--f);padding:26px 26px;font-size:15.5px;line-height:1.62}
.paper h1{margin:0 0 4px;font-size:26px;font-weight:700;letter-spacing:-.02em}
.paper .byline{font-family:var(--mono);font-size:11px;color:var(--m2);padding-bottom:11px;border-bottom:1px solid var(--e);margin-bottom:18px}
.paper a{color:var(--a)}
.paper h2{font-size:18px;font-weight:700;margin:24px 0 8px;border-bottom:1px solid var(--e);padding-bottom:5px}
.paper h3{font-size:15px;font-weight:700;margin:18px 0 6px}
.paper p{margin:0 0 12px}
.paper ul,.paper ol{margin:0 0 12px;padding-left:22px}
.paper li{margin:3px 0}
.paper pre{background:var(--b);border:1px solid var(--e);padding:11px 13px;overflow-x:auto;font-size:12px;line-height:1.5}
.paper code{font-size:.88em;background:var(--b);border:1px solid var(--e);padding:0 4px}
.paper pre code{background:none;border:0;padding:0}
.paper blockquote{margin:0 0 12px;padding:2px 0 2px 14px;border-left:2px solid var(--hd);color:var(--m)}
.paper hr{border:0;border-top:1px solid var(--e);margin:20px 0}
.paper .wikifoot{margin-top:24px;padding-top:11px;border-top:1px solid var(--e);font-family:var(--mono);font-size:11px;color:var(--m2)}
.paper .wikifoot a{margin-right:13px;color:var(--a)}
.paper .redlink{color:var(--red2)}

/* ---------- fate panel ---------- */
.fate{margin-top:-1px;border:1px solid var(--e)}
.fate .head{padding:10px 16px;border-bottom:1px solid var(--e);color:var(--m2);font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.fate .body{padding:16px}
.fate .big{font-family:var(--mono);font-size:28px;color:var(--red2);font-variant-numeric:tabular-nums;line-height:1.15;letter-spacing:-.02em}
.fate .big.safe{color:var(--green)}
.fate .why{color:var(--m);font-size:13px;margin:7px 0 14px;max-width:560px}
.meter{height:3px;background:var(--c3);overflow:hidden;margin:12px 0}
.meter i{display:block;height:100%;background:var(--red);transition:width .5s linear}

/* ---------- forms & panels ---------- */
.panel{border:1px solid var(--e);padding:14px 13px;margin-top:-1px;transition:border-color .15s}
.panel:focus-within{border-color:var(--m)}
label.f{display:block;color:var(--m2);margin:0 0 6px;font-size:10.5px}
input.f,textarea.f,select.f{width:100%;background:transparent;border:1px solid var(--e);color:var(--f);
  padding:10px 12px;font-family:var(--mono);font-size:13px;line-height:1.55;margin:0 0 -1px}
textarea.f{min-height:260px;resize:vertical}
input.f:focus,textarea.f:focus,select.f:focus{outline:none;border-color:var(--a)}
input.big{font-family:var(--sans);font-size:26px;letter-spacing:-.02em;border:0;padding:2px 0;font-weight:400}
input.big:focus{border:0}
.field{margin-bottom:18px}
.hint{color:var(--m2);font-size:12px;margin-top:6px;font-family:var(--mono)}
.hint b{color:var(--a);font-weight:600}
.hint.warn b{color:var(--red2)}
.msg{font-family:var(--mono);font-size:12px;padding:9px 12px;border:1px solid var(--e);margin-bottom:14px;display:none}
.msg.on{display:block}
.msg.err{color:var(--red2);border-color:#3a2422}
.msg.ok{color:var(--green);border-color:#1d3326}

/* ---------- tabs ---------- */
.tabs{display:flex;gap:1.35em;margin-bottom:.85em;border-bottom:1px solid var(--e)}
.tabs button{flex:1;padding:.55em;font-size:.75em;font-weight:600;text-transform:uppercase;letter-spacing:.08em;
  border:0;background:transparent;color:var(--m);cursor:pointer;font-family:var(--sans)}
.tabs button.on{color:var(--f);font-weight:700;box-shadow:inset 0 -2px 0 var(--f)}
.tabs button:hover:not(.on){color:var(--f)}

/* ---------- token strip ---------- */
.token{display:flex;align-items:center;gap:14px;flex-wrap:wrap;border:1px solid var(--e);padding:15px 16px}
.token .sym{font-size:14px;color:var(--green);font-weight:700;flex:none;letter-spacing:.06em}
.token .ca{font-family:var(--mono);font-size:11.5px;color:var(--m2);word-break:break-all;flex:1 1 240px;min-width:0}
.token .ca b{color:var(--m);font-weight:400}
.copy{font-size:10.5px;background:none;border:1px solid var(--e);color:var(--m);padding:6px 10px;cursor:pointer;flex:none;font-family:var(--sans)}
.copy:hover{border-color:var(--a);color:var(--a)}

pre.code{max-width:100%;background:var(--c2);border:1px solid var(--e);padding:14px 16px;overflow-x:auto;font-size:12px;line-height:1.65;color:var(--m);margin:0}
pre.code code{color:inherit}

/* ---------- footer ---------- */
footer.bot{padding:30px 0 46px;color:var(--m2);font-size:11.5px}
footer.bot .wrap{display:flex;gap:22px;flex-wrap:wrap;align-items:center}
footer.bot a{color:var(--m);text-decoration:none}
footer.bot a:hover{color:var(--a)}
footer.bot .sp{margin-left:auto}
footer.bot .credit{flex-basis:100%;color:var(--m2);line-height:1.7;padding-top:14px;margin-top:2px;border-top:1px solid var(--e)}
footer.bot .credit a{color:var(--m);text-decoration:underline}

.srcs{font-family:var(--mono);font-size:12px;color:var(--m2)}
.srcs a{color:var(--a)}
.srcs li{margin:6px 0}

/* ---------- responsive ---------- */
@media (max-width:820px){
  .source .wrap{gap:14px;padding:20px 16px}
  .grid.c4{grid-template-columns:repeat(2,1fr)}
  .grid.c3,.grid.c2{grid-template-columns:1fr}
  header.top .wrap{height:52px}
  nav.main{position:fixed;top:52px;left:0;right:0;background:var(--c2);border-bottom:1px solid var(--hd);
    flex-direction:column;align-items:stretch;gap:0;padding:0 16px 10px;display:none;z-index:60}
  nav.main.open{display:flex}
  nav.main a{padding:11px 0;border-bottom:1px solid var(--e)}
  nav.main a.on{box-shadow:none;color:var(--a)}
  nav.main a.cta{margin-top:10px;text-align:center;padding:11px}
  .navtoggle{display:block}
  .paper{padding:20px 16px;font-size:15px}
  .hero{padding:40px 0 34px}
  .sweepbar .count{display:none}
}
@media (max-width:420px){
  .wrap{padding:0 12px}
  .grid.c4{grid-template-columns:1fr}
  .row{flex-wrap:wrap;gap:7px}
  .paper{padding:16px 13px}
  .btnrow{flex-direction:column;align-items:stretch}
  .btn{text-align:center}
}