/* Text uses rem throughout the active styles; standard retains the 16px baseline. */
html[data-font-size="large"] { font-size: 20px; }
html[data-font-size="extra-large"] { font-size: 24px; }
.settings-font-size .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.font-size-picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; border: 0; margin: 16px 0; min-width: 0; }
.font-size-picker label { display: flex; gap: 7px; align-items: flex-start; padding: 12px 8px; border: 1px solid var(--color-border); border-radius: 12px; cursor: pointer; min-width: 0; min-height: 48px; }
.font-size-picker label:has(:checked) { border-color: var(--color-primary); background: var(--color-primary-soft); }
.font-size-picker label:has(:focus-visible) { outline: 2px solid var(--color-primary); outline-offset: 3px; }
.font-size-picker input { flex: none; margin-top: .3em; accent-color: var(--color-primary); }
.font-size-picker span { min-width: 0; font-size: .9375rem; line-height: 1.5; }
.font-size-picker small { display: block; font-size: .75rem; color: var(--color-text-muted); overflow-wrap: anywhere; }
.font-size-preview { padding: 16px; border-radius: 12px; background: var(--color-bg-card-soft); line-height: 1.7; overflow-wrap: anywhere; }
.font-size-preview strong { font-size: 1rem; }
.font-size-preview p { margin-top: 6px; font-size: .8125rem; color: var(--color-text-muted); }
@media (min-width: 401px) {
  .font-size-picker label { flex-direction: column; align-items: center; text-align: center; gap: 6px; }
  .font-size-picker input { margin-top: 0; }
}

/* Extra room for wrapping text, without scaling artwork or touch targets. */
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] {
  --nav-height: 84px;
  --page-padding-bottom: calc(108px + var(--safe-bottom));
}
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] :is(.btn, .filter-btn, .segmented-control__btn, .theme-card, .page-back-btn) { height: auto; white-space: normal; overflow-wrap: anywhere; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .nav-item { min-width: 0; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .task-card__preview { white-space: normal; overflow-wrap: anywhere; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .theme-card__header { flex-wrap: wrap; gap: 8px; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-scene { height: auto; min-height: 260px; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-companion-caption { position: relative; left: auto; right: auto; bottom: auto; margin: 14px 22px 0; padding-bottom: 12px; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-greeting { position: relative; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-masthead { height: auto; min-height: 58px; flex-wrap: wrap; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-journey-label { flex-wrap: wrap; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-chapter-heading { flex-wrap: wrap; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .reminder-time-card { min-width: 0; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] #reminder-time { width: 100%; font-size: 1.75rem; }

/* Symbols keep their own geometry rather than inheriting the text line box. */
body[data-theme] .twilight-journey-track i {
  display: grid; place-items: center; width: 16px; height: 16px;
  top: 50%; transform: translateY(-50%);
  left: clamp(0px, var(--journey-progress), calc(100% - 16px));
  font-size: 0; line-height: 1;
}
body[data-theme] .twilight-journey-track i .qn-icon { margin: 0; }
body[data-theme] .twilight-journey-track i .qn-icon svg { width: 16px; height: 16px; }
body[data-theme] :is(.fab, .twilight-add-task) { display: grid; place-items: center; line-height: 1; flex-shrink: 0; }
body[data-theme] :is(.fab, .twilight-add-task) .qn-icon svg { width: 24px; height: 24px; }
body[data-theme] .twilight-pet-name { min-width: 0; max-width: 100%; }
body[data-theme] .twilight-pet-name__text { min-width: 0; overflow-wrap: anywhere; }
body[data-theme] .twilight-rarity { flex: none; white-space: nowrap; line-height: 1.2; }
.task-card__description { display: none; }
.expedition-dispatch-preview__compact { display: none; }

/* Large type prioritizes decisions and actions; optional task text remains available. */
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] :is(.twilight-chapter-heading > div > p, .twilight-voice--intro, .twilight-greeting > p:last-child, .workshop-summary__hint, .daily-blessing-subtitle) { display: none; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-companion-footer { flex-direction: column; align-items: stretch; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-pet-touch { align-self: flex-start; height: auto; min-height: 44px; max-width: 100%; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-task-body > .task-card__preview { display: none; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .task-card__description { display: block; margin: 8px 0; font-size: .8125rem; color: var(--color-text-muted); }
.task-card__description summary { min-height: 44px; padding: 10px 0; cursor: pointer; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .task-card__description .task-card__preview { white-space: pre-wrap; overflow-wrap: anywhere; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-gacha-scene { height: auto; min-height: 220px; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-gacha-scene > p { display: none; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .twilight-gacha-caption { display: block; margin-top: 24px; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .daily-blessing-gacha-entry__summary { white-space: normal; overflow: visible; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .daily-blessing-gacha-entry__main { flex-wrap: wrap; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .daily-blessing-card__toggle { display: grid; grid-template-columns: 24px minmax(0, 1fr) 20px; gap: 8px; align-items: center; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .daily-blessing-card__icon { grid-column: 1; grid-row: 1; width: 24px; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .daily-blessing-card__header-main { grid-column: 2; grid-row: 1; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .daily-blessing-card__chevron { grid-column: 3; grid-row: 1; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .daily-status-badge { grid-column: 2; grid-row: 2; justify-self: start; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .daily-blessing-card__compact-summary { white-space: normal; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] :is(.achievement-title-bar__row, #view-expedition .expedition-energy) { flex-direction: column; align-items: stretch; gap: 12px; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .achievement-title-bar__row > .btn { align-self: flex-start; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] #view-expedition :is(.expedition-energy__hint, .expedition-energy__warning) { max-width: none; text-align: left; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .expedition-dispatch-preview__full { display: none; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] .expedition-dispatch-preview__compact { display: block; }
.expedition-dispatch-preview__compact summary { cursor: pointer; min-height: 44px; padding-block: 10px; }
.expedition-dispatch-preview__compact details[open] { max-height: 25vh; overflow-y: auto; }
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] #view-expedition .expedition-area-card__content {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: 'header' 'meta' 'material' 'progress' 'action';
  gap: 10px;
}
html:is([data-font-size="large"], [data-font-size="extra-large"]) body[data-theme] #view-expedition .expedition-area-card__material { white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 400px) {
  html:is([data-font-size="large"], [data-font-size="extra-large"]) .font-size-picker { grid-template-columns: 1fr; }
}
