/* Use the figure's own width: on a small phone the lesson body can be 200 px. */
.ce2-calc-visual { container-type:inline-size; }
.ce2-calc-svg { display:block; width:100%; height:auto; max-width:500px; margin:0 auto; }
.ce2-calc-svg text { fill:var(--kg-2d4b3b); font-family:KahierNunito,Roboto,sans-serif; font-weight:800; }
.ce2-calc-svg .ce2-calc-sage { fill:var(--kg-dcebcf); stroke:var(--kg-67865c); stroke-width:1.4; }
.ce2-calc-svg .ce2-calc-coral { fill:var(--kg-f3d8c8); stroke:var(--kg-b37051); stroke-width:1.4; }
.ce2-calc-svg .ce2-calc-paper { fill:var(--kg-fffdf7); stroke:var(--kg-b4c5a7); stroke-width:1.4; }
.ce2-calc-svg .ce2-calc-pale { fill:var(--kg-f1f6e9); stroke:var(--kg-cbdcbd); stroke-width:1.4; }
.ce2-calc-svg .ce2-calc-warm { fill:var(--kg-fcf0e6); stroke:var(--kg-e3c7b5); stroke-width:1.4; }
.ce2-calc-svg .ce2-calc-line { fill:none; stroke:var(--kg-55764a); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.ce2-calc-svg text.ce2-calc-old { fill:var(--kg-73806d); }
.kh-learning .ce2-lesson .ce2-calc-visual .ce2-calc-equation { font:900 25px/1.5 KahierNunito,Roboto,sans-serif; text-align:center; color:var(--kt-365e42); margin:16px 0; overflow-wrap:anywhere; }
.ce2-calc-compact { display:none; }
.ce2-calc-written { position:relative; padding:12px 4px 12px 20px; margin:12px 0; border:1px solid var(--ks-cadcc0); border-radius:13px; background:var(--ks-fffdf7); }
.ce2-calc-written-head,.ce2-calc-written-row { display:grid; grid-template-columns:repeat(var(--ce2-calc-columns),minmax(0,1fr)); text-align:center; position:relative; gap:0; }
.ce2-calc-written-head { color:var(--kt-637f54); font:800 18px/1.6 KahierNunito,Roboto,sans-serif; margin-bottom:9px; }
.ce2-calc-written-row { font:900 29px/1.7 KahierNunito,Roboto,sans-serif; color:var(--kt-2d5038); }
.ce2-calc-written-carry { font-size:21px; line-height:1.4; color:var(--kt-9f583d); }
.ce2-calc-written-carry>span:not(:empty) { background:var(--ks-f8dfcb); border-radius:7px; margin:0 auto 6px; min-width:27px; }
.ce2-calc-written-old { font-size:23px; color:var(--kt-74836d); text-decoration:line-through; }
.ce2-calc-written-exchange { font-size:27px; background:var(--ks-fae5d3); border-radius:7px; }
.ce2-calc-written-result { border-top:2px solid var(--ks-52734a); margin-top:6px; padding-top:5px; }
.ce2-calc-operation-sign { position:absolute; top:0; left:-18px; color:var(--kt-48653e); }
.ce2-calc-packets { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin:15px 0; }
.ce2-calc-packet { min-width:0; border:1px solid var(--ks-bfceaf); border-radius:12px; padding:12px 5px; background:var(--ks-fffdf8); text-align:center; }
.ce2-calc-packet>strong { display:block; font:800 18px/1.4 KahierNunito,Roboto,sans-serif; color:var(--kt-3f5b36); margin:0 0 12px; }
.ce2-calc-chips { display:grid; grid-template-columns:repeat(4,15px); gap:4px; justify-content:center; min-height:31px; }
.ce2-calc-chip { display:block; width:15px; height:15px; border:1px solid var(--ks-547744); border-radius:50%; background:var(--ks-cfe1bf); }
.ce2-calc-chip-coral { border-color:var(--ks-a96548); background:var(--ks-edc4ad); }
.ce2-calc-bar { display:flex; width:100%; min-height:43px; margin:10px 0; border:1px solid var(--ks-6f8a5d); box-sizing:border-box; background:var(--ks-dcebcf); }
.ce2-calc-bar>span { display:grid; place-items:center; min-width:0; padding:5px 0; color:var(--kt-365236); font:900 22px/1.4 KahierNunito,Roboto,sans-serif; border-right:1px solid var(--ksk-6f8a5d); box-sizing:border-box; }
.ce2-calc-bar>span:last-child { border-right:0; }
.ce2-calc-bar .ce2-calc-part-coral { background:var(--ks-f3d5c2); }
.kh-learning .ce2-lesson .ce2-calc-visual .ce2-calc-label { font:800 18px/1.6 KahierNunito,Roboto,sans-serif; color:var(--kt-47633d); text-align:center; margin:18px 0 10px; }
.ce2-calc-flow { display:flex; flex-direction:column; align-items:center; gap:9px; margin:18px auto; }
.ce2-calc-flow>strong { display:grid; place-items:center; width:100%; max-width:170px; min-height:58px; padding:10px; border:1px solid var(--ks-a7c197); background:var(--ks-f0f7e8); border-radius:14px; color:var(--kt-30583c); font:900 30px/1.3 KahierNunito,Roboto,sans-serif; }
.ce2-calc-flow>span { font:800 23px/1.6 KahierNunito,Roboto,sans-serif; color:var(--kt-8e593d); }
.ce2-calc-operation-cards { display:grid; gap:10px; }
.kh-learning .ce2-lesson .ce2-calc-visual .ce2-calc-operation-cards>p { padding:14px 10px; margin:0; background:var(--ks-fffdf8); border:1px solid var(--ks-c8d9b9); border-radius:12px; font:800 22px/1.6 KahierNunito,Roboto,sans-serif; text-align:center; color:var(--kt-3b5d39); }
.ce2-calc-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.ce2-calc-choices>span { display:flex; align-items:center; justify-content:center; gap:3px; min-height:48px; padding:9px 3px; border:1px solid var(--ks-b6caab); border-radius:10px; background:var(--ks-fffdf8); color:var(--kt-385b3b); font:700 18px/1.4 KahierNunito,Roboto,sans-serif; white-space:nowrap; }
.ce2-calc-choices b { display:inline; font:inherit; }
@container(max-width:420px) {
  .ce2-calc-wide { display:none; }
  .ce2-calc-compact { display:block; }
  .kh-learning .ce2-lesson .ce2-calc-visual .ce2-calc-equation { font-size:22px; }
}
@container(max-width:185px) { .ce2-calc-packets { grid-template-columns:1fr; } }
/* A fallback for engines without container queries still chooses larger text. */
@supports not (container-type:inline-size) {
  @media(max-width:680px) { .ce2-calc-wide { display:none; } .ce2-calc-compact { display:block; } }
}
@media(prefers-reduced-motion:reduce) { .ce2-calc-visual * { transition:none !important; animation:none !important; } }
@media print { .ce2-calc-wide { display:block; } .ce2-calc-compact { display:none; } }
