/* OG Serveur V2 — l'accueil visuel, les fiches de projet, les graphiques, les domaines et les chaînes.
   Mêmes jetons que le reste (tokens.css) : jamais de couleur écrite en dur, sauf les teintes des familles qui
   arrivent par --c depuis le catalogue. Sur téléphone (≤ 860 px), on resserre et on replie. */

/* ───── Les visuels ───── */
.sv-visuel { display: inline-grid; place-items: center; flex: none; filter: drop-shadow(0 10px 18px rgb(var(--shade) / calc(0.35 * var(--shade-k)))); }
.sv-visuel img, .sv-visuel__svg { width: 100%; height: 100%; display: block; }
.sv-visuel__roue { animation: sv-tourne 14s linear infinite; }
.sv-visuel__roue--inverse { animation-direction: reverse; animation-duration: 9s; }
@keyframes sv-tourne { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .sv-visuel__roue { animation: none; } }

.sv-logo { display: block; flex: none; border-radius: 24%; object-fit: cover; box-shadow: 0 0 0 0.5px var(--glass-line), 0 6px 14px -6px rgb(var(--shade) / calc(0.5 * var(--shade-k))); }
.sv-logo--initiales { display: grid; place-items: center; font-weight: 700; letter-spacing: -0.02em; color: var(--text); background: linear-gradient(150deg, color-mix(in srgb, var(--c) 70%, var(--surface)), color-mix(in srgb, var(--c) 30%, var(--surface-2))); }
.sv-lien-bouton { padding: 0; border: 0; background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.sv-lien-bouton:hover { color: var(--gold-bright); text-decoration: underline; }
.sv-puce { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--r-pill); background: var(--glass-control); box-shadow: var(--glass-inset); font-size: var(--fs-xs); color: var(--text-2); white-space: nowrap; }
.sv-a-remplir { color: var(--muted); font-style: italic; font-weight: 500; }

/* ───── L'accueil : le serveur en grand ───── */
.sv-hero { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--s-5); padding: var(--s-6); margin-bottom: var(--s-5); overflow: hidden; }
.sv-hero::after { content: ''; position: absolute; inset: -40% -10% auto auto; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(circle, rgba(var(--gold-rgb), 0.16), transparent 65%); pointer-events: none; }
.sv-hero__nom { font: 700 clamp(2.2rem, 5vw, 3.6rem)/1 var(--font-display); letter-spacing: -0.045em; margin: 2px 0 var(--s-3); }
.sv-hero__desc { color: var(--text-2); max-width: 64ch; font-size: var(--fs-md); line-height: 1.5; }
.sv-hero__puces { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--s-4); }
.sv-hero__etat { display: flex; flex-direction: column; align-items: flex-end; gap: var(--s-2); text-align: right; position: relative; z-index: 1; }
.sv-verdict-pill { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px; border-radius: var(--r-pill); font-weight: 650; font-size: var(--fs-md); color: var(--ton); background: color-mix(in srgb, var(--ton) 14%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ton) 35%, transparent); white-space: nowrap; }
.sv-verdict-pill--ok { --ton: var(--ok); }
.sv-verdict-pill--warn { --ton: var(--warn); }
.sv-verdict-pill--danger { --ton: var(--danger); }
.sv-verdict-pill__point { width: 9px; height: 9px; border-radius: 50%; background: var(--ton); box-shadow: 0 0 0 4px color-mix(in srgb, var(--ton) 25%, transparent); animation: sv-pouls 2.4s ease-in-out infinite; }
@keyframes sv-pouls { 50% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--ton) 6%, transparent); } }

