.bl{--bl-accent:oklch(78% .14 210);--bl-accent-2:oklch(70% .2 320);--bl-ink:oklch(97% .005 260);--bl-muted:oklch(72% .01 260/.55);--bl-line:oklch(100% 0 0/.1);z-index:100;color:var(--bl-ink);background:radial-gradient(70% 60% at 50% 45%,oklch(20% .03 250),#0000 75%),oklch(10% .01 260);justify-content:center;align-items:center;transition:opacity .7s cubic-bezier(.4,0,.2,1),visibility .7s;display:flex;position:fixed;inset:0;overflow:hidden}.bl:before{content:"";background-image:linear-gradient(var(--bl-line) 1px, transparent 1px), linear-gradient(90deg, var(--bl-line) 1px, transparent 1px);opacity:.5;background-position:50%;background-size:64px 64px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(60% 55%,#000,#0000);mask-image:radial-gradient(60% 55%,#000,#0000)}.bl--leaving{opacity:0;visibility:hidden;pointer-events:none}.bl__stage{z-index:1;flex-direction:column;gap:1.75rem;width:min(88vw,600px);transition:transform .7s cubic-bezier(.4,0,.2,1),filter .7s;display:flex;position:relative}.bl--leaving .bl__stage{filter:blur(10px);transform:scale(1.35)}.bl--leaving:after{content:"";z-index:3;background:radial-gradient(circle at 50% 48%, oklch(100% 0 0/.9), color-mix(in oklch, var(--bl-accent) 40%, transparent) 25%, transparent 60%);pointer-events:none;animation:.7s ease-out forwards bl-flash;position:absolute;inset:0}@keyframes bl-flash{0%{opacity:0;transform:scale(.4)}25%{opacity:1}to{opacity:0;transform:scale(1.6)}}.bl__ambient{filter:blur(90px)saturate(1.8);opacity:0;background-position:50%;background-size:cover;animation:1.6s 3.2s forwards bl-ambient;position:absolute;inset:-20%}@keyframes bl-ambient{to{opacity:.38}}.bl__streaks{pointer-events:none;position:absolute;inset:0;overflow:hidden}.bl__streaks i{background:linear-gradient(90deg, transparent, var(--bl-accent), transparent);opacity:.5;width:30%;height:1px;animation:bl-streak var(--d) linear var(--s) infinite;position:absolute;left:-30%}@keyframes bl-streak{to{transform:translate(450%)}}.bl__eyebrow{font:500 10.5px/1 var(--font-mono,ui-monospace, monospace);letter-spacing:.38em;text-transform:uppercase;color:var(--bl-accent);align-items:center;gap:.6rem;display:flex}.bl__eyebrow:before{content:"";background:var(--bl-accent);width:6px;height:6px;box-shadow:0 0 10px var(--bl-accent);border-radius:50%;animation:1.2s ease-in-out infinite bl-pulse}.bl__title{letter-spacing:-.03em;background:linear-gradient(100deg, var(--bl-ink) 30%, var(--bl-accent) 48%, var(--bl-accent-2) 55%, var(--bl-ink) 72%);color:#0000;background-size:300% 100%;-webkit-background-clip:text;background-clip:text;margin-top:.55rem;font-size:clamp(1.6rem,3.2vw,2.25rem);font-weight:600;line-height:1.05;animation:4s ease-in-out infinite bl-title}@keyframes bl-title{0%{background-position:100% 0}to{background-position:0 0}}.bl__subtitle{text-overflow:ellipsis;white-space:nowrap;color:var(--bl-muted);margin-top:.35rem;font-size:.875rem;overflow:hidden}.bl__frame{padding:18px 0 0 18px;position:relative}.bl__ruler{color:var(--bl-muted);font:500 9px/1 var(--font-mono,ui-monospace, monospace);position:absolute}.bl__ruler--x{background:repeating-linear-gradient(90deg, var(--bl-line) 0 1px, transparent 1px 10%) bottom / 100% 5px no-repeat, repeating-linear-gradient(90deg, oklch(100% 0 0/.06) 0 1px, transparent 1px 2.5%) bottom / 100% 3px no-repeat;height:12px;top:0;left:18px;right:0}.bl__ruler--y{background:repeating-linear-gradient(180deg, var(--bl-line) 0 1px, transparent 1px 12.5%) right / 5px 100% no-repeat, repeating-linear-gradient(180deg, oklch(100% 0 0/.06) 0 1px, transparent 1px 3.125%) right / 3px 100% no-repeat;width:12px;top:18px;bottom:0;left:0}.bl__ruler span{position:absolute;top:0;transform:translate(3px)}.bl__tilt{perspective:1400px;perspective-origin:50% 40%}.bl__canvas{aspect-ratio:16/10;width:100%;transform-style:preserve-3d;animation:3.2s cubic-bezier(.2,.7,.2,1) both bl-tilt-in,6s ease-in-out 3.2s infinite alternate bl-float;position:relative}@keyframes bl-tilt-in{0%{transform:rotateX(28deg)rotateY(-30deg)rotate(4deg)scale(.85)}to{transform:rotateX(6deg)rotateY(-8deg)rotate(0)scale(1)}}@keyframes bl-float{0%{transform:rotateX(6deg)rotateY(-8deg)translateY(0)}to{transform:rotateX(2deg)rotateY(7deg)translateY(-6px)}}.bl--leaving .bl__canvas{animation-play-state:paused}.bl__reflection{filter:blur(3px)saturate(1.3);opacity:0;--bl-to:.6;background-position:bottom;background-size:100% 263%;height:38%;animation:1s 4s forwards bl-fade-to;position:absolute;top:102%;left:0;right:0;transform:scaleY(-1);-webkit-mask-image:linear-gradient(#0000 15%,oklch(0% 0 0/.55));mask-image:linear-gradient(#0000 15%,oklch(0% 0 0/.55))}@keyframes bl-fade-to{to{opacity:var(--bl-to,1)}}.bl__sheen{mix-blend-mode:overlay;opacity:0;animation:.4s 4.3s forwards bl-fade-to;position:absolute;inset:0;overflow:hidden}.bl__sheen:before{content:"";background:linear-gradient(115deg,#0000 40%,oklch(90% .15 200/.7) 46%,oklch(100% 0 0/.95) 50%,oklch(85% .2 330/.7) 54%,#0000 60%);animation:2.6s cubic-bezier(.5,0,.5,1) 4.3s infinite bl-sheen;position:absolute;inset:-50%;transform:translate(-60%)}@keyframes bl-sheen{to{transform:translate(60%)}}.bl__probe{left:var(--x);top:var(--y);opacity:0;animation:bl-probe .5s cubic-bezier(.2, 1.4, .4, 1) var(--at) forwards;position:absolute;transform:translateZ(40px)}.bl__probe:before{content:"";border:1.5px solid var(--bl-ink);background:var(--c);width:18px;height:18px;box-shadow:0 0 0 3px oklch(0% 0 0/.35), 0 0 14px var(--c);border-radius:50%;position:absolute;top:-9px;left:-9px}.bl__probe:after{content:"";border:1px solid var(--bl-ink);width:32px;height:32px;animation:bl-ping 1.6s ease-out var(--at) infinite;border-radius:50%;position:absolute;top:-16px;left:-16px}.bl__probe span{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--bl-ink);font:600 10px/1.4 var(--font-mono,ui-monospace, monospace);letter-spacing:.06em;white-space:nowrap;background:oklch(0% 0 0/.65);border-radius:4px;padding:2px 6px;position:absolute;top:-10px;left:16px}.bl__probe span:before{content:"";background:var(--c);vertical-align:-1px;border-radius:2px;width:8px;height:8px;margin-right:5px;display:inline-block}@keyframes bl-probe{0%{opacity:0;transform:translateZ(40px)scale(.2)}to{opacity:1;transform:translateZ(40px)scale(1)}}@keyframes bl-ping{0%{opacity:.8;transform:scale(.5)}to{opacity:0;transform:scale(1.6)}}.bl__palette{gap:6px;display:flex}.bl__chip{background:var(--c);width:22px;height:22px;box-shadow:inset 0 0 0 1px oklch(100% 0 0/.18), 0 4px 14px color-mix(in oklch, var(--c) 55%, transparent);opacity:0;animation:bl-chip .45s cubic-bezier(.2, 1.4, .4, 1) var(--at) forwards;border-radius:6px;transform:translateY(8px)scale(.6)}@keyframes bl-chip{to{opacity:1;transform:none}}.bl__corner{border:0 solid var(--bl-accent);width:14px;height:14px;position:absolute}.bl__corner--tl{border-top-width:1.5px;border-left-width:1.5px;top:-7px;left:-7px}.bl__corner--tr{border-top-width:1.5px;border-right-width:1.5px;top:-7px;right:-7px}.bl__corner--bl{border-bottom-width:1.5px;border-left-width:1.5px;bottom:-7px;left:-7px}.bl__corner--br{border-bottom-width:1.5px;border-right-width:1.5px;bottom:-7px;right:-7px}.bl__mosaic{grid-template-columns:repeat(var(--bl-cols), 1fr);grid-template-rows:repeat(var(--bl-rows), 1fr);transform-style:preserve-3d;gap:3px;animation:.8s cubic-bezier(.65,0,.35,1) 2.4s forwards bl-close;display:grid;position:absolute;inset:0}@keyframes bl-close{to{gap:0}}.bl__tile{opacity:0;filter:grayscale()brightness(.8)blur(5px);transform:translate3d(var(--dx), var(--dy), var(--dz)) rotateX(var(--rot)) rotateY(var(--rot)) scale(.5);animation:bl-tile-in .9s cubic-bezier(.2, .9, .25, 1) var(--delay) forwards, bl-tile-color .5s ease var(--color-delay) forwards;background-color:oklch(25% .02 260);background-repeat:no-repeat;border-radius:2px;box-shadow:0 0 0 .5px oklch(100% 0 0/.06)}.bl__mosaic--fallback .bl__tile{background-image:linear-gradient(135deg, color-mix(in oklch, var(--bl-accent) 55%, transparent), color-mix(in oklch, var(--bl-accent-2) 45%, transparent))}@keyframes bl-tile-in{60%{opacity:1}to{opacity:1;filter:grayscale()brightness(.8)blur();border-radius:0;transform:none}}@keyframes bl-tile-color{0%{opacity:1;filter:grayscale()brightness(.8)blur();transform:none}40%{filter:grayscale(0)brightness(1.6)blur()}to{opacity:1;filter:none;border-radius:0;transform:none}}.bl__beam{opacity:0;background:var(--bl-ink);width:2px;box-shadow:0 0 12px 2px var(--bl-accent), -3px 0 0 var(--bl-accent-2), 3px 0 0 var(--bl-accent);animation:1.3s cubic-bezier(.55,0,.45,1) 3.1s forwards bl-beam;position:absolute;top:-6%;bottom:-6%;left:0}.bl__beam:after{content:"";background:linear-gradient(90deg, transparent, color-mix(in oklch, var(--bl-accent) 22%, transparent));width:90px;position:absolute;top:0;bottom:0;right:2px}@keyframes bl-beam{0%{opacity:0;left:0}8%{opacity:1}92%{opacity:1}to{opacity:0;left:100%}}.bl__readout{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--bl-ink);font:500 10px/1.4 var(--font-mono,ui-monospace, monospace);letter-spacing:.06em;opacity:0;background:oklch(0% 0 0/.55);border-radius:4px;padding:4px 7px;animation:.4s .6s forwards bl-fade;position:absolute;bottom:10px;right:10px}@keyframes bl-fade{to{opacity:1}}.bl__footer{grid-template-columns:1fr auto;align-items:end;gap:.5rem 1.5rem;display:grid}.bl__step{min-height:1.25rem;font:500 12px/1.4 var(--font-mono,ui-monospace, monospace);color:var(--bl-ink);align-items:center;gap:.55rem;display:flex}.bl__step-index{color:var(--bl-accent)}.bl__step-text{white-space:nowrap;animation:.35s steps(14,end) both bl-type;overflow:hidden}.bl__step-text:after{content:"▍";color:var(--bl-accent);margin-left:2px;animation:.8s step-end infinite bl-pulse}@keyframes bl-type{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}.bl__percent{font:200 3.25rem/.85 var(--font-mono,ui-monospace, monospace);letter-spacing:-.04em;font-variant-numeric:tabular-nums;grid-row:span 2}.bl__percent small{color:var(--bl-muted);margin-left:2px;font-size:1rem;font-weight:400}.bl__progress{background:var(--bl-line);height:2px;position:relative;overflow:hidden}.bl__progress-fill{background:linear-gradient(90deg, var(--bl-accent-2), var(--bl-accent));box-shadow:0 0 10px var(--bl-accent);position:absolute;inset:0 auto 0 0}.bl__meta{font:500 10px/1.4 var(--font-mono,ui-monospace, monospace);letter-spacing:.12em;text-transform:uppercase;color:var(--bl-muted);flex-wrap:wrap;grid-column:1/-1;align-items:center;gap:.25rem 1.25rem;display:flex}.bl__meta span:before{content:"/ ";color:var(--bl-accent)}@keyframes bl-pulse{50%{opacity:.25}}@media (prefers-reduced-motion:reduce){.bl *,.bl :before,.bl :after{animation-duration:.01ms!important;animation-delay:0s!important}}
