.ss-wrap{inline-size:100%;max-inline-size:34rem;color:var(--w-ink);font-variant-numeric:tabular-nums;isolation:isolate;margin-inline:auto;position:relative}.ss-stage{aspect-ratio:4/4.4;background:radial-gradient(ellipse at 50% 48%, color-mix(in srgb, var(--w-accent) 17%, transparent), transparent 69%);min-block-size:27rem;margin:0;position:relative}.ss-scene{position:absolute;inset:0}.ss-example{border:1px solid var(--w-line);background:var(--w-accent-wash);color:var(--w-ink-2);border-radius:999px;padding:.3rem .65rem;font-size:.7rem;position:absolute;inset-block-start:2%;inset-inline-start:5%}.ss-paper{border:1px solid var(--w-line);background:color-mix(in srgb, #e9d9bc 5%, var(--w-surface));box-shadow:var(--w-shadow-lg);border-radius:1.15rem;position:absolute}.ss-bill{text-align:center;z-index:2;gap:.15rem;padding:.8rem 1rem;display:grid;inset-block-start:11%;inset-inline:19%}.ss-bill-name{font-size:.85rem}.ss-total{font-size:clamp(1.5rem,5vw,2.1rem);line-height:1.2}.ss-paid{color:var(--w-ink-2);font-size:.7rem}.ss-paths{pointer-events:none;block-size:100%;inline-size:100%;position:absolute;inset:0}.ss-paths path{stroke:var(--w-accent);stroke-width:1.25px;stroke-dasharray:1;stroke-dashoffset:0;opacity:.38}.ss-people{grid-template-columns:repeat(3,minmax(0,1fr));display:grid;position:absolute;inset-block-start:35%;inset-inline:0}.ss-person{flex-direction:column;align-items:center;gap:.35rem;min-inline-size:0;display:flex}.ss-share{box-sizing:border-box;border:1px solid var(--w-line);background:var(--w-surface);max-inline-size:95%;color:var(--w-ink-2);text-align:center;border-radius:999px;padding:.3rem .45rem;font-size:clamp(.6rem,2vw,.75rem)}.ss-avatar{color:#fff;background:#7a5af8;border-radius:50%;flex:0 0 44px;place-items:center;block-size:44px;inline-size:44px;font-size:1rem;display:grid}.ss-person-1 .ss-avatar{color:#23134f;background:#a994ff}.ss-person-2 .ss-avatar{background:#5638c4}.ss-name{color:var(--w-ink-2);text-align:center;overflow-wrap:anywhere;font-size:.75rem}.ss-balance{grid-template-columns:30px minmax(0,1fr);align-items:center;column-gap:.65rem;padding:.75rem 1rem;display:grid;inset-block-start:61%;inset-inline:9%}.ss-check{color:#fff;background:#237a60;border-radius:50%;grid-row:span 2;place-items:center;block-size:30px;inline-size:30px;display:grid}.ss-check svg{stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;block-size:21px;inline-size:21px}.ss-note{color:var(--w-ink-2);letter-spacing:.06em;font-size:.65rem;font-variant-caps:all-small-caps}.ss-result{overflow-wrap:anywhere;font-size:clamp(1rem,3.6vw,1.4rem);line-height:1.35}.ss-sheet{text-align:center;padding:.6rem;inset-block-start:81%;inset-inline:13%}.ss-settle{background:var(--w-accent-wash);color:var(--w-ink);border-radius:.65rem;justify-content:center;align-items:center;gap:.5rem;padding:.55rem .65rem;font-size:.8rem;display:flex}.ss-settle svg{stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;flex:0 0 18px;block-size:18px;inline-size:18px}.ss-settle:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)) svg{transform:scaleX(-1)}.ss-upi{color:var(--w-ink-2);margin-block-start:.35rem;font-size:.65rem;display:block}.ss-replay{border:1px solid var(--w-line);background:var(--w-surface);min-block-size:44px;min-inline-size:44px;color:var(--w-ink-2);font:inherit;cursor:pointer;border-radius:999px;padding:.5rem .65rem;font-size:.75rem;position:absolute;inset-block-start:0;inset-inline-end:3%}.ss-replay:hover{background:var(--w-accent-wash)}.ss-replay:focus-visible{outline:2px solid var(--w-accent);outline-offset:3px}.ss-stage *{animation-play-state:paused}.ss-live .ss-bill{animation:5s ease-out both ss-drop}.ss-live .ss-person{animation:5s both ss-arrive}.ss-live .ss-share{animation:5s both ss-fan}.ss-live .ss-person-0{--ss-from:110%;--ss-turn:-12deg}.ss-live .ss-person-1{--ss-from:0%;--ss-turn:0deg}.ss-live .ss-person-2{--ss-from:-110%;--ss-turn:12deg}.ss-live .ss-paths path{animation:5s both ss-thread}.ss-live .ss-balance{animation:5s both ss-resolve}.ss-live .ss-sheet{animation:5s both ss-handoff}.ss-live *{animation-play-state:running}@keyframes ss-drop{0%{opacity:0;transform:translateY(-65px)rotate(-3deg)}12%{opacity:1;animation-timing-function:ease-out;transform:translateY(4px)rotate(1deg)}18%,to{opacity:1;transform:translateY(0)rotate(0)}}@keyframes ss-arrive{0%,15%{opacity:0;transform:translateY(12px)}26%,to{opacity:1;transform:translateY(0)}}@keyframes ss-fan{0%,25%{opacity:0;transform:translate(var(--ss-from), -60px) rotate(var(--ss-turn))}35%{opacity:1;transform:translate(calc(var(--ss-from) * .4), -34px) rotate(var(--ss-turn))}48%,to{opacity:1;transform:translate(0)rotate(0)}}@keyframes ss-thread{0%,23%{opacity:0;stroke-dashoffset:1px}32%{opacity:.6;stroke-dashoffset:.5px}46%,50%{opacity:.6;stroke-dashoffset:0}62%,to{opacity:.3;stroke-dashoffset:0}}@keyframes ss-resolve{0%,57%{opacity:0;transform:translateY(16px)scale(.96)}72%,to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ss-handoff{0%,77%{opacity:0;transform:translateY(42px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.ss-stage *{animation:none!important}.ss-paths path{opacity:.3;stroke-dashoffset:0}.ss-replay{display:none}}[dir=rtl] .ss-live .ss-person-0{--ss-from:-110%;--ss-turn:12deg}[dir=rtl] .ss-live .ss-person-2{--ss-from:110%;--ss-turn:-12deg}