/* App page routing and readable text-size standards */
.app-view:not(.is-active) {
  display: none !important;
}
.app-view.is-active {
  display: block;
}
.app-view {
  min-width: 0;
}
body {
  font-size: 16px;
  line-height: 1.6;
  color: #202b24;
}
body p {
  font-size: 14px !important;
  line-height: 1.65;
}
body small {
  font-size: 12px !important;
  line-height: 1.5;
}
.sidebar-label,
.sidebar-link,
.sidebar-status-top strong,
.sidebar-status a,
.sidebar-account strong,
.sidebar-account small,
.topbar-eyebrow,
.topbar-slash,
.topbar-context > strong,
.topbar-actions,
.section-kicker,
.overview-metric-label,
.overview-metric small,
.next-step-copy strong,
.next-step-copy span,
.next-step-link,
.estimate-label,
.reference-size,
.card-topline h3,
.required-note,
.form-intro,
.form-section h4,
.field > span:first-child,
.field > small,
.choice-option strong,
.choice-option small,
.form-footnote,
.result-label,
.result-tag,
.results-primary > p,
.result-metric-grid small,
.result-metric-grid strong,
.mini-result > span,
.mini-result > strong,
.analysis-heading strong,
.analysis-heading small,
.analysis-point,
.result-actions .text-link,
.result-disclaimer,
.package-fit,
.package-price small,
.package-price strong,
.package-price span,
.package-card li,
.featured-ribbon,
.price-table th,
.price-table td,
.price-table td strong,
.price-table td small,
.price-table a,
.type-chip,
.reference-match-note,
.pricing-note p,
.source-links,
.method-steps h3,
.method-steps p,
.method-copy > p,
.preview-badge {
  font-size: 12px !important;
  line-height: 1.55;
}
.sidebar-link,
.mobile-nav a {
  font-size: 13px !important;
  line-height: 1.45;
}
.sidebar-label {
  font-weight: 750;
}
.sidebar-status p {
  font-size: 12px !important;
}
.sidebar-status-top strong,
.sidebar-account strong,
.topbar-context > strong,
.next-step-copy strong,
.card-topline h3,
.form-section h4,
.results-header h3,
.analysis-heading strong,
.method-steps h3 {
  font-weight: 650;
}
.button,
button,
input,
select {
  font-size: 14px;
}
.button {
  line-height: 1.4;
}
.field > span:first-child {
  font-size: 13px !important;
  font-weight: 650;
}
.field input,
.field select,
.input-wrap {
  min-height: 44px;
}
.input-wrap input {
  min-height: 40px;
  font-size: 14px;
}
.field > small {
  min-height: 0;
}
.form-intro,
.form-footnote,
.result-disclaimer,
.reference-match-note,
.pricing-note p,
.source-links,
.price-table th,
.price-table td,
.package-price small,
.package-price span,
.package-card li,
.analysis-point,
.result-actions .text-link {
  font-size: 12px !important;
}
.result-metric-grid small,
.mini-result > span,
.mini-result > small,
.analysis-heading small {
  font-size: 12px !important;
}
.result-metric-grid strong,
.mini-result > strong,
.package-price strong {
  font-size: 16px !important;
}
.overview-metric strong {
  font-size: 21px;
}
.overview-metric-label,
.overview-metric small {
  font-size: 12px !important;
}
.section-heading h2 {
  font-size: 27px;
}
.workspace-heading h1 {
  font-size: clamp(32px, 3.2vw, 42px);
}
.section-kicker {
  letter-spacing: .8px;
}
.price-table td {
  min-width: 90px;
  padding: 15px 14px;
}
.price-table th {
  padding: 13px 14px;
}
.type-chip,
.package-fit,
.preview-badge,
.reference-date {
  font-size: 12px !important;
  line-height: 1.4;
}
.result-tag {
  font-size: 12px !important;
}
.form-section-icon,
.step-pill,
.method-number {
  font-size: 12px !important;
}
@media (max-width: 850px) {
  .app-section {
    scroll-margin-top: 64px;
  }
  .section-heading h2 {
    font-size: 25px;
  }
  .workspace-heading h1 {
    font-size: 32px;
  }
}
@media (max-width: 560px) {
  .workspace-heading h1 {
    font-size: 29px;
  }
  .section-heading h2 {
    font-size: 23px;
  }
  .overview-metric strong {
    font-size: 18px;
  }
  .field input,
  .field select {
    font-size: 14px;
  }
  .topbar-context > strong,
  .topbar-actions {
    font-size: 12px !important;
  }
}

.field input,
.field select,
.input-wrap input {
  font-size: 14px !important;
}
.input-wrap > span,
.input-wrap .input-unit,
.field > span:first-child b {
  font-size: 12px !important;
}
.result-actions .button {
  font-size: 13px !important;
}
.reference-date,
.account-avatar {
  font-size: 12px !important;
}


/* Navigation resilience: direct fragment links remain usable if calculator JS fails to load. */
body:not(.router-ready) .app-view:target {
  display: block !important;
}
body:not(.router-ready):has(.app-view:target) .app-view.is-active:not(:target) {
  display: none !important;
}
.app-view[aria-hidden="true"] {
  pointer-events: none;
}
