/* Scène « La courbe d’amortissement » — Immobilisations. À plat : traits, aplats, aucune ombre. Classes préfixées am-. */
.am-bien, .am-fiche, .am-resume, .am-plan, .am-col, .am-graphe, .am-an, .am-dot, .am-ech, .am-point { position: absolute; left: 0; top: 0; }

/* Le bien : un utilitaire en trait fin ; en pointillé une fois amorti */
.am-bien { opacity: 0; will-change: transform, opacity; }
.am-bien svg { display: block; overflow: visible; }
.am-bien path, .am-bien circle { fill: none; stroke: var(--ink); stroke-width: 2px; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.am-bien .am-sol { stroke: var(--line-fort); }
.am-plein .am-caisse, .am-plein .am-roue { fill: var(--surface); }
.am-plein .am-vitre { fill: var(--bg-doux); }
.am-tirets { opacity: 0; }
.am-tirets path, .am-tirets circle { stroke: var(--text); stroke-dasharray: 3 5; }
.am-tirets .am-detail { display: none; }

/* Sa fiche */
.am-fiche { padding: 14px 16px 16px; border-radius: var(--r-2); background: var(--surface); border: 1px solid var(--line-fort); color: var(--ink); opacity: 0; will-change: transform, opacity; }
.am-tete { display: flex; align-items: center; justify-content: space-between; gap: 10px; height: 26px; margin-bottom: 8px; }
.am-tete b { font-size: 16px; font-weight: 700; line-height: 1; }
.am-etat { padding: 5px 10px; border-radius: var(--r-pilule); border: 1px solid var(--line-fort); font-size: 11.5px; font-weight: 700; line-height: 1.2; color: var(--accent-texte); white-space: nowrap; opacity: 0; transition: opacity var(--d-2); }
.am-ligne { display: flex; align-items: baseline; justify-content: space-between; padding: 5px 0; font-size: 12.5px; line-height: 1.1; color: var(--muted); white-space: nowrap; }
.am-ligne span + span { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; }
.am-nette { display: flex; align-items: baseline; justify-content: space-between; margin-top: 9px; padding-top: 13px; border-top: 1px solid var(--line); white-space: nowrap; }
.am-nette span { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); line-height: 1; }
.am-nette b { font-size: 26px; font-weight: 700; line-height: 1; color: var(--ink); font-variant-numeric: tabular-nums; }
.am-nette i { font-style: normal; }
.am-nette small { margin-left: 5px; font-size: 12px; font-weight: 700; color: var(--muted); }

/* Le plan : axes, escalier prévu, escalier tracé */
.am-plan { width: 100%; height: 100%; opacity: 0; }
.am-graphe { max-width: none; overflow: visible; }
.am-graphe path { fill: none; }
.am-axe { stroke: var(--ink); stroke-width: 1.5px; stroke-linecap: round; stroke-linejoin: round; }
.am-prevu { stroke: var(--line-fort); stroke-width: 1.5px; stroke-dasharray: 2 5; stroke-linecap: round; }
.am-trace { stroke: var(--accent); stroke-width: 4px; stroke-linejoin: round; }
.am-oubli { stroke: var(--ambre); stroke-width: 3px; stroke-dasharray: 6 6; opacity: 0; }
.am-col { background: var(--bg-doux); opacity: 0; }
.am-point { width: 16px; height: 16px; margin: -8px; border-radius: 50%; background: var(--surface); border: 4px solid var(--accent); opacity: 0; will-change: transform, opacity; }
.am-an, .am-dot { text-align: center; white-space: nowrap; line-height: 1; font-variant-numeric: tabular-nums; }
.am-an { font-size: 12px; font-weight: 600; color: var(--muted); }
.am-an.cours { color: var(--ink); font-weight: 700; }
.am-an.fait { color: var(--text); }
.am-dot { font-size: 12.5px; font-weight: 700; color: var(--ink); opacity: 0; will-change: transform, opacity; }
.am-ech { width: 68px; text-align: right; font-size: 11px; font-weight: 600; line-height: 1; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* La fiche non mise à jour : en ambre */
.am-alerte .am-fiche { border-color: var(--ambre); }
.am-alerte .am-etat { color: var(--ambre-texte); border-color: var(--ambre); }
.am-alerte .am-nette b { color: var(--ambre-texte); }
.am-alerte .am-point { border-color: var(--ambre); }

/* Temps fort : le bien est amorti, l’état passe en aplat d’accent (il bat une fois, voir le JS) */
.am-etat.amorti { background: var(--accent-fonce); border-color: var(--accent-fonce); color: #fff; }

/* Relief : le plan est le support (0). La fiche est posée dessus, le curseur de valeur se déplace au-dessus de sa courbe
   (bas, pour rester lisible sur elle), le bien lui-même est l’objet le plus haut. */
.am-fiche, .am-resume { translate: 0 0 calc(14px * var(--relief)); }
.am-point { translate: 0 0 calc(10px * var(--relief)); }
.am-bien { translate: 0 0 calc(34px * var(--relief)); }

/* Petit écran : la valeur nette en grand, le bien en vignette, le plan occupe le cadre */
.am-resume { opacity: 0; will-change: transform, opacity; }
.am-compact .am-bien path, .am-compact .am-bien circle { stroke-width: 1.5px; }
.am-compact .am-detail, .am-compact .am-tirets .am-vitre { display: none; }
.am-compact .am-tirets path, .am-compact .am-tirets circle { stroke-dasharray: 2 3; }
.am-compact .am-nette { display: block; margin: 0; padding: 0; border: 0; }
.am-compact .am-nette span { display: block; padding-top: 6px; }
.am-compact .am-nette b { display: block; margin-top: 12px; font-size: 28px; }
.am-compact .am-etat { position: absolute; right: 0; top: 0; padding: 4px 9px; font-size: 11px; background: var(--surface); transform-origin: 100% 50%; }
.am-compact .am-etat.amorti { background: var(--accent-fonce); }
.am-compact .am-an, .am-compact .am-dot { font-size: 11px; }
.am-compact .am-trace { stroke-width: 3.5px; }
.am-compact .am-point { width: 13px; height: 13px; margin: -6.5px; border-width: 3.5px; }