:root{
  --paper:#f3efe7;
  --ink:#211f1b;
  --soft:#777166;
  --faint:#b6aea2;
  --line:#d8d0c4;
  --warm:#9d4f36;
  --cold:#8796a1;
  --literary-rule:rgba(33,31,27,.13);
  --literary-wash:rgba(157,79,54,.07);
}

html{background:var(--paper)}
body{
  letter-spacing:.002em;
  background:
    radial-gradient(circle at 12% 8%,rgba(255,255,255,.5),transparent 29rem),
    var(--paper);
}

nav{
  justify-content:flex-start;
  gap:2.15rem;
  padding:1.15rem max(1.4rem,calc((100vw - 70rem)/2));
  background:rgba(243,239,231,.94);
  backdrop-filter:blur(10px);
  border-bottom-color:rgba(33,31,27,.08);
}
nav.scrolled{border-color:rgba(33,31,27,.16)}
nav a,nav button{
  font-size:.72rem;
  letter-spacing:.13em;
  text-transform:none;
}
nav a.on,nav button.on{border-color:var(--warm);color:var(--ink)}

body[data-jodo-view="home"] main,
body[data-jodo-view="shelf"] main,
body[data-jodo-view="feed"] main{
  max-width:72rem;
  padding-left:2rem;
  padding-right:2rem;
}
body[data-jodo-view="reader"] main,
body[data-jodo-view="colreader"] main{
  max-width:64rem;
}

