:root{
  --paper:#f4fbfa; --ink:#0e2a2b; --muted:#4d7273;
  --turq:#2ec4b6; --turq-dark:#149086; --turq-wash:#dff6f3;
  --dots:#9ad8d1; --card:#ffffff;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'SF Mono',ui-monospace,Menlo,Consolas,'Courier New',monospace;background:var(--paper);color:var(--ink);line-height:1.65;font-size:15px;-webkit-font-smoothing:antialiased}
.wrap{max-width:680px;margin:0 auto;padding:0 24px}
nav{padding:36px 0;display:flex;gap:8px;flex-wrap:wrap}
nav a{color:var(--turq-dark);text-decoration:none;padding:4px 10px;border:1.5px dashed var(--dots);border-radius:6px}
nav a.active{background:var(--turq-wash);border-style:solid;border-color:var(--turq)}
nav a:hover{background:var(--turq-wash)}
.prompt{color:var(--turq-dark)}
h1{font-size:26px;padding:24px 0 4px;font-weight:600}
.cursor{display:inline-block;width:10px;height:22px;background:var(--turq);animation:blink 1.1s steps(1) infinite;vertical-align:-3px}
@keyframes blink{50%{opacity:0}}
.bio{padding:18px 0}
.bio p,.prose p{margin-bottom:14px}
a{color:var(--turq-dark)}
.bio a,.prose a{color:var(--turq-dark);text-decoration:underline;text-decoration-style:wavy;text-decoration-color:var(--turq)}
.hl{background:linear-gradient(transparent 55%,var(--turq-wash) 55%)}
.comment{color:var(--muted)}
.cta{margin:20px 0 8px}
.cta a{display:inline-block;background:var(--turq);color:#fff;text-decoration:none;padding:9px 16px;border-radius:8px;margin:0 10px 10px 0;box-shadow:3px 3px 0 var(--turq-dark)}
.cta a.alt{background:var(--paper);color:var(--turq-dark);border:1.5px solid var(--turq);box-shadow:3px 3px 0 var(--dots)}
.cta a:hover{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--turq-dark)}
section{padding:40px 0 0}
h2{font-size:15px;color:var(--turq-dark);margin-bottom:16px}
h2::before{content:"## "}
.proj{border:1.5px solid var(--dots);border-radius:10px;padding:14px 16px;margin-bottom:12px;background:var(--card)}
.proj:hover{border-color:var(--turq);box-shadow:4px 4px 0 var(--turq-wash)}
.proj h3{font-size:15px}
.proj h3 a{color:var(--ink);text-decoration:none}
.proj h3 a::after{content:" ↗";color:var(--turq)}
.proj p{color:var(--muted);font-size:14px;margin-top:4px}
.proj p a{color:var(--turq-dark)}
.badge{font-size:11px;background:var(--turq-wash);color:var(--turq-dark);padding:2px 8px;border-radius:5px;margin-left:6px;white-space:nowrap}
ul.writing{list-style:none}
ul.writing li{padding:10px 0;border-bottom:1.5px dashed var(--dots)}
ul.writing li::before{content:"→ ";color:var(--turq)}
ul.writing a{color:var(--ink);text-decoration:none}
ul.writing a:hover{color:var(--turq-dark)}
ul.writing time{color:var(--muted);font-size:12px;margin-left:8px}
ul.writing .desc{display:block;color:var(--muted);font-size:13px;padding-left:22px}
.portrait{float:right;width:180px;margin:6px 0 12px 20px;border-radius:12px;border:1.5px solid var(--dots)}
.morelink{display:inline-block;margin-top:6px;color:var(--turq-dark)}
footer{padding:56px 0 44px;color:var(--muted);font-size:13px}
footer a{color:var(--turq-dark);text-decoration:none}
footer a:hover{text-decoration:underline}
.prose{padding:8px 0 20px;font-size:15px}
.prose h2{margin-top:28px}
.post-meta{color:var(--muted);font-size:13px;margin-bottom:20px}
.vibes-img{max-width:100%;border-radius:12px;border:1.5px solid var(--dots);margin:10px 0}
@media(max-width:560px){.portrait{float:none;display:block;margin:10px auto;width:70%}}
