:root { color-scheme: dark; --ink:#06111f; --panel:#0c1b2d; --panel2:#10243a; --line:#28415e; --text:#eef5fb; --muted:#9eb2c6; --teal:#55d6c7; --gold:#ffba49; --gold2:#ffe0a0; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--text); background:radial-gradient(circle at 80% -10%,#173957 0,transparent 34rem),var(--ink); font:16px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
button,input,select { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.site-header,main,footer { width:min(1160px,calc(100% - 2rem)); margin-inline:auto; }
.site-header { display:flex; align-items:center; justify-content:space-between; min-height:5rem; border-bottom:1px solid rgba(87,121,155,.3); }
.brand { display:flex; align-items:center; gap:.8rem; color:inherit; text-decoration:none; }
.brand-mark { width:2rem; height:2rem; border:5px solid var(--teal); border-left-color:var(--gold); border-radius:50%; transform:rotate(-25deg); }
.brand small,.brand strong { display:block; }
.brand small { color:var(--gold2); font-size:.65rem; letter-spacing:.14em; text-transform:uppercase; }
.brand strong { font-family:Georgia,serif; font-size:1.15rem; font-weight:500; }
.site-header > p { color:var(--muted); font-size:.76rem; }
.hero { display:grid; grid-template-columns:1.1fr .9fr; gap:4rem; align-items:end; padding:5rem 0 3rem; }
.eyebrow { margin:0; color:var(--gold); font-size:.68rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.hero h1 { max-width:15ch; margin:.4rem 0 1rem; font:500 clamp(2.7rem,7vw,5.7rem)/.94 Georgia,serif; letter-spacing:-.04em; }
.hero > div > p:last-child { max-width:41rem; color:var(--muted); font-size:1.05rem; }
.scope { display:grid; grid-template-columns:repeat(3,1fr); overflow:hidden; border:1px solid var(--line); border-radius:1rem; background:rgba(10,26,43,.75); }
.scope span { padding:1.1rem; color:var(--muted); font-size:.7rem; border-left:1px solid var(--line); }
.scope span:first-child { border-left:0; }
.scope strong { display:block; color:var(--text); font:500 1.45rem Georgia,serif; }
.search-panel { padding:1.5rem; border:1px solid var(--line); border-radius:1.25rem; background:linear-gradient(145deg,rgba(16,36,58,.97),rgba(9,23,39,.97)); box-shadow:0 1.2rem 4rem rgba(0,0,0,.18); }
.search-heading,.results-heading { display:flex; align-items:end; justify-content:space-between; gap:1rem; }
.search-heading h2,.results-heading h2 { margin:.25rem 0 1rem; font:500 clamp(1.5rem,3vw,2.2rem) Georgia,serif; }
.text-button { color:var(--teal); border:0; background:none; cursor:pointer; }
.search-box { display:grid; grid-template-columns:auto 1fr auto; align-items:center; overflow:hidden; min-height:4rem; border:1px solid #426485; border-radius:.8rem; background:#071524; }
.search-box svg { width:1.25rem; margin-left:1rem; fill:none; stroke:var(--muted); stroke-width:1.8; }
.search-box input { width:100%; padding:1rem; color:var(--text); border:0; outline:0; background:transparent; font-size:1.05rem; }
.search-box button,.load-more { min-height:3rem; margin:.4rem; padding:.6rem 1.2rem; color:#06111f; border:0; border-radius:.6rem; background:var(--gold); font-weight:800; cursor:pointer; }
.filters { display:grid; grid-template-columns:1.3fr 1fr 1fr repeat(3,.75fr); gap:.65rem; margin-top:.85rem; }
.filters label { color:var(--muted); font-size:.66rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.filters select,.filters input { width:100%; min-height:2.5rem; margin-top:.25rem; padding:.5rem; color:var(--text); border:1px solid var(--line); border-radius:.5rem; background:var(--panel); text-transform:none; }
.results-section { padding:3rem 0 5rem; }
.results-heading p { color:var(--muted); font-size:.8rem; }
.results { display:grid; gap:.85rem; }
.catalog-tree { display:grid; gap:.75rem; }
.catalog-tree details>summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; list-style:none; }
.catalog-tree details>summary::-webkit-details-marker { display:none; }
.catalog-tree details>summary::after { content:"+"; color:var(--teal); font-size:1.1rem; }
.catalog-tree details[open]>summary::after { content:"–"; }
.catalog-tree-year { border:1px solid var(--line); border-radius:.8rem; background:rgba(13,26,44,.75); }
.catalog-tree-year>summary { padding:.9rem 1rem; }
.catalog-tree-year>summary strong { color:var(--gold2); font:500 1.35rem Georgia,serif; }
.catalog-tree summary span { margin-left:auto; color:var(--muted); font-size:.72rem; }
.tree-branches { display:grid; padding:0 .8rem .8rem 1.35rem; border-left:1px solid #36516f; }
.catalog-tree-season>summary { padding:.65rem .75rem; border-top:1px solid var(--line); }
.catalog-tree-season>summary strong { color:var(--teal); }
.catalog-tree-series { margin-left:.7rem; }
.catalog-tree-series>summary { padding:.55rem .7rem; border-top:1px solid rgba(36,59,85,.65); }
.tree-services { display:grid; margin-left:.8rem; border-left:1px solid #36516f; }
.tree-service { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.65rem .8rem; border-top:1px solid rgba(36,59,85,.55); }
.tree-service h4 { margin:0; font-size:.82rem; line-height:1.35; }
.tree-service p { margin:.15rem 0 0; color:var(--muted); font-size:.68rem; }
.tree-service>div:first-child { min-width:0; flex:1; }
.tree-actions { display:flex; flex:0 0 auto; align-items:center; gap:.45rem; }
.tree-actions button,.tree-actions a { padding:.3rem .5rem; color:var(--teal); border:1px solid #36516f; border-radius:.4rem; background:transparent; text-decoration:none; font-size:.68rem; font-weight:750; cursor:pointer; }
.tree-actions button:hover,.tree-actions a:hover { color:var(--ink); background:var(--teal); }
.result { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1.5rem; padding:1.25rem; border:1px solid var(--line); border-radius:.9rem; background:rgba(10,25,42,.78); }
.result:hover { border-color:#426485; background:var(--panel); }
.result-meta,.result-source { color:var(--muted); font-size:.72rem; }
.result h3 { margin:.25rem 0 .45rem; font:500 1.3rem Georgia,serif; }
.result h3 button { padding:0; color:var(--text); border:0; background:none; text-align:left; cursor:pointer; }
.result h3 button:hover { color:var(--gold2); }
.result blockquote { margin:.7rem 0 0; padding-left:.8rem; color:#cad8e5; border-left:2px solid var(--teal); font-family:Georgia,serif; }
mark { padding:0 .08rem; color:#091625; background:var(--gold2); border-radius:.15rem; }
.result-actions { display:grid; align-content:center; justify-items:end; gap:.5rem; min-width:9rem; }
.result-actions a,.result-actions button { padding:.55rem .75rem; color:var(--teal); border:1px solid #355776; border-radius:.5rem; background:transparent; text-decoration:none; font-size:.72rem; font-weight:750; cursor:pointer; }
.result-actions a:hover,.result-actions button:hover { color:var(--ink); background:var(--teal); }
.load-more { display:block; margin:1rem auto; }
.load-more[hidden] { display:none; }
.empty,.error { padding:3rem; color:var(--muted); border:1px dashed var(--line); border-radius:1rem; text-align:center; }
.error { color:#ffc7b9; }
.skeleton { height:10rem; border-radius:.9rem; background:linear-gradient(90deg,var(--panel),#18304a,var(--panel)); background-size:200% 100%; animation:shimmer 1.3s infinite; }
.backdrop { position:fixed; inset:0; z-index:20; background:rgba(0,5,12,.72); backdrop-filter:blur(3px); }
.drawer { position:fixed; inset:0 0 0 auto; z-index:21; width:min(760px,100%); overflow:auto; padding:1.25rem; background:#071422; box-shadow:-2rem 0 5rem rgba(0,0,0,.45); transform:translateX(102%); transition:transform .25s ease; }
.drawer.open { transform:none; }
.drawer-header { display:flex; justify-content:space-between; gap:1rem; }
.drawer-header h2 { margin:.3rem 0; font:500 clamp(1.6rem,4vw,2.5rem) Georgia,serif; }
.drawer-header p:last-child { color:var(--muted); }
.drawer-header button { align-self:start; padding:.2rem .7rem; color:var(--muted); border:1px solid var(--line); border-radius:.5rem; background:transparent; font-size:1.6rem; cursor:pointer; }
.player { position:sticky; top:0; z-index:2; overflow:hidden; aspect-ratio:16/9; margin:1rem 0; border-radius:.8rem; background:#000; }
.player iframe { width:100%; height:100%; border:0; }
.player audio { width:calc(100% - 3rem); margin:calc(28.125% - 27px) 1.5rem; accent-color:var(--gold); }
.audio-error { position:absolute; right:1rem; bottom:.4rem; left:1rem; margin:0; color:#ffc7b9; text-align:center; font-size:.72rem; }
.player-message { display:grid; place-content:center; height:100%; padding:2rem; text-align:center; color:var(--paper); background:linear-gradient(145deg,#12263b,#091521); }
.player-message p { max-width:34rem; color:#bfd0df; }
.player-message a { justify-self:center; color:#fff; }
.scripture-list { display:flex; flex-wrap:wrap; gap:.4rem; margin:.8rem 0; }
.scripture-list button { padding:.35rem .55rem; color:var(--gold2); border:1px solid #6b552b; border-radius:999px; background:#1c1c1d; font-size:.7rem; cursor:pointer; }
.transcript { display:grid; gap:.35rem; }
.passage { display:grid; grid-template-columns:4rem 1fr; gap:.7rem; padding:.75rem; color:var(--text); border:1px solid transparent; border-radius:.6rem; background:transparent; text-align:left; cursor:pointer; }
.passage:hover { border-color:var(--line); background:var(--panel); }
.passage.active { border-color:var(--teal); background:#102d35; box-shadow:inset .2rem 0 var(--teal); }
.passage span { color:var(--gold); font:700 .72rem ui-monospace,Consolas,monospace; }
.passage p { margin:0; font-family:Georgia,serif; line-height:1.6; }
footer { display:flex; justify-content:space-between; gap:2rem; padding:1.5rem 0 3rem; color:var(--muted); border-top:1px solid var(--line); font-size:.72rem; }
@keyframes shimmer { to { background-position:-200% 0; } }
@media(max-width:850px) { .hero { grid-template-columns:1fr; gap:1.5rem; padding-top:3rem; } .filters { grid-template-columns:repeat(2,1fr); } .result { grid-template-columns:1fr; } .result-actions { grid-template-columns:1fr 1fr; justify-items:stretch; } .result-actions>* { text-align:center; } }
@media(max-width:560px) { .site-header>p { display:none; } .scope { grid-template-columns:1fr; } .scope span { border-left:0; border-top:1px solid var(--line); } .scope span:first-child { border-top:0; } .filters { grid-template-columns:1fr; } .search-heading,.results-heading,footer { align-items:flex-start; flex-direction:column; } .search-box { grid-template-columns:auto 1fr; } .search-box button { grid-column:1/-1; width:calc(100% - .8rem); } .tree-service { align-items:flex-start; flex-direction:column; } }
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; animation-duration:.01ms!important; transition-duration:.01ms!important; } }