/* ---------- Home: editorial front page ---------- */
body[data-jodo-view="home"] .masthead{
  min-height:72vh;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,500px);
  grid-template-rows:auto auto auto 1fr;
  column-gap:5.5rem;
  align-items:start;
  text-align:left;
  padding:7.5rem 0 6.5rem;
  margin:0;
  border-bottom:1px solid var(--literary-rule);
}
.literary-home-kicker{
  grid-column:1;
  grid-row:1;
  margin-bottom:1.25rem;
  font-family:var(--sans);
  font-size:.62rem;
  letter-spacing:.23em;
  color:var(--warm);
}
body[data-jodo-view="home"] .masthead h1{
  grid-column:1;
  grid-row:2;
  display:block;
  max-width:8ch;
  margin:0;
  font-size:clamp(3.5rem,7vw,6.8rem);
  font-weight:400;
  line-height:.98;
  letter-spacing:-.03em;
}
.masthead .literary-home-note{
  grid-column:1;
  grid-row:3;
  max-width:22rem;
  margin:2.1rem 0 0;
  font-family:var(--serif);
  font-size:1rem;
  line-height:2;
  letter-spacing:.08em;
  color:var(--soft);
}
.literary-hero-book{
  grid-column:2;
  grid-row:1 / 5;
  align-self:center;
  display:grid;
  grid-template-columns:minmax(160px,220px) minmax(0,1fr);
  gap:2.2rem;
  align-items:end;
  text-decoration:none;
}
.literary-hero-cover{
  aspect-ratio:2/3;
  overflow:hidden;
  border:1px solid rgba(33,31,27,.09);
  box-shadow:0 24px 55px rgba(33,31,27,.11);
  background:#e7dfd3;
}
.literary-hero-cover img{width:100%;height:100%;display:block;object-fit:cover}
.literary-hero-cover.is-empty{
  display:flex;
  align-items:flex-end;
  padding:1.4rem;
  font-size:1.4rem;
  line-height:1.5;
  background:linear-gradient(150deg,#ddd3c6,#efe9df 55%,#d4c9bb);
}
.literary-hero-copy{padding-bottom:.25rem}
.literary-hero-label{
  display:block;
  margin-bottom:1.25rem;
  font-family:var(--sans);
  font-size:.58rem;
  letter-spacing:.18em;
  color:var(--warm);
}
.literary-hero-copy strong{
  display:block;
  font-size:clamp(1.65rem,3vw,2.8rem);
  font-weight:400;
  letter-spacing:.08em;
  line-height:1.35;
}
.literary-hero-copy em{
  display:block;
  margin-top:.75rem;
  font-style:normal;
  font-size:.8rem;
  line-height:1.8;
  color:var(--soft);
}
.literary-hero-meta{
  display:block;
  margin-top:1.4rem;
  font-family:var(--sans);
  font-size:.62rem;
  letter-spacing:.12em;
  color:var(--faint);
}
.literary-hero-book:hover strong{color:var(--warm)}

body[data-jodo-view="home"] .homesec{margin:0}
.literary-home-intro{
  width:min(34rem,80%);
  margin:6.5rem 0 0 8%!important;
}
.literary-home-intro .introtext{
  font-size:1.05rem;
  line-height:2.25;
  letter-spacing:.025em;
}
.literary-home-books,
.literary-home-poem{padding-top:7rem;margin-top:7rem!important;border-top:1px solid var(--literary-rule)}
.literary-home-books>h3,
.literary-home-poem .secrow h3{
  font-size:.66rem!important;
  letter-spacing:.2em!important;
  color:var(--warm)!important;
}
.literary-home-poem .secrow{margin-bottom:3rem}
.literary-home-poem .homefeat{max-width:42rem!important;margin-left:auto!important;margin-right:8%!important}
.literary-home-poem .homefeat .head{text-align:left;margin-bottom:2.6rem}
.literary-home-poem .homefeat h2{font-size:1.45rem;font-weight:400;letter-spacing:.12em}
.literary-home-poem .homefeat .bd{font-size:1.02rem;line-height:2.45}

/* ---------- Bookshelf ---------- */
.literary-shelf-layout{display:flex;flex-direction:column;gap:3.6rem}
.literary-shelf-intro{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:2rem;
  padding:1rem 0 2.2rem;
  border-bottom:1px solid var(--literary-rule);
}
.literary-shelf-intro span{
  font-family:var(--sans);
  font-size:.58rem;
  letter-spacing:.22em;
  color:var(--warm);
}
.literary-shelf-intro p{
  max-width:24rem;
  text-align:right;
  font-size:.92rem;
  line-height:1.8;
  color:var(--soft);
}
.literary-book-grid,
.shelf.literary-home-shelf{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:4.5rem 2.5rem;
  align-items:start;
}
.literary-book-grid .shelfcard,
.shelf.literary-home-shelf .shelfcard{
  min-height:0;
  padding:0;
  gap:.45rem;
  border:0;
  border-radius:0;
  background:transparent;
  transition:transform .22s ease;
  text-align:left;
}
.literary-book-grid .shelfcard:hover,
.shelf.literary-home-shelf .shelfcard:hover{transform:translateY(-5px)}
.literary-book-grid .shelfcard img,
.shelf.literary-home-shelf .shelfcard img,
.literary-book-grid .bookstrip,
.shelf.literary-home-shelf .bookstrip{
  width:100%;
  height:auto;
  aspect-ratio:2/3;
  object-fit:cover;
  object-position:center;
  margin:0 0 1.15rem;
  border:1px solid rgba(33,31,27,.08);
  box-shadow:0 15px 35px rgba(33,31,27,.08);
}
.literary-book-grid .bookstrip,
.shelf.literary-home-shelf .bookstrip{
  background:linear-gradient(145deg,#d8cec1,#eee8df 58%,#cbbfb0);
}
.literary-book-grid .shelfcard .ct,
.shelf.literary-home-shelf .shelfcard .ct{
  font-size:1.13rem;
  font-weight:400;
  letter-spacing:.1em;
  line-height:1.55;
}
.literary-book-grid .shelfcard .cs,
.shelf.literary-home-shelf .shelfcard .cs{
  font-size:.76rem;
  line-height:1.75;
  color:var(--soft);
}
.literary-book-grid .shelfcard .cn,
.shelf.literary-home-shelf .shelfcard .cn{display:none}
.literary-book-meta{
  font-family:var(--sans);
  font-size:.6rem;
  letter-spacing:.1em;
  color:var(--faint);
  line-height:1.5;
}
.literary-draft-label{
  width:max-content;
  margin:.05rem 0 .2rem;
  font-family:var(--sans);
  font-size:.58rem;
  letter-spacing:.16em;
  color:var(--warm);
}
.shelfcard.is-latest .ct{color:var(--warm)}
.shelfcard.is-latest img,
.shelfcard.is-latest .bookstrip{box-shadow:0 18px 42px rgba(93,51,37,.14)}
.shelfcard.new{min-height:12rem!important;border-top:1px solid var(--literary-rule)!important;padding-top:1rem!important;box-shadow:none!important}

/* ---------- Poem archive ---------- */
body[data-jodo-view="feed"] .sect-head{margin:2.5rem 0 4rem}
body[data-jodo-view="feed"] .sect-head h2{
  font-size:clamp(2.2rem,4vw,4.1rem);
  font-weight:400;
  letter-spacing:-.01em;
}
.board.literary-poem-index{border-top:1px solid var(--literary-rule)}
.board.literary-poem-index .bh{display:none}
.board.literary-poem-index .bitem{
  padding:2.1rem 0 2.3rem;
  border-bottom:1px solid var(--literary-rule);
}
.board.literary-poem-index .brow{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:2rem;
  align-items:start;
}
.board.literary-poem-index .bnum{display:none}
.board.literary-poem-index .btitle{min-width:0}
.board.literary-poem-index .btl{
  display:inline-block;
  font-family:var(--serif);
  font-size:1.2rem;
  font-weight:400;
  letter-spacing:.09em;
  line-height:1.6;
}
.board.literary-poem-index .bdate{
  padding-top:.28rem;
  font-size:.62rem;
  letter-spacing:.1em;
  color:var(--faint);
  white-space:nowrap;
}
.board.literary-poem-index .bmore{display:none}
.literary-excerpt{
  display:block;
  max-width:36rem;
  margin:.8rem 0 0;
  font-family:var(--serif);
  font-size:.9rem;
  line-height:1.9;
  color:var(--soft);
  text-decoration:none;
  white-space:pre-line;
}
.literary-excerpt:hover{color:var(--ink)}
.literary-book-badge{
  display:block;
  width:max-content;
  max-width:100%;
  margin:.75rem 0 0!important;
  font-family:var(--sans)!important;
  font-size:.58rem!important;
  letter-spacing:.08em!important;
  color:var(--warm)!important;
  white-space:normal;
}

/* ---------- Book opening ---------- */
.cover.literary-cover{
  width:min(56rem,100%);
  min-height:72vh;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(190px,285px) minmax(0,1fr);
  grid-template-rows:auto auto auto auto 1fr;
  column-gap:5rem;
  row-gap:.9rem;
  align-content:center;
  justify-content:initial;
  text-align:left;
  padding:4rem 0 6rem;
}
.cover.literary-cover img{
  grid-column:1;
  grid-row:1 / 7;
  width:100%;
  max-width:none;
  max-height:none;
  aspect-ratio:2/3;
  object-fit:cover;
  margin:0;
  border:1px solid rgba(33,31,27,.09);
  box-shadow:0 24px 58px rgba(33,31,27,.12);
}
.cover.literary-cover .eyebrow,
.cover.literary-cover h1,
.cover.literary-cover .sub,
.cover.literary-cover .literary-cover-meta,
.cover.literary-cover .literary-preface-excerpt{grid-column:2}
.cover.literary-cover .eyebrow{
  grid-row:1;
  align-self:end;
  font-size:.6rem;
  letter-spacing:.23em;
  color:var(--warm);
}
.cover.literary-cover h1{
  grid-row:2;
  margin:.15rem 0 .2rem;
  font-size:clamp(2.4rem,5vw,4.6rem);
  font-weight:400;
  letter-spacing:.08em;
  line-height:1.18;
}
.cover.literary-cover .sub{grid-row:3;font-size:.8rem;letter-spacing:.08em;line-height:1.9;color:var(--soft)}
.cover .literary-cover-meta{grid-row:4;margin:.35rem 0 0}
.literary-preface-excerpt{
  grid-row:5;
  align-self:end;
  max-width:26rem;
  margin:2.5rem 0 0;
  padding-top:1.4rem;
  border-top:1px solid var(--literary-rule);
  font-size:.86rem;
  line-height:2;
  color:var(--soft);
  white-space:pre-line;
}

/* ---------- Contents ---------- */
.prose:has(.contents){max-width:38rem}
.prose:has(.contents) h2{text-align:left;font-size:1.45rem;font-weight:400;color:var(--ink);margin-bottom:3rem}
.contents.literary-contents{max-width:38rem;gap:0}
.contents.literary-contents li{position:relative;border-bottom:1px solid var(--literary-rule)}
.contents.literary-contents button{
  width:100%;
  display:grid;
  grid-template-columns:3.2rem minmax(0,1fr);
  gap:1rem;
  align-items:baseline;
  padding:1.05rem 0;
  border:0!important;
  text-align:left;
  color:var(--ink);
}
.contents.literary-contents button>span:first-child{
  grid-column:2;
  font-family:var(--serif);
  font-size:1rem;
  letter-spacing:.08em;
}
.contents.literary-contents button .n{
  grid-column:1;
  grid-row:1;
  font-size:.6rem;
  letter-spacing:.1em;
  color:var(--faint);
}
.contents.literary-contents button:hover>span:first-child{color:var(--warm)}
.literary-toc-excerpt{
  max-height:0;
  overflow:hidden;
  margin:0 0 0 4.2rem;
  font-size:.77rem;
  line-height:1.75;
  color:var(--soft);
  opacity:0;
  transition:max-height .22s ease,opacity .2s ease,margin-bottom .22s ease;
  white-space:pre-line;
  pointer-events:none;
}
.contents.literary-contents li:hover .literary-toc-excerpt{max-height:5rem;margin-bottom:1rem;opacity:1}

/* ---------- Reading page ---------- */
.poem.literary-poem{max-width:33rem;margin-top:4.5rem}
.poem.literary-poem .head{text-align:left;margin-bottom:3.8rem}
.poem.literary-poem h1,
.poem.literary-poem h2{font-size:1.35rem;font-weight:400;letter-spacing:.14em}
.poem.literary-poem .bd{font-size:1.06rem;line-height:2.45;letter-spacing:.015em}
.rnav.literary-reader-nav{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  justify-content:initial;
  gap:1.2rem;
  max-width:58rem;
  margin:0 auto;
  left:50%;
  right:auto;
  width:min(calc(100% - 3rem),58rem);
  transform:translateX(-50%);
  padding:1.8rem 0 1.45rem;
}
.rnav.literary-reader-nav button{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:.35rem 0;
  font-family:var(--serif);
  font-size:.78rem;
}
.rnav.literary-reader-nav .literary-reader-prev{grid-column:1;justify-self:start;text-align:left}
.rnav.literary-reader-nav .pos{grid-column:2;min-width:auto;font-size:.6rem;letter-spacing:.15em;color:var(--faint)}
.rnav.literary-reader-nav .literary-reader-next{grid-column:3;justify-self:end;text-align:right}
.rnav.literary-reader-nav .literary-reader-manage{
  position:fixed;
  left:max(1rem,calc((100vw - 70rem)/2));
  top:4.9rem;
  z-index:18;
  max-width:none;
  padding:.4rem .6rem;
  font-family:var(--sans);
  font-size:.6rem;
  letter-spacing:.1em;
  color:var(--faint);
  border:1px solid var(--line);
  background:rgba(243,239,231,.9);
}
.rnav.literary-reader-nav .literary-reader-manage:hover{color:var(--ink);border-color:var(--soft)}
.literary-swipe-hint{
  position:fixed;
  right:1rem;
  bottom:4.8rem;
  z-index:5;
  font-family:var(--sans);
  font-size:.56rem;
  letter-spacing:.1em;
  color:var(--faint);
  opacity:.72;
}

footer{margin-top:8rem;border-color:var(--literary-rule)}

@media(max-width:980px){
  .literary-book-grid,.shelf.literary-home-shelf{grid-template-columns:repeat(3,minmax(0,1fr))}
  body[data-jodo-view="home"] .masthead{column-gap:3rem}
  .literary-hero-book{grid-template-columns:minmax(130px,180px) minmax(0,1fr);gap:1.5rem}
}

@media(max-width:760px){
  nav{justify-content:center;gap:1.35rem;padding:1rem .8rem}
  body[data-jodo-view="home"] main,
  body[data-jodo-view="shelf"] main,
  body[data-jodo-view="feed"] main{padding-left:1.2rem;padding-right:1.2rem}

  body[data-jodo-view="home"] .masthead{
    min-height:0;
    grid-template-columns:1fr;
    grid-template-rows:auto;
    padding:4.5rem 0 4rem;
  }
  .literary-home-kicker,
  body[data-jodo-view="home"] .masthead h1,
  .masthead .literary-home-note,
  .literary-hero-book{grid-column:1;grid-row:auto}
  body[data-jodo-view="home"] .masthead h1{font-size:clamp(3.5rem,17vw,5.4rem)}
  .literary-hero-book{margin-top:4.5rem;grid-template-columns:minmax(125px,42vw) 1fr;gap:1.4rem;align-items:end}
  .literary-home-intro{width:88%;margin:4.5rem 0 0 6%!important}
  .literary-home-books,.literary-home-poem{padding-top:5rem;margin-top:5rem!important}
  .literary-home-poem .homefeat{margin-right:0!important;max-width:100%!important}

  .literary-book-grid,.shelf.literary-home-shelf{grid-template-columns:repeat(2,minmax(0,1fr));gap:3.2rem 1.2rem}
  .literary-shelf-intro{align-items:flex-start;flex-direction:column}
  .literary-shelf-intro p{text-align:left}

  .cover.literary-cover{
    width:min(31rem,100%);
    min-height:0;
    grid-template-columns:1fr;
    grid-template-rows:auto;
    row-gap:.8rem;
    padding:2.5rem 0 6rem;
    text-align:left;
  }
  .cover.literary-cover img,
  .cover.literary-cover .eyebrow,
  .cover.literary-cover h1,
  .cover.literary-cover .sub,
  .cover.literary-cover .literary-cover-meta,
  .cover.literary-cover .literary-preface-excerpt{grid-column:1;grid-row:auto}
  .cover.literary-cover img{width:min(72vw,280px);margin:0 auto 2.3rem}
  .cover.literary-cover h1{font-size:2.5rem}
  .literary-preface-excerpt{margin-top:2rem}

  .poem.literary-poem{max-width:calc(100vw - 2.6rem);margin-top:2.8rem}
  .rnav.literary-reader-nav{width:calc(100% - 2.2rem);gap:.8rem}
  .rnav.literary-reader-nav button{font-size:.72rem}
  .rnav.literary-reader-nav .literary-reader-manage{top:auto;bottom:5.1rem;left:1rem}
}

@media(max-width:520px){
  .board.literary-poem-index .bitem{padding:1.7rem 0}
  .board.literary-poem-index .brow{grid-template-columns:1fr!important;gap:.35rem}
  .board.literary-poem-index .bdate{grid-row:1;justify-self:end;margin-top:-1.55rem}
  .literary-excerpt{padding-right:.8rem;font-size:.86rem}
  .literary-book-badge{padding-right:1rem}

  .literary-book-grid,.shelf.literary-home-shelf{grid-template-columns:1fr 1fr;gap:3rem 1rem}
  .literary-book-grid .shelfcard .ct,.shelf.literary-home-shelf .shelfcard .ct{font-size:1rem}
  .literary-book-grid .shelfcard .cs,.shelf.literary-home-shelf .shelfcard .cs{font-size:.7rem}

  .literary-hero-book{grid-template-columns:minmax(105px,38vw) 1fr}
  .literary-hero-copy strong{font-size:1.55rem}
  .literary-hero-copy em{font-size:.72rem}

  .literary-toc-excerpt{display:none}
  .contents.literary-contents button{grid-template-columns:2.5rem minmax(0,1fr);padding:1.08rem 0}
  .prose:has(.contents) h2{font-size:1.25rem}

  .poem.literary-poem .head{margin-bottom:3rem}
  .poem.literary-poem .bd{font-size:1rem;line-height:2.38}
  .rnav.literary-reader-nav .literary-reader-prev,
  .rnav.literary-reader-nav .literary-reader-next{max-width:38vw}
}

@media(prefers-reduced-motion:reduce){
  .literary-book-grid .shelfcard,
  .shelf.literary-home-shelf .shelfcard,
  .literary-toc-excerpt{transition:none}
}