/* Places PMR, France. Mobile first. Contrasts checked against WCAG AA.
   Light and dark themes via [data-theme] tokens; MapLibre GL for the map. */
:root {
  --bg: #eef0f7;
  --panel: rgba(255, 255, 255, .88);
  --panel-solid: #ffffff;
  --text: #171923;
  --text-mute: #464c60;        /* 7.6:1 on white */
  --accent: #4338ca;           /* 8.5:1 on white */
  --accent-ink: #3730a3;
  --accent-soft: #e0e7ff;
  --accent-softer: #eef2ff;
  --btn-bg: #4338ca;
  --btn-bg-hover: #3730a3;
  --btn-fg: #ffffff;
  --field-bg: #f1f2f8;
  --border: rgba(23, 25, 35, .12);
  --border-strong: #595f73;    /* 5.4:1, enough for UI components (3:1) */
  --focus: #0a76f6;
  --geo: #0a76f6;
  --error: #ce0500;
  --error-bg: #ffe9e9;
  --info-bg: #eef2ff;
  --ok: #1a7f37;               /* 5.1:1 on white */
  --ok-bg: #e7f6ec;
  --shadow-1: 0 1px 2px rgba(15, 18, 35, .05), 0 8px 24px rgba(15, 18, 35, .09);
  --shadow-2: 0 2px 6px rgba(15, 18, 35, .08), 0 16px 48px rgba(15, 18, 35, .16);
  --map-pt: #4f46e5;
  --map-stroke: #ffffff;
  --map-c1: #6366f1;
  --map-c2: #4338ca;
  --map-c3: #312e81;
  --target: 2.75rem;           /* 44px */
  --header-h: 3.5rem;
  --r-s: .625rem;
  --r-m: 1rem;
  --r-l: 1.375rem;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  color-scheme: light;
}
:root[data-theme="dark"] {
  --bg: #0d0f16;
  --panel: rgba(22, 25, 37, .88);
  --panel-solid: #161925;
  --text: #e9ebf5;
  --text-mute: #aab1c6;        /* 7.6:1 on panel */
  --accent: #a5b4fc;           /* 8.6:1 on panel */
  --accent-ink: #c7d2fe;
  --accent-soft: rgba(129, 140, 248, .2);
  --accent-softer: rgba(129, 140, 248, .1);
  --btn-bg: #4c5df0;           /* 5:1 with white text */
  --btn-bg-hover: #3b4ce0;
  --btn-fg: #ffffff;
  --field-bg: #1d2130;
  --border: rgba(233, 235, 245, .12);
  --border-strong: #8a90a5;
  --focus: #58a6ff;
  --geo: #58a6ff;
  --error: #ff7b72;
  --error-bg: #3d1513;
  --info-bg: #171d33;
  --ok: #56d364;
  --ok-bg: #10241a;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .45);
  --shadow-2: 0 2px 6px rgba(0, 0, 0, .4), 0 16px 48px rgba(0, 0, 0, .6);
  --map-pt: #8f9bff;
  --map-stroke: #0d0f16;
  --map-c1: #5b66f0;
  --map-c2: #4650e0;
  --map-c3: #3038c4;
  color-scheme: dark;
}
/* Fallback before JS sets data-theme (and for noscript) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0d0f16; --panel: rgba(22, 25, 37, .88); --panel-solid: #161925;
    --text: #e9ebf5; --text-mute: #aab1c6;
    --accent: #a5b4fc; --accent-ink: #c7d2fe;
    --accent-soft: rgba(129, 140, 248, .2); --accent-softer: rgba(129, 140, 248, .1);
    --btn-bg: #4c5df0; --btn-bg-hover: #3b4ce0; --btn-fg: #ffffff;
    --field-bg: #1d2130; --border: rgba(233, 235, 245, .12); --border-strong: #8a90a5;
    --focus: #58a6ff; --geo: #58a6ff;
    --error: #ff7b72; --error-bg: #3d1513; --info-bg: #171d33; --ok: #56d364; --ok-bg: #10241a;
    --map-pt: #8f9bff; --map-stroke: #0d0f16;
    --map-c1: #5b66f0; --map-c2: #4650e0; --map-c3: #3038c4;
    color-scheme: dark;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); font-size: 1rem; }
a { color: var(--accent); text-underline-offset: .15em; }
a:hover { color: var(--accent-ink); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
button, input, select, textarea { font: inherit; color: inherit; }
[hidden] { display: none !important; }

.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Skip links: visible on focus */
.skiplinks a {
  position: absolute; left: .5rem; top: -4rem; z-index: 3000;
  background: var(--panel-solid); color: var(--accent); padding: .75rem 1rem;
  border: 2px solid var(--accent); border-radius: var(--r-s); font-weight: 700;
  box-shadow: var(--shadow-2);
}
.skiplinks a:focus { top: .5rem; }

