/* =========================================================
   Chapitre VII — Mouvements de Mars (la parallaxe)
   Complète chapitre.css.
   ========================================================= */
.page .texte { font-size: calc(17 * var(--u)); line-height: 1.34; }
.page .petit-texte { font-size: calc(15 * var(--u)); line-height: 1.3; color: var(--encre-douce); }
#objection .page.droite { gap: calc(10 * var(--u)); }
#objection .texte { font-size: calc(16.5 * var(--u)); line-height: 1.32; }
.encart.reponse { padding: calc(8 * var(--u)) calc(16 * var(--u)); gap: calc(3 * var(--u)); }
.encart.reponse h3 { font-size: calc(21 * var(--u)); }
.encart.reponse p { font-size: calc(15.5 * var(--u)); color: var(--encre); }

/* animations */
.figure-anim { flex: 1 1 0; min-height: 0; gap: calc(6 * var(--u)); }
.figure-anim > svg { overflow: hidden; flex: 1 1 0; min-height: 0; width: 100%; display: block; user-select: none; -webkit-user-select: none; touch-action: none; }
.figure-anim > svg:focus { outline: none; }
.commandes { flex: none; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: calc(6 * var(--u)) calc(12 * var(--u)); font-family: var(--serif); font-size: calc(16 * var(--u)); color: var(--encre); }
.commandes label { display: flex; align-items: center; gap: calc(7 * var(--u)); font-style: italic; }
.commandes input[type="range"] { width: calc(160 * var(--u)); accent-color: #24467f; }
.commandes input[type="checkbox"] { accent-color: #24467f; }
.commandes output { font-weight: 700; font-variant-numeric: tabular-nums; }
.commandes button { font: inherit; font-family: var(--capitales); font-size: calc(15 * var(--u)); letter-spacing: .04em; padding: calc(2 * var(--u)) calc(12 * var(--u)); cursor: pointer; color: var(--encre); background: transparent; border: 1px solid rgba(122,90,28,.6); border-radius: 999px; }
.commandes button:hover { background: rgba(214,180,108,.35); }
.commandes button[aria-pressed="true"], .annees button[aria-pressed="true"] { background: #24467f; color: #fbf6ea; border-color: #24467f; }
.bascule { display: inline-flex; }
.bascule button { border-radius: 0; }
.bascule button:first-child { border-radius: 999px 0 0 999px; }
.bascule button:last-child { border-radius: 0 999px 999px 0; }
.bascule button + button { border-left: none; }
.annees { gap: calc(5 * var(--u)); }
.annees button { padding: calc(1 * var(--u)) calc(9 * var(--u)); }
#fig-oppositions .r-date { width: calc(250 * var(--u)); }
.date-opp { min-width: 8.5em; }

/* page de droite */
.mesures.distances { width: auto; align-self: center; font-size: calc(15.5 * var(--u)); }
.mesures.distances td { padding: calc(1 * var(--u)) calc(12 * var(--u)); }
.mesures.distances td:nth-child(2) { text-align: right; }
.note-annee { border: 1px solid #c8b48a; background: rgba(251,246,234,.75); padding: calc(6 * var(--u)) calc(14 * var(--u)); font-size: calc(16 * var(--u)); line-height: 1.32; }
.note-annee h3 { margin: 0 0 calc(2 * var(--u)); font-family: var(--serif); font-size: calc(19 * var(--u)); color: #24467f; }
.note-annee p { margin: 0; font-style: italic; text-align: justify; }
.note-annee .chiffres { font-style: normal; font-size: calc(14.5 * var(--u)); color: var(--encre-douce); margin-top: calc(3 * var(--u)); }

/* dessins (SVG) */
.p-fond { fill: url(#p-fond); }
.p-etoile { fill: #f1f4ff; }
.p-etoile.chaude { fill: #ffd9b0; }
.p-ligne { fill: none; stroke: #8fa6c2; stroke-opacity: .45; stroke-width: 1; }
.p-cons { font: italic 600 15px var(--serif); fill: #8fa6c2; fill-opacity: .8; text-anchor: middle; letter-spacing: .06em; }
.p-nom { font: 600 13px var(--serif); fill: #dfe7f5; fill-opacity: .9; }
.p-nom.brillante { font-size: 15px; fill: #ffe2b8; }
.p-ecliptique { fill: none; stroke: #d6b46c; stroke-opacity: .5; stroke-width: 1; stroke-dasharray: 6 5; }
.p-titre { font: 600 14px var(--capitales); letter-spacing: .1em; fill: #c9d6e8; fill-opacity: .75; }
.p-info { font: italic 15px var(--serif); fill: #dfe7f5; }
.p-info.fort { font-weight: 700; fill: #ffb3a8; }
.p-separation { stroke: #d6b46c; stroke-opacity: .5; }
.p-orbite { fill: none; stroke-width: 1.3; }
.p-orbite.terre { stroke: #5aa9e6; }
.p-orbite.planete { stroke: #e0574a; stroke-dasharray: 4 3; }
.p-visee { stroke: #ff9a8c; stroke-width: .8; stroke-dasharray: 4 4; }
.p-etoile-bleue { fill: #8fd8ff; stroke: #e6f7ff; stroke-width: 1; filter: drop-shadow(0 0 4px #5ec8ff); }
.p-visee.bleue { stroke: #8fd8ff; }
.p-etoile-verte { fill: #7ee08a; stroke: #e2ffe6; stroke-width: 1; filter: drop-shadow(0 0 4px #3fd65a); }
.p-visee.verte { stroke: #7ee08a; }
.p-etoile-jaune { fill: #ffd34d; stroke: #fff4c2; stroke-width: 1; filter: drop-shadow(0 0 4px #ffc400); }
.p-visee.jaune { stroke: #ffd34d; }
.p-visee.centre { stroke: #c9d6e8; stroke-opacity: .6; }
.p-trace { fill: none; stroke: #ff7a6b; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.p-trace.futur { stroke-opacity: .25; stroke-dasharray: 3 4; }
.p-trace.ellipse { stroke: #ffd34d; stroke-width: 1.2; stroke-opacity: .75; }
.p-mois circle { fill: #ff7a6b; }
.p-mois text { font: 700 14px var(--serif); fill: #ffc2b8; paint-order: stroke; stroke: #0b1626; stroke-width: 3px; }
.p-soleil { fill: #ffe066; stroke: #ffb703; stroke-width: 1.5; }
.p-terre { fill: #3c8fd9; stroke: #cfe6ff; stroke-width: 1.2; }
.p-mars { fill: #e0574a; stroke: #ffc2b8; stroke-width: 1; }
.p-jupiter { fill: #e9c99a; stroke: #fff2dc; stroke-width: 1; }
.p-saturne { fill: #d9c27a; stroke: #fff2dc; stroke-width: 1; }
.p-lune { fill: #d9dde3; }
.p-observateur { fill: #ffd34d; stroke: #3b2210; stroke-width: 1.5; cursor: grab; }
.p-cadre { fill: none; stroke: #8fa6c2; stroke-opacity: .5; }
.p-encart { fill: rgba(11,22,38,.82); stroke: #8fa6c2; stroke-opacity: .5; }
.p-nuit { fill: rgba(0,0,0,.35); }
.p-sol { fill: #2b4e2f; }
.p-arc { fill: none; stroke: #ffd34d; stroke-width: 1.4; }
.p-angle { font: italic 700 16px var(--serif); fill: #ffd34d; }

@media (max-width: 760px) {
  .figure-anim > svg { flex: none; height: auto; }
}