/* ══════════════════════════════════════════════════════════════
   DRUGZ — Carte des ressources RdR & addictologie (body.tool-carte)
   Feuille autonome (palette :root propre, aucune dépendance en
   cascade) — convention V2, alignée sur style-atlas.css.

   Deux sources agrégées :
   · lieux géolocalisés — API GoGoCarto (rdr-addicto.gogocarto.fr)
   · ressources en ligne — /assets/data/ressources-numeriques.json
     (catalogue éditorial DRUGZ, alimenté à la main)

   ⚠ Avis : données déclaratives, bandeau permanent en bas de page.
   ══════════════════════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
button { appearance: none; -webkit-appearance: none; background: none; border: none; font: inherit; color: inherit; cursor: pointer; }
ul { list-style: none; }
.carte-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;
}

:root {
	--safe-top: env(safe-area-inset-top, 0px);
	--safe-right: env(safe-area-inset-right, 0px);
	--safe-bottom: env(safe-area-inset-bottom, 0px);
	--safe-left: env(safe-area-inset-left, 0px);
	--bg: #04040a;
	--panel-bg: #0a0a14;
	--text-hi: rgba(255,255,255,0.96);
	--text-mid: rgba(255,255,255,0.82);
	--text-lo: rgba(255,255,255,0.58);
	--border: rgba(255,255,255,0.06);
	--border-hi: rgba(255,255,255,0.10);
	--accent: #00ffff;

	/* Familles de ressources — source unique côté rendu.
	   Doit rester alignée avec CATEGORY_TONES de carte-ressources.js. */
	--cat-rdr:      #00FFFF;
	--cat-soin:     #56C7FF;
	--cat-analyse:  #4BE38C;
	--cat-materiel: #F5C84B;
	--cat-festif:   #FF9838;
	--cat-commu:    #FF6DA9;
	--cat-online:   #C8A8FF;
	--cat-urgence:  #FF4D5E;
	--cat-autre:    #8FA3B8;

	--rail-w: 384px;

	color-scheme: dark;
}

html { background: var(--bg); height: 100%; overflow: hidden; }
body.tool-carte {
	background: var(--bg); color: var(--text-mid);
	font-family: 'Exo 2', system-ui, sans-serif;
	height: 100dvh; overflow: hidden;
	display: flex; flex-direction: column;
	-webkit-font-smoothing: antialiased;
}