/* Les quatre organes */
.sv-organes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-4); margin-bottom: var(--s-6); }
.sv-organe { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; gap: var(--s-2) var(--s-4); padding: var(--s-5); text-align: left; color: var(--text); font: inherit; cursor: pointer; border: 0; transition: transform var(--t-med) var(--ease-spring), box-shadow var(--t-med); }
.sv-organe:hover { transform: translateY(-3px); box-shadow: var(--glass-inset), var(--glass-shadow-lift); }
.sv-organe:hover .sv-visuel { transform: scale(1.06) rotate(-3deg); }
.sv-organe .sv-visuel { transition: transform var(--t-slow) var(--ease-spring); }
.sv-organe__corps { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sv-organe__titre { display: flex; align-items: center; gap: 4px; font-size: var(--fs-sm); font-weight: 600; color: var(--text-2); }
.sv-organe__titre svg { color: var(--muted); }
.sv-organe__grand { font: 700 var(--fs-xl)/1.05 var(--font-display); letter-spacing: -0.03em; }
.sv-organe__grand small { font-size: var(--fs-sm); font-weight: 500; color: var(--muted); letter-spacing: 0; }
.sv-organe__jauge { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; font-size: var(--fs-xs); font-weight: 600; }
.sv-organe__petit { font-size: var(--fs-xs); color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sv-organe__courbe { grid-column: 1 / -1; display: block; height: 30px; opacity: 0.85; }
.sv-organe__courbe .sv-courbe { width: 100%; height: 30px; }

/* Les projets qui ont bougé */
.sv-bouges { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-4); }
.sv-bouge { display: flex; flex-direction: column; padding: 0; overflow: hidden; text-align: left; color: var(--text); font: inherit; border: 0; cursor: pointer; transition: transform var(--t-med) var(--ease-spring), box-shadow var(--t-med); }
.sv-bouge:hover { transform: translateY(-3px); box-shadow: var(--glass-inset), var(--glass-shadow-lift); }
.sv-bouge__capture { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: linear-gradient(160deg, color-mix(in srgb, var(--c) 22%, var(--surface-2)), var(--surface)); }
.sv-bouge__capture .sv-capture { border-radius: 0; box-shadow: none; height: 100%; }
.sv-bouge__sans { display: grid; place-items: center; height: 100%; }
.sv-bouge__corps { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-4); }
.sv-bouge__tete { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sv-bouge__tete > span { display: flex; flex-direction: column; min-width: 0; }
.sv-bouge__tete strong { font-size: var(--fs-md); }
.sv-bouge__tete small { font-size: var(--fs-xs); color: var(--muted); }
.sv-bouge__badges { display: flex; flex-wrap: wrap; gap: 6px; }

/* Les captures dans leur cadre */
.sv-capture { position: relative; display: flex; flex-direction: column; border-radius: var(--r-md); overflow: hidden; background: var(--surface-2); box-shadow: 0 0 0 0.5px var(--glass-line), 0 18px 40px -20px rgb(var(--shade) / calc(0.6 * var(--shade-k))); }
.sv-capture__barre { display: flex; align-items: center; gap: 5px; padding: 7px 10px; background: var(--surface-3); font-size: 10.5px; color: var(--muted); }
.sv-capture__barre i { width: 8px; height: 8px; border-radius: 50%; background: rgba(var(--overlay), 0.2); }
.sv-capture__barre span { margin-left: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sv-capture img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; }

/* Domaines + « à jour » côte à côte */
.sv-duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--s-4); margin: var(--s-6) 0; }
.sv-domstrip { display: flex; align-items: center; gap: var(--s-4); padding: var(--s-5); color: var(--text); transition: transform var(--t-med) var(--ease-spring); }
.sv-domstrip:hover { transform: translateY(-2px); }
.sv-domstrip__fleche { display: grid; color: var(--muted); flex: none; }
.sv-domstrip__texte { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.sv-domstrip__texte strong { font-size: var(--fs-lg); }
.sv-domstrip__texte small { color: var(--muted); font-size: var(--fs-xs); }
.sv-domstrip__chiffres { display: flex; gap: var(--s-4); }
.sv-domstrip__chiffre { display: flex; flex-direction: column; align-items: center; text-align: center; }
.sv-domstrip__chiffre strong { font: 700 var(--fs-xl)/1 var(--font-display); }
.sv-domstrip__chiffre span { font-size: 10.5px; color: var(--muted); white-space: nowrap; }

.sv-ajour { padding: var(--s-5); }
.sv-ajour__tete { display: flex; align-items: center; gap: var(--s-3); margin-bottom: var(--s-4); }
.sv-ajour__tete h2 { font: 650 var(--fs-lg)/1.15 var(--font); letter-spacing: -0.02em; }
.sv-ajour__tete p { font-size: var(--fs-xs); color: var(--muted); margin-top: 2px; }
.sv-ajour__sceau { width: 44px; height: 44px; flex: none; border-radius: 50%; display: grid; place-items: center; color: var(--warn); background: var(--warn-soft); }
.sv-ajour--vert .sv-ajour__sceau { color: var(--ok); background: var(--ok-soft); box-shadow: 0 0 0 6px color-mix(in srgb, var(--ok) 8%, transparent); }
.sv-ajour__liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px var(--s-4); }
.sv-ajour__ligne { display: flex; align-items: flex-start; gap: 10px; }
.sv-ajour__ligne > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.sv-ajour__ligne strong { font-size: var(--fs-sm); font-weight: 600; }
.sv-ajour__ligne small { font-size: var(--fs-xs); color: var(--muted); }

/* Le bas de page qui se replie */
.sv-bas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-4); align-items: start; }
.sv-pli { padding: 0; }
.sv-pli > summary { display: flex; align-items: center; gap: 10px; padding: var(--s-4) var(--s-5); cursor: pointer; list-style: none; font-weight: 650; }
.sv-pli > summary::-webkit-details-marker { display: none; }
.sv-pli > summary > svg:last-child { margin-left: 6px; color: var(--muted); transition: transform var(--t-med) var(--ease-out); }
.sv-pli > summary .sv-compte { margin-left: auto; }
.sv-pli[open] > summary > svg:last-child { transform: rotate(90deg); }
.sv-pli__corps { padding: 0 var(--s-5) var(--s-5); }
.sv-pli--aide { margin-top: var(--s-5); }
.sv-aide p { color: var(--text-2); line-height: 1.55; margin-bottom: var(--s-3); max-width: 80ch; }
.sv-etapes { list-style: none; margin: 0; padding: 0; counter-reset: etape; display: flex; flex-direction: column; gap: 10px; }
.sv-etapes li { counter-increment: etape; display: flex; gap: 12px; align-items: flex-start; }
.sv-etapes li::before { content: counter(etape); width: 24px; height: 24px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: var(--fs-xs); font-weight: 700; color: var(--gold-bright); background: var(--gold-soft); }
.sv-etapes--danger::before { color: var(--danger) !important; background: var(--danger-soft) !important; }
.sv-etapes--warn::before { color: var(--warn) !important; background: var(--warn-soft) !important; }
.sv-etapes a { display: flex; flex-direction: column; gap: 2px; color: var(--text); }
.sv-etapes a:hover strong { color: var(--gold-bright); }
.sv-etapes strong { font-size: var(--fs-sm); font-weight: 600; }
.sv-etapes small { font-size: var(--fs-xs); color: var(--muted); }

