/* Keyboard, contrast and reflow rules shared by all public entry points. */
:root :is(p, dd, li, .note) a:not(.button) {
  text-decoration: underline;
  text-underline-offset: 3px;
}
:root {
  --focus-ring: #f5f2e9;
  --control-border: #77736b;
}
html
  :where(
    button,
    a,
    input,
    select,
    textarea,
    summary,
    [tabindex]
  ):focus-visible {
  outline: 3px solid var(--focus-ring, #f5f2e9);
  outline-offset: 3px;
  scroll-margin-block: 90px;
}
html :where(button, summary, a):not(:where(.skip-link, .skip)) {
  min-height: 24px;
}
html
  :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not(
    [type="range"]
  ) {
  border-color: var(--control-border);
}
html :is(input, select, textarea)::placeholder {
  opacity: 1;
  color: #b5b1a8;
}
html .skip-link,
html .skip {
  z-index: 10000;
}
html [data-static-contrast] {
  font: inherit;
  border: 1px solid var(--control-border);
  border-radius: 7px;
  padding: 7px 12px;
  color: inherit;
  background: transparent;
  cursor: pointer;
}
.a11y-contrast-control {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 0;
  border-block: 1px solid var(--line);
  margin-bottom: 20px;
}
.a11y-contrast-control p {
  color: var(--muted);
  font-size: 12px;
  margin-top: 5px;
}
.a11y-help {
  line-height: 1.7;
}
.a11y-help dt {
  font-weight: 600;
  margin-top: 14px;
}
.a11y-help dd {
  margin: 3px 0 0;
  color: var(--muted);
}
.accessible-map-dialog {
  width: min(1050px, calc(100% - 24px)) !important;
}
.accessible-map-dialog .search-field {
  margin-bottom: 12px;
}
.map-accessible-description {
  margin: 10px 0 14px;
  color: var(--muted);
  font-size: 12px;
}
.accessible-map-table-wrap {
  min-width: 0;
  max-width: 100%;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  margin-top: 14px;
}
.map-stage > svg:focus-visible {
  outline-offset: -4px;
}
.chart-data {
  margin-top: 10px;
}
.chart-data > summary {
  min-height: 28px;
  color: var(--muted);
  font-size: 11px;
  cursor: pointer;
  padding: 5px 0;
}
.accessible-map-table {
  border-collapse: collapse;
  width: 100%;
  min-width: 650px;
  font-size: 12px;
}
.accessible-map-table caption {
  text-align: left;
  padding: 12px;
  font-weight: 600;
}
.accessible-map-table :is(th, td) {
  text-align: left;
  padding: 12px;
  border-block-end: 1px solid var(--line);
  vertical-align: top;
}
.accessible-map-table th {
  font-weight: 600;
}
.accessible-map-table th[scope="row"] {
  min-width: 150px;
}
.accessible-map-table th button {
  text-decoration: underline;
  text-underline-offset: 3px;
  min-height: 32px;
}
.accessible-map-table td small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}
.accessible-map-table-wrap:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 3px;
}
.map-pan-pad {
  position: absolute;
  left: 72px;
  bottom: 100px;
  z-index: 15;
  display: grid;
  grid-template-columns: repeat(3, 44px);
  gap: 3px;
  padding: 6px;
  border: 1px solid var(--control-border);
  border-radius: 12px;
  background: var(--surface, #131313);
}
.map-pan-pad button {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 5px;
}
.map-pan-pad button:hover {
  background: var(--surface-raised, #2a2a2a);
}
.map-pan-pad button:first-child {
  grid-column: 2;
}
.map-pan-pad button:nth-child(2) {
  grid-column: 1;
  grid-row: 2;
}
.map-pan-pad button:nth-child(3) {
  grid-column: 3;
  grid-row: 2;
}
.map-pan-pad button:last-child {
  grid-column: 2;
  grid-row: 3;
}
html .map-list-toggle {
  min-height: 36px;
}
html .map-list-toggle span {
  display: inline;
}
html[data-contrast="high"] {
  --bg: #000;
  --surface: #080808;
  --surface-raised: #141414;
  --text: #fff;
  --muted: #e0e0e0;
  --line: #8c8c8c;
  --line-soft: #737373;
  --accent: #fff;
  --control-border: #bcbcbc;
  --focus-ring: #ffdf68;
}
html[data-contrast="high"] body {
  background: #000;
  color: #fff;
}
html[data-contrast="high"]
  :is(
    .panel,
    .modal,
    .site-header,
    .site-footer,
    .filterbar,
    .timeline,
    .map-preview,
    .sponsor-banner,
    .note,
    .select-menu-popover,
    .map-key-body,
    .map-info-body
  ) {
  background: #080808 !important;
  border-color: #8c8c8c !important;
  backdrop-filter: none !important;
}
html[data-contrast="high"]
  :is(
    p,
    small,
    label,
    dt,
    dd,
    th,
    td,
    h1,
    h2,
    h3,
    h4,
    span,
    strong,
    b,
    button,
    a,
    summary
  ) {
  color: inherit !important;
  text-shadow: none !important;
}
html[data-contrast="high"] :is(button, input, select, textarea, summary) {
  color: #fff;
}
html[data-contrast="high"] :is(input, select, textarea) {
  background: #141414 !important;
  border-color: #bcbcbc !important;
}
html[data-contrast="high"]
  :is(
    .primary,
    button[aria-pressed="true"],
    button[aria-selected="true"],
    button.selected
  ) {
  color: #000 !important;
  background: #fff !important;
  border-color: #fff !important;
}
html[data-contrast="high"]
  :is(.primary, button[aria-pressed="true"], button.selected)
  * {
  color: inherit !important;
}
html[data-contrast="high"] :is(.presentation-shell, .app-shell) {
  --map-panel: #080808 !important;
  --map-panel-soft: #080808 !important;
}
@media (prefers-contrast: more) {
  html:not([data-contrast="standard"]) {
    --text: #fff;
    --muted: #dedede;
    --line: #888;
    --line-soft: #666;
    --control-border: #bbb;
    --focus-ring: #ffdf68;
  }
}
@media (forced-colors: active) {
  html {
    --text: CanvasText;
    --muted: CanvasText;
    --bg: Canvas;
    --surface: Canvas;
    --surface-raised: Canvas;
    --line: CanvasText;
    --line-soft: CanvasText;
    --accent: Highlight;
    --focus-ring: Highlight;
    --control-border: ButtonText;
  }
  html :is(button, input, select, textarea, summary) {
    border: 1px solid ButtonText !important;
  }
  html
    :is(button[aria-pressed="true"], button.selected, [aria-selected="true"]) {
    outline: 2px solid Highlight;
  }
  html :is(.map-stage svg, .map-stage canvas) {
    forced-color-adjust: none;
  }
  html a {
    color: LinkText;
  }
}
@media (prefers-reduced-motion: reduce) {
  html *,
  html *::before,
  html *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
@media (max-width: 700px) {
  html
    :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not(
      [type="range"]
    ) {
    font-size: 16px;
  }
  html
    :is(
      .icon-button,
      .map-controls button,
      .prompt-actions button,
      .a11y-contrast-control button
    ) {
    min-width: 44px;
    min-height: 44px;
  }
  .a11y-contrast-control {
    align-items: flex-start;
  }
}
@media (max-width: 420px) {
  .a11y-contrast-control {
    flex-direction: column;
    gap: 12px;
  }
  .a11y-contrast-control .button {
    width: 100%;
    justify-content: center;
  }
}