/* English edition: book typography, natural word spacing, room for longer copy. */
@font-face {
  font-family: "Daydream Garamond";
  src: url("assets/fonts/eb-garamond-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 600;
  font-display: block;
}
@font-face {
  font-family: "Daydream Sans";
  src: url("assets/fonts/source-sans-3-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 600;
  font-display: block;
}
@font-face {
  font-family: "Daydream Motif";
  src: url("assets/fonts/cormorant-garamond-light.ttf") format("truetype");
  font-style: normal;
  font-weight: 300;
  font-display: block;
}
@font-face {
  font-family: "Daydream Motif";
  src: url("assets/fonts/cormorant-garamond-regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: block;
}
html:lang(en) {
  --serif: "Daydream Garamond", Georgia, serif;
  --sans: "Daydream Sans", "Segoe UI", sans-serif;
  font-synthesis: none;
}
html:lang(en) #daydream-app :where(*) {
  letter-spacing: normal;
  text-indent: 0;
  word-break: normal;
}
html:lang(en) :is(button,input,textarea,select) { font-family: var(--sans); }
html:lang(en) :is(h1,h2,h3,strong) { font-weight: 500; }
html:lang(en) :is(h1,h2,h3,p,small,label,button) { overflow-wrap: break-word; }
html:lang(en) :is(h1,h2,h3) { text-wrap: balance; }
/* Keep whole words in compact circular labels; i18n fits the translated text. */
html:lang(en) #daydream-app .selected-theme-orb strong {
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  line-height: 1.18;
}
html:lang(en) :is(.step-heading h1,.base-portal-heading h1,.archaeology-base-guide h1) {
  font: 500 clamp(24px, 6.4vw, 28px)/1.15 var(--serif);
  max-width: 100%;
}
html:lang(en) .step-heading p { font: 400 14px/1.45 var(--sans); }
html:lang(en) #daydream-app .eyebrow { font: 500 11px/1.4 var(--sans); letter-spacing: .09em; }
html:lang(en) :is(.text-button,.primary-button,.secondary-button,.send-button) {
  white-space: normal;
  line-height: 1.3;
}
html:lang(en) .onboarding-content { overflow-x: hidden; }
html:lang(en) .home-tone-label strong { font: 400 32px/1.1 var(--serif); }
html:lang(en) .home-tone-label small { font: 400 12px/1.35 var(--sans); }
/* Each language label keeps its own typography in either interface language. */
#daydream-app .home-language-option[data-value="zh"] {
  font: 400 12px/1 "Songti SC", "STSong", "SimSun", "KaiTi", serif;
  letter-spacing: .12em;
}
#daydream-app .home-language-option[data-value="en"] {
  font: 400 13px/1 "Daydream Garamond", Georgia, serif;
  letter-spacing: .12em;
}
#daydream-app .home-language-divider {
  font: 400 12px/1 "Songti SC", "STSong", "SimSun", "KaiTi", serif;
}
html:lang(en) #daydream-app .home-dream-caption strong { font: 500 40px/1.1 var(--serif); letter-spacing: .025em; }
html:lang(en) #daydream-app .home-dream-caption span { font: 400 13px/1.3 var(--serif); letter-spacing: .04em; }
html:lang(en) #daydream-app .mandala-hint { font: 400 14px/1.3 var(--serif); letter-spacing: .03em; }
html:lang(en) .home-archive-dock > span { font: 400 17px/1.3 var(--serif); }
html:lang(en) .domain-portal-copy { min-width: 0; }
html:lang(en) .domain-portal-copy strong { font: 500 clamp(26px, 7vw, 32px)/1.15 var(--serif); }
html:lang(en) .domain-portal-copy small { font: 400 13px/1.4 var(--sans); margin-top: 8px; }
html:lang(en) .portal-choice strong { font: 500 19px/1.15 var(--serif); white-space: normal; text-align: center; }
html:lang(en) .base-portal-page .portal-choice strong,
html:lang(en) .base-portal-heading p { white-space: nowrap; }
html:lang(en) .material-illustration-card strong { font: 500 21px/1.15 var(--serif); padding: 0 8px; }
html:lang(en) .flip-theme-option strong { font: 500 16px/1.2 var(--serif); white-space: normal; }

