/* SVG instruments share the cahier's paper and ink. */
.anatomy-card { margin:var(--space-6) 0; border:1px solid var(--ligne-cahier); border-radius:12px; overflow:hidden; background:var(--surface); color:var(--texte); }
.anatomy-card.iso[data-theme="light"] { --anatomy-paper:#fffef8; --anatomy-top:#fffef8; --anatomy-face:#fffef8; --anatomy-shade-0:#b7c4d3; --anatomy-shade-1:#cbd5df; --anatomy-shade-2:#dfe5eb; --anatomy-shade-3:#edf0ef; --anatomy-hi:#173b70; --anatomy-mid:#50657c; --anatomy-lo:#7c8d9e; --anatomy-faint:#aebcc9; --anatomy-lit:#173b70; --anatomy-lit-top:#fffef8; --anatomy-lit-shade:#e3eaf0; --anatomy-dot:#173b70; }
.anatomy-head,.anatomy-foot { display:flex; justify-content:space-between; gap:var(--space-3); padding:var(--space-4) var(--space-5); align-items:baseline; flex-wrap:wrap; }
.anatomy-head { border-bottom:1px solid var(--ligne-cahier); }
.anatomy-head span,.anatomy-foot { font-size:var(--text-sm); }
.anatomy-head h3 { margin:0; font-size:var(--text-lg); }
.anatomy-stage { padding:8px 12px 0; background:radial-gradient(ellipse at 50% 70%,#e7edf1 0,transparent 65%); }
.anatomy-stage svg { width:100%; height:auto; overflow:hidden; }
.anatomy-controls { padding:var(--space-3) var(--space-5); display:flex; gap:var(--space-3); align-items:center; flex-wrap:wrap; }
.anatomy-controls[hidden] { display:none; }
.anatomy-controls label { font-size:var(--text-sm); font-weight:700; }
.anatomy-controls input[type=range] { flex:1 1 180px; width:100%; min-width:0; min-height:44px; accent-color:var(--encre); }
.anatomy-controls button { min-height:44px; padding:8px 14px; border:1px solid var(--encre); border-radius:6px; color:var(--encre); background:var(--surface); font-size:var(--text-sm); }
.anatomy-controls button[aria-pressed=true] { background:var(--encre); color:var(--blanc); }
.anatomy-steps { display:flex; flex-wrap:wrap; gap:8px; }
.anatomy-readout { font-weight:700; color:var(--encre); }
.anatomy-foot { border-top:1px solid var(--ligne-cahier); }
.anatomy-card figcaption { padding:0 var(--space-5) var(--space-5); }
.anatomy-card figcaption p { margin-bottom:var(--space-3); }
.anatomy-card details { font-size:var(--text-sm); }
.anatomy-card summary { cursor:pointer; padding:10px 0; font-weight:700; color:var(--encre); }
.anatomy-card details ol { list-style:decimal; padding-left:1.5rem; }
.anatomy-card details li { margin:8px 0; }
@media(max-width:480px) { .anatomy-head,.anatomy-foot,.anatomy-controls { padding:14px; } .anatomy-card figcaption { padding:0 14px 14px; } .anatomy-stage { padding:0; } .anatomy-controls>button { width:100%; } }