@font-face{font-family:'Great Vibes';src:url(fonts/GreatVibes.woff2) format('woff2');font-display:swap}
@font-face{font-family:'Cormorant Garamond';src:url(fonts/CormorantGaramond.woff2) format('woff2');font-weight:300 700;font-display:swap}
@font-face{font-family:'Cormorant Garamond';src:url(fonts/CormorantGaramond-Italic.woff2) format('woff2');font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:'Cinzel';src:url(fonts/Cinzel.woff2) format('woff2');font-weight:400 900;font-display:swap}
:root{--bg:#050403;--panel:#0f0c08;--gold:#d9b46a;--gold2:#f3dca2;--line:rgba(217,180,106,.28);--text:#efe6d2;--muted:#b2a385}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:'Cormorant Garamond',Georgia,serif;font-size:18px}
a{color:var(--gold2)}a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--gold2);outline-offset:3px}
.script{font-family:'Great Vibes',cursive;color:var(--gold);text-shadow:0 0 18px rgba(217,180,106,.35);font-weight:400}
h1,h2,h3{font-family:'Cinzel',Georgia,serif;color:var(--gold);letter-spacing:.04em;font-weight:500}
header.top{position:sticky;top:0;z-index:5;background:linear-gradient(#050403,rgba(5,4,3,.92));border-bottom:1px solid var(--line);padding:.6rem 1rem;display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;justify-content:space-between}
header.top .brand{font-family:'Great Vibes',cursive;font-size:1.9rem;color:var(--gold);text-decoration:none;white-space:nowrap}
nav.links a{margin-left:1rem;text-decoration:none;font-family:'Cinzel';font-size:.85rem;color:var(--gold)}
.btn{display:inline-block;border:1px solid var(--gold);color:var(--gold2);background:rgba(217,180,106,.08);padding:.45rem 1rem;border-radius:999px;font-family:'Cinzel';font-size:.85rem;text-decoration:none;cursor:pointer}
.btn:hover{background:rgba(217,180,106,.2)}
.wrap{max-width:1200px;margin:0 auto;padding:1rem}
.searchbar{display:flex;gap:.5rem;flex-wrap:wrap;margin:.5rem 0 1rem}
.searchbar input{flex:1;min-width:220px;background:#0d0a07;border:1px solid var(--line);color:var(--text);padding:.6rem .9rem;border-radius:999px;font:inherit}
.testament h2{border-bottom:1px solid var(--line);padding-bottom:.3rem}
.books{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.5rem}
.books a,.chapters a{display:block;text-align:center;padding:.6rem .4rem;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--text);background:var(--panel)}
.books a:hover,.chapters a:hover{border-color:var(--gold);color:var(--gold2)}
.chapters{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:.4rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:.7rem}
.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden;text-decoration:none;color:var(--text)}
.card img{width:100%;height:auto;aspect-ratio:1;display:block;background:#1a140c;object-fit:cover}
.card span{display:block;padding:.35rem .5rem;font-size:.9rem;color:var(--gold)}
.crumbs{color:var(--muted);margin:.3rem 0 1rem}.crumbs a{color:var(--gold)}
.result{padding:.6rem 0;border-bottom:1px solid var(--line)}.result b{color:var(--gold)}mark{background:rgba(217,180,106,.35);color:#fff}
dialog{border:1px solid var(--gold);background:#0b0906;color:var(--text);border-radius:14px;padding:1rem;max-width:min(94vw,760px);width:100%}
dialog::backdrop{background:rgba(0,0,0,.85)}
dialog img{width:100%;height:auto;border-radius:8px;background:#fff}
dialog .row{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:space-between;align-items:center;margin-top:.7rem}
.note{color:var(--muted);font-style:italic}
footer{text-align:center;color:var(--muted);padding:2rem 1rem;border-top:1px solid var(--line);margin-top:2rem}
.page{max-width:760px;margin:0 auto;padding:2rem 1rem;text-align:center}
.page .script{font-size:3.4rem;margin:.5rem 0}
/* landing */
body.landing{height:100vh;height:100dvh;overflow:hidden;display:flex;align-items:center;justify-content:center}
.cover{position:relative;width:min(100vw,100vh);width:min(100vw,100dvh);aspect-ratio:1}
.cover img{width:100%;height:100%;display:block}
.hot{position:absolute;display:block;border-radius:14px;color:transparent;overflow:hidden;white-space:nowrap}
.hot:hover,.hot:focus-visible{box-shadow:0 0 0 2px rgba(243,220,162,.7),0 0 28px rgba(217,180,106,.45)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ===== verse pages (browse.html): chapter-index look ===== */
html:has(body.verses){background:#030202}body.verses{background:transparent;color:#f4e6c8}body.verses nav.links a{white-space:nowrap;display:inline-block}
body.verses::before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 40%,rgba(3,2,2,.5),rgba(3,2,2,.2) 80%),url(swirl-bg.webp) center/cover no-repeat,#030202}
body.verses header.top{background:linear-gradient(rgba(3,2,2,.92),rgba(3,2,2,.7));backdrop-filter:blur(6px);border-bottom:1px solid rgba(232,196,128,.25)}
body.verses header.top .brand,body.verses nav.links a{color:#f1d39a}
body.verses h1.script,body.verses .script{font-family:'Great Vibes',cursive;font-weight:400;background:linear-gradient(180deg,#fff1cf 0%,#f0cf8e 45%,#b8873f 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgba(240,200,130,.35)) drop-shadow(0 3px 3px rgba(0,0,0,.8));letter-spacing:0}
body.verses h1.script{font-size:clamp(2.8rem,8vw,4.6rem)!important;text-align:center;margin:.4rem 0 .2rem!important;line-height:1.15}
body.verses h2{font-family:'Great Vibes',cursive;font-weight:400;font-size:2.3rem;color:#f0d49c;letter-spacing:0;text-shadow:0 0 16px rgba(240,200,130,.35);border-bottom:1px solid rgba(232,196,128,.22)}
body.verses .crumbs{text-align:center;color:#cdb98f;font-size:1.05rem}body.verses .crumbs a{color:#f1d39a;text-decoration:none}
body.verses .wrap>#view>p{text-align:center}
body.verses .btn{border:1px solid rgba(240,207,142,.75);color:#fff0cf;background:linear-gradient(180deg,rgba(240,207,142,.22),rgba(184,135,63,.12));box-shadow:0 0 0 1px rgba(0,0,0,.4) inset,0 0 12px rgba(240,200,130,.12);font-family:'Cinzel',serif;letter-spacing:.04em;transition:.15s}
body.verses .btn:hover,body.verses .btn:focus-visible{background:linear-gradient(180deg,rgba(240,207,142,.42),rgba(184,135,63,.25));box-shadow:0 0 16px rgba(240,200,130,.45);color:#fff}
body.verses .searchbar{justify-content:center}
body.verses .searchbar input{background:rgba(8,6,4,.72);border:1px solid rgba(240,207,142,.5);color:#fbefd6;font-size:1.1rem;backdrop-filter:blur(4px)}
body.verses .searchbar input::placeholder{color:#b9a47c}
body.verses .chapters{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:.5rem}
body.verses .chapters a,body.verses .books a{background:rgba(10,7,4,.55);border:1px solid rgba(240,207,142,.32);color:#f6e2b8;font-family:'Cormorant Garamond',serif;font-size:1.45rem;font-weight:600;border-radius:12px;text-shadow:0 0 8px rgba(240,200,130,.35);backdrop-filter:blur(3px)}
body.verses .chapters a:hover,body.verses .chapters a:focus-visible,body.verses .books a:hover{border-color:#f0cf8e;color:#fff;box-shadow:0 0 14px rgba(240,200,130,.4)}
body.verses .grid{gap:.9rem}
body.verses .card{background:rgba(10,7,4,.6);border:1px solid rgba(240,207,142,.3);border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.55);transition:.15s;backdrop-filter:blur(3px)}
body.verses .card:hover,body.verses .card:focus-visible{border-color:#f0cf8e;box-shadow:0 0 18px rgba(240,200,130,.4);transform:translateY(-2px)}
body.verses .card img{background:#120d07}
body.verses .card span{color:#f6e2b8;font-family:'Cormorant Garamond',serif;font-size:1.05rem;font-weight:600;text-align:center}
body.verses .result{border-bottom:1px solid rgba(240,207,142,.18);color:#efe2c6;font-size:1.12rem;line-height:1.5}
body.verses .result b{color:#f3d293;font-family:'Cormorant Garamond';font-weight:700}
body.verses mark{background:rgba(240,207,142,.3);color:#fff;border-radius:3px}
body.verses dialog{background:rgba(8,6,4,.94);border:1px solid rgba(240,207,142,.65);box-shadow:0 0 40px rgba(240,200,130,.25);color:#f4e6c8}
body.verses dialog::backdrop{background:rgba(2,1,1,.86) url(swirl-bg.webp) center/cover;background-blend-mode:multiply}
body.verses dialog img{background:#000}
body.verses #dtxt{color:#eadbb8;font-size:1.15rem}
body.verses .note{color:#cdb98f}
body.verses footer{color:#bba57c;border-top:1px solid rgba(240,207,142,.2)}body.verses footer a{color:#f1d39a}
@media(max-width:480px){body.verses .grid{grid-template-columns:repeat(2,1fr);gap:.6rem}body.verses .wrap{padding:.8rem}}