/* HavenScout guide page styles. Externalized for CSP. */
.guide-intro{margin-bottom:32px}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:var(--hs-dark-page);color:var(--hs-cream);line-height:1.7;display:flex;flex-direction:column}

/* NAV — topbar-row1 styled by map.css; guide nav strip below */
/* Guide topbar: part of fixed header, not sticky */
.topbar { flex-shrink: 0; position: relative; }
main#main-content { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.topbar-guide-nav {
  display: none;
  position: absolute;
  top: 55px;
  left: 190px;
  right: auto;
  z-index: 50;
  width: min(620px, calc(100vw - 220px));
  max-height: min(70vh, 520px);
  padding: 12px;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 0 0 10px 10px;
  background: rgba(var(--hs-dark-page-rgb),0.98);
  box-shadow: 0 18px 38px rgba(0,0,0,0.36);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.topbar.nav-open .topbar-guide-nav { display: block; }
/* Sections opens the About-page section dropdown on every viewport. */
.guide-nav-toggle { display: inline-flex; }
.nav-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.nav-links a{font-size:10px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:rgba(var(--hs-cream-rgb),0.5);text-decoration:none;padding:7px 10px;border-radius:4px;border:1px solid rgba(255,255,255,0.08);transition:all .15s;display:flex;align-items:center;min-height:32px}
.nav-links a:hover{background:rgba(255,255,255,0.06);color:var(--hs-cream)}
.guide-back-top{display:inline-flex;margin-top:14px;color:var(--hs-link-blue);text-decoration:none;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.guide-back-top:hover{text-decoration:underline}
#guide-top{scroll-margin-top:8px}

/* LAYOUT */
.page{max-width:860px;margin:0 auto;padding:40px 24px 80px}

/* SECTIONS */
.section{margin-bottom:48px}
.section-header{display:flex;align-items:flex-start;gap:14px;margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,0.07)}
.section-icon{font-size:28px;flex-shrink:0;margin-top:2px}
.section-flag-icon{display:flex;align-items:center;width:30px;height:24px;margin-top:5px}
.section-flag-img{display:block;width:30px;height:20px;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
.section-header-text h2{font-family:'Playfair Display',serif;font-size:22px;color:var(--hs-gold-bright);margin-bottom:4px}
.section-heading-link{color:inherit;text-decoration:none;text-underline-offset:4px}
.section-heading-link:hover,.section-heading-link:focus-visible{text-decoration:underline}
.section-header-text p{font-size:13px;color:rgba(var(--hs-cream-rgb),0.5)}
.section-subtitle{font-size:13px;color:rgba(var(--hs-cream-rgb),0.5)}

/* CARDS */
.card{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);border-radius:10px;padding:18px 20px;margin-bottom:12px}
.card h3{font-size:14px;font-weight:600;color:var(--hs-cream);margin-bottom:8px;display:flex;align-items:center;gap:8px}
.card p{font-size:12.5px;color:rgba(var(--hs-cream-rgb),0.62);line-height:1.75;margin-bottom:8px}
.card p:last-child{margin-bottom:0}
.card ul{padding-left:16px;font-size:12.5px;color:rgba(var(--hs-cream-rgb),0.62);line-height:1.85}
.card ul li{margin-bottom:3px}
.intro-card{background:rgba(var(--hs-link-blue-rgb),0.06);border-color:rgba(var(--hs-link-blue-rgb),0.15)}
.source-card{background:rgba(66,133,244,0.05);border-color:rgba(66,133,244,0.15)}
.guide-warning{background:rgba(192,57,43,.12);border:1px solid rgba(var(--hs-danger-rgb),.42);border-left:4px solid var(--hs-danger);border-radius:8px;padding:16px 18px;margin-top:12px}
.guide-warning-title{color:#ffb09f;font-size:13px;font-weight:700;margin-bottom:6px}
.guide-warning p{color:rgba(255,255,255,.74);font-size:12px;line-height:1.65;margin:5px 0}
.formula-box{background:rgba(var(--hs-link-blue-rgb),.08);border:1px solid rgba(var(--hs-link-blue-rgb),.2);border-radius:6px;color:rgba(var(--hs-cream-rgb),.78);font-size:12px;line-height:1.6;margin-top:12px;padding:10px 12px}
.method-warning{background:rgba(var(--hs-gold-bright-rgb),.08);border-left:3px solid var(--hs-gold-bright);padding:9px 11px;margin-top:10px}
.guide-healthcare-disclaimer{color:var(--hs-gold-bright);font-weight:700}
.status-live{color:var(--hs-success);font-weight:600}
.status-api{color:var(--hs-link-blue);font-weight:600}

/* SOURCE BADGE */
.source{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:2px 8px;border-radius:4px;margin-right:5px;margin-bottom:5px}
.source.live{background:rgba(var(--hs-success-deep-rgb),0.2);color:var(--hs-success);border:1px solid rgba(var(--hs-success-deep-rgb),0.3)}
.source.static{background:rgba(255,255,255,0.07);color:rgba(var(--hs-cream-rgb),0.5);border:1px solid rgba(255,255,255,0.1)}
.source.editorial{background:rgba(var(--hs-link-blue-rgb),0.15);color:var(--hs-link-blue);border:1px solid rgba(var(--hs-link-blue-rgb),0.25)}
.sources-row{margin-top:10px;display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.sources-row a.ext{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;min-height:24px;padding:2px 8px;border:1px solid rgba(var(--hs-link-blue-rgb),.34);border-radius:4px;line-height:1.3;background:transparent;text-decoration:none}

/* WEIGHT TABLE */
.weight-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:10px}
.weight-table th{text-align:left;font-size:10px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:rgba(var(--hs-cream-rgb),0.35);padding:6px 10px;border-bottom:1px solid rgba(255,255,255,0.08)}
.weight-table td{padding:8px 10px;border-bottom:1px solid rgba(255,255,255,0.05);color:rgba(var(--hs-cream-rgb),0.7);vertical-align:top}
.weight-table tr:last-child td{border-bottom:none}
.weight-table td:first-child{font-weight:600;color:var(--hs-cream);width:160px}
.weight-table td.pct{color:var(--hs-link-blue);font-weight:700;width:50px}

/* COLOR SCALE */
.color-scale{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.color-scale.guide-mb-6{margin-bottom:6px}
.color-scale.guide-mb-8{margin-bottom:8px}
.cs-item{display:flex;align-items:center;gap:6px;font-size:11px;color:rgba(var(--hs-cream-rgb),0.65)}
.cs-dot{width:11px;height:11px;border-radius:50%;flex-shrink:0}
.cs-dot.guide-bg-deep-green{background:var(--hs-success-deep)}
.cs-dot.guide-bg-green{background:var(--hs-success)}
.cs-dot.guide-bg-lime{background:var(--hs-lime)}
.cs-dot.guide-bg-gold{background:var(--hs-gold-bright)}
.cs-dot.guide-bg-orange{background:var(--hs-orange-strong)}
.cs-dot.guide-bg-orange-2{background:var(--hs-orange)}
.cs-dot.guide-bg-salmon{background:var(--hs-danger)}
.cs-dot.guide-bg-red{background:var(--hs-red)}
.cs-dot.guide-bg-blue{background:var(--hs-link-blue)}
.cs-dot.guide-bg-purple{background:var(--hs-purple)}
.guide-text-green{color:var(--hs-success)}
.guide-text-gold{color:var(--hs-gold-bright)}
.guide-text-orange{color:var(--hs-orange)}
.guide-text-warm{color:#e8a87c}
.guide-text-salmon{color:var(--hs-danger)}
.guide-mt-8{margin-top:8px}
.guide-mt-10{margin-top:10px}
.guide-inline-code{font-size:11px;background:rgba(255,255,255,0.06);padding:1px 5px;border-radius:3px}

/* TREND ARROWS — crime section */
.trend-up     { color: var(--hs-red); font-weight: 700; }
.trend-stable { color: rgba(var(--hs-cream-rgb),0.55); font-weight: 700; }
.trend-down   { color: var(--hs-success-deep); font-weight: 700; }

/* MUTED TABLE CELL TEXT — update frequency table */
.tbl-muted    { color: rgba(var(--hs-cream-rgb),0.55); }

/* LIGHT MODE OVERRIDES for trend + muted text */
body.light-mode .trend-up     { color: var(--hs-danger-dark); }
body.light-mode .trend-stable { color: #4a5568; text-shadow: -0.4px -0.4px 0 rgba(var(--hs-dark-page-rgb),0.12), 0.4px -0.4px 0 rgba(var(--hs-dark-page-rgb),0.12), -0.4px 0.4px 0 rgba(var(--hs-dark-page-rgb),0.12), 0.4px 0.4px 0 rgba(var(--hs-dark-page-rgb),0.12); }
body.light-mode .trend-down   { color: var(--hs-success-dark); }
body.light-mode .tbl-muted    { color: rgba(var(--hs-dark-page-rgb),0.52); }
body.light-mode .section-subtitle{color:rgba(var(--hs-dark-page-rgb),.62)}
body.light-mode .intro-card,
body.light-mode .source-card{background:#fff;border-color:rgba(15,45,78,.16)}
body.light-mode .guide-warning{background:#fff0ed;border-color:rgba(155,47,36,.3);border-left-color:#b54234}
body.light-mode .guide-warning-title{color:#8f2d24}
body.light-mode .guide-warning p{color:var(--hs-slate-text)}
body.light-mode .formula-box{background:#eef6fc;border-color:rgba(30,88,130,.22);color:var(--hs-slate-text)}
body.light-mode .method-warning{background:#fff8df;border-left-color:var(--hs-warning-dark);color:var(--hs-slate-text)}
body.light-mode .guide-healthcare-disclaimer{color:var(--hs-gold-dark) !important}
body.light-mode .status-live{color:var(--hs-success-dark)}
body.light-mode .status-api{color:var(--hs-data-navy)}
body.light-mode .sources-row a.ext{background:transparent;border-color:rgba(var(--hs-data-navy-rgb),.34);color:var(--hs-data-navy)}

/* ACCESSIBILITY + LIGHT overrides */
body.a11y.light-mode .trend-up     { color: var(--hs-danger-dark) !important; }
body.a11y.light-mode .trend-stable { color: var(--hs-slate-text) !important; text-shadow: -0.4px -0.4px 0 rgba(var(--hs-dark-page-rgb),0.15), 0.4px -0.4px 0 rgba(var(--hs-dark-page-rgb),0.15), -0.4px 0.4px 0 rgba(var(--hs-dark-page-rgb),0.15), 0.4px 0.4px 0 rgba(var(--hs-dark-page-rgb),0.15) !important; }
body.a11y.light-mode .trend-down   { color: var(--hs-success-dark) !important; }
body.a11y.light-mode .tbl-muted    { color: rgba(var(--hs-dark-page-rgb),0.62) !important; }

/* DARK A11Y overrides — ensure trend arrows stay readable */
body.a11y .trend-up     { color: #ff8a76 !important; }
body.a11y .trend-stable { color: rgba(255,255,255,0.65) !important; }
body.a11y .trend-down   { color: var(--hs-success) !important; }
body.a11y .tbl-muted    { color: rgba(255,255,255,0.60) !important; }
body.a11y .guide-warning p,
body.a11y .formula-box,
body.a11y .method-warning{font-size:14px !important;line-height:1.65 !important}
body.a11y .guide-healthcare-disclaimer{color:#ffd36d !important}

/* DISCLAIMER */
.disclaimer{background:rgba(240,180,50,0.08);border:1px solid rgba(240,180,50,0.2);border-radius:10px;padding:16px 20px;margin-top:40px}
.disclaimer h3{font-size:13px;font-weight:600;color:var(--hs-gold-bright);margin-bottom:8px}
.disclaimer p{font-size:12px;color:rgba(var(--hs-cream-rgb),0.55);line-height:1.75}

/* LINKS */
a.ext{color:var(--hs-link-blue);text-decoration:none}
a.ext:hover{background:rgba(var(--hs-link-blue-rgb),.1);text-decoration:underline}
.sources-row a.ext:hover{background:rgba(var(--hs-link-blue-rgb),.1)}
body.light-mode .sources-row a.ext:hover{background:rgba(var(--hs-data-navy-rgb),.08)}

/* RESPONSIVE */
@media(max-width:768px){
  .page{padding:24px 16px 60px}
  .section-header h2{font-size:18px}
  .card{padding:15px 14px}
  .weight-table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .guide-back-top{margin-top:12px}
  #composite .weight-table {
    display:block;
    overflow:visible;
    border-collapse:separate;
    border-spacing:0;
  }
  #composite .weight-table tr:first-child {
    display:none;
  }
  #composite .weight-table tbody,
  #composite .weight-table tr,
  #composite .weight-table td {
    display:block;
    width:auto;
  }
  #composite .weight-table tr {
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:8px 10px;
    margin:0 0 12px;
    padding:12px;
    background:rgba(255,255,255,0.04);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:8px;
  }
  #composite .weight-table td {
    padding:0;
    border-bottom:0;
  }
  #composite .weight-table td::before {
    display:block;
    margin-bottom:2px;
    color:rgba(var(--hs-cream-rgb),0.42);
    font-size:9px;
    font-weight:700;
    letter-spacing:.07em;
    line-height:1.2;
    text-transform:uppercase;
  }
  #composite .weight-table td:first-child {
    min-width:0;
    width:auto;
  }
  #composite .weight-table td:first-child::before {
    content:"Factor";
  }
  #composite .weight-table td.pct {
    width:auto;
    min-width:48px;
    text-align:right;
  }
  #composite .weight-table td.pct::before {
    content:"Weight";
  }
  #composite .weight-table td:nth-child(3) {
    grid-column:1 / -1;
    margin-top:2px;
    padding:10px 11px;
    background:rgba(var(--hs-link-blue-rgb),0.07);
    border:1px solid rgba(var(--hs-link-blue-rgb),0.14);
    border-radius:6px;
    line-height:1.65;
  }
  #composite .weight-table td:nth-child(3)::before {
    content:"How it's scored";
  }
  body.light-mode #composite .weight-table tr {
    background:#fff;
    border-color:rgba(var(--hs-haven-navy-rgb),0.12);
  }
  body.light-mode #composite .weight-table td::before {
    color:rgba(var(--hs-dark-page-rgb),0.52);
  }
  body.light-mode #composite .weight-table td:nth-child(3) {
    background:#eef6fc;
    border-color:rgba(30,88,130,0.18);
  }
  body.a11y #composite .weight-table tr {
    border-color:rgba(255,255,255,0.16) !important;
  }
  body.a11y #composite .weight-table td:nth-child(3) {
    border-color:rgba(var(--hs-link-blue-rgb),0.24) !important;
  }
  body.a11y.light-mode #composite .weight-table tr {
    background:#fff !important;
    border-color:rgba(var(--hs-haven-navy-rgb),0.18) !important;
  }
  body.a11y.light-mode #composite .weight-table td::before {
    color:rgba(var(--hs-dark-page-rgb),0.62) !important;
  }
  body.a11y.light-mode #composite .weight-table td:nth-child(3) {
    background:#eef6fc !important;
    border-color:rgba(30,88,130,0.24) !important;
  }
  .sources-row a.ext{max-width:100%;overflow-wrap:anywhere}

  /* ── Anchor nav: hidden until Sections btn pressed ── */
  .topbar-guide-nav {
    display: none !important;
    position: static !important;
    width: auto !important;
    max-height: calc(100vh - 76px) !important;
    padding: 5px 10px !important;
    border: 0 !important;
    border-top: 1px solid rgba(255,255,255,0.06) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .topbar.nav-open .topbar-guide-nav {
    display: block !important;
  }
  .nav-links {
    display: flex !important;
    flex-wrap: wrap !important;  /* wraps onto multiple rows */
    gap: 4px !important;
  }
  .nav-links a {
    font-size: 9px !important;
    padding: 4px 8px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
  }
}


