/* Instruction 0009 addendum: page-wide human-readable type and controls. */
:root { font-size: 16px; }

body {
  font-size: 1rem;
  line-height: 1.55;
}

.brand-lockup,
.header-note,
.site-footer {
  font-size: .8125rem;
  letter-spacing: .06em;
  line-height: 1.5;
}

.intro p { font-size: clamp(1rem, 1.35vw, 1.125rem); line-height: 1.5; }
.intro-rule { font-size: .8125rem; line-height: 1.4; }
.section-index,
.eyebrow { font-size: .75rem; letter-spacing: .11em; line-height: 1.35; }
.panel h2 { font-size: clamp(1.35rem, 2vw, 1.75rem); line-height: 1.2; }
.text-button { font-size: .9375rem; min-height: 44px; padding: 8px 0; }

.measure-field > span,
.measure-field small,
.micro-note,
.preset-hint,
.input-error,
.result-label,
.change-label,
.panel-lede,
.terrain-copy p,
.compare-result,
.compare-tool small,
.tool-result,
.actual-result span,
.terrain-result,
.notes-grid p {
  line-height: 1.5;
}

.measure-field > span { font-size: 1rem; margin-bottom: 9px; }
.measure-field small,
.micro-note,
.preset-hint { color: var(--muted); font-size: .875rem; }
.input-shell { min-height: 52px; }
input { font-size: clamp(1.125rem, 2vw, 1.375rem); line-height: 1.25; }
select { font-size: 1rem; line-height: 1.35; }
.input-shell em { font-size: .875rem; }
.size-inputs .input-shell select {
  flex: 0 0 4.25rem;
  min-width: 4.25rem;
  padding-left: .7rem;
  padding-right: 1.65rem;
  background-position: calc(100% - 15px) 50%, calc(100% - 8px) 50%;
}
.swap-button { min-height: 64px; }
.swap-button small { font-size: .875rem; }
.result-label { font-size: 1.125rem; }
.change-label { font-size: .9375rem; }
.result-caveat { font-size: .875rem; line-height: 1.5; }

.preset-list { gap: 9px; }
.preset { font-size: .875rem; min-height: 44px; padding: 9px 13px; }
.panel-lede { font-size: 1rem; }
.disclosure { font-size: .875rem; min-height: 44px; }
.actual-result span { font-size: .9375rem; }
.actual-result span:last-child { font-size: .8125rem; }
.actual-result strong { font-size: clamp(2rem, 5vw, 2.5rem); }
.tool-title { font-size: 1rem; line-height: 1.35; }
.ratio-fields .measure-field > span { font-size: .9375rem; }
.ratio-fields input,
.ratio-fields select,
.bridge-fields input { font-size: 1rem; }
.ratio-fields .input-shell { min-height: 48px; }
.ratio-input em { font-size: .875rem; }
.tool-result { font-size: 1.125rem; }
.compare-tool small,
.ratio-focus-heading small,
.ratio-context-strip > div:first-child small,
.bridge-tool .tool-title + small { color: var(--muted); font-size: .875rem; }
.compare-result { font-size: .9375rem; }
.bridge-fields button { font-size: .9375rem; min-height: 44px; }
.bridge-result { font-size: .9375rem; }
.terrain-preset { font-size: .875rem; min-height: 44px; padding: 9px 12px; }
.terrain-result { font-size: .9375rem; }
.terrain-result strong { font-size: 1.125rem; }
.notes-panel summary strong { font-size: 1.125rem; line-height: 1.35; }
.notes-grid p { font-size: .9375rem; }

/* Profile, explorer and nearby controls are instructional UI, not decoration. */
.context-panel { gap: 16px 20px; }
.context-label-wrap small { color: var(--muted); font-size: .9375rem; line-height: 1.5; margin-top: 6px; }
.context-controls > select,
.context-subcontrol select { min-height: 44px; }
.context-subcontrol { font-size: .875rem; line-height: 1.4; }
.context-subcontrol select { font-size: .9375rem; }
.nearby-guidance { font-size: .875rem; line-height: 1.45; }
.profile-feedback { font-size: .9375rem; line-height: 1.5; padding: 10px 12px; }
.theme-pick-heading small,
.custom-profile-editor > div:first-child small,
.custom-profile-editor > small { color: var(--muted); font-size: .875rem; line-height: 1.5; }
.theme-pick-row { gap: 12px; }
.custom-profile-fields label { font-size: .875rem; line-height: 1.4; }
.custom-profile-fields input { font-size: 1rem; min-height: 44px; }
.custom-profile-fields button:not(.reset-button) { font-size: .9375rem; min-height: 44px; }
.scale-explorer summary { min-height: 48px; }
.scale-explorer summary small,
.scale-explorer summary .tool-title,
.ratio-favorites-manager summary small { font-size: .875rem; line-height: 1.45; }
.explorer-node { font-size: .875rem; line-height: 1.4; }
.ratio-nearby-chip { font-size: .875rem; min-height: 44px; }

