/* A quiet type scale: regular ink, generous reading rhythm, restrained emphasis.
   Loaded after the component and locale sheets; no artwork or color overrides. */
:root {
  --type-body-size: 15px;
  --type-body-leading: 1.85;
  --type-reading-size: 17px;
  --type-reading-leading: 1.95;
  --type-title-weight: 400;
  --type-emphasis-weight: 500;
}

body {
  font-size: var(--type-body-size);
  font-weight: 400;
  line-height: var(--type-body-leading);
}

h1, h2, h3, h4, h5, h6 { font-weight: var(--type-title-weight); }
strong, b { font-weight: var(--type-emphasis-weight); }
button, input, textarea, select { font-weight: 400; }

/* Keep Chinese headings in the same light, unhurried rhythm as the body. */
h1 { font-size: clamp(30px, 3vw, 38px); font-weight: 400; line-height: 1.55; }
.home-title { font-size: clamp(30px, 3.2vw, 42px); font-weight: 400; line-height: 1.55; letter-spacing: .055em; }
.home-question-label { font-size: 26px; font-weight: 400; line-height: 1.6; letter-spacing: .035em; }
.home-section-heading h2, .knowledge-heading h2, .result-heading h2,
.dialog-heading h2, .chart-dialog-heading h2, .chart-title {
  font-weight: 400;
  line-height: 1.6;
}
.knowledge-heading h2, .result-heading h2, .dialog-heading h2,
.chart-dialog-heading h2 { font-size: 28px; letter-spacing: .035em; }
.chart-title { font-size: 30px; letter-spacing: .035em; }
.home-section-heading h2 { font-size: 25px; letter-spacing: .04em; }
.coming-panel h2 { font-size: 28px; font-weight: 400; line-height: 1.65; }

.method-card h3, .knowledge-note h3, .knowledge-sources h3,
.learning-steps h3, .learning-next h3, .data-info-body h3,
.history-text h3, .chart-overview-title, .chart-reading-tools h3,
.chart-change-copy h4, .chart-reference-heading h3 {
  font-size: 22px;
  font-weight: 400;
  line-height: 1.65;
  letter-spacing: .025em;
}
.hexagram-name h4, .six-lines-hexagram-name { font-size: 25px; font-weight: 400; line-height: 1.65; }
.six-lines-input-title { font-size: 21px; font-weight: 400; line-height: 1.65; }
.liu-ren-final-name { font-size: 38px; font-weight: 400; line-height: 1.55; letter-spacing: .08em; }
.home-method-name { font-size: 17px; font-weight: 400; line-height: 1.6; }
.home-tool-name { font-size: 22px; font-weight: 400; line-height: 1.6; }
.home-start { font-size: 18px; font-weight: 400; line-height: 1.6; letter-spacing: .08em; }
.home-inspiration-text { font-size: 18px; font-weight: 400; line-height: 1.7; }

/* The navigation already uses a seal, colored edge and a filled selection. */
.nav-link { font-size: 15px; line-height: 1.7; font-weight: 400; }
.nav-link.nav-active { font-weight: 450; }
.small-label, .field-label, .chart-matrix th { font-weight: 400; }
.card-heading h3, .six-lines-card-heading h3,
.calculation-heading h3, #calculation-title, .liu-ren-process-heading,
.chart-section-title, .chart-reading-heading.chart-judgment-heading h3,
.chart-related-card h3, .chart-reference-list h4 { font-weight: 450; }
.strip-item strong, .trigram-knowledge-item strong,
.six-lines-toss-kind { font-weight: 400; }
.body-use-note strong, .rules-body strong, .number-input b,
.liu-ren-step-heading > strong, .liu-ren-step-calculation strong { font-weight: 500; }

