:root{
  --bg:#0a1c38;
  --bg-alt:#0d2242;
  --fg:#eef2f8;
  --fg-dim:#a9bbd6;
  --accent:#8fb8ff;
  --accent-dim:#5580b8;
  --rule:rgba(255,255,255,0.16);
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:16px;
  line-height:1.5;
}
a{color:var(--accent);text-decoration:underline;}
a:hover{color:#c3dbff;}
a:focus-visible, button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

.wrap{max-width:960px;margin:0 auto;padding:0 24px 80px;}

nav.topbar{
  padding:14px 24px;
  border-bottom:1px solid var(--rule);
  font-size:14px;
}
nav.topbar a{margin-right:6px;}

header.hero{
  display:flex;
  align-items:baseline;
  gap:16px;
  flex-wrap:wrap;
  padding:36px 0 8px;
}
header.hero h1{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-weight:700;
  font-size:52px;
  margin:0;
  color:var(--fg);
}
header.hero .tagline{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  color:var(--fg-dim);
  font-size:18px;
}

.top-grid{
  display:flex;
  gap:32px;
  padding:24px 0 8px;
  flex-wrap:wrap;
}
.pages{min-width:150px;font-size:15px;}
.pages p{margin:0 0 8px;color:var(--fg-dim);}
.pages ul{list-style:none;margin:0;padding:0;}
.pages li{margin:4px 0;}
.pages li::before{content:"› ";color:var(--accent-dim);}

.art{
  flex:1;
  min-width:280px;
  display:flex;
  justify-content:center;
}
.art pre{
  font-family:"JetBrains Mono","Fira Code",ui-monospace,Menlo,Consolas,monospace;
  font-size:13px;
  line-height:1.05;
  color:var(--accent);
  margin:0;
  white-space:pre;
}

section{padding:22px 0;border-top:1px solid var(--rule);}
section:first-of-type{border-top:none;}
section h2{
  font-size:17px;
  margin:0 0 10px;
  color:var(--fg);
}
section p{margin:0 0 10px;color:var(--fg);}
section ul{margin:0;padding-left:20px;}
section li{margin:4px 0;}

.status-line{
  font-size:14px;
  letter-spacing:.02em;
  color:var(--fg-dim);
}
.status-line strong{color:var(--fg);}

pre.code{
  background:var(--bg-alt);
  border:1px solid var(--rule);
  padding:14px 16px;
  overflow-x:auto;
  font-family:"JetBrains Mono","Fira Code",ui-monospace,Menlo,Consolas,monospace;
  font-size:13px;
  color:var(--fg);
  line-height:1.5;
}
pre.code .c{color:var(--fg-dim);}

footer{
  padding:24px 0 0;
  border-top:1px solid var(--rule);
  font-size:13px;
  color:var(--fg-dim);
}

@media (max-width:600px){
  header.hero h1{font-size:40px;}
  .top-grid{flex-direction:column;}
  .art{justify-content:flex-start;}
  .art pre{font-size:11px;}
}

table.listing{width:100%;border-collapse:collapse;font-size:14px;}
table.listing th{text-align:left;padding:6px 10px;border-bottom:1px solid var(--rule);color:var(--fg-dim);font-weight:600;}
table.listing td{padding:5px 10px;border-bottom:1px solid var(--rule);}
table.listing tr:hover td{background:var(--bg-alt);}

/* Docs additions: plain tables used as definition lists, subheadings, and
   inline code inside prose. */
section h3{font-family:Georgia,'Times New Roman',serif;font-style:italic;
  font-size:18px;font-weight:400;margin:22px 0 8px;color:var(--fg);}
section table{width:100%;border-collapse:collapse;font-size:14px;margin:12px 0 4px;}
section table td{padding:7px 12px 7px 0;border-bottom:1px solid var(--rule);
  vertical-align:top;}
section table td:first-child{white-space:nowrap;width:1%;padding-right:20px;
  color:var(--fg-dim);}
section table tr:last-child td{border-bottom:none;}
section code{font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,
  Consolas,monospace;font-size:0.9em;background:var(--bg-alt);
  padding:1px 5px;border-radius:3px;}
section table td:first-child code{background:none;padding:0;}