/* Scanlines + grille dérivante (signature V2) */
body.tool-carte::before {
	content: ''; position: fixed; inset: 0;
	background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.06) 2px, rgba(0,0,0,0.06) 3px);
	pointer-events: none; z-index: 9000;
}
body.tool-carte::after {
	content: ''; position: fixed; inset: 0;
	background-image:
		radial-gradient(circle, rgba(255,255,255,0.04) 1px, transparent 1px),
		linear-gradient(rgba(255,255,255,0.018) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,0.018) 1px, transparent 1px);
	background-size: 32px 32px, 64px 64px, 64px 64px;
	pointer-events: none; z-index: 0; animation: carte-drift 90s linear infinite; opacity: 0.35;
}
@keyframes carte-drift { 0% { background-position: 0 0,0 0,0 0; } 100% { background-position: 32px 32px,64px 64px,64px 64px; } }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* ═══════ BARRE SUPÉRIEURE ═══════ */
.carte-topbar {
	position: relative; z-index: 40;
	display: flex; align-items: center; gap: 20px; flex-wrap: nowrap;
	padding: calc(12px + var(--safe-top)) calc(20px + var(--safe-right)) 12px calc(20px + var(--safe-left));
	background: rgba(6,6,12,0.92);
	border-bottom: 1px solid var(--border-hi);
	backdrop-filter: blur(8px);
}
.carte-brand {
	display: flex; flex-direction: column; justify-content: center;
	text-decoration: none; flex: 0 1 auto; min-width: 0;
	padding-right: 20px; border-right: 1px solid var(--border-hi);
}
.carte-brand .brand-name {
	font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: 20px;
	letter-spacing: 3px; color: var(--accent);
	text-shadow: 0 0 12px color-mix(in srgb, var(--accent) 30%, transparent);
}
.carte-brand .brand-sub {
	display: block; font-family: 'Share Tech Mono', monospace; font-size: 8px;
	letter-spacing: 0.18em; text-transform: uppercase; color: var(--text-lo); margin-top: 2px;
}
.carte-title { min-width: 150px; flex: 1 1 auto; }
.carte-title h1 {
	font-family: 'Orbitron', sans-serif; font-weight: 700;
	font-size: clamp(13px, 1.6vw, 17px); letter-spacing: 0.06em; color: var(--text-hi);
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.carte-title p {
	font-family: 'Share Tech Mono', monospace; font-size: 10.5px;
	letter-spacing: 0.06em; color: var(--text-lo); margin-top: 3px;
}
.carte-controls {
	display: flex; align-items: center; gap: 10px; flex-wrap: nowrap;
	margin-left: auto; min-width: 0;
}
.carte-field { position: relative; min-width: 0; flex: 0 1 230px; }
.carte-field > svg {
	position: absolute; left: 10px; top: 50%; transform: translateY(-50%);
	width: 14px; height: 14px; color: var(--text-lo); pointer-events: none;
}
.carte-search, .carte-select {
	font-family: 'Share Tech Mono', monospace; font-size: 12px;
	color: var(--text-mid); letter-spacing: 0.04em;
	background: rgba(255,255,255,0.03);
	border: 1px solid var(--border-hi); border-radius: 4px;
	padding: 9px 12px; outline: none;
	transition: border-color 0.2s, background 0.2s, opacity 0.2s;
}
.carte-search { padding-left: 32px; width: 100%; min-width: 0; }
#sel-region { width: 190px; }
#sel-service { width: 200px; }
.carte-search::placeholder { color: rgba(255,255,255,0.32); }
.carte-search:focus, .carte-select:focus {
	border-color: color-mix(in srgb, var(--accent) 50%, transparent);
	background: color-mix(in srgb, var(--accent) 5%, transparent);
}
.carte-select {
	appearance: none; -webkit-appearance: none; cursor: pointer;
	padding-right: 30px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2300ffff' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 10px center;
}
.carte-select:disabled { opacity: 0.4; cursor: not-allowed; }
.carte-select option { background: #0a0a14; color: var(--text-mid); }

/* Pastille d'état de synchronisation */
.carte-sync {
	display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto;
	padding: 8px 12px; border: 1px solid var(--border-hi); border-radius: 4px;
	font-family: 'Share Tech Mono', monospace; font-size: 10px;
	letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-lo);
	transition: all 0.2s; white-space: nowrap;
}
.carte-sync:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
.sync-dot {
	width: 7px; height: 7px; border-radius: 50%; flex: 0 0 auto;
	background: var(--text-lo); box-shadow: 0 0 6px currentColor;
	animation: carte-pulse 1.4s ease-in-out infinite;
}
.carte-sync.is-ok .sync-dot { background: var(--cat-analyse); box-shadow: 0 0 7px color-mix(in srgb, var(--cat-analyse) 70%, transparent); animation: none; }
.carte-sync.is-degraded .sync-dot { background: var(--cat-materiel); box-shadow: 0 0 7px color-mix(in srgb, var(--cat-materiel) 70%, transparent); animation: none; }
.carte-sync.is-error .sync-dot { background: var(--cat-urgence); box-shadow: 0 0 7px color-mix(in srgb, var(--cat-urgence) 70%, transparent); animation: none; }
@keyframes carte-pulse { 0%, 100% { opacity: 0.35; } 50% { opacity: 1; } }

/* ═══════ SCÈNE ═══════ */
.carte-stage {
	position: relative; z-index: 1; flex: 1; min-height: 0;
	display: flex; align-items: stretch;
}
.carte-map-wrap {
	/* z-index explicite : crée un contexte d'empilement pour confiner les
	   panes Leaflet (z-index 400-700) sous la fiche et le rail. */
	position: relative; z-index: 1; flex: 1 1 auto; min-width: 0; overflow: hidden;
	transition: opacity 0.3s ease, flex-basis 0.3s ease;
}
.carte-map { position: absolute; inset: 0; }
.carte-map, .carte-map.leaflet-container {
	/* z-index 0 : contexte d'empilement confinant les panes Leaflet sous
	   le voile de bord, les outils et la légende. */
	z-index: 0;
	background: #1b1b25; font-family: 'Exo 2', sans-serif; outline: none;
}
/* Fond relevé : les tuiles CARTO dark_all brutes sont trop denses pour une
   carte à marqueurs ponctuels, sans aplats pour porter l'image. */
.carte-map .leaflet-tile-pane { filter: saturate(0.30) brightness(1.62) contrast(0.88); }

/* Voile de bord : raccorde le fond éclairci au châssis sombre du site. */
.carte-map-wrap::after {
	content: ''; position: absolute; inset: 0; z-index: 5; pointer-events: none;
	box-shadow: inset 0 0 100px 24px rgba(4,4,10,0.5);
}
.carte-map .leaflet-control-container .leaflet-top,
.carte-map .leaflet-control-container .leaflet-bottom { display: none; }

/* ═══════ RAIL DE RÉSULTATS (gauche) ═══════ */
.carte-rail {
	position: relative; z-index: 20;
	flex: 0 0 var(--rail-w); width: var(--rail-w); min-width: 0;
	display: flex; flex-direction: column;
	background: rgba(8,8,16,0.94);
	border-right: 1px solid var(--border-hi);
	padding-left: var(--safe-left);
	transition: flex-basis 0.3s ease, width 0.3s ease;
}
.rail-handle { display: none; }
.rail-head { flex-shrink: 0; padding: 14px 16px 12px; border-bottom: 1px solid var(--border); }

/* Sélecteur de source */
.rail-modes {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px;
	padding: 3px; border: 1px solid var(--border-hi); border-radius: 5px;
	background: rgba(0,0,0,0.25);
}
.rail-modes button {
	padding: 8px 6px; border-radius: 3px;
	font-family: 'Share Tech Mono', monospace; font-size: 10.5px;
	letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-lo);
	transition: all 0.2s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rail-modes button:hover { color: var(--text-mid); background: rgba(255,255,255,0.04); }
.rail-modes button.is-active {
	color: var(--accent);
	background: color-mix(in srgb, var(--accent) 10%, transparent);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 32%, transparent);
}
.rail-modes button[data-mode="digital"].is-active {
	color: var(--cat-online);
	background: color-mix(in srgb, var(--cat-online) 12%, transparent);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cat-online) 34%, transparent);
}