/* ───── Les fenêtres de détail ───── */
.sv-detail { display: flex; flex-direction: column; gap: var(--s-4); }
.sv-detail h4 { font-size: var(--fs-sm); font-weight: 650; margin-top: var(--s-2); }
.sv-detail__tete { display: flex; align-items: center; gap: var(--s-5); }
.sv-detail__quoi { font-size: var(--fs-md); line-height: 1.5; }
.sv-detail__pourquoi { color: var(--text-2); font-size: var(--fs-sm); line-height: 1.5; margin-top: var(--s-2); }
.sv-detail__chiffres { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-3); }
.sv-detail__chiffres > div { display: flex; flex-direction: column; gap: 2px; padding: var(--s-3) var(--s-4); border-radius: var(--r-md); background: var(--glass-control); box-shadow: var(--glass-inset); }
.sv-detail__chiffres strong { font: 700 var(--fs-lg)/1.1 var(--font-display); }
.sv-detail__chiffres span { font-size: var(--fs-xs); color: var(--muted); }
.sv-detail__barre .sv-barre { height: 10px; }
.sv-detail__courbe .sv-courbe { width: 100%; height: 60px; }
.sv-detail .btn { align-self: flex-start; }

/* ───── La fiche d'un projet ───── */
.sv-fiche__hero { display: flex; flex-direction: column; gap: var(--s-4); }
.sv-fiche__identite { display: flex; align-items: flex-start; gap: var(--s-4); }
.sv-fiche__identite > div { flex: 1; min-width: 0; }
.sv-fiche__nom { font: 700 var(--fs-xl)/1.1 var(--font-display); letter-spacing: -0.03em; }
.sv-fiche__desc { color: var(--text-2); margin: 4px 0 var(--s-3); line-height: 1.45; }
.sv-fiche__badges { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.sv-fiche__ouvrir { flex: none; }
.sv-fiche__hero .sv-capture { max-height: 340px; }
.sv-fiche__statut { display: flex; align-items: flex-start; gap: 10px; margin-top: var(--s-4); padding: var(--s-3) var(--s-4); border-radius: var(--r-md); background: var(--gold-soft); box-shadow: inset 0 0 0 1px var(--gold-line); color: var(--text); font-weight: 600; }
.sv-fiche__statut svg { color: var(--gold-bright); margin-top: 2px; flex: none; }
.sv-fiche__statut small { display: block; font-size: var(--fs-xs); font-weight: 500; color: var(--muted); }
.sv-bref { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-3); margin: var(--s-4) 0; }
.sv-bref__case { display: flex; flex-direction: column; gap: 3px; padding: var(--s-3) var(--s-4); border-radius: var(--r-md); background: var(--glass-control); box-shadow: var(--glass-inset); min-width: 0; }
.sv-bref__case.sv-ton--ok, .sv-bref__case.sv-ton--danger { background: color-mix(in srgb, var(--ton) 12%, transparent); }
.sv-bref__case.sv-ton--ok strong, .sv-bref__case.sv-ton--danger strong { color: var(--ton); }
.sv-bref__label { font-size: 10.5px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); }
.sv-bref__case strong { font-size: var(--fs-md); }
.sv-bref__case small { font-size: var(--fs-xs); color: var(--muted); }
.sv-fiche__recit { display: flex; flex-direction: column; gap: var(--s-4); }
.sv-fiche__bloc h3 { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); font-weight: 650; margin-bottom: 6px; color: var(--text-2); }
.sv-fiche__bloc p { line-height: 1.55; white-space: pre-line; }
.sv-fiche__modifier { align-self: flex-start; }
.sv-fiche__form-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-3); }
.sv-fiche__technique { margin-top: var(--s-5); border-top: 1px solid var(--line); padding-top: var(--s-4); }
.sv-fiche__technique > summary { display: flex; align-items: center; gap: 8px; cursor: pointer; font-weight: 650; list-style: none; }
.sv-fiche__technique > summary::-webkit-details-marker { display: none; }
.sv-fiche__technique > summary .sv-muted { margin-left: auto; font-weight: 500; font-size: var(--fs-xs); }
.sv-fiche__technique[open] > summary { margin-bottom: var(--s-3); }
.sv-mel { list-style: none; margin: var(--s-3) 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.sv-mel li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; font-size: var(--fs-sm); }
.sv-mel__seule { margin-top: var(--s-2); font-size: var(--fs-sm); }
.sv-modele { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: var(--r-pill); font-size: var(--fs-xs); font-weight: 600; color: var(--text-2); background: var(--glass-control); }
.sv-modele--revenus { color: var(--ok); background: var(--ok-soft); }
.sv-modele--a-venir { color: var(--warn); background: var(--warn-soft); }

