:root{
  --gold:#ddb36a;
  --gold-soft:#f1d79f;
  --gold-deep:#9d642f;
  --cream:#f7ebcf;
  --mist:rgba(247,235,207,0.72);
  --line:rgba(241,215,159,0.18);
  --line-strong:rgba(241,215,159,0.3);
  --panel:rgba(27,10,7,0.72);
  --panel-soft:rgba(20,8,6,0.55);
  --panel-strong:rgba(16,6,4,0.82);
  --shadow:0 24px 55px rgba(0,0,0,0.34);
  --shadow-soft:0 10px 30px rgba(0,0,0,0.2);
  --radius:26px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  min-height:100vh;
  font-family:Georgia,"Times New Roman",serif;
  color:var(--cream);
  background:
    linear-gradient(rgba(12,4,2,0.42), rgba(12,4,2,0.82)),
    url("assets/background.jpg") center top / cover no-repeat fixed;
}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit}
img{display:block;max-width:100%}
.page-wrap{min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
.container{width:min(1200px,92%);margin:0 auto}
header{
  position:sticky;top:0;z-index:20;
  background:linear-gradient(to bottom, rgba(24,8,5,0.92), rgba(24,8,5,0.55));
  backdrop-filter:blur(7px);
  border-bottom:1px solid var(--line);
}
.sub-header{position:relative}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0}
.nav-side{display:flex;align-items:center;gap:32px;flex:1;flex-wrap:wrap}
.nav-side.right{justify-content:flex-end}
.nav a{font-size:1.14rem;color:var(--cream);opacity:.95}
.nav a:hover,.nav a.active{color:var(--gold-soft)}
.logo-stack{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:240px}
.logo-mark{
  width:106px;height:106px;border-radius:999px;display:grid;place-items:center;
  color:var(--gold);font-size:3.15rem;line-height:1;
  border:1px solid rgba(221,179,106,0.3);
  background:radial-gradient(circle at 50% 45%, rgba(221,179,106,0.16), rgba(255,255,255,0.02));
  box-shadow:inset 0 0 26px rgba(221,179,106,0.12), 0 12px 30px rgba(0,0,0,0.18);
}
.brand-wordmark{letter-spacing:.22em;text-transform:uppercase;font-size:.96rem;color:var(--gold-soft)}
.hero{padding:72px 0 34px;text-align:center}
.site-title{font-size:clamp(3.3rem,7vw,6.4rem);line-height:1.02;color:var(--gold-soft);text-shadow:0 2px 20px rgba(0,0,0,0.38);letter-spacing:.08em}
.site-subtitle{margin-top:12px;font-size:clamp(1.2rem,2.6vw,2rem);color:var(--gold-soft);text-shadow:0 2px 12px rgba(0,0,0,0.28)}
.hero-copy{max-width:860px;margin:18px auto 0;font-size:1.1rem;line-height:1.9;color:var(--mist)}
.search-panel,.hero-stats,.library-shell,.content-card,.catalog-summary,.viewer-card,.notice-card{
  background:linear-gradient(to bottom, rgba(36,13,8,0.58), rgba(18,7,5,0.62));
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  border-radius:var(--radius);
}
.search-panel{width:min(940px,100%);margin:34px auto 0;padding:16px}
.search-row{display:grid;grid-template-columns:minmax(0,1.7fr) repeat(3,minmax(120px,.55fr)) auto;gap:12px}
.input,.select{
  width:100%;min-height:58px;padding:0 16px;border-radius:16px;border:1px solid rgba(241,215,159,0.14);
  background:rgba(245,238,225,0.05);color:var(--cream);outline:none;
}
.input::placeholder{color:rgba(247,235,207,0.5)}
.btn,.chip,.ghost-btn,.filter-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:52px;padding:0 20px;border-radius:16px;border:1px solid rgba(241,215,159,0.16);
  background:linear-gradient(to bottom, rgba(88,43,23,0.9), rgba(46,22,13,0.95));
  color:var(--cream);cursor:pointer;transition:transform .18s ease, filter .18s ease, border-color .18s ease;
}
.btn.primary,.filter-btn.active{background:linear-gradient(to bottom, rgba(164,102,48,0.96), rgba(96,48,21,0.98));}
.btn:hover,.chip:hover,.ghost-btn:hover,.filter-btn:hover{transform:translateY(-1px);filter:brightness(1.06)}
.ghost-btn{background:rgba(245,238,225,0.04)}
.chip-row,.stats-grid,.filter-bar,.meta-grid,.footer-links{display:flex;gap:12px;flex-wrap:wrap}
.chip-row{margin-top:22px;justify-content:center}
.chip{padding:0 18px;min-height:44px;border-radius:999px;background:rgba(56,26,17,0.78)}
.section{padding:34px 0 74px}
.section-title{font-size:clamp(2rem,4vw,3.25rem);text-align:center;color:var(--gold-soft);margin-bottom:26px;text-shadow:0 2px 12px rgba(0,0,0,0.26)}
.section-title.left{text-align:left;margin-bottom:16px}
.section-lead{max-width:820px;margin:0 auto 28px;text-align:center;line-height:1.9;color:var(--mist)}
.hero-stats{margin-top:26px;padding:18px}
.stats-grid{justify-content:center}
.stat-card{min-width:170px;flex:1;padding:18px;border-radius:18px;background:rgba(245,238,225,0.04);border:1px solid rgba(241,215,159,0.12)}
.stat-label{font-size:.92rem;text-transform:uppercase;letter-spacing:.08em;color:var(--mist)}
.stat-value{margin-top:8px;font-size:2rem;color:var(--gold-soft)}
.catalog-summary{padding:16px 18px;margin-bottom:20px;display:flex;justify-content:space-between;gap:18px;align-items:center;flex-wrap:wrap}
.library-shell{padding:18px}
.library-list{display:grid;gap:16px}
.text-row{
  display:grid;grid-template-columns:132px minmax(0,1fr) auto;gap:24px;align-items:center;
  padding:22px;border-radius:22px;background:rgba(245,238,225,0.04);border:1px solid rgba(241,215,159,0.12);
}
.book-thumb{
  width:132px;height:132px;border-radius:18px;border:1px solid rgba(241,215,159,0.16);
  background:
    linear-gradient(rgba(28,12,8,0.18), rgba(28,12,8,0.18)),
    url("assets/background.jpg") center / 240% auto no-repeat;
  box-shadow:inset 0 0 30px rgba(0,0,0,0.2);
}
.thumb-1{background-position:10% 55%}
.thumb-2{background-position:28% 56%}
.thumb-3{background-position:46% 57%}
.thumb-4{background-position:64% 58%}
.thumb-5{background-position:78% 60%}
.thumb-6{background-position:92% 61%}
.text-info h3{font-size:clamp(1.55rem,2.2vw,2.2rem);line-height:1.12;color:var(--gold-soft)}
.text-info h3 span{display:block;font-size:1rem;color:var(--mist);font-style:italic;margin-top:6px}
.text-info p{margin-top:10px;line-height:1.8;color:var(--mist)}
.text-meta{margin-top:12px;display:flex;flex-wrap:wrap;gap:10px;font-size:.98rem;color:var(--mist)}
.badge{display:inline-flex;align-items:center;min-height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--line-strong);font-size:.9rem}
.badge.published{background:rgba(73,120,59,0.24);color:#d9f0c8}
.badge.draft{background:rgba(155,109,36,0.24);color:#ffe1ad}
.badge.coming-soon{background:rgba(103,103,103,0.22);color:#ece3cf}
.text-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.88rem;color:var(--gold-soft);margin-bottom:12px}
.content-card,.viewer-card,.notice-card{padding:30px}
.content-card p,.notice-card p,.viewer-card p{line-height:1.9;color:var(--mist)}
.content-card p + p,.notice-card p + p{margin-top:12px}
.prose p + p{margin-top:16px}
.lead{font-size:1.14rem;margin-bottom:16px}
.reading-card{max-width:980px;margin:0 auto}
.split-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.85fr);gap:24px}
.viewer-frame{margin-top:18px;border-radius:20px;overflow:hidden;border:1px solid var(--line);background:rgba(0,0,0,0.16);min-height:680px}
.viewer-frame iframe{width:100%;height:680px;border:0;background:white}
.meta-grid{margin-top:18px}
.meta-item{min-width:170px;flex:1;padding:16px;border-radius:16px;background:rgba(245,238,225,0.04);border:1px solid rgba(241,215,159,0.12)}
.meta-item strong{display:block;font-size:.9rem;color:var(--mist);margin-bottom:7px;text-transform:uppercase;letter-spacing:.08em}
.kicker{color:var(--gold-soft);font-size:1rem;letter-spacing:.08em;text-transform:uppercase}
.empty-state{padding:34px;text-align:center;color:var(--mist)}
.footer{padding:22px 0;text-align:center;color:var(--mist);border-top:1px solid var(--line);background:linear-gradient(to top, rgba(18,6,4,0.9), rgba(18,6,4,0.6))}
.footer-links{justify-content:center;margin-bottom:10px}
.notice-list{display:grid;gap:14px}
.list-clean{list-style:none;padding-left:0}
.list-clean li+li{margin-top:10px}
.small{font-size:.95rem;color:var(--mist)}
@media (max-width: 1100px){
  .search-row{grid-template-columns:1fr 1fr 1fr;}
  .search-row .input{grid-column:1/-1}
  .search-row .btn{grid-column:span 3}
  .split-layout{grid-template-columns:1fr}
}
@media (max-width: 820px){
  .nav{flex-direction:column}
  .nav-side,.nav-side.right{justify-content:center}
  .logo-stack{min-width:auto}
  .text-row{grid-template-columns:1fr;}
  .book-thumb{width:100%;max-width:160px;height:160px}
  .text-actions{justify-content:flex-start}
}
@media (max-width: 640px){
  .search-row{grid-template-columns:1fr}
  .search-row .btn{grid-column:auto}
  .site-title{letter-spacing:.04em}
  .content-card,.viewer-card,.notice-card,.library-shell,.search-panel{padding:18px}
}