/* Shared readable type. Loaded after each page's original styles.
   rem units respect the reader's preferred text size; colors stay page-owned. */
:root {
  --vd-text-body: 1rem;
  --vd-text-lead: 1.125rem;
  --vd-text-secondary: .875rem;
}

body { font-size: var(--vd-text-body); line-height: 1.5; }
body :is(p, li) { font-size: var(--vd-text-body); line-height: 1.6; }
body :is(small, label) { font-size: var(--vd-text-secondary); line-height: 1.5; }
body :is(button, a, p, li, h1, h2, h3, label, small) { overflow-wrap: anywhere; }
body :is(button, input, textarea, select) { min-width: 0; max-width: 100%; }
body button { white-space: normal; }
body :is(.shell, .app-shell, .card, .result-card, .detail-card, .decision,
  .modal-card, .view, .hero, .hero-card) { min-width: 0; }
body :is(.top, .topbar, .section-head, .detail-heading, .review-head,
  .profile-line, .price-choice, .trust-row, .after-link) { flex-wrap: wrap; gap: .625rem; }
body :is(.top, .topbar, .camera, .review-head, .history-item, .premium-card,
  .score-card, .alternative, .source-item, .step) > * { min-width: 0; }
body .profile-line > * { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }

/* The verdict stays prominent; the explanation is readable at arm's length. */
body :is(.sub, .hero p, .hero-card p, .card > p, .card p, .detail-card > p,
  .mini p, .mini article p, .result-card p, .recommendation p, .question,
  .caveat-card ul, .caveat-card li, .review-item, .review-warning,
  .defect, .comparable, .item, .auth-user p, .history-empty p,
  .loading-view > p, .modal-card > p, .modal-card > div > p,
  .step b, .step span:last-child, .watch-empty, .notice) {
  font-size: var(--vd-text-body);
  line-height: 1.6;
}
body .decision p { font-size: var(--vd-text-lead); line-height: 1.55; }
body .decision h2 { font-size: 2.625rem; line-height: 1.1; }
body .decision h2#decision { font-size: 2.8125rem; }
body .decision h2#word { font-size: 2.4375rem; }
body .score-copy h2 { font-size: 1.375rem; line-height: 1.3; }
body .score-ring strong { font-size: 2.1875rem; }
body .score-ring { width: 6.625rem; height: 6.625rem; }
body .savings-card strong { font-size: 1.875rem; }
body .price-box strong { font-size: 1.125rem; }
body .result-card .metric { font-size: 1.4375rem !important; }

/* Supporting text is a deliberate readable tier, rather than miniature type. */
body :is(.kicker, .eyebrow, .beta, .brand small, .brand-copy small,
  .status-badge, .section-head > div small, .section-head > span,
  .view-title-row small, .field-label, .field label, .field span, .field small,
  .two-fields label > span, .two-fields em, .auth-field span, .auth-note,
  .capture-button small, .capture-cta, .remove-image, .or-line,
  .camera small, .upload small, .photo small, .cal p,
  .mini small, .mini article small, .result-card h3, .decision small,
  .decision-label, .review-score, .review-impact, .detected,
  .detail-heading small, .score-copy p, .score-ring small, .verdict-pill,
  .savings-card small, .savings-card span, .alternative p, .source-item p,
  .alternative a, .source-item a, .history-item small, .qnum,
  .premium-copy span, .premium-copy p, .insight-card small,
  .category-grid small, .save-button-copy small, .after-link, .after-link b,
  .trust-row, .trust-row i, .loading-kicker, .loading-list,
  .note, .fine, .microcopy, .health-beta-note, .status, .profile-line,
  .direct, .tip, .meta, .pill, .foot, .price-box small,
  .account-legal-links a, .modal-card > small, .modal-card > div > small,
  .price-choice span small, .price-choice > strong small, .num) {
  font-size: var(--vd-text-secondary);
  line-height: 1.5;
}
body :is(.kicker, .eyebrow, .mini small, .result-card h3,
  .decision-label, .decision small, .field label, .field-label,
  .save-button-copy small, .premium-copy span) { letter-spacing: .045em; }
body .review-meta,
body .privacy { font-size: var(--vd-text-secondary) !important; line-height: 1.5; }
html body .footer { font-size: var(--vd-text-secondary) !important; line-height: 1.5 !important; }
body :is(.detail-heading span, .alternative b, .source-item b,
  .alternative span, .history-item b, .history-item strong, .premium-copy h3,
  .category-grid b, .camera b, .upload b, .photo b, .cal h3,
  .price-choice span b, .capture-button b) { font-size: var(--vd-text-body); line-height: 1.45; }
