:root{
  --paper:#14110b; --paper-2:#1b150d; --paper-3:#221a10;
  --ink:#ebdfc1; --faded:#ab966f; --rule:#5c4a2f;
  --ox:#c8564a; --ox-2:#db695c; --seal:#8ba06c;
  color-scheme:dark;
  --display:'IM Fell English',Georgia,serif;
  --smallcaps:'IM Fell English SC',Georgia,serif;
  --body:'Crimson Text',Georgia,serif;
}
*{box-sizing:border-box;}
h1,h2,h3,h4,p,ul,ol,figure{margin:0;}
body{
  font-family:var(--body); color:var(--ink); background-color:var(--paper);
  background-image:
    radial-gradient(ellipse at 15% 0%, rgba(130,100,60,0.16), transparent 55%),
    radial-gradient(ellipse at 85% 100%, rgba(160,55,45,0.12), transparent 55%),
    radial-gradient(circle at 50% 40%, rgba(255,240,210,0.03), transparent 70%);
  line-height:1.62; font-size:18px; -webkit-font-smoothing:antialiased; margin:0;
}
.wrap{max-width:900px; margin:0 auto; padding-inline:20px;}
a{color:var(--ox);}
a:hover{color:var(--ox-2);}

/* masthead */
.topbar{border-bottom:1px solid var(--rule); background:linear-gradient(180deg,var(--paper-2),var(--paper-3));}
.topbar .wrap{max-width:1060px; display:flex; align-items:center; gap:1rem; padding-block:0.9rem; flex-wrap:wrap;}
.brandmark{display:flex; align-items:center; gap:0.7rem; text-decoration:none; color:var(--ink);}
.brandmark svg{width:40px; height:40px; display:block;}
.brandmark .wm{font-family:var(--smallcaps); text-transform:uppercase; letter-spacing:0.14em; font-size:0.95rem;}
.topnav{margin-left:auto; display:flex; gap:1.4rem; flex-wrap:wrap;}
.topnav a{font-family:var(--smallcaps); text-transform:uppercase; letter-spacing:0.1em; font-size:0.78rem; color:var(--faded); text-decoration:none;}
.topnav a:hover,.topnav a.current{color:var(--ink);}

/* breadcrumb */
.crumb{padding-top:1.6rem; font-family:var(--smallcaps); text-transform:uppercase; letter-spacing:0.08em; font-size:0.72rem; color:var(--faded);}
.crumb a{color:var(--faded); text-decoration:none;}
.crumb a:hover{color:var(--ox);}

/* entry */
.entry{padding-block:2rem 3.5rem;}
.kicker{font-family:var(--smallcaps); text-transform:uppercase; letter-spacing:0.18em; font-size:0.78rem; color:var(--ox); margin-bottom:0.8rem;}
.entry h1{font-family:var(--display); font-weight:400; font-size:clamp(2.1rem,6vw,3.4rem); line-height:1.02; margin-bottom:0.5rem; text-wrap:balance;}
.metaline{font-family:var(--display); font-style:italic; color:var(--faded); font-size:1.08rem; margin-bottom:1.6rem;}
.entry__grid{display:grid; grid-template-columns:260px 1fr; gap:2.4rem; align-items:start;}
.coverwrap{border:1px solid var(--rule); box-shadow:0 2px 0 rgba(138,117,72,0.4),0 10px 26px rgba(33,24,16,0.18);}
.coverwrap img{display:block; width:100%; height:auto; aspect-ratio:1/1; object-fit:cover;}
.lede{font-size:1.14rem; margin-bottom:1.4rem;}
.prose p{margin-bottom:1.1rem;}
.prose p:last-child{margin-bottom:0;}

/* section rules */
.subhead{display:flex; align-items:baseline; gap:1rem; margin:2.4rem 0 1rem;}
.subhead h2{font-family:var(--display); font-weight:400; font-size:1.5rem; white-space:nowrap; color:var(--ink);}
.subhead .r{flex:1; height:0; border-top:1px solid var(--rule); position:relative; top:-0.35rem;}

