.xp{--xp-nav:66px;--xp-left:max(var(--gutter), calc((100vw - var(--maxw)) / 2 + var(--gutter)));position:relative}.xp__slot{aspect-ratio:1;width:100%;max-width:560px;transition:background .8s var(--ease-out);background:radial-gradient(circle,#5eead41a,#0000 62%);place-items:center;margin-inline:auto;display:grid;position:relative}.xp__poster{filter:drop-shadow(0 0 24px #5eead459)drop-shadow(0 0 48px #f472b626);width:78%;height:auto;transition:opacity .9s var(--ease-out);border-radius:50%}.xp__loader{text-align:center;transition:opacity .6s var(--ease-out);justify-content:center;align-items:center;gap:10px;display:none;position:absolute;bottom:0;left:0;right:0}.xp__loader-ring{aspect-ratio:1;background:conic-gradient(from 0deg, #66e0ff00, var(--cyan-logo), #cd5fe3, #cd5fe300);border-radius:50%;flex:none;width:14px;animation:1.4s linear infinite xpSpin;-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 2.5px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,#0000 calc(100% - 2.5px),#000 calc(100% - 2px))}.xp__loader-msg{color:var(--ink-200);margin:0;font-size:14px;transition:opacity .35s}.xp__loader-msg.is-out{opacity:0}@keyframes xpSpin{to{transform:rotate(1turn)}}.xp__gl,.xp__scrim,.xp__hud,.xp__rail,.xp__progress{display:none}.xp__chapters{z-index:2;max-width:var(--maxw);padding:24px var(--gutter) 120px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:56px 48px;margin:0 auto;display:grid;position:relative}.xp__chapter{scroll-margin-top:calc(var(--xp-nav) + 24px);border-top:1px solid #5eead426;align-content:start;gap:14px;padding-top:24px;display:grid}.xp__chapter--outro{grid-column:1/-1}.xp__title{color:var(--ink-100);text-wrap:balance;margin:0;font-size:clamp(26px,2.6vw,38px);line-height:1.08}.xp__body{max-width:44ch;color:var(--ink-200);text-wrap:pretty;margin:0;font-size:16.5px;line-height:1.6}.xp__legend{color:var(--ink-200);flex-wrap:wrap;gap:6px 18px;margin:2px 0 0;font-size:14px;line-height:1.4;display:flex}.xp__legend span{align-items:center;gap:8px;display:inline-flex}.xp__dot{border-radius:50%;width:8px;height:8px;display:inline-block}.xp__dot--amber{background:var(--warn);box-shadow:0 0 8px var(--warn)}.xp__dot--teal{background:var(--teal-500);box-shadow:0 0 8px var(--teal-500)}.xp__dot--rose{background:var(--rose-500);box-shadow:0 0 8px var(--rose-500)}.xp__ask{gap:8px;width:min(380px,100%);margin-top:6px;display:grid}.xp__bubble{color:var(--ink-100);backdrop-filter:blur(6px);background:#050a0cd6;border:1px solid #f472b66b;border-radius:2px;margin:0;padding:10px 12px;font-size:13.5px;line-height:1.45}.xp__bubble--a{border-color:#5eead473}.xp__who{color:var(--rose-500);margin-bottom:3px;font-size:12.5px;font-weight:600;display:block}.xp__bubble--a .xp__who{color:var(--teal-500)}.xp__ctas{flex-wrap:wrap;gap:14px;margin-top:6px;display:flex}@media (width<=1000px){.xp__slot{max-width:min(76vw,380px)}}.xp.is-animated{grid-template:minmax(0,1fr)/minmax(0,1fr);height:700svh;display:grid}.xp.is-animated>.xp__hero,.xp.is-animated>.xp__stage{grid-area:1/1}.xp.is-animated .xp__hero{z-index:3;pointer-events:none;align-self:start}.xp.is-animated .hero__left{pointer-events:auto}.xp.is-animated .xp__stage{z-index:1;background:var(--surface-0);align-self:start;height:100svh;position:sticky;top:0;overflow:hidden}.xp.is-animated .xp__gl{display:block;position:absolute;inset:0}.xp__gl canvas{display:block;width:100%!important;height:100%!important}.xp.is-animated .xp__poster{filter:none}.xp.is-ready .xp__poster{visibility:hidden}.xp.is-animated .xp__loader{animation:.5s 1.2s both xpLoaderIn;display:flex}.xp.is-ready .xp__loader{opacity:0;pointer-events:none;animation:none}@keyframes xpLoaderIn{0%{opacity:0}to{opacity:1}}.xp__clip{opacity:0;position:absolute;inset:0}.xp__clip.is-on{opacity:1}.is-hero-edge>.xp__clip:first-child{transition:opacity .9s var(--ease-out)}.xp__clip-poster,.xp__clip-video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.xp__clip-video{opacity:0}.xp__clip.has-video .xp__clip-video{opacity:1}.xp[data-tier=video] .xp__poster{visibility:visible}.xp[data-tier=video]:not([data-seg=hero]) .xp__poster{opacity:0}.xp.is-animated .xp__slot{background:0 0}.xp.is-animated .xp__scrim{pointer-events:none;transition:opacity .6s;display:block;position:absolute;inset:0}.xp__scrim--side{background:linear-gradient(90deg,#000000eb 0%,#000000b8 26%,#0000 50%)}.xp__scrim--bottom{opacity:0;background:linear-gradient(#0000 56%,#000000bf 78%,#000000f2 100%)}.xp[data-act=outro] .xp__scrim--side{opacity:0}.xp[data-act=outro] .xp__scrim--bottom{opacity:1}.xp.is-animated .xp__chapters{pointer-events:none;max-width:none;margin:0;padding:0;display:block;position:absolute;inset:0}.xp.is-animated .xp__chapter{left:var(--xp-left);opacity:0;visibility:hidden;pointer-events:auto;border:0;gap:16px;width:min(460px,36vw);padding:0;transition:opacity .2s,transform .3s,visibility 0s linear .3s;position:absolute;top:50%;transform:translateY(calc(18px - 50%))}.xp.is-animated .xp__chapter.is-active{opacity:1;visibility:visible;transition:opacity .45s .24s,transform .65s cubic-bezier(.2,.7,.2,1) .24s,visibility linear;transform:translateY(-50%)}.xp.is-animated .xp__title{font-size:clamp(28px,3.1vw,46px)}.xp.is-animated .xp__body{max-width:40ch;font-size:17px}.xp.is-animated .xp__chapter--outro{width:min(820px, calc(100% - 2 * var(--gutter)));text-align:center;justify-items:center;top:auto;bottom:clamp(32px,8vh,88px);left:50%;transform:translate(-50%,18px)}.xp.is-animated .xp__chapter--outro.is-active{transform:translate(-50%)}.xp.is-animated .xp__ctas{justify-content:center}.xp.is-animated .xp__bubble--a{opacity:0;transition:opacity .2s,transform .2s;transform:translateY(6px)}.xp.is-animated .xp__chapter.is-active .xp__bubble--a{opacity:1;transition:opacity .45s 1.1s,transform .45s 1.1s;transform:none}.xp.is-animated .xp__rail{right:var(--xp-left);z-index:4;gap:4px;transition:opacity .4s;display:grid;position:absolute;top:50%;transform:translateY(-50%)}.xp[data-act=hero] .xp__rail,.xp[data-act=hero] .xp__progress{opacity:0;pointer-events:none}.xp__rail button{appearance:none;color:var(--ink-300);background:0 0;border:0;justify-content:flex-end;align-items:center;gap:10px;padding:7px 0;font-size:13px;transition:color .3s;display:flex}.xp__rail-n{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:11px}.xp__rail button:after{content:"";background:currentColor;border-radius:2px;width:16px;height:2px;transition:width .35s,background .35s}.xp__rail button:hover{color:var(--ink-200)}.xp__rail button.is-active{color:var(--ink-100)}.xp__rail button.is-active:after{background:var(--teal-500);width:34px}.xp__rail-l{display:none}.xp__rail button.is-active .xp__rail-l,.xp__rail button:hover .xp__rail-l,.xp__rail button:focus-visible .xp__rail-l{display:inline}.xp.is-animated .xp__progress{z-index:4;background:#e8f4f314;height:2px;transition:opacity .4s;display:block;position:absolute;bottom:0;left:0;right:0}.xp__progress span{background:linear-gradient(90deg, var(--teal-700), var(--teal-500));transform-origin:0;height:100%;display:block;transform:scaleX(0)}.xp.is-animated .xp__hud:not([hidden]){left:var(--xp-left);top:calc(var(--xp-nav) + 12px);z-index:4;font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink-300);margin:0;font-size:11px;display:block;position:absolute}@media (aspect-ratio<=9/10),(width<=760px){.xp.is-animated{height:600svh}.xp__scrim--side{background:linear-gradient(#0000 44%,#000c 68%,#000000f2 100%)}.xp[data-act=hero] .xp__scrim--side{opacity:0}.xp.is-animated .xp__chapter,.xp.is-animated .xp__chapter--outro{left:var(--gutter);right:var(--gutter);top:auto;bottom:calc(24px + env(safe-area-inset-bottom,0px));width:auto;transform:translateY(18px)}.xp.is-animated .xp__chapter.is-active,.xp.is-animated .xp__chapter--outro.is-active{transform:none}.xp.is-animated .xp__title{font-size:clamp(24px,6.6vw,32px)}.xp.is-animated .xp__body{font-size:15.5px}.xp.is-animated .xp__ask{width:min(320px,100%);position:absolute;bottom:calc(100% + 14px);left:0}.xp__bubble{padding:9px 11px;font-size:13px}.xp.is-animated .xp__rail{top:calc(var(--xp-nav) + 8px + env(safe-area-inset-top,0px));grid-auto-flow:column;gap:2px;left:50%;right:auto;transform:translate(-50%)}.xp__rail button{gap:6px;padding:8px 5px}.xp__rail-n{display:none}.xp__rail button:after{width:14px}.xp__rail button.is-active:after{width:22px}.xp.is-animated .xp__hud:not([hidden]){top:calc(var(--xp-nav) + 52px + env(safe-area-inset-top,0px))}.xp.is-animated .xp__progress{display:none}}
