:root{
  --paper:#F4EFE4;
  --paper-raised:#FBF8F1;
  --ink:#2B2622;
  --ink-soft:#6B6155;
  --ink-faint:#9C9184;
  --accent:#33436B;
  --gold:#A8823F;
  --line:#DDD4C3;
  --line-strong:#C8BCA6;
  --serif:"Spectral","Noto Serif Devanagari","Iowan Old Style",Georgia,serif;
  --display:"Fraunces","Noto Serif Devanagari","Spectral",Georgia,serif;
  --util:"Karla","Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root{
    --paper:#15130E;
    --paper-raised:#1D1A14;
    --ink:#EDE4D3;
    --ink-soft:#A79C89;
    --ink-faint:#7A7161;
    --accent:#9DB1DA;
    --gold:#C9A45C;
    --line:#322D24;
    --line-strong:#4A4335;
  }
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  position:relative;
}
body::before{
  content:"";
  position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.42;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/><feColorMatrix type='saturate' values='0'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='0.12'/></svg>");
}
img{max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px; border-radius:2px}
.skip{position:absolute; left:-9999px}
.skip:focus{left:1rem; top:1rem; background:var(--paper-raised); padding:.5rem .9rem; z-index:50}

.page{position:relative; z-index:1; max-width:44rem; margin:0 auto; padding:0 1.5rem 5rem}

/* ---------- masthead ---------- */
.masthead{padding:5rem 0 2.5rem; text-align:center; display:flex; flex-direction:column; align-items:center; gap:1.05rem}
.masthead--compact{padding:2.6rem 0 2rem; gap:.75rem}
.eyebrow{
  font-family:var(--util); font-size:.7rem; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase; color:var(--ink-faint); margin:0;
}
.masthead--compact .eyebrow{font-size:.62rem}
.wordmark{
  font-family:var(--display); font-optical-sizing:auto; font-weight:400;
  font-size:clamp(2.4rem,9vw,4.1rem); line-height:1.02; letter-spacing:-.015em;
  margin:0; text-wrap:balance;
}
.masthead--compact .wordmark{font-size:clamp(1.35rem,4.5vw,1.7rem)}
.wordmark a{text-decoration:none}
.wordmark a:hover{color:var(--accent)}
.wordmark em{font-style:italic; font-weight:300; color:var(--accent)}
.orn{display:flex; align-items:center; gap:.85rem; color:var(--gold); width:min(18rem,70%)}
.orn::before,.orn::after{content:""; flex:1; height:1px; background:currentColor; opacity:.45}
.orn span{font-size:1.05rem; line-height:1}
.tagline{margin:0; max-width:31rem; color:var(--ink-soft); font-style:italic; font-size:1.02rem; text-wrap:balance}
.sig{margin:.2rem 0 0; font-family:var(--display); font-style:italic; font-size:1.3rem}

/* ---------- index ---------- */
.section-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:1rem;
  border-top:1px solid var(--line-strong); padding-top:.85rem;
}
.section-head h2,.section-head p{
  font-family:var(--util); font-size:.72rem; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--ink-faint); margin:0;
}
.entries{list-style:none; margin:0; padding:0}
.entry{
  display:grid; grid-template-columns:2.6rem 1fr auto; gap:.3rem 1rem; align-items:baseline;
  padding:1.5rem 0; border-bottom:1px solid var(--line); text-decoration:none; color:inherit;
}
.entry:hover .entry-title{color:var(--accent)}
.entry:hover .num{color:var(--gold)}
.num{
  font-family:var(--util); font-size:.78rem; font-weight:600;
  color:var(--ink-faint); font-variant-numeric:tabular-nums;
}
.entry-main{display:block}
.entry-title{
  display:block; font-family:var(--display); font-weight:400; font-size:1.5rem;
  line-height:1.2; letter-spacing:-.01em;
}
.entry-preview{display:block; margin-top:.35rem; color:var(--ink-soft); font-style:italic; font-size:1rem; line-height:1.5}
.entry-date{
  font-family:var(--util); font-size:.72rem; letter-spacing:.1em; color:var(--ink-faint);
  white-space:nowrap; text-transform:uppercase;
}
@media (max-width:34rem){
  .entry{grid-template-columns:2.2rem 1fr}
  .entry-date{grid-column:2; margin-top:.5rem}
}
.empty{text-align:center; padding:4rem 1rem; color:var(--ink-soft); font-style:italic; border-bottom:1px solid var(--line)}

