/* Biblioteca video (/{slug}/library): arhiva publică a organizației, în iframe pe site-ul bisericii. Același limbaj ca goPlayer „Aurora”. */
@font-face{font-family:Switzer;src:url(fonts/switzer.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Switzer;src:url(fonts/switzer-500.woff2) format('woff2');font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:Switzer;src:url(fonts/switzer-700.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url(fonts/jbmono-500.woff2) format('woff2');font-weight:400 600;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--bg:#07060B;--s2:#161320;--s3:#1F1B2B;--line:#2A2538;--text:#F2F0F7;--text2:#A9A3BC;--accent:#D7FF1E;
  --sans:Switzer,ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--mono:'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace;--r:14px;color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body.clear,body.clear html{background:transparent}
button,input{font:inherit;color:inherit}
[hidden]{display:none!important}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

#lib{display:grid;gap:22px;padding:4px 2px 8px;max-width:1400px;margin:0 auto}
.top{display:flex;align-items:center;gap:12px 16px;flex-wrap:wrap}
.top h1{margin:0;font-size:20px;font-weight:600;letter-spacing:-.02em;display:flex;align-items:center;gap:10px;flex:1 1 auto;min-width:0}
.top h1 b{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 14px var(--accent);flex:none}
body.no-head .top h1{display:none}
.find{position:relative;flex:0 1 340px;min-width:200px}
.find svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--text2);pointer-events:none}
.find input{width:100%;height:42px;padding:0 16px 0 40px;border-radius:999px;border:0;background:var(--s2);box-shadow:inset 0 0 0 1px var(--line);outline:none;transition:box-shadow .2s}
.find input::placeholder{color:var(--text2)}
.find input:focus{box-shadow:inset 0 0 0 1.5px var(--accent)}
.find input::-webkit-search-cancel-button{-webkit-appearance:none}

/* playerul înregistrării alese */
.now{display:grid;gap:12px;scroll-margin-top:12px}
.now .fr{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#000;box-shadow:0 0 0 1px rgba(255,255,255,.07),0 40px 90px -50px #000}
.now iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.now .inf{display:flex;align-items:flex-start;gap:10px 16px;flex-wrap:wrap}
.now .inf>div:first-child{flex:1 1 260px;min-width:0}
.now h2{margin:0;font-size:19px;font-weight:600;letter-spacing:-.015em;line-height:1.3}
.now p{margin:2px 0 0;color:var(--text2);font-size:14px}
.acts{display:flex;gap:8px;flex-wrap:wrap}
.btn{color:var(--text);display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:999px;border:0;background:var(--s2);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;text-decoration:none;font-size:14px;font-weight:500;transition:background .15s,box-shadow .15s}
.btn:hover{background:var(--s3)}
.btn svg{width:15px;height:15px}
.btn.acc{background:var(--accent);color:#0b0a10;box-shadow:none}
.btn.acc:hover{filter:brightness(1.08)}

/* grila */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:26px 20px}
.card{display:grid;gap:10px;align-content:start;text-align:left;padding:0;border:0;background:none;cursor:pointer;border-radius:var(--r);min-width:0}
.th{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:linear-gradient(135deg,var(--s3),var(--s2));box-shadow:0 0 0 1px rgba(255,255,255,.06);transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.th img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.2,.8,.2,1),filter .3s}
.th .ph{position:absolute;inset:0;display:grid;place-items:center;font-size:44px;font-weight:700;color:rgba(255,255,255,.12);letter-spacing:-.04em}
.th .du{position:absolute;right:8px;bottom:8px;padding:2px 7px;border-radius:7px;background:rgba(7,6,11,.82);font-size:12px;backdrop-filter:blur(6px)}
.th .tg{position:absolute;left:8px;top:8px;padding:2px 9px;border-radius:999px;background:var(--accent);color:#0b0a10;font-size:11.5px;font-weight:600}
.th .pl{position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:var(--accent);color:#0b0a10;display:grid;place-items:center;opacity:0;transform:scale(.8);transition:opacity .2s,transform .25s cubic-bezier(.2,.8,.2,1);box-shadow:0 10px 30px -8px rgba(0,0,0,.7)}
.th .pl svg{width:20px;height:20px;margin-left:3px}
.card:hover .th,.card:focus-visible .th{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 24px 40px -24px #000}
.card:hover .th img{transform:scale(1.04);filter:brightness(.8)}
.card:hover .pl,.card:focus-visible .pl{opacity:1;transform:none}
.card.on .th{box-shadow:0 0 0 2px var(--accent)}
.card.on .pl{opacity:1;transform:none}
.card h3{margin:0;font-size:15.5px;font-weight:600;line-height:1.35;letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card p{margin:-6px 0 0;color:var(--text2);font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card:focus-visible{outline-offset:6px}

.more{justify-self:center}
.empty{padding:56px 16px;text-align:center;color:var(--text2);border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--line)}
.empty b{display:block;color:var(--text);font-size:17px;font-weight:600;margin-bottom:4px}
.sk .th{animation:pulse 1.4s ease-in-out infinite}
.sk h3,.sk p{height:14px;border-radius:6px;background:var(--s2);animation:pulse 1.4s ease-in-out infinite}
.sk p{width:60%}
@keyframes pulse{50%{opacity:.55}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media (max-width:560px){.grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:22px 14px}.find{flex:1 1 100%}}