.modern-subpage #content.na-page {
  --eq-accent: #2d6858;
  --na-fill: #3d806c;
  --na-grid: #a5beb3;
  --na-track: #dce8e2;
  --na-error: #9b333b;
}
.na-page .na-toolbar,
.na-page .na-summary-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
}
.na-page .na-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
.na-page .na-chips,
.na-page .na-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0;
  margin: 18px 0;
}
.na-page .na-chips li,
.na-page .na-shortcuts a {
  list-style: none;
  margin: 0;
  padding: 5px 10px;
  border: 1px solid var(--eq-line);
  border-radius: 6px;
  background: var(--eq-soft);
  color: var(--eq-ink);
  font-size: 13px;
}
.na-page .na-shortcuts a { min-height: 44px; display: inline-flex; align-items: center; }
.na-page :is(#na-intro, #na-question-heading, #na-result-heading, .eq-section) { scroll-margin-top: 88px; }
.na-page .na-small-legend { min-height: 0; font-size: 17px; }
.na-page .na-panel, .na-page .na-result-head {
  padding: 16px;
  border: 1px solid var(--eq-line);
  border-radius: 7px;
  background: var(--eq-soft);
  margin-block: 12px;
}
.na-page .na-result-head { padding: 24px 18px; border-top: 4px solid var(--eq-accent); }
.na-page .na-overall output {
  font-size: clamp(26px, 6vw, 38px);
  font-weight: 750;
  color: var(--eq-accent);
  font-variant-numeric: tabular-nums;
}
.na-page .na-panel h3 { margin-top: 0; }
.na-page .na-status { min-height: 24px; }
.modern-subpage #content.na-page .na-status { color: var(--eq-accent); font-size: 14px; }
.modern-subpage #content.na-page .na-error { color: var(--na-error); }
.na-page .na-domain-info { border-top: 1px solid var(--eq-line); padding-block: 12px; }
.na-page .na-domain-info h4 { font-size: 17px; color: var(--eq-ink); margin-bottom: 10px; }
.na-page .na-definitions dt { font-weight: 700; margin-top: 12px; color: var(--eq-ink); }
.na-page .na-definitions dd { margin: 4px 0 12px; color: var(--eq-muted); overflow-wrap: anywhere; }
.na-page .eq-bar { background: var(--na-track); }
.na-page .eq-bar span { background: var(--na-fill); }
.na-page .na-radar { max-width: 600px; margin: 0 auto; }
.na-page .na-radar svg { display: block; width: 100%; height: auto; }
.na-page .na-radar text { fill: var(--eq-ink); font: 20px sans-serif; }
.na-page .na-radar .na-scale { font-size: 15px; fill: var(--eq-muted); }
.na-page .na-gridline { fill: none; stroke: var(--na-grid); stroke-width: 1.1; }
.na-page .na-profile { fill: var(--na-fill); fill-opacity: .18; stroke: var(--na-fill); stroke-width: 3; }
.na-page .na-dot { fill: var(--na-fill); }
.na-page .na-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 14px; }
.na-page .na-table caption { text-align: left; color: var(--eq-muted); margin: 8px 0; }
.na-page .na-table :is(th, td) { padding: 8px 4px; border-bottom: 1px solid var(--eq-line); color: var(--eq-ink); overflow-wrap: anywhere; }
.na-page .na-table th:first-child { width: 48%; }
.na-page .na-check { display: flex; align-items: center; gap: 10px; min-height: 44px; color: var(--eq-ink); cursor: pointer; }
.modern-subpage #content.na-page input[type=checkbox] {
  appearance: auto; display: block; position: static; float: none; opacity: 1;
  pointer-events: auto; width: 19px; height: 19px; margin: 0; flex: 0 0 19px; accent-color: #267c7b;
}
.modern-subpage #content.na-page :is(select, textarea) {
  display: block;
  width: 100%;
  min-height: 44px;
  height: auto;
  color: var(--eq-ink);
  background: var(--eq-panel);
  border: 1px solid var(--eq-line);
  border-radius: 6px;
  padding: 8px 12px;
  font: inherit;
  margin: 6px 0 12px;
}
.modern-subpage #content.na-page textarea { min-height: 78px; resize: vertical; }
.na-page :is(a, button, input, select, textarea, summary, legend):focus-visible {
  outline: 3px solid var(--eq-accent);
  outline-offset: 3px;
}
.modern-subpage #content.na-page.na-dark {
  color-scheme: dark;
  --eq-panel: #182c2b;
  --eq-soft: #213b37;
  --eq-ink: #e9f5f0;
  --eq-muted: #c1d8d0;
  --eq-line: #4f7167;
  --eq-accent: #a5e5ce;
  --na-fill: #8ed7bd;
  --na-track: #36564e;
  --na-grid: #5e8a7c;
  --na-error: #ffb7bd;
  background: var(--eq-panel);
}
.modern-subpage #content.na-page.na-dark :is(h2, h3, h4, strong, label) { color: var(--eq-ink); }
.modern-subpage #content.na-page.na-dark :is(.eq-notice, .eq-options label:has(input:checked)) { background: #294d43; }
@media (max-width: 600px) {
  .na-page .na-toolbar, .na-page .na-summary-grid { grid-template-columns: 1fr; }
  .na-page #na-start { width: 100%; }
  .na-page .eq-domain-heading { flex-wrap: wrap; gap: 3px 8px; }
  .na-page .na-radar text { font-size: 23px; }
  .na-page .na-radar .na-scale { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  .na-page *, .na-page *::before, .na-page *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

.modern-subpage #content.na-page :is(input[type=text], input[type=date]) {
  display: block; width: 100%; min-height: 44px; height: auto; box-sizing: border-box;
  color: var(--eq-ink); background: var(--eq-panel); border: 1px solid var(--eq-line);
  border-radius: 6px; padding: 8px 12px; font: inherit; margin: 6px 0 12px;
}
.na-page .na-panel h4 { color: var(--eq-ink); }
.na-page #na-talk-copy-fallback textarea { min-height: 220px; }

.na-page .na-auxiliary { border-inline-start: 4px solid #727c9d; }
.na-page .na-auxiliary .eq-bar span { background: #727c9d; }
.na-page .na-table th:first-child { width: 37%; }
.na-page .na-table { font-size: 13px; }
.na-page .na-panel h3 { line-height: 1.6; }
.modern-subpage #content.na-page button:not(.eq-primary):hover {
  color: var(--eq-ink);
  background: var(--eq-soft);
}

.na-page #na-criteria-preview { white-space: pre-line; }
.na-page .na-domain-info { scroll-margin-top: 90px; }
.na-page #na-criteria-options { margin: 10px 0 18px; }
.modern-subpage #content.na-page.na-dark a { color: var(--eq-accent); }
@media (max-width: 600px) {
  .modern-subpage #content.na-page h1 { font-size: 27px; }
}