@layer reset,base,components,layout;
@layer reset {
  * {
    box-sizing: border-box;
  }
  body,
  h1,
  h2,
  h3,
  p {
    margin: 0;
  }
  button,
  input,
  select,
  textarea {
    font: inherit;
  }
  button,
  a,
  input,
  select,
  textarea {
    -webkit-tap-highlight-color: transparent;
  }
  button {
    cursor: pointer;
  }
  img {
    max-width: 100%;
  }
  button:disabled {
    cursor: wait;
    opacity: 0.65;
  }
  [hidden] {
    display: none !important;
  }
}
@layer base {
  :root {
    color-scheme: light;
    --paper: oklch(97.5% 0.008 90);
    --surface: oklch(99% 0.005 90);
    --ink: oklch(22% 0.015 165);
    --muted: oklch(46% 0.012 165);
    --line: oklch(85% 0.012 90);
    --forest: oklch(38% 0.055 155);
    --on-forest: #fff;
    --tint: oklch(93% 0.018 150);
    --yellow: oklch(88% 0.15 88);
    --focus: oklch(47% 0.13 235);
    --shadow: 0 8px 28px #15271e1a;
    --space: var(--forest);
    --demo: oklch(42% 0.06 240);
    --service: oklch(43% 0.04 55);
    --outpost: oklch(39% 0.08 105);
    font-family:
      Inter,
      -apple-system,
      BlinkMacSystemFont,
      "Segoe UI",
      sans-serif;
    font-size: 16px;
    line-height: 1.5;
  }
  @media (prefers-color-scheme: dark) {
    :root {
      color-scheme: dark;
      --paper: oklch(19% 0.012 160);
      --surface: oklch(23% 0.012 160);
      --ink: oklch(95% 0.007 90);
      --muted: oklch(74% 0.012 160);
      --line: oklch(36% 0.014 160);
      --forest: oklch(80% 0.07 150);
      --on-forest: oklch(19% 0.02 160);
      --tint: oklch(29% 0.03 150);
      --focus: oklch(80% 0.1 235);
      --space: var(--forest);
      --demo: oklch(79% 0.07 240);
      --service: oklch(79% 0.06 55);
      --outpost: oklch(82% 0.08 105);
      --shadow: 0 8px 28px #0005;
    }
  }
  body {
    background: var(--paper);
    color: var(--ink);
  }
  a {
    color: var(--forest);
    text-underline-offset: 4px;
  }
  button {
    color: inherit;
  }
  h1,
  h2,
  h3 {
    line-height: 1.15;
    letter-spacing: -0.035em;
  }
  h1 {
    font-size: clamp(2rem, 4vw, 3.5rem);
  }
  h2 {
    font-size: 1.75rem;
  }
  h3 {
    font-size: 1.1rem;
  }
  p + p {
    margin-top: 1rem;
  }
  ::selection {
    background: var(--yellow);
    color: #17231b;
  }
  :focus-visible {
    outline: 3px solid var(--focus);
    outline-offset: 3px;
  }
  input,
  select,
  textarea {
    min-width: 0;
    color: var(--ink);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 10px 12px;
    min-height: 44px;
  }
  textarea {
    min-height: 140px;
    resize: vertical;
  }
  input::placeholder,
  textarea::placeholder {
    color: var(--muted);
  }
  label {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
  }
  small,
  .muted {
    color: var(--muted);
  }
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  .eyebrow {
    font-size: 0.7rem;
    letter-spacing: 0.17em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--muted);
  }
  .icon {
    width: 20px;
    height: 20px;
    flex: none;
  }
  .skip-link {
    position: fixed;
    z-index: 100;
    top: -80px;
    left: 16px;
    padding: 12px;
    background: var(--surface);
  }
  .skip-link:focus {
    top: 10px;
  }
  @media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
      scroll-behavior: auto !important;
      animation: none !important;
      transition: none !important;
    }
  }
}
@layer components {
  .site-header {
    height: 80px;
    padding: 0 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
    position: relative;
    z-index: 20;
  }
  .brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--ink);
    font-size: 1.15rem;
    letter-spacing: 0.015em;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
  }
  .brand img {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
  }
  @media (prefers-color-scheme: dark) {
    .brand img { filter: brightness(0) invert(0.97); }
  }
  .brand-light {
    font-weight: 500;
  }
  .site-header nav {
    display: flex;
    gap: 32px;
    height: 100%;
    align-items: center;
  }
  .site-header nav a {
    display: flex;
    align-items: center;
    min-height: 44px;
    text-decoration: none;
    color: var(--muted);
    border-bottom: 2px solid transparent;
    font-size: 0.9rem;
  }
  .site-header nav a[aria-current] {
    border-color: var(--forest);
    color: var(--ink);
    font-weight: 600;
  }
  .button,
  .icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 16px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--surface);
    color: var(--ink);
    text-decoration: none;
    font-weight: 550;
    font-size: 0.875rem;
    line-height: 1.4;
  }
  .button:hover,
  .icon-button:hover {
    background: var(--tint);
  }
  .button.primary {
    background: var(--forest);
    color: var(--on-forest);
    border-color: var(--forest);
  }
  .button.primary:hover {
    filter: brightness(0.93);
  }
  .icon-button {
    width: 44px;
    padding: 10px;
    flex: none;
  }
  .button[aria-pressed="true"] {
    background: var(--tint);
    border-color: var(--forest);
    color: var(--forest);
  }
  .text-button {
    border: 0;
    background: transparent;
    color: var(--forest);
    min-height: 44px;
    text-decoration: underline;
    text-underline-offset: 4px;
    padding: 8px;
    font-size: 0.875rem;
  }
  .category {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 650;
    color: var(--muted);
  }
  .type-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--tint);
    color: var(--space);
    flex: none;
  }
  .type-demo-center {
    color: var(--demo);
  }
  .type-service-center {
    color: var(--service);
  }
  .type-outpost {
    color: var(--outpost);
  }
  .status {
    font-size: 0.75rem;
    color: var(--muted);
  }
  .status.open {
    color: var(--forest);
  }
  .status.open::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    margin-right: 5px;
  }
  .notice {
    padding: 14px 16px;
    background: var(--tint);
    border-left: 3px solid var(--forest);
    font-size: 0.875rem;
  }
  .notice.warning {
    background: var(--paper);
    border-color: var(--muted);
  }
  .site-footer {
    padding: 24px 0;
    display: flex;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    border-top: 1px solid var(--line);
    font-size: 0.75rem;
    color: var(--muted);
  }
  .site-footer span:last-child {
    display: flex;
    gap: 24px;
  }
  .site-footer a {
    color: var(--muted);
  }
  .toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--ink);
    color: var(--paper);
    padding: 12px 20px;
    border-radius: 6px;
    z-index: 80;
    max-width: calc(100vw - 32px);
    box-shadow: var(--shadow);
    font-size: 0.875rem;
  }
  .empty {
    padding: 48px 24px;
    text-align: center;
  }
  .empty .icon {
    width: 32px;
    height: 32px;
    color: var(--muted);
    margin-bottom: 16px;
  }
  .empty p {
    color: var(--muted);
    font-size: 0.9rem;
    margin: 12px 0;
  }
  .tag {
    display: inline-block;
    border: 1px solid var(--line);
    padding: 4px 10px;
    font-size: 0.75rem;
    border-radius: 4px;
  }
  .actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
  }
  .stack {
    display: grid;
    gap: 16px;
  }
  .link-row {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding: 18px 0;
    border-bottom: 1px solid var(--line);
    text-decoration: none;
  }
  .link-row strong {
    color: var(--ink);
  }
  .place-distance {
    display: block;
    margin-top: 6px;
    font-size: .8rem;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
  }
}
@layer layout {
  .explorer-page {
    overflow: hidden;
  }
  .explorer {
    height: calc(100dvh - 80px);
    display: grid;
    grid-template-columns: 390px 1fr;
    position: relative;
  }
  .sidebar {
    background: var(--surface);
    border-right: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    min-height: 0;
    z-index: 3;
  }
  .search-panel {
    padding: 28px 24px 0;
    flex: none;
  }
  .search-panel h1 {
    font-size: 1.9rem;
    margin: 8px 0 20px;
  }
  .search-row {
    display: flex;
    gap: 8px;
  }
  .search-field {
    position: relative;
    flex: 1;
    min-width: 0;
  }
  .search-field > .icon {
    position: absolute;
    top: 13px;
    left: 12px;
    color: var(--muted);
  }
  .search-field input {
    width: 100%;
    padding-left: 40px;
    padding-right: 12px;
  }
  .near-me {
    padding: 10px 12px;
  }
  .filter-row {
    display: flex;
    gap: 8px;
    margin-top: 12px;
  }
  .filter-row > select {
    flex: 1;
    width: 50%;
    font-size: 0.875rem;
  }
  .extra-filters {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding-top: 16px;
  }
  .extra-filters select {
    width: 100%;
    margin-top: 4px;
    font-size: 0.8rem;
  }
  .check-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 400;
    grid-column: 1/-1;
    min-height: 44px;
  }
  .check-label input {
    min-height: 20px;
    width: 18px;
    height: 18px;
    accent-color: var(--forest);
  }
  .result-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 20px 24px 12px;
    font-size: 0.8rem;
    border-bottom: 1px solid var(--line);
    flex: none;
  }
  .result-heading select {
    border: 0;
    padding: 4px 20px 4px 4px;
    min-height: 36px;
    font-size: 0.8rem;
    background: transparent;
    max-width: 155px;
  }
  .results {
    overflow: auto;
    flex: 1;
    min-height: 0;
    overscroll-behavior: contain;
  }
  .location-row {
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--line);
    margin: 0 24px;
    position: relative;
  }
  .location-row.selected {
    background: var(--tint);
    margin: 0;
    padding: 0 24px;
    box-shadow: inset 3px 0 var(--forest);
  }
  .location-select {
    display: flex;
    align-items: center;
    gap: 14px;
    text-align: left;
    width: 100%;
    padding: 18px 0;
    border: 0;
    background: transparent;
    min-width: 0;
  }
  .location-select:hover .row-name {
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  .row-text {
    display: grid;
    gap: 2px;
    min-width: 0;
    flex: 1;
  }
  .row-name {
    font-weight: 650;
    font-size: 0.95rem;
    line-height: 1.3;
  }
  .row-meta {
    font-size: 0.8rem;
    color: var(--muted);
  }
  .row-arrow {
    width: 16px;
    color: var(--muted);
  }
  .sidebar-footer {
    padding: 14px 24px;
    display: flex;
    justify-content: space-between;
    border-top: 1px solid var(--line);
    font-size: 0.65rem;
    color: var(--muted);
  }
  .sidebar-footer a {
    color: var(--muted);
  }
  .map-area {
    position: relative;
    min-width: 0;
    background: var(--tint);
  }
  #map {
    position: absolute;
    inset: 0;
  }
  .map-topbar {
    position: absolute;
    top: 20px;
    left: 24px;
    right: 68px;
    display: flex;
    gap: 8px;
    align-items: flex-start;
    pointer-events: none;
    z-index: 2;
  }
  .map-topbar > * {
    pointer-events: auto;
  }
  .map-caption {
    background: var(--surface);
    padding: 10px 14px;
    border: 1px solid var(--line);
    border-radius: 6px;
    box-shadow: var(--shadow);
    font-size: 0.8rem;
  }
  .map-legend {
    position: absolute;
    bottom: 64px;
    left: 24px;
    display: flex;
    gap: 16px;
    padding: 10px 14px;
    background: var(--surface);
    border-radius: 6px;
    border: 1px solid var(--line);
    z-index: 1;
    font-size: 0.7rem;
    box-shadow: var(--shadow);
  }
  .legend-item {
    display: flex;
    gap: 6px;
    align-items: center;
  }
  .legend-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
  }
  .map-failure {
    position: absolute;
    inset: 0;
    display: grid;
    place-content: center;
    text-align: center;
    padding: 32px;
    gap: 16px;
    background: var(--tint);
  }
  .map-failure p {
    max-width: 340px;
    color: var(--muted);
  }
  .map-failure .button {
    justify-self: center;
  }
  .detail-sheet {
    position: absolute;
    right: 24px;
    top: auto;
    bottom: 32px;
    width: min(380px, calc(100% - 438px));
    max-height: min(760px, calc(100% - 112px));
    align-self: auto;
    overflow: auto;
    padding: 24px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: var(--shadow);
    z-index: 10;
  }
  .detail-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
  }
  .detail-sheet h2 {
    font-size: 2rem;
    margin-bottom: 12px;
  }
  .detail-sheet address,
  .location-page address {
    font-style: normal;
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.6;
  }
  .source-date {
    font-size: 0.75rem;
    line-height: 1.6;
    display: flex;
    gap: 8px;
    margin: 20px 0;
  }
  .source-date .icon {
    width: 16px;
    height: 16px;
    margin-top: 2px;
  }
  .detail-section {
    padding: 20px 0;
    border-top: 1px solid var(--line);
  }
  .detail-section h3 {
    font-size: 0.9rem;
    letter-spacing: 0;
    margin-bottom: 12px;
  }
  .hours-text {
    white-space: pre-line;
    font-size: 0.85rem;
    color: var(--muted);
    line-height: 1.75;
  }
  .detail-actions {
    display: grid;
    gap: 10px;
  }
  .detail-actions .button {
    width: 100%;
  }
  .utility-actions {
    display: flex;
    gap: 6px;
    margin-top: 16px;
    justify-content: space-between;
  }
  .utility-actions .button {
    padding: 10px;
    font-size: 0.75rem;
  }
  .detail-link {
    font-size: 0.8rem;
    margin-top: 20px;
    display: block;
  }
  .mobile-mode {
    display: none;
  }
  .page {
    max-width: 1040px;
    padding: 64px 32px 0;
    margin: auto;
  }
  .page-header {
    max-width: 720px;
    margin-bottom: 48px;
  }
  .page-header h1 {
    margin: 12px 0 20px;
  }
  .page-header > p:not(.eyebrow) {
    color: var(--muted);
    font-size: 1.1rem;
    max-width: 640px;
  }
  .page > .site-footer {
    margin-top: 72px;
  }
  .content-section {
    margin: 40px 0;
    max-width: 720px;
  }
  .content-section h2 {
    margin-bottom: 20px;
  }
  .content-section p {
    color: var(--muted);
  }
  .content-grid {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: 64px;
    margin-bottom: 64px;
  }
  .content-grid .content-section {
    margin: 0;
    max-width: none;
  }
  .content-grid h2 {
    font-size: 1.5rem;
  }
  .form-field {
    display: grid;
    gap: 6px;
    margin-bottom: 20px;
  }
  .saved-list .location-row {
    margin: 0;
  }
  .saved-list .location-select {
    padding: 24px 0;
  }
  .saved-list .remove-save {
    flex: none;
  }
  .saved-list {
    max-width: 720px;
  }
  .location-page .page-header {
    margin-bottom: 32px;
  }
  .location-page .page-header address {
    font-size: 1.1rem;
  }
  .location-page .content-grid {
    margin-top: 48px;
  }
  .breadcrumb {
    display: flex;
    gap: 8px;
    font-size: 0.8rem;
    margin-bottom: 28px;
    align-items: center;
  }
  .stat-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-block: 1px solid var(--line);
    margin: 36px 0;
    padding: 28px 0;
    gap: 20px;
  }
  .stat-strip strong {
    display: block;
    font-size: 2rem;
    letter-spacing: -0.04em;
  }
  .stat-strip span {
    color: var(--muted);
    font-size: 0.8rem;
  }
  .change-row {
    padding: 20px 0;
    border-bottom: 1px solid var(--line);
  }
  .change-row p {
    font-size: 0.875rem;
    color: var(--muted);
    margin-top: 6px;
  }
  .location-page .utility-actions {
    justify-content: flex-start;
  }
  .region-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .mapboxgl-ctrl-group {
    box-shadow: var(--shadow) !important;
  }
  .mapboxgl-ctrl-attrib a {
    color: #333;
  }
  .mapboxgl-canvas:focus-visible {
    outline-offset: -3px;
  }
  @media (min-width: 1600px) {
    .explorer {
      grid-template-columns: 420px 1fr;
    }
    .search-panel {
      padding-inline: 32px;
    }
    .location-row {
      margin-inline: 32px;
    }
    .detail-sheet {
      width: 400px;
      right: 32px;
    }
  }
  @media (max-width: 1100px) and (min-width: 761px) {
    .explorer {
      grid-template-columns: 340px 1fr;
    }
    .search-panel {
      padding-inline: 20px;
    }
    .search-panel h1 {
      font-size: 1.65rem;
    }
    .near-me span:last-child {
      display: none;
    }
    .detail-sheet {
      width: 330px;
      right: 16px;
      top: auto;
      bottom: 24px;
    }
    .map-legend {
      gap: 8px;
      left: 16px;
    }
    .map-caption {
      max-width: 260px;
    }
    .site-header {
      padding-inline: 24px;
    }
    .site-header nav {
      gap: 24px;
    }
  }
  @media (max-width: 760px) {
    .site-header {
      height: 112px;
      padding: 12px 20px 0;
      flex-wrap: wrap;
      gap: 0;
      align-content: space-between;
    }
    .brand {
      font-size: 1rem;
      gap: 10px;
    }
    .brand img {
      width: 32px;
      height: 32px;
    }
    .site-header nav {
      order: 3;
      width: 100%;
      height: 48px;
      justify-content: space-between;
      gap: 0;
    }
    .site-header nav a {
      font-size: 0.85rem;
      min-height: 44px;
    }
    .explorer {
      height: calc(100dvh - 112px);
      display: block;
    }
    .sidebar {
      position: absolute;
      inset: 0;
      border: 0;
    }
    .search-panel {
      padding: 20px 20px 0;
    }
    .search-panel h1 {
      font-size: 1.6rem;
      margin: 4px 0 16px;
    }
    .search-panel .eyebrow {
      font-size: 0.62rem;
    }
    .search-row {
      gap: 8px;
    }
    .near-me span {
      font-size: 0.8rem;
    }
    .filter-row {
      margin-top: 10px;
    }
    .result-heading {
      padding: 12px 20px 8px;
    }
    .location-row {
      margin: 0 20px;
    }
    .location-select {
      padding: 16px 0;
    }
    .location-row.selected {
      padding: 0 20px;
    }
    .sidebar-footer {
      display: none;
    }
    .results {
      padding-bottom: 80px;
    }
    .map-area {
      position: absolute;
      inset: 0;
      visibility: hidden;
    }
    .explorer[data-view="map"] .map-area {
      visibility: visible;
    }
    .explorer[data-view="map"] .sidebar {
      background: transparent;
      pointer-events: none;
      z-index: 4;
    }
    .explorer[data-view="map"] .search-panel {
      pointer-events: auto;
      background: var(--surface);
      padding-bottom: 16px;
      box-shadow: var(--shadow);
    }
    .explorer[data-view="map"] .result-heading,
    .explorer[data-view="map"] .results {
      display: none;
    }
    .explorer[data-view="map"] .search-panel h1,
    .explorer[data-view="map"] .search-panel .eyebrow {
      display: none;
    }
    .map-topbar {
      top: auto;
      bottom: 100px;
      left: 16px;
      right: 16px;
      justify-content: center;
    }
    .map-caption {
      display: none;
    }
    .map-legend {
      bottom: 162px;
      left: 12px;
      right: 12px;
      justify-content: center;
      padding: 8px;
      gap: 14px;
      font-size: 0.65rem;
    }
    .mobile-mode {
      display: flex;
      gap: 8px;
      padding: 8px 18px calc(8px + env(safe-area-inset-bottom, 0px));
      background: var(--surface);
      border-top: 1px solid var(--line);
    }
    .mobile-mode button {
      flex: 1;
      min-height: 44px;
      border: 0;
    }
    .mobile-mode button[aria-pressed="true"] {
      background: var(--forest);
      color: var(--on-forest);
    }
    .detail-sheet {
      width: 100%;
      left: 0;
      right: 0;
      top: auto;
      bottom: 0;
      max-height: 80%;
      border-radius: 16px 16px 0 0;
      padding: 20px 24px max(24px, env(safe-area-inset-bottom));
      z-index: 15;
    }
    .detail-top {
      margin-bottom: 12px;
    }
    .detail-sheet h2 {
      font-size: 1.8rem;
    }
    .detail-sheet::before {
      content: "";
      width: 36px;
      height: 4px;
      background: var(--line);
      border-radius: 4px;
      display: block;
      margin: -8px auto 12px;
    }
    .detail-sheet .utility-actions .button {
      padding: 12px;
    }
    .mapboxgl-ctrl-top-right {
      top: 150px;
    }
    .page {
      padding: 36px 20px 0;
    }
    .page-header {
      margin-bottom: 32px;
    }
    .page-header h1 {
      font-size: 2.25rem;
    }
    .page-header > p:not(.eyebrow) {
      font-size: 1rem;
    }
    .content-grid {
      grid-template-columns: 1fr;
      gap: 32px;
    }
    .stat-strip {
      gap: 12px;
    }
    .stat-strip strong {
      font-size: 1.75rem;
    }
    .stat-strip span {
      font-size: 0.7rem;
    }
    .site-footer {
      gap: 16px;
    }
    .page > .site-footer {
      margin-top: 48px;
    }
    .content-section {
      margin: 32px 0;
    }
    .toast {
      bottom: 88px;
    }
    .extra-filters {
      max-height: 210px;
      overflow: auto;
    }
  }
}
/* Vendor CSS is unlayered; explicit host geometry must outrank its relative positioning. */
#map.mapboxgl-map {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* Charging networks share the existing explorer and detail panels. */
.type-ran { color: #b4621a; background: #b4621a18; }
.type-waypoint { color: #7062a4; background: #7062a418; }
.charging-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 12px 0 24px; }
.charging-facts strong { display: block; font-size: 2rem; letter-spacing: -.04em; }
.charging-facts strong small { font-size: 1rem; letter-spacing: 0; }
.charging-facts span { color: var(--muted); font-size: .78rem; }
.charging-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.charging-note { font-size: .78rem; color: var(--muted); margin-top: 20px; line-height: 1.6; }
.related-places { margin-top: 28px; }
.related-places .link-row { font-size: .85rem; }
.map-legend { flex-wrap: wrap; max-width: calc(100% - 48px); gap: 8px 14px; }
/* Explorer: grouped browsing sidebar and location popups over the map. */
.explorer{grid-template-columns:380px minmax(0,1fr)}
.explorer .search-panel{padding:20px 22px 14px;border-bottom:1px solid var(--line);max-height:55%;overflow:auto}
.explorer .search-panel h1{font-size:1.55rem;letter-spacing:-.7px;margin:0 0 16px}
.explorer .near-me{padding:10px;min-width:44px}.explorer .near-me .icon{width:22px;height:22px}
.explore-modes{display:flex;gap:3px;padding:4px;margin-top:14px;background:var(--tint);border:1px solid var(--line);border-radius:9px}
.explore-modes button{flex:1;white-space:nowrap;border:0;border-radius:6px;background:transparent;color:var(--ink);font-size:.73rem;font-weight:650;padding:10px 3px}
.explore-modes button[aria-pressed=true]{background:var(--surface);box-shadow:0 1px 5px #0001}
.type-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.type-chips:empty{display:none}
.type-chips button{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:20px;font-size:.75rem;padding:7px 11px}
.type-chips button[aria-pressed=true]{background:var(--forest);color:var(--on-forest);border-color:var(--forest)}
.explorer .filter-row{margin-top:10px;justify-content:flex-end}.explorer .filter-row .button{padding:5px 9px;min-height:30px;font-size:.72rem}
.browse-overview{padding:18px 22px;overflow:auto;flex:1;min-height:0}
.category-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 10px}.category-heading h2{font-size:.95rem}.category-heading span{font-size:.7rem;color:var(--muted)}
.category-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:20px}
.category-card{text-align:left;padding:13px 11px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink)}
.category-card:hover{border-color:var(--forest);background:var(--tint)}
.category-card .type-icon{width:28px;height:28px;border-radius:8px;display:inline-flex}.category-card .type-icon .icon{width:18px;height:18px}
.category-count{float:right;font-size:1.25rem;font-weight:650}.category-card strong{display:block;font-size:.77rem;margin-top:8px}.category-card small{display:block;font-size:.67rem;color:var(--muted);margin-top:2px}
.explorer .result-heading{padding:16px 22px 10px;font-size:.8rem}.explorer .result-heading select{font-size:.72rem}
.explorer .location-row{margin:0 18px 10px;border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:0}
.explorer .location-select{padding:15px 12px}.explorer .row-name{font-size:.86rem}.explorer .row-meta{font-size:.72rem}.explorer .row-arrow{width:14px}
.explorer .sidebar-footer{padding:12px 22px;font-size:.61rem}
.explorer .detail-sheet{position:absolute;right:24px;bottom:32px;width:min(380px,calc(100% - 428px));max-height:min(760px,calc(100% - 112px));padding:20px 22px 28px;overflow:auto;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}
.explorer .detail-sheet h2{font-size:1.7rem}.explorer .detail-sheet::before{display:none}.explorer .detail-top{margin-bottom:16px}
.explorer .map-topbar{right:65px;flex-wrap:wrap}.explorer #full-overview{order:3;margin-left:auto;font-size:.75rem}.explorer .map-caption{font-size:.75rem}
@media(max-width:760px){
 .explorer{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}
 .explorer .sidebar,.explorer .map-area{position:relative;inset:auto;grid-column:1;grid-row:1;min-height:0;min-width:0}
 .explorer .mobile-mode{grid-column:1;grid-row:2}
 .explorer .search-panel{padding:16px 18px 12px;max-height:50%}.explorer .search-panel h1{font-size:1.45rem}
 .explorer[data-view=map] .sidebar{display:none}.explorer[data-view=map] .map-area{visibility:visible}
 .explorer .browse-overview{padding:16px 18px 18px}.explorer .results{padding-bottom:18px}
 .explorer .detail-sheet{left:10px;right:10px;bottom:calc(73px + env(safe-area-inset-bottom, 0px));width:auto;max-height:65%;padding:18px 20px 24px;border-radius:16px}.explorer .map-topbar{top:18px;bottom:auto;left:16px;right:60px;justify-content:flex-start}
 .explorer #full-overview{margin-left:0;order:0}.explorer .map-legend{bottom:32px;max-width:calc(100% - 24px)}
 .explorer .mapboxgl-ctrl-top-right{top:18px}.explorer .mobile-mode{z-index:20}.explorer .sidebar-footer{display:none}
}
.roamer-details{border-top:1px solid var(--line);margin-top:22px;padding-top:20px}.roamer-details h3{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}.roamer-details h4{margin:18px 0 8px;font-size:.85rem}.charging-prices{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin:0}.charging-prices div{padding:12px;border:1px solid var(--line);border-radius:8px}.charging-prices dt{font-size:.72rem;color:var(--muted)}.charging-prices dd{margin:4px 0 0;font-size:1.1rem;font-weight:650;overflow-wrap:anywhere}.charging-prices small{display:block;font-size:.65rem;font-weight:400}.roamer-details p{font-size:.8rem;margin:10px 0}.roamer-details .charging-note{font-size:.68rem;color:var(--muted)}.power-observation{padding:12px;background:var(--tint);border-radius:8px}.charger-table{margin-top:16px;font-size:.76rem}.charger-table summary{cursor:pointer;padding:10px 0;font-weight:650}.table-scroll{overflow:auto}.charger-table table{border-collapse:collapse;width:100%;font-size:.7rem}.charger-table td,.charger-table th{text-align:left;padding:8px 6px;border-bottom:1px solid var(--line);white-space:nowrap}

