
:root{
  --bg:#F5EFE3; --paper:#FBF7EC; --wine:#8C2F1F; --ink:#3D3933;
  --soft:#5C5247; --opening:#4B3327; --mute:#9B8F7E; --ochre:#C9A87A;
}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:'Newsreader',Georgia,serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.top{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;max-width:960px;margin:0 auto}
.wordmark{font-family:'Fraunces',serif;font-size:22px;color:var(--opening)}
.wordmark .h,.hero .h{font-style:italic;font-weight:300;color:var(--wine)}
.lang{font-family:'Inter',sans-serif;font-size:11px;font-weight:600;letter-spacing:1.5px;color:var(--soft);border:1px solid rgba(61,57,51,.18);border-radius:999px;padding:6px 12px}
.hero{text-align:center;padding:52px 24px 34px;max-width:640px;margin:0 auto}
.hero h1{font-family:'Fraunces',serif;font-size:54px;font-weight:400;color:var(--opening)}
.tagline{font-family:'Fraunces',serif;font-size:21px;font-style:italic;color:var(--opening);margin-top:18px;line-height:1.4}
.sub{font-size:16px;color:var(--soft);margin-top:12px;line-height:1.55}
.btn{display:inline-block;background:var(--wine);color:#FBF7EC;font-family:'Inter',sans-serif;font-size:12.5px;font-weight:600;letter-spacing:1.4px;padding:15px 28px;border-radius:999px;margin-top:22px;box-shadow:0 8px 20px rgba(61,57,51,.16)}
.shelf{max-width:960px;margin:0 auto;padding:30px 22px 60px}
.shelf-title{font-family:'Fraunces',serif;font-size:26px;font-weight:600;color:var(--opening);margin-bottom:20px}
.shelf-title .dot{color:var(--wine)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px}
.card .cover{position:relative;border-radius:12px;overflow:hidden;box-shadow:0 10px 22px rgba(61,57,51,.14)}
.card img{width:100%;display:block;aspect-ratio:3/4;object-fit:cover}
.pill{position:absolute;top:8px;left:8px;background:var(--paper);color:var(--wine);font-family:'Inter',sans-serif;font-size:9.5px;font-weight:600;letter-spacing:1px;padding:4px 8px;border-radius:999px}
.card-title{font-family:'Newsreader',serif;font-size:14px;color:var(--soft);margin-top:9px;line-height:1.35}
.journey{max-width:640px;margin:0 auto;padding:10px 24px 60px}
.jhero{text-align:center;padding:14px 0 8px}
.jcover{width:190px;border-radius:14px;box-shadow:0 14px 30px rgba(61,57,51,.2)}
.jhero h1{font-family:'Fraunces',serif;font-size:30px;font-weight:600;color:var(--opening);margin-top:22px;line-height:1.25}
.jsub{font-family:'Newsreader',serif;font-style:italic;font-size:16px;color:var(--soft);margin-top:10px;line-height:1.5}
.jmeta{font-family:'Inter',sans-serif;font-size:11px;letter-spacing:1.4px;color:var(--mute);margin-top:12px;text-transform:uppercase}
.reading{margin-top:26px}
.reading p{font-size:18px;line-height:1.68;color:var(--ink);margin:0 0 18px}
.reading em{font-style:italic}
.translit{color:var(--wine)}
.roman{font-family:'Fraunces',serif;font-size:15px;color:var(--ochre);letter-spacing:2px;text-align:center}
.verse{background:var(--paper);border-left:3px solid var(--ochre);border-radius:0 12px 12px 0;padding:16px 18px;margin:0 0 18px}
.verse p{font-style:italic;font-size:16.5px;margin:0 0 8px;color:var(--opening)}
.verse cite{font-family:'Inter',sans-serif;font-style:normal;font-size:11px;letter-spacing:1px;color:var(--mute)}
.locked-note{font-style:italic;color:var(--soft);text-align:center;margin-top:14px}
.cta{background:var(--paper);border-radius:18px;padding:30px 26px;text-align:center;margin-top:44px;box-shadow:0 10px 24px rgba(61,57,51,.1)}
.cta h3{font-family:'Fraunces',serif;font-size:20px;font-weight:600;color:var(--opening)}
.cta p{font-size:15.5px;color:var(--soft);line-height:1.55;margin-top:10px}
.foot{text-align:center;padding:40px 24px 56px;color:var(--mute);font-size:14px}
.foot .btn{margin-top:16px}
.btn2{display:block;font-family:'Newsreader',serif;font-style:italic;font-size:15px;color:var(--wine);margin-top:16px;text-decoration:underline;text-decoration-color:rgba(140,47,31,.3);text-underline-offset:4px}
.jdesc{font-size:17px;line-height:1.62;color:var(--ink);margin:26px 0 0;text-align:center}
.chapters{margin-top:34px}
.ch-head{font-family:'Fraunces',serif;font-size:20px;font-weight:600;color:var(--opening);margin-bottom:12px}
.ch-head .dot{color:var(--wine)}
.ch-row{display:flex;align-items:center;gap:14px;background:var(--paper);border-radius:14px;padding:15px 18px;margin-bottom:9px;box-shadow:0 4px 12px rgba(61,57,51,.06)}
.ch-row.locked{opacity:.62}
.ch-roman{font-family:'Fraunces',serif;font-size:13px;color:var(--ochre);letter-spacing:1.5px;min-width:26px}
.ch-title{font-family:'Newsreader',serif;font-size:15.5px;color:var(--opening);line-height:1.35;flex:1}
.ch-go{color:var(--mute);font-size:14px}
.chap-head{text-align:center;padding:6px 0 4px}
.crumb{display:inline-block;font-family:'Inter',sans-serif;font-size:11px;letter-spacing:1.2px;color:var(--mute);text-transform:uppercase;margin-bottom:20px}
.chap-title{font-family:'Fraunces',serif;font-size:25px;font-weight:600;color:var(--opening);margin:8px 0 0;line-height:1.3}
.chap-head .jmeta{margin-top:10px}
.chap-head+.reading{margin-top:30px}
.chapnav{display:flex;justify-content:space-between;align-items:center;margin-top:38px}
.chapnav .btn{margin-top:0}
.chapnav-prev{font-family:'Newsreader',serif;font-style:italic;font-size:14.5px;color:var(--soft);text-decoration:underline;text-decoration-color:rgba(92,82,71,.3);text-underline-offset:4px}
@media(max-width:480px){.hero h1{font-size:44px}.grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px}}