/* ── Screen-reader only utility ── */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* ── Skip to main content link ── */
.skip-link {
  position: fixed;
  top: -100px;
  left: 16px;
  z-index: 10000;
  background: var(--hs-gold);
  color: #1a1000;
  font-weight: 700;
  font-size: 14px;
  padding: 10px 18px;
  border-radius: 0 0 8px 8px;
  text-decoration: none;
  transition: top 0.15s;
}
.skip-link:focus {
  top: 0;
}

/* ── Nav link focus styles ── */
.nav-links a:focus-visible {
  outline: 2px solid rgba(var(--hs-link-blue-rgb),0.8);
  outline-offset: 3px;
  border-radius: 3px;
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
    scroll-behavior: auto !important;
  }
}


/* ══════════════════════════════════════════════════════════════════
   LIGHT MODE — body.light-mode overrides for data guide
   ══════════════════════════════════════════════════════════════════ */

/* Base */
body.light-mode { background: var(--hs-warm-cream) !important; color: var(--hs-dark-page) !important; }

/* Nav */
/* topbar-row1 light mode handled by map.css */
body.light-mode .topbar-guide-nav {
  background: var(--hs-warm-cream) !important;
  border-color: rgba(var(--hs-haven-navy-rgb),0.14) !important;
  border-top-color: rgba(var(--hs-haven-navy-rgb),0.08) !important;
  box-shadow: 0 18px 38px rgba(var(--hs-dark-page-rgb),0.12) !important;
}
body.light-mode main#main-content {
  background: var(--hs-warm-cream);
}
body.light-mode .nav-links a {
  color: rgba(var(--hs-dark-page-rgb),0.55) !important;
  border-color: rgba(var(--hs-haven-navy-rgb),0.14) !important;
}
body.light-mode .nav-links a:hover {
  background: rgba(var(--hs-haven-navy-rgb),0.06) !important;
  color: var(--hs-haven-navy) !important;
}
body.light-mode .guide-back-top {
  color: var(--hs-data-navy) !important;
}
body.light-mode .guide-back-top:hover {
  color: var(--hs-haven-navy) !important;
}