/* Compteurs */
.rail-counters {
	display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 11px;
	font-family: 'Share Tech Mono', monospace; font-size: 9.5px;
	letter-spacing: 0.05em; text-transform: uppercase; color: rgba(255,255,255,0.38);
}
.rail-counters b { color: var(--text-mid); font-weight: 600; font-size: 11px; }
.rail-counters .is-digital b { color: var(--cat-online); }

/* Filtre catégories repliable */
.rail-categories {
	margin-top: 11px; border: 1px solid var(--border); border-radius: 4px;
	background: rgba(255,255,255,0.014); overflow: hidden;
}
.rail-categories > summary {
	display: flex; align-items: center; gap: 8px; padding: 9px 11px;
	cursor: pointer; list-style: none;
	font-family: 'Share Tech Mono', monospace; font-size: 10px;
	letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-lo);
}
.rail-categories > summary::-webkit-details-marker { display: none; }
.rail-categories > summary::after { content: '+'; margin-left: auto; font-size: 16px; line-height: 1; color: var(--accent); }
.rail-categories[open] > summary::after { content: '−'; }
.rail-categories > summary b { color: var(--text-mid); font-weight: 400; }
.cat-actions { display: flex; gap: 6px; padding: 0 11px 9px; }
.cat-actions button {
	flex: 1; padding: 6px 8px; border: 1px solid var(--border-hi); border-radius: 3px;
	font-family: 'Share Tech Mono', monospace; font-size: 9px;
	letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-lo);
	transition: all 0.2s;
}
.cat-actions button:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
.cat-list { display: flex; flex-wrap: wrap; gap: 5px; padding: 0 11px 11px; max-height: 210px; overflow-y: auto; scrollbar-width: thin; }
.cat-chip {
	--tone: var(--cat-autre);
	display: inline-flex; align-items: center; gap: 6px;
	padding: 5px 9px; border: 1px solid var(--border-hi); border-radius: 999px;
	font-family: 'Share Tech Mono', monospace; font-size: 9.5px; line-height: 1.1;
	letter-spacing: 0.03em; color: var(--text-lo);
	background: rgba(0,0,0,0.2); transition: all 0.18s;
}
.cat-chip::before {
	content: ''; width: 7px; height: 7px; flex: 0 0 auto; border-radius: 1px;
	transform: rotate(45deg); background: var(--tone); opacity: 0.55;
}
.cat-chip:hover { color: var(--text-mid); border-color: color-mix(in srgb, var(--tone) 45%, transparent); }
.cat-chip.is-active {
	color: color-mix(in srgb, var(--tone) 80%, white);
	border-color: color-mix(in srgb, var(--tone) 55%, transparent);
	background: color-mix(in srgb, var(--tone) 10%, transparent);
}
.cat-chip.is-active::before { opacity: 1; box-shadow: 0 0 7px var(--tone); }
.cat-chip small { color: rgba(255,255,255,0.32); font-size: 8.5px; }

/* Bandeau contextuel du rail — remplace l'ancien encart posé sur la carte */
.rail-strip {
	display: flex; align-items: flex-start; gap: 8px; margin-top: 11px;
	padding: 9px 11px; border-radius: 4px;
	border: 1px solid color-mix(in srgb, var(--cat-online) 26%, transparent);
	border-left: 2px solid var(--cat-online);
	background: color-mix(in srgb, var(--cat-online) 5%, transparent);
	font-family: 'Share Tech Mono', monospace; font-size: 9.5px; line-height: 1.55;
	letter-spacing: 0.03em; color: color-mix(in srgb, var(--cat-online) 78%, white);
}
.rail-strip[hidden] { display: none; }
.rail-strip b { color: #fff; font-weight: 500; }
.rail-strip button {
	margin-left: auto; flex: 0 0 auto; align-self: center;
	font-family: inherit; font-size: 9px; letter-spacing: 0.05em; text-transform: uppercase;
	color: var(--cat-online); border-bottom: 1px dotted currentColor; white-space: nowrap;
}

/* ═══════ LISTE DES RÉSULTATS ═══════ */
.rail-list {
	flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin;
	padding: 12px 16px 4px; display: grid; gap: 8px; align-content: start;
}
.rail-list::-webkit-scrollbar { width: 8px; }
.rail-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.10); border-radius: 4px; }

