:root{font-family:Georgia,serif;color:#4b3a2a;background:#eadbc0}*{box-sizing:border-box}body{margin:0}#map{position:fixed;inset:0}nav{position:fixed;z-index:2;top:max(16px,env(safe-area-inset-top));left:16px;display:flex;gap:4px;align-items:center}button{font:13px system-ui;color:#493b2a;border:0;background:#fff8e9b8;padding:9px 12px;cursor:pointer;border-radius:20px;backdrop-filter:blur(6px)}button:hover{background:#fff8e9}button:focus-visible{outline:3px solid #357c88;outline-offset:2px}.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}.gps-marker{width:20px;height:20px;background:#357c88;border:4px solid #fff8e9;border-radius:50%;box-shadow:0 0 0 8px #357c8833,0 2px 8px #0005}.maplibregl-ctrl-group{box-shadow:none!important;border:0!important;background:#fff8e9b8!important;border-radius:18px!important}.maplibregl-ctrl-group button{background:transparent!important;border:0!important}.maplibregl-ctrl-top-right{top:6px;right:6px}.maplibregl-ctrl-attrib{font:9px system-ui!important;background:#fff8e99c!important}.maplibregl-ctrl-scale{border:0!important;background:transparent!important;text-shadow:0 1px 2px #fff}.monument{display:block;object-fit:contain;filter:drop-shadow(0 1px 1px #53391c25);pointer-events:none}[hidden]{display:none!important}@media(max-width:480px){nav{left:8px;gap:3px}button{padding:8px 9px;font-size:11px}.maplibregl-ctrl-top-right{top:56px;right:0}}
.wallace{object-fit:contain;pointer-events:none;filter:drop-shadow(0 1px 1px #fff8e999)}

/* Fenêtre sur la partie haute : dôme, cariatides et leur petite assise. */
.wallace{display:block;position:absolute;overflow:hidden;pointer-events:none;filter:drop-shadow(0 1px 1px #fff8e999)}
.wallace img{position:absolute;top:0;left:-50%;width:200%;height:auto;max-width:none;pointer-events:none}
.remarkable-tree{display:block;position:absolute;object-fit:contain;pointer-events:none;filter:drop-shadow(0 1px 1px #fff8e966)}

/* Fondu léger au pied des illustrations, sans modifier leur ancrage. */
.monument,.wallace,.remarkable-tree{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 87%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 87%,transparent 100%);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}

/* Clic et clavier sans toucher aux transformations de positionnement de MapLibre. */
.monument.inspectable,.wallace.inspectable,.remarkable-tree.inspectable{pointer-events:auto;cursor:pointer}
.inspectable:focus-visible{outline:2px solid #385e61;outline-offset:4px}
#detail-view{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:24px;border:0;background:transparent;color:#493b2a;overflow:auto;overscroll-behavior:contain}
#detail-view::backdrop{background:rgba(250,246,231,.55)}
.detail-body{min-height:100%;width:min(100%,760px);margin:auto;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:18px;pointer-events:none;padding:40px 0 24px}
.detail-art{display:flex;justify-content:center;align-items:center;width:100%;height:min(58dvh,560px);pointer-events:auto}
.detail-art>img{width:100%;height:100%;object-fit:contain;-webkit-mask-image:linear-gradient(#000 88%,transparent);mask-image:linear-gradient(#000 88%,transparent)}
.detail-wallace{position:relative;display:block;height:100%;aspect-ratio:.515;overflow:hidden;-webkit-mask-image:linear-gradient(#000 87%,transparent);mask-image:linear-gradient(#000 87%,transparent)}
.detail-wallace img{position:absolute;top:0;left:-50%;width:200%;height:auto}
.detail-copy{width:min(100%,590px);text-align:center;pointer-events:auto;text-shadow:0 1px 7px #fff,0 0 18px #fff}
.detail-copy h2{font:normal clamp(24px,4vw,34px)/1.15 Georgia,serif;margin:0 0 12px}
.detail-copy p{font:15px/1.6 system-ui;margin:6px 0}
#detail-address{font-size:12px;color:#66563f}
.detail-close{position:fixed;top:max(15px,env(safe-area-inset-top));right:18px;z-index:1;font-size:30px;line-height:1;padding:7px 13px;background:#fff8e9d9}
@media(max-height:500px){.detail-body{flex-direction:row;gap:25px}.detail-art{height:72dvh;width:50%}.detail-copy{width:50%;text-align:left}.detail-copy p{font-size:12px}}
.detail-art>img{width:auto;max-width:100%;height:100%}
#detail-view[open]::backdrop{animation:detail-backdrop-in 650ms ease-out}
@keyframes detail-backdrop-in{from{background:rgba(250,246,231,0)}to{background:rgba(250,246,231,.55)}}
@media(prefers-reduced-motion:reduce){#detail-view[open]::backdrop{animation:none}}
.detail-art>img.official-photo{-webkit-mask-image:none;mask-image:none;object-fit:contain}
#detail-credit{font:11px/1.5 system-ui;color:#66563f}
#detail-credit a{color:inherit;text-underline-offset:3px}

/* Pigments plus soutenus ; les photos officielles gardent leurs couleurs. */
.monument,.wallace,.remarkable-tree{filter:contrast(1.22) saturate(1.18) brightness(.96)}
.detail-art>img:not(.official-photo),.detail-wallace{filter:contrast(1.22) saturate(1.18) brightness(.96)}

/* La péniche suit le fleuve ; seul son dessin intérieur change de sens. */
.seine-boat,.seine-boat:hover{position:absolute;display:block;padding:0;border:0;border-radius:0;background:transparent;backdrop-filter:none;line-height:0;cursor:pointer;overflow:visible;z-index:3;box-shadow:none}
.peniche-art{position:relative;display:block;width:100%;aspect-ratio:1.5;pointer-events:none}
.peniche-art img{display:block;width:100%;height:100%;object-fit:contain;transform:scaleX(var(--boat-facing,1)) translateY(4%);pointer-events:none}
.peniche-wake{position:absolute;right:-18%;bottom:0;width:40%;height:5px;border-bottom:1.5px solid #fff8; border-radius:50%;pointer-events:none}
.seine-boat.face-right .peniche-wake{right:auto;left:-18%}
.seine-boat:focus-visible{outline:2px solid #385e61;outline-offset:5px}
.peniche-art img{position:absolute;inset:0;object-position:center bottom}
.peniche-art img{transition:opacity 350ms ease-in-out}
@media(prefers-reduced-motion:reduce){.peniche-art img{transition:none}}

/* Essai Palais de Tokyo : contact au sol mesuré, verticales intactes et aquarelle simplifiée. */
.monument-ground{position:absolute;display:block;pointer-events:auto;cursor:pointer;overflow:visible}
.monument-ground-art{position:absolute;inset:0;display:block;transform-origin:50% 100%;pointer-events:none}
.monument-ground-art img{display:block;width:100%;height:100%;object-fit:fill;filter:contrast(1.05) saturate(1.02);-webkit-mask-image:linear-gradient(#000 93%,transparent 100%);mask-image:linear-gradient(#000 93%,transparent 100%);pointer-events:none}
.monument-ground-shadow{position:absolute;left:4%;bottom:-3px;width:92%;height:9px;background:radial-gradient(ellipse,rgba(77,58,37,.19),rgba(77,58,37,.06) 48%,transparent 72%);transform-origin:50% 50%;pointer-events:none}
/* Nouveau prototype : volumes vectoriels en projection parallèle, sans étirement de façade. */
.monument-ground-volume{overflow:visible;line-height:0;filter:none}
.monument-ground-volume svg{display:block;overflow:visible;pointer-events:none}
/* Illustration seule : l'image est posée dans son cadre géographique sans déformation. */
.monument-ground-illustration{line-height:0;filter:none}
.monument-basemap-underlay{position:absolute;display:block;pointer-events:none}
.monument-courtyard-underlay{position:absolute;display:block;background:#d5e6c4;pointer-events:none}
.monument-ground-illustration>img{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none;filter:contrast(1.03) saturate(1.04)}

/* Dessin du viaduc sous les repères, sans bloquer les gestes sur la carte. */
.metro-aerial-drawing{position:absolute;inset:0;pointer-events:none;z-index:0}
.maplibregl-marker{z-index:1}
/* Stations : le dessin est raccordé par ses deux portails de voies. */
.metro-station-drawing{position:absolute;display:block;cursor:pointer;overflow:visible}
.metro-station-drawing>img{position:absolute;left:0;top:0;width:1000px;height:1000px;max-width:none;transform-origin:0 0;pointer-events:none;user-select:none}

.metro-station-hit{width:36px;height:36px;padding:0;border:0;background:transparent!important;backdrop-filter:none;border-radius:50%;box-shadow:none}
.metro-station-hit:hover{background:transparent!important}
.metro-station-hit:focus-visible{outline:2px solid #357c88}

/* Panneau de l’essai de montée des eaux, dans le papier de l’atlas. */
#water-toggle[aria-pressed="true"]{background:#357c88;color:#fff8e9}
.water-panel{position:fixed;z-index:2;left:16px;bottom:max(38px,env(safe-area-inset-bottom));width:min(310px,calc(100vw - 32px));padding:18px 20px;border:1px solid #aa92684d;border-radius:16px;background:#fff8e9ed;box-shadow:0 4px 22px #493b2a18;backdrop-filter:blur(8px)}
.water-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.water-heading h2{font:normal 20px Georgia,serif;margin:0}.water-heading output{font:600 17px system-ui;color:#287595;font-variant-numeric:tabular-nums;white-space:nowrap}
.water-panel label,.water-scale,.water-panel p{font:12px/1.5 system-ui}.water-panel input{display:block;width:100%;margin:14px 0 4px;accent-color:#357c88;cursor:pointer}.water-panel input:focus-visible{outline:3px solid #357c88;outline-offset:4px}.water-scale{display:flex;justify-content:space-between;color:#756650}.water-panel p{margin:12px 0 0}#water-note{font-size:11px;color:#756650}#water-status{color:#287595}
#water-play{margin-top:14px;padding:8px 12px;border:1px solid #8daba9;border-radius:9px;background:#e4f1ec;color:#246a75;font:600 12px system-ui;cursor:pointer}#water-play:hover{background:#d0e8e4}#water-play:focus-visible{outline:3px solid #357c88;outline-offset:3px}
@media(max-width:480px){nav{max-width:calc(100vw - 16px);flex-wrap:wrap}.water-panel{left:12px;width:min(310px,calc(100vw - 24px))}}

/* Independent of zoom/detail visibility: fully submerged objects are hidden. */
.water-submerged{display:none!important;pointer-events:none!important}

.water-immersed{clip-path:none;-webkit-mask-image:var(--water-edge);mask-image:var(--water-edge);-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}

/* Wallace entières, pastel : socle conservé, aucun recadrage ni filtre contrastant. */
.wallace{overflow:visible;filter:none;-webkit-mask-image:none;mask-image:none}
.wallace img{position:static;display:block;left:auto;top:auto;width:100%;height:100%;object-fit:contain;max-width:100%}
.detail-art>img.wallace-pastel{filter:none;-webkit-mask-image:none;mask-image:none}
