@layer components{.cf{--cf-ease:cubic-bezier(0.2,0.7,0.2,1);overflow:hidden}.cf__label{font-family:var(--font-mono);font-size:11px;line-height:20px;letter-spacing:.12em;text-transform:uppercase;color:var(--c-text-3)}.cf__top{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;padding:0 12px 0 20px;border-bottom:var(--hairline)}.cf__body{padding:22px 20px 24px}@media (min-width:1024px){.cf__top{padding-left:28px;padding-right:14px}.cf__body{padding:26px 28px 28px}}.cf-band{position:relative;display:grid;grid-template-columns:9px minmax(0,1fr);column-gap:16px}.cf-band+.cf-band{margin-top:24px}.cf-band:not(:last-child):before,.cf-band__fill{content:"";position:absolute;left:4px;top:16px;bottom:-28px;width:1px;background:var(--c-border-2)}.cf-band__fill{background:var(--c-coral-500);transform:scaleY(0);transform-origin:top}.cf-band__mark{position:relative;z-index:1;grid-row:1;align-self:center;width:9px;height:9px;border-radius:9999px;border:1px solid transparent;background:var(--c-ink)}.cf-band__head{grid-column:2;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:20px}.cf-band__body{grid-column:2;margin-top:12px}.cf-state{display:inline-flex;gap:8px;font-size:14px;font-weight:500;line-height:20px;color:#2f6f48}.cf-state,.cf-url{align-items:center}.cf-url{display:flex;height:38px;padding:0 12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border:var(--hairline);border-radius:10px;background:var(--c-surface-2);font-size:13px;color:var(--c-text-3)}.cf-event,.cf-url span{color:var(--c-text)}.cf-event{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:15px;font-weight:600}.cf-fields{border-block:var(--hairline)}.cf-field{display:grid;grid-template-columns:64px minmax(0,1fr) auto;column-gap:12px;align-items:center;min-height:38px}.cf-field+.cf-field{border-top:var(--hairline)}.cf-field__key{font-size:12px;color:var(--c-text-3)}.cf-swap{display:grid;font-size:13px}.cf-swap>*{grid-area:1/1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.cf-raw{position:relative;justify-self:start;opacity:0;color:var(--c-text-2)}.cf-raw:after{content:"";position:absolute;left:0;right:0;top:52%;height:1px;background:currentColor;transform-origin:left}.cf-clean{color:var(--c-text)}.cf-clean--removed,.cf-field__did{color:var(--c-text-3)}.cf-field__did{font-size:14px;font-weight:500}.cf-field:first-child{--cf-d:0.7s}.cf-field:nth-child(2){--cf-d:0.95s}.cf-field:nth-child(3){--cf-d:1.2s}.cf-field:nth-child(4){--cf-d:1.45s}.cf-dests{border-block:var(--hairline)}.cf-dest{display:flex;align-items:center;gap:12px;min-height:56px}.cf-dest+.cf-dest{border-top:var(--hairline)}.cf-dest img{flex:none;width:20px;height:20px;object-fit:contain}.cf-dest__name{display:flex;flex:1;min-width:0;flex-direction:column;font-size:15px;font-weight:600;line-height:1.3;color:var(--c-text)}.cf-dest__name span{font-size:13px;font-weight:400;color:var(--c-text-3)}.cf-ok{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:#2f6f48}.cf-dest:first-child{--cf-d:0.7s}.cf-dest:nth-child(2){--cf-d:0.92s}.cf-dest:nth-child(3){--cf-d:1.14s}.cf-toggle{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9999px;border:var(--hairline);background:var(--c-surface);color:var(--c-text-2);cursor:pointer;transition:background-color .2s,color .2s}.cf-toggle:hover{background:var(--c-surface-2);color:var(--c-text)}.cf-toggle:focus-visible{outline:2px solid var(--c-coral-500);outline-offset:2px}.pd-how[data-stage] .cf-band__mark{border-color:var(--c-border-2);background:var(--c-surface);transition:background-color .3s,border-color .3s,box-shadow .3s}.pd-how[data-stage] .cf-band__fill{transition:transform .6s cubic-bezier(.65,0,.35,1)}.pd-how[data-stage] .cf-band__dim{transition:opacity .4s var(--cf-ease) .45s}.pd-how[data-stage] .cf-state{transition:opacity .3s var(--cf-ease) .15s}.pd-how[data-stage] .cf-event{transition:opacity .35s var(--cf-ease) .6s,transform .35s var(--cf-ease) .6s}.pd-how[data-stage="2"] [data-band="2"] .cf-state{transition-delay:1.95s}.pd-how[data-stage] .cf-raw{transition:opacity .3s var(--cf-ease) calc(var(--cf-d) + .3s)}.pd-how[data-stage] .cf-raw:after{transition:transform .3s var(--cf-ease) var(--cf-d)}.pd-how[data-stage] .cf-clean{transition:opacity .35s var(--cf-ease) calc(var(--cf-d) + .35s),transform .35s var(--cf-ease) calc(var(--cf-d) + .35s)}.pd-how[data-stage] .cf-field__did{transition:opacity .35s var(--cf-ease) calc(var(--cf-d) + .35s)}.pd-how[data-stage] .cf-ok{transition:opacity .3s var(--cf-ease) var(--cf-d),transform .3s var(--cf-ease) var(--cf-d)}.pd-how[data-stage="2"] [data-band="1"] .cf-band__mark,.pd-how[data-stage="3"] [data-band="1"] .cf-band__mark,.pd-how[data-stage="3"] [data-band="2"] .cf-band__mark{border-color:transparent;background:var(--c-ink)}.pd-how[data-stage="1"] [data-band="1"] .cf-band__mark,.pd-how[data-stage="2"] [data-band="2"] .cf-band__mark,.pd-how[data-stage="3"] [data-band="3"] .cf-band__mark{border-color:transparent;background:var(--c-coral-500);box-shadow:0 0 0 4px color-mix(in srgb,var(--c-coral-500) 20%,transparent)}.pd-how[data-stage="2"] [data-band="2"] .cf-band__mark,.pd-how[data-stage="3"] [data-band="3"] .cf-band__mark{transition-delay:.45s}.pd-how[data-stage="2"] [data-band="1"] .cf-band__fill,.pd-how[data-stage="3"] [data-band="1"] .cf-band__fill,.pd-how[data-stage="3"] [data-band="2"] .cf-band__fill{transform:scaleY(1)}.pd-how[data-stage="0"] [data-band="2"] .cf-band__dim,.pd-how[data-stage="0"] [data-band="3"] .cf-band__dim,.pd-how[data-stage="1"] [data-band="2"] .cf-band__dim,.pd-how[data-stage="1"] [data-band="3"] .cf-band__dim,.pd-how[data-stage="2"] [data-band="3"] .cf-band__dim{opacity:.35}.pd-how[data-stage="0"] .cf-ok,.pd-how[data-stage="0"] .cf-state,.pd-how[data-stage="1"] .cf-ok,.pd-how[data-stage="1"] [data-band="2"] .cf-state,.pd-how[data-stage="2"] .cf-ok{opacity:0}.pd-how[data-stage="0"] .cf-ok,.pd-how[data-stage="1"] .cf-ok,.pd-how[data-stage="2"] .cf-ok{transform:translateX(-4px)}.pd-how[data-stage="0"] .cf-event{opacity:0;transform:translateY(4px)}.pd-how[data-stage="0"] .cf-raw,.pd-how[data-stage="1"] .cf-raw{opacity:1}.pd-how[data-stage="0"] .cf-raw:after,.pd-how[data-stage="1"] .cf-raw:after{transform:scaleX(0)}.pd-how[data-stage="0"] .cf-clean,.pd-how[data-stage="1"] .cf-clean{opacity:0;transform:translateY(5px)}.pd-how[data-stage="0"] .cf-field__did,.pd-how[data-stage="1"] .cf-field__did{opacity:0}.pd-how[data-stage="0"] .cf-raw:after,.pd-how[data-stage="0"] :is(.cf-band__mark,.cf-band__fill,.cf-band__dim,.cf-state,.cf-event,.cf-raw,.cf-clean,.cf-field__did,.cf-ok){transition-duration:.25s;transition-delay:0s}}