/* ---------- reading view ---------- */
.back{
  display:inline-block; font-family:var(--util); font-size:.72rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint);
  text-decoration:none; margin-bottom:2.5rem;
}
.back:hover{color:var(--accent)}
.poem-kicker{
  font-family:var(--util); font-size:.7rem; font-weight:600; letter-spacing:.24em;
  text-transform:uppercase; color:var(--gold); margin:0 0 .8rem;
}
.poem-title,.page-title{
  font-family:var(--display); font-weight:400; font-size:clamp(2rem,6vw,2.9rem);
  line-height:1.1; letter-spacing:-.02em; margin:0 0 1.1rem; text-wrap:balance;
}
.poem{text-align:center}
.poem .poem-kicker{margin-bottom:.9rem}
.orn--poem{margin:0 auto 2.6rem; width:min(9rem,40%)}
.orn--poem::before,.orn--poem::after{opacity:.35}

.poem-body{
  font-size:clamp(1.16rem,2.4vw,1.3rem);
  line-height:1.95;
  max-width:36rem;
  margin:0 auto;
  overflow-wrap:break-word;
  font-weight:300;
  letter-spacing:.005em;
}
.poem-body p{margin:0 0 1.45rem}
.poem-body p:last-child{margin-bottom:0}
.poem-body p + p{
  padding-top:1.45rem;
  background-image:radial-gradient(circle, var(--line-strong) 1px, transparent 1px);
  background-repeat:no-repeat;
  background-position:center top;
  background-size:3.5px 3.5px;
}
.poem-note{
  margin:2.8rem auto 0; max-width:32rem; padding-top:1rem;
  border-top:1px solid var(--line);
  color:var(--ink-soft); font-style:italic; font-size:1rem;
}
.poem-foot{
  margin-top:3.2rem; padding-top:1.4rem; border-top:1px solid var(--line);
  display:flex; flex-direction:column; align-items:center; gap:.35rem;
}
.poem-sign{font-family:var(--display); font-style:italic; font-size:1.35rem; margin:0}
.poem-meta{font-family:var(--util); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); margin:0}
.nav-pair{display:flex; justify-content:space-between; gap:1.5rem; margin-top:2.5rem}
.nav-pair a{
  font-family:var(--util); font-size:.72rem; font-weight:600; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-faint); text-decoration:none;
}
.nav-pair a:hover{color:var(--accent)}

/* ---------- prose pages ---------- */
.prose{max-width:34rem}
.prose p{margin:0 0 1.4rem}
.prose-meta{font-size:.95rem; color:var(--ink-soft)}

.insta-pair{display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2rem}
.insta{
  display:inline-flex; flex-direction:column; gap:.15rem;
  padding:.75rem 1.4rem .8rem; border:1px solid var(--line-strong);
  text-decoration:none; color:inherit;
}
.insta:hover{border-color:var(--accent)}
.insta:hover .insta-handle{color:var(--accent)}
.insta-label{
  font-family:var(--util); font-size:.64rem; font-weight:600; letter-spacing:.22em;
  text-transform:uppercase; color:var(--ink-faint);
}
.insta-handle{font-family:var(--display); font-size:1.25rem; letter-spacing:-.01em}

/* ---------- footer ---------- */
.colophon{
  margin-top:4rem; padding-top:1.2rem; border-top:1px solid var(--line);
  font-family:var(--util); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-faint); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
}
.colophon-links{display:flex; gap:1.1rem}
.colophon a{text-decoration:none}
.colophon a:hover{color:var(--accent)}
