.tete-page h1 { max-width: 15ch; }
.tete-grille { display: grid; gap: 8px 40px; grid-template-columns: minmax(0, 1fr); align-items: end; }
@media (min-width: 900px) { .tete-grille { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); } }
.tete-page .phrase { margin: 0 0 14px; font: 400 clamp(22px, 2.4vw, 28px)/1.22 var(--serif); max-width: 30ch; }
.tete-page .phrase b { font-weight: 400; color: var(--hyd); white-space: nowrap; }
.vue { padding: 14px 14px 16px; }
.scene { aspect-ratio: 16 / 9.4; margin: 0; --sc-terre: #dde3d3; }
:root[data-theme="dark"] .scene { --sc-terre: #233042; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .scene { --sc-terre: #233042; } }
@media (max-width: 599px) { .scene { aspect-ratio: 1 / 1.1; } .vue { padding: 10px 10px 14px; border-radius: 24px; } }
.scene::before { left: 30%; right: 30%; top: 22%; bottom: 18%; border-radius: 42% 48% 40% 52%; transform: none; background: color-mix(in srgb, #dde3d3 70%, transparent); }
.scene::after { display: none; }
.scene.sans3d { aspect-ratio: 1 / .95; }
.vue-pied { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; padding: 12px 6px 0; }
.legende { display: flex; flex-wrap: wrap; gap: 6px 16px; list-style: none; margin: 0; padding: 0; font-size: 13.5px; color: var(--pale); }
.legende li { display: inline-flex; align-items: center; gap: 7px; padding: 0; background: none; border-radius: 0; font-size: 13.5px; }
.lg-halo { width: 14px; height: 14px; border-radius: 50%; background: radial-gradient(circle, var(--k) 0 30%, color-mix(in srgb, var(--k) 30%, transparent) 60%, transparent 72%); }
.vue-pied .src { margin: 0; font-size: 12.5px; color: var(--pale); }
.s3-total { display: block; position: absolute; left: 12px; top: 12px; z-index: 3; background: color-mix(in srgb, var(--carte) 90%, transparent); backdrop-filter: blur(8px);
  border: 1px solid var(--trait); border-radius: 20px; padding: 12px 16px; box-shadow: var(--ombre); max-width: 260px; }
.s3-total p { margin: 0; }
.s3-total .t-mw { font: 400 34px/1 var(--serif); margin-top: 2px; }
.s3-total .t-mw small { font: 600 13px var(--sans); color: var(--pale); margin-left: 4px; }
.s3-total .t-sous { font-size: 13px; font-weight: 600; margin-top: 3px; }
.s3-total .t-pompe { color: var(--pompe); }
.s3-total .t-src { font-size: 11.5px; color: var(--pale); margin-top: 4px; }
.scene.nuit .s3-credit, .scene.nuit .s3-soleil { background: rgba(10, 18, 30, .6); color: #c9d4e2; }
.s3-fiche { width: 330px; padding: 14px 16px; }
.s3-ft { font: 400 26px/1.05 var(--serif); padding-right: 30px; }
.s3-fr { font-size: 12.5px; color: var(--pale); margin-top: 4px !important; }
.s3-fv { font: 400 38px/1 var(--serif); margin-top: 8px !important; }
.s3-fv small { font: 600 13px var(--sans); color: var(--pale); margin-left: 4px; }
.s3-fe { margin-top: 6px !important; color: var(--texte); font-style: normal; }
.s3-fe.nd { font-size: 13px; }
.s3-fiche svg { height: 46px; }
.s3-rx { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: 5px; list-style: none; margin: 10px 0 0; padding: 0; }
.s3-rx li { display: grid; padding: 5px 8px; border-radius: 10px; background: var(--fond); font-size: 12px; line-height: 1.25; }
.s3-rx li span { color: var(--pale); font-variant-numeric: tabular-nums; }
.scene.focus .s3-total { display: none; }
.r-terre { fill: var(--sc-terre); stroke: color-mix(in srgb, var(--pale) 40%, transparent); stroke-width: 1; }
.r-fleuve { fill: none; stroke: color-mix(in srgb, var(--hyd) 55%, transparent); stroke-width: 1.6; }
@media (max-width: 599px) {
  .s3-total { padding: 8px 11px; border-radius: 16px; max-width: 200px; } .s3-total .t-mw { font-size: 26px; } .s3-total .t-sous { font-size: 12px; } .s3-total .t-src { display: none; }
  .s3-fiche { left: 8px; right: 8px; width: auto; bottom: 8px; padding: 12px 14px; }
  .scene:not(.grand) .s3-rx, .scene:not(.grand) .s3-fiche svg { display: none; }
}
.kpi { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
@media (min-width: 900px) { .kpi { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.kpi > div { padding: 18px 20px 16px; border-radius: 24px; }
.kpi dt { font-size: 13.5px; color: var(--pale); font-weight: 600; }
.kpi dd { margin: 4px 0 0; font: 400 44px/1 var(--serif); letter-spacing: -.02em; }
.kpi dd small { font: 600 14px var(--sans); color: var(--pale); letter-spacing: 0; margin-left: 5px; }
.kpi .sous { display: block; margin-top: 8px; font: 500 13.5px/1.4 var(--sans); color: var(--pale); letter-spacing: 0; }
.horloge .graphe { margin-top: 14px; position: relative; touch-action: pan-y; }
.horloge svg { display: block; width: 100%; height: auto; overflow: visible; }
.phrase-geo { margin: 14px 0 0; padding: 14px 16px; border-radius: 16px; background: var(--fond); font-size: 15.5px; line-height: 1.5; }
.tab-c tbody tr { cursor: pointer; }
/* liste des fiches détaillées (liens visibles, le tableau étant construit en JavaScript) */
.fiches-c { margin-top: 16px; padding: 18px 22px; }
.fiches-l { margin: 10px 0 0; line-height: 1.7; }
.fiches-l a { color: var(--lien); }