/* drawn-from / sources */
.tags{display:flex; flex-wrap:wrap; gap:0.5rem 0.7rem; list-style:none; padding:0;}
.tags li{font-family:var(--body); font-size:0.98rem;}
.tags a, .tags span{border:1px solid var(--rule); padding:0.2rem 0.6rem; color:var(--ink); text-decoration:none; background:rgba(255,245,220,0.03); display:inline-block;}
.tags a:hover{border-color:var(--ox); color:var(--ox);}

/* tracklist */
ol.sides{list-style:none; padding:0; columns:2; column-gap:2.6rem; max-width:42rem;}
ol.sides li{break-inside:avoid; padding-block:0.3rem; border-bottom:1px dotted var(--rule); counter-increment:side; display:flex; gap:0.7rem;}
ol.sides li::before{content:counter(side,decimal-leading-zero); font-family:var(--smallcaps); color:var(--ox); font-size:0.82rem; min-width:1.6em;}
ol.sides{counter-reset:side;}

/* preview */
details.preview{margin-top:1.2rem;}
details.preview summary{font-family:var(--smallcaps); text-transform:uppercase; letter-spacing:0.1em; font-size:0.78rem; color:var(--ox); cursor:pointer; list-style:none;}
details.preview summary::-webkit-details-marker{display:none;}
details.preview summary::before{content:'\25B8  ';}
details.preview[open] summary::before{content:'\25BE  ';}
details.preview audio{width:100%; max-width:42rem; margin-top:0.7rem;}

/* bridge */
.bridge{margin-top:2rem; border:1px solid var(--rule); background:linear-gradient(180deg,#241c12,#181108); padding:1.3rem 1.5rem; display:flex; align-items:center; gap:1.2rem; flex-wrap:wrap;}
.bridge .price{font-family:var(--display); font-size:1.5rem; color:var(--ink);}
.bridge .note{color:var(--faded); font-style:italic; flex:1; min-width:180px;}
.btn{font-family:var(--smallcaps); font-size:0.84rem; letter-spacing:0.1em; text-transform:uppercase; text-decoration:none; color:var(--paper); background:var(--ox); padding:0.6rem 1.3rem; border:1px solid var(--ox-2);}
.btn:hover{background:var(--ox-2); color:var(--paper);}

/* related + reading-room grids */
.rel-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1rem; margin-top:0.8rem;}
.rel{display:flex; gap:1rem; align-items:center; border:1px solid var(--rule); padding:0.9rem 1rem; text-decoration:none; color:var(--ink); background:rgba(255,245,220,0.03); transition:border-color .15s, background .15s;}
.rel:hover{border-color:var(--ox); background:rgba(255,245,220,0.07);}
.rel img{width:78px; height:78px; object-fit:cover; border:1px solid var(--rule); flex:none;}
.rel .meta-wrap{display:flex; flex-direction:column; justify-content:center;}
.rel .t{display:block; font-family:var(--display); font-size:1.2rem; line-height:1.12;}
.rel .m{display:block; font-family:var(--smallcaps); font-size:0.72rem; letter-spacing:0.08em; color:var(--faded); text-transform:uppercase; margin-top:0.35rem;}

footer{border-top:1px solid var(--rule); background:linear-gradient(180deg,var(--paper-2),var(--paper-3)); margin-top:2rem;}
footer .wrap{max-width:1060px; padding-block:2.2rem; text-align:center; color:var(--faded);}
footer .imprint{font-family:var(--smallcaps); letter-spacing:0.14em; color:var(--ink); text-transform:uppercase; font-size:0.9rem; margin-bottom:0.5rem;}
footer p{max-width:54ch; margin:0.3rem auto; font-size:0.9rem;}
footer a{color:var(--ox);}

.leadcopy{max-width:60ch; font-size:1.1rem; color:var(--ink); margin-bottom:1.6rem;}

@media (max-width:720px){
  .entry__grid{grid-template-columns:1fr;}
  .coverwrap{max-width:300px;}
  ol.sides{columns:1;}
  .subhead h2{white-space:normal;}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;}}