.res-card {
	--tone: var(--cat-autre);
	position: relative; min-width: 0; width: 100%; text-align: left;
	padding: 12px 13px 11px 15px;
	border: 1px solid var(--border); border-left: 3px solid var(--tone);
	border-radius: 5px; background: rgba(255,255,255,0.018);
	transition: border-color 0.18s, background 0.18s, transform 0.18s;
}
.res-card::before {
	content: ''; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
	background: linear-gradient(105deg, color-mix(in srgb, var(--tone) 5%, transparent), transparent 45%);
}
.res-card:hover, .res-card:focus-visible, .res-card.is-hovered {
	border-color: color-mix(in srgb, var(--tone) 42%, transparent);
	background: color-mix(in srgb, var(--tone) 5%, transparent);
	transform: translateX(2px);
}
.res-card.is-selected {
	border-color: color-mix(in srgb, var(--tone) 62%, transparent);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tone) 22%, transparent);
}
.res-card-head { display: flex; align-items: flex-start; gap: 9px; }
.res-card h3 {
	flex: 1; min-width: 0;
	font-family: 'Orbitron', sans-serif; font-size: 11px; font-weight: 700;
	line-height: 1.45; letter-spacing: 0.045em; color: var(--text-hi);
}
.res-badge {
	flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px;
	padding: 4px 7px; border-radius: 999px;
	border: 1px solid color-mix(in srgb, var(--tone) 38%, transparent);
	background: color-mix(in srgb, var(--tone) 8%, transparent);
	font-family: 'Share Tech Mono', monospace; font-size: 7.5px;
	letter-spacing: 0.05em; text-transform: uppercase;
	color: color-mix(in srgb, var(--tone) 80%, white);
}
.res-card-cat {
	display: block; margin-top: 7px;
	font-family: 'Share Tech Mono', monospace; font-size: 9px;
	letter-spacing: 0.05em; text-transform: uppercase;
	color: color-mix(in srgb, var(--tone) 72%, white);
}
.res-card-meta {
	display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 6px;
	font-family: 'Share Tech Mono', monospace; font-size: 9px; line-height: 1.5;
	color: rgba(255,255,255,0.42);
}
.res-card-meta .is-distance { color: var(--text-lo); }
.res-card-excerpt {
	margin-top: 7px; font-size: 11.5px; line-height: 1.55; color: var(--text-lo);
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

.rail-empty {
	padding: 22px 16px; border: 1px dashed var(--border-hi); border-radius: 5px;
	font-size: 12.5px; line-height: 1.7; color: var(--text-lo); text-align: center;
}
.rail-empty b { display: block; margin-bottom: 6px; font-family: 'Orbitron', sans-serif; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-mid); }

.rail-more {
	width: 100%; padding: 10px; border: 1px solid var(--border-hi); border-radius: 4px;
	font-family: 'Share Tech Mono', monospace; font-size: 10px;
	letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-lo);
	transition: all 0.2s;
}
.rail-more:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 40%, transparent); background: color-mix(in srgb, var(--accent) 5%, transparent); }

/* Pied du rail */
.rail-foot {
	flex-shrink: 0; display: flex; flex-wrap: wrap; gap: 6px;
	padding: 10px 16px calc(12px + var(--safe-bottom));
	border-top: 1px solid var(--border); background: rgba(0,0,0,0.2);
}
.rail-foot a {
	flex: 1 1 140px; text-align: center; text-decoration: none;
	padding: 9px 10px; border: 1px solid var(--border-hi); border-radius: 4px;
	font-family: 'Share Tech Mono', monospace; font-size: 9.5px;
	letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-lo);
	transition: all 0.2s;
}
.rail-foot a:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 40%, transparent); background: color-mix(in srgb, var(--accent) 5%, transparent); }
.rail-foot a.is-primary {
	color: color-mix(in srgb, var(--accent) 88%, white);
	border-color: color-mix(in srgb, var(--accent) 34%, transparent);
	background: color-mix(in srgb, var(--accent) 7%, transparent);
}

/* ═══════ MODE « EN LIGNE » — catalogue plein cadre ═══════
   Les ressources numériques ne sont pas géolocalisables : le rail
   prend toute la scène plutôt que de recouvrir la carte. */
.carte-stage.is-online .carte-rail { flex-basis: 100%; width: 100%; border-right: none; }
.carte-stage.is-online .carte-map-wrap { flex: 0 0 0; opacity: 0; pointer-events: none; }
.carte-stage.is-online .rail-head,
.carte-stage.is-online .rail-list,
.carte-stage.is-online .rail-foot { padding-left: max(24px, var(--safe-left)); padding-right: 24px; }
.carte-stage.is-online .rail-modes { max-width: 420px; }
.carte-stage.is-online .rail-list {
	grid-template-columns: repeat(auto-fill, minmax(288px, 1fr));
	align-content: start; gap: 10px; padding-top: 16px;
}
.carte-stage.is-online .res-card-excerpt { -webkit-line-clamp: 3; }
.carte-stage.is-online .rail-more { grid-column: 1 / -1; }
.carte-stage.is-online .rail-empty { grid-column: 1 / -1; }
.carte-stage.is-online .rail-foot { justify-content: flex-start; }
.carte-stage.is-online .rail-foot a.is-primary { display: none; }
.carte-stage.is-online .rail-foot a { flex: 0 1 240px; }

