.proportion-shell{width:min(1180px,calc(100% - 2rem))}
.proportion-hero{border-top-color:#4f7fa5;background:linear-gradient(150deg,#ffffff,#edf5f8 72%,#f4f0f6)}
.proportion-start{background:linear-gradient(135deg,#276f78,#4f7392)}
.proportion-targeted-grid button span{background:#e7f0f4;color:#315e78}
.prop-card-head{padding:1.25rem 1.35rem 1.05rem;border-bottom:1px solid #e1e9e9;background:linear-gradient(180deg,#fbfdfd,#f5faf9)}
.prop-card-head h1{margin:.2rem 0 .35rem;color:#18364c;font-size:clamp(1.45rem,3vw,2rem);letter-spacing:-.025em}
.prop-card-head p:last-child{margin:.25rem 0 0;color:#5b707d;line-height:1.5}
.prop-body{padding:clamp(1rem,3vw,1.35rem)}
.prop-prompt{margin:0 0 1rem;padding:.9rem 1rem;border-left:4px solid #4f7fa5;border-radius:0 12px 12px 0;background:#eef5f8;color:#18364c;line-height:1.55}
.prop-prompt strong{color:#123955}
.prop-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.prop-field{padding:.8rem .85rem;border:1px solid #d7e2e2;border-radius:13px;background:#fbfcfc}
.prop-field>label,.prop-field>span:first-child,.prop-field legend{display:block;margin-bottom:.45rem;color:#18364c;font-size:.88rem;font-weight:850;line-height:1.35}
.prop-field input[type="text"],.prop-field input[type="number"],.prop-field select,.prop-input{width:100%;min-height:44px;padding:.55rem .65rem;border:1px solid #afc2c7;border-radius:9px;background:#fff;color:#18364c;font-weight:800}
.prop-field input:focus,.prop-field select:focus,.prop-input:focus{border-color:#357f78;outline:none;box-shadow:0 0 0 3px rgba(53,127,120,.10)}
.prop-note{margin:.7rem 0 0;color:#607783;font-size:.84rem;line-height:1.5}
.prop-table{width:100%;border-collapse:collapse;margin:.4rem 0 .9rem;background:#fff}
.prop-table th,.prop-table td{padding:.72rem .65rem;border:1px solid #cfdcdd;text-align:center}
.prop-table th:first-child,.prop-table td:first-child{text-align:left;font-weight:850;background:#f6faf9}
.prop-table th{color:#21465c;background:#f2f7f6}
.prop-quotients{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}
.prop-quotient{padding:.7rem;border:1px solid #d8e3e3;border-radius:11px;background:#fbfcfc;text-align:center}
.prop-quotient label{display:block;margin-bottom:.35rem;color:#526b78;font-size:.8rem;font-weight:800}
.prop-quotient input{width:100%;min-height:42px;padding:.4rem;border:1px solid #b5c7cb;border-radius:8px;text-align:center;font-weight:850}
.choice-list{display:grid;gap:.45rem}
.choice-list label{display:flex;align-items:center;gap:.5rem;min-height:43px;padding:.55rem .65rem;border:1px solid #d3dfe0;border-radius:9px;background:#fff;font-weight:750}
.choice-list input{accent-color:#16786f}
.prop-inline{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.prop-inline input{width:110px;min-height:42px;padding:.45rem .55rem;border:1px solid #afc2c7;border-radius:8px;text-align:center;font-weight:850}
.prop-math{font-family:"Cambria Math",Cambria,Georgia,serif;font-size:1.08rem}
.plot-wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:.7rem}
.plot-svg{width:min(100%,680px);height:auto;margin:0 auto;border:1px solid #d9e4e3;border-radius:13px;background:#fff}
.plot-grid{stroke:#dce6e6;stroke-width:1}
.plot-axis{stroke:#536d78;stroke-width:2}
.plot-label{fill:#536d78;font-size:12px;font-weight:700}
.plot-hit{fill:transparent;cursor:pointer}
.plot-point-plus line{stroke:#16786f;stroke-width:3.5;stroke-linecap:round}
.plot-caption{margin:0;color:#5b707d;font-size:.84rem;text-align:center}
.observation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}
.observation-grid fieldset{margin:0;padding:.75rem;border:1px solid #d8e3e3;border-radius:12px;background:#fbfcfc}
.observation-grid legend{padding:0 .2rem;color:#18364c;font-size:.85rem;font-weight:850}
.graph-choice-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem}
.graph-choice{padding:.6rem;border:2px solid #d4e0e1;border-radius:13px;background:#fff}
.graph-choice.selected{border-color:#bd7b25;background:#fff8ed}
.graph-choice svg{display:block;width:100%;height:auto}
.graph-choice strong{display:block;margin-top:.35rem;color:#18364c;text-align:center}
.cross-discovery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.cross-box{padding:.85rem;border:1px solid #d5e1e1;border-radius:12px;background:#fbfcfc}
.cross-box label{display:block;margin-bottom:.35rem;font-weight:850}
.cross-line{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;font-family:"Cambria Math",Cambria,Georgia,serif;font-size:1.05rem}
.cross-line input{width:110px;min-height:42px;padding:.45rem;border:1px solid #b3c5ca;border-radius:8px;text-align:center;font-weight:850}
.formula-options{display:grid;gap:.45rem}
.formula-options label{display:flex;align-items:center;gap:.5rem;min-height:44px;padding:.58rem .68rem;border:1px solid #d3dfe0;border-radius:9px;background:#fff;font-family:"Cambria Math",Cambria,Georgia,serif;font-weight:800}
.prop-result-row{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:.75rem;align-items:end;margin-top:.8rem}
.prop-result-row label{display:grid;gap:.35rem;font-weight:850}
.prop-result-row input{min-height:44px;padding:.55rem .65rem;border:1px solid #afc2c7;border-radius:9px;font-weight:850}
.solution-steps{display:grid;gap:.5rem}
.solution-steps>div{padding:.65rem .75rem;border:1px solid #dbe5e4;border-radius:10px;background:#f8fbfa;line-height:1.5}
.solution-transition{margin-top:.9rem;padding:.8rem .9rem;border-left:4px solid #80618e;border-radius:0 10px 10px 0;background:#f4eff6;line-height:1.55}
.prop-success{padding:1rem;border:1px solid #acd4bb;border-radius:13px;background:#edf8f1;color:#235f40;font-size:1.05rem;font-weight:850;text-align:center}
.calculator{max-width:430px;margin:0 auto}
.calculator-display{width:100%;min-height:62px;margin-bottom:.75rem;padding:.8rem 1rem;border:2px solid #b8c9cf;border-radius:12px;background:#f9fbfb;color:#18364c;font-family:"Cambria Math",Cambria,Georgia,serif;font-size:1.45rem;font-weight:800;text-align:right}
.calculator-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}
.calculator-grid button{min-height:48px;border:1px solid #c7d5d8;border-radius:10px;background:#fff;color:#18364c;font-size:1.04rem;font-weight:850}
.calculator-grid button:hover{background:#f1f7f6}
.calculator-grid .calc-equals{color:#fff;background:#16786f;border-color:#16786f}
.calculator-note{margin:.7rem 0 0;color:#607783;font-size:.82rem;line-height:1.45}
@media(max-width:880px){
  .graph-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .observation-grid{grid-template-columns:1fr}
}
@media(max-width:680px){
  .prop-grid,.cross-discovery,.prop-result-row{grid-template-columns:1fr}
  .prop-quotients{grid-template-columns:1fr}
  .graph-choice-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .graph-choice-grid{grid-template-columns:1fr}
  .prop-table th,.prop-table td{padding:.55rem .4rem;font-size:.86rem}
}


/* ===== Proportionnalité 4e V1.1 : rigueur et lisibilité ===== */
.prop-field[hidden]{display:none!important}
.magnitude-field{margin-bottom:.85rem}
.magnitude-choices{grid-template-columns:repeat(2,minmax(0,1fr))}
.prop-note-strong{color:#415f6d;font-weight:750}
.graph-choice[aria-pressed="true"]{border-color:#bd7b25;background:#fff8ed}
.unknown-word{
  display:inline-block;
  padding:.08rem .28rem;
  border-radius:5px;
  background:#f1f5f6;
  color:#315263;
  font-family:inherit;
  font-size:.9em;
  font-weight:850;
}
.table-answer-input{
  width:110px;
  min-height:40px;
  padding:.35rem .45rem;
  border:1px solid #afc2c7;
  border-radius:8px;
  background:#fff;
  color:#18364c;
  text-align:center;
  font-weight:850;
}
.speed-table td{min-width:120px}
@media(max-width:680px){
  .magnitude-choices{grid-template-columns:1fr}
}


/* ===== Proportionnalité 4e V1.2 : fractions et conversion des durées ===== */
.math-fraction{
  display:inline-grid;
  grid-template-rows:auto auto;
  align-items:center;
  justify-items:center;
  min-width:1.75em;
  margin:0 .12em;
  vertical-align:middle;
  font-family:"Cambria Math",Cambria,Georgia,serif;
  line-height:1.05;
}
.math-fraction-num{
  display:block;
  width:100%;
  padding:0 .18em .08em;
  border-bottom:1.6px solid currentColor;
  text-align:center;
}
.math-fraction-den{
  display:block;
  width:100%;
  padding:.08em .18em 0;
  text-align:center;
}
.formula-line{
  display:inline-flex;
  align-items:center;
  gap:.16em;
  flex-wrap:wrap;
  font-family:"Cambria Math",Cambria,Georgia,serif;
}
.formula-options .formula-line{font-size:1.06rem}
.duration-equation{display:flex;align-items:center;gap:.18rem;flex-wrap:wrap}
.duration-button{
  min-height:44px;
  padding:.65rem .85rem;
  border:1px solid #aebfc5;
  border-radius:10px;
  background:#f4f8f8;
  color:#234f5b;
  font-weight:850;
}
.duration-button:hover{background:#eaf3f2}
.duration-converter{display:grid;gap:.9rem}
.duration-tool-card{
  padding:.9rem;
  border:1px solid #d7e2e2;
  border-radius:13px;
  background:#fbfdfc;
}
.duration-tool-card h3{margin:0 0 .75rem;color:#18364c;font-size:1rem}
.duration-input-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.duration-input-row label,.duration-single{display:grid;gap:.3rem;color:#315263;font-size:.84rem;font-weight:800}
.duration-input-row input,.duration-single input{
  min-height:42px;padding:.5rem .6rem;border:1px solid #afc2c7;border-radius:8px;background:#fff;color:#18364c;font-weight:800
}
.duration-calc-button{margin-top:.65rem}
.duration-result{
  min-height:2.2rem;margin-top:.65rem;padding:.55rem .65rem;border-radius:9px;background:#f1f7f5;color:#294f56;line-height:1.5
}
@media(max-width:520px){.duration-input-row{grid-template-columns:1fr}}


/* ===== Proportionnalité 4e V1.3 : solutions détaillées ===== */
.solution-prop-table{
  margin:.55rem 0;
  border-collapse:collapse;
  width:auto;
  max-width:100%;
}
.solution-prop-table th,
.solution-prop-table td{
  border:1px solid #b8cfd1;
  padding:.45rem .7rem;
  text-align:center;
}
.solution-prop-table th{
  background:#eef6f5;
  color:#173d4a;
  font-weight:800;
}
.solution-table-caption{
  margin:.35rem 0 .15rem;
}
.duration-result > div + div{
  margin-top:.25rem;
}