/* Sections */
body.light-mode .section-header { border-bottom-color: rgba(var(--hs-haven-navy-rgb),0.10) !important; }
body.light-mode .section-header-text h2 { color: var(--hs-gold-dark) !important; }
body.light-mode .section-header-text p  { color: rgba(var(--hs-dark-page-rgb),0.48) !important; }

/* Cards */
body.light-mode .card {
  background: rgba(var(--hs-haven-navy-rgb),0.04) !important;
  border-color: rgba(var(--hs-haven-navy-rgb),0.12) !important;
}
body.light-mode .card h3    { color: var(--hs-haven-navy) !important; }
body.light-mode .card p,
body.light-mode .card ul    { color: rgba(var(--hs-dark-page-rgb),0.68) !important; }

/* Source badges */
body.light-mode .source.live {
  background: rgba(20,110,50,0.10) !important;
  color: var(--hs-success-dark) !important;
  border-color: rgba(20,110,50,0.25) !important;
}
body.light-mode .source.static,
body.a11y.light-mode .source.static {
  background: rgba(var(--hs-haven-navy-rgb),0.07) !important;
  color: rgba(var(--hs-dark-page-rgb),0.68) !important;
  border-color: rgba(var(--hs-haven-navy-rgb),0.20) !important;
}
body.light-mode .source.editorial {
  background: rgba(var(--hs-data-navy-rgb),0.08) !important;
  color: var(--hs-data-navy) !important;
  border-color: rgba(var(--hs-data-navy-rgb),0.18) !important;
}