/* ───── Projets : les cartes ───── */
.sv-pcartes { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: var(--s-4); }
.sv-pcarte { display: flex; flex-direction: column; padding: 0; overflow: hidden; color: var(--text); transition: transform var(--t-med) var(--ease-spring), box-shadow var(--t-med); }
.sv-pcarte:hover { transform: translateY(-3px); box-shadow: var(--glass-inset), var(--glass-shadow-lift); }
.sv-pcarte__capture { aspect-ratio: 16 / 9; overflow: hidden; background: linear-gradient(160deg, color-mix(in srgb, var(--c) 25%, var(--surface-2)), var(--surface)); border-bottom: 1px solid var(--line); }
.sv-pcarte__capture .sv-capture { border-radius: 0; box-shadow: none; height: 100%; }
.sv-pcarte__sans { display: grid; place-items: center; height: 100%; }
.sv-pcarte__corps { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-4) var(--s-5) var(--s-5); flex: 1; }
.sv-pcarte__tete { display: flex; align-items: center; gap: var(--s-3); margin-top: -34px; }
.sv-pcarte__tete .sv-logo { box-shadow: 0 0 0 3px var(--surface), 0 10px 20px -8px rgb(var(--shade) / calc(0.6 * var(--shade-k))); }
.sv-pcarte__nom { flex: 1; min-width: 0; padding-top: 30px; }
.sv-pcarte__nom h3 { font-size: var(--fs-lg); font-weight: 650; letter-spacing: -0.02em; }
.sv-pcarte__nom p { font-size: var(--fs-xs); color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sv-pcarte__tete .sv-etat { margin-top: 30px; }
.sv-pcarte__desc { font-size: var(--fs-sm); color: var(--text-2); line-height: 1.45; }
.sv-pcarte__statut { display: flex; gap: 6px; align-items: flex-start; font-size: var(--fs-sm); font-weight: 600; color: var(--gold-bright); }
.sv-pcarte__statut svg { margin-top: 2px; flex: none; }
.sv-pcarte__pied { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: auto; }
.sv-pcarte__meta { margin-left: auto; font-size: var(--fs-xs); color: var(--muted); }
.sv-tabs-defil { overflow-x: auto; scrollbar-width: none; max-width: 100%; }
.sv-tabs-defil::-webkit-scrollbar { display: none; }

/* ───── Espace ───── */
.sv-espace__carte { display: flex; flex-direction: column; gap: var(--s-4); }
.sv-espace__tete { display: flex; align-items: center; gap: var(--s-4); flex-wrap: wrap; margin-bottom: var(--s-3); }
.sv-espace__tete > div:nth-child(2) { flex: 1; min-width: 180px; }
.sv-espace__tete .sv-bloc__titre { margin: 0 0 2px; }
.sv-espace__outils { display: flex; gap: var(--s-2); flex-wrap: wrap; }
.sv-segment { display: inline-flex; padding: 3px; border-radius: var(--r-pill); background: var(--glass-control); box-shadow: var(--glass-inset); }
.sv-segment__btn { padding: 6px 14px; border: 0; border-radius: var(--r-pill); background: transparent; color: var(--text-2); font: 600 var(--fs-xs)/1 var(--font-body); cursor: pointer; transition: background var(--t-med), color var(--t-fast); }
.sv-segment__btn[aria-pressed='true'] { background: linear-gradient(180deg, var(--gold-fill-from), var(--gold-fill-to)); color: var(--on-gold); box-shadow: 0 2px 8px rgb(var(--shade) / calc(0.3 * var(--shade-k))); }
.sv-espace__camembert { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--s-6); }
.sv-camembert { position: relative; flex: none; }
.sv-camembert__svg { display: block; width: 100%; height: 100%; overflow: visible; }
.sv-camembert__fond { stroke: rgba(var(--overlay), 0.06); }
.sv-camembert__part { cursor: pointer; transition: stroke-width var(--t-med) var(--ease-out), opacity var(--t-med); animation: sv-part 700ms var(--ease-out) both; }
.sv-camembert__part:hover, .sv-camembert__part:focus-visible { stroke-width: 42; outline: none; }
@keyframes sv-part { from { opacity: 0; } }
.sv-camembert__centre { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; pointer-events: none; }
.sv-camembert__centre strong { font: 700 var(--fs-xl)/1 var(--font-display); }
.sv-camembert__centre span { font-size: var(--fs-xs); color: var(--muted); }
.sv-legende { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px var(--s-4); }
.sv-legende__ligne { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; padding: 7px 8px; border: 0; border-radius: var(--r-sm); background: transparent; color: var(--text); font: 500 var(--fs-sm)/1.2 var(--font-body); text-align: left; cursor: pointer; }
.sv-legende__ligne:hover:not([disabled]) { background: var(--glass-control); }
.sv-legende__ligne[disabled] { cursor: default; color: var(--text-2); }
.sv-legende__puce { width: 10px; height: 10px; border-radius: 3px; background: var(--c); }
.sv-legende__nom { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sv-legende__valeur { color: var(--muted); font-size: var(--fs-xs); }
.sv-evolution { width: 100%; }
.sv-evolution__svg { width: 100%; height: 260px; display: block; overflow: visible; }
.sv-evolution__grille { stroke: var(--line); stroke-width: 1; }
.sv-evolution__axe { fill: var(--muted); font-size: 11px; font-family: var(--font); }
.sv-evolution__ligne { fill: none; stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; cursor: pointer; vector-effect: non-scaling-stroke; }
.sv-evolution__ligne:hover { stroke-width: 4; }
.sv-vide-doux { display: flex; align-items: flex-start; gap: var(--s-3); padding: var(--s-5); color: var(--text-2); }
.sv-vide-doux svg { color: var(--muted); flex: none; margin-top: 2px; }

/* ───── Domaines ───── */
.sv-page-head-visuel { justify-content: flex-start; align-items: center; }
.sv-domchiffres { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-3); margin-bottom: var(--s-5); }
.sv-domchiffre { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: var(--s-4); border: 0; color: var(--text); font: inherit; text-align: left; cursor: pointer; transition: transform var(--t-med) var(--ease-spring), box-shadow var(--t-med); }
.sv-domchiffre:hover { transform: translateY(-2px); }
.sv-domchiffre.is-actif { box-shadow: var(--glass-inset), 0 0 0 2px var(--gold-line); }
.sv-domchiffre strong { font: 700 var(--fs-2xl)/1 var(--font-display); }
.sv-domchiffre span { font-size: var(--fs-xs); color: var(--muted); }
.sv-domgroupes { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: var(--s-4); align-items: start; }
.sv-domgroupe { padding: var(--s-3); }
.sv-domgroupe__tete { display: flex; align-items: center; gap: var(--s-3); width: 100%; padding: var(--s-2); border: 0; border-radius: var(--r-md); background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.sv-domgroupe__tete:hover { background: var(--glass-control); }
.sv-domgroupe__tete > span { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.sv-domgroupe__tete small { font-size: var(--fs-xs); color: var(--muted); }
.sv-domgroupe__tete > svg { color: var(--muted); }
.sv-domliste { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; }
.sv-domliste li { display: flex; align-items: center; gap: 4px; border-top: 1px solid var(--line); }
.sv-domligne { flex: 1; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--s-3); padding: 10px var(--s-2); border: 0; background: transparent; color: var(--text); font: 500 var(--fs-sm)/1.25 var(--font-body); text-align: left; cursor: pointer; border-radius: var(--r-sm); min-width: 0; }
.sv-domligne:hover { background: var(--glass-control); }
.sv-domligne__hote { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sv-domligne__tags { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.sv-domligne__ouvrir { display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--r-sm); color: var(--muted); flex: none; }
.sv-domligne__ouvrir:hover { background: var(--glass-control); color: var(--text); }
.sv-cert { --p: 1; position: relative; width: 38px; height: 38px; flex: none; border-radius: 50%; display: grid; place-content: center; text-align: center; line-height: 1; background: conic-gradient(var(--ton) calc(var(--p) * 360deg), rgba(var(--overlay), 0.08) 0); }
.sv-cert::before { content: ''; position: absolute; inset: 4px; border-radius: 50%; background: var(--surface); }
.sv-cert > * { position: relative; }
.sv-cert span { font-size: 11px; font-weight: 700; }
.sv-cert small { font-size: 8.5px; color: var(--muted); }
.sv-cert--vide { background: none; color: var(--muted); }
.sv-dom-projet { display: flex; align-items: center; gap: var(--s-3); width: 100%; padding: var(--s-3); border: 0; border-radius: var(--r-md); background: var(--glass-control); box-shadow: var(--glass-inset); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.sv-dom-projet > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.sv-dom-projet small { font-size: var(--fs-xs); color: var(--muted); }
.sv-dom-cert, .sv-dom-temp { display: flex; gap: var(--s-4); align-items: flex-start; }
.sv-dom-cert .sv-cert { width: 64px; height: 64px; }
.sv-dom-cert .sv-cert span { font-size: 18px; }
.sv-dom-cert p, .sv-dom-temp p { font-size: var(--fs-sm); line-height: 1.5; margin-top: 4px; }
.sv-dom-temp { padding: var(--s-4); border-radius: var(--r-md); background: var(--warn-soft); }
.sv-dom-temp > svg { color: var(--warn); flex: none; margin-top: 2px; }

/* ───── Tâches et chaînes ───── */
.sv-journee { padding: var(--s-5); margin-bottom: var(--s-5); }
.sv-journee__tete h2 { font: 650 var(--fs-lg)/1.15 var(--font); letter-spacing: -0.02em; }
.sv-journee__tete p { font-size: var(--fs-xs); margin-top: 2px; }
.sv-frise { position: relative; height: 92px; margin: var(--s-5) 4px var(--s-2); border-bottom: 2px solid var(--line-strong); }
.sv-frise__nuit { position: absolute; top: 0; bottom: 0; background: linear-gradient(180deg, rgba(var(--gold-rgb), 0.10), rgba(var(--gold-rgb), 0.02)); border-radius: var(--r-sm) var(--r-sm) 0 0; }
.sv-frise__heure { position: absolute; bottom: -22px; transform: translateX(-50%); font-size: 10.5px; color: var(--muted); white-space: nowrap; }
.sv-frise__maintenant { position: absolute; top: -6px; bottom: -4px; width: 2px; margin-left: -1px; background: var(--danger); border-radius: 2px; }
.sv-frise__maintenant::before { content: 'maintenant'; position: absolute; top: -16px; left: 50%; transform: translateX(-50%); font-size: 9.5px; font-weight: 600; color: var(--danger); white-space: nowrap; }
.sv-frise__tache { position: absolute; bottom: calc(10px + var(--rang, 0) * 22px); width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok) 22%, transparent); cursor: help; }
.sv-frise__tache::after { content: ''; position: absolute; left: 50%; top: 14px; width: 1px; height: calc(var(--rang, 0) * 22px + 10px); background: color-mix(in srgb, var(--ok) 45%, transparent); }
.sv-frise__tache--sys { background: var(--info); box-shadow: 0 0 0 3px color-mix(in srgb, var(--info) 22%, transparent); }
.sv-frise__tache--sys::after { background: color-mix(in srgb, var(--info) 45%, transparent); }
.sv-frise__tache--echec { background: var(--danger); }
.sv-journee__legende { display: flex; flex-wrap: wrap; gap: var(--s-4); margin-top: var(--s-6); font-size: var(--fs-xs); color: var(--muted); }
.sv-journee__legende span { display: inline-flex; align-items: center; gap: 6px; }
.sv-journee__legende .sv-frise__tache { position: static; margin: 0; width: 10px; height: 10px; }
.sv-journee__legende .sv-frise__tache::after { display: none; }
.sv-frise__nuit-puce { width: 14px; height: 10px; border-radius: 3px; background: rgba(var(--gold-rgb), 0.18); }
.sv-continu { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: var(--s-4); font-size: var(--fs-xs); }

.sv-rushs { padding: var(--s-5); margin-bottom: var(--s-5); overflow: hidden; }
.sv-rushs__tete { display: flex; align-items: center; gap: var(--s-4); margin-bottom: var(--s-5); }
.sv-rushs__tete > div:nth-child(2) { flex: 1; min-width: 0; }
.sv-rushs__tete h2 { font: 650 var(--fs-lg)/1.2 var(--font); letter-spacing: -0.02em; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sv-rushs__tete p { color: var(--text-2); font-size: var(--fs-sm); margin-top: 4px; max-width: 70ch; line-height: 1.45; }
.sv-rushs__etat { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: var(--fs-xs); color: var(--muted); text-align: right; }
.sv-tuyau { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s-3); position: relative; }
.sv-tuyau::before { content: ''; position: absolute; top: 22px; left: 10%; right: 10%; height: 3px; border-radius: 3px; background: linear-gradient(90deg, #f2617a, #f0a63a, #3ecfb2, #6e86ff, #a78bfa); opacity: 0.55; }
.sv-tuyau::after { content: ''; position: absolute; top: 19px; left: 10%; width: 9px; height: 9px; border-radius: 50%; background: var(--text); box-shadow: 0 0 10px rgba(var(--gold-rgb), 0.8); animation: sv-flux 6s var(--ease-in-out) infinite; }
@keyframes sv-flux { from { left: 10%; opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } to { left: 89%; opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .sv-tuyau::after { display: none; } }
.sv-tuyau__etape { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.sv-tuyau__rond { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; color: var(--text); background: var(--surface-2); box-shadow: 0 0 0 4px var(--surface), 0 0 0 5px var(--line-strong), 0 10px 22px -10px rgb(var(--shade) / calc(0.7 * var(--shade-k))); }
.sv-tuyau__etape strong { font-size: var(--fs-sm); }
.sv-tuyau__etape small { font-size: var(--fs-xs); color: var(--muted); line-height: 1.4; }
.sv-tuyau__chiffre { font-size: var(--fs-xs); font-weight: 600; color: var(--gold-bright); }

.sv-chaines { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--s-4); margin-bottom: var(--s-5); }
.sv-chaine { display: flex; flex-direction: column; gap: var(--s-2); padding: var(--s-5); text-align: left; color: var(--text); font: inherit; border: 0; cursor: pointer; transition: transform var(--t-med) var(--ease-spring), box-shadow var(--t-med); }
.sv-chaine:hover { transform: translateY(-3px); box-shadow: var(--glass-inset), var(--glass-shadow-lift); }
.sv-chaine--idee { background-image: linear-gradient(160deg, rgba(var(--gold-rgb), 0.08), transparent 60%); box-shadow: var(--glass-inset), var(--glass-shadow), inset 0 0 0 1px var(--gold-line); }
.sv-chaine--coupee { opacity: 0.7; }
.sv-chaine__tete { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sv-chaine__badges { display: flex; gap: 6px; flex-wrap: wrap; }
.sv-chaine__titre { font-size: var(--fs-lg); font-weight: 650; letter-spacing: -0.02em; }
.sv-chaine__resume { font-size: var(--fs-sm); color: var(--text-2); line-height: 1.45; }
.sv-chaine__pied { display: flex; flex-direction: column; gap: 3px; margin-top: auto; padding-top: var(--s-2); font-size: var(--fs-xs); }
.sv-chaine__pied > span { display: flex; align-items: center; gap: 6px; }
.sv-chaine__projets { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.sv-projet-puce { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px 4px 5px; border: 0; border-radius: var(--r-pill); background: var(--glass-control); box-shadow: var(--glass-inset); color: var(--text); font: 600 var(--fs-xs)/1 var(--font-body); cursor: pointer; }
.sv-projet-puce small { color: var(--muted); font-weight: 500; }
.sv-projet-puce--mini { padding: 3px 8px; cursor: inherit; }
.sv-projet-puce--mini::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--c); }
.sv-tache__rythme { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; color: var(--text-2); }
.sv-idee { display: flex; flex-direction: column; gap: 6px; padding: var(--s-4); border-radius: var(--r-md); background: var(--gold-soft); font-size: var(--fs-sm); line-height: 1.5; }
.sv-idee__go { display: flex; align-items: center; gap: 6px; font-weight: 600; color: var(--gold-bright); }
.sv-etapes-mini { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-sm); }
.sv-etapes-mini small { display: block; color: var(--muted); font-size: var(--fs-xs); }
.sv-parprojet { display: grid; grid-template-columns: repeat(auto-fill, minmax(380px, 1fr)); gap: var(--s-4); margin-bottom: var(--s-5); align-items: start; }
.sv-parprojet__ligne { padding: var(--s-3); }
.sv-parprojet__chaines { display: flex; flex-direction: column; gap: 4px; margin-top: 4px; }
.sv-chaine-mini { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 4px 10px; padding: 8px; border: 0; border-radius: var(--r-sm); background: transparent; color: var(--text); font: 500 var(--fs-sm)/1.3 var(--font-body); text-align: left; cursor: pointer; }
.sv-chaine-mini:hover { background: var(--glass-control); }
.sv-chaine-mini small { grid-column: 2; font-size: var(--fs-xs); }
.sv-systeme { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--s-3) var(--s-5); }
.sv-systeme li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: flex-start; }
.sv-systeme li .sv-point { margin-top: 6px; }
.sv-systeme strong { display: block; font-size: var(--fs-sm); font-weight: 600; }
.sv-systeme small { display: block; font-size: var(--fs-xs); color: var(--muted); line-height: 1.4; }
.sv-systeme .sv-muted { font-size: var(--fs-xs); white-space: nowrap; }

/* ───── Écrans moyens ───── */
@media (max-width: 1200px) {
  .sv-organes, .sv-bouges { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sv-bas { grid-template-columns: 1fr 1fr; }
  .sv-bas > :first-child { grid-column: 1 / -1; }
  .sv-duo { grid-template-columns: 1fr; }
}

/* ───── Téléphone ───── */
@media (max-width: 860px) {
  .sv-hero { grid-template-columns: auto minmax(0, 1fr); padding: var(--s-5); gap: var(--s-4); }
  .sv-hero__desc { font-size: var(--fs-sm); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .sv-hero__puces { display: none; }
  .sv-hero__etat { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: space-between; text-align: left; flex-wrap: wrap; }
  .sv-hero__etat .sv-muted { order: 3; width: 100%; font-size: var(--fs-xs); }
  .sv-verdict-pill { font-size: var(--fs-sm); padding: 8px 14px; }
  .sv-organes { gap: var(--s-3); margin-bottom: var(--s-5); }
  .sv-organe { grid-template-columns: 1fr; padding: var(--s-4); justify-items: start; gap: var(--s-2); }
  .sv-organe .sv-visuel { width: 52px !important; height: 52px !important; }
  .sv-organe__grand { font-size: var(--fs-lg); }
  .sv-organe__petit, .sv-organe__courbe { display: none; }
  .sv-organe__corps { width: 100%; }
  .sv-bouges { grid-template-columns: 1fr 1fr; gap: var(--s-3); }
  .sv-bouge__corps { padding: var(--s-3); gap: var(--s-2); }
  .sv-bouge__tete .sv-logo { display: none; }
  .sv-bouge__badges .tag, .sv-bouge__badges .sv-modele { display: none; }
  .sv-domstrip { flex-wrap: wrap; padding: var(--s-4); }
  .sv-domstrip .sv-visuel { width: 44px !important; height: 44px !important; }
  .sv-domstrip__chiffres { width: 100%; justify-content: space-around; }
  .sv-domstrip__fleche { display: none; }
  .sv-ajour__liste { grid-template-columns: 1fr; }
  .sv-bas { grid-template-columns: 1fr; gap: var(--s-3); }
  .sv-pli > summary { padding: var(--s-4); }
  .sv-pli__corps { padding: 0 var(--s-4) var(--s-4); }

  .sv-detail__tete { flex-direction: column; align-items: flex-start; gap: var(--s-3); }
  .sv-detail__tete .sv-visuel { width: 72px !important; height: 72px !important; }
  .sv-detail__chiffres { grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
  .sv-detail__chiffres > div { padding: var(--s-2) var(--s-3); }
  .sv-detail__chiffres strong { font-size: var(--fs-md); }
  .sv-bref { grid-template-columns: 1fr 1fr; }
  .sv-fiche__identite { flex-wrap: wrap; }
  .sv-fiche__identite .sv-logo { width: 48px !important; height: 48px !important; }
  .sv-fiche__ouvrir { width: 100%; justify-content: center; }
  .sv-fiche__form-grille { grid-template-columns: 1fr; }
  .sv-fiche__hero .sv-capture { max-height: 200px; }

  .sv-pcartes { grid-template-columns: 1fr; }
  .sv-espace__camembert { grid-template-columns: 1fr; justify-items: center; gap: var(--s-4); }
  .sv-legende { grid-template-columns: 1fr; width: 100%; }
  .sv-evolution__svg { height: 200px; }
  .sv-domchiffres { grid-template-columns: 1fr 1fr; }
  .sv-domgroupes, .sv-parprojet, .sv-chaines { grid-template-columns: 1fr; }
  .sv-domligne { grid-template-columns: minmax(0, 1fr) auto; }
  .sv-domligne__tags { display: none; }
  .sv-page-head-visuel .sv-visuel { width: 56px !important; height: 56px !important; }
  .sv-tuyau { grid-template-columns: 1fr; gap: var(--s-3); }
  .sv-tuyau::before { top: 23px; bottom: 23px; left: 22px; right: auto; width: 3px; height: auto; background: linear-gradient(180deg, #f2617a, #f0a63a, #3ecfb2, #6e86ff, #a78bfa); }
  .sv-tuyau::after { display: none; }
  .sv-tuyau__etape { display: grid; grid-template-columns: 46px minmax(0, 1fr); grid-template-rows: auto auto; text-align: left; align-items: center; gap: 0 var(--s-3); }
  .sv-tuyau__rond { grid-row: span 3; }
  .sv-rushs__tete { flex-wrap: wrap; }
  .sv-rushs__etat { align-items: flex-start; text-align: left; width: 100%; }
  .sv-frise__heure:nth-of-type(even) { display: none; }
  .sv-frise__maintenant::before { display: none; }
  .sv-outils { flex-direction: column; align-items: stretch; }
}

.sv-domstrip { flex-wrap: wrap; align-content: center; }
.sv-domstrip__vrais { width: 100%; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding-top: var(--s-3); border-top: 1px solid var(--line); }
.sv-puce--provisoire { color: var(--muted); }
.sv-domstrip__vrais .sv-muted { font-size: var(--fs-xs); }
.sv-fiche__form { display: flex; flex-direction: column; gap: var(--s-3); }
.sv-fiche__form > h4 { margin: 0; }
.sv-fiche__form-pied { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); }

/* ───── Protocole d'urgence ───── */
.who-menu__item--urgence { color: var(--danger); }
.who-menu__item--urgence small { color: var(--muted); }
.sv-urg__hero { display: flex; align-items: center; gap: var(--s-5); padding: var(--s-6); margin-bottom: var(--s-4); background-image: linear-gradient(135deg, var(--danger-soft), transparent 60%); }
.sv-urg__hero .page-title { margin: 0; }
.sv-urg__sirene { width: 72px; height: 72px; flex: none; border-radius: 22px; display: grid; place-items: center; color: var(--danger); background: var(--danger-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--danger) 30%, transparent); }
.sv-urg__principes { list-style: none; margin: 0 0 var(--s-4); padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-3); }
.sv-urg__principes li { display: flex; gap: 10px; align-items: flex-start; padding: var(--s-3) var(--s-4); border-radius: var(--r-md); background: var(--glass-control); box-shadow: var(--glass-inset); font-size: var(--fs-sm); line-height: 1.45; }
.sv-urg__principes li > span { width: 22px; height: 22px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: var(--fs-xs); font-weight: 700; background: var(--surface-3); }
.sv-urg__raccourcis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--s-3); margin-bottom: var(--s-5); }
.sv-urg__raccourci { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: var(--s-4); border: 0; border-radius: var(--r-lg); background: var(--glass-bg); box-shadow: var(--glass-inset), var(--glass-shadow); color: var(--text); font: 600 var(--fs-sm)/1.3 var(--font-body); text-align: left; cursor: pointer; transition: transform var(--t-med) var(--ease-spring); }
.sv-urg__raccourci:hover { transform: translateY(-2px); }
.sv-urg__raccourci svg { color: var(--danger); }
.sv-urg__situations { display: flex; flex-direction: column; gap: var(--s-3); margin-bottom: var(--s-5); }
.sv-urg__situation { padding: 0; scroll-margin-top: 16px; }
.sv-urg__situation > summary { display: flex; align-items: center; gap: var(--s-4); padding: var(--s-4) var(--s-5); cursor: pointer; list-style: none; }
.sv-urg__situation > summary::-webkit-details-marker { display: none; }
.sv-urg__situation > summary > svg:last-child { color: var(--muted); transition: transform var(--t-med) var(--ease-out); flex: none; }
.sv-urg__situation[open] > summary > svg:last-child { transform: rotate(90deg); }
.sv-urg__icone { width: 44px; height: 44px; flex: none; border-radius: 14px; display: grid; place-items: center; color: var(--ton, var(--danger)); background: color-mix(in srgb, var(--ton, var(--danger)) 14%, transparent); }
.sv-urg--danger { --ton: var(--danger); }
.sv-urg--warn { --ton: var(--warn); }
.sv-urg--info { --ton: var(--info); }
.sv-urg__titre { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.sv-urg__titre strong { font-size: var(--fs-lg); letter-spacing: -0.02em; }
.sv-urg__titre small { font-size: var(--fs-sm); color: var(--text-2); line-height: 1.45; }
.sv-urg__phases { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--s-4); padding: 0 var(--s-5) var(--s-5); }
.sv-urg__phase { padding: var(--s-4); border-radius: var(--r-md); background: var(--glass-control); box-shadow: var(--glass-inset); }
.sv-urg__phase h3 { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); font-weight: 700; margin-bottom: var(--s-3); color: var(--ton); }
.sv-urg__num { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: var(--fs-xs); color: var(--on-gold); background: var(--ton); }
.sv-urg__phase ol { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: var(--s-3); }
.sv-urg__phase li strong { display: block; font-size: var(--fs-sm); }
.sv-urg__phase li p { font-size: var(--fs-sm); color: var(--text-2); line-height: 1.5; margin-top: 2px; }
.sv-urg__cmd { margin-top: 6px; max-width: 100%; }
.sv-urg__cmd code { white-space: pre-wrap; word-break: break-all; text-align: left; }
.sv-urg__preparer { padding: var(--s-5); }
.sv-urg__preparer-tete { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--s-5); flex-wrap: wrap; margin-bottom: var(--s-4); }
.sv-urg__preparer-tete h2 { display: flex; align-items: center; gap: 8px; font: 650 var(--fs-lg)/1.2 var(--font); }
.sv-urg__preparer-tete p { font-size: var(--fs-sm); margin-top: 4px; }
.sv-urg__jauge { min-width: 220px; display: flex; flex-direction: column; gap: 6px; }
.sv-urg__jauge-texte { display: flex; align-items: baseline; gap: 8px; }
.sv-urg__jauge-texte strong { font: 700 var(--fs-xl)/1 var(--font-display); }
.sv-urg__jauge-texte span { font-size: var(--fs-xs); color: var(--muted); }
.sv-urg__jauge .sv-barre { height: 8px; }
.sv-urg__prepa { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: var(--s-2) var(--s-4); }
.sv-urg__point label { display: flex; gap: 12px; align-items: flex-start; padding: var(--s-3); border-radius: var(--r-md); cursor: pointer; }
.sv-urg__point label:hover { background: var(--glass-control); }
.sv-urg__point input { position: absolute; opacity: 0; pointer-events: none; }
.sv-urg__coche { width: 22px; height: 22px; flex: none; margin-top: 1px; border-radius: 7px; display: grid; place-items: center; color: transparent; box-shadow: inset 0 0 0 2px var(--line-strong); transition: background var(--t-fast), color var(--t-fast); }
.sv-urg__point input:focus-visible + .sv-urg__coche { outline: 2px solid var(--gold); outline-offset: 2px; }
.sv-urg__point.is-fait .sv-urg__coche { color: var(--on-gold); background: var(--ok); box-shadow: none; }
.sv-urg__point label > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.sv-urg__point strong { font-size: var(--fs-sm); }
.sv-urg__point.is-fait strong { color: var(--text-2); }
.sv-urg__point small { font-size: var(--fs-xs); color: var(--muted); line-height: 1.45; }
.sv-urg__point em { font-size: var(--fs-xs); color: var(--ok); font-style: normal; font-weight: 600; }
.sv-urg__lien { display: flex; align-items: center; gap: var(--s-4); padding: var(--s-4) var(--s-5); margin-top: var(--s-4); color: var(--text); --ton: var(--danger); }
.sv-urg__lien > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.sv-urg__lien small { font-size: var(--fs-xs); color: var(--muted); }
.sv-urg__lien > svg { color: var(--muted); }
@media (max-width: 1200px) {
  .sv-urg__raccourcis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sv-urg__principes { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  .sv-urg__hero { padding: var(--s-5); gap: var(--s-4); align-items: flex-start; }
  .sv-urg__sirene { width: 52px; height: 52px; border-radius: 16px; }
  .sv-urg__principes { grid-template-columns: 1fr; }
  .sv-urg__raccourcis { grid-template-columns: 1fr 1fr; }
  .sv-urg__situation > summary { padding: var(--s-4); gap: var(--s-3); flex-wrap: wrap; }
  .sv-urg__situation > summary .tag { order: 3; }
  .sv-urg__titre small { display: none; }
  .sv-urg__phases { padding: 0 var(--s-3) var(--s-3); }
  .sv-urg__prepa { grid-template-columns: 1fr; }
}
.who-menu { background-color: var(--surface-2); }