/* ═══════ OUTILS DE CARTE ═══════ */
.carte-maptools {
	position: absolute; top: 18px; left: 18px; z-index: 15;
	display: flex; flex-direction: column; gap: 8px;
}
.carte-maptools button {
	width: 40px; height: 40px;
	display: flex; align-items: center; justify-content: center;
	background: rgba(8,8,16,0.94); border: 1px solid var(--border-hi); border-radius: 4px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.4);
	color: var(--text-mid); font-family: 'Share Tech Mono', monospace; font-size: 18px;
	transition: all 0.2s;
}
.carte-maptools button:hover, .carte-maptools button:focus-visible {
	color: var(--accent);
	border-color: color-mix(in srgb, var(--accent) 45%, transparent);
	background: color-mix(in srgb, var(--accent) 8%, transparent);
}
.carte-maptools button svg { width: 17px; height: 17px; }
.carte-maptools .is-sep { margin-top: 4px; }

/* Légende */
.carte-legend {
	position: absolute; bottom: 14px; left: 18px; z-index: 12;
	display: flex; align-items: center; gap: 4px 18px; flex-wrap: wrap;
	background: rgba(8,8,16,0.94); border: 1px solid var(--border-hi);
	border-radius: 4px; padding: 9px 14px;
	backdrop-filter: blur(6px); box-shadow: 0 2px 14px rgba(0,0,0,0.42);
	width: fit-content; max-width: min(560px, calc(100% - 200px));
}
.carte-legend .lg-item {
	display: flex; align-items: center; gap: 8px;
	font-family: 'Share Tech Mono', monospace; font-size: 10px;
	letter-spacing: 0.04em; color: var(--text-lo); padding: 2px 0;
}
.carte-legend .lg-dot {
	width: 8px; height: 8px; border-radius: 1px; transform: rotate(45deg);
	background: var(--tone); box-shadow: 0 0 6px color-mix(in srgb, var(--tone) 60%, transparent);
	flex-shrink: 0;
}
.carte-legend .lg-item b { color: rgba(255,255,255,0.42); font-weight: 400; }

/* Attribution — logée dans le bandeau bas plutôt que sur la carte,
   pour rester lisible quand la fiche est ouverte. */
.carte-attrib {
	font-size: 9px; letter-spacing: 0.04em; color: rgba(255,255,255,0.30);
}
.carte-attrib a { color: inherit; text-decoration: none; border-bottom: 1px dotted rgba(255,255,255,0.2); }
.carte-attrib a:hover, .carte-attrib a:focus-visible { color: var(--accent); border-color: var(--accent); }

/* Message d'état plein cadre */
.carte-message {
	position: absolute; inset: 0; z-index: 50;
	display: grid; place-items: center; padding: 24px;
	background: rgba(4,4,10,0.82); backdrop-filter: blur(3px);
}
.carte-message[hidden] { display: none; }
.carte-message .msg-card {
	max-width: 420px; padding: 20px 22px;
	border: 1px solid var(--border-hi); border-radius: 6px;
	background: rgba(9,9,17,0.96); text-align: center;
}
.carte-message h2 {
	font-family: 'Orbitron', sans-serif; font-size: 12px; font-weight: 700;
	letter-spacing: 0.09em; text-transform: uppercase; color: var(--text-hi);
}
.carte-message p { margin-top: 10px; font-size: 12.5px; line-height: 1.7; color: var(--text-lo); }

