/* SSC shared presentation layer — 2026-10-30
   Page-specific map, chart, and data-table rules remain in each page. */
:root {
  --ssc-navy: #102a43;
  --ssc-blue: #1769aa;
  --ssc-blue-dark: #0f568f;
  --ssc-sky: #eaf4fb;
  --ssc-orange: #e87824;
  --ssc-focus: #d66715;
  --ssc-ink: #203040;
  --ssc-muted: #60758a;
  --ssc-line: #d7e3ec;
  --ssc-bg: #f4f8fb;
  --ssc-paper: #fff;
  --ssc-radius: 12px;
  --ssc-shadow: 0 7px 22px rgb(16 42 67 / 8%);

  /* Compatibility aliases used by existing modernized pages. */
  --navy: var(--ssc-navy);
  --blue: var(--ssc-blue);
  --blue2: var(--ssc-blue-dark);
  --sky: var(--ssc-sky);
  --orange: var(--ssc-orange);
  --ink: var(--ssc-ink);
  --muted: var(--ssc-muted);
  --line: var(--ssc-line);
  --bg: var(--ssc-bg);
  --paper: var(--ssc-paper);
}

*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: light; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ssc-bg);
  color: var(--ssc-ink);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
}
img, svg, canvas { max-width: 100%; }
button, input, select, textarea { font: inherit; }
button, select, input[type="checkbox"], input[type="radio"] { cursor: pointer; }
button:disabled, select:disabled, input:disabled { cursor: not-allowed; }
a { text-underline-offset: .16em; }

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--ssc-focus);
  outline-offset: 2px;
}

[hidden] { display: none !important; }
.ssc-card {
  background: var(--ssc-paper);
  border: 1px solid var(--ssc-line);
  border-radius: var(--ssc-radius);
  box-shadow: var(--ssc-shadow);
}
.ssc-muted { color: var(--ssc-muted); }
.ssc-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.ssc-skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 10000;
  transform: translateY(-150%);
  border-radius: 8px;
  background: var(--ssc-paper);
  color: var(--ssc-navy);
  padding: 10px 14px;
  box-shadow: var(--ssc-shadow);
  font-weight: 800;
}
.ssc-skip-link:focus { transform: translateY(0); }
:where(button, .button, .ssc-button, select, input[type="submit"]) { min-height: 40px; }
:target { scroll-margin-top: 16px; }

@media (forced-colors: active) {
  :where(a, button, input, select, textarea, summary):focus-visible {
    outline-color: Highlight;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media print {
  body { background: #fff; color: #000; }
  button, .controls, .toolbar { display: none !important; }
  a { color: #000; }
}
