:root{--me-line:#dbe4ec;--me-text:#172033;--me-muted:#52677d;--me-green:#35c892;--me-blue:#5ca6ec}.math-dashboard,.math-menu,.math-engine-notice{max-width:1000px;margin:2rem auto;padding:2rem;color:#fff;background:#172033;border-radius:24px;font-family:system-ui,sans-serif}.math-eyebrow{letter-spacing:.12em;font-size:.75rem;font-weight:800;color:#258f6b}.math-dashboard h1,.math-menu h1{margin-top:0}.math-subject-grid,.math-lesson-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem}.math-subject-card,.math-lesson-card{min-height:155px;padding:1.25rem;border:1px solid #486691;border-radius:18px;background:#172554;color:#f8fafc;text-decoration:none;display:flex;flex-direction:column;gap:.55rem;transition:transform .2s}.math-subject-card:hover,.math-lesson-card:hover{transform:translateY(-4px)}.math-subject-icon{font-size:2rem}.math-subject-card small,.math-lesson-card small{color:#bfdbfe}.is-locked{opacity:.55}.math-back{display:inline-flex;align-items:center;justify-content:center;padding:.65rem .9rem;border-radius:999px;background:#fff;color:#22324a;text-decoration:none;font-weight:750;box-shadow:0 3px 12px rgba(26,48,74,.12);transition:transform .2s,box-shadow .2s}.math-back:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(26,48,74,.16)}.math-game{position:fixed;inset:0;z-index:99999;display:grid;grid-template-columns:30% 1fr 140px;min-height:100dvh;background:#fff;color:var(--me-text);font-family:system-ui,sans-serif}.math-narrator{padding:2rem;background:#f0f4f8;border-right:1px solid var(--me-line)}.math-toolbox{padding:2rem;background:#fff;display:flex;flex-direction:column;align-items:center;gap:.8rem}.math-toolbox button{width:54px;height:54px;padding:0;border:0;border-radius:15px;background:#f0f4f8;color:#263a54;font-weight:800;cursor:pointer;display:grid;place-items:center;position:relative;box-shadow:0 3px 10px rgba(26,48,74,.11);transition:transform .2s,box-shadow .2s}.math-toolbox button:hover:not(:disabled){transform:scale(1.1);box-shadow:0 6px 15px rgba(26,48,74,.16)}.math-toolbox button:disabled{opacity:.5;cursor:not-allowed}.math-toolbox svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}.math-toolbox button span{position:absolute;right:-5px;bottom:-4px;min-width:18px;padding:1px 4px;border-radius:999px;background:#263a54;color:#fff;font-size:.62rem}.math-primary,.math-audio{padding:.8rem 1rem;border:0;border-radius:10px;background:#35c892;color:#052e2b;font-weight:800;cursor:pointer;box-shadow:0 3px 10px rgba(26,48,74,.12)}.math-arena{padding:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background:#fff}.math-equation{font-size:clamp(2rem,7vw,4rem);font-weight:900;display:flex;align-items:center;gap:.4rem}.math-equation input{width:1.5em;padding:.08em;border:0;border-bottom:2px solid #9fb0c2;background:transparent;color:var(--me-text);font:inherit;text-align:center;outline:none}.math-equation input:focus{border-bottom-color:var(--me-green)}.math-target,.math-feedback{min-height:1.5em;text-align:center;color:var(--me-muted)}.math-place-value{display:grid;grid-template-columns:1fr 1fr;gap:1rem;width:min(600px,100%)}.math-place-value>div{min-height:250px;padding:1rem;border:0;border-radius:18px;background:#f7fafc;text-align:center;display:flex;flex-direction:column;gap:1rem}.math-dots,.math-subtraction-dots{display:flex;flex-wrap:wrap;justify-content:center;align-content:flex-start;gap:.5rem;flex:1}.math-dot{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:.7rem;font-weight:800}.math-dot.tens{background:var(--me-green);color:#052e2b}.math-dot.ones{background:var(--me-blue);color:#082f49}.math-subtraction-dots{width:min(620px,100%);min-height:290px;padding:1.5rem;border-radius:24px;background:#f7fafc;gap:clamp(.35rem,1vw,.7rem);overflow:hidden}.subtraction-dot{width:calc(52px * var(--dot-scale,1));height:calc(52px * var(--dot-scale,1));font-size:calc(2.2rem * var(--dot-scale,1));background:var(--me-blue);color:#fff;transition:width .18s,height .18s,font-size .18s}.math-dot.is-adding{animation:math-pop .24s ease-out}.math-dot.is-blasting{animation:math-blast .34s ease-out forwards;pointer-events:none}@keyframes math-pop{0%{transform:scale(.35);opacity:0}70%{transform:scale(1.18);opacity:1}100%{transform:scale(1)}}@keyframes math-blast{0%{transform:scale(1) rotate(0);opacity:1}28%{transform:scale(1.45) rotate(-10deg);opacity:1}55%{transform:scale(1.2) rotate(12deg);opacity:.85}100%{transform:scale(.2) rotate(-18deg);opacity:0}}@media(max-width:760px){.math-game{position:relative;grid-template-columns:1fr;min-height:100dvh}.math-narrator{border-right:0;padding:1rem}.math-toolbox{padding:1rem;flex-direction:row;flex-wrap:wrap;justify-content:center}.math-arena{padding:1.25rem}.math-place-value>div{min-height:180px}.math-subtraction-dots{min-height:220px}}


/* Shared 3D glossy token system */
.fc-3d-dot-token{position:relative;width:72px;aspect-ratio:1;border:0;border-radius:50%;cursor:pointer;isolation:isolate;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;outline:0;background:radial-gradient(circle at 32% 30%,var(--dot-light,#7dd3fc) 0%,var(--dot-mid,#3b82f6) 42%,var(--dot-deep,#1d4ed8) 72%,var(--dot-edge,#153ea8) 100%);box-shadow:0 16px 26px rgba(0,0,0,.34),0 4px 8px rgba(59,130,246,.2),inset 0 3px 5px rgba(255,255,255,.38),inset 0 -8px 12px rgba(0,0,0,.35),inset -6px -10px 14px rgba(0,0,0,.12);transition:transform .18s cubic-bezier(.34,1.56,.64,1),box-shadow .18s ease,filter .18s ease}.fc-3d-dot-token::before{content:"";position:absolute;top:10px;left:13px;width:26px;height:15px;border-radius:50%;transform:rotate(-28deg);background:linear-gradient(to bottom,rgba(255,255,255,.82),rgba(255,255,255,.08));filter:blur(.5px);pointer-events:none}.fc-3d-dot-token::after{content:"";position:absolute;inset:7px;border-radius:50%;background:radial-gradient(circle at 38% 34%,rgba(255,255,255,.18),transparent 48%,rgba(255,255,255,.03) 72%,transparent 74%);pointer-events:none;mix-blend-mode:screen}.fc-3d-dot-token:hover{transform:translate3d(0,-4px,0) scale(1.08);filter:saturate(1.08)}.fc-3d-dot-token:active{transform:translate3d(0,2px,0) scale(.95)}.fc-3d-dot-token:focus-visible{outline:3px solid rgba(125,211,252,.7);outline-offset:6px}(prefers-reduced-motion:reduce){.fc-3d-dot-token{transition:box-shadow .18s ease,filter .18s ease}.fc-3d-dot-token:hover,.fc-3d-dot-token:active{transform:none}}

.fc-3d-dot-token{background:radial-gradient(circle at 32% 30%,var(--dot-light,#7dd3fc) 0%,var(--dot-mid,#3b82f6) 42%,var(--dot-deep,#1d4ed8) 72%,var(--dot-edge,#153ea8) 100%)!important}

@media (prefers-reduced-motion: reduce){.fc-3d-dot-token{transition:box-shadow .18s ease,filter .18s ease}.fc-3d-dot-token:hover,.fc-3d-dot-token:active{transform:none}}

/* Number Blocks: grid in Zone B, draggable block palette in Zone C. */
.nb-game{width:100%;height:100%;min-height:0;display:grid;place-items:center;padding:clamp(8px,2vw,28px);background:#fff;overflow:hidden}.nb-grid{--nb-cell:calc(min(74vw,72vh)/var(--nb-size));position:relative;width:calc(var(--nb-cell)*var(--nb-size));height:calc(var(--nb-cell)*var(--nb-size));max-width:100%;max-height:100%;border:1px solid #cfd5df;background-color:#fff;background-image:linear-gradient(to right,#dfe3ea 1px,transparent 1px),linear-gradient(to bottom,#dfe3ea 1px,transparent 1px);background-size:var(--nb-cell) var(--nb-cell);touch-action:none}.nb-block,.nb-preview{position:absolute;z-index:2;filter:drop-shadow(0 5px 4px rgba(34,27,48,.14));touch-action:none;cursor:grab;will-change:transform,left,top}.nb-cube{position:absolute;display:grid;width:var(--nb-cell);height:var(--nb-cell);place-items:center;border:2px solid rgba(45,30,42,.14);border-radius:max(5px,calc(var(--nb-cell)*.14));background:var(--nb-color);box-shadow:inset 0 calc(var(--nb-cell)*-.09) 0 rgba(54,18,28,.11),inset 0 2px 0 rgba(255,255,255,.55)}.nb-cube::after{content:"";width:25%;aspect-ratio:1;border-radius:50%;background:rgba(25,28,46,.84);box-shadow:inset 0 2px 3px rgba(0,0,0,.28),0 2px 0 rgba(255,255,255,.42)}.nb-block.is-dragging{z-index:20;opacity:.82;transform:scale(1.035)}.nb-drag-ghost{position:fixed!important;z-index:100005!important;pointer-events:none;opacity:.86;filter:drop-shadow(0 12px 9px rgba(34,27,48,.2))}.nb-block.is-invalid .nb-cube{outline:3px solid rgba(214,30,30,.7)}.math-toolbox:has(.nb-palette){padding:clamp(10px,2vh,22px) 8px;justify-content:center}.nb-palette{display:flex;flex-direction:column;align-items:center;justify-content:space-between;width:100%;height:min(78vh,680px);gap:5px}.math-toolbox .nb-source{position:relative;display:grid;width:100%;height:62px;min-height:52px;padding:0;flex:1 1 0;place-items:center;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;cursor:grab;overflow:visible}.math-toolbox .nb-source:hover:not(:disabled){transform:scale(1.04);box-shadow:none!important}.nb-preview{position:relative;pointer-events:none;cursor:inherit;filter:drop-shadow(0 3px 3px rgba(34,27,48,.14))}@media(max-width:1024px) and (orientation:landscape){.nb-grid{--nb-cell:calc(min(62vw,76svh)/var(--nb-size))}.nb-palette{height:min(78svh,520px)}.math-toolbox:has(.nb-palette){padding:6px}.math-toolbox .nb-source{min-height:34px;height:44px}}@media(max-width:760px){.nb-game{padding:8px}.nb-grid{--nb-cell:calc(min(86vw,60svh)/var(--nb-size))}.math-toolbox:has(.nb-palette){padding:6px}.nb-palette{flex-direction:row;width:min(94vw,560px);height:70px;gap:5px;overflow-x:auto}.math-toolbox .nb-source{width:62px;min-width:62px;height:64px;min-height:64px;flex:0 0 62px}}

/* Circle Group: floating countable circles in Zone B, optional finite tray below. */
.cg-game{position:relative;width:100%;height:100%;min-height:0;display:grid;grid-template-rows:minmax(0,1fr);background:#fff;overflow:hidden}.cg-game.has-tray{grid-template-rows:minmax(0,1fr) clamp(92px,19vh,165px)}.cg-groups{min-height:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));place-items:center;gap:clamp(8px,3vw,44px);padding:clamp(8px,3vh,28px)}.cg-group{--cg-bubble-size:190px;position:relative;width:min(var(--cg-bubble-size),100%);height:min(var(--cg-bubble-size),100%);min-width:160px;min-height:160px;display:grid;place-items:center}.cg-bubble,.cg-apple-area{position:absolute;left:50%;top:50%;width:var(--cg-bubble-size);height:var(--cg-bubble-size);max-width:100%;max-height:100%;transform:translate3d(-50%,-50%,0);transition:width .45s ease,height .45s ease;animation:cg-float 3s ease-in-out infinite}.cg-bubble{z-index:2;pointer-events:none}.cg-bubble svg{width:100%;height:100%;overflow:visible}.cg-bubble circle{fill:none;stroke:#333;stroke-width:5;vector-effect:non-scaling-stroke;transform-origin:50% 50%;animation:cg-wobble 2s ease-in-out infinite}.cg-bubble.is-active circle{stroke:#ff4545}.cg-apple-area{z-index:1;pointer-events:none}.cg-count{position:absolute;z-index:4;top:calc(50% - min(var(--cg-bubble-size),100%)/2 - 28px);left:50%;transform:translateX(-50%);color:#159c70;font-size:clamp(20px,2.8vw,34px);font-weight:900}.cg-apple{position:absolute;z-index:3;padding:0;border:0;background:transparent;cursor:grab;filter:drop-shadow(2px 4px 6px rgba(0,0,0,.2));touch-action:none;user-select:none;-webkit-user-select:none;transition:left .42s ease,top .42s ease,transform .18s ease}.cg-apple svg{display:block;width:100%;height:100%;pointer-events:none}.cg-apple.is-dragging{opacity:.2}.cg-drag-ghost{position:fixed!important;z-index:100006!important;pointer-events:none;opacity:.94;transition:none!important;filter:drop-shadow(0 13px 10px rgba(34,27,48,.22))}.cg-tray{display:grid;grid-template-columns:repeat(auto-fit,minmax(44px,64px));place-content:center;gap:clamp(4px,1vw,12px);min-height:0;padding:8px 5vw 12px;border-top:1px solid #edf0f4;background:linear-gradient(180deg,#fff,#f9fbff)}.cg-tray .cg-apple{position:relative!important;left:auto!important;top:auto!important;width:clamp(40px,6vw,68px)!important;height:clamp(40px,6vw,68px)!important;transform:none!important}.math-toolbox:has(.cg-tool-source){justify-content:center;padding:12px}.cg-tool-source{display:grid;width:100%;height:100%;place-items:center}.math-toolbox .cg-tool-source .cg-apple{position:relative;left:auto;top:auto;width:clamp(48px,6vw,76px);height:clamp(48px,6vw,76px);transform:none!important;background:transparent!important;box-shadow:none!important;border-radius:0!important}.math-toolbox .cg-tool-source .cg-apple:hover:not(:disabled){transform:translate3d(0,-4px,0) scale(1.08)!important;box-shadow:none!important}@keyframes cg-float{0%,100%{transform:translate3d(-50%,-50%,0)}50%{transform:translate3d(-50%,calc(-50% - 9px),0)}}@keyframes cg-wobble{0%,100%{transform:scale(1) rotate(0)}25%{transform:scale(1.015,.985) rotate(1deg)}50%{transform:scale(.985,1.015) rotate(-1deg)}75%{transform:scale(1.01,.99) rotate(.5deg)}}@media(max-width:1024px) and (orientation:landscape){.cg-game.has-tray{grid-template-rows:minmax(0,1fr) min(25svh,120px)}.cg-groups{grid-template-columns:repeat(var(--cg-columns,auto-fit),minmax(150px,1fr));padding:4px;gap:8px}.cg-group{min-width:145px;min-height:145px}.cg-tray{padding:4px 3vw 8px}.cg-count{top:1px}}@media(max-width:760px){.cg-game.has-tray{grid-template-rows:minmax(0,1fr) 112px}.cg-groups{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:5px;padding:5px}.cg-group{min-width:140px;min-height:140px}.cg-count{top:0}.cg-tray{grid-template-columns:repeat(auto-fit,46px);gap:5px;padding:6px 12px}}

/* Ten Frame Group: faded reference frame plus an interactive matching frame. */
.tfg-game{width:100%;height:100%;min-height:0;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;overflow:hidden;background:#fff}.tfg-game.has-tray{grid-template-rows:minmax(0,1fr) clamp(86px,17vh,145px)}.tfg-frames{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(20px,4vh,50px);min-height:0;padding:10px}.tfg-frame-wrap{position:relative;display:inline-block}.tfg-reference-wrap{opacity:.62;transform:scale(.84);transform-origin:center;filter:grayscale(.2);animation:tfg-float 4s ease-in-out infinite}.tfg-reference-wrap::after{content:"";position:absolute;left:12%;right:12%;bottom:-18px;height:12px;border-radius:50%;background:rgba(0,0,0,.1);filter:blur(7px)}.tfg-frame{--tfg-cell:clamp(42px,min(7vw,7.4vh),82px);display:grid;grid-template-columns:repeat(5,var(--tfg-cell));grid-template-rows:repeat(2,var(--tfg-cell));gap:1px;padding:1px;border:1px solid #555;background:#555}.tfg-cell{position:relative;display:grid;width:var(--tfg-cell);height:var(--tfg-cell);place-items:center;background:#fff}.tfg-target-frame .tfg-cell.is-over{background:#fff5f5;box-shadow:inset 0 0 0 2px #ff7070}.tfg-apple-in-cell{width:74%;height:74%;pointer-events:none;animation:tfg-pop .2s ease-out}.tfg-apple-in-cell svg,.tfg-apple svg{display:block;width:100%;height:100%;filter:drop-shadow(1px 2px 2px rgba(0,0,0,.15))}.tfg-apple{padding:0;border:0;background:transparent;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;filter:drop-shadow(2px 4px 5px rgba(0,0,0,.22))}.tfg-apple.is-dragging{opacity:.3}.tfg-drag-ghost{position:fixed!important;z-index:100006!important;pointer-events:none;opacity:.95;transition:none!important;filter:drop-shadow(4px 7px 7px rgba(0,0,0,.3))}.tfg-tray{display:grid;grid-template-columns:repeat(auto-fit,minmax(44px,66px));place-content:center;gap:clamp(4px,1vw,12px);width:100%;min-height:0;padding:8px 4vw 12px;border-top:1px solid #edf0f4;background:linear-gradient(180deg,#fff,#f9fbff)}.tfg-tray .tfg-apple{width:clamp(40px,6vw,66px);height:clamp(40px,6vw,66px)}.math-toolbox:has(.tfg-tool-source){justify-content:center;padding:12px}.tfg-tool-source{display:grid;width:100%;height:100%;place-items:center}.math-toolbox .tfg-tool-source .tfg-apple{width:clamp(48px,6vw,78px);height:clamp(48px,6vw,78px);background:transparent!important;box-shadow:none!important;border-radius:0!important}.math-toolbox .tfg-tool-source .tfg-apple:hover:not(:disabled){transform:translate3d(0,-4px,0) scale(1.08);box-shadow:none!important}@keyframes tfg-float{0%,100%{transform:scale(.84) translateY(0)}50%{transform:scale(.84) translateY(-7px)}}@keyframes tfg-pop{from{transform:scale(.55);opacity:.2}to{transform:scale(1);opacity:1}}@media(max-width:1024px) and (orientation:landscape){.tfg-game.has-tray{grid-template-rows:minmax(0,1fr) min(24svh,110px)}.tfg-frames{flex-direction:row;gap:clamp(14px,5vw,55px)}.tfg-frame{--tfg-cell:clamp(28px,min(6.2vw,7.2vh),66px)}.tfg-reference-wrap{transform:scale(.78)}.tfg-reference-wrap{animation-name:tfg-float-landscape}@keyframes tfg-float-landscape{0%,100%{transform:scale(.78) translateY(0)}50%{transform:scale(.78) translateY(-6px)}}.tfg-tray{padding:4px 3vw 8px}}@media(max-width:760px){.tfg-game.has-tray{grid-template-rows:minmax(0,1fr) 105px}.tfg-frames{gap:18px}.tfg-frame{--tfg-cell:clamp(30px,10vw,56px)}.tfg-tray{grid-template-columns:repeat(auto-fit,44px);gap:5px;padding:6px 10px}}

/* Keep all nine Number Blocks distinct on phone and tablet landscape. */
@media(max-width:1024px) and (orientation:landscape){.math-toolbox:has(.nb-palette){padding:4px}.nb-palette{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(5,minmax(0,1fr));height:min(78svh,520px);gap:2px}.math-toolbox .nb-source{width:100%;min-height:0;height:auto}.math-toolbox .nb-source:nth-child(9){grid-column:1 / span 2}}

/* Nine palette slots are always a true 3 by 3 grid on touch screens. */
@media(max-width:1024px){.math-toolbox:has(.nb-palette){overflow:hidden;padding:4px}.nb-palette{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:repeat(3,minmax(0,1fr))!important;width:100%!important;height:100%!important;min-height:0!important;gap:2px!important;overflow:hidden!important}.math-toolbox .nb-source,.math-toolbox .nb-source:nth-child(9){grid-column:auto!important;width:100%!important;min-width:0!important;height:auto!important;min-height:0!important;flex:none!important}.math-toolbox .nb-source .nb-preview{transform:scale(.64);transform-origin:center}}

/* Number Blocks receives a dedicated, wider Zone C: nine clear vertical choices. */
.math-game:has(.math-toolbox.nb-toolbox){grid-template-columns:30% minmax(0,1fr) clamp(210px,16vw,280px)}.math-toolbox.nb-toolbox{padding:clamp(10px,2vh,22px) 12px;overflow:hidden}.math-toolbox.nb-toolbox .nb-palette{display:flex!important;flex-direction:column!important;align-items:center;justify-content:space-between;width:100%!important;height:min(82vh,760px)!important;min-height:0!important;gap:2px!important;overflow:hidden!important}.math-toolbox.nb-toolbox .nb-source,.math-toolbox.nb-toolbox .nb-source:nth-child(9){display:grid!important;grid-column:auto!important;width:100%!important;min-width:0!important;height:auto!important;min-height:42px!important;flex:1 1 0!important;place-items:center}.math-toolbox.nb-toolbox .nb-source .nb-preview{transform:scale(1)!important;transform-origin:center}@media(max-width:1024px) and (orientation:landscape){.math-game:has(.math-toolbox.nb-toolbox){grid-template-columns:30% minmax(0,1fr) clamp(155px,20vw,210px)}.math-toolbox.nb-toolbox{padding:5px}.math-toolbox.nb-toolbox .nb-palette{height:calc(100svh - 12px)!important}.math-toolbox.nb-toolbox .nb-source{min-height:28px!important}.math-toolbox.nb-toolbox .nb-source .nb-preview{transform:scale(.72)!important}}@media(max-width:760px) and (orientation:portrait){.math-game:has(.math-toolbox.nb-toolbox){grid-template-columns:1fr}.math-toolbox.nb-toolbox .nb-palette{display:grid!important;grid-template-columns:repeat(9,minmax(58px,1fr))!important;grid-template-rows:1fr!important;width:100%!important;height:72px!important;overflow-x:auto!important}.math-toolbox.nb-toolbox .nb-source{min-width:58px!important;height:64px!important;min-height:64px!important;flex:none!important}.math-toolbox.nb-toolbox .nb-source .nb-preview{transform:scale(.78)!important}}

/* Circle Group polish: totals sit above, apples stay clean and fully visible. */
.cg-count{top:-42px!important}.cg-apple,.cg-apple svg,.math-toolbox .cg-tool-source .cg-apple,.math-toolbox .cg-tool-source .cg-apple svg{filter:none!important;box-shadow:none!important;outline:0!important}.math-toolbox .cg-tool-source .cg-apple svg{stroke:none!important}.cg-game.has-tray{grid-template-rows:minmax(0,1fr) clamp(130px,24vh,205px)}.cg-tray{align-content:center;overflow:visible;padding:12px 5vw 16px}.cg-tray .cg-apple{width:clamp(38px,5.2vw,62px)!important;height:clamp(38px,5.2vw,62px)!important}@media(max-width:1024px) and (orientation:landscape){.cg-game.has-tray{grid-template-rows:minmax(0,1fr) min(32svh,145px)}.cg-tray{padding:8px 3vw 12px}.cg-count{top:-30px!important}}

/* Circle Group canvas: 20% score reserve, 60% circles, 20% objects. */
.cg-game,.cg-game.has-tray{grid-template-rows:20% 60% 20%!important}.cg-score-slot,.cg-bottom-slot{min-height:0;background:#fff}.cg-groups{height:100%;min-height:0;grid-template-columns:repeat(auto-fit,minmax(0,1fr));align-items:stretch;justify-items:stretch;gap:clamp(10px,4vw,72px);padding:4px clamp(14px,5vw,80px)}.cg-group{width:100%;height:100%;min-width:0;min-height:0;padding-top:38px;overflow:visible}.cg-count{top:0!important;left:50%;transform:translateX(-50%);white-space:nowrap}.cg-bubble,.cg-apple-area{max-width:none!important;max-height:none!important}.cg-apple-area .cg-apple{transform:translate3d(-50%,-50%,0);filter:none!important;box-shadow:none!important}.cg-tray{height:100%;min-height:0;align-content:center;overflow:hidden;background:#fff!important;border-top:0!important;padding:5px clamp(12px,4vw,65px)!important}.cg-tray .cg-apple{background:transparent!important;filter:none!important;box-shadow:none!important}@media(max-width:1024px) and (orientation:landscape){.cg-game,.cg-game.has-tray{grid-template-rows:20% 60% 20%!important}.cg-groups{gap:12px;padding:2px 14px}.cg-group{padding-top:26px}.cg-count{font-size:clamp(16px,3vw,26px)}}

/* Count labels use the reserved score band and the object tray fits its exact item count. */
.cg-score-slot{display:grid;align-items:end;justify-items:center;gap:clamp(10px,4vw,72px);padding:0 clamp(14px,5vw,80px) 8px}.cg-score-count{color:#159c70;font-size:clamp(20px,2.8vw,34px);font-weight:900;line-height:1}.cg-group .cg-count{display:none!important}.cg-tray{display:grid;grid-template-columns:repeat(var(--cg-tray-count,1),minmax(0,1fr));grid-template-rows:1fr;align-items:center;justify-items:center;gap:clamp(3px,1vw,10px)!important}.cg-tray .cg-apple{width:min(100%,62px)!important;height:auto!important;aspect-ratio:1;max-height:calc(20vh - 16px);background:transparent!important;overflow:visible!important}.cg-tray .cg-apple svg{width:100%;height:100%;display:block}@media(max-width:1024px) and (orientation:landscape){.cg-score-slot{padding:0 14px 4px}.cg-score-count{font-size:clamp(16px,3vw,26px)}.cg-tray .cg-apple{max-height:calc(20svh - 10px)}}

/* Adaptive Zone B allocation, driven by showScoreboard and showObjectTray. */
.cg-game:not(.has-score):not(.has-tray){grid-template-rows:10% 90% 0!important}.cg-game:not(.has-score).has-tray{grid-template-rows:0 80% 20%!important}.cg-game.has-score:not(.has-tray){grid-template-rows:20% 80% 0!important}.cg-game.has-score.has-tray{grid-template-rows:20% 60% 20%!important}.cg-game:not(.has-score) .cg-score-slot{display:none}.cg-game:not(.has-score) .cg-group .cg-count{display:block!important;top:0!important;left:50%;transform:translateX(-50%);z-index:5}.cg-game:not(.has-score) .cg-group{padding-top:34px}.cg-game:not(.has-score) .cg-bubble,.cg-game:not(.has-score) .cg-apple-area{top:calc(50% + 14px)}@media(max-width:1024px) and (orientation:landscape){.cg-game:not(.has-score) .cg-group{padding-top:26px}.cg-game:not(.has-score) .cg-bubble,.cg-game:not(.has-score) .cg-apple-area{top:calc(50% + 10px)}}

/* Flat glossy shared token override */
.fc-3d-dot-token{--dot-light:#60a5fa;--dot-mid:#3b82f6;--dot-deep:#2563eb;--token-size:56px;position:relative!important;width:var(--token-size)!important;height:var(--token-size)!important;min-width:var(--token-size)!important;aspect-ratio:1!important;border:0!important;border-radius:50%!important;display:flex!important;align-items:center!important;justify-content:center!important;flex-shrink:0!important;line-height:1!important;overflow:hidden!important;user-select:none!important;-webkit-user-select:none!important;-webkit-tap-highlight-color:transparent!important;background:linear-gradient(160deg,var(--dot-light),var(--dot-mid) 55%,var(--dot-deep))!important;box-shadow:0 6px 12px color-mix(in srgb,var(--dot-deep) 32%,transparent),inset 0 1px 2px rgba(255,255,255,.35)!important}.fc-3d-dot-token::before,.fc-3d-dot-token::after{display:none!important}.fc-3d-dot-token.value-1,.fc-3d-dot-token.one-dot{--dot-light:#6ee7b7;--dot-mid:#36b37e;--dot-deep:#16865a}.fc-3d-dot-token.value-2,.fc-3d-dot-token.ten-chip{--dot-light:#fca5a5;--dot-mid:#ef5350;--dot-deep:#b91c1c}.fc-3d-dot-token.value-3{--dot-light:#fcd34d;--dot-mid:#f59e0b;--dot-deep:#b45309}.fc-3d-dot-token.value-4{--dot-light:#93c5fd;--dot-mid:#3b82f6;--dot-deep:#1d4ed8}.fc-3d-dot-token.value-5{--dot-light:#c4b5fd;--dot-mid:#8b5cf6;--dot-deep:#5b21b6}
/* Keep the empty score grid cell in place: hiding it shifted circles into row zero. */
.cg-game:not(.has-score) .cg-score-slot{display:grid!important;visibility:hidden!important;padding:0!important}

/* Ten Frame Group follows the same clean vertical activity layout as Circle Group. */
.tfg-frames{flex-direction:column!important;gap:clamp(16px,3vh,34px)!important}.tfg-apple,.tfg-apple svg,.tfg-apple-in-cell,.tfg-apple-in-cell svg{filter:none!important;box-shadow:none!important}.tfg-frame{--tfg-cell:clamp(30px,min(5.4vw,5.4vh),58px)}@media(max-width:1024px) and (orientation:landscape){.tfg-frames{flex-direction:column!important;gap:clamp(8px,2svh,18px)!important}.tfg-frame{--tfg-cell:clamp(20px,min(4.8vw,4.8svh),44px)}.tfg-reference-wrap{transform:scale(.82)!important;animation-name:tfg-float!important}}

/* Large, child-readable ten frames while remaining stacked vertically. */
.tfg-frame{--tfg-cell:clamp(48px,min(7.8vw,7.8vh),78px)!important}.tfg-reference-wrap{transform:scale(.92)!important}@media(max-width:1024px) and (orientation:landscape){.tfg-frames{gap:clamp(10px,2.4svh,24px)!important}.tfg-frame{--tfg-cell:clamp(40px,min(8.2vw,8.2svh),72px)!important}.tfg-reference-wrap{transform:scale(.9)!important}}

/* Ten-frame tray sits directly on Zone B, with apples held 10px above its bottom. */
.tfg-tray{background:#fff!important;border-top:0!important;align-content:end!important;align-items:end!important;padding:6px 4vw 10px!important}.tfg-tray .tfg-apple{background:transparent!important;box-shadow:none!important}.tfg-frame{--tfg-cell:clamp(56px,min(8.8vw,8.8vh),88px)!important}@media(max-width:1024px) and (orientation:landscape){.tfg-frame{--tfg-cell:clamp(46px,min(9vw,9svh),78px)!important}.tfg-frames{gap:clamp(8px,2svh,20px)!important}}

/* Use the lower tray edge, leaving the activity area for larger frames. */
.tfg-tray{display:flex!important;align-items:flex-end!important;justify-content:center!important;gap:clamp(8px,2vw,22px)!important;padding:4px 4vw 10px!important}.tfg-tray .tfg-apple{flex:0 1 clamp(48px,7vw,76px);align-self:flex-end!important}.tfg-frame{--tfg-cell:clamp(62px,min(9.8vw,9.8vh),96px)!important}@media(max-width:1024px) and (orientation:landscape){.tfg-frame{--tfg-cell:clamp(50px,min(10.4vw,10.4svh),88px)!important}.tfg-reference-wrap{transform:scale(.9)!important}}

/* Clean grid trays for draggable Zone B objects. */
.cg-tray,.tfg-tray{display:grid!important;grid-template-columns:repeat(var(--cg-tray-columns,var(--tfg-tray-columns,1)),clamp(44px,7vw,82px))!important;grid-auto-rows:clamp(44px,7vw,82px);width:max-content;max-width:94%;align-content:end!important;justify-content:center!important;gap:0!important;padding:0!important;background:transparent!important;border:1px solid #dfe3ea!important;overflow:visible!important}.cg-tray{align-self:end;justify-self:center;margin-bottom:10px}.tfg-tray{align-self:end;justify-self:center;margin-bottom:10px}.cg-tray-cell,.tfg-tray-cell{display:grid;place-items:center;min-width:0;min-height:0;border:1px solid #dfe3ea;background:#fff}.cg-tray .cg-apple,.tfg-tray .tfg-apple{position:relative!important;left:auto!important;top:auto!important;width:76%!important;height:76%!important;min-width:0!important;max-height:none!important;aspect-ratio:1;transform:none!important;filter:none!important;box-shadow:none!important}.cg-tray .cg-apple svg,.tfg-tray .tfg-apple svg{width:100%;height:100%;display:block}@media(max-width:1024px) and (orientation:landscape){.cg-tray,.tfg-tray{grid-template-columns:repeat(var(--cg-tray-columns,var(--tfg-tray-columns,1)),clamp(32px,7vw,62px))!important;grid-auto-rows:clamp(32px,7vw,62px)}}

/* One clean responsive row, visually part of Zone B rather than a separate card. */
.cg-tray,.tfg-tray{grid-template-columns:repeat(var(--cg-tray-columns,var(--tfg-tray-columns,1)),minmax(0,1fr))!important;grid-auto-rows:clamp(42px,6vw,72px);width:min(94%,calc(var(--cg-tray-columns,var(--tfg-tray-columns,1))*72px));max-width:94%;border:0!important;background:transparent!important}.cg-tray-cell,.tfg-tray-cell{border:1px solid #dfe3ea;background:transparent!important}.cg-tray .cg-apple,.tfg-tray .tfg-apple{width:72%!important;height:72%!important}@media(max-width:1024px) and (orientation:landscape){.cg-tray,.tfg-tray{grid-auto-rows:clamp(30px,5.8vw,56px);width:min(94%,calc(var(--cg-tray-columns,var(--tfg-tray-columns,1))*56px))}}

/* Circle Group Mode 1: lightning beam and a soft two-circle reveal. */
.math-toolbox button[data-tool="split"]{color:#f5b300;background:#fff7d6}.cg-split-lightning{position:absolute;z-index:20;height:8px;transform-origin:0 50%;pointer-events:none;border-radius:999px;background:linear-gradient(90deg,#fff6a5,#ffc400 35%,#fff 54%,#ffc400 72%,#fff6a5);box-shadow:0 0 8px #ffdb45,0 0 20px rgba(255,196,0,.9);animation:cg-lightning .48s ease-out forwards}.cg-game.is-split-revealed .cg-group{animation:cg-split-pop .58s cubic-bezier(.2,1.35,.3,1) both}@keyframes cg-lightning{0%{opacity:0;transform:rotate(var(--cg-beam-angle,0deg)) scaleX(0)}28%{opacity:1;transform:rotate(var(--cg-beam-angle,0deg)) scaleX(1)}100%{opacity:0;transform:rotate(var(--cg-beam-angle,0deg)) scaleX(1)}}@keyframes cg-split-pop{0%{opacity:0;transform:scale(.65)}65%{opacity:1;transform:scale(1.06)}100%{opacity:1;transform:scale(1)}}
.cg-bubble circle{fill:rgba(61,157,255,.5)!important}
.cg-bubble circle{stroke:#062f62!important}.cg-apple-area{z-index:3!important}.cg-apple-area .cg-apple{position:absolute;z-index:1!important}
.cg-groups{grid-template-columns:repeat(var(--cg-columns,1),minmax(0,1fr))!important;grid-template-rows:repeat(var(--cg-rows,1),minmax(0,1fr))!important}
/* Circle Group — soft premium bubble treatment. */
.cg-bubble{box-sizing:border-box;overflow:hidden;border:4px solid #0a3768;border-radius:50%;background:radial-gradient(circle at 31% 24%,rgba(255,255,255,.98) 0 8%,rgba(226,246,255,.92) 30%,rgba(171,221,248,.55) 72%,rgba(116,192,235,.45) 100%);box-shadow:inset 0 2px 0 rgba(255,255,255,.95),inset 0 -12px 22px rgba(24,118,179,.15),0 10px 20px rgba(8,48,93,.14)!important}.cg-bubble::after{content:"";position:absolute;inset:10% 16% 53% 18%;border-radius:50%;background:radial-gradient(ellipse,rgba(255,255,255,.82),rgba(255,255,255,0) 72%);pointer-events:none}.cg-bubble svg{display:none!important}.cg-bubble.is-active{border-color:#1469b8;box-shadow:inset 0 2px 0 rgba(255,255,255,.95),inset 0 -12px 22px rgba(24,118,179,.16),0 0 0 7px rgba(74,169,236,.18),0 14px 25px rgba(8,48,93,.18)!important}.cg-game:not(.has-score) .cg-group .cg-count{display:grid!important;place-items:center;min-width:38px;height:38px;padding:0 10px;border:2px solid #0a3768;border-radius:999px;background:#fff;color:#0a3768;box-shadow:0 5px 10px rgba(8,48,93,.13);font-size:clamp(16px,2vw,22px)!important;line-height:1}
.cg-group.is-splitting-source .cg-bubble{animation:cg-source-split .44s cubic-bezier(.2,.8,.25,1) both!important}.cg-game.is-split-revealed .cg-group{animation:cg-bubble-arrive .6s cubic-bezier(.16,1.25,.3,1) both!important;animation-delay:calc(var(--cg-split-order,0) * 42ms)!important}@keyframes cg-source-split{0%{transform:translate3d(-50%,-50%,0) scale(1)}36%{transform:translate3d(-50%,-50%,0) scale(.86,.98);filter:brightness(1)}66%{transform:translate3d(-50%,-50%,0) scale(1.08,.92);filter:brightness(1.35)}100%{transform:translate3d(-50%,-50%,0) scale(.24);opacity:0}}@keyframes cg-bubble-arrive{0%{opacity:0;transform:scale(.2)}65%{opacity:1;transform:scale(1.07)}100%{opacity:1;transform:scale(1)}}
.cg-game.mode-split .cg-groups{display:block!important;position:relative;padding:0!important;overflow:hidden}.cg-game.mode-split .cg-group{position:absolute!important;min-width:0!important;min-height:0!important;padding:0!important;overflow:visible}.cg-game.mode-split .cg-bubble,.cg-game.mode-split .cg-apple-area{top:50%!important}.cg-game.mode-split .cg-apple-area{pointer-events:none}
.cg-bubble{animation:none!important}.cg-bubble circle{animation:none!important}
.cg-bubble{animation:cg-idle-giggle 2.15s ease-in-out infinite!important}@keyframes cg-idle-giggle{0%,100%{transform:translate3d(-50%,-50%,0) rotate(0) scale(1)}18%{transform:translate3d(-50%,calc(-50% - 4px),0) rotate(-1.4deg) scale(1.015)}38%{transform:translate3d(-50%,calc(-50% + 1px),0) rotate(1.2deg) scale(.99)}58%{transform:translate3d(-50%,calc(-50% - 3px),0) rotate(-.9deg) scale(1.012)}78%{transform:translate3d(-50%,calc(-50% + 1px),0) rotate(.7deg) scale(.995)}}
.cg-split-lightning{height:24px!important;margin-top:-12px;border-radius:0!important;background:linear-gradient(90deg,#fffbd2 0%,#ffe148 24%,#ffb400 52%,#fff46b 76%,#fffde1 100%)!important;clip-path:polygon(0 42%,11% 6%,22% 44%,34% 0,46% 51%,58% 10%,70% 62%,82% 19%,100% 49%,87% 100%,75% 63%,62% 100%,50% 56%,38% 100%,27% 57%,15% 94%,8% 55%,0 82%);filter:drop-shadow(0 0 4px #fff07a) drop-shadow(0 0 11px #ffb300)!important}

/* Circle Group final visual layer: airy blurred ring, borderless objects, purple counting focus. */
.cg-bubble{overflow:visible!important;border:clamp(5px,.55vw,8px) solid #3a86ff!important;background:#fff!important;box-shadow:0 0 0 clamp(4px,.45vw,7px) rgba(58,134,255,.08),0 0 clamp(18px,2.2vw,34px) rgba(58,134,255,.2)!important}
.cg-bubble::after{display:none!important}
.cg-bubble.is-active{border-color:#3a86ff!important;box-shadow:0 0 0 clamp(5px,.55vw,9px) rgba(58,134,255,.12),0 0 clamp(22px,2.8vw,42px) rgba(58,134,255,.3)!important}
.cg-apple,.cg-apple:hover,.cg-apple:focus,.cg-apple:active,.cg-apple-area .cg-apple,.cg-tray .cg-apple,.math-toolbox .cg-tool-source .cg-apple{box-sizing:border-box!important;padding:0!important;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important}
.cg-apple>img,.cg-apple .math-global-apple{display:block!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:contain!important;pointer-events:none!important}
.cg-object-highlight{position:absolute;inset:0;z-index:8;width:100%;height:100%;overflow:visible;pointer-events:none}
.cg-object-highlight path{fill:rgba(204,51,204,.055)!important;stroke:#cc33cc!important;stroke-width:2.25!important;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 5px rgba(204,51,204,.2));transition:d .48s cubic-bezier(.22,1,.36,1)}
.cg-apple.is-counting{border:0!important;filter:drop-shadow(0 0 8px rgba(204,51,204,.72))!important}
.cg-apple-area{overflow:hidden!important;border-radius:50%!important;clip-path:circle(calc(50% - 10px) at 50% 50%);animation:none!important;transition:none!important}
.cg-bubble{animation:none!important}
.math-engine-app-document{width:100%;min-height:100dvh;margin:0;background:#040638;overflow-x:hidden}.math-engine-app-shell{width:100%;min-height:100dvh}