/* Reader-controlled sizes preserve browser zoom and the user's base font size. */
:root[data-text-size="large"] { font-size: 118%; }
:root[data-text-size="xl"] { font-size: 136%; }
body { font-size: 1rem; }
.a11y-bar {
  display:flex; flex-wrap:wrap; align-items:center; gap:.5rem;
  max-width:1180px; margin:0 auto; padding:12px 24px;
  font-size:1rem; color:var(--ink);
}
.a11y-label { font-weight:600; }
.a11y-bar button {
  min-height:44px; min-width:44px; padding:8px 12px;
  background:var(--card); color:var(--ink); border:2px solid var(--muted);
  border-radius:8px; font:inherit; cursor:pointer;
}
.a11y-bar button[aria-pressed="true"] { background:var(--ink); color:var(--card); border-color:var(--ink); font-weight:700; }
.a11y-bar button:focus-visible, .reader-skip:focus-visible { outline:3px solid var(--orange,var(--accent)); outline-offset:3px; }
.reader-skip { position:absolute; left:16px; top:-100px; z-index:20; padding:12px; background:var(--card); color:var(--ink); }
.reader-skip:focus { top:8px; }
.site-header, .site-header nav, .results-heading, .facts { flex-wrap:wrap; }
.hero > *, .career-card, .area-grid > *, .filters > * { min-width:0; }
.filters select { max-width:100%; }
.hero h1 { overflow-wrap:normal; }
/* Illustration lettering needs room when enlarged as well as readable controls. */
body.text-large .hero-art, body.text-xl .hero-art { min-height:430px; }
@media(max-width:700px) {
  .a11y-bar { padding:12px 16px; }
  .site-header { align-items:flex-start; }
  .site-header nav { gap:12px; }
  .area-grid { grid-template-columns:1fr; }
  .facts { grid-template-columns:1fr 1fr; }
  .filters { grid-template-columns:1fr; }
  .filters label:first-child { grid-column:auto; }
  .career-count { white-space:normal; }
  .field-header { flex-wrap:wrap; }
}
@media(forced-colors:active) {
  .a11y-bar button { border:2px solid ButtonText; }
  .a11y-bar button[aria-pressed="true"] { border:4px double Highlight; }
  .a11y-bar button:focus-visible { outline:3px solid Highlight; }
}
@media print { .a11y-bar, .reader-skip { display:none!important; } }
