.so-center,.so-reveal{place-items:center;display:grid;position:absolute;inset:0}.so-reveal{overflow-clip-margin:var(--sp-3);overflow:clip}.so-ball{z-index:1;aspect-ratio:200/236;height:min(94cqh,110cqw,34rem);position:relative}.so-ball__art{width:100%;height:100%;position:relative;overflow:visible}.so-ball__shadow{fill:var(--ink);opacity:.08}.so-ball__stand{fill:var(--ink)}.so-ball__rim{fill:none;stroke:var(--brand-strong);stroke-width:2px;opacity:.6}.so-ball__shine{fill:var(--bg);opacity:.5}.so-ball__sparks{fill:var(--sun)}.so-ball__halo,.so-ball__glyph{position:absolute;top:42.3729%;left:50%;translate:-50% -50%}.so-ball__halo{aspect-ratio:1;background:var(--brand-soft);border-radius:50%;width:98%}.so-ball__glyph{aspect-ratio:1;color:var(--on-brand);overflow:visible}.so-ball:not([data-revealed]) .so-ball__halo{animation:so-breathe 4.4s var(--ease-in-out) infinite}.so-ball__vision{opacity:0;width:38%;animation:so-vision calc(var(--n) * 1.2s) var(--ease-in-out) calc(var(--i) * 1.2s) infinite}.so-ball__sign{width:50%;animation:so-pop var(--dur-slow) var(--ease-pop) both}.so-ball__ink,.so-ball__fill{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.so-ball__ink path{stroke-width:1px;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1px;animation:so-draw .8s var(--ease-in-out) .12s forwards}.so-ball__fill{opacity:0;filter:drop-shadow(0 0 3px var(--sun));animation:so-fill .45s var(--ease-out) .7s forwards}.so-name{color:var(--brand-ink);white-space:nowrap}.so-sum{--so-t:clamp(44px, min(19cqw, 24cqh), 120px);align-content:center;justify-items:center;gap:calc(var(--so-t) * .5);display:grid;position:absolute;inset:0}.so-sum__row{align-items:center;gap:calc(var(--so-t) * .16);display:flex}.so-tile{min-width:var(--so-t);height:var(--so-t);border-radius:calc(var(--so-t) * .24);font-size:calc(var(--so-t) * .56);font-weight:var(--fw-heavy);box-shadow:var(--sh-1);animation:so-tile-in var(--dur-slow) var(--ease-pop) calc(var(--at) * .15s) both;place-items:center;line-height:1;display:grid}.so-tile--number{background:var(--bg);gap:3px;display:flex;overflow:hidden}.so-tile__tens,.so-tile__ones{width:calc(var(--so-t) * .8);place-items:center;height:100%;display:grid}.so-tile__tens,.so-tile--tens{background:var(--brand);color:var(--on-brand)}.so-tile__ones,.so-tile--ones{background:var(--illusions);color:var(--on-brand)}.so-tile--total{background:var(--sun);color:var(--ink)}.so-tile--answer{border:3px dashed var(--brand);background:var(--surface);color:var(--brand-ink);box-shadow:none}[data-sum=add] .so-tile--tens,[data-sum=add] .so-tile--ones{animation-name:so-tile-drop}.so-op{min-width:calc(var(--so-t) * .4);color:var(--ink-2);font-size:calc(var(--so-t) * .6);font-weight:var(--fw-bold);text-align:center;animation:so-tile-in var(--dur-slow) var(--ease-out) calc(var(--at) * .15s) both;line-height:1}.so-chart{--so-pad:clamp(3px, 1cqmin, 10px);--so-gap:clamp(8px, 2.4cqmin, 28px);--so-fit-h:calc((100cqh - 8px - 2 * var(--so-pad)) / 10);--so-fit-w:calc((100cqw - var(--so-gap) - 4 * var(--so-pad) - 4px) / 10);--so-r:clamp(35px, min(var(--so-fit-h), var(--so-fit-w) * 1.6), 76px);--so-c:min(var(--so-fit-w), var(--so-r) * 1.1);overscroll-behavior:contain;border-radius:var(--r-sm);flex-direction:column;padding-block:3px;display:flex;position:absolute;inset:0;overflow:hidden auto}.so-chart:focus-visible{outline-offset:-3px}.so-chart__sheet{gap:var(--so-gap);animation:so-chart-in var(--dur-slow) var(--ease-out) both;margin:auto;display:flex}.so-chart__half{grid-template-columns:repeat(5, var(--so-c));grid-auto-rows:var(--so-r);padding:var(--so-pad);border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);box-shadow:var(--sh-1);margin:0;list-style:none;display:grid}.so-chart__cell{justify-content:center;align-items:center;gap:calc(var(--so-r) * .06);flex-direction:column;min-width:0;display:flex}.so-chart__cell:nth-child(n+11):nth-child(-n+20),.so-chart__cell:nth-child(n+31):nth-child(-n+40){--so-round:calc(var(--so-r) * .2);background:var(--bg-soft)}.so-chart__cell:nth-child(11),.so-chart__cell:nth-child(31){border-top-left-radius:var(--so-round)}.so-chart__cell:nth-child(15),.so-chart__cell:nth-child(35){border-top-right-radius:var(--so-round)}.so-chart__cell:nth-child(16),.so-chart__cell:nth-child(36){border-bottom-left-radius:var(--so-round)}.so-chart__cell:nth-child(20),.so-chart__cell:nth-child(40){border-bottom-right-radius:var(--so-round)}.so-chart__num{color:var(--ink-2);font-size:clamp(15px, calc(var(--so-r) * .3), 22px);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;text-box:trim-both cap alphabetic;line-height:.8}.so-chart__sign{width:clamp(18px, calc(var(--so-r) * .5), 38px);height:clamp(18px, calc(var(--so-r) * .5), 38px);color:var(--ink);flex:none}.so-sprite{width:0;height:0;position:absolute;overflow:hidden}@keyframes so-breathe{0%,to{opacity:.55;scale:.97}50%{opacity:1;scale:1.03}}@keyframes so-vision{0%{opacity:0}5%,11%{opacity:.55}16%,to{opacity:0}}@keyframes so-pop{0%{scale:.6}}@keyframes so-draw{to{stroke-dashoffset:0}}@keyframes so-fill{to{opacity:1}}@keyframes so-tile-in{0%{opacity:0;scale:calc(1 - .4 * var(--motion))}}@keyframes so-tile-drop{0%{opacity:0;translate:0 calc(-.9 * var(--so-t) * var(--motion))}}@keyframes so-chart-in{0%{opacity:0;scale:calc(1 - .04 * var(--motion))}}@media (prefers-reduced-motion:reduce){.so-ball:not([data-revealed]) .so-ball__halo,.so-ball__sign{animation:none}.so-ball__vision{opacity:0;animation:none}.so-ball__ink{display:none}.so-ball__fill{animation:so-fill var(--dur-slow) linear forwards}}