/* Vaishnava Songs section — Nandgram Dham */

:root {
  --sg-dark: #0F4D4A;
  --sg-dark-soft: #1f5053;
  --sg-cream: #FEFAEC;
  --sg-cream-2: #FAEAB1;
  --sg-bg: #FAF8F0;
  --sg-ink: #1a1a1a;
  --sg-muted: #6b6255;
  --sg-line: #e6ddc8;
  --sg-accent: #8c7247;
  --sg-radius: 14px;
  --sg-shadow: 0 1px 2px rgba(15, 77, 74, .05), 0 8px 24px rgba(15, 77, 74, .06);
  --sg-lyric-size: 1.0625rem;
}

.song-body {
  background: linear-gradient(180deg, var(--sg-cream) 0%, var(--sg-bg) 380px);
  color: var(--sg-ink);
}

.song-page {
  font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  padding-bottom: 7rem;
}

.song-shell {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.15rem;
}

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0;
  margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ---------- breadcrumbs ---------- */
.song-crumbs { padding: 1.15rem 0 .35rem; font-size: .8125rem; }
.song-crumbs ol { display: flex; flex-wrap: wrap; gap: .3rem .55rem; list-style: none; margin: 0; padding: 0; }
.song-crumbs li { display: flex; align-items: center; gap: .55rem; color: var(--sg-muted); }
.song-crumbs li + li::before { content: "/"; color: #c4bba6; }
.song-crumbs a { color: var(--sg-muted); text-decoration: none; }
.song-crumbs a:hover { color: var(--sg-dark); text-decoration: underline; }
.song-crumbs [aria-current] { color: var(--sg-dark); font-weight: 600; }

/* ---------- hero ---------- */
.song-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .75rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase;
  color: var(--sg-accent);
}
.song-eyebrow > span { width: 26px; height: 1px; background: var(--sg-accent); display: inline-block; }

.song-hero { padding: 2.25rem 0 1.25rem; text-align: center; }
.song-hero h1 {
  font-size: clamp(1.85rem, 5.2vw, 3rem); line-height: 1.1; margin: .7rem 0 .6rem;
  font-weight: 800; color: var(--sg-dark); letter-spacing: -.02em;
}
.song-hero h1 em { font-style: italic; color: var(--sg-accent); }
.song-hero-sub {
  max-width: 46rem; margin: 0 auto; color: var(--sg-muted);
  font-size: clamp(.95rem, 2.4vw, 1.075rem); line-height: 1.65;
}

.song-stats {
  display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem;
  list-style: none; padding: 0; margin: 1.5rem 0 1.25rem;
}
.song-stats li {
  background: #fff; border: 1px solid var(--sg-line); border-radius: var(--sg-radius);
  padding: .6rem 1.05rem; min-width: 6.5rem; box-shadow: var(--sg-shadow);
}
.song-stats strong { display: block; font-size: 1.3rem; font-weight: 800; color: var(--sg-dark); line-height: 1.15; }
.song-stats span { font-size: .72rem; text-transform: uppercase; letter-spacing: .07em; color: var(--sg-muted); }
.song-stats-wide { justify-content: flex-start; }

.song-hero-links { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; }