/* ═══════ MARQUEURS ═══════ */
.dz-marker {
	--tone: var(--cat-autre);
	width: 15px; height: 15px; transform: rotate(45deg);
	border-radius: 2px; border: 2px solid var(--tone);
	background: color-mix(in srgb, var(--tone) 22%, #06060e);
	/* Double halo : anneau sombre qui détache du fond relevé, puis lueur
	   de la famille de ressources. */
	box-shadow:
		0 0 0 1.5px rgba(4,4,10,0.6),
		0 0 10px color-mix(in srgb, var(--tone) 55%, transparent);
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.dz-marker.is-active, .leaflet-marker-icon:hover .dz-marker {
	transform: rotate(45deg) scale(1.35);
	box-shadow: 0 0 0 1.5px rgba(4,4,10,0.75), 0 0 18px var(--tone);
}
.leaflet-marker-icon:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.marker-cluster { background: none; border: none; }
.marker-cluster > div {
	width: 100%; height: 100%;
	display: flex; align-items: center; justify-content: center;
	border: 1.5px solid color-mix(in srgb, var(--accent) 60%, transparent);
	border-radius: 3px; background: rgba(6,10,18,0.94);
	box-shadow: 0 0 0 1px rgba(4,4,10,0.5),
		0 2px 12px rgba(0,0,0,0.5),
		inset 0 0 18px color-mix(in srgb, var(--accent) 9%, transparent);
	font-family: 'Share Tech Mono', monospace; font-size: 11px;
	letter-spacing: 0.04em; color: color-mix(in srgb, var(--accent) 82%, white);
}
.marker-cluster-large > div { font-size: 13px; }

.dz-tooltip.leaflet-tooltip {
	background: rgba(8,8,16,0.96); border: 1px solid var(--border-hi);
	border-radius: 4px; padding: 6px 10px; box-shadow: 0 2px 12px rgba(0,0,0,0.5);
	font-family: 'Orbitron', sans-serif; font-size: 10px; font-weight: 700;
	letter-spacing: 0.05em; color: var(--text-hi);
}
.dz-tooltip.leaflet-tooltip::before { border-top-color: var(--border-hi); }

/* ═══════ PANNEAU FICHE ═══════ */
.carte-panel {
	position: absolute; top: 18px; right: 18px; bottom: 18px; z-index: 55;
	width: min(430px, calc(100% - 36px));
	display: flex; flex-direction: column;
	background: rgba(9,9,17,0.96);
	border: 1px solid var(--border-hi); border-radius: 6px;
	backdrop-filter: blur(10px);
	box-shadow: 0 12px 48px rgba(0,0,0,0.6);
	transform: translateX(calc(100% + 30px));
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
	overflow: hidden;
}
.carte-panel.is-open { transform: translateX(0); }
.carte-stage.is-online .carte-panel {
	top: auto; right: 24px; bottom: 24px;
	max-height: min(78dvh, 760px);
}

.panel-close {
	position: absolute; top: 14px; right: 14px; z-index: 2;
	width: 34px; height: 34px; border-radius: 4px;
	display: flex; align-items: center; justify-content: center;
	font-family: 'Share Tech Mono', monospace; font-size: 20px; line-height: 1;
	color: var(--text-lo); transition: all 0.2s;
}
.panel-close:hover, .panel-close:focus-visible { color: var(--text-hi); background: rgba(255,255,255,0.06); }
.panel-scroll { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.panel-head { padding: 22px 24px 18px; border-bottom: 1px solid var(--border); }
.panel-kicker {
	display: block; margin-bottom: 7px;
	font-family: 'Share Tech Mono', monospace; font-size: 8.5px;
	letter-spacing: 0.15em; text-transform: uppercase;
	color: color-mix(in srgb, var(--tone, var(--accent)) 78%, white);
}
.panel-head h2 {
	font-family: 'Orbitron', sans-serif; font-weight: 900;
	font-size: clamp(16px, 2.4vw, 21px); line-height: 1.3;
	letter-spacing: 0.035em; color: var(--text-hi); padding-right: 40px;
}
.panel-location {
	margin-top: 9px; font-family: 'Share Tech Mono', monospace;
	font-size: 10.5px; line-height: 1.6; letter-spacing: 0.04em; color: var(--text-lo);
}
.panel-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 12px; }
.panel-chip {
	--tone: var(--cat-autre);
	display: inline-flex; align-items: center; gap: 6px;
	padding: 4px 8px; border-radius: 999px;
	border: 1px solid color-mix(in srgb, var(--tone) 36%, transparent);
	background: color-mix(in srgb, var(--tone) 7%, transparent);
	font-family: 'Share Tech Mono', monospace; font-size: 8px; line-height: 1.2;
	letter-spacing: 0.055em; text-transform: uppercase;
	color: color-mix(in srgb, var(--tone) 80%, white);
}
.panel-chip.is-neutral { --tone: var(--text-lo); color: rgba(255,255,255,0.46); }
.panel-chip.is-warn { --tone: var(--cat-materiel); }

.panel-body { padding: 18px 24px 24px; }
.panel-section + .panel-section { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--border); }
.panel-section > h3 {
	font-family: 'Orbitron', sans-serif; font-size: 9.5px; font-weight: 700;
	letter-spacing: 0.09em; text-transform: uppercase; color: var(--text-hi);
	margin-bottom: 10px;
}
.panel-section p { font-size: 12.5px; line-height: 1.72; color: var(--text-mid); }
.panel-note {
	font-family: 'Share Tech Mono', monospace; font-size: 9.5px !important;
	line-height: 1.65 !important; letter-spacing: 0.035em; color: rgba(255,255,255,0.40) !important;
}

.panel-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.panel-tags span {
	padding: 5px 9px; border: 1px solid var(--border); border-radius: 4px;
	background: rgba(0,0,0,0.16);
	font-family: 'Share Tech Mono', monospace; font-size: 9.5px; line-height: 1.3;
	color: var(--text-lo);
}

.panel-hours { display: grid; gap: 3px; }
.panel-hours .hr-row {
	display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 10px;
	padding: 6px 8px; border-radius: 3px;
	font-family: 'Share Tech Mono', monospace; font-size: 10px; line-height: 1.4;
	color: var(--text-lo);
}
.panel-hours .hr-row:nth-child(odd) { background: rgba(255,255,255,0.02); }
.panel-hours .hr-row b { color: var(--text-mid); font-weight: 400; }

.panel-contacts { display: grid; gap: 6px; }
.panel-contacts a {
	display: flex; align-items: center; gap: 10px;
	padding: 10px 12px; border: 1px solid var(--border); border-radius: 4px;
	text-decoration: none; color: var(--text-mid);
	font-size: 12px; transition: all 0.2s;
}
.panel-contacts a:hover, .panel-contacts a:focus-visible {
	border-color: color-mix(in srgb, var(--accent) 35%, transparent);
	background: color-mix(in srgb, var(--accent) 4%, transparent);
	color: var(--text-hi);
}
.panel-contacts .ct-label {
	font-family: 'Share Tech Mono', monospace; font-size: 8.5px;
	letter-spacing: 0.07em; text-transform: uppercase; color: rgba(255,255,255,0.35);
	flex: 0 0 76px;
}
.panel-contacts .ct-value { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.panel-contacts .ct-go { flex: 0 0 auto; color: var(--accent); opacity: 0.7; font-family: 'Share Tech Mono', monospace; }

.panel-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.panel-actions a {
	flex: 1 1 150px; text-align: center; text-decoration: none;
	padding: 10px 12px; border: 1px solid var(--border-hi); border-radius: 4px;
	font-family: 'Share Tech Mono', monospace; font-size: 10px;
	letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-lo);
	transition: all 0.2s;
}
.panel-actions a:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 40%, transparent); background: color-mix(in srgb, var(--accent) 5%, transparent); }
.panel-actions a.is-primary {
	color: color-mix(in srgb, var(--accent) 90%, white);
	border-color: color-mix(in srgb, var(--accent) 38%, transparent);
	background: color-mix(in srgb, var(--accent) 9%, transparent);
}

