/* All Chinese UI uses the shipped Songti font. The brand artwork stays unchanged. */
:root, :root[data-theme="light"], :root[data-theme="dark"] {
  --ui-serif: YinianSongti, "Songti SC", "STSong", SimSun, serif;
  --serif: var(--ui-serif);
  --section-serif: var(--ui-serif);
  --numeric: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --sans: var(--ui-serif);
}
:root body, :root :is(button, input, select, textarea, summary),
:root :is(.page, #static-seo-content, .site-footer, .tabbar, .date, .lunar-date) {
  font-family: var(--ui-serif);
  font-weight: 400;
  font-synthesis: none;
}
:root :is(h1,h2,h3,#pageTitle,.journey-task-title,.stage-title,.scripture-title,.settings-group-label,.classic-group-label,.settings-link-title,.scripture-card-title),
:root :is(.primary-btn,.secondary-btn,.plain-btn,.task-action-btn,.tools-pill,.reading-mode-btn,.splash-hint-large),
:root .daily-quote-v4 h2 { font-family: var(--ui-serif); font-weight: 500; }
:root :is(.stage-desc,.journey-progress-note,.task-status,.task-config-type,.task-config-target,.task-config-unit,.splash-hint-small,.splash-tagline,.scripture-subtitle,.tab-label,.date,.lunar-date,.zhai-badge,.reader-meta-item,.reading-mode-hint),
:root .site-footer :is(a,span), :root .tab-item { font-family: var(--ui-serif); font-weight: 400; }
:root :is(.count,.meditation-time,.progress-ring-number,.progress-ring-value,.progress-ring strong,.progress-ring small),
:root input[type="number"] { font-family: var(--numeric); font-variant-numeric: tabular-nums; font-weight: 500; }
:root .daily-quote-v4 p, :root .scripture-text, :root .phonetic-hanzi { font-weight: 400; }

/* A splash is one viewport, not a tall page. Only this state locks scrolling. */
html.splash-active, html:has(body.show-splash) { overflow: hidden; overscroll-behavior: none; }
body.show-splash {
  position: fixed; inset: 0; width: 100%; height: 100%; min-height: 0;
  overflow: hidden; overscroll-behavior: none;
}
:root .splash-screen {
  position: fixed; top: var(--splash-top, 0px); left: 0; right: 0;
  width: 100%; max-width: none; height: var(--splash-height, 100svh); min-height: 0;
  margin: 0; padding: max(16px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));
  overflow: hidden; display: grid; place-items: center;
}
@supports (height: 100dvh) { :root .splash-screen { height: var(--splash-height, 100dvh); } }
:root .splash-enter {
  width: min(100%, 400px); height: auto; min-height: 0; margin: 0; padding: 0;
  gap: clamp(12px, calc(var(--splash-height, 100svh) * .035), 24px);
  align-content: center; justify-items: center; font-weight: 400;
}
:root .splash-logo {
  width: min(210px, 54vw, calc(var(--splash-height, 100svh) * .32));
  height: auto; max-width: 100%; border-radius: 22px; background: #fbf9f1;
}

/* Both lockups are exported from the approved master. Only ink changes at night. */
:root .brand { min-height: 30px; }
:root .brand-lockup { display: block; width: 144px; height: auto; flex: none; }
:root .brand-lockup-dark { display: none; }
:root[data-theme="dark"] .brand-lockup-light { display: none; }
:root[data-theme="dark"] .brand-lockup-dark { display: block; }
@media (max-width: 360px) {
  :root .brand-lockup { width: 128px; }
}
:root .splash-tagline { font-size: 18px; line-height: 1.5; font-weight: 400; margin: 0 0 clamp(16px, calc(var(--splash-height, 100svh) * .045), 30px); letter-spacing: .12em; }
:root .splash-hint { gap: 4px; }
:root .splash-hint-small { font-size: 15px; line-height: 1.5; font-weight: 400; }
:root .splash-hint-large { font-size: 26px; line-height: 1.4; font-weight: 500; }
:root[data-large-text="true"] .splash-tagline { font-size: 21px; }
:root[data-large-text="true"] .splash-hint-small { font-size: 18px; }
:root[data-large-text="true"] .splash-hint-large { font-size: 29px; }
@media (max-height: 440px) {
  :root .splash-enter { grid-template-columns: auto auto; gap: 24px; align-items: center; width: fit-content; }
  :root .splash-logo { width: min(140px, 28vw, calc(var(--splash-height, 100svh) * .44)); }
  :root .splash-tagline { margin-bottom: 12px; }
}