/* Verse of the day, sermon player, floating controls. Each design sets the --x-* tokens. */
[hidden]{display:none!important}

/* Keyframes: transform and opacity only */
@keyframes float-y{0%,100%{translate:0 0}50%{translate:0 -14px}}
@keyframes float-y-sm{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes drift-x{from{transform:translateX(-30vw)}to{transform:translateX(120vw)}}
@keyframes rise{0%{transform:translateY(0);opacity:0}12%{opacity:var(--o,.6)}85%{opacity:var(--o,.6)}100%{transform:translateY(-70vh);opacity:0}}
@keyframes twinkle{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse-glow{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.12)}}
@keyframes word-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes bar{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.62)}}
@keyframes swim{0%{transform:translate(0,0) rotate(-3deg)}50%{transform:translate(38px,-22px) rotate(3deg)}100%{transform:translate(0,0) rotate(-3deg)}}

/* Verse of the day */
.votd-sec{position:relative;overflow:hidden;isolation:isolate}
.votd{margin:0;position:relative;max-width:1000px}
.votd figcaption{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:.9375rem;font-weight:600;margin-bottom:24px}
.votd figcaption span:first-child{color:var(--x-accent)}
.votd figcaption span:last-child{color:var(--x-muted);font-weight:400}
.votd blockquote{margin:0;font-family:var(--x-verse-font,inherit);font-size:clamp(1.75rem,4.2vw,3.5rem);line-height:1.18;letter-spacing:-.015em;font-weight:var(--x-verse-weight,600);color:var(--x-fg)}
.votd .w{display:inline-block}
.js .votd:not(.play) .w{opacity:0}
.votd.play .w{animation:word-in 500ms cubic-bezier(.16,1,.3,1) backwards;animation-delay:calc(var(--i) * 45ms)}
.votd-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;margin-top:24px}
.votd cite{font-style:normal;font-weight:600;font-size:1.0625rem;color:var(--x-fg)}
.votd cite span{font-weight:400;color:var(--x-muted);margin-left:4px}
.x-share{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;background:transparent;border:1px solid var(--x-border-strong,var(--x-border));border-radius:var(--x-radius,999px);color:var(--x-fg);font:600 .9375rem var(--x-ui-font,inherit);cursor:pointer;transition:background-color 200ms cubic-bezier(.16,1,.3,1)}
.x-share:hover{background:var(--x-hover)}
.x-share .i{width:18px;height:18px}

/* Floating fish from the logo */
.fish{position:absolute;z-index:-1;color:var(--x-accent);opacity:.16;pointer-events:none;animation:swim 16s ease-in-out infinite}
.fish svg{display:block;width:100%;height:auto;fill:currentColor}
.fish-1{width:120px;right:6%;top:16%}
.fish-2{width:64px;right:22%;bottom:16%;animation-duration:21s;animation-delay:-6s}
.fish-3{width:44px;left:62%;top:8%;animation-duration:13s;animation-delay:-3s}

/* Sermon player */
.sc{margin-top:48px;background:var(--x-surface);border:1px solid var(--x-border);border-radius:var(--x-radius-lg,20px);overflow:hidden;color:var(--x-fg)}
.sc-top{display:grid;grid-template-columns:clamp(180px,24%,280px) 1fr;gap:32px;padding:24px}
.sc-cover{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--x-radius-sm,12px);background:var(--x-hover)}
.sc-main{display:flex;flex-direction:column;min-width:0}
.sc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.sc-tag{display:block;font-size:.9375rem;color:var(--x-accent);font-weight:600}
.sc-main h3{font-family:var(--x-title-font,inherit);font-size:clamp(1.5rem,2.6vw,2.25rem);line-height:1.15;margin:4px 0 0;color:var(--x-fg);text-transform:var(--x-title-case,none)}
.sc-play{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:none;min-width:112px;min-height:52px;padding:0 20px;border:0;border-radius:var(--x-radius,999px);background:var(--x-accent);color:var(--x-on);font:600 1.0625rem var(--x-ui-font,inherit);cursor:pointer;transition:background-color 200ms cubic-bezier(.16,1,.3,1)}
.sc-play:hover{background:var(--x-accent-hover)}
.sc-play .i{fill:currentColor;stroke:none}
.sc-wave{display:flex;align-items:center;gap:2px;height:96px;margin:auto 0;padding:16px 0;cursor:pointer}
.sc-wave i,.dock-wave i{flex:1;min-width:1px;background:var(--x-accent);opacity:.28;border-radius:2px;transform-origin:center;transition:opacity 200ms cubic-bezier(.16,1,.3,1)}
.sc-wave i.done,.dock-wave i.done{opacity:1}
.sc-wave.on i,.dock-wave.on i{animation:bar 1100ms ease-in-out infinite;animation-delay:calc(var(--i) * -120ms)}
.sc-meta{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;font-size:.9375rem;color:var(--x-muted)}
.x-soon{font-weight:600;padding:4px 12px;border:1px dashed var(--x-border-strong,var(--x-border));border-radius:999px;font-size:.875rem;white-space:nowrap}
.x-follow{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--x-accent)}
.sc-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--x-border)}
.sc-list li{display:flex;align-items:center;border-bottom:1px solid var(--x-border)}
.sc-list li:last-child{border-bottom:0}
.sc-row{flex:1;min-width:0;display:flex;align-items:center;gap:16px;min-height:64px;padding:8px 8px 8px 24px;background:transparent;border:0;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:background-color 200ms cubic-bezier(.16,1,.3,1)}
.sc-row:hover{background:var(--x-hover)}
.sc-row[aria-current=true] b{color:var(--x-accent)}
.sc-row-ic{width:40px;height:40px;flex:none;display:grid;place-items:center;border-radius:50%;border:1px solid var(--x-border-strong,var(--x-border))}
.sc-row-ic .i{width:16px;height:16px;fill:currentColor;stroke:none}
.sc-row-txt{min-width:0}
.sc-row-txt b{display:block;font-weight:600;font-size:1.0625rem;line-height:1.3}
.sc-row-txt small{display:block;color:var(--x-muted);font-size:.875rem}
.sc-yt{flex:none;width:44px;height:44px;margin-right:16px;display:grid;place-items:center;color:var(--x-muted);border-radius:50%;transition:background-color 200ms cubic-bezier(.16,1,.3,1),color 200ms cubic-bezier(.16,1,.3,1)}
.sc-yt:hover{background:var(--x-hover);color:var(--x-fg)}