/* Source colors, promoted to the location heading and result cards. */
.location-title{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}
.location-title h1,.location-title h2{margin:0;min-width:0}
.reliability-badge{--rating-color:#a3a3a3;--rating-ink:#171717;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:54px;height:54px;border-radius:12px;background:var(--rating-color);color:var(--rating-ink);font-size:1.9rem;font-weight:800;line-height:1;box-shadow:0 0 0 4px color-mix(in srgb,var(--rating-color) 18%,transparent)}
.reliability-compact{width:36px;height:36px;border-radius:9px;font-size:1.15rem;box-shadow:none;margin-left:8px}
.reliability-emerald{--rating-color:#10b981;--rating-ink:#042f2e}.reliability-lime{--rating-color:#84cc16;--rating-ink:#1a2e05}
.reliability-yellow{--rating-color:#eab308}.reliability-amber{--rating-color:#f59e0b}.reliability-orange{--rating-color:#f97316}.reliability-red{--rating-color:#ef4444}.reliability-rose{--rating-color:#f43f5e}
.location-page .location-title .reliability-badge{width:64px;height:64px;font-size:2.2rem}
@media(max-width:760px){.location-title{gap:12px}.location-page .location-title .reliability-badge{width:54px;height:54px;font-size:1.9rem}}

.changelog{max-width:800px}.changelog-entry{padding:28px 0 32px;border-top:1px solid var(--line)}.changelog-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:.8rem;margin-bottom:12px}.changelog-entry h2{font-size:1.5rem;margin:0 0 14px}.changelog-entry ul{padding-left:20px;color:var(--muted);line-height:1.7}.changelog-entry li+li{margin-top:8px}

/* Keep the close control visible inside the scrolling map popup. */
.explorer .detail-top{position:sticky;top:-20px;z-index:2;background:var(--surface);margin:-20px -22px 16px;padding:20px 22px 12px;border-bottom:1px solid var(--line)}
@media(max-width:760px){.explorer .detail-top{top:-18px;margin:-18px -20px 16px;padding:18px 20px 12px}}

.explorer .location-title h2 a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}.explorer .location-title h2 a:hover{text-decoration-thickness:2px}

.type-icon.type-planned{background:transparent;color:#b4621a;border:2px solid #b4621a}
.status.planned{color:var(--text)}
.coming-soon{border-left:3px solid #b4621a}
.content-section h3.permit-heading,.permit-heading{margin:22px 0 8px}.permit-facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 14px;margin:8px 0 10px;font-size:.85rem}.permit-facts dt{color:var(--muted)}.permit-facts dd{margin:0;overflow-wrap:anywhere}

/* Network-specific facts and readable time-of-use schedules. */
.charging-network{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);min-width:0}
.charging-network>h3{margin:0 0 16px;font-size:1rem}
.rate-schedule{margin:12px 0;font-size:.78rem;overflow-wrap:anywhere}
.rate-schedule summary{cursor:pointer;font-weight:650;padding:10px 0}
.rate-schedule h5{font-size:.82rem;margin:16px 0 8px}
.rate-schedule table{border-collapse:collapse;width:100%;font-size:.75rem}
.rate-schedule th,.rate-schedule td{text-align:left;padding:8px 4px;border-bottom:1px solid var(--line)}
.rate-schedule th:last-child,.rate-schedule td:last-child{text-align:right;white-space:nowrap}
.rate-schedule td span{color:var(--muted);font-size:.7rem}

.type-icon.type-combined{box-shadow:inset 0 0 0 2px #7062a4}
.legend-dot.legend-combined{background:#b4621a;outline:2px solid #7062a4}
.detail-top .category{min-width:0}
#close-detail{flex-shrink:0}

/* Daily location reports share the directory's light and dark palettes. */
.updates-header{margin-bottom:28px}.updates-intro{display:flex;justify-content:space-between;align-items:baseline;gap:24px;margin-bottom:28px;font-size:.85rem;color:var(--muted)}
.updates-intro p{max-width:660px}.updates-intro a{white-space:nowrap;color:var(--forest);font-weight:650}
.updates-toolbar{display:grid;grid-template-columns:minmax(180px,1.5fr) minmax(150px,1fr) minmax(130px,1fr) auto;gap:14px;align-items:end;padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.updates-toolbar label{display:block;font-size:.75rem;font-weight:650;margin-bottom:7px}.updates-toolbar input,.updates-toolbar select{width:100%;min-height:44px;border:1px solid var(--line);border-radius:7px;padding:10px;background:var(--paper);color:var(--ink);font:inherit;font-size:.85rem}.updates-toolbar .button{min-height:44px}
.updates-result{margin:18px 0 32px;color:var(--muted);font-size:.8rem}.updates-day{margin-bottom:48px}.updates-date{display:flex;align-items:baseline;gap:14px;margin-bottom:18px;border-bottom:1px solid var(--line);padding-bottom:14px}.updates-date h2{font-size:1.4rem;margin:0}.updates-date span,.updates-date a{font-size:.8rem;color:var(--muted)}.updates-date a{margin-left:auto}
.updates-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}.location-update{min-width:0;border:1px solid var(--line);border-radius:14px;padding:24px;background:var(--surface);overflow-wrap:anywhere}.update-card-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}.update-kind{font-size:.68rem;font-weight:650;padding:5px 8px;border-radius:5px;background:var(--tint);color:var(--ink)}.update-kind-added,.update-kind-now-active{background:var(--forest);color:var(--on-forest)}.update-kind-coming-soon{border:1px solid #b4621a}.update-type{font-size:.7rem;color:var(--muted)}.location-update h3{font-size:1.2rem;margin:0 0 12px}.location-update h3 a{color:var(--ink);text-decoration:none}.location-update h3 a:hover{text-decoration:underline}.location-update ul{padding-left:18px;margin:0;color:var(--muted);font-size:.85rem;line-height:1.65}.location-update li+li{margin-top:9px}.update-locality{font-size:.8rem;color:var(--muted);margin:-6px 0 14px}.update-more summary{cursor:pointer;font-size:.8rem;font-weight:650;padding:14px 0}.update-location-link{display:inline-block;margin-top:20px;font-size:.8rem;font-weight:650;color:var(--forest)}.update-caveat,.updates-note{color:var(--muted);font-size:.78rem;line-height:1.6}.update-caveat{margin-top:16px}.updates-note{border-top:1px solid var(--line);padding-top:24px}.sidebar-footer>span{display:flex;gap:10px}.site-footer>span{flex-wrap:wrap}
[data-update-card][hidden],[data-update-day][hidden],[data-update-controls][hidden]{display:none!important}
@media(max-width:760px){.updates-intro{display:block}.updates-toolbar{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:16px;gap:12px}.updates-toolbar .form-field:first-child{grid-column:1/-1}.updates-toolbar .button{grid-column:1/-1}.updates-grid{grid-template-columns:minmax(0,1fr)}.location-update{padding:20px}.updates-date{gap:10px;flex-wrap:wrap}.updates-date h2{font-size:1.2rem}.updates-intro a{display:inline-block;margin-top:10px}}