.pp{--pp-rail-w:360px;--pp-rail-ground:color-mix(in srgb, var(--stone) 55%, var(--white));scroll-margin-top:var(--layout-header)}.pp-head{align-items:start;gap:var(--space-16);margin-bottom:var(--space-head);display:grid}.pp-head-support{max-width:52ch}@media (width>=1024px){.pp-head:has(.pp-head-support){grid-template-columns:minmax(0,1fr) minmax(0,46ch);align-items:end}}.pp-panel{--surface:var(--white);grid-template-columns:var(--pp-rail-w) minmax(0, 1fr);border-radius:var(--radius-block);background:var(--white);box-shadow:0 0 0 1px var(--rule), 0 24px 48px -32px color-mix(in srgb, var(--midnight) 24%, transparent);grid-template-rows:minmax(0,1fr) auto;grid-template-areas:"rail stage""foot stage";display:grid;overflow:hidden}.pp-rail{gap:var(--space-2);min-width:0;padding:var(--space-12) var(--space-12) 0;border:0;flex-direction:column;grid-area:rail;margin:0;list-style:none;display:flex}.pp-rail,.pp-foot{border-right:1px solid var(--rule);background:var(--pp-rail-ground)}.pp-panel-wide{display:block}.pp-panel-wide>.pp-rail{padding:var(--space-16) var(--space-24);border:0;border-top:1px solid var(--rule)}@media (width>=1280px){.pp-panel-wide>.pp-rail{gap:var(--space-24);grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;display:grid}}.pp-foot{padding:var(--space-8) var(--space-16) var(--space-16) var(--space-24);grid-area:foot;display:grid}.pp-stage{--canvas-dots:radial-gradient(var(--mist) 1px, transparent 1px) 0 0 / 16px 16px;--canvas-fade:radial-gradient(ellipse closest-side at center, var(--midnight) 55%, transparent 100%);min-width:0;padding:var(--space-28) var(--space-24);grid-area:stage;place-items:center;display:grid;position:relative}.pp-stage:before{content:"";background:var(--canvas-dots);mask-image:var(--canvas-fade);-webkit-mask-image:var(--canvas-fade);pointer-events:none;position:absolute;inset:0}.pp-stage>*{position:relative}.pp-pane{visibility:hidden;grid-area:1/1;position:relative}@media (width<=900px){.pp{--pp-rail-w:248px}}@media (width<=640px){.pp-panel{grid-template:"rail""stage""foot"/minmax(0,1fr)}.pp-rail{padding-bottom:var(--space-12);border-right:0;border-bottom:1px solid var(--rule);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.pp-foot{padding:var(--space-4) var(--space-16) var(--space-8);border-right:0;border-top:1px solid var(--rule)}.pp-rail:not(fieldset){grid-template-columns:minmax(0,1fr)}.pp[data-js] .pp-panel{background:var(--white)}.pp-stage{padding:var(--space-12) var(--space-12) var(--space-16)}}:root{--product-wash-a:color-mix(in srgb, var(--mist) 70%, var(--sky));--product-wash-b:var(--mint);--product-wash-c:var(--apricot);--product-wash-d:var(--lavender);--product-wash-green-a:color-mix(in srgb, var(--green) 60%, var(--mint));--product-wash-green-b:color-mix(in srgb, var(--sky) 70%, var(--mint));--product-wash-green-c:var(--apricot);--product-wash-green-d:color-mix(in srgb, var(--teal) 30%, var(--mint));--product-wash-lilac-a:color-mix(in srgb, var(--periwinkle) 75%, var(--lavender));--product-wash-lilac-b:var(--lavender);--product-wash-lilac-c:color-mix(in srgb, var(--apricot) 75%, var(--lavender));--product-wash-lilac-d:var(--sky);--product-wash-mix-a:color-mix(in srgb, var(--green) 55%, var(--mint));--product-wash-mix-b:var(--apricot);--product-wash-mix-c:color-mix(in srgb, var(--periwinkle) 60%, var(--lavender));--product-wash-mix-d:var(--mint);--film-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='.8 .8 .8 0 -.7 .8 .8 .8 0 -.7 .8 .8 .8 0 -.7 0 0 0 0 1'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");--film-grain-size:160px;--film-grain-opacity:.32}@layer base{.product-wash{--wash-a:var(--product-wash-a);--wash-b:var(--product-wash-b);--wash-c:var(--product-wash-c);--wash-d:var(--product-wash-d);isolation:isolate;color:var(--ink);background:radial-gradient(72% 82% at 0% 0%, var(--wash-a), transparent 74%), radial-gradient(64% 76% at 100% 24%, var(--wash-b), transparent 74%), radial-gradient(78% 70% at 76% 100%, var(--wash-c), transparent 74%), radial-gradient(60% 66% at 0% 100%, var(--wash-d), transparent 74%), linear-gradient(140deg, color-mix(in srgb, var(--wash-a) 55%, var(--paper)), color-mix(in srgb, var(--wash-b) 45%, var(--paper)), color-mix(in srgb, var(--wash-c) 45%, var(--paper)));position:relative;overflow:clip}.product-wash:after{content:"";z-index:-1;border-radius:inherit;pointer-events:none;background:var(--film-grain) 0 0 / var(--film-grain-size);opacity:var(--film-grain-opacity);mix-blend-mode:overlay;position:absolute;inset:0}.product-wash>*{filter:drop-shadow(var(--shadow-raised))}.product-wash-green{--wash-a:var(--product-wash-green-a);--wash-b:var(--product-wash-green-b);--wash-c:var(--product-wash-green-c);--wash-d:var(--product-wash-green-d)}.product-wash-lilac{--wash-a:var(--product-wash-lilac-a);--wash-b:var(--product-wash-lilac-b);--wash-c:var(--product-wash-lilac-c);--wash-d:var(--product-wash-lilac-d)}.product-wash-mix{--wash-a:var(--product-wash-mix-a);--wash-b:var(--product-wash-mix-b);--wash-c:var(--product-wash-mix-c);--wash-d:var(--product-wash-mix-d)}@media (prefers-reduced-transparency:reduce){.product-wash:after{display:none}}@media (prefers-contrast:more),(forced-colors:active){.product-wash{background:color-mix(in srgb, var(--wash-a) 45%, var(--paper))}.product-wash:after{display:none}}}.jn,.jy-wire,.jy-steps,.jy-rail{--jy-x:28px;--jy-node:56px}.jn{z-index:2;column-gap:var(--space-12);box-sizing:border-box;width:max-content;max-width:100%;min-height:var(--jy-node);padding:var(--space-3) var(--space-20) var(--space-3) var(--space-9);border:1px solid var(--rule);border-radius:var(--radius-control);background:var(--white);grid-template-columns:36px minmax(0,auto);align-content:center;justify-self:start;align-items:center;display:grid;position:relative}.jn .jc-channel{display:contents}.jn :is(.jc-tile,.jn-tile){grid-area:1/1}.jn[data-sub] :is(.jc-tile,.jn-tile){grid-row:1/span 2}.jn :is(.jc-kind,.jn-label){font-size:var(--fs-body);font-weight:var(--weight-semibold);line-height:var(--leading-body);color:var(--midnight);grid-column:2;margin:0}.jn-sub{font-size:var(--fs-small);line-height:var(--leading-body);color:var(--ink-muted);grid-column:2}.jn-diamond{place-items:center;width:36px;height:36px;display:grid}.jn-diamond:before{content:"";border-radius:var(--radius-mark);background:var(--web-flow-split);width:22px;height:22px;transform:rotate(45deg)}.jn-flag,.jn-icon{border-radius:var(--radius-tile);place-items:center;width:36px;height:36px;display:grid}.jn-flag{background:var(--teal-ink);color:var(--white)}.jn-icon{background:var(--tint-mint);color:var(--teal-ink)}.jn[data-kind=goal]{border-color:color-mix(in srgb, var(--teal-ink) 40%, transparent)}.jn[data-size=sm]{min-height:0;padding:var(--space-8);border-radius:var(--radius-control);grid-template-columns:28px}.jn[data-size=sm] .jn-tile{width:28px;height:28px}.jn[data-size=sm] .jn-diamond:before{width:16px;height:16px}.jn[data-size=sm] :is(.jn-flag,.jn-icon){border-radius:var(--radius-tile-sm)}.jn[data-tone=dark]{border-color:var(--night-rule);background:var(--night-2)}.jn[data-tone=dark] :is(.jc-kind,.jn-label){color:var(--on-dark)}.jn[data-tone=dark] .jn-sub{color:var(--on-dark-muted)}.jn[data-lit]{border-color:var(--jy-path)}.jy-wire{--len:var(--space-24);width:var(--jy-wire);height:var(--len);background:var(--jy-line);flex:none;margin-inline-start:calc(var(--jy-x) - var(--jy-wire) / 2);display:block}.jy-wire[data-dir=across]{width:var(--len);height:var(--jy-wire);margin-inline-start:0}.jy-wire[data-tone=dark]{background:var(--jy-line-dark)}.jy-wire[data-lit]{background:var(--jy-path)}.jy-wire[data-dashed]{border-inline-start:var(--jy-wire) dashed var(--jy-tie);background:0 0}.jy-wire[data-dashed][data-dir=across]{border-inline-start:0;border-top:var(--jy-wire) dashed var(--jy-tie)}.jy-steps{margin:0;padding:0;list-style:none;display:grid}.jy-steps>li{row-gap:var(--space-8);padding-bottom:var(--space-24);grid-template-columns:minmax(0,1fr);justify-items:start;display:grid;position:relative}.jy-steps>li:last-child{padding-bottom:0}.jy-steps>li:not(:last-child):before{content:"";z-index:1;top:var(--jy-node);bottom:0;left:calc(var(--jy-x) - var(--jy-wire) / 2);width:var(--jy-wire);background:var(--jy-line);position:absolute}.jy-steps[data-lit]>li:not(:last-child):before{background:var(--jy-path)}.jy-step-line{max-width:46ch;font-size:var(--fs-body);line-height:var(--leading-body);color:var(--ink);text-wrap:pretty;margin:0;padding-inline-start:calc(2 * var(--jy-x))}.jy-steps[data-dir=across]{align-items:center;gap:var(--space-20);flex-wrap:wrap;display:flex}.jy-steps[data-dir=across]>li{padding:0;display:block}.jy-steps[data-dir=across]>li:not(:last-child):before{width:var(--space-20);height:var(--jy-wire);top:50%;bottom:auto;left:100%;transform:translateY(-50%)}.jy-rail{gap:var(--space-16);margin:0;padding:0;list-style:none;display:grid}.jy-rail>li{position:relative}.jy-rail>li+li:before{content:"";bottom:100%;left:calc(var(--jy-x) - var(--jy-wire) / 2);width:var(--jy-wire);height:var(--space-16);background:var(--jy-line-dark);position:absolute}.jy-rail>li+li:not([data-state=next]):before{background:var(--jy-path)}.jy-rail>li[data-state=next] .jn{opacity:.6}.jy-rail>li[data-state=now] .jn{border-color:var(--jy-path)}.jy-rail .jn{padding-inline-end:var(--space-28)}.jy-rail>li[data-state=done] .jn:after{content:"";top:calc(50% - 6px);right:var(--space-10);border:solid var(--jy-path);border-width:0 2px 2px 0;width:5px;height:9px;position:absolute;rotate:45deg}@media (width<=640px),(width>=62.5em) and (width<=75em){.jy-rail{gap:var(--space-12);grid-template-columns:repeat(3,minmax(0,1fr));justify-self:stretch;width:100%;max-width:26rem}.jy-rail .jn{justify-items:center;row-gap:var(--space-4);text-align:center;background:0 0;border-color:#0000;grid-template-columns:minmax(0,1fr);width:100%;min-height:0;padding:0}.jy-rail .jn :is(.jc-tile,.jc-kind){grid-column:1}.jy-rail>li .jn .jc-tile{width:28px;height:28px;padding:var(--space-6);border-radius:var(--radius-tile-sm)}.jy-rail>li .jn .jc-kind{font-size:var(--fs-small);font-weight:var(--weight-regular);grid-row:2}.jy-rail>li[data-state=now] .jn{border-color:#0000}.jy-rail>li[data-state=now] .jc-tile{outline:var(--jy-wire) solid var(--jy-path);outline-offset:3px}.jy-rail>li+li:before{bottom:auto;top:calc(14px - var(--jy-wire) / 2);left:calc(20px - 50% - var(--space-12));width:calc(100% + var(--space-12) - 40px);height:var(--jy-wire)}.jy-rail>li[data-state=done] .jn:after{top:0;left:calc(50% + 20px);right:auto}}
