/* Nécropoles royales — styles propres ; charte partagée : /assets/site.css */
:root {
  --bg: #f2f5fa; --bg2: #e9eef7; --carte: #ffffff;
  --bordure: rgba(184, 154, 90, 0.28); --ligne: #dfe5ee;
  --encre: #1d3a5f; --texte: #1a1814; --muet: #6e6659;
  --or: #b89a5a; --or-txt: #7a5d22;
  --serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans: "Montserrat", system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
  --nav-h: 72px; --paper: #f2f5fa; --paper-dark: #e6ecf6; --brand: #1d3a5f; --gold: #b89a5a; --muted: #6e6659; --ink: #1a1814;
  /* statuts des restes */
  --st-p: #2f7d4f; --st-o: #b5651d; --st-x: #b23a3a; --st-l: #7a7060; --st-t: #3f6fae; --st-h: #8e4585; --st-k: #9a7b3f;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { background: var(--bg); }
body { font-family: var(--sans); font-weight: 400; background: var(--bg); color: var(--texte); min-height: 100vh; padding-top: var(--nav-h); display: flex; flex-direction: column; }
button { font-family: inherit; }

.entete { width: 100%; max-width: 900px; margin: 0 auto; padding: 1.8rem 1.25rem 0.4rem; text-align: center; }
.entete h1 { font-family: var(--serif); font-weight: 600; font-size: clamp(2.1rem, 5.2vw, 3.3rem); line-height: 1.05; color: var(--brand); }
.accroche { margin: 0.5rem auto 0; font-family: var(--serif); font-style: italic; font-size: clamp(1rem, 2vw, 1.2rem); color: var(--muet); max-width: 680px; line-height: 1.4; }
.filet { height: 2px; width: 60px; margin: 0.9rem auto 0; background: var(--or); }

/* ---- Barre de filtres ---- */
.filtres { width: 100%; max-width: 1280px; margin: 1.1rem auto 0; padding: 0 16px; display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: flex-end; font-size: 12.5px; }
.f-grp { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.f-lbl { font-size: 10.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--or-txt); }
.seg { display: inline-flex; border: 1px solid var(--bordure); border-radius: 8px; overflow: hidden; background: #fff; }
.seg button { border: 0; background: none; padding: 7px 11px; font-size: 12px; color: var(--encre); cursor: pointer; border-right: 1px solid var(--ligne); }
.seg button:last-child { border-right: 0; }
.seg button.on { background: var(--brand); color: #fff; }
.chips { display: flex; flex-wrap: wrap; gap: 5px; }
.chip { display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border: 1px solid var(--bordure); border-radius: 999px; background: #fff; cursor: pointer; font-size: 11.5px; color: var(--texte); user-select: none; }
.chip input { accent-color: var(--brand); margin: 0; }
.chip .dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.chip.off { opacity: 0.55; }
select.sel, input.num, input.srch { border: 1px solid var(--bordure); background: #fff; border-radius: 8px; padding: 7px 9px; font-size: 12.5px; font-family: inherit; color: var(--encre); }
input.num { width: 74px; }
.f-srch { position: relative; flex: 1 1 220px; }
input.srch { width: 100%; }
.srch-res { position: absolute; top: 100%; left: 0; right: 0; z-index: 1200; background: #fff; border: 1px solid var(--bordure); border-radius: 8px; margin-top: 3px; max-height: 320px; overflow: auto; box-shadow: 0 10px 28px rgba(29,58,95,0.16); display: none; }
.srch-res button { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 7px 10px; font-size: 12.5px; cursor: pointer; color: var(--texte); border-bottom: 1px solid var(--ligne); }
.srch-res button:hover, .srch-res button.act { background: var(--bg2); }
.srch-res small { color: var(--muet); }
.compteur { font-size: 12px; color: var(--muet); padding-bottom: 7px; }
.compteur b { color: var(--encre); }

/* ---- Scène : carte + panneau ---- */
.scene { width: 100%; max-width: 1280px; margin: 0.8rem auto 0; padding: 0 16px; display: grid; grid-template-columns: minmax(0, 1fr) 390px; gap: 14px; }
.carte-wrap { position: relative; height: min(76vh, 720px); min-height: 440px; border: 1px solid var(--bordure); border-radius: 12px; overflow: hidden; }
#map { position: absolute; inset: 0; background: var(--bg2); }
.panneau { height: min(76vh, 720px); min-height: 440px; border: 1px solid var(--bordure); border-radius: 12px; background: #fff; display: flex; flex-direction: column; overflow: hidden; }
@media (max-width: 900px) {
  .scene { grid-template-columns: minmax(0, 1fr); }
  .carte-wrap { height: 58vh; min-height: 340px; }
  .panneau { height: auto; min-height: 0; max-height: none; }
}

/* Légende flottante */
.legende { position: absolute; left: 10px; bottom: 10px; z-index: 900; background: rgba(255,255,255,0.95); border: 1px solid var(--bordure); border-radius: 10px; padding: 9px 11px; font-size: 11.5px; line-height: 1.45; box-shadow: 0 8px 24px rgba(29,58,95,0.12); max-width: 250px; }
.legende .lg-t { font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--or-txt); margin-bottom: 5px; display: flex; justify-content: space-between; gap: 8px; }
.legende .lg-t button { border: 0; background: none; color: var(--muet); cursor: pointer; font-size: 13px; line-height: 1; }
.legende .row { display: flex; align-items: center; gap: 7px; margin: 3px 0; }
.legende .row svg { flex-shrink: 0; }
.legende.ferme .lg-body { display: none; }
.legende .lg-n { color: var(--muet); font-size: 10.5px; margin-top: 4px; }

/* Marqueurs */
.nm { background: none; border: 0; }
.nm svg { display: block; overflow: visible; filter: drop-shadow(0 1px 1.5px rgba(0,0,0,0.25)); cursor: pointer; }
.nm.sel svg { filter: drop-shadow(0 0 5px rgba(184,154,90,0.95)); }
.leaflet-tooltip.nm-tip { font-family: var(--sans); font-size: 12px; border-radius: 8px; border: 1px solid var(--bordure); box-shadow: 0 6px 18px rgba(29,58,95,0.16); padding: 6px 9px; }
.nm-tip b { font-family: var(--serif); font-size: 15px; color: var(--encre); }
.nm-tip span { color: var(--muet); }

/* ---- Panneau latéral ---- */
.pn-head { padding: 14px 16px 10px; border-bottom: 1px solid var(--ligne); }
.pn-kicker { font-size: 10.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--or-txt); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.pn-head h2 { font-family: var(--serif); font-weight: 600; font-size: 1.6rem; line-height: 1.1; color: var(--brand); margin: 3px 0 2px; }
.pn-sub { font-size: 12px; color: var(--muet); }
.pn-note { font-size: 12.5px; line-height: 1.5; color: #3b3a36; margin-top: 7px; }
.pn-actions { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 9px; }
.btn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--brand); background: var(--brand); color: #fff; border-radius: 8px; padding: 6px 11px; font-size: 12px; cursor: pointer; text-decoration: none; }
.btn.clair { background: #fff; color: var(--brand); }
.btn:hover { filter: brightness(1.08); }
.pn-body { flex: 1 1 auto; overflow: auto; padding: 6px 0 10px; }
.pn-tabs { display: flex; gap: 4px; padding: 0 16px 6px; flex-wrap: wrap; font-size: 11.5px; color: var(--muet); }
.pn-tabs b { color: var(--encre); }

.liste { list-style: none; }
.liste li { display: grid; grid-template-columns: 22px minmax(0,1fr) auto; gap: 8px; align-items: center; padding: 6px 16px; border-bottom: 1px solid #f0f2f6; cursor: pointer; }
.liste li:hover, .liste li.act { background: var(--bg2); }
.liste li.hors { opacity: 0.45; }
.ty { width: 20px; height: 20px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 10.5px; font-weight: 700; color: #fff; }
.ty-R { background: var(--brand); } .ty-P { background: #6b4c9a; } .ty-C { background: #5b7fb0; }
.ty-F { background: #a9b8cc; color: var(--brand); } .ty-D { background: #b89a5a; } .ty-E { background: #e6d8b6; color: #6b5220; }
.li-n { font-size: 13px; color: var(--texte); line-height: 1.25; min-width: 0; }
.li-n small { display: block; font-size: 11px; color: var(--muet); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.st { font-size: 10.5px; padding: 2px 7px; border-radius: 999px; color: #fff; white-space: nowrap; }
.st-p { background: var(--st-p); } .st-o { background: var(--st-o); } .st-x { background: var(--st-x); } .st-l { background: var(--st-l); }
.st-t { background: var(--st-t); } .st-h, .st-e { background: var(--st-h); } .st-k { background: var(--st-k); }
.grp-t { font-size: 10.5px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase; color: var(--or-txt); padding: 10px 16px 4px; }

/* Accueil du panneau : classement des lieux */
.top li { grid-template-columns: 26px minmax(0,1fr) auto; }
.top .n { font-weight: 600; color: var(--encre); font-size: 13px; }

/* Fiche d'une personne */
.fiche { border-top: 1px solid var(--ligne); background: #fbfcfe; padding: 12px 16px 14px; font-size: 12.5px; line-height: 1.5; max-height: 52%; overflow: auto; flex-shrink: 0; position: relative; }
.fiche[hidden] { display: none; }
.fiche .x { position: absolute; top: 6px; right: 9px; border: 0; background: none; color: var(--muet); font-size: 18px; cursor: pointer; }
.fiche h3 { font-family: var(--serif); font-weight: 600; font-size: 1.35rem; color: var(--brand); line-height: 1.1; padding-right: 18px; }
.fiche .q { color: var(--or-txt); font-size: 12px; font-weight: 500; margin: 2px 0 6px; }
.fiche .img { float: right; width: 108px; margin: 0 0 8px 10px; border-radius: 8px; border: 1px solid var(--ligne); background: var(--bg2); }
.fiche .load { color: var(--muet); font-style: italic; }
.fiche .etat { clear: both; margin-top: 8px; padding: 7px 9px; border-radius: 8px; background: #fff; border: 1px solid var(--ligne); }
.fiche .autres { margin-top: 7px; }
.fiche .autres button { border: 0; background: none; color: var(--brand); text-decoration: underline; cursor: pointer; font-size: 12.5px; padding: 0; }
.fiche a.wk { display: inline-block; margin-top: 6px; color: var(--brand); font-weight: 500; }

/* ---- Plan (fenêtre) ---- */
.modale { position: fixed; inset: 0; z-index: 2000; background: rgba(15, 25, 40, 0.55); display: flex; align-items: center; justify-content: center; padding: 16px; }
.modale[hidden] { display: none; }
.md-box { background: #fff; border-radius: 14px; width: min(1180px, 100%); max-height: calc(100vh - 32px); display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.3); }
.md-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--ligne); }
.md-head h2 { font-family: var(--serif); font-size: 1.5rem; color: var(--brand); line-height: 1.1; }
.md-head p { font-size: 12px; color: var(--muet); margin-top: 3px; max-width: 760px; }
.md-head .x { border: 0; background: none; font-size: 24px; color: var(--muet); cursor: pointer; line-height: 1; }
.md-body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; min-height: 0; flex: 1 1 auto; }
.md-plan { padding: 12px; overflow: auto; background: #f7f8fb; display: flex; align-items: flex-start; justify-content: center; }
.md-plan svg { width: 100%; height: auto; max-height: 72vh; }
.md-liste { border-left: 1px solid var(--ligne); overflow: auto; }
@media (max-width: 800px) { .md-body { grid-template-columns: minmax(0, 1fr); } .md-liste { border-left: 0; border-top: 1px solid var(--ligne); max-height: 38vh; } }
.pl-mur { fill: #e3e7ef; stroke: #8595ac; stroke-width: 0.5; }
.pl-annexe { fill: #d3dae6; stroke: #8595ac; stroke-width: 0.4; }
.pl-cour { fill: #eef2e6; stroke: #9aa88a; stroke-width: 0.4; stroke-dasharray: 1 1; }
.pl-crypte { fill: #ece6da; stroke: #9a7b3f; stroke-width: 0.5; stroke-dasharray: 1.4 1; }
.pl-zone { fill: rgba(29, 58, 95, 0.06); stroke: rgba(29, 58, 95, 0.45); stroke-width: 0.35; cursor: pointer; }
.pl-zone:hover, .pl-zone.act { fill: rgba(184, 154, 90, 0.25); stroke: #9a7b3f; }
.pl-zl { font-size: 1.75px; fill: #1d3a5f; font-family: var(--sans); font-weight: 600; pointer-events: none; }
.pl-lg { font-size: 2.3px; fill: #7a5d22; font-family: var(--sans); letter-spacing: 0.1em; }
.pl-axe { font-size: 2.4px; fill: #6e6659; font-family: var(--sans); }
.pl-dot { stroke: #fff; stroke-width: 0.3; cursor: pointer; }
.pl-dot.act { stroke: #1a1814; stroke-width: 0.6; }
.pl-tip { position: fixed; z-index: 2100; pointer-events: none; background: #fff; border: 1px solid var(--bordure); border-radius: 8px; padding: 5px 8px; font-size: 12px; box-shadow: 0 6px 18px rgba(29,58,95,0.2); display: none; max-width: 260px; }

/* Textes du bas */
.texte { width: 100%; max-width: 820px; margin: 1.8rem auto 0; padding: 0 16px; font-size: 14px; line-height: 1.7; color: #3b3a36; }
.texte h2 { font-family: var(--serif); font-size: 1.45rem; color: var(--brand); margin: 1.2rem 0 0.4rem; }
.texte p { margin: 0 0 0.7rem; }
.texte ul { margin: 0 0 0.7rem 1.2rem; }
.sources-licences { max-width: 820px; margin: 1.2rem auto 1.5rem; padding: 0.85rem 1.1rem; border: 1px solid var(--bordure); border-radius: 6px; background: rgba(184,154,90,0.05); color: #6e6659; font-size: 12.5px; line-height: 1.6; }
.sources-licences h2 { font-size: .66rem; letter-spacing: .22em; text-transform: uppercase; color: #7a5d22; margin: 0 0 .45rem; font-weight: 600; }
.sources-licences a { color: #7a5d22; }

/* Plein écran : carte + panneau côte à côte, sur tout l'écran */
.fs-btn { position: absolute; top: 10px; left: 10px; z-index: 900; width: 34px; height: 34px; border-radius: 8px; border: 1px solid var(--bordure); background: #fff; color: var(--brand); font-size: 17px; cursor: pointer; box-shadow: 0 4px 12px rgba(29,58,95,0.15); }
.fs-btn:hover { background: var(--bg2); }
.scene.fs { position: fixed; inset: 0; z-index: 1500; max-width: none; margin: 0; padding: 10px; background: var(--bg); grid-template-columns: minmax(0, 1fr) 390px; }
.scene.fs .carte-wrap, .scene.fs .panneau { height: calc(100vh - 20px); max-height: none; }
@media (max-width: 900px) {
  .scene.fs { grid-template-rows: 62vh auto; overflow: auto; }
  .scene.fs .carte-wrap { height: 62vh; }
  .scene.fs .panneau { height: auto; min-height: 30vh; }
}
body.fs-ouvert { overflow: hidden; }