.panel-trace {
	margin-top: 16px; padding: 11px 13px;
	border: 1px solid var(--border); border-left: 2px solid var(--border-hi);
	border-radius: 4px; background: rgba(255,255,255,0.014);
	font-family: 'Share Tech Mono', monospace; font-size: 9px; line-height: 1.6;
	letter-spacing: 0.035em; color: rgba(255,255,255,0.40);
}
.panel-trace b { color: rgba(255,255,255,0.62); font-weight: 600; }
.panel-trace.is-pending {
	border-color: color-mix(in srgb, var(--cat-materiel) 26%, transparent);
	border-left-color: var(--cat-materiel);
	background: color-mix(in srgb, var(--cat-materiel) 4%, transparent);
	color: color-mix(in srgb, var(--cat-materiel) 74%, white);
}

/* ═══════ BANDEAU AVERTISSEMENT ═══════ */
.carte-disclaimer {
	position: relative; z-index: 40; flex-shrink: 0;
	display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
	padding: 10px calc(20px + var(--safe-right)) calc(10px + var(--safe-bottom)) calc(20px + var(--safe-left));
	background: rgba(6,6,12,0.94);
	border-top: 1px solid var(--border-hi);
	font-family: 'Share Tech Mono', monospace; font-size: 10.5px;
	letter-spacing: 0.05em; color: var(--text-lo); line-height: 1.6;
}
.carte-disclaimer svg { width: 15px; height: 15px; color: var(--accent); opacity: 0.7; flex-shrink: 0; }
.carte-disclaimer .spacer { flex: 1; }
.carte-disclaimer a { color: var(--text-lo); text-decoration: none; border-bottom: 1px dotted rgba(255,255,255,0.25); }
.carte-disclaimer a:hover, .carte-disclaimer a:focus-visible { color: var(--accent); border-color: var(--accent); }
.carte-disclaimer .maj { color: rgba(255,255,255,0.32); white-space: nowrap; }

/* ═══════ RESPONSIVE ═══════ */
@media (max-width: 1280px) {
	.carte-topbar { flex-wrap: wrap; gap: 12px 18px; }
	.carte-controls { order: 3; width: 100%; margin-left: 0; }
	.carte-field { flex: 1 1 240px; }
	#sel-region, #sel-service { flex: 1 1 180px; width: auto; min-width: 0; }
	.carte-sync { margin-left: auto; }
}

@media (max-width: 1080px) {
	:root { --rail-w: 330px; }
	.carte-legend { max-width: calc(100% - 130px); }
	.carte-panel { top: 12px; right: 12px; bottom: 12px; }
}