body .price-choice > strong { font-size: 1.25rem; line-height: 1.4; }
body :is(#authRecoveryRequest > p, #authRecoveryUpdate > p) { font-size: var(--vd-text-body); line-height: 1.6; }
body :is(.table th, .table td, .summary th, .summary td) {
  font-size: var(--vd-text-secondary); line-height: 1.6; overflow-wrap: anywhere;
}

/* Inputs and actions grow with text instead of clipping it. */
body :is(input, textarea, select, .field input, .field textarea, .field select,
  .auth-field input) {
  font-size: var(--vd-text-body);
  line-height: 1.5;
  height: auto;
  min-height: 3.125rem;
}
body :is(input[type="checkbox"], input[type="radio"], input[type="file"]) { min-height: 0; }
body :is(.price input, .price-wrap input) { font-size: var(--vd-text-lead); }
body :is(.price span, .price-wrap span, .money-field b) { top: 50%; transform: translateY(-50%); }
body :is(.cta, .primary, .secondary, .primary-action, .send, .install,
  .account-secondary, .account-delete, .account-feedback-link) {
  font-size: var(--vd-text-body); line-height: 1.4;
  min-height: 3.5rem; height: auto; padding: .875rem 1rem;
}
body :is(.chip, .photo-choice, .photo-btn, .photo-actions button,
  .actions button, .actions a, .decision-actions button, .feedback button,
  .auth-tabs button, .source, .sources a, .back, .share-btn, .text-link,
  .premium-btn, .category-strip button, .advanced-toggle, .auth-forgot,
  .detected button, .profile-line button) {
  font-size: var(--vd-text-secondary); line-height: 1.4;
  min-height: 2.75rem; height: auto; white-space: normal;
}
body :is(.source, .sources a, .back, .actions a) { max-width: 100%; }
body .source, body .sources a { display: inline-flex; align-items: center; }
body .category-strip { flex-wrap: wrap; overflow: visible; }
body .camera { align-items: flex-start; }
body .camera-icon { flex: 0 0 42px; }
body .photo-actions,
body .decision-actions,
body .decision-actions.two,
body .actions,
body .bottom-actions,
body .outcomes { grid-template-columns: repeat(auto-fit, minmax(min(100%, 8.5rem), 1fr)); }
/* The measured-beta renderer sets columns inline; preserve reflow after a result. */
body #decisionActions { grid-template-columns: repeat(auto-fit, minmax(min(100%, 8.5rem), 1fr)) !important; }
body :is(.two-fields, .two, .grid, .price-grid, .auth-tabs, .feedback .row) {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
}
body :is(.category-grid, .uploads, .photos, .optional-grid, .vertical-links) {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr));
}
body .vertical-link { font-size: var(--vd-text-secondary); line-height: 1.4; }
body .vertical-link span { font-size: var(--vd-text-secondary); line-height: 1.5; }
body .save-button { grid-template-columns: 44px minmax(0, 1fr) auto; padding: 1rem; }
body .save-button-copy b { font-size: 1.125rem; line-height: 1.35; }
body .step { grid-template-columns: 2rem minmax(0, 1fr); }
body .num { width: 2rem; height: 2rem; }

/* Full Valdict's fixed chrome must accommodate larger labels and long dialogs. */
body .topbar { height: auto; min-height: 4.875rem; }
body .brand { max-width: 100%; }
body .brand-mark, body .mark { flex-shrink: 0; }
body .top-actions { margin-left: auto; }
body .bottom-nav {
  height: auto; min-height: 5.5rem;
  grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .25rem;
  padding: .625rem .5rem max(.625rem, env(safe-area-inset-bottom));
}
body .bottom-nav button { font-size: var(--vd-text-secondary); line-height: 1.35; min-width: 0; padding: .25rem 0; }
body .bottom-nav .nav-save { width: min(3.75rem, 100%); height: auto; aspect-ratio: 1; margin-top: -.75rem; }
body .app-shell { padding-bottom: calc(8rem + env(safe-area-inset-bottom)); }
body .modal { padding: 1rem; overflow-y: auto; }
body .modal-card { max-height: calc(100dvh - 2rem); overflow-y: auto; overscroll-behavior: contain; }
body .modal-card h2 { padding-inline: .75rem; }
body .toast { font-size: var(--vd-text-secondary); line-height: 1.4; white-space: normal; overflow: visible; text-overflow: clip; text-align: center; max-width: calc(100vw - 2rem); }
body .result-top { flex-wrap: wrap; }
body .result-brand { font-size: var(--vd-text-secondary); }
body .price-choice > * { max-width: 100%; }
body .history-score { width: 2.75rem; height: 2.75rem; }
body .history-item { grid-template-columns: 2.75rem minmax(0, 1fr) auto; }
body .auth-forgot { max-width: 100%; }
body a[href^="/feedback.html"][style] { font-size: var(--vd-text-secondary) !important; line-height: 1.5; display: inline-block; padding-block: .5rem; }

@media (max-width: 28rem) {
  body .score-card { grid-template-columns: 1fr; }
  body .premium-card { grid-template-columns: auto minmax(0, 1fr); }
  body .premium-btn { grid-column: 1 / -1; }
  body .insight-card { grid-template-columns: 1fr; }
  body .insight-stat { border-left: 0; padding-left: 0; }
  body .text-link { grid-column: auto; }
  body .history-item { grid-template-columns: 2.75rem minmax(0, 1fr); }
  body .history-item > strong { grid-column: 2; }
  body :is(.alternative, .source-item, .savings-card) { grid-template-columns: 1fr; }
  body .topbar { padding-inline: 1rem; }
  body .save-button { grid-template-columns: 36px minmax(0, 1fr); }
  body .save-button-icon { width: 36px; height: 36px; }
  body .save-button-arrow { display: none; }
}