/* Weight table */
body.light-mode .weight-table th {
  color: rgba(var(--hs-dark-page-rgb),0.42) !important;
  border-bottom-color: rgba(var(--hs-haven-navy-rgb),0.12) !important;
}
body.light-mode .weight-table td {
  color: rgba(var(--hs-dark-page-rgb),0.72) !important;
  border-bottom-color: rgba(var(--hs-haven-navy-rgb),0.07) !important;
}
body.light-mode .weight-table td:first-child { color: var(--hs-haven-navy) !important; }
body.light-mode .weight-table td.pct         { color: var(--hs-data-navy) !important; }

/* Colour scale */
body.light-mode .cs-item { color: rgba(var(--hs-dark-page-rgb),0.68) !important; }

/* Disclaimer callout */
body.light-mode .disclaimer {
  background: rgba(var(--hs-gold-rgb),0.08) !important;
  border-color: rgba(var(--hs-gold-rgb),0.28) !important;
}
body.light-mode .disclaimer h3 { color: var(--hs-gold-dark) !important; }
body.light-mode .disclaimer p  { color: rgba(var(--hs-dark-page-rgb),0.60) !important; }

/* External links */
body.light-mode a.ext       { color: var(--hs-data-navy) !important; }

/* ══════════════════════════════════════════════════════════════════
   ACCESSIBILITY MODE — body.a11y overrides for data guide
   ══════════════════════════════════════════════════════════════════ */