@media (max-width: 900px) {
	.carte-topbar {
		gap: 10px 12px;
		padding: calc(10px + var(--safe-top)) calc(14px + var(--safe-right)) 10px calc(14px + var(--safe-left));
	}
	.carte-brand { padding-right: 12px; }
	.carte-title p { display: none; }
	.carte-controls { width: 100%; }
	.carte-sync .sync-label { display: none; }
	.carte-sync { padding: 8px 10px; }

	/* Scène en colonne : carte en haut, rail en volet bas.
	   L'ordre du flux garde le rail avant la carte dans le DOM (priorité
	   lecteur d'écran) ; seul l'ordre visuel est inversé. */
	.carte-stage { flex-direction: column; }
	.carte-map-wrap { order: 1; flex: 1 1 auto; min-height: 0; }
	.carte-rail {
		order: 2; flex: 0 0 auto; width: 100%;
		max-height: 48dvh;
		border-right: none; border-top: 1px solid var(--border-hi);
		border-radius: 12px 12px 0 0;
		padding-left: var(--safe-left); padding-right: var(--safe-right);
		box-shadow: 0 -14px 40px rgba(0,0,0,0.55);
		transition: max-height 0.3s ease;
	}
	.rail-handle {
		display: flex; align-items: center; justify-content: center; gap: 10px;
		width: 100%; flex-shrink: 0; padding: 7px 14px 5px;
		font-family: 'Share Tech Mono', monospace; font-size: 9px;
		letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.38);
	}
	.rail-handle-bar {
		width: 34px; height: 3px; border-radius: 2px; background: rgba(255,255,255,0.18);
	}
	.carte-rail.is-collapsed { max-height: none; }
	.carte-rail.is-collapsed .rail-head,
	.carte-rail.is-collapsed .rail-list,
	.carte-rail.is-collapsed .rail-foot { display: none; }
	.carte-rail.is-collapsed .rail-handle { padding-bottom: calc(7px + var(--safe-bottom)); }
	.rail-head { padding: 10px 14px 10px; }
	.rail-list { padding: 10px 14px 4px; }
	.rail-foot { padding: 8px 14px calc(10px + var(--safe-bottom)); }
	.cat-list { max-height: 132px; }

	.carte-stage.is-online .carte-rail { max-height: none; flex: 1 1 auto; border-radius: 0; box-shadow: none; }
	.carte-stage.is-online .carte-map-wrap { flex: 0 0 0; min-height: 0; }
	.carte-stage.is-online .rail-head,
	.carte-stage.is-online .rail-list,
	.carte-stage.is-online .rail-foot { padding-left: max(14px, var(--safe-left)); padding-right: 14px; }
	.carte-stage.is-online .rail-list { grid-template-columns: 1fr; }
	.carte-stage.is-online .carte-panel { right: 0; bottom: 0; left: 0; }

	/* Fiche en volet bas */
	.carte-panel {
		position: fixed; top: auto; left: 0; right: 0; bottom: 0;
		width: 100%; max-height: 78dvh; z-index: 60;
		padding-left: var(--safe-left); padding-right: var(--safe-right);
		border-radius: 12px 12px 0 0; border-left: none; border-right: none; border-bottom: none;
		transform: translateY(105%);
	}
	.carte-panel.is-open { transform: translateY(0); }
	.panel-head { padding: 18px 18px 14px; }
	.panel-body { padding: 16px 18px 22px; }

	.carte-maptools { top: 12px; left: 12px; flex-direction: row; }
	.carte-legend { bottom: 10px; left: 10px; right: 10px; width: auto; max-width: none; gap: 3px 12px; padding: 8px 11px; }
	.carte-legend .lg-item { font-size: 9px; }
	.carte-legend .lg-item:nth-child(n+5) { display: none; }
}

@media (max-width: 520px) {
	.carte-topbar {
		padding: calc(8px + var(--safe-top)) calc(10px + var(--safe-right)) 8px calc(10px + var(--safe-left));
	}
	.carte-brand { padding-right: 0; border-right: 0; }
	.carte-brand .brand-sub { display: none; }
	.carte-brand .brand-name { font-size: 18px; letter-spacing: 2px; }
	.carte-title { min-width: 0; }
	.carte-title h1 { font-size: 12px; letter-spacing: 0.035em; }
	.carte-controls {
		display: grid; gap: 8px;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
	}
	.carte-field { grid-column: 1 / 3; grid-row: 1; width: 100%; }
	.carte-sync { grid-column: 3; grid-row: 1; }
	#sel-region { grid-column: 1; grid-row: 2; }
	#sel-service { grid-column: 2; grid-row: 2; }
	#sel-region, #sel-service { width: 100%; min-width: 0; }
	.carte-search, .carte-select { font-size: 11px; padding-top: 8px; padding-bottom: 8px; }
	.carte-search { padding-left: 32px; }
	.carte-legend .lg-item:nth-child(n+4) { display: none; }

	.rail-modes button { font-size: 9.5px; padding: 8px 4px; }
	.rail-counters { font-size: 9px; gap: 3px 10px; }
	.carte-legend .lg-item { font-size: 8.5px; gap: 6px; }
	.panel-contacts .ct-label { flex-basis: 62px; }

	.carte-disclaimer {
		gap: 5px 10px;
		padding: 7px calc(10px + var(--safe-right)) calc(7px + var(--safe-bottom)) calc(10px + var(--safe-left));
		font-size: 9px; line-height: 1.4;
	}
	.carte-disclaimer > svg { display: none; }
	.carte-disclaimer .disclaimer-text { flex: 1 1 100%; }
	.carte-disclaimer .spacer { display: none; }
	.carte-disclaimer .maj { margin-left: auto; }
	.carte-disclaimer .carte-attrib { flex: 1 1 100%; font-size: 8px; }
}

@media (max-width: 900px) and (max-height: 640px) {
	.carte-rail { max-height: 42dvh; }
	.carte-panel { max-height: 92dvh; }
	.carte-disclaimer { padding-top: 5px; padding-bottom: calc(5px + var(--safe-bottom)); }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}