/* Supporting copy stays readable without competing with the question. */
.home-intro-copy, .intro-copy, .chart-intro, .knowledge-intro,
.method-card > p, .knowledge-note p:not(.small-label),
.knowledge-sources > p:not(.small-label), .rules-body, .data-info-body {
  font-size: 15px;
  line-height: 1.95;
}
.home-tool-description, .traditional-small, .liu-ren-reflection,
.chart-footnote, .chart-reference-note, .chart-reading-tools p,
.chart-version-note, .chart-detail-line-note {
  font-size: 14px;
  line-height: 1.9;
}
.home-eyebrow, .home-optional, .home-question-meta,
.home-inspiration-heading, .home-inspiration-toggle,
.home-inspiration-category, .home-methods > legend,
.home-method-note, .home-settings-link, .home-section-eyebrow,
.home-tool-badge, .home-tool-action, .home-bottom-note,
.sidebar-heading, .nav-section-label, .nav-status,
.brand-subtitle, .preference-control, .six-lines-stage-title,
.six-lines-coin-label, .six-lines-coins-unrecorded {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.75;
}
.home-inspiration-help, .home-inspiration-fill, .home-result-note,
.home-method-subtitle { font-size: 11px; line-height: 1.8; }
.preference-control { font-size: 11px; line-height: 1.4; }
.preference-control select, #theme-select { font-size: 13px; font-weight: 400; line-height: 1.5; }
.home-question { font-size: 16px; font-weight: 400; line-height: 1.9; }
.field-label { line-height: 1.75; }
.time-context, .time-help, .location-help, .form-note,
.method-form-hint, .result-policy { line-height: 1.85; }
.question-display { font-size: 16px; line-height: 1.95; }

/* Source passages and modern explanations share an easy reading measure.
   Keep the reader's explicit comfortable-size option effective. */
.chart-image-analysis, .chart-reading-ancient-text,
.chart-reading-ancient-text.chart-judgment-text,
.chart-reading-plain-text, .chart-reference-items,
.chart-reference-translation-items {
  font-size: var(--type-reading-size);
  font-weight: 400;
  line-height: var(--type-reading-leading);
  letter-spacing: .015em;
}
.chart-reading-ancient-text, .chart-reading-ancient-text.chart-judgment-text { letter-spacing: .035em; }
.chart-dialog[data-reading-size="comfortable"] .chart-image-analysis,
.chart-dialog[data-reading-size="comfortable"] .chart-reading-plain-text,
.chart-dialog[data-reading-size="comfortable"] .chart-reference-items,
.chart-dialog[data-reading-size="comfortable"] .chart-reference-translation-items { font-size: 19px; }
.chart-dialog[data-reading-size="comfortable"] .chart-reading-ancient-text { font-size: 20px; }

/* Locale-specific headline sizing above remains in charge of long translations. */
:root:is(:lang(en), :lang(ja), :lang(ko), :lang(th), :lang(vi)) .home-inspiration-text {
  font-size: 18px;
  line-height: 1.5;
  letter-spacing: 0;
}
:root:lang(th) body { line-height: 1.95; }

@media (max-width: 899px) {
  .home-title { font-size: clamp(30px, 4vw, 38px); }
  .home-intro-copy { font-size: 14px; }
}

@media (max-width: 650px) {
  h1 { font-size: 30px; line-height: 1.6; }
  :root:lang(zh) .home-title { font-size: 30px; line-height: 1.6; letter-spacing: .04em; }
  .home-question-label { font-size: 23px; line-height: 1.65; letter-spacing: .02em; }
  .home-section-heading h2 { font-size: 23px; }
  .knowledge-heading h2, .result-heading h2, .dialog-heading h2,
  .chart-dialog-heading h2, .chart-title { font-size: 26px; line-height: 1.6; }
  .home-method-name { font-size: 15px; line-height: 1.6; }
  .home-tool-name { font-size: 20px; }
  .home-tool-description { font-size: 13px; }
  .home-inspiration-text { font-size: 17px; line-height: 1.7; }
  .home-inspiration-slide, .home-inspiration-ghost { gap: 6px; }
  .home-question-meta { font-size: 11px; }
  .brand-subtitle { font-size: 10px; }
  .liu-ren-final-name { font-size: 34px; }
  .chart-image-analysis, .chart-reading-ancient-text,
  .chart-reading-ancient-text.chart-judgment-text,
  .chart-reading-plain-text, .chart-reference-items,
  .chart-reference-translation-items { font-size: 16px; line-height: 1.95; }
  #theme-select { max-width: none; }
  input, textarea, select, input[type="datetime-local"],
  .chart-search, .chart-select, .preference-control select, #theme-select { font-size: 16px; }
  :root:is(:lang(en), :lang(ja), :lang(ko), :lang(th), :lang(vi)) .home-inspiration-text {
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0;
  }
  :root:is(:lang(en), :lang(ja), :lang(ko), :lang(th), :lang(vi)) .home-inspiration-category,
  :root:is(:lang(en), :lang(ja), :lang(ko), :lang(th), :lang(vi)) .home-inspiration-fill {
    font-size: 10px;
    line-height: 1.5;
    letter-spacing: 0;
  }
}

@media (max-width: 359px) {
  :root:lang(zh) .home-title { font-size: 28px; }
  .home-tool-name { font-size: 19px; }
}
