.ce2-math-visual { min-width:0; margin:22px 0; padding:24px; border:1px solid var(--ksk-d3e2d6); border-radius:20px; background:var(--ksk-fffdf7); color:var(--ktk-294c3d); }
.kh-learning .ce2-lesson .ce2-math-visual h3 { margin:0 0 22px; font-size:24px; line-height:1.35; }
.ce2-math-visual svg { display:block; max-width:100%; height:auto; }
.ce2-math-visual figcaption { margin:20px 0 0; padding-top:16px; border-top:1px dashed var(--ksk-cdddcf); font-size:17px; line-height:1.75; }
.ce2-math-visual text { fill:var(--kgk-294c3d); font-family:KahierNunito,Roboto,sans-serif; font-weight:600; }
.ce2-number-visual svg circle,.ce2-number-bundles svg circle { fill:var(--kg-cf7558); stroke:var(--kg-a64f38); stroke-width:.6; }
.ce2-number-frame { fill:var(--kg-f4ede0); stroke:var(--kg-54745b); stroke-width:2; }
.ce2-number-ten-row { fill:var(--kg-e8eee0); stroke:var(--kg-8a9c7f); stroke-width:.5; }
.ce2-number-plate { fill:var(--kg-dce8d3); stroke:var(--kg-54745b); stroke-width:1.2; }
.ce2-number-token { display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:0; gap:12px; padding:15px 10px; border:1px solid var(--ks-dce6d7); border-radius:14px; background:var(--ks-ffffff); }
.ce2-number-token strong { font-size:16px; line-height:1.5; text-align:center; }
.ce2-number-token>small { font-size:14px; line-height:1.6; text-align:center; color:var(--kt-52644c); }
.kh-learning .ce2-lesson .ce2-number-legend { font-size:15px; line-height:1.7; }
.ce2-number-token-icons { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:7px; width:100%; }
.ce2-number-token-icons svg { width:75px; max-height:90px; }
.ce2-number-token-icons svg text { font-size:15px; }
.ce2-number-empty { padding:20px 0; color:var(--kt-677664); font-size:15px; }
.ce2-number-ranks,.ce2-number-hierarchy { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.ce2-number-hierarchy { margin-top:20px; }
.ce2-number-hierarchy .ce2-number-token-icons svg { width:130px; max-height:140px; }
.kh-learning .ce2-lesson .ce2-number-equation { margin:20px 0 0; text-align:center; font-weight:800; font-size:21px; line-height:1.6; }
.ce2-number-exchange { display:flex; justify-content:center; align-items:center; gap:20px; flex-wrap:wrap; }
.ce2-number-exchange>div:first-child { text-align:center; }
.ce2-number-ten-loose { display:grid; grid-template-columns:repeat(5,16px); gap:12px; margin:16px; }
.ce2-number-ten-loose span,.ce2-number-loose>span { width:14px; height:14px; border:1px solid var(--ks-a64f38); border-radius:50%; background:var(--ks-cf7558); }
.ce2-number-equals { font-size:36px; font-weight:800; }
.ce2-number-exchange .ce2-number-token-icons svg { width:130px; }
.ce2-number-packs { display:flex; flex-wrap:wrap; gap:12px; }
.ce2-number-pack { width:130px; max-width:100%; text-align:center; }
.ce2-number-pack svg { display:block; width:100%; height:auto; }
.ce2-number-pack small { font-size:14px; color:var(--kt-4f644c); }
.ce2-number-loose { display:flex; gap:12px; flex-wrap:wrap; margin:20px 0; }
.ce2-number-bundles { min-height:75px; }
.ce2-number-rank-chips { display:grid; gap:8px; margin-top:14px; }
.ce2-number-rank-chips span,.ce2-number-rank-chips mark { background:var(--ks-edf4e9); border-radius:8px; padding:8px; color:var(--kt-315b44); font-size:15px; }
.ce2-number-rank-chips mark { background:var(--ks-f9e4ce); border:2px solid var(--ks-b57146); }
.ce2-number-compare { display:grid; grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr); align-items:center; gap:10px; text-align:center; }
.ce2-number-compare>div>strong { font-size:27px; }
.ce2-number-compare>b { font-size:28px; }
.ce2-number-small-compare { display:grid; grid-template-columns:2fr 3fr; gap:14px; margin-top:20px; }
.ce2-number-small-compare svg { width:70px; }
.ce2-number-line { fill:none; stroke:var(--kg-426b52); stroke-width:3; }
.ce2-number-jump { fill:none; stroke:var(--kg-bd694d); stroke-width:2; }
.ce2-number-track { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:14px 0; }
.ce2-number-track>div { min-width:0; text-align:center; }
.ce2-number-track span { display:block; color:var(--kt-9b4c35); font-size:15px; margin-bottom:14px; }
.ce2-number-track i { display:block; position:relative; border-top:3px solid var(--ks-426b52); margin:10px 0 16px; }
.ce2-number-track i::after { content:''; display:block; position:absolute; width:3px; height:16px; background:var(--ks-426b52); top:-9px; left:50%; }
.ce2-number-track strong { font-size:17px; white-space:nowrap; }
.ce2-number-band-row { margin:18px 0; }
.ce2-number-band-row>strong { display:block; font-size:19px; margin-bottom:8px; }
.ce2-number-band { display:grid; grid-template-columns:repeat(var(--ce2-number-parts),minmax(0,1fr)); height:56px; border:2px solid var(--ks-527858); border-radius:8px; overflow:hidden; background:var(--ks-ffffff); }
.ce2-number-band span { border-right:1px solid var(--ksk-527858); }
.ce2-number-band span:last-child { border:0; }
.ce2-number-band .is-filled { background:var(--ks-a5c390); }
.ce2-number-length-key { max-width:44.444%; }
.ce2-number-length-row { display:grid; grid-template-columns:4fr 4fr 1fr; height:56px; margin-top:20px; }
.ce2-number-length-row span { display:grid; place-items:center; border:2px solid var(--ks-527858); background:var(--ks-dceacf); min-width:0; font-size:16px; font-weight:700; }
.ce2-number-length-row span+span { border-left:0; }
.ce2-number-length-row span:last-child { background:var(--ks-f1ddbd); }
.ce2-number-cake { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); border:2px solid var(--ks-54745b); border-radius:8px; overflow:hidden; }
.ce2-number-cake span { display:grid; place-items:center; min-height:68px; border-right:1px solid var(--ksk-54745b); font-size:14px; font-weight:700; }
.ce2-number-cake span:last-child { border:0; }
.ce2-number-cake .first { background:var(--ks-efd3bb); }
.ce2-number-cake .second { background:var(--ks-f7e6bf); }
.ce2-number-cake .left { background:var(--ks-dceacf); }
.ce2-number-key { padding-left:20px; }
.kh-learning .ce2-lesson .ce2-number-key li { font-size:15px; line-height:1.7; }
.ce2-unit-collection svg.ce2-base-ten-icon { width:100%; height:auto; min-height:25px; fill:none; stroke:none; }
.ce2-unit-collection .ce2-base-ten-icon circle { fill:var(--kg-cf7558); stroke:var(--kg-a64f38); stroke-width:.5; }
@media(max-width:680px) {
  .ce2-math-visual { padding:20px 16px; margin:18px 0; }
  .kh-learning .ce2-lesson .ce2-math-visual h3 { font-size:22px; }
  .ce2-math-visual figcaption { font-size:16px; }
  .ce2-number-ranks { grid-template-columns:1fr; }
  .ce2-number-ranks .ce2-number-token { flex-direction:column-reverse; }
  .ce2-number-ranks .ce2-number-token-icons svg { width:56px; max-height:70px; }
  .ce2-number-hierarchy { grid-template-columns:1fr; }
  .ce2-number-exchange { flex-direction:column; gap:8px; }
  .ce2-number-hierarchy .ce2-number-token { display:grid; grid-template-columns:90px minmax(0,1fr); }
  .ce2-number-hierarchy .ce2-number-token-icons { width:90px; }
  .ce2-number-hierarchy .ce2-number-token strong { text-align:left; }
  .ce2-number-hierarchy .ce2-number-token>small { grid-column:1/-1; }
  .ce2-number-small-compare { grid-template-columns:1fr; }
  .ce2-number-cake { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .ce2-number-cake span:nth-child(4) { border-right:0; }
  .ce2-number-cake span:nth-child(-n+4) { border-bottom:1px solid var(--ks-54745b); }
  .ce2-number-cake span { min-height:50px; }
  .ce2-number-length-row span { font-size:12px; }
  .ce2-number-track span { font-size:13px; }
  .ce2-number-track strong { font-size:15px; }
}