.song-button {
  display: inline-flex; align-items: center; gap: .5rem; text-decoration: none;
  background: var(--sg-dark); color: #fff; font-weight: 600; font-size: .9rem;
  padding: .72rem 1.35rem; border-radius: 999px; border: 1px solid var(--sg-dark);
  transition: transform .15s ease, background .15s ease;
}
.song-button:hover { background: #0b3d3a; transform: translateY(-1px); color: #fff; }
.song-button-ghost { background: #fff; color: var(--sg-dark); }
.song-button-ghost:hover { background: var(--sg-cream-2); color: var(--sg-dark); }

/* ---------- search ---------- */
.song-search-form { position: relative; display: flex; align-items: center; gap: .5rem; }
.song-search-hero { max-width: 40rem; margin: 1.45rem auto .25rem; }
.song-search-inline { margin: .35rem 0 1.15rem; max-width: 36rem; }
.song-search-form > i {
  position: absolute; left: 1.05rem; color: var(--sg-muted); font-size: .9rem; pointer-events: none;
}
.song-search-form input[type="search"] {
  flex: 1; width: 100%; border: 1px solid var(--sg-line); background: #fff;
  border-radius: 999px; padding: .8rem 1rem .8rem 2.5rem; font-size: .95rem; color: var(--sg-ink);
  box-shadow: var(--sg-shadow); outline: none; min-width: 0;
}
.song-search-form input[type="search"]:focus { border-color: var(--sg-dark); box-shadow: 0 0 0 3px rgba(15, 77, 74, .12); }
.song-search-form button {
  border: 0; background: var(--sg-dark); color: #fff; font-weight: 600; font-size: .875rem;
  padding: .8rem 1.3rem; border-radius: 999px; cursor: pointer; white-space: nowrap;
}
.song-search-form button:hover { background: #0b3d3a; }

.song-suggest {
  position: absolute; top: calc(100% + .4rem); left: 0; right: 0; z-index: 60;
  background: #fff; border: 1px solid var(--sg-line); border-radius: 12px;
  box-shadow: 0 12px 34px rgba(15, 77, 74, .14); overflow: hidden; text-align: left;
}
.song-suggest a {
  display: flex; align-items: baseline; gap: .55rem; padding: .62rem .9rem;
  text-decoration: none; color: var(--sg-ink); font-size: .9rem; border-bottom: 1px solid #f2ecdd;
}
.song-suggest a:last-child { border-bottom: 0; }
.song-suggest a:hover, .song-suggest a.is-active { background: var(--sg-cream); }
.song-suggest .sg-s-title { font-weight: 600; }
.song-suggest .sg-s-author { font-size: .76rem; color: var(--sg-muted); margin-left: auto; }
.song-suggest .sg-s-audio { font-size: .7rem; color: var(--sg-accent); }
.song-suggest-empty { padding: .8rem .9rem; font-size: .85rem; color: var(--sg-muted); }

/* ---------- sections ---------- */
.song-section { margin: 2.4rem 0; }
.song-section-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 1rem;
  margin-bottom: 1rem; border-bottom: 1px solid var(--sg-line); padding-bottom: .55rem;
}
.song-section-head h2 { font-size: clamp(1.1rem, 3vw, 1.4rem); font-weight: 700; color: var(--sg-dark); margin: 0; }
.song-section-head a { font-size: .82rem; color: var(--sg-accent); text-decoration: none; white-space: nowrap; }
.song-section-head a:hover { text-decoration: underline; }

/* ---------- cards ---------- */
.song-grid {
  display: grid; gap: .85rem;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr));
}
.song-card {
  display: flex; flex-direction: column; justify-content: space-between;
  background: #fff; border: 1px solid var(--sg-line); border-radius: var(--sg-radius);
  padding: .9rem 1rem .7rem; box-shadow: var(--sg-shadow);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.song-card:hover { transform: translateY(-2px); border-color: #d9cdb0; box-shadow: 0 10px 26px rgba(15, 77, 74, .1); }
.song-card-link { text-decoration: none; color: inherit; display: block; }
.song-card-title { font-family: 'Inter', sans-serif;font-size: .98rem; font-weight: 700; color: var(--sg-dark); margin: 0 0 .3rem; line-height: 1.3; }
.song-card-incipit {
  font-size: .82rem; color: var(--sg-muted); margin: 0; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.song-card-foot {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  margin-top: .7rem; padding-top: .55rem; border-top: 1px solid #f4efe2;
}
.song-card-author { font-size: .74rem; color: var(--sg-accent); text-decoration: none; }
.song-card-author:hover { text-decoration: underline; }
.song-card-badges { display: flex; align-items: center; gap: .38rem; }
.song-badge {
  display: inline-flex; align-items: center; gap: .22rem;
  font-size: .7rem; color: var(--sg-muted); background: var(--sg-bg);
  border: 1px solid var(--sg-line); border-radius: 999px; padding: .15rem .45rem;
}
.song-badge-btn { cursor: pointer; }
.song-badge-btn[aria-pressed="true"] { color: #fff; background: var(--sg-dark); border-color: var(--sg-dark); }

/* ---------- category / book / author grids ---------- */
.song-cat-grid { display: grid; gap: .7rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 190px), 1fr)); }
.song-cat {
  display: flex; flex-direction: column; gap: .18rem; text-decoration: none;
  background: #fff; border: 1px solid var(--sg-line); border-radius: 12px; padding: .8rem .9rem;
  box-shadow: var(--sg-shadow); transition: background .15s ease, transform .15s ease;
}
.song-cat:hover { background: var(--sg-cream-2); transform: translateY(-2px); }
.song-cat-title { font-weight: 650; font-size: .9rem; color: var(--sg-dark); }
.song-cat-count { font-size: .73rem; color: var(--sg-muted); }

.song-book-grid { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }
.song-book {
  text-decoration: none; background: #fff; border: 1px solid var(--sg-line);
  border-radius: var(--sg-radius); padding: 1rem; box-shadow: var(--sg-shadow);
  display: flex; flex-direction: column; gap: .25rem; transition: transform .15s ease;
}
.song-book:hover { transform: translateY(-2px); border-color: #d9cdb0; }
.song-book h3 { margin: 0; font-size: 1rem; font-weight: 700; color: var(--sg-dark); }
.song-book-author { font-size: .78rem; color: var(--sg-accent); }
.song-book-count { font-size: .73rem; color: var(--sg-muted); margin-top: auto; }

.song-author-grid { display: flex; flex-wrap: wrap; gap: .5rem; }
.song-author-chip {
  display: inline-flex; align-items: center; gap: .45rem; text-decoration: none;
  background: #fff; border: 1px solid var(--sg-line); border-radius: 999px;
  padding: .45rem .9rem; font-size: .85rem; color: var(--sg-dark); box-shadow: var(--sg-shadow);
}
.song-author-chip:hover { background: var(--sg-cream-2); }
.song-author-chip span {
  font-size: .7rem; color: var(--sg-muted); background: var(--sg-bg);
  border-radius: 999px; padding: .05rem .4rem;
}

.song-hub-grid { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
.song-hub-card {
  text-decoration: none; background: #fff; border: 1px solid var(--sg-line);
  border-radius: var(--sg-radius); padding: 1rem; box-shadow: var(--sg-shadow);
  display: flex; flex-direction: column; gap: .3rem; transition: transform .15s ease;
}
.song-hub-card:hover { transform: translateY(-2px); border-color: #d9cdb0; }
.song-hub-card h2 { margin: 0; font-size: 1rem; font-weight: 700; color: var(--sg-dark); }
.song-hub-card p { margin: 0; font-size: .8rem; color: var(--sg-muted); line-height: 1.5; }
.song-hub-count { margin-top: auto; font-size: .73rem; color: var(--sg-accent); font-weight: 600; }

/* ---------- alphabetical ---------- */
.song-alpha { display: flex; flex-wrap: wrap; gap: .35rem; }
.song-alpha a, .song-alpha span {
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
  min-width: 2.5rem; padding: .35rem .4rem; border-radius: 9px; font-weight: 700; font-size: .85rem;
  text-decoration: none; background: #fff; border: 1px solid var(--sg-line); color: var(--sg-dark);
}
.song-alpha a:hover, .song-alpha a.is-active { background: var(--sg-dark); color: #fff; border-color: var(--sg-dark); }
.song-alpha a span { font-size: .62rem; font-weight: 500; color: var(--sg-muted); background: none; border: 0; padding: 0; }
.song-alpha a:hover span, .song-alpha a.is-active span { color: rgba(255, 255, 255, .8); }
.song-alpha .is-empty { opacity: .35; }
.song-alpha-inline { margin-bottom: 1rem; }

/* ---------- listing head / filters ---------- */
.song-list-head { padding: 1rem 0 .5rem; }
.song-list-head h1 {
  font-size: clamp(1.5rem, 4.2vw, 2.25rem); font-weight: 800; color: var(--sg-dark);
  margin: .5rem 0 .5rem; line-height: 1.18; letter-spacing: -.015em;
}
.song-list-intro { color: var(--sg-muted); font-size: .95rem; line-height: 1.65; max-width: 52rem; }
.song-list-intro p { margin: 0 0 .5rem; }
.song-list-intro a { color: var(--sg-accent); }
.song-list-count { font-size: .8rem; color: var(--sg-muted); margin: .6rem 0 0; }
.song-list-count span { color: #a89c85; }

.song-filter-bar { display: flex; flex-wrap: wrap; gap: 1rem 1.6rem; margin: .3rem 0 1.2rem; }
.song-filter-group { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.song-reader-label {
  font-size: .68rem; text-transform: uppercase; letter-spacing: .08em;
  color: var(--sg-muted); font-weight: 600; margin-right: .15rem;
}
.song-chip {
  display: inline-flex; align-items: center; gap: .35rem; cursor: pointer;
  background: #fff; border: 1px solid var(--sg-line); color: var(--sg-dark);
  border-radius: 999px; padding: .38rem .85rem; font-size: .82rem; font-weight: 550;
  text-decoration: none; transition: background .14s ease, color .14s ease;
}
.song-chip:hover { background: var(--sg-cream-2); }
.song-chip.is-active { background: var(--sg-dark); color: #fff; border-color: var(--sg-dark); }

/* ---------- table of contents ---------- */
.song-toc {
  background: #fff; border: 1px solid var(--sg-line); border-radius: var(--sg-radius);
  padding: 1rem 1.1rem; margin: 0 0 1.4rem; box-shadow: var(--sg-shadow);
}
.song-toc h2 { margin: 0 0 .6rem; font-size: .95rem; color: var(--sg-dark); font-weight: 700; }
.song-toc ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .2rem;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.song-toc a {
  display: flex; align-items: baseline; gap: .5rem; text-decoration: none;
  padding: .38rem .5rem; border-radius: 8px; color: var(--sg-ink); font-size: .85rem;
}
.song-toc a:hover { background: var(--sg-cream); }
.song-toc li.is-current a { background: var(--sg-cream-2); font-weight: 650; }
.song-toc-title { color: var(--sg-dark); font-weight: 600; }
.song-toc-en { color: var(--sg-muted); font-size: .78rem; }
.song-toc-count { margin-left: auto; font-size: .7rem; color: var(--sg-muted); }

/* ---------- pagination ---------- */
.song-paging { display: flex; align-items: center; justify-content: center; gap: .6rem; margin: 2rem 0 .5rem; flex-wrap: wrap; }
.song-page-btn {
  text-decoration: none; background: #fff; border: 1px solid var(--sg-line); color: var(--sg-dark);
  border-radius: 999px; padding: .5rem 1rem; font-size: .85rem; font-weight: 600;
}
.song-page-btn:hover { background: var(--sg-cream-2); }
.song-page-nums { display: flex; align-items: center; gap: .25rem; }
.song-page-nums a, .song-page-nums b {
  min-width: 2.1rem; text-align: center; padding: .4rem .5rem; border-radius: 8px;
  font-size: .85rem; text-decoration: none; color: var(--sg-dark); border: 1px solid transparent;
}
.song-page-nums a:hover { background: #fff; border-color: var(--sg-line); }
.song-page-nums b { background: var(--sg-dark); color: #fff; }
.song-page-nums i { color: var(--sg-muted); font-style: normal; }

.song-empty, .song-empty-page { text-align: center; padding: 2.5rem 1rem; }
.song-empty p, .song-empty-page p { color: var(--sg-muted); margin-bottom: 1rem; }
.song-empty-page h1 { font-size: 1.6rem; color: var(--sg-dark); font-weight: 800; margin-bottom: .6rem; }
.song-empty-page .song-search-form { max-width: 32rem; margin: 0 auto 1.2rem; }

/* ===================== SONG PAGE ===================== */
.song-article {
  background: #fff; border: 1px solid var(--sg-line); border-radius: 18px;
  padding: clamp(1.15rem, 3.5vw, 2.25rem); box-shadow: var(--sg-shadow); margin-top: .35rem;
}
.song-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.song-head-main { flex: 1 1 20rem; min-width: 0; }
.song-head h1 {
  font-size: clamp(1.6rem, 4.8vw, 2.4rem); font-weight: 800; color: var(--sg-dark);
  margin: 0 0 .3rem; line-height: 1.15; letter-spacing: -.015em;
}
.song-official { margin: 0 0 .25rem; font-size: 1rem; color: var(--sg-accent); font-weight: 600; }
.song-subtitle { margin: 0 0 .3rem; font-size: .95rem; color: var(--sg-muted); font-style: italic; }
.song-subtitle-en { font-style: normal; }

.song-meta {
  list-style: none; display: flex; flex-wrap: wrap; gap: .35rem 1.1rem;
  margin: .75rem 0 0; padding: 0; font-size: .84rem; color: var(--sg-muted);
}
.song-meta li { display: inline-flex; align-items: center; gap: .4rem; }
.song-meta i { color: var(--sg-accent); font-size: .82rem; }
.song-meta a { color: var(--sg-dark); text-decoration: none; font-weight: 600; }
.song-meta a:hover { text-decoration: underline; }
.song-tip {
  display: inline-flex; align-items: center; justify-content: center; cursor: help;
  width: 1rem; height: 1rem; border-radius: 50%; background: var(--sg-bg);
  border: 1px solid var(--sg-line); font-size: .62rem; color: var(--sg-muted);
}

.song-head-actions { display: flex; gap: .4rem; flex-wrap: wrap; }
.song-icon-btn {
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
  width: 2.4rem; height: 2.4rem; border-radius: 10px; background: var(--sg-bg);
  border: 1px solid var(--sg-line); color: var(--sg-dark); font-size: .9rem;
  transition: background .14s ease, color .14s ease;
}
.song-icon-btn:hover { background: var(--sg-cream-2); }
.song-icon-btn[aria-pressed="true"] { background: var(--sg-dark); color: #fff; border-color: var(--sg-dark); }
.song-icon-sm { width: auto; min-width: 2.4rem; padding: 0 .6rem; font-size: .8rem; font-weight: 700; }

.song-tags { display: flex; flex-wrap: wrap; gap: .35rem; margin: 1rem 0 0; }
.song-tag {
  font-size: .74rem; text-decoration: none; color: var(--sg-accent);
  background: var(--sg-cream); border: 1px solid var(--sg-line);
  border-radius: 999px; padding: .22rem .7rem;
}
.song-tag:hover { background: var(--sg-cream-2); }

/* ---------- audio card ---------- */
.song-player-card {
  margin: 1.5rem 0 0; background: linear-gradient(180deg, var(--sg-cream) 0%, #fff 100%);
  border: 1px solid var(--sg-line); border-radius: var(--sg-radius); padding: 1rem 1.1rem;
}
.song-player-top { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .6rem; }
.song-player-top h2 { margin: 0; font-size: .98rem; font-weight: 700; color: var(--sg-dark); display: flex; align-items: center; gap: .45rem; }
.song-player-top h2 i { color: var(--sg-accent); }
.song-player-count { font-size: .74rem; color: var(--sg-muted); }
.song-track-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; }
.song-track {
  display: flex; align-items: center; gap: .7rem; background: #fff;
  border: 1px solid var(--sg-line); border-radius: 10px; padding: .45rem .6rem;
}
.song-track.is-playing { border-color: var(--sg-dark); background: var(--sg-cream); }
.song-track-play {
  flex: 0 0 auto; width: 2.1rem; height: 2.1rem; border-radius: 50%; cursor: pointer;
  background: var(--sg-dark); color: #fff; border: 0; display: inline-flex;
  align-items: center; justify-content: center; font-size: .72rem;
}
.song-track-play:hover { background: #0b3d3a; }
.song-track-info { flex: 1 1 auto; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .6rem; }
.song-track-singer { font-size: .87rem; font-weight: 600; color: var(--sg-ink); }
.song-track-more { font-size: .72rem; color: var(--sg-accent); text-decoration: none; }
.song-track-more:hover { text-decoration: underline; }
.song-track-dl { flex: 0 0 auto; color: var(--sg-muted); font-size: .8rem; padding: .3rem; }
.song-track-dl:hover { color: var(--sg-dark); }
.song-audio-credit { margin: .7rem 0 0; font-size: .72rem; color: var(--sg-muted); }
.song-audio-credit a { color: var(--sg-accent); }

/* ---------- reader bar ---------- */
.song-reader-bar {
  display: flex; flex-wrap: wrap; gap: .85rem 1.5rem; align-items: center;
  margin: 1.6rem 0 1rem; padding: .8rem 0; border-top: 1px solid var(--sg-line);
  border-bottom: 1px solid var(--sg-line);
}
.song-reader-group { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; }

/* ---------- verses ---------- */
.song-verses { --sg-scale: 1; }
.song-verse { display: flex; gap: .9rem; padding: 1.05rem 0; border-bottom: 1px dashed #eee6d4; }
.song-verse:last-child { border-bottom: 0; }
.song-verse-no { flex: 0 0 2.1rem; display: flex; flex-direction: column; align-items: center; gap: .3rem; }
.song-verse-no a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.9rem; height: 1.9rem; border-radius: 50%; text-decoration: none;
  background: var(--sg-cream-2); color: var(--sg-dark); font-size: .78rem; font-weight: 700;
}
.song-verse-no a:hover { background: var(--sg-dark); color: #fff; }
.song-refrain-badge {
  font-size: .56rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--sg-accent); text-align: center; line-height: 1.1;
}
.song-verse-body { flex: 1 1 auto; min-width: 0; }
.song-block + .song-block { margin-top: .7rem; }
.song-block-label {
  display: block; font-size: .64rem; text-transform: uppercase; letter-spacing: .09em;
  color: var(--sg-accent); font-weight: 700; margin-bottom: .25rem;
}
.song-block-lyrics {
  font-size: calc(var(--sg-lyric-size) * var(--sg-scale)); line-height: 1.85;
  color: var(--sg-dark); font-weight: 550;
}
.song-line { display: block; }
.song-line-indent { padding-left: 2.2rem; }
.song-block-translation p {
  margin: 0 0 .5rem; font-size: calc(.95rem * var(--sg-scale)); line-height: 1.72; color: #33302a;
}
.song-block-translation p:last-child { margin-bottom: 0; }
.song-syn-wrap { font-size: calc(.83rem * var(--sg-scale)); line-height: 1.9; color: var(--sg-muted); }
.song-syn b { color: var(--sg-dark); font-weight: 650; }
.song-syn i { font-style: normal; }
.song-syn-sep { color: #c9bfa8; margin: 0 .1rem; }

.song-verses[data-show-lyrics="0"] .song-block-lyrics { display: none; }
.song-verses[data-show-synonyms="0"] .song-block-synonyms { display: none; }
.song-verses[data-show-translation="0"] .song-block-translation { display: none; }

/* ---------- extras on song page ---------- */
.song-appears, .song-faq { margin-top: 1.8rem; padding-top: 1.2rem; border-top: 1px solid var(--sg-line); }
.song-appears h2, .song-faq h2, .song-related h2 {
  font-size: 1.05rem; font-weight: 700; color: var(--sg-dark); margin: 0 0 .7rem;
}
.song-appears ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; }
.song-appears a { color: var(--sg-dark); text-decoration: none; font-size: .87rem; font-weight: 600; }
.song-appears a:hover { text-decoration: underline; }
.song-appears-chap { color: var(--sg-muted); font-weight: 400; }

.song-faq details {
  border: 1px solid var(--sg-line); border-radius: 10px; padding: .6rem .85rem;
  margin-bottom: .45rem; background: var(--sg-bg);
}
.song-faq summary { cursor: pointer; font-weight: 650; font-size: .9rem; color: var(--sg-dark); }
.song-faq p { margin: .55rem 0 0; font-size: .87rem; line-height: 1.65; color: #3a362e; }

.song-pager { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1.8rem; padding-top: 1.2rem; border-top: 1px solid var(--sg-line); }
.song-pager-link {
  display: flex; flex-direction: column; gap: .15rem; text-decoration: none; max-width: 48%;
}
.song-pager-next { text-align: right; margin-left: auto; }
.song-pager-link span { font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; color: var(--sg-muted); }
.song-pager-link strong { font-size: .9rem; color: var(--sg-dark); font-weight: 650; }
.song-pager-link:hover strong { text-decoration: underline; }

.song-related { margin-top: 2.2rem; }

/* ---------- prose (about page) ---------- */
.song-prose { max-width: 46rem; }
.song-prose h2 { font-size: 1.2rem; color: var(--sg-dark); font-weight: 700; margin: 1.9rem 0 .6rem; }
.song-prose p, .song-prose li { font-size: .95rem; line-height: 1.75; color: #35312a; }
.song-prose p { margin: 0 0 .9rem; }
.song-prose ul { padding-left: 1.15rem; margin: 0 0 1rem; }
.song-prose li { margin-bottom: .45rem; }
.song-prose a { color: var(--sg-accent); }
.song-lead { font-size: 1.05rem !important; color: var(--sg-dark) !important; font-weight: 550; }

/* ===================== PERSISTENT PLAYER ===================== */
.song-player {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 120;
  background: rgba(255, 255, 255, .97); backdrop-filter: blur(10px);
  border-top: 1px solid var(--sg-line); box-shadow: 0 -6px 24px rgba(15, 77, 74, .1);
  padding-bottom: env(safe-area-inset-bottom);
}
.song-player-inner {
  max-width: 1120px; margin: 0 auto; padding: .55rem 1rem;
  display: flex; align-items: center; gap: .55rem;
}
.song-player-btn {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
  width: 2.2rem; height: 2.2rem; border-radius: 50%; border: 1px solid var(--sg-line);
  background: #fff; color: var(--sg-dark); font-size: .8rem;
}
.song-player-btn:hover { background: var(--sg-cream-2); }
.song-player-main { width: 2.7rem; height: 2.7rem; background: var(--sg-dark); color: #fff; border-color: var(--sg-dark); font-size: .95rem; }
.song-player-main:hover { background: #0b3d3a; }
.song-player-sm { width: auto; min-width: 2.2rem; padding: 0 .5rem; border-radius: 999px; font-size: .72rem; font-weight: 700; }
.song-player-sm[aria-pressed="true"] { background: var(--sg-dark); color: #fff; border-color: var(--sg-dark); }
.song-player-meta { flex: 1 1 8rem; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.song-player-meta strong {
  font-size: .84rem; color: var(--sg-dark); font-weight: 700;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.song-player-meta span { font-size: .72rem; color: var(--sg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.song-player-seek { flex: 2 1 12rem; display: flex; align-items: center; gap: .5rem; font-size: .7rem; color: var(--sg-muted); }
.song-player-seek input[type="range"] { flex: 1 1 auto; accent-color: var(--sg-dark); min-width: 0; }
.song-player-tools { flex: 0 0 auto; display: flex; align-items: center; gap: .3rem; }

@media (max-width: 720px) {
  .song-player-seek { order: 5; flex: 1 1 100%; }
  .song-player-inner { flex-wrap: wrap; padding: .5rem .75rem .55rem; }
  .song-player-meta { flex: 1 1 6rem; }
}

/* the site has a mobile bottom nav; lift the player above it */
@media (max-width: 1023px) {
  .song-player { bottom: 62px; }
  .song-page { padding-bottom: 10rem; }
}

/* ---------- toast ---------- */
.song-toast {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: 6.5rem; z-index: 200;
  background: var(--sg-dark); color: #fff; font-size: .85rem; font-weight: 600;
  padding: .6rem 1.1rem; border-radius: 999px; box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
  opacity: 0; pointer-events: none; transition: opacity .2s ease, transform .2s ease;
}
.song-toast.is-visible { opacity: 1; transform: translateX(-50%) translateY(-.35rem); }

/* ---------- night reading mode (opt-in via the reader bar) ---------- */
.song-body[data-song-theme="night"] {
  --sg-cream: #171a14;
  --sg-cream-2: #262c20;
  --sg-bg: #12140f;
  --sg-ink: #ece7db;
  --sg-muted: #a39a86;
  --sg-line: #333929;
  --sg-dark: #dcecdf;
  --sg-accent: #dcbe80;
  --sg-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .25);
  background: #12140f;
  color: #ece7db;
}
.song-body[data-song-theme="night"] .song-article,
.song-body[data-song-theme="night"] .song-card,
.song-body[data-song-theme="night"] .song-cat,
.song-body[data-song-theme="night"] .song-book,
.song-body[data-song-theme="night"] .song-hub-card,
.song-body[data-song-theme="night"] .song-toc,
.song-body[data-song-theme="night"] .song-track,
.song-body[data-song-theme="night"] .song-stats li,
.song-body[data-song-theme="night"] .song-author-chip,
.song-body[data-song-theme="night"] .song-chip,
.song-body[data-song-theme="night"] .song-suggest,
.song-body[data-song-theme="night"] .song-search-form input[type="search"] {
  background: #1b1f17;
  color: var(--sg-ink);
}
.song-body[data-song-theme="night"] .song-player {
  background: rgba(18, 20, 15, .97);
}
.song-body[data-song-theme="night"] .song-block-translation p { color: #d8d2c4; }
.song-body[data-song-theme="night"] .song-verse { border-bottom-color: #2a2f22; }

/* ---------- print ---------- */
@media print {
  .song-player, .song-head-actions, .song-reader-bar, .song-related, .song-crumbs,
  .song-player-card, .song-paging, .song-search-form, header, footer, .song-faq { display: none !important; }
  .song-article { border: 0; box-shadow: none; padding: 0; }
  .song-body { background: #fff; }
  .song-verses[data-show-synonyms="0"] .song-block-synonyms { display: block; }
  .song-verse { page-break-inside: avoid; }
}