.csoon{position:fixed;inset:0;z-index:3000;display:grid;place-items:center;padding:24px}.csoon__scrim{position:absolute;inset:0;background:#0000008c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .26s ease}.csoon.is-open .csoon__scrim{opacity:1}.csoon__card{--drag: 0px;position:relative;box-sizing:border-box;width:min(420px,100%);display:flex;flex-direction:column;align-items:center;padding:36px 28px 24px;overflow:hidden;text-align:center;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:28px;box-shadow:0 40px 90px -30px #000c,inset 0 1px color-mix(in srgb,var(--text) 6%,transparent);outline:none;opacity:0;transform:translateY(18px) scale(.96);transition:opacity .24s ease,transform .42s cubic-bezier(.34,1.4,.44,1)}.csoon.is-open .csoon__card{opacity:1;transform:none}.csoon.is-closing .csoon__card{opacity:0;transform:translateY(10px) scale(.98);transition:opacity .2s ease,transform .24s ease}.csoon__glow{position:absolute;top:-120px;left:50%;width:360px;height:260px;translate:-50% 0;background:radial-gradient(closest-side,color-mix(in srgb,var(--text) 13%,transparent),transparent);pointer-events:none}.csoon__grip{display:none}.csoon__x{position:absolute;top:14px;right:14px;z-index:1;display:grid;place-items:center;width:32px;height:32px;padding:0;color:var(--text-secondary);background:color-mix(in srgb,var(--text) 6%,transparent);border:0;border-radius:999px;cursor:pointer;transition:background-color .15s ease,color .15s ease,transform .15s ease}.csoon__x:hover{color:var(--text);background:color-mix(in srgb,var(--text) 11%,transparent)}.csoon__x:active{transform:scale(.9)}.csoon__x svg{width:16px;height:16px}.csoon__badge{position:relative;display:grid;place-items:center;width:76px;height:76px;margin-bottom:18px;border-radius:24px}.csoon__ring{position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--csoon-a, 0deg),transparent 0deg,color-mix(in srgb,var(--text) 85%,transparent) 60deg,transparent 130deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:csoon-orbit 3.2s linear infinite}@property --csoon-a{syntax: "<angle>"; initial-value: 0deg; inherits: false;}@keyframes csoon-orbit{to{--csoon-a: 360deg}}.csoon__ico{position:absolute;inset:1.5px;display:grid;place-items:center;border-radius:22.5px;color:var(--text);background:linear-gradient(180deg,color-mix(in srgb,var(--text) 9%,transparent),transparent),var(--bg-elevated);border:1px solid var(--border)}.csoon__ico svg{width:32px;height:32px;animation:csoon-float 3.6s ease-in-out infinite}@keyframes csoon-float{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.csoon__chip{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 11px;font-size:11px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--text-secondary);background:color-mix(in srgb,var(--text) 6%,transparent);border:1px solid var(--border);border-radius:999px}.csoon__chip i{position:relative;width:6px;height:6px;border-radius:50%;background:#34c77b}.csoon__chip i:after{content:"";position:absolute;inset:0;border-radius:inherit;background:inherit;animation:csoon-ping 1.8s cubic-bezier(0,0,.2,1) infinite}@keyframes csoon-ping{75%,to{transform:scale(2.6);opacity:0}}.csoon__title{margin:14px 0 0;font-size:24px;font-weight:650;line-height:1.15;letter-spacing:-.02em;text-wrap:balance}.csoon__body{margin:10px 0 0;max-width:34ch;font-size:14.5px;line-height:1.55;color:var(--text-secondary);text-wrap:pretty}.csoon__track{position:relative;width:100%;max-width:220px;height:4px;margin-top:22px;overflow:hidden;border-radius:999px;background:color-mix(in srgb,var(--text) 9%,transparent)}.csoon__track span{position:absolute;top:0;bottom:0;left:0;width:40%;border-radius:inherit;background:linear-gradient(90deg,transparent,var(--text),transparent);animation:csoon-work 1.9s cubic-bezier(.45,0,.25,1) infinite}@keyframes csoon-work{0%{transform:translate(-100%)}to{transform:translate(250%)}}.csoon__status{margin-top:8px;font-size:11.5px;color:var(--text-muted)}.csoon__ok{width:100%;height:46px;margin-top:22px;font:inherit;font-size:15px;font-weight:600;color:var(--bg);background:var(--text);border:0;border-radius:999px;cursor:pointer;transition:transform .15s ease,opacity .15s ease}.csoon__ok:hover{opacity:.9}.csoon__ok:active{transform:scale(.98)}.csoon__ok:focus-visible,.csoon__x:focus-visible{outline:2px solid color-mix(in srgb,var(--text) 60%,transparent);outline-offset:2px}@media(max-width:620px){.csoon{place-items:end stretch;padding:0}.csoon__card{width:100%;padding:12px 20px calc(20px + env(safe-area-inset-bottom));border-bottom:0;border-radius:28px 28px 0 0;transform:translateY(100%);transition:opacity .2s ease,transform .38s cubic-bezier(.32,.72,0,1);touch-action:none}.csoon.is-open .csoon__card{transform:translateY(var(--drag))}.csoon.is-closing .csoon__card{opacity:1;transform:translateY(100%);transition:transform .26s ease-in}.csoon__card.is-drag{transition:none}.csoon__grip{display:block;width:38px;height:5px;margin:0 auto 22px;border-radius:999px;background:color-mix(in srgb,var(--text) 22%,transparent)}.csoon__x{top:12px;right:12px}.csoon__badge{width:68px;height:68px;border-radius:21px;margin-bottom:14px}.csoon__ico{border-radius:19.5px}.csoon__ico svg{width:28px;height:28px}.csoon__title{font-size:21px}.csoon__body{font-size:14px}.csoon__ok{height:50px}}@media(prefers-reduced-motion:reduce){.csoon__card,.csoon__scrim{transition:opacity .15s ease;transform:none!important}.csoon__ring,.csoon__ico svg,.csoon__chip i:after,.csoon__track span{animation:none}.csoon__track span{left:30%}}