/* Floating mini player */
.dock{position:fixed;z-index:45;left:50%;bottom:16px;translate:-50% 0;width:min(760px,100% - 32px);display:grid;grid-template-columns:48px minmax(0,1fr) minmax(0,1fr) 44px 44px;align-items:center;gap:12px;padding:8px 12px;background:var(--x-surface);color:var(--x-fg);border:1px solid var(--x-border);border-radius:var(--x-radius-lg,20px);box-shadow:0 16px 48px rgba(0,0,0,.28)}
.dock-cover{width:48px;height:48px;object-fit:cover;border-radius:var(--x-radius-sm,8px)}
.dock-txt{min-width:0}
.dock-txt b,.dock-txt small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dock-txt b{font-size:.9375rem;font-weight:600}
.dock-txt small{font-size:.8125rem;color:var(--x-muted)}
.dock-wave{display:flex;align-items:center;gap:2px;height:32px}
.dock-btn{width:44px;height:44px;display:grid;place-items:center;border:0;background:transparent;color:inherit;border-radius:50%;cursor:pointer;transition:background-color 200ms cubic-bezier(.16,1,.3,1)}
.dock-btn:hover{background:var(--x-hover)}
.dock-toggle{background:var(--x-accent);color:var(--x-on)}
.dock-toggle:hover{background:var(--x-accent-hover)}
.dock-toggle .i{fill:currentColor;stroke:none}
.dock-embed{display:none;grid-column:1/-1}
.dock.real{grid-template-columns:48px minmax(0,1fr) 44px}
.dock.real .dock-wave,.dock.real .dock-toggle{display:none}
.dock.real .dock-embed{display:block}
.dock-embed iframe{display:block;width:100%;border:0;border-radius:var(--x-radius-sm,8px)}

/* Floating controls */
.fl-stack{position:fixed;z-index:44;right:16px;bottom:calc(16px + var(--dock,0px));display:flex;flex-direction:column;align-items:flex-end;gap:8px;pointer-events:none;transition:bottom 300ms cubic-bezier(.16,1,.3,1)}
.fl-stack>*{pointer-events:auto}
.fl-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:44px;min-height:44px;border:1px solid var(--x-border);background:var(--x-surface);color:var(--x-fg);border-radius:999px;font:600 .9375rem var(--x-ui-font,inherit);cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.2);transition:background-color 200ms cubic-bezier(.16,1,.3,1)}
.fl-btn:hover{background:var(--x-hover)}
.fl-motion{width:44px}
.fl-stack:has(.fl-verse.shown) .fl-motion{margin-bottom:60px}
.fl-motion .i{width:16px;height:16px;fill:currentColor;stroke:none}
.fl-verse{padding:0 16px;height:52px;background:var(--x-accent);color:var(--x-on);border-color:transparent;position:absolute;right:0;bottom:0;opacity:0;visibility:hidden;translate:0 12px;transition:opacity 300ms cubic-bezier(.16,1,.3,1),translate 300ms cubic-bezier(.16,1,.3,1),visibility 300ms,background-color 200ms;white-space:nowrap}
.fl-verse:hover{background:var(--x-accent-hover)}
.fl-verse.shown{opacity:1;visibility:visible;translate:0 0}
.fl-pop{position:relative;width:min(360px,calc(100vw - 32px));padding:24px;background:var(--x-surface);color:var(--x-fg);border:1px solid var(--x-border);border-radius:var(--x-radius-lg,20px);box-shadow:0 20px 56px rgba(0,0,0,.3);max-height:70vh;overflow:auto}
.fl-close{position:absolute;right:8px;top:8px;width:44px;height:44px;display:grid;place-items:center;background:transparent;border:0;color:inherit;border-radius:50%;cursor:pointer}
.fl-close:hover{background:var(--x-hover)}
.mini-label{margin:0 44px 8px 0;font-size:.875rem;font-weight:600;color:var(--x-accent)}
.mini-text{margin:0;font-family:var(--x-verse-font,inherit);font-size:1.25rem;line-height:1.35}
.mini-ref{margin:8px 0 16px;font-weight:600;font-size:.9375rem}

