:root{
  --bg:#0e0a1f;
  --bg2:#15102b;
  --fg:#b3a8e0;
  --muted:#6f64a0;
  --accent:#ffcf87;
  --accent2:#c4b5ff;
  --line:#2a2147;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font:15px/1.65 "Courier New", ui-monospace, monospace;
}
a{ color:var(--accent); text-decoration:none }
a:hover{ text-decoration:underline; text-decoration-style:dashed }
.content{ max-width:760px; margin:0 auto; padding:24px 18px 64px }
.site-head{
  max-width:760px; margin:0 auto; padding:22px 18px 10px;
  display:flex; flex-wrap:wrap; gap:10px 18px; align-items:baseline;
  border-bottom:1px dashed var(--line);
}
.wordmark{ font-weight:bold; font-size:20px; letter-spacing:1px; color:var(--accent2) }
.wordmark:hover{ text-decoration:none; text-shadow:0 0 8px rgba(196,181,255,.4) }
.nav{ display:flex; gap:16px; flex-wrap:wrap }
.nav a{ color:var(--muted) }
.nav a:hover{ color:var(--accent) }
.section-label{ color:var(--accent2); font-size:14px; margin:26px 0 10px; font-weight:bold }
.page-title,.post-title{ color:var(--accent2); font-size:22px; margin:8px 0 16px }
.intro{ margin:18px 0 8px }
.row{ padding:4px 0 }
.tag{ color:#9d8fd6 }
.date,.post-meta{ color:var(--muted); font-size:13px }
.summary{ color:var(--fg) }
.dash{ color:var(--muted) }
.status{ text-transform:uppercase; font-size:11px; padding:1px 6px;
  border:1px solid var(--line); border-radius:3px; margin-left:6px }
.status-active{ color:#8fe0a8; border-color:#2f5a3f }
.status-wip{ color:var(--accent); border-color:#5a4a2f }
.status-archived{ color:var(--muted) }
ul.index{ list-style:none; padding:0 }
ul.index li{ padding:10px 0; border-bottom:1px dashed var(--line) }
ul.index .summary{ color:var(--muted); font-size:13px; margin-top:2px }
.post-body{ margin-top:18px }
.post-body h1,.post-body h2,.post-body h3{ color:var(--accent2) }
.post-body a{ text-decoration:underline; text-decoration-style:dashed }
.post-body img{ max-width:100%; height:auto; border:1px solid var(--line) }
.post-body pre{ background:var(--bg2); border:1px solid var(--line);
  padding:12px; overflow:auto; border-radius:4px }
.post-body code{ background:var(--bg2); padding:1px 4px; border-radius:3px }
.post-body pre code{ background:none; padding:0 }
.post-body blockquote{ border-left:3px solid var(--accent); margin:0;
  padding-left:14px; color:var(--muted) }
.post-body table{ border-collapse:collapse }
.post-body th,.post-body td{ border:1px solid var(--line); padding:4px 8px }
.gallery{ display:flex; flex-wrap:wrap; gap:10px; margin:16px 0 }
.gallery img{ max-width:100%; border:1px solid var(--line) }
.site-foot{
  max-width:760px; margin:0 auto; padding:18px; border-top:1px dashed var(--line);
  display:flex; justify-content:space-between; color:var(--muted); font-size:12px;
}
@media (max-width:520px){ .site-foot{ flex-direction:column; gap:4px } }
/* pygments codehilite — purple/amber */
.codehilite .k,.codehilite .kd,.codehilite .kn{ color:#c4b5ff }
.codehilite .s,.codehilite .s1,.codehilite .s2{ color:#8fe0a8 }
.codehilite .c,.codehilite .c1,.codehilite .cm{ color:var(--muted); font-style:italic }
.codehilite .n,.codehilite .nv{ color:var(--fg) }
.codehilite .nf,.codehilite .nc{ color:var(--accent) }
.codehilite .mi,.codehilite .mf,.codehilite .m{ color:#ffb3d9 }
.codehilite .o,.codehilite .p{ color:var(--muted) }