/* Reading-first theme: typography is independent of headings and UI control sizes. */
:root {
  --sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", Arial, sans-serif;
  --serif: "Songti SC", "Noto Serif SC", "Source Han Serif SC", SimSun, Georgia, serif;
  --kai: "Kaiti SC", STKaiti, KaiTi, var(--serif);
  --paper: #f6f1e6;
  --paper-dim: #efe8d8;
  --ink: #332d25;
  --ink-soft: #675e50;
  --indigo: #1b2440;
  --indigo-deep: #131a30;
  --cinnabar: #a63b2a;
  --gold: #ad8738;
  --gold-bright: #e3c15c;
  --reading-font-size: 20px;
  --reading-line-height: 2;
  --reading-font-family: var(--sans);
}
body { background: var(--paper); color: var(--ink); font: 400 var(--reading-font-size)/var(--reading-line-height) var(--reading-font-family); -webkit-font-smoothing: auto; }
.site-header.nav { background: #1b2440f5; border-color: #d9cba9; box-shadow: 0 1px 12px #131a3010; }
.site-header .nav-brand { display: flex; gap: .6rem; align-items: center; color: #eed8a0; font-family: var(--sans); letter-spacing: 0; }
.brand-mark { display: block; flex: none; width: 48px; height: 48px; }
.brand-title { display: block; font: 600 1.15rem/1.5 var(--sans); letter-spacing: .12em; }
.brand-caption { color: #d3c39e; font-size: .57rem; letter-spacing: .1em; line-height: 1.7; }
.desktop-nav a, .mobile-menu nav > a { color: #e9dfc9; font-size: .92rem; }
.desktop-nav a:hover, .mobile-menu nav > a:hover { background: #ffffff12; color: #f2d583; }
.desktop-nav a[aria-current="page"], .mobile-menu a[aria-current="page"] { background: #c9a22720; color: #f2d583; font-weight: 600; }
.site-header .language-link, .mobile-menu summary, .reading-fallback { min-width: 44px; min-height: 44px; color: #eed8a0; border: 1px solid #b3955055; background: #fffcf4; font: 500 .85rem/1.4 var(--sans); }
.site-header .language-link:hover { background: #ffffff12; }
.site-header :focus-visible { outline-color: #e3c15c; }
.mobile-menu nav { background: #fffcf4; border-color: #b3955055; box-shadow: 0 16px 40px #eed8a024; }
.reading-fallback { border-radius: 6px; padding: .5rem .8rem; }
.hero { background: radial-gradient(ellipse at 50% 0, #ba96542b, transparent 65%), linear-gradient(160deg, #1b2440, #131a30); color: #fffdf4; padding: 3.2rem 1.5rem 3.5rem; }
.hero-brandmark { margin: 0 auto 1.4rem; }
.hero-brandmark img { display: block; width: 144px; height: 144px; }
.hero h1 { font-family: var(--sans); font-weight: 550; letter-spacing: .2em; margin-top: 0; color: #fffdf4; }
.hero .hero-sub { font-family: var(--sans); letter-spacing: .04em; color: #e6d8b8; font-size: 1rem; }
.hero .hero-verse { color: #dccb9d; font-family: var(--sans); letter-spacing: .02em; font-size: 1rem; line-height: 2; }
.hero-actions a { font-weight: 500; font-size: 1rem; border-color: #d6c49e; }
.hero-actions a.primary { background: #fcf8e9; color: #1b2440; border-color: #fcf8e9; }
.page-hero { background: linear-gradient(140deg, #1b2440, #131a30); }
.page-hero h1, .home-paths h2, .path-card h3, .seal-row h2, .source-text h3, .source-text h4 { font-family: var(--sans); font-weight: 600; letter-spacing: .02em; }
.page-hero h1 { font-size: clamp(1.8rem, 4vw, 2.5rem); }
.page-hero .hero-sub { color: #e6d8b8; font-size: 1rem; letter-spacing: .02em; }
.page-hero .hero-note { font-family: var(--sans); font-size: 1rem; letter-spacing: .02em; color: #dccb9d; }
.reading-tools { max-width: 840px; background: #f6f1e6f5; border-color: #d9cba9; font-size: .95rem; }
.page-toc nav { background: #fffcf4; border-color: #d9cba9; box-shadow: 0 12px 36px #eed8a017; }
.page-toc nav a { font-size: .95rem; line-height: 1.65; }
.page-toc nav a.toc-subsection { font-size: .88rem; border-color: #d9cba9; color: #675e50; }
.reading-top { color: #675e50; }
.home-paths h2 { font-size: 1.75rem; }
.path-card { border-color: #d9cba9; box-shadow: 0 2px 8px #131a3004; background: #fffcf4; padding: 1.8rem; }
.path-card:hover { border-color: #ad8738; box-shadow: 0 8px 24px #eed8a00c; }
.path-card h3 { color: #1b2440; font-size: 1.35rem; }
.path-card p { font: 400 max(18px, calc(var(--reading-font-size) * .9))/1.9 var(--reading-font-family); color: #675e50; }
.path-card .path-action { color: #963e30; font-size: .95rem; font-weight: 500; }
.path-number { color: #963e30; font-size: .8rem; }
main section.chapter { max-width: 840px; padding-top: 3.5rem; }
.seal-row h2 { font-size: clamp(1.4rem, 3.6vw, 1.75rem); line-height: 1.6; }
.seal-row .en { letter-spacing: .08em; font-size: .78rem; color: #766a55; }
.seal { background: #a63b2a; font-family: var(--sans); box-shadow: none; border-radius: 8px; font-size: 1rem; font-weight: 500; }
.chapter p, html[data-lang="en"] .chapter p, html[data-lang="en"] .source-text p { font-family: var(--reading-font-family); font-size: var(--reading-font-size); line-height: var(--reading-line-height); text-align: left; letter-spacing: .015em; margin-bottom: 1.25em; color: var(--ink); }
.chapter li, .source-text { font-family: var(--reading-font-family); font-size: var(--reading-font-size); line-height: var(--reading-line-height); }
.chapter p strong { color: #1b2440; font-weight: 650; }
.chapter p.note, .note, .chapter > p.intro { font-size: max(17px, calc(var(--reading-font-size) * .9)); color: #675e50; line-height: 1.9; background: #eee5d2; border-color: #ad8738; }
.liturgy, .liturgy-prose, .verse-grid, .mantra-block, .sutra-wrap, .dedication .kai { font-family: var(--reading-font-family); letter-spacing: .02em; }
.liturgy, .liturgy-prose { background: #f1e9d9; border-color: #d9cba9; border-top-color: #ad8738; border-radius: 8px; }
.liturgy .line, .verse-grid { font-family: var(--reading-font-family); font-size: var(--reading-font-size); letter-spacing: .02em; line-height: var(--reading-line-height); color: #332d25; }
.liturgy .small-note, .liturgy .attribution, .chapter .small-note { font-family: var(--sans); font-size: 16px; line-height: 1.9; letter-spacing: .02em; color: #675e50; }
.liturgy-prose h3 { font-family: var(--sans); font-size: 1.15rem; letter-spacing: .02em; color: #1b2440; }
.version-bar .vbtn { font-family: var(--sans); font-size: 1rem; letter-spacing: .02em; }
.version-hint { font-family: var(--sans); font-size: 17px; line-height: 1.8; color: #675e50; }
.recording { background: #fffcf4; border-color: #d9cba9; border-left-color: #ad8738; }
.recording h3 { font-family: var(--sans); font-size: 1.2rem; font-weight: 600; letter-spacing: .015em; }
.recording .meta { font-family: var(--sans); font-size: 15px; color: #675e50; }
.transcript-panel { background: #f6f1e6; border-color: #d9cba9; }
.transcript-toolbar { font-size: 15px; border-color: #d9cba9; }
.transcript-scroll { height: 25rem; max-height: 65vh; }
.transcript-cue { font-family: var(--reading-font-family); font-size: var(--reading-font-size); line-height: var(--reading-line-height); color: #675e50; padding: 1rem; }
.transcript-cue[aria-current="true"] { border-left-color: #a63b2a; background: #efe4cb; color: #332d25; }
.transcript-cue:hover { background: #f1e9d9; }
.transcript-time { font-family: var(--sans); font-size: 14px; font-weight: 500; color: #963e30; margin-bottom: .4rem; }
html[data-lang="en"] .transcript-zh { font-size: .95em; color: #675e50; line-height: var(--reading-line-height); }
.chapter .transcript-status, .chapter .transcript-disclaimer { font-family: var(--sans); font-size: 14px; line-height: 1.85; letter-spacing: 0; color: #675e50; margin: 0; }
.transcript-follow[aria-pressed="true"] { background: #1b2440; border-color: #1b2440; }
.source-text h3 { color: #1b2440; padding-bottom: .8rem; font-size: 1.35rem; border-color: #d9cba9; }
.source-text h4 { font-size: 1.15rem; color: #1b2440; }
.text-toc { background: #eee5d2; font: 500 .95rem/1.8 var(--sans); }
.text-toc a { color: #963e30; }
footer.site-footer { background: #131a30; color: #e6d8b8; font-family: var(--sans); font-size: 16px; line-height: 1.9; }
.footer-identity { display: flex; align-items: center; justify-content: center; gap: .7rem; margin: 0 auto 1.3rem; }
.footer-identity img { flex: none; }
.footer-identity span { font-size: 1.1rem; letter-spacing: .12em; color: #fff9ea; }
.footer-note { font-size: 15px; color: #d3c39e; }
@media (max-width: 640px) {
  .site-header.nav { gap: .4rem; padding: .6rem .75rem; }
  .brand-mark { width: 38px; height: 38px; }
  .site-header .nav-brand { gap: .4rem; }
  .brand-title { font-size: 1rem; letter-spacing: .06em; }
  .brand-caption { font-size: .48rem; letter-spacing: .03em; }
  .site-controls { gap: .35rem; }
  .mobile-menu summary { padding: .5rem; font-size: .8rem; }
  .hero { padding: 2.8rem 1.2rem 3rem; }
  .hero-brandmark img { width: 126px; height: 126px; }
  .hero h1 { font-size: 2.35rem; }
  .hero .hero-sub { font-size: .95rem; line-height: 1.8; }
  .hero .hero-verse { font-size: .9rem; }
  .hero-actions { margin-top: 1.5rem; }
  .hero-actions a { font-size: .95rem; padding: .7rem 1rem; }
  main section.chapter { padding: 2.8rem 1.25rem 1rem; }
  .path-card { padding: 1.4rem; }
  .reading-tools { padding-inline: 1.2rem; font-size: .9rem; }
  .reading-top { font-size: .8rem; }
  .recording { padding: 1rem .8rem; }
  .transcript-scroll { height: 23rem; }
  .transcript-cue { padding: .8rem; }
  .liturgy, .liturgy-prose { padding: 1.5rem 1rem; }
  .verse-grid { grid-template-columns: 1fr; }
}

/* Cundī mirror and scripture-inspired ornament. Text never moves. */
.site-header .nav-brand { color: #f1dfac; }
.site-header .brand-mark { background: #f6f1e6; border-radius: 50%; padding: 2px; }
.site-header .language-link, .mobile-menu summary, .reading-fallback { background: transparent; }
.mobile-menu nav { background: #1b2440; }
.brand-title, .hero h1, .home-paths h2, .path-card h3, .seal-row h2, .page-hero h1 { font-family: var(--kai); font-weight: 600; }
.hero { isolation: isolate; padding: 3.5rem 1.5rem 3rem; border-bottom: 4px double #b99a57; }
.hero > :not(.cundi-sky) { position: relative; z-index: 1; }
.hero::after { content: ''; position: absolute; inset: 22px; border: 1px solid #c9a22725; pointer-events: none; z-index: 0; }
.hero h1 { font-size: clamp(2.8rem,6vw,4.2rem); letter-spacing: .3em; text-indent: .3em; }
.hero .hero-sub { font-size: 1rem; letter-spacing: .12em; }
.hero .hero-verse { font-family: var(--serif); font-size: 1.05rem; line-height: 2.1; }
.hero-actions a { border-radius: 2px; }
.hero-actions a.primary { background: #e6cd8c; border-color: #e6cd8c; }
.hero-brandmark { width: 208px; height: 208px; display: grid; place-items: center; margin-bottom: 1.2rem; }
.hero-brandmark img { width: 154px; height: 154px; filter: drop-shadow(0 0 18px #d7b56330); }
.mirror-orbit { position: absolute; inset: 0; width: 100%; height: 100%; animation: mirror-turn 120s linear infinite; }
.mirror-halo { position: absolute; inset: 18px; border-radius: 50%; background: radial-gradient(circle,#d8b25b18,transparent 70%); animation: mirror-breathe 8s ease-in-out infinite; }
.cundi-sky { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.sky-lotus { position: absolute; width: 110px; height: 110px; color: #d2ad60; opacity: .13; animation: lotus-drift 12s ease-in-out infinite alternate; }
.sky-lotus:nth-child(1) { left: 7%; top: 20%; transform: rotate(-15deg); }
.sky-lotus:nth-child(2) { right: 8%; top: 52%; animation-delay: -5s; }
.sky-lotus:nth-child(3) { left: 18%; bottom: 10%; width: 65px; animation-delay: -8s; }
.sky-lotus:nth-child(4) { right: 21%; top: 12%; width: 60px; animation-delay: -3s; }
.motion-toggle { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1.7rem; min-height: 44px; border: 0; border-bottom: 1px solid #b99a5750; color: #d8c9a8; background: transparent; font: .8rem/1.4 var(--sans); cursor: pointer; padding: .5rem; }
.motion-toggle:hover { color: #fff2ce; }
.motion-toggle:focus-visible { outline: 2px solid #e3c15c; outline-offset: 3px; }
[data-motion-paused="true"] :is(.mirror-orbit,.mirror-halo,.sky-lotus), .hero[data-scene-visible="false"] :is(.mirror-orbit,.mirror-halo,.sky-lotus) { animation-play-state: paused; }
.home-paths { padding-top: 3.5rem; }
.home-paths > h2 { letter-spacing: .12em; }
.path-card { position: relative; border-radius: 2px; border-top: 3px solid #ad8738; background: linear-gradient(135deg,#fffdf7,#f3ecdc); box-shadow: inset 0 0 0 5px #f6f1e6; }
.path-card::after { content: ''; position: absolute; inset: 7px; border: 1px solid #b99a572b; pointer-events: none; }
.path-card h3 { font-size: 1.65rem; }
.path-symbol { width: 42px; height: 42px; margin: 0 0 1rem; color: #ad8738; }
.lecture-entry { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 1.5rem; padding: 1.3rem 1.6rem; border-block: 1px solid #d9cba9; color: #1b2440; text-decoration: none; font: 1rem/1.8 var(--sans); }
.lecture-entry small { display: block; color: #675e50; font-size: .9rem; }
.lecture-entry:hover { background: #efe8d8; }
.seal { border-radius: 2px; outline: 1px solid #a63b2a; outline-offset: 3px; font-family: var(--kai); }
.seal-row { padding-bottom: 1rem; border-bottom: 1px solid #b99a5750; }
.chapter + .chapter::before { content: '◇'; display: block; color: #ad8738; text-align: center; margin-bottom: 2.5rem; font-size: 1rem; }
@keyframes mirror-turn { to { transform: rotate(360deg); } }
@keyframes mirror-breathe { 50% { opacity: .35; transform: scale(.94); } }
@keyframes lotus-drift { to { translate: 0 -14px; } }
@media (prefers-reduced-motion: reduce) { .mirror-orbit,.mirror-halo,.sky-lotus { animation: none !important; } .path-card { transition: none; } }
@media (max-width:640px) {
 .hero { padding: 2.5rem 1.2rem 2rem; }
 .hero::after { inset: 10px; }
 .hero-brandmark { width: 172px; height: 172px; }
 .hero-brandmark img { width: 130px; height: 130px; }
 .hero h1 { font-size: 2.65rem; }
 .hero .hero-verse { font-size: .95rem; }
 .sky-lotus { width: 65px; }
 .sky-lotus:nth-child(1) { left: -4%; }
 .sky-lotus:nth-child(2) { right: -4%; }
 .lecture-entry { padding: 1rem .5rem; gap: .7rem; font-size: .95rem; }
}
@media print { .cundi-sky,.mirror-orbit,.mirror-halo,.motion-toggle { display:none; } }
.hero h1 { line-height: 1.5; }
html[data-lang="en"] .hero h1 { font-size: clamp(2rem,5vw,3.4rem); letter-spacing: .05em; text-indent: 0; line-height: 1.3; }
html[data-lang="en"] .hero .hero-sub { letter-spacing: .035em; }
.motion-toggle[hidden] { display: none; }