/* Backgrounds → near-black */
body.a11y,
body.a11y .topbar           { background: var(--hs-a11y-bg) !important; }
body.a11y .card             { background: var(--hs-a11y-panel) !important; border-color: rgba(255,255,255,0.12) !important; }
body.a11y .section-header   { background: rgba(255,255,255,0.04) !important; }

/* All muted/low-opacity text → white */
body.a11y p,
body.a11y li                { color: rgba(255,255,255,0.9) !important; font-size: 15px !important; line-height: 1.7 !important; }
body.a11y h2                { color: var(--hs-clean-white) !important; font-size: 20px !important; }
body.a11y h3                { color: rgba(255,255,255,0.92) !important; font-size: 16px !important; }
body.a11y .source           { color: rgba(255,255,255,0.75) !important; font-size: 13px !important; }
body.a11y .section-header-text { color: var(--hs-clean-white) !important; }
body.a11y .disclaimer       { color: rgba(255,255,255,0.8) !important; font-size: 13px !important; }

/* Nav links */
body.a11y .nav-links a      { color: var(--hs-clean-white) !important; font-size: 13px !important;
                              min-height: 44px !important; display: inline-flex !important;
                              align-items: center !important; padding: 0 10px !important;
                              border-color: rgba(255,255,255,0.25) !important; }