/* Pausing motion */
.motion-off *:not(.w),.motion-off *:not(.w)::before,.motion-off *:not(.w)::after{animation-play-state:paused!important}

@media (max-width:760px){
  .sc-top{grid-template-columns:1fr;padding:16px;gap:16px}
  .sc-cover{aspect-ratio:16/9}
  .sc-head{flex-direction:column}
  .sc-play{width:100%}
  .sc-wave{height:72px}
  .sc-row{padding-left:16px}
  .sc-yt{margin-right:8px}
  .dock{grid-template-columns:48px minmax(0,1fr) 44px 44px}
  .dock-wave{display:none}
  .fl-verse{width:52px;padding:0}
  .fl-verse span{display:none}
  .dock-open .fl-verse{display:none}
  .dock-open .fl-stack .fl-motion{margin-bottom:0}
}
@media (prefers-reduced-motion:reduce){
  .fish,.fl{animation:none!important}
  .votd .w{opacity:1!important;animation:none!important}
  .sc-wave.on i,.dock-wave.on i{animation:none}
}

:root{--x-hi:"Kohinoor Devanagari","Devanagari Sangam MN","Noto Sans Devanagari","Kohinoor Telugu","Telugu Sangam MN","Noto Sans Telugu",system-ui,sans-serif;--x-te:"Kohinoor Telugu","Telugu Sangam MN","Noto Sans Telugu","Kohinoor Devanagari","Devanagari Sangam MN","Noto Sans Devanagari",system-ui,sans-serif}
/* Language */
:lang(hi){font-family:var(--x-hi);letter-spacing:0}
:lang(te){font-family:var(--x-te);letter-spacing:0}
html:lang(hi) body *{font-family:var(--x-hi)!important;letter-spacing:0!important}
html:lang(te) body *{font-family:var(--x-te)!important;letter-spacing:0!important}
html:lang(hi) body,html:lang(te) body{line-height:1.7}
html:lang(hi) .ticker span,html:lang(te) .ticker span{line-height:1.4}
h1:lang(hi),h1:lang(te),h2:lang(hi),h2:lang(te),h3:lang(hi),h3:lang(te),h1 :lang(hi),h1 :lang(te){line-height:1.3;overflow-wrap:anywhere;text-transform:none}
.votd blockquote:lang(hi),.votd blockquote:lang(te){font-size:clamp(1.5rem,3.4vw,2.75rem);line-height:1.45;font-weight:500}
.votd-credit{margin:12px 0 0;font-size:.8125rem;color:var(--x-muted);line-height:1.4}
.votd-credit a{color:inherit}
[data-lang-menu]{position:relative;flex:none}
.lang-btn{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 10px;background:transparent;border:1px solid var(--x-lang-line,currentColor);border-radius:var(--x-radius,999px);color:inherit;font:600 .9375rem var(--x-ui-font,sans-serif);white-space:nowrap;cursor:pointer;transition:background-color 200ms cubic-bezier(.16,1,.3,1)}
.lang-btn:hover,.lang-btn[aria-expanded=true]{background:var(--x-hover)}
.lang-chev{transition:rotate 200ms cubic-bezier(.16,1,.3,1)}
.lang-btn[aria-expanded=true] .lang-chev{rotate:180deg}
.lang-list{position:absolute;z-index:70;right:0;top:calc(100% + 8px);width:200px;padding:4px;background:var(--x-surface);color:var(--x-fg);border:1px solid var(--x-border);border-radius:var(--x-radius-sm,12px);box-shadow:0 16px 40px rgba(0,0,0,.28)}
.lang-list button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;padding:0 12px;background:transparent;border:0;border-radius:var(--x-radius-sm,8px);color:inherit;font:600 1rem var(--x-ui-font,sans-serif);text-align:left;cursor:pointer;transition:background-color 200ms cubic-bezier(.16,1,.3,1)}
.lang-list button:hover{background:var(--x-hover)}
.lang-list small{margin-left:8px;font-weight:400;font-size:.8125rem;color:var(--x-muted)}
.lang-check{visibility:hidden;color:var(--x-accent)}
.lang-list button[aria-checked=true] .lang-check{visibility:visible}
.nav-cta{display:none}

/* Prototype bar */
.proto-bar{position:fixed;z-index:60;top:0;left:0;right:0;height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 16px 0 4px;background:#111;color:#fff;font:500 14px/1 -apple-system,BlinkMacSystemFont,"Helvetica Neue",system-ui,sans-serif}
.proto-bar a{display:flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;color:#fff;font-weight:600;text-decoration:none}
.proto-bar a:hover{text-decoration:underline;text-underline-offset:4px}
.proto-bar a span{font-size:22px;line-height:1}
.proto-bar>span{color:#c7c7cc}