/* Header: frosted bar */
.app-header {
  position: sticky; top: 0; z-index: 1500;
  min-height: var(--header-h); display: flex; align-items: center; gap: .75rem;
  padding: .375rem .875rem;
  background: var(--panel);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border);
}
.app-title { margin: 0; font-size: 1.0625rem; font-weight: 750; letter-spacing: -.01em; display: flex; align-items: center; gap: .625rem; flex-wrap: wrap; flex: 1; }
.app-sub { font-weight: 450; color: var(--text-mute); font-size: .875rem; letter-spacing: 0; }
.app-logo {
  display: inline-grid; place-items: center; width: 2.125rem; height: 2.125rem;
  background: linear-gradient(145deg, #6366f1, #4338ca); color: #fff; border-radius: .75rem;
  box-shadow: 0 2px 8px rgba(67, 56, 202, .35);
}
.app-logo svg { width: 1.25rem; height: 1.25rem; }
.theme-toggle {
  display: inline-grid; place-items: center; width: var(--target); height: var(--target);
  background: transparent; border: 1px solid var(--border); border-radius: .875rem; cursor: pointer;
  color: var(--text-mute); transition: background .15s ease, color .15s ease;
}
.theme-toggle:hover { background: var(--accent-softer); color: var(--text); }
:root:not([data-theme="dark"]) .icon-sun { display: none; }
:root[data-theme="dark"] .icon-moon { display: none; }

/* Layout. Mobile: map hero + sheet. Desktop: full-bleed map + floating panel. */
.app { position: relative; }
.map-wrap { position: relative; height: 56svh; min-height: 19rem; }
#map { position: absolute; inset: 0; background: var(--bg); }
#map.map-failed { display: grid; place-items: center; padding: 1.5rem; text-align: center; color: var(--text-mute); }
.panel {
  position: relative; z-index: 10;
  margin-top: -1.125rem;
  background: var(--bg);
  border-radius: var(--r-l) var(--r-l) 0 0;
  box-shadow: 0 -10px 30px rgba(15, 18, 35, .14);
}
.panel::before {
  content: ""; display: block; width: 2.5rem; height: .25rem; margin: .5rem auto 0;
  border-radius: .25rem; background: var(--border-strong); opacity: .45;
}
.controls { padding: .625rem 1rem .75rem; }
.list-wrap { padding: 0 1rem 1rem; }

@media (min-width: 60em) {
  body { display: flex; flex-direction: column; height: 100vh; height: 100dvh; }
  .app-header { flex: none; position: static; }
  .app { flex: 1; min-height: 0; }
  .map-wrap { position: absolute; inset: 0; height: auto; min-height: 0; }
  .panel {
    position: absolute; left: 1rem; top: 1rem; bottom: 1rem; width: 27.5rem; margin: 0;
    display: flex; flex-direction: column; min-height: 0;
    background: var(--panel);
    -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
    border: 1px solid var(--border); border-radius: var(--r-l);
    box-shadow: var(--shadow-2);
    overflow: hidden;
  }
  .panel::before { display: none; }
  .controls { flex: none; padding: 1rem 1.125rem .75rem; }
  .list-wrap { flex: 1; min-height: 0; overflow-y: auto; padding: 0 1.125rem 1.125rem; overscroll-behavior: contain; }
}

/* Coverage notice */
.notice {
  margin: .25rem 0 .875rem; padding: .625rem .875rem;
  background: var(--info-bg); border: 1px solid var(--accent-soft); border-radius: var(--r-m);
  font-size: .906rem;
}
.notice p { margin: 0; }
.notice a { font-weight: 600; display: inline-block; min-height: 1.5rem; }

/* Form controls */
.label { display: block; font-weight: 650; margin-bottom: .25rem; letter-spacing: -.005em; }
.hint { margin: -.125rem 0 .375rem; font-size: .85rem; color: var(--text-mute); }
.input, .select {
  display: block; width: 100%; min-height: var(--target); padding: .5rem .875rem;
  background: var(--field-bg); border: 1.5px solid var(--border); border-radius: var(--r-s);
  font-size: 1rem; /* 16px avoids iOS zoom on focus */
  transition: border-color .15s ease, background .15s ease;
}
.input:hover, .select:hover { border-color: var(--border-strong); }
.input:focus-visible, .select:focus-visible { outline-offset: 0; border-color: transparent; }
.select {
  appearance: none; -webkit-appearance: none; padding-right: 2.5rem; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23767b90' d='m12 13.1 5-4.9 1.4 1.4-6.4 6.3-6.4-6.4L7 8.1l5 5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .625rem center; background-size: 1.375rem;
}
.select:disabled { color: var(--text-mute); cursor: wait; }

.search { margin-bottom: .75rem; }
.combo { position: relative; display: flex; }
.combo .input { flex: 1; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.combo .btn-icon { border-radius: 0 var(--r-s) var(--r-s) 0; }

.row { display: flex; flex-direction: column; gap: .75rem; align-items: stretch; }
.row .field { min-width: 0; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: var(--target); min-width: var(--target); padding: .5rem 1.125rem;
  border: 0; border-radius: var(--r-s); font-weight: 650; cursor: pointer; text-decoration: none;
  transition: background .15s ease, transform .12s ease, box-shadow .15s ease;
}
.btn svg { flex: none; }
.btn:active { transform: translateY(1px); }
.btn-primary, .btn-icon { background: var(--btn-bg); color: var(--btn-fg); box-shadow: 0 2px 10px rgba(67, 56, 202, .25); }
.btn-primary:hover, .btn-icon:hover { background: var(--btn-bg-hover); box-shadow: 0 4px 14px rgba(67, 56, 202, .32); }
.btn-secondary { background: transparent; color: var(--accent); box-shadow: inset 0 0 0 1.5px var(--accent); }
.btn-secondary:hover { background: var(--accent-softer); }
.btn-block { width: 100%; margin-top: .75rem; }
.btn[aria-busy="true"] { cursor: progress; opacity: .85; }
#locate { white-space: nowrap; }

/* Suggestions listbox */
.suggestions {
  position: absolute; top: calc(100% + .375rem); left: 0; right: 0; z-index: 1100; margin: 0; padding: .375rem; list-style: none;
  background: var(--panel-solid); border: 1px solid var(--border); border-radius: var(--r-m);
  box-shadow: var(--shadow-2);
  max-height: 60vh; overflow-y: auto;
  animation: rise .14s ease-out;
}
.suggestions li {
  min-height: var(--target); padding: .5rem .625rem; cursor: pointer; border-radius: .5rem;
}
.suggestions li + li { margin-top: .125rem; }
.suggestions li[aria-selected="true"], .suggestions li:hover { background: var(--accent-soft); outline: 2px solid var(--accent); outline-offset: -2px; }
.suggestions .s-kind { display: block; font-size: .8125rem; color: var(--text-mute); }
.suggestions .s-empty { cursor: default; color: var(--text-mute); }
.suggestions .s-label { display: block; }
.suggestions .s-type {
  display: inline-block; margin-right: .25rem; padding: 0 .375rem; border-radius: .375rem;
  background: var(--accent-softer); color: var(--accent); font-weight: 700; font-size: .75rem; line-height: 1.25rem;
}
:root[data-theme="dark"] .suggestions .s-type { color: var(--accent-ink); }
.suggestions .s-type.s-place, .suggestions .s-type.s-erp,
:root[data-theme="dark"] .suggestions .s-type.s-place, :root[data-theme="dark"] .suggestions .s-type.s-erp { background: var(--accent); color: var(--panel-solid); }
.suggestions .s-more { color: var(--accent); font-weight: 650; border-top: 1px solid var(--border); border-radius: 0 0 .5rem .5rem; }
.suggestions .s-more .s-kind { font-weight: 400; }

/* Alert */
.alert {
  display: flex; gap: .5rem; align-items: flex-start; margin-top: .75rem; padding: .75rem .5rem .75rem 1rem;
  border-left: 4px solid var(--error); background: var(--error-bg); border-radius: 0 var(--r-s) var(--r-s) 0;
}
.alert.is-info { border-left-color: var(--accent); background: var(--info-bg); }
.alert p { margin: 0; flex: 1; }
.alert-close { background: transparent; border: 0; min-width: var(--target); min-height: var(--target); cursor: pointer; margin: -.5rem 0; border-radius: .5rem; }
.alert-close:hover { background: var(--accent-softer); }

/* Place card: the searched place and its Acceslibre accessibility sheet */
.place {
  margin-top: 1.125rem; padding: .875rem 1rem;
  background: var(--panel-solid); border: 1px solid var(--border); border-radius: var(--r-m); box-shadow: var(--shadow-1);
}
.place-title { font-size: 1.125rem; letter-spacing: -.012em; margin: 0; }
.place-meta { margin: 0 0 .25rem; color: var(--text-mute); font-size: .9375rem; }
.place-sub { font-size: .9375rem; margin: .625rem 0 .25rem; }
.place-status { margin: 0 0 .5rem; color: var(--text-mute); font-size: .9375rem; }
.place[aria-busy="true"] .place-status::before {
  content: ""; display: inline-block; width: .75rem; height: .75rem; margin-right: .5rem; vertical-align: -.05rem;
  border: 2px solid var(--accent); border-right-color: transparent; border-radius: 50%; animation: spin .8s linear infinite;
}
.place-acc { margin: 0; font-size: .9375rem; }
.place-acc div { display: flex; justify-content: space-between; align-items: baseline; gap: .75rem; padding: .375rem 0; border-top: 1px solid var(--border); }
.place-acc dt { flex: 1; }
.place-acc dd { margin: 0; font-weight: 700; text-align: right; }
.place-acc .is-yes { color: var(--ok); }
.place-acc .is-no { color: var(--error); }
.place-link { margin: .5rem 0 0; font-size: .875rem; color: var(--text-mute); }
.place a { font-weight: 600; display: inline-block; min-height: 1.5rem; }

/* Results */
.results { margin-top: 1.125rem; }
.results:focus { outline: none; }
.results:focus-visible { outline: 3px solid var(--focus); }
.results-title { font-size: 1.125rem; letter-spacing: -.012em; margin: 0 0 .25rem; }
.results-intro { margin: 0 0 .5rem; color: var(--text-mute); font-size: .9375rem; }
.results-intro:empty { display: none; }
.results-list { list-style: none; margin: 0; padding: 0; }
.result { display: flex; gap: .5rem; align-items: stretch; border-top: 1px solid var(--border); }
.result:last-child { border-bottom: 1px solid var(--border); }
.result-main {
  flex: 1; display: grid; grid-template-columns: auto 1fr; column-gap: .75rem; align-items: center;
  text-align: left; background: none; border: 0; border-radius: .5rem; padding: .625rem .375rem; min-height: 3.5rem; cursor: pointer;
  transition: background .12s ease;
}
.result-main:hover { background: var(--accent-softer); }
.result-main.no-rank { grid-template-columns: 1fr; }
.result-rank {
  grid-row: span 2; display: inline-grid; place-items: center; min-width: 2rem; height: 2rem; padding: 0 .25rem;
  background: var(--accent-soft); border-radius: 1rem; color: var(--accent); font-weight: 750; font-size: .9375rem;
}
:root[data-theme="dark"] .result-rank { color: var(--accent-ink); }
.result-addr { font-weight: 630; }
.result-meta { color: var(--text-mute); font-size: .9375rem; }
.result-dist { color: var(--text); font-weight: 700; font-variant-numeric: tabular-nums; }
.result-go {
  align-self: center; display: inline-flex; align-items: center; justify-content: center;
  min-height: var(--target); min-width: var(--target); padding: 0 .5rem; font-size: .875rem; font-weight: 600; border-radius: .5rem;
}
.result-go:hover { background: var(--accent-softer); }

.about { margin-top: 1.5rem; padding-top: .75rem; border-top: 1px solid var(--border); font-size: .875rem; color: var(--text-mute); }
.about p { margin: 0 0 .5rem; }
.noscript { padding: 1rem; background: var(--error-bg); }

/* Map DOM markers */
.sel-pin {
  display: grid; place-items: center; width: 2.75rem; height: 2.75rem;
  background: var(--map-pt); color: #fff; border: 3px solid var(--map-stroke); border-radius: 1rem;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .35);
  animation: pop .18s ease-out;
  cursor: pointer;
}
:root[data-theme="dark"] .sel-pin { color: #0d0f16; }
.sel-pin svg { width: 62%; height: 62%; }

.pmr-near {
  display: grid; place-items: center; width: var(--target); height: var(--target); padding: 0;
  background: var(--panel-solid); color: var(--accent); border: 3px solid var(--accent); border-radius: 50%;
  font-weight: 750; font-size: 1.0625rem; cursor: pointer;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .3);
  animation: pop .18s ease-out;
  transition: transform .12s ease;
}
.pmr-near:hover { transform: scale(1.08); }
:root[data-theme="dark"] .pmr-near { color: var(--accent-ink); border-color: var(--map-pt); }

.ref-marker { display: block; }
.ref-dot {
  position: relative; display: block; width: 1.375rem; height: 1.375rem; border-radius: 50%;
  background: var(--geo); border: 3px solid #fff; box-shadow: 0 0 0 2px var(--geo), 0 1px 4px rgba(0, 0, 0, .5);
}
.ref-dot::after {
  content: ""; position: absolute; inset: -.75rem; border-radius: 50%;
  border: 2px solid var(--geo); opacity: 0;
  animation: pulse 2.4s ease-out infinite;
}
.ref-pin {
  display: block; width: 1.625rem; height: 1.625rem; background: #e5484d; border: 3px solid #fff;
  border-radius: 50% 50% 50% 0; transform: rotate(-45deg); box-shadow: 0 1px 4px rgba(0, 0, 0, .5);
}

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pop { from { transform: scale(.6); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes rise { from { transform: translateY(-.25rem); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes rise-up { from { transform: translateY(.5rem); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes dialog-pop { from { transform: translate(-50%, -50%) scale(.95); opacity: 0; } to { transform: translate(-50%, -50%) scale(1); opacity: 1; } }
@keyframes pulse {
  0% { transform: scale(.5); opacity: .8; }
  70% { transform: scale(1.3); opacity: 0; }
  100% { transform: scale(1.3); opacity: 0; }
}

/* MapLibre controls: 44px targets, themed */
.maplibregl-map { font: inherit; }
.maplibregl-ctrl-group {
  background: var(--panel); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-radius: .875rem; box-shadow: var(--shadow-1); overflow: hidden;
}
.maplibregl-ctrl-group:not(:empty) { box-shadow: var(--shadow-1); }
.maplibregl-ctrl-group button { width: var(--target); height: var(--target); }
.maplibregl-ctrl-group button + button { border-top: 1px solid var(--border); }
.maplibregl-ctrl-group button:hover { background: var(--accent-softer); }
:root[data-theme="dark"] .maplibregl-ctrl button .maplibregl-ctrl-icon { filter: invert(1) hue-rotate(180deg); }
.maplibregl-ctrl-attrib {
  background: var(--panel); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border-radius: .5rem 0 0 0; font-size: .6875rem; color: var(--text-mute); padding: .125rem .5rem;
}
.maplibregl-ctrl-attrib a { color: var(--text-mute); }
.maplibregl-ctrl-scale {
  background: transparent; border-color: var(--text-mute); color: var(--text-mute);
  font-size: .6875rem; border-width: 0 2px 2px;
}

/* MapLibre popup, themed card */
.maplibregl-popup { z-index: 20; }
.maplibregl-popup-content {
  background: var(--panel-solid); color: var(--text);
  border-radius: var(--r-m); box-shadow: var(--shadow-2);
  padding: 1rem 2.75rem 1rem 1.125rem; font-size: 1rem; line-height: 1.45; min-width: 13rem;
  animation: pop .16s ease-out;
}
.maplibregl-popup-anchor-bottom .maplibregl-popup-tip,
.maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip,
.maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip { border-top-color: var(--panel-solid); }
.maplibregl-popup-anchor-top .maplibregl-popup-tip,
.maplibregl-popup-anchor-top-left .maplibregl-popup-tip,
.maplibregl-popup-anchor-top-right .maplibregl-popup-tip { border-bottom-color: var(--panel-solid); }
.maplibregl-popup-anchor-left .maplibregl-popup-tip { border-right-color: var(--panel-solid); }
.maplibregl-popup-anchor-right .maplibregl-popup-tip { border-left-color: var(--panel-solid); }
.maplibregl-popup-close-button {
  width: var(--target); height: var(--target); font-size: 1.5rem; color: var(--text);
  top: 0; right: 0; border-radius: 0 var(--r-m) 0 var(--r-m);
}
.maplibregl-popup-close-button:hover { background: var(--accent-softer); }
.maplibregl-popup-content h3 { font-size: 1.0625rem; letter-spacing: -.01em; margin: 0 0 .25rem; }
.maplibregl-popup-content p { margin: 0 0 .5rem; }
.maplibregl-popup-content .popup-note { font-size: .875rem; color: var(--text-mute); }
.popup-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .625rem; }
.popup-actions a.btn-primary { color: var(--btn-fg); }
.popup-actions a.btn-secondary { color: var(--accent); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
  .result-rank, .pmr-near, .sel-pin { border: 2px solid CanvasText; forced-color-adjust: none; }
}

/* Coverage table */
.coverage { margin-top: 1.5rem; border-top: 1px solid var(--border); padding-top: .5rem; }
.coverage > summary, .coverage-missing > summary {
  min-height: var(--target); display: flex; align-items: center; cursor: pointer; font-weight: 700; font-size: 1.0625rem;
  list-style-position: inside; border-radius: .5rem;
}
.coverage > summary:hover, .coverage-missing > summary:hover { color: var(--accent); }
.coverage > summary { display: list-item; padding: .625rem 0; }
.coverage-intro { font-size: .9375rem; color: var(--text-mute); }
.coverage-table { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.coverage-table th, .coverage-table td { text-align: left; padding: .375rem .25rem; border-bottom: 1px solid var(--border); vertical-align: top; }
.coverage-table thead th { font-size: .8125rem; color: var(--text-mute); font-weight: 600; }
.coverage-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.coverage-table td:last-child { white-space: nowrap; color: var(--text-mute); }
.coverage-src { display: block; font-weight: 400; font-size: .8125rem; }
.coverage-src a { color: var(--text-mute); }
.linklike {
  background: none; border: 0; padding: .25rem 0; min-height: var(--target); text-align: left; cursor: pointer;
  color: var(--accent); font-weight: 700; text-decoration: underline; text-underline-offset: .15em;
}
.linklike:hover { color: var(--accent-ink); }
.coverage-missing { margin-top: 1rem; font-size: .875rem; }
.coverage-missing > summary { display: list-item; font-size: .9375rem; padding: .5rem 0; }
.coverage-missing ul { padding-left: 1.25rem; }
.coverage-missing li { margin-bottom: .375rem; }

/* Community reports: "Signaler" entry point on the map + modal forms */
.report-fab {
  position: absolute; right: 1rem; bottom: 3.75rem; z-index: 900;
  display: inline-flex; align-items: center; gap: .5rem;
  min-height: var(--target); padding: .5rem 1.125rem; border: 0; border-radius: 999px; cursor: pointer;
  background: linear-gradient(145deg, var(--btn-bg), var(--btn-bg-hover)); color: var(--btn-fg);
  font-weight: 700; font-size: .9375rem; letter-spacing: -.005em;
  box-shadow: 0 2px 6px rgba(15, 18, 35, .18), 0 6px 20px rgba(67, 56, 202, .35);
  transition: box-shadow .15s ease, transform .12s ease, filter .15s ease;
}
.report-fab:hover { transform: translateY(-1px); filter: brightness(1.06); box-shadow: 0 3px 8px rgba(15, 18, 35, .2), 0 10px 26px rgba(67, 56, 202, .42); }
.report-fab:active { transform: translateY(1px); }
.report-fab[aria-expanded="true"] { filter: brightness(.94); transform: none; }
.report-fab svg { transition: transform .18s ease; }
.report-fab[aria-expanded="true"] svg { transform: rotate(-8deg) scale(.94); }

.report-menu {
  position: absolute; right: 1rem; bottom: 6.5rem; z-index: 901; width: min(20rem, calc(100% - 2rem));
  background: var(--panel); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  border: 1px solid var(--border); border-radius: var(--r-m);
  box-shadow: var(--shadow-2); padding: .5rem;
  transform-origin: bottom right; animation: rise-up .16s ease-out;
}
.report-menu-title {
  margin: .375rem .625rem .5rem; font-weight: 700; font-size: .8125rem;
  color: var(--text-mute); text-transform: uppercase; letter-spacing: .04em;
}
.report-menu button[role="menuitem"] {
  display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: .75rem;
  width: 100%; text-align: left; background: none; border: 0; border-radius: .625rem;
  padding: .5rem .625rem; min-height: var(--target); cursor: pointer;
  transition: background .12s ease;
}
.report-menu button[role="menuitem"] + button[role="menuitem"] { margin-top: .125rem; }
.report-menu button[role="menuitem"]:hover { background: var(--accent-softer); }
.report-menu button[role="menuitem"]:focus-visible { outline: 3px solid var(--focus); outline-offset: -2px; }
.report-menu button[role="menuitem"] strong { display: block; color: var(--text); letter-spacing: -.005em; }
.report-menu button[role="menuitem"] .report-menu-txt > span { display: block; font-size: .8125rem; color: var(--text-mute); }
.report-menu-ico {
  display: inline-grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: .75rem;
  background: var(--accent-soft); color: var(--accent);
}
.report-menu-ico svg { width: 1.25rem; height: 1.25rem; }
.report-menu button[data-type="occupancy"] .report-menu-ico { background: #fdeed7; color: #92400e; }
.report-menu button[data-type="place-removed"] .report-menu-ico { background: var(--error-bg); color: var(--error); }
:root[data-theme="dark"] .report-menu button[data-type="occupancy"] .report-menu-ico { background: #33270f; color: #fbbf24; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .report-menu button[data-type="occupancy"] .report-menu-ico { background: #33270f; color: #fbbf24; }
}

/* Modal: bottom sheet on mobile, centered dialog on desktop. Backdrop lets the
   map stay clickable so the user can tap to place a point. */
.modal { position: fixed; inset: 0; z-index: 2000; }
.modal[hidden] { display: none; }
.modal-backdrop {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(10, 12, 20, .5), rgba(10, 12, 20, .28));
  -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
}
.modal-sheet {
  position: absolute; left: 0; right: 0; bottom: 0; max-height: 86vh; overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--panel); color: var(--text);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  border: 1px solid var(--border); border-bottom: 0;
  border-radius: var(--r-l) var(--r-l) 0 0; box-shadow: var(--shadow-2);
  padding: .375rem 1.125rem calc(1.125rem + env(safe-area-inset-bottom, 0px));
  animation: rise-up .18s ease-out;
}
.modal-sheet::before {
  content: ""; display: block; width: 2.5rem; height: .25rem; margin: .25rem auto .375rem;
  border-radius: .25rem; background: var(--border-strong); opacity: .45;
}
/* While picking, keep the sheet short on mobile so the map above stays visible
   and tappable to place the point (reliable tactile tap). */
.modal.picking { pointer-events: none; }
.modal.picking .modal-sheet { max-height: 44vh; pointer-events: auto; }
.modal.picking .modal-backdrop { pointer-events: none; }
@media (min-width: 60em) {
  .modal.picking .modal-sheet { max-height: 88vh; }
}
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; }
.modal-title { margin: .375rem 0 .75rem; font-size: 1.125rem; letter-spacing: -.012em; }
.modal-close {
  flex: none; display: inline-grid; place-items: center; width: var(--target); height: var(--target);
  margin-right: -.5rem;
  background: transparent; border: 0; border-radius: .625rem; cursor: pointer; color: var(--text-mute);
  transition: background .15s ease, color .15s ease;
}
.modal-close:hover { background: var(--accent-softer); color: var(--text); }

@media (min-width: 60em) {
  .modal-sheet {
    left: 50%; right: auto; bottom: auto; top: 50%; transform: translate(-50%, -50%);
    width: min(30rem, 92vw); max-height: 88vh; border-radius: var(--r-l); overflow-y: auto;
    border-bottom: 1px solid var(--border);
    padding: .875rem 1.375rem 1.375rem;
    animation: dialog-pop .16s ease-out;
  }
  .modal-sheet::before { display: none; }
}

.report-loc {
  margin: 0 0 .625rem; padding: .625rem .875rem; border-radius: var(--r-m);
  background: var(--accent-softer); border: 1px solid var(--accent-soft); font-size: .9375rem;
}
.report-loc strong { display: block; letter-spacing: -.005em; }
.report-loc span { color: var(--text-mute); font-size: .875rem; font-variant-numeric: tabular-nums; }
.report-pos-hint { margin: -.125rem 0 .5rem; font-size: .85rem; color: var(--text-mute); }
.report-pos-row { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin: 0 0 .75rem; }
.report-tap { margin: 0; font-size: .875rem; color: var(--text-mute); flex: 1; min-width: 10rem; }
.report-note { resize: vertical; }
.report-file {
  display: block; width: 100%; min-height: var(--target); padding: .5rem;
  background: var(--field-bg); border: 1.5px dashed var(--border-strong); border-radius: var(--r-s);
  font-size: .9375rem; cursor: pointer; color: var(--text-mute);
  transition: border-color .15s ease, background .15s ease;
}
.report-file:hover { border-color: var(--accent); background: var(--accent-softer); }
.report-file:focus-visible { outline-offset: 0; }
.report-file::file-selector-button {
  margin-right: .75rem; padding: .375rem .875rem; min-height: 2rem;
  background: transparent; color: var(--accent); font: inherit; font-size: .875rem; font-weight: 650;
  border: 0; border-radius: .5rem; box-shadow: inset 0 0 0 1.5px var(--accent); cursor: pointer;
}
.report-photo-preview { margin-top: .625rem; }
.report-photo-preview img {
  max-width: 100%; max-height: 16rem; border-radius: var(--r-m); border: 1px solid var(--border);
  box-shadow: var(--shadow-1); display: block;
}
.report-photo-preview button {
  display: inline-flex; align-items: center; margin-top: .375rem; padding: .25rem .75rem;
  background: none; border: 0; border-radius: .5rem; color: var(--accent); cursor: pointer;
  font-weight: 650; font-size: .9375rem; min-height: var(--target);
  text-decoration: underline; text-underline-offset: .15em;
  transition: background .12s ease;
}
.report-photo-preview button:hover { background: var(--accent-softer); color: var(--accent-ink); }
.check {
  display: flex; align-items: flex-start; gap: .625rem; margin: .5rem 0 0;
  min-height: var(--target); padding: .375rem .25rem; cursor: pointer; font-size: .9375rem;
  border-radius: .5rem; transition: background .12s ease;
}
.check:hover { background: var(--accent-softer); }
.check input { width: 1.375rem; height: 1.375rem; flex: none; margin-top: .125rem; accent-color: var(--accent); }
.check span { line-height: 1.35; }

/* Status and error inside the form share the alert language (left border + tint) */
.report-status {
  display: flex; gap: .5rem; align-items: flex-start; margin: .75rem 0 0; padding: .75rem 1rem;
  border-left: 4px solid var(--accent); background: var(--info-bg);
  border-radius: 0 var(--r-s) var(--r-s) 0; font-size: .9375rem;
  animation: rise-up .16s ease-out;
}
.report-status p { margin: 0; }
.report-status.is-ok { border-left-color: var(--ok); background: var(--ok-bg); }
.report-actions { display: flex; gap: .625rem; justify-content: flex-end; margin-top: 1rem; }
.report-actions .btn { flex: none; }
@media (max-width: 30em) {
  .report-actions #report-submit { flex: 1; }
}

/* Placed point marker (place-missing / tap on the map) */
.report-pin {
  display: grid; place-items: center; width: 2.5rem; height: 2.5rem; background: var(--error);
  color: #fff; border: 3px solid #fff; border-radius: 50% 50% 50% 0; transform: rotate(-45deg);
  box-shadow: 0 3px 10px rgba(0, 0, 0, .4); animation: pop .18s ease-out;
}
:root[data-theme="dark"] .report-pin { color: #0d0f16; }
.report-pin svg { width: 55%; height: 55%; transform: rotate(45deg); }
.map-picking { cursor: crosshair; }
body.modal-open { overflow: hidden; }
.popup-report { display: flex; margin-top: .625rem; padding-top: .625rem; border-top: 1px solid var(--border); }
.popup-report .btn { flex: 1; color: var(--accent); font-size: .875rem; padding: .375rem .625rem; }

/* Mobile tap-to-place banner overlaid on the map while picking */
.report-tap-banner {
  position: absolute; left: 1rem; right: 1rem; top: 1rem; z-index: 950;
  display: flex; align-items: center; gap: .75rem;
  padding: .625rem .75rem; border-radius: var(--r-m);
  background: var(--panel); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  border: 1px solid var(--border); box-shadow: var(--shadow-2);
  font-size: .9375rem; font-weight: 600;
  animation: rise-up .16s ease-out;
}
.report-tap-banner[hidden] { display: none; }
.report-tap-dismiss {
  flex: none; min-width: var(--target); min-height: var(--target); margin-left: auto;
  padding: 0 .875rem; border: 0; border-radius: .625rem; cursor: pointer;
  background: var(--accent-soft); color: var(--accent-ink); font: inherit; font-size: .9375rem; font-weight: 700;
}
.report-tap-dismiss:hover { background: var(--accent-softer); }
@media (min-width: 60em) {
  .report-tap-banner { display: none; }
}

/* EXIF photo position proposal */
.report-exif {
  display: flex; align-items: center; gap: .625rem; flex-wrap: wrap;
  margin: 0 0 .75rem; padding: .625rem .75rem; border-radius: var(--r-m);
  background: var(--accent-softer); border: 1px solid var(--accent-soft); font-size: .9375rem;
}
.report-exif button { margin-left: auto; }