body.a11y .guide-back-top   { color: var(--hs-clean-white) !important; font-size: 13px !important;
                              background: rgba(255,255,255,0.06) !important; }
body.a11y .topbar h1        { color: var(--hs-clean-white) !important; font-size: 18px !important; }
body.a11y .topbar p         { color: rgba(255,255,255,0.65) !important; font-size: 13px !important; }

/* Borders → white */
body.a11y .topbar           { border-bottom-color: rgba(255,255,255,0.15) !important; }
body.a11y .card             { border-color: rgba(255,255,255,0.12) !important; }
body.a11y .weight-table td,
body.a11y .weight-table th  { border-color: rgba(255,255,255,0.15) !important; color: rgba(255,255,255,0.9) !important; font-size: 13px !important; }

/* Source citations */
body.a11y .sources-row      { color: rgba(255,255,255,0.75) !important; font-size: 13px !important; }
body.a11y .cs-item          { color: rgba(255,255,255,0.85) !important; font-size: 13px !important; }

/* Focus rings for all interactive elements */
body.a11y *:focus-visible   { outline: 2px solid var(--hs-clean-white) !important; outline-offset: 3px !important; }
body.a11y .nav-links a:focus-visible { outline: 2px solid var(--hs-clean-white) !important; outline-offset: 3px !important; }

/* Touch targets for nav links */
body.a11y .nav-links a      { min-height: 44px; display: inline-flex; align-items: center; padding: 0 8px; }

/* ══════════════════════════════════════════════════════════════════
   ACCESSIBILITY + LIGHT MODE — body.a11y.light-mode for data guide
   ══════════════════════════════════════════════════════════════════ */

/* Body and topbar stay cream */
body.a11y.light-mode,
body.a11y.light-mode .topbar      { background: var(--hs-warm-cream) !important; }