.favorite-subtitle,
.inline-manager summary,
.manager-popover label,
.ratio-favorite-content label,
.reset-button,
.picker-label,
.favorite-chip,
.ratio-favorite-chip,
.nearby-chip,
.nearby-heading small,
.nearby-chip small,
.ratio-favorites-manager summary small { font-size: .875rem; line-height: 1.4; }
.inline-manager summary { display: inline-flex; min-height: 44px; align-items: center; }
.manager-popover label,
.ratio-favorite-content label { color: var(--muted); }
.manager-form input { font-size: 1rem; min-height: 44px; }
.manager-form button { font-size: .9375rem; min-height: 44px; }
.managed-favorite { font-size: .875rem; min-height: 40px; padding: 6px 8px; }
.managed-favorite button { min-height: 32px; }
.reset-button { min-height: 44px; }
.picker-label { letter-spacing: .09em; }
.favorite-chip,
.ratio-favorite-chip,
.nearby-chip { min-height: 44px; padding: 8px 12px; }
.nearby-strip { gap: 20px; padding: 16px 0 17px; }
.nearby-heading { min-width: 150px; }
.nearby-heading small { margin-top: 6px; }
.ratio-context-list { gap: 8px; }
.ratio-focus-nearby .ratio-context-list { margin-top: 10px; }

/* Comparison annotations remain readable at the same scale as the surrounding UI. */
.visual-heading .eyebrow { font-size: .75rem; }
.visual-heading small { font-size: .875rem; line-height: 1.4; }
.silhouette-name { font-size: 1rem; line-height: 1.35; }
.silhouette-name span { font-size: .8125rem; letter-spacing: .08em; }
.silhouette-name b { font-size: 1rem; }
.dimension-line { font-size: .875rem; line-height: 1.35; }

@media (max-width: 680px) {
  .page-shell { padding-bottom: 42px; }
  .intro h1 { font-size: clamp(2.35rem, 13vw, 3.2rem); }
  .intro p { font-size: 1rem; }
  .site-header { gap: 12px; }
  .brand-lockup,
  .header-note { font-size: .75rem; }
  .panel h2 { font-size: 1.4rem; }
  .measure-field > span { font-size: .9375rem; }
  .input-shell { min-height: 50px; }
  .input-shell input { font-size: 1.125rem; }
  .input-shell select { font-size: .9375rem; }
  .size-inputs .input-shell select {
    flex-basis: 4.25rem;
    min-width: 4.25rem;
  }
  .result-label { font-size: 1rem; }
  .change-label { font-size: .875rem; }
  .context-label-wrap small { font-size: .9375rem; }
  .profile-feedback { font-size: .875rem; }
  .nearby-heading { min-width: 0; }
  .nearby-strip { padding: 16px 0 18px; }
  .nearby-list { gap: 8px; }
  .favorite-chip,
  .ratio-favorite-chip,
  .nearby-chip { font-size: .875rem; }
  .scale-visual { overflow: visible; }
  .visual-heading small { font-size: .8125rem; }
  .silhouette-name { font-size: .9375rem; }
  .silhouette-name span { font-size: .75rem; }
  .silhouette-name b { font-size: .9375rem; }
  .dimension-line { font-size: .875rem; }
  .site-footer { font-size: .75rem; line-height: 1.7; }
}

@media (max-width: 390px) {
  .section-index,
  .eyebrow { font-size: .6875rem; }
  .intro p { font-size: .9375rem; }
  .context-label-wrap small,
  .profile-feedback,
  .panel-lede,
  .notes-grid p { font-size: .875rem; }
}

@media (min-width: 681px) {
  .page-shell { padding-bottom: 60px; }
}