:root{--fun-p1: #ffd2e5;--fun-p2: #e1d3ff;--fun-p3: #c9ddff;--fun-p4: #c2f3ec;--fun-p5: #ffe3ad;--fun-p6: #ffd5c7;--fun-p7: #d9f5c6;--fun-l1: #ff8cc0;--fun-l2: #b98cff;--fun-l3: #84abff;--fun-l4: #5fdcc6;--fun-l5: #ffbe55;--fun-l6: #ff9b78;--fun-l7: #92dc6c;--fun-n: 5;--fun-pastel: linear-gradient(90deg, var(--fun-p1), var(--fun-p2) 25%, var(--fun-p3) 50%, var(--fun-p4) 75%, var(--fun-p5));--fun-lit: linear-gradient(90deg, var(--fun-l1), var(--fun-l2) 25%, var(--fun-l3) 50%, var(--fun-l4) 75%, var(--fun-l5))}.fun-1{--fun-i: 0}.fun-2{--fun-i: 1}.fun-3{--fun-i: 2}.fun-4{--fun-i: 3}.fun-5{--fun-i: 4}.fun-6{--fun-i: 5}.fun-7{--fun-i: 6}@property --fun-k{syntax: "<number>"; inherits: false; initial-value: 0;}@property --fun-w{syntax: "<number>"; inherits: false; initial-value: 0;}.fun-title{position:relative;cursor:default}.fun-word{display:inline-block;white-space:nowrap}.fun-l{--s: max(var(--fun-k), var(--fun-w));display:inline-block;transform-origin:50% 85%;transform:translateY(calc(var(--s) * -.1em)) scale(calc(1 + var(--s) * .3)) rotate(calc(var(--s) * -5deg));color:color-mix(in srgb,var(--c) calc(var(--s) * 100%),var(--ink));transition:--fun-k .22s var(--ease);animation:fun-wave 7s ease-in-out calc(.8s + var(--i) * 70ms) infinite}@keyframes fun-wave{0%,10%,to{--fun-w: 0}4%{--fun-w: .6}}.fun-av{--d: 112px;position:relative;display:grid;place-items:center;width:calc(var(--d) + 12px);height:calc(var(--d) + 12px);margin-bottom:var(--s2);border-radius:50%}.fun-av:before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from var(--fun-a, 0deg),var(--fun-l1),var(--fun-l2),var(--fun-l3),var(--fun-l4),var(--fun-l5),var(--fun-l6),var(--fun-l1));animation:fun-turn 8s linear infinite}.fun-av img{position:relative;width:var(--d);height:var(--d);border-radius:50%;object-fit:cover;box-shadow:0 0 0 4px #fff}@property --fun-a{syntax: "<angle>"; inherits: false; initial-value: 0deg;}@keyframes fun-turn{to{--fun-a: 360deg}}@media(prefers-reduced-motion:reduce){.fun-av:before{animation:none}}.fun-box{position:relative;isolation:isolate;color:var(--ink);background:var(--fun-pastel) calc(var(--fun-i, 0) * 100% / (var(--fun-n) - 1)) 0 / calc(var(--fun-n) * 100%) 100%}.fun-box:after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;transition:opacity .3s;background:var(--fun-lit) calc(var(--fun-i, 0) * 100% / (var(--fun-n) - 1)) 0 / calc(var(--fun-n) * 100%) 100%}.fun-box.on:after{opacity:1}.fun-stage{position:relative;isolation:isolate;margin:0 0 var(--s7);padding:var(--s6) var(--s5);border-radius:24px;overflow:hidden;background:linear-gradient(120deg,#fff0f7,#f3eeff 30%,#ecf2ff,#eafaf5 80%,#fff5e6) 0 50% / 300% 300%;box-shadow:inset 0 0 0 1px var(--line);animation:rocket-drift 18s ease-in-out infinite alternate}.fun-stage-body{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) 176px;grid-template-rows:auto 1fr auto;grid-template-areas:"h demo" "strip demo" "tip demo";gap:var(--s4) var(--s5);pointer-events:none}.fun-stage-body>*{pointer-events:auto}.fun-stage h2{grid-area:h;margin:0;font:600 var(--t2)/1.2 var(--sans);letter-spacing:-.02em}.fun-tip{grid-area:tip;margin:0;font-size:var(--t-1);color:var(--mute)}.fun-strip{grid-area:strip;align-self:center;display:grid;grid-template-columns:repeat(var(--fun-n),minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none;perspective:800px}.fun-strip li{display:grid}button.fun-box{--lift: 0px;--sc: 1;--flip: 0deg;isolation:auto;display:grid;min-height:148px;margin:0;padding:0;border:0;border-radius:18px;font:inherit;text-align:center;box-shadow:inset 0 0 0 1px #ffffffb3,0 4px 12px #17181a0f;transform:translateY(var(--lift)) scale(var(--sc)) rotateY(var(--flip));transform-style:preserve-3d;transition:transform .52s var(--ease),box-shadow .3s;-webkit-tap-highlight-color:transparent}button.fun-box.on{--lift: -8px;--sc: 1.05;z-index:1;box-shadow:inset 0 0 0 1px #fffc,0 16px 30px #6a2bd933}@media(hover:hover){button.fun-box:hover{--flip: 180deg}}button.fun-box:is(:focus-visible,[aria-pressed=true]){--flip: 180deg}button.fun-box:focus-visible{outline:2px solid var(--focus);outline-offset:3px}@media(prefers-reduced-motion:no-preference){button.fun-box.glow:is(:focus-visible,[aria-pressed=true]):before{background-image:radial-gradient(160px circle at calc(100% - var(--mx, 50%)) var(--my, 0%),#e11d38,rgba(122,92,255,.55) 42%,rgba(70,130,255,.35) 65%,transparent 78%)}@media(hover:hover){button.fun-box.glow:hover:before{background-image:radial-gradient(160px circle at calc(100% - var(--mx, 50%)) var(--my, 0%),#e11d38,rgba(122,92,255,.55) 42%,rgba(70,130,255,.35) 65%,transparent 78%)}}}.fun-face,.fun-back{grid-area:1 / 1;display:grid;place-content:center;justify-items:center;gap:10px;padding:12px 8px;-webkit-backface-visibility:hidden;backface-visibility:hidden}.fun-face b{font:600 15px/1.2 var(--sans);letter-spacing:-.01em}.fun-back{transform:rotateY(180deg);font:600 13px/1.3 var(--sans);letter-spacing:-.01em}.fun-face .fun-emo{font-size:34px;line-height:1}.fun-box.on .fun-face .fun-emo{animation:fun-hop .52s var(--ease) infinite alternate}@keyframes fun-hop{to{translate:0 -6px;rotate:-10deg;scale:1.12}}.fun-demo{grid-area:demo;display:grid;gap:var(--s2);align-content:center;margin:0}.fun-demo figcaption{font-size:12px;line-height:1.35;color:var(--mute);text-align:center}.fun-phone{position:relative;aspect-ratio:9 / 17;border:6px solid #141416;border-radius:28px;overflow:hidden;background:var(--fun-lit) calc(var(--at, 0) * 100% / (var(--fun-n) - 1)) 0 / calc(var(--fun-n) * 100%) 100%;box-shadow:0 18px 40px #17181a38;transition:background-position .7s var(--ease)}.fun-phone:before{content:"";position:absolute;top:6px;left:50%;z-index:2;width:34%;height:13px;border-radius:8px;background:#141416;translate:-50% 0}.fun-segs{position:absolute;top:26px;left:10px;right:10px;z-index:2;display:flex;gap:3px}.fun-seg{flex:1;height:3px;border-radius:2px;background:#ffffff73;overflow:hidden}.fun-seg i{display:block;height:100%;background:#fff;transform-origin:0 50%;scale:0 1}.fun-seg.done i{scale:1 1}.fun-seg.on i{animation:fun-fill var(--d, 2.4s) linear both}@keyframes fun-fill{to{scale:1 1}}.fun-stage:is(:hover,.fun-away,:has(:focus-visible),:has([aria-pressed=true])) .fun-seg.on i{animation-play-state:paused}.fun-big{position:absolute;top:20%;left:50%;width:1.5em;height:1.5em;border-radius:50%;overflow:hidden;translate:-50% 0;font-size:46px;line-height:1.5em;text-align:center;background:#ffffff4d;box-shadow:inset 0 1px #ffffffb3,0 10px 24px #17181a1f;animation:fun-bob 2.2s ease-in-out infinite alternate}.fun-big>span{display:block;translate:0 calc(var(--at, 0) * -1.5em);transition:translate .6s cubic-bezier(.3,1.4,.5,1)}.fun-big i{display:block;font-style:normal}@keyframes fun-bob{to{transform:translateY(-6px) rotate(4deg)}}.fun-stage .tko-emoji{position:absolute;inset:0;z-index:0;pointer-events:none}.fun-stage .tko-emoji button{position:absolute;left:0;top:0;display:grid;place-items:center;width:52px;height:52px;padding:0;border:0;border-radius:50%;font-size:24px;background:radial-gradient(circle at 35% 30%,#fffffff2,#fff6 60%,#b98cff38);box-shadow:inset 0 0 0 1px #fffc,0 8px 22px #17181a1a;pointer-events:auto;transition:translate .2s,filter .2s;will-change:transform}.fun-stage .tko-emoji button:hover{translate:0 -6px;filter:brightness(1.04) saturate(1.2)}.fun-stage .tko-emoji button[hidden]{display:none}.fun-stage .tko-emoji i{position:absolute;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle,#b98cff,#b98cff00 70%);pointer-events:none}@media(max-width:600px),(min-width:1024px){.fun-stage{padding:var(--s5) var(--s4);border-radius:20px}.fun-stage-body{grid-template-columns:minmax(0,1fr) 124px;grid-template-rows:auto auto auto;grid-template-areas:"h h" "strip demo" "tip tip";gap:var(--s3)}.fun-strip{grid-template-columns:1fr;gap:6px}button.fun-box{min-height:46px;border-radius:14px}button.fun-box.on{--lift: 0px;--sc: 1.04}.fun-face{grid-auto-flow:column;justify-content:start;align-items:center;gap:8px;padding:6px 12px}.fun-face .fun-emo{font-size:22px}.fun-back{place-content:center start;justify-items:start;padding:4px 12px;font-size:12px;text-align:left}.fun-phone{border-width:5px;border-radius:22px}.fun-segs{top:22px;left:8px;right:8px}.fun-big{font-size:34px}.fun-demo figcaption{font-size:11px}.fun-stage .tko-emoji button{width:40px;height:40px;font-size:18px}}@media(min-width:1024px){.fun-stage-body{grid-template-columns:minmax(0,1fr) 150px}.fun-stage h2{font-size:var(--t1)}.fun-strip{grid-auto-rows:1fr}button.fun-box{min-height:48px}.fun-face b{font-size:14px}.fun-big{font-size:40px}.fun-demo figcaption{font-size:12px}}@media(min-width:1024px)and (max-height:860px){.fun-stage-body{grid-template-columns:minmax(0,1fr) 132px}button.fun-box{min-height:42px}.fun-big{font-size:34px}}.fun-go{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3) var(--s4)}.fun-run{gap:10px}.fun-reel{display:inline-block;height:1.3em;overflow:hidden;font-size:18px;line-height:1.3}.fun-reel>span,.fun-working>span{display:block}.fun-reel i,.fun-working i{display:block;font-style:normal}.fun-run:disabled{opacity:1}.fun-go:is(.fun-spin,:has(.fun-run:disabled)) .fun-reel>span{animation:fun-reel calc(var(--fun-n) * 1.2s) steps(var(--fun-n)) infinite}@keyframes fun-reel{0%{translate:0 -1.3em}to{translate:0 calc((var(--fun-n) + 1) * -1.3em)}}.fun-working{display:none;height:1.4em;margin:0;overflow:hidden;font:500 var(--t-1)/1.4 var(--sans);color:var(--mute)}.fun-go:is(.fun-spin,:has(.fun-run:disabled)) .fun-working{display:block}.fun-go:is(.fun-spin,:has(.fun-run:disabled)) .fun-working>span{animation:fun-lines calc(var(--fun-n) * 1.2s) steps(var(--fun-n)) infinite}@keyframes fun-lines{to{translate:0 calc(var(--fun-n) * -1.4em)}}.tool-form:has(.fun-run:disabled,.fun-spin) .tool-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.fun-wait,.fun-wait *,.fun-wait:before{animation-play-state:paused!important}.fun-verdict{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 20px;border-radius:999px;font:600 var(--t0)/1 var(--sans);letter-spacing:-.01em;color:var(--ink);background:var(--g) 0 50% / 200% 100%;box-shadow:inset 0 0 0 1px #ffffff80,0 8px 20px #17181a1f;animation:fun-badge .7s cubic-bezier(.3,1.6,.5,1) .3s both,rocket-drift 5s ease-in-out 1s infinite alternate}.fun-verdict>span{font-size:20px}.fun-verdict.good{--g: linear-gradient(110deg, #c2f3ec, #7fe3bf 50%, #c9f5d9)}.fun-verdict.fix{--g: linear-gradient(110deg, #ffe8a8, #ffc45c 50%, #ffd9b0)}.fun-verdict.again{--g: linear-gradient(110deg, #4a22b8, #6a2bd9 30%, #c8346a 60%, #b3541f 90%);color:#fff}@keyframes fun-badge{0%{opacity:0;scale:.4;rotate:-10deg}}.score-bar.fun-bar:before{background:linear-gradient(90deg,#6a2bd9,#e0457b,#ff9a3c);transform-origin:0 50%;animation:fun-grow 1.1s var(--ease) .15s both}@keyframes fun-grow{0%{scale:0 1}}.result .fun-boxes{list-style:none;padding:0;gap:var(--s3)}.fun-boxes>.fun-box{display:grid;gap:var(--s2);padding:var(--s4);border-radius:18px;box-shadow:inset 0 0 0 1px #ffffffb3;animation:fun-rise .6s var(--ease) calc(var(--n, 0) * 90ms) both}@keyframes fun-rise{0%{opacity:0;translate:0 18px;scale:.96}}.fun-box-head{display:flex;align-items:center;gap:var(--s2);max-width:none}.fun-box-head b{font:600 var(--t0)/1.2 var(--sans)}.fun-boxes .fun-emo{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;font-size:19px;background:#fff9;box-shadow:inset 0 0 0 1px #ffffffe6}.fun-pill{margin-left:auto;padding:5px 10px;border-radius:999px;background:#fff;font:600 var(--t-1)/1 var(--sans);font-variant-numeric:tabular-nums;box-shadow:0 2px 6px #17181a14}.result .fun-boxes blockquote{margin:0;font:500 var(--t1)/1.4 var(--sans);letter-spacing:-.015em;white-space:pre-wrap}.fun-note{font-size:var(--t-1);color:color-mix(in srgb,var(--ink) 75%,transparent)}.fun-boxes>.fun-box.empty{background:var(--surface);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 18%,transparent)}.fun-box.empty .fun-emo{filter:grayscale(1);opacity:.6}.result .fun-sticker{justify-self:start;padding:10px 16px;border-radius:12px;background:#141416;color:#fff;font:600 var(--t3)/1.15 var(--sans);letter-spacing:-.02em;rotate:-1.5deg;box-shadow:0 10px 24px #17181a2e}.result .fun-chips{display:flex;flex-wrap:wrap;gap:var(--s2);padding:0;list-style:none;perspective:600px}.fun-chip{--lit: linear-gradient(110deg, #c2f3ec, #b9f2cf);display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 12px 0 9px;border-radius:999px;font:500 var(--t-1)/1.2 var(--sans);background:var(--surface-2);color:var(--mute)}.fun-chip>span[aria-hidden]{font-size:17px;filter:grayscale(1);opacity:.5}.fun-chip.pass{background:var(--lit);color:var(--ink);box-shadow:inset 0 0 0 1px #ffffffb3;animation:fun-flip .64s var(--ease) calc(.5s + var(--n, 0) * .11s) both}.fun-chip.pass>span[aria-hidden]{filter:none;opacity:1;animation:fun-unfade .64s calc(.5s + var(--n, 0) * .11s) both}.fun-chip.miss{box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 14%,transparent)}@keyframes fun-flip{0%,50%{background:var(--surface-2);color:var(--mute);box-shadow:none}50.01%,to{background:var(--lit);color:var(--ink)}0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}50.01%{transform:rotateX(-90deg)}to{transform:rotateX(0)}}@keyframes fun-unfade{0%,50%{filter:grayscale(1);opacity:.5}50.01%,to{filter:none;opacity:1}}@media(prefers-reduced-motion:reduce){.fun-l,.fun-stage,.fun-emo,.fun-big,.fun-seg i,.fun-reel>span,.fun-working>span,.fun-verdict,.score-bar.fun-bar:before,.fun-boxes>.fun-box,.fun-chip,.fun-chip>span{animation:none!important}.fun-box,.fun-box:after,.fun-big>span,.fun-phone,.fun-stage .tko-emoji button{transition:none!important}.fun-seg.on i{scale:1 1}button.fun-box{--lift: 0px !important;--sc: 1 !important;--flip: 0deg !important}.fun-back{transform:none;opacity:0}@media(hover:hover){button.fun-box:hover .fun-face{opacity:0}button.fun-box:hover .fun-back{opacity:1}}button.fun-box:is(:focus-visible,[aria-pressed=true]) .fun-face{opacity:0}button.fun-box:is(:focus-visible,[aria-pressed=true]) .fun-back{opacity:1}}