/* Cards: cream not dark navy */
body.a11y.light-mode .card        { background: rgba(var(--hs-haven-navy-rgb),0.05) !important;
                                    border-color: rgba(var(--hs-haven-navy-rgb),0.18) !important; }

/* Section headers */
body.a11y.light-mode .section-header { background: transparent !important;
                                       border-bottom-color: rgba(var(--hs-haven-navy-rgb),0.14) !important; }

/* Text stays navy */
body.a11y.light-mode p,
body.a11y.light-mode li           { color: rgba(var(--hs-dark-page-rgb),0.90) !important; }
body.a11y.light-mode h2           { color: var(--hs-haven-navy) !important; }
body.a11y.light-mode .section-header-text h2 { color: var(--hs-gold-dark) !important; }
body.a11y.light-mode h3           { color: var(--hs-haven-navy) !important; }
body.a11y.light-mode .source      { color: rgba(var(--hs-dark-page-rgb),0.75) !important; }
body.a11y.light-mode .disclaimer h3 { color: var(--hs-gold-dark) !important; }
body.a11y.light-mode .disclaimer p  { color: rgba(var(--hs-dark-page-rgb),0.70) !important; }
body.a11y.light-mode .guide-healthcare-disclaimer { color: var(--hs-gold-dark) !important; }

/* Nav links: navy not white */
body.a11y.light-mode .nav-links a { color: var(--hs-haven-navy) !important;
                                    border-color: rgba(var(--hs-haven-navy-rgb),0.22) !important; }
body.a11y.light-mode .guide-back-top { color: var(--hs-haven-navy) !important;
                                       background: rgba(var(--hs-haven-navy-rgb),0.05) !important; }
body.a11y.light-mode *:focus-visible { outline-color: var(--hs-haven-navy) !important; }

/* Tables */
body.a11y.light-mode .weight-table td,
body.a11y.light-mode .weight-table th { color: rgba(var(--hs-dark-page-rgb),0.85) !important;
                                        border-color: rgba(var(--hs-haven-navy-rgb),0.14) !important; }

/* Source badges */
body.a11y.light-mode .source.live       { color: var(--hs-success-dark) !important; }
body.a11y.light-mode .source.static     { color: rgba(var(--hs-dark-page-rgb),0.65) !important; }
body.a11y.light-mode .source.editorial  { color: var(--hs-data-navy) !important; }

/* Color scale item text: white in a11y → navy in a11y+light */
body.a11y.light-mode .cs-item           { color: rgba(var(--hs-dark-page-rgb),0.82) !important; }

/* v280: About page topbar follows the canonical left-lane header.
   The Sections control is the About-only menu item after Light/Dark. */
