.gradient-illustration{--gi-deep:#172554;--gi-top:#1e3a8a;--gi-mid:#3b82f6;--gi-bottom:#bcd7fb;--gi-mesh-1:56 189 248;--gi-mesh-1-soft:56 189 248;--gi-mesh-2:37 99 235;--gi-mesh-2-soft:59 130 246;--gi-mesh-3:23 37 84;--gi-mesh-3-soft:30 58 138;--gi-wave-1:191 219 254;--gi-wave-1-soft:147 197 253;--gi-wave-2:125 211 252;--gi-wave-2-soft:56 189 248;--gi-mist-tint:219 234 254;--gi-grain:.55;--gi-speed:6s;--gi-wave-speed:5s;--gi-mist-speed:7s;--gi-mist-speed-b:9s;--gi-cloud-speed:24s;--gi-icon-size:128px;--gi-noise-url:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncR type='linear' slope='1.9' intercept='-0.45'/><feFuncG type='linear' slope='1.9' intercept='-0.45'/><feFuncB type='linear' slope='1.9' intercept='-0.45'/></feComponentTransfer></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");contain:layout style;content-visibility:auto;contain-intrinsic-size:240px 200px;flex:none;justify-content:center;align-items:center;width:240px;height:200px;margin:0;animation:1.2s cubic-bezier(.4,0,.2,1) both gi-illustration-enter;display:flex;position:relative}.gradient-illustration[data-variant=bookmark]{--gi-deep:#1e1b4b;--gi-top:#312e81;--gi-mid:#6366f1;--gi-bottom:#c7d2fe;--gi-mesh-1:129 140 248;--gi-mesh-1-soft:129 140 248;--gi-mesh-2:99 102 241;--gi-mesh-2-soft:129 140 248;--gi-mesh-3:30 27 75;--gi-mesh-3-soft:49 46 129;--gi-wave-1:199 210 254;--gi-wave-1-soft:165 180 252;--gi-wave-2:167 139 250;--gi-wave-2-soft:129 140 248;--gi-mist-tint:224 231 255}.gradient-illustration[data-variant=bell]{--gi-deep:#1a2744;--gi-top:#1e3a8a;--gi-mid:#2563eb;--gi-bottom:#bfdbfe;--gi-mesh-1:251 191 36;--gi-mesh-1-soft:251 191 36;--gi-mesh-2:59 130 246;--gi-mesh-2-soft:96 165 250;--gi-mesh-3:23 37 84;--gi-mesh-3-soft:30 64 175;--gi-wave-1:254 240 138;--gi-wave-1-soft:191 219 254;--gi-wave-2:125 211 252;--gi-wave-2-soft:251 191 36;--gi-mist-tint:219 234 254}.gradient-illustration[data-variant=briefcase]{--gi-deep:#0f3038;--gi-top:#115e59;--gi-mid:#14b8a6;--gi-bottom:#99f6e4;--gi-mesh-1:45 212 191;--gi-mesh-1-soft:45 212 191;--gi-mesh-2:14 165 233;--gi-mesh-2-soft:56 189 248;--gi-mesh-3:15 47 58;--gi-mesh-3-soft:17 94 89;--gi-wave-1:153 246 228;--gi-wave-1-soft:103 232 249;--gi-wave-2:94 234 212;--gi-wave-2-soft:45 212 191;--gi-mist-tint:204 251 241}.gradient-illustration[data-variant=storefront]{--gi-deep:#0c4a6e;--gi-top:#0369a1;--gi-mid:#0ea5e9;--gi-bottom:#e0f2fe;--gi-mesh-1:56 189 248;--gi-mesh-1-soft:56 189 248;--gi-mesh-2:2 132 199;--gi-mesh-2-soft:14 165 233;--gi-mesh-3:12 74 110;--gi-mesh-3-soft:3 105 161;--gi-wave-1:186 230 253;--gi-wave-1-soft:125 211 252;--gi-wave-2:125 211 252;--gi-wave-2-soft:56 189 248;--gi-mist-tint:224 242 254}.gradient-illustration[data-variant=search]{--gi-deep:#0f172a;--gi-top:#1e3a8a;--gi-mid:#1d4ed8;--gi-bottom:#dbeafe;--gi-mesh-1:96 165 250;--gi-mesh-1-soft:96 165 250;--gi-mesh-2:37 99 235;--gi-mesh-2-soft:59 130 246;--gi-mesh-3:15 23 42;--gi-mesh-3-soft:30 58 138;--gi-wave-1:191 219 254;--gi-wave-1-soft:147 197 253;--gi-wave-2:148 163 184;--gi-wave-2-soft:96 165 250;--gi-mist-tint:226 232 240}.gradient-illustration[data-variant=chat]{--gi-deep:#2e1065;--gi-top:#5b21b6;--gi-mid:#8b5cf6;--gi-bottom:#ddd6fe;--gi-mesh-1:167 139 250;--gi-mesh-1-soft:167 139 250;--gi-mesh-2:139 92 246;--gi-mesh-2-soft:167 139 250;--gi-mesh-3:46 16 101;--gi-mesh-3-soft:91 33 182;--gi-wave-1:221 214 254;--gi-wave-1-soft:196 181 253;--gi-wave-2:192 132 252;--gi-wave-2-soft:167 139 250;--gi-mist-tint:237 233 254}.gradient-illustration[data-variant=people]{--gi-deep:#431407;--gi-top:#9a3412;--gi-mid:#f97316;--gi-bottom:#fed7aa;--gi-mesh-1:251 146 60;--gi-mesh-1-soft:251 146 60;--gi-mesh-2:234 88 12;--gi-mesh-2-soft:249 115 22;--gi-mesh-3:67 20 7;--gi-mesh-3-soft:154 52 18;--gi-wave-1:254 215 170;--gi-wave-1-soft:253 186 116;--gi-wave-2:251 191 36;--gi-wave-2-soft:251 146 60;--gi-mist-tint:255 237 213}.gradient-illustration__measure{width:var(--gi-icon-size);height:var(--gi-icon-size);visibility:hidden;pointer-events:none;position:absolute;overflow:hidden}.gradient-illustration__measure svg{width:100%;height:100%}.gradient-illustration__stage{width:var(--gi-icon-size);height:var(--gi-icon-size);isolation:isolate;contain:layout paint;position:relative}.gradient-illustration__layers{position:absolute;inset:0;overflow:hidden}.gradient-illustration__layers--masked{-webkit-mask-image:var(--gi-icon-mask);-webkit-mask-image:var(--gi-icon-mask);mask-image:var(--gi-icon-mask);-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.gradient-illustration[data-variant=chat] .gradient-illustration__layers--masked,.gradient-illustration[data-variant=chat] .gradient-illustration__blur-copy{-webkit-mask-position:calc(50% + 1.5px) calc(50% - 1.5px);mask-position:calc(50% + 1.5px) calc(50% - 1.5px)}.gradient-illustration__base{background:linear-gradient(175deg, var(--gi-deep) 0%, var(--gi-top) 32%, var(--gi-mid) 68%, var(--gi-bottom) 100%);position:absolute;inset:0}.gradient-illustration__mesh{background-image:radial-gradient(circle at 18% 22%, rgb(var(--gi-mesh-1)) 0%, rgb(var(--gi-mesh-1-soft) / .55) 18%, transparent 42%), radial-gradient(circle at 78% 20%, rgb(var(--gi-mesh-2)) 0%, rgb(var(--gi-mesh-2-soft) / .5) 20%, transparent 44%), radial-gradient(circle at 52% 70%, rgb(var(--gi-mesh-3)) 0%, rgb(var(--gi-mesh-3-soft) / .45) 22%, transparent 46%);filter:blur(10px)saturate(1.4);mix-blend-mode:screen;opacity:.9;animation:gi-mesh-drift var(--gi-speed) ease-in-out infinite;position:absolute;inset:-50%;transform:translate(-15%,10%)scale(1.2)}.gradient-illustration__mesh--wave{background-image:radial-gradient(circle at 32% 38%, rgb(var(--gi-wave-1)) 0%, rgb(var(--gi-wave-1-soft) / .5) 22%, transparent 48%), radial-gradient(circle at 68% 42%, rgb(var(--gi-wave-2)) 0%, rgb(var(--gi-wave-2-soft) / .45) 24%, transparent 50%);filter:blur(12px)saturate(1.35);mix-blend-mode:soft-light;opacity:.85;animation:gi-wave-drift var(--gi-wave-speed) ease-in-out infinite}.gradient-illustration__mist{background-image:radial-gradient(circle at 28% 42%, #ffffffe0 0%, #ffffff59 24%, transparent 48%), radial-gradient(circle at 72% 36%, #ffffffbf 0%, rgb(var(--gi-mist-tint) / .3) 28%, transparent 52%);filter:blur(12px);mix-blend-mode:overlay;opacity:.8;animation:gi-mist-drift var(--gi-mist-speed) ease-in-out infinite;pointer-events:none;position:absolute;inset:-55%;transform:translate(-20%,8%)scale(1.25)}.gradient-illustration__mist--b{background-image:radial-gradient(circle at 62% 58%, #fffc 0%, #ffffff40 26%, transparent 50%), radial-gradient(circle at 20% 62%, rgb(var(--gi-mist-tint) / .65) 0%, transparent 46%);filter:blur(16px);mix-blend-mode:soft-light;opacity:.75;animation:gi-mist-drift-b var(--gi-mist-speed-b) ease-in-out infinite}.gradient-illustration__cloud-track{mix-blend-mode:normal;filter:blur(9px);width:400%;animation:gi-cloud-drift var(--gi-cloud-speed) linear infinite;pointer-events:none;display:flex;position:absolute;inset:-15% 0}.gradient-illustration__cloud-tile{flex:0 0 25%}.gradient-illustration__cloud-tile--a{background-image:radial-gradient(21% 15% at 6% 80%,#fff 0%,#ffffffd9 45%,#0000 82%),radial-gradient(15% 19% at 15% 66%,#fff 0%,#ffffffe6 42%,#0000 80%),radial-gradient(24% 21% at 24% 76%,#fff 0%,#ffffffeb 40%,#0000 84%),radial-gradient(10% 12% at 9% 60%,#fff 0%,#fffc 46%,#0000 80%),radial-gradient(13% 10% at 30% 88%,#fff 0%,#ffffffbf 44%,#0000 82%),radial-gradient(12% 9% at 44% 84%,#fff 0%,#ffffffd1 44%,#0000 82%),radial-gradient(8% 11% at 50% 72%,#fff 0%,#ffffffc7 46%,#0000 84%),radial-gradient(6% 6% at 40% 66%,#fff 0%,#ffffffb3 48%,#0000 85%)}.gradient-illustration__cloud-tile--b{background-image:radial-gradient(17% 22% at 62% 58%,#fff 0%,#ffffffe0 42%,#0000 82%),radial-gradient(24% 17% at 74% 78%,#fff 0%,#ffffffe6 40%,#0000 84%),radial-gradient(12% 14% at 55% 40%,#fff 0%,#ffffffdb 44%,#0000 82%),radial-gradient(20% 13% at 88% 86%,#fff 0%,#ffffffc2 46%,#0000 84%),radial-gradient(9% 9% at 68% 34%,#fff 0%,#ffffffb3 48%,#0000 85%),radial-gradient(8% 10% at 45% 66%,#fff 0%,#ffffffb8 46%,#0000 84%)}.gradient-illustration__cloud-tile--c{background-image:radial-gradient(26% 14% at 20% 88%,#fff 0%,#ffffffe6 42%,#0000 84%),radial-gradient(16% 18% at 8% 70%,#fff 0%,#ffffffd9 44%,#0000 82%),radial-gradient(11% 11% at 34% 74%,#fff 0%,#fffc 44%,#0000 82%),radial-gradient(9% 9% at 64% 90%,#fff 0%,#ffffffb8 46%,#0000 85%),radial-gradient(7% 7% at 76% 82%,#fff 0%,#ffffffa8 48%,#0000 85%),radial-gradient(6% 8% at 46% 60%,#fff 0%,#fff9 48%,#0000 86%)}.gradient-illustration__grain{background-image:var(--gi-noise-url);mix-blend-mode:overlay;opacity:var(--gi-grain);pointer-events:none;background-size:190px 190px;position:absolute;inset:0}.gradient-illustration__grain--white{mix-blend-mode:soft-light;opacity:calc(var(--gi-grain) * .4);background-position:30px 18px;background-size:240px 240px}.gradient-illustration__sharp{position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 58%,#00000080 80%,#0000 97%);mask-image:linear-gradient(#000 58%,#00000080 80%,#0000 97%)}.gradient-illustration__blur-band{pointer-events:none;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#0000 46%,#000000d9 76%,#000 100%);mask-image:linear-gradient(#0000 46%,#000000d9 76%,#000 100%)}.gradient-illustration__blur-copy{background:linear-gradient(175deg, var(--gi-deep) 0%, var(--gi-top) 32%, var(--gi-mid) 68%, var(--gi-bottom) 100%);-webkit-mask-image:var(--gi-icon-mask);-webkit-mask-image:var(--gi-icon-mask);mask-image:var(--gi-icon-mask);filter:blur(12px);position:absolute;inset:0;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}@keyframes gi-mesh-drift{0%{transform:translate(-18%,12%)scale(1.2)}33%{transform:translate(24%,-16%)scale(1.35)}66%{transform:translate(-10%,-14%)scale(1.28)}to{transform:translate(-18%,12%)scale(1.2)}}@keyframes gi-wave-drift{0%{transform:translate(20%,-8%)scale(1.22)}50%{transform:translate(-26%,14%)scale(1.38)}to{transform:translate(20%,-8%)scale(1.22)}}@keyframes gi-mist-drift{0%{transform:translate(-24%,10%)scale(1.25)}40%{transform:translate(28%,-14%)scale(1.42)}70%{transform:translate(-12%,18%)scale(1.34)}to{transform:translate(-24%,10%)scale(1.25)}}@keyframes gi-mist-drift-b{0%{transform:translate(22%,12%)scale(1.28)}45%{transform:translate(-30%,-10%)scale(1.44)}80%{transform:translate(14%,-18%)scale(1.36)}to{transform:translate(22%,12%)scale(1.28)}}@keyframes gi-cloud-drift{0%{transform:translate(-75%)}to{transform:translate(0,0)}}@keyframes gi-illustration-enter{0%{opacity:0;filter:blur(16px);transform:scale(.82)}to{opacity:1;filter:blur();transform:scale(1)}}.gradient-illustration:after{content:"";pointer-events:none;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);animation:1.9s cubic-bezier(.4,0,.2,1) both gi-blur-veil;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#0000 10%,#0000008c 45%,#000 75%);mask-image:linear-gradient(#0000 10%,#0000008c 45%,#000 75%)}@keyframes gi-blur-veil{0%{opacity:1}35%{opacity:1}to{opacity:0;visibility:hidden}}@media (prefers-reduced-motion:reduce){.gradient-illustration__mesh,.gradient-illustration__mesh--wave,.gradient-illustration__mist,.gradient-illustration__mist--b,.gradient-illustration__cloud-track{animation:none}.gradient-illustration{animation:.3s ease-out both gi-illustration-enter-fade}.gradient-illustration:after{opacity:0;visibility:hidden;animation:none}}@keyframes gi-illustration-enter-fade{0%{opacity:0}to{opacity:1}}