.rxn{--card:var(--field);--fill-on:var(--text);--fill-slab:var(--field);--font-ui:inherit;--ink:var(--text);--on-slab:var(--bg);--pane-edge:var(--line);--signal:var(--accent);--slab:var(--text);width:min(100%,320px);font-family:var(--font-ui);color:var(--fill-on,var(--ink));padding:8px 0 0;position:relative}.rxn-msg{flex-direction:column;align-items:flex-start;gap:8px;display:flex}.rxn-who{letter-spacing:0;align-items:center;gap:8px;padding-left:4px;font-size:12px;display:flex}.rxn-face{object-fit:cover;border-radius:50%;width:20px;height:20px}.rxn-who b{font-weight:500}.rxn-who span{color:color-mix(in srgb, var(--fill-on,#17181a) 52%, var(--fill-slab,#fff))}.rxn-morph{background:var(--fill-slab,var(--card));border-radius:var(--rxn-r);justify-content:center;align-items:center;display:flex;position:relative}[data-stroke=on] .rxn-morph{box-shadow:0 0 0 1px var(--pane-edge)}.rxn-text{white-space:nowrap;transform-origin:50%;letter-spacing:-.01em;width:max-content;padding:0 20px;font-size:16px;line-height:22px;display:block}.rxn-row{flex-wrap:wrap;align-items:center;gap:8px;min-height:44px;margin-top:8px;display:flex;position:relative}.rxn-chip{background:var(--fill-slab,var(--card));height:44px;color:inherit;font:inherit;cursor:pointer;letter-spacing:-.01em;border:0;border-radius:999px;align-items:center;gap:8px;padding:0 16px 0 12px;font-size:14px;font-weight:500;transition:background-color .16s,box-shadow .16s;display:flex}.rxn-chip[data-mine]{background:var(--fill-slab,var(--card));box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--signal,#2231dd) 35%, transparent);color:var(--signal,#2231dd)}[data-theme=dark] .rxn-chip[data-mine],[data-fill=dark] .rxn-chip[data-mine]{color:#8c9bff;box-shadow:inset 0 0 0 1px #8c9bff66}[data-theme=dark] [data-fill=light] .rxn-chip[data-mine]{color:var(--signal,#2231dd);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--signal,#2231dd) 35%, transparent)}.rxn-chip-e{letter-spacing:-.02em;font-size:20px;line-height:1;transition:opacity .16s}.rxn-chip-e[data-landing]{opacity:0}.rxn-p{font-style:normal;line-height:1;display:inline-block;position:relative}.rxn-p[data-play][data-k=launch]{animation:.64s cubic-bezier(.3,1.2,.4,1) rxn-launch}.rxn-p[data-play][data-k=launch]:after{content:"";background:color-mix(in srgb, var(--fill-on,#17181a) 20%, transparent);border-radius:50%;width:7px;height:7px;animation:.52s ease-out forwards rxn-puff;position:absolute;top:70%;left:20%}.rxn-p[data-play][data-k=flicker]{animation:.62s ease-out rxn-flicker}.rxn-p[data-play][data-k=confetti]{animation:.42s cubic-bezier(.3,1.6,.4,1) rxn-pop}.rxn-bits{pointer-events:none;position:absolute;top:50%;left:50%}.rxn-bits b{background:var(--c);border-radius:1px;width:3px;height:3px;margin:-1.5px;animation:.56s cubic-bezier(.2,.8,.3,1) forwards rxn-bit;position:absolute}.rxn-p[data-play][data-k=glance]{animation:.7s ease-in-out rxn-glance}.rxn-p[data-play][data-k=tick]{animation:.46s cubic-bezier(.3,1.6,.4,1) rxn-tick}.rxn-p[data-play][data-k=beat]{animation:.62s ease-in-out rxn-beat}.rxn-p[data-play][data-k=nod]{transform-origin:50% 90%;animation:.52s cubic-bezier(.3,1.4,.4,1) rxn-nod}.rxn-p[data-play][data-k=laugh]{animation:.56s ease-in-out rxn-laugh}.rxn-p[data-play][data-k=wow]{transform-origin:50% 100%;animation:.52s cubic-bezier(.3,1.5,.4,1) rxn-wow}.rxn-p[data-play][data-k=droop]{transform-origin:50% 100%;animation:.7s ease-in-out rxn-droop}.rxn-p[data-play][data-k=bow]{transform-origin:50% 100%;animation:.62s ease-in-out rxn-bow}@media (prefers-reduced-motion:reduce){.rxn-p[data-play],.rxn-p[data-play]:after,.rxn-bits b{animation:none}}.rxn-count{font-variant-numeric:tabular-nums;display:inline-flex}.rxn-col{height:1.4em;line-height:1.4em;display:inline-block;overflow:hidden}.rxn-strip{flex-direction:column;transition:transform .22s cubic-bezier(.24,1.34,.38,1);display:flex}.rxn-strip>span{height:1.4em}.rxn-add-wrap{display:flex}.rxn-add{background:var(--fill-slab,var(--card));width:44px;height:44px;color:color-mix(in srgb, var(--fill-on,#17181a) 52%, var(--fill-slab,#fff));cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border:0;border-radius:999px;place-items:center;padding:0;transition:color .16s,scale .16s cubic-bezier(.24,1.34,.38,1);display:grid}.rxn-add:hover,.rxn-add[aria-expanded=true]{color:var(--fill-on,var(--ink));scale:1.06}.rxn-pill{z-index:5;align-items:center;padding:8px;display:flex;position:absolute;top:0;left:0}.rxn-emo{cursor:pointer;background:0 0;border:0;place-items:center;width:44px;height:44px;padding:0;display:grid}.rxn-emo span{transform:scale(var(--s,1));transform-origin:50% 90%;letter-spacing:-.02em;font-size:20px;line-height:1;transition:transform .22s cubic-bezier(.24,1.34,.38,1);display:block}.rxn-tip{background:var(--slab,#17181a);color:var(--on-slab,#fff);white-space:nowrap;pointer-events:none;letter-spacing:0;border-radius:6px;padding:4px 8px;font-size:11px;font-weight:400;position:absolute;bottom:calc(100% + 10px);translate:-50%}.rxn-fly{z-index:6;pointer-events:none;letter-spacing:-.01em;place-items:center;width:24px;height:24px;margin:-12px 0 0 -12px;font-size:16px;display:grid;position:absolute;top:0;left:0}@keyframes rxn-launch{0%{transform:translate(0)rotate(0)}30%{transform:translate(2px,-7px)rotate(-12deg)}60%{transform:translate(-1px,1px)rotate(4deg)}to{transform:translate(0)rotate(0)}}@keyframes rxn-puff{0%{opacity:0;transform:scale(.4)}25%{opacity:1}to{opacity:0;transform:translate(-5px,6px)scale(1.6)}}@keyframes rxn-flicker{0%{filter:brightness();transform:scale(1)}15%{filter:brightness(1.35);transform:scale(1.18,1.1)}30%{filter:brightness();transform:scale(.94,1.08)}48%{filter:brightness(1.25);transform:scale(1.1,.96)}66%{transform:scale(.98,1.04)}to{filter:brightness();transform:scale(1)}}@keyframes rxn-pop{0%{transform:scale(.7)rotate(-12deg)}50%{transform:scale(1.18)rotate(6deg)}to{transform:none}}@keyframes rxn-bit{0%{transform:rotate(var(--a)) translateY(0) scale(1);opacity:1}to{transform:rotate(var(--a)) translateY(-16px) scale(.6);opacity:0}}@keyframes rxn-glance{0%,to{transform:translate(0)}25%{transform:translate(-2.5px)}60%{transform:translate(2.5px)}}@keyframes rxn-tick{0%{transform:scale(.6)rotate(-14deg)}55%{transform:scale(1.2)rotate(4deg)}to{transform:none}}@keyframes rxn-beat{0%,to{transform:scale(1)}15%{transform:scale(1.26)}30%{transform:scale(1)}45%{transform:scale(1.18)}60%{transform:scale(1)}}@keyframes rxn-nod{0%{transform:rotate(0)}35%{transform:rotate(-16deg)translateY(-2px)}to{transform:rotate(0)}}@keyframes rxn-laugh{0%,to{transform:rotate(0)}20%{transform:rotate(-10deg)}40%{transform:rotate(9deg)}60%{transform:rotate(-7deg)}80%{transform:rotate(4deg)}}@keyframes rxn-wow{0%{transform:scale(1)}35%{transform:scale(.92,1.22)}to{transform:scale(1)}}@keyframes rxn-droop{0%,to{transform:none}40%{transform:translateY(2px)rotate(-8deg)scale(.96)}}@keyframes rxn-bow{0%,to{transform:none}40%{transform:translateY(2px)scaleY(.9)}60%{transform:translateY(1px)scaleY(.95)}}.rxn .rxn-chip[data-mine]{color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.rxn button:focus-visible{outline:2px solid var(--accent);outline-offset:3px;box-shadow:none}.rxn .rxn-chip[data-mine]:focus-visible{box-shadow:inset 0 0 0 1px var(--accent)}.rxn .rxn-emo:hover{background:0 0}.rxn[data-still] *,.rxn[data-still] :before,.rxn[data-still] :after{transition:none!important;animation:none!important}.rxn[data-still] .rxn-add{scale:1}@media (prefers-reduced-motion:reduce){.rxn *,.rxn :before,.rxn :after{transition:none!important;animation:none!important}.rxn .rxn-add{scale:1}}