.topbar-row1 {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 55px !important;
  min-height: 55px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
.topbar-row1 > .brand-logo-link {
  position: absolute !important;
  left: 18px !important;
  top: 8px !important;
  width: 156px !important;
  height: 38px !important;
  flex: none !important;
}
.topbar-row1 .brand-logo {
  width: 156px !important;
  max-width: 156px !important;
  height: 38px !important;
}
.topbar-main-nav .guide-nav-toggle {
  display: inline-flex !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 24px !important;
  height: 24px !important;
  max-height: 24px !important;
  margin: 0 !important;
  padding: 3px 10px !important;
  font-size: 9px !important;
  font-weight: 600 !important;
  letter-spacing: .06em !important;
  line-height: 1 !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 5 !important;
}
.topbar-tagline {
  display: none !important;
}
.topbar-row1-tools,
.topbar-action-row,
.topbar-main-nav {
  position: absolute !important;
  left: 190px !important;
  right: auto !important;
  top: 15px !important;
  width: max-content !important;
  max-width: calc(100% - 260px) !important;
  height: 24px !important;
  min-height: 24px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
}
.topbar-row1-tools .topbar-action-row,
.topbar-main-nav {
  left: 0 !important;
  right: auto !important;
  top: 0 !important;
}

@media screen and (max-width: 768px), screen and (max-width: 940px) and (max-height: 540px) and (orientation: landscape) and (pointer: coarse), screen and (max-width: 940px) and (max-height: 540px) and (orientation: landscape) and (hover: none) {
  .topbar-row1 {
    height: 70px !important;
    min-height: 70px !important;
    padding: 0 !important;
  }
  .topbar-row1 > .brand-logo-link {
    left: 10px !important;
    top: 6px !important;
    width: 150px !important;
    height: 28px !important;
  }
  .topbar-row1 .brand-logo {
    width: 150px !important;
    max-width: 150px !important;
    height: 28px !important;
  }
  .topbar-main-nav .guide-nav-toggle {
    display: inline-flex !important;
    position: static !important;
    left: auto !important;
    top: auto !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 24px !important;
    height: 24px !important;
    max-height: 24px !important;
    padding: 3px 5px !important;
    font-size: 8px !important;
    letter-spacing: .035em !important;
    line-height: 1 !important;
  }
  .topbar-tagline {
    display: none !important;
  }
  .topbar-row1-tools,
  .topbar-action-row,
  .topbar-main-nav {
    left: 10px !important;
    right: auto !important;
    top: 39px !important;
    width: 298px !important;
    max-width: 298px !important;
    height: 24px !important;
    min-height: 24px !important;
    gap: 2px !important;
  }
  .topbar-row1-tools .topbar-action-row,
  .topbar-main-nav {
    left: 0 !important;
    top: 0 !important;
  }
  .topbar-main-nav .toolbar-btn,
  .topbar-main-nav .theme-toggle-btn,
  .topbar-main-nav .guide-nav-toggle {
    min-height: 24px !important;
    height: 24px !important;
    max-height: 24px !important;
    padding: 3px 5px !important;
    font-size: 8px !important;
    letter-spacing: .035em !important;
    line-height: 1 !important;
  }
  .topbar-main-nav .theme-toggle-btn {
    width: 44px !important;
  }
}

/* v8: keep the About page main menu aligned with the shared mobile menu.
   Sections remains About-only and wraps below the six standard links. */
@media screen and (max-width: 768px) and (orientation: portrait) {
  .topbar-row1 {
    height: 124px !important;
    min-height: 124px !important;
  }

  .topbar-row1-tools,
  .topbar-action-row,
  .topbar-main-nav {
    height: 78px !important;
    min-height: 78px !important;
  }

  .topbar-row1-tools .topbar-action-row,
  .topbar-main-nav {
    display: inline-flex !important;
    flex-wrap: wrap !important;
    align-content: flex-start !important;
    gap: 3px !important;
  }

  .topbar-main-nav .toolbar-btn,
  .topbar-main-nav .theme-toggle-btn,
  .topbar-main-nav .guide-nav-toggle,
  body.a11y .topbar-main-nav .toolbar-btn,
  body.a11y .topbar-main-nav .theme-toggle-btn,
  body.a11y .topbar-main-nav .guide-nav-toggle {
    min-height: 38px !important;
    height: 38px !important;
    max-height: 38px !important;
    padding: 8px 5px !important;
    font-size: 11px !important;
    letter-spacing: .035em !important;
    line-height: 1.15 !important;
  }
}

/* v9: make the About section list a readable, scrollable mobile window. */
@media screen and (max-width: 768px) and (orientation: portrait) {
  .topbar-guide-nav {
    display: none !important;
    position: absolute !important;
    top: 124px !important;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    max-width: none !important;
    max-height: min(62vh, 520px) !important;
    padding: 12px !important;
    border: 1px solid rgba(255,255,255,0.14) !important;
    border-radius: 0 0 10px 10px !important;
    background: var(--hs-dark-panel) !important;
    box-shadow: 0 18px 38px rgba(0,0,0,0.36) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    z-index: 60 !important;
  }

  .topbar.nav-open .topbar-guide-nav {
    display: block !important;
  }

  .nav-links {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  .nav-links a {
    min-height: 44px !important;
    padding: 9px 12px !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
  }

  body.light-mode .topbar-guide-nav {
    background: var(--hs-warm-cream) !important;
    border-color: rgba(var(--hs-haven-navy-rgb),0.16) !important;
    box-shadow: 0 18px 38px rgba(var(--hs-dark-page-rgb),0.16) !important;
  }
}