/* Keep the original card arrangement; adapt only its text. */
html:lang(en) .theme-card strong {
  left: 8px;
  width: calc(100% - 16px);
  bottom: 18px;
  font: 500 17px/1.12 var(--serif);
  white-space: normal;
  hyphens: auto;
}
html:lang(en) .theme-card :is(.driver-slot-chip,.theme-index) {
  padding: 0 5px;
  font: 400 9px/1.2 var(--sans);
  white-space: normal;
}
/* English names read horizontally outside the original vertical cards. */
.tarot-slot-en { display: none; }
html:lang(en) .tarot-slot-zh { display: none; }
html:lang(en) .tarot-slot-en { display: inline; }
html:lang(en) .tarot-draw-page .theme-card { overflow: visible; }
html:lang(en) .tarot-draw-page .tarot-draw-actions {
  top: auto;
  bottom: max(16px, env(safe-area-inset-bottom));
  padding-bottom: 0;
}
/* Reserve room for external labels and the redraw action inside the canvas. */
html:lang(en) .tarot-draw-page:is(.spread-system,.spread-pentagram,.spread-mirror) .tarot-draw-spread {
  height: 34%;
}
html:lang(en) .tarot-draw-page:is(.spread-system,.spread-pentagram,.spread-mirror) .theme-card:nth-child(n) {
  width: min(11.6%, 5cqh);
}
html:lang(en) .tarot-draw-page .theme-card strong {
  top: calc(100% + 7px);
  bottom: auto;
  left: 50%;
  width: 200%;
  transform: translateX(-50%);
  font: 400 15px/1.12 "Daydream Motif", var(--serif);
  color: var(--ink);
  text-shadow: none;
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
  text-wrap: balance;
  pointer-events: auto;
}
/* In compact crosses, center-column names use the gap beside the card,
   leaving the next card below unobstructed. The spread itself stays intact. */
html:lang(en) .tarot-draw-page.spread-system :is(.card-1,.card-2) strong,
html:lang(en) .tarot-draw-page.spread-mirror :is(.card-1,.card-5) strong {
  top: 50%;
  left: calc(100% + 7px);
  width: 200%;
  transform: translateY(-50%);
  text-align: left;
  font-size: 14px;
}
html:lang(en) .tarot-draw-page.spread-system .theme-card.card-4,
html:lang(en) .tarot-draw-page.spread-mirror .theme-card.card-2 { left: 4%; }
html:lang(en) .tarot-draw-page.spread-system .theme-card.card-5,
html:lang(en) .tarot-draw-page.spread-mirror .theme-card.card-3 { left: 84%; }
html:lang(en) .tarot-draw-page.spread-system .card-4 strong,
html:lang(en) .tarot-draw-page.spread-mirror .card-2 strong { left: 0; transform: none; text-align: left; }
html:lang(en) .tarot-draw-page.spread-system .card-5 strong,
html:lang(en) .tarot-draw-page.spread-mirror .card-3 strong { left: auto; right: 0; transform: none; text-align: right; }
html:lang(en) .tarot-draw-page.spread-pentagram .theme-card.card-3,
html:lang(en) .tarot-draw-page.spread-pentagram .theme-card.card-4 { top: 72%; }
html:lang(en) .tarot-draw-page:is(.spread-timeline,.spread-archive) .theme-card strong {
  width: 105%;
  font-size: 13px;
}
html:lang(en) .tarot-draw-page .driver-slot-chip {
  padding: 0;
  font-size: 8px;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
html:lang(en) :is(.factor-definition,.factor-expansion-screen,.factor-clue-card) { min-width: 0; }
html:lang(en) .factor-definition p { font: 400 17px/1.5 var(--serif); }

/* Preserve the original word constellation and circular identity choices. */
html:lang(en) .motif-word {
  font-family: "Daydream Motif", var(--serif);
  font-weight: 300;
}
html:lang(en) .motif-word.is-selected { font-weight: 400; }
html:lang(en) .dreamer-motif-count { font: 400 12px/1.3 var(--sans); }
html:lang(en) .dreamer-custom-motif-input { font-size: 13px; }
html:lang(en) .secondary-theme-core strong { font: 500 20px/1.2 var(--serif); }
html:lang(en) .word-choice span { font: 500 14px/1.15 var(--serif); white-space: normal; overflow-wrap: break-word; }
html:lang(en) .habitation-rotate { font: 400 12px/1.3 var(--sans); }
html:lang(en) .habitation-opening-kicker { font: 400 11px/1.3 var(--sans); }
html:lang(en) .habitation-completion { font: 400 15px/1.45 var(--serif); min-height: 76px; }
html:lang(en) .bond-card :is(strong,p) { white-space: normal; line-height: 1.4; }
html:lang(en) :is(.seed-card > p,.formal-prose p,.world-response > p,.archive-entry-body p) {
  font: 400 19px/1.5 var(--serif);
  text-align: left;
  hyphens: auto;
}
html:lang(en) :is(.seed-card h2,.formal-prose h3) { font: 500 29px/1.15 var(--serif); }
html:lang(en) :is(.mode-signature,.entry-label,.tab-button small) { font: 400 11px/1.3 var(--sans); }
html:lang(en) .session-sheet > button { font: 400 15px/1.35 var(--sans); }
html:lang(en) .session-sheet button span { white-space: normal; font: 400 12px/1.4 var(--sans); }
html:lang(en) .composer textarea { font: 400 15px/1.45 var(--sans); }
html:lang(en) :is(.home-lens-ball,.lens-ball-caption,.lens-ball-orb-label,.lens-ball-option) { font-family: var(--sans); }
@media (max-width: 360px) {
  html:lang(en) .theme-card strong { font-size: 15px; }
}