.walk-card{--walk-ground:hsl(var(--foreground));--walk-light:hsl(var(--background));--walk-dark:hsl(var(--foreground));background:var(--walk-ground);color:var(--walk-light);isolation:isolate;border-radius:26px;flex-direction:column;min-height:560px;padding:30px 28px 24px;animation:.5s both walk-rise;display:flex;position:relative;container:walk/inline-size}.dark .walk-card{--walk-ground:hsl(var(--card));--walk-light:hsl(var(--foreground));--walk-dark:hsl(var(--background));border:1px solid hsl(var(--border))}.walk-card:before{content:"";z-index:-1;border-radius:inherit;opacity:.13;pointer-events:none;background-image:radial-gradient(currentColor .5px,#0000 .7px);background-size:4px 4px;position:absolute;inset:0}.walk-card [hidden]{display:none!important}.walk-rail{--walk-dot:46px;height:var(--walk-dot);flex:none;position:relative}.walk-shapes{pointer-events:none;width:100%;position:absolute;inset:0;overflow:visible}.walk-shapes path,.walk-shapes circle{stroke:var(--walk-light);stroke-width:2px;stroke-linejoin:round;fill:none}.walk-shapes path,.walk-shapes circle[data-fill=true]{fill:var(--walk-light)}.walk-shapes circle[data-hidden=true]{display:none}.walk-layer{height:var(--walk-dot);margin:0;padding:0;list-style:none;position:relative}.walk-layer li{position:absolute;top:0;left:0}.walk-layer button{width:var(--walk-dot);height:var(--walk-dot);color:var(--walk-light);cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;display:grid}.walk-layer li[data-state=done] button,.walk-layer li[data-inside=true] button{color:var(--walk-dark)}.walk-layer button:focus-visible{outline:2px solid var(--walk-light);outline-offset:4px}.walk-label,.walk-measure{font-family:var(--font-display);white-space:nowrap;letter-spacing:-.02em;font-weight:650}.walk-label{height:var(--walk-dot);color:var(--walk-dark);pointer-events:none;opacity:0;justify-content:center;align-items:center;display:flex;position:absolute;top:0;left:0;overflow:hidden}.walk-measure{visibility:hidden;pointer-events:none;width:max-content;position:absolute}.walk-panel{flex:1;margin-top:28px}.walk-copy{animation:.3s both walk-copy}.walk-visual{min-height:238px}.walk-foot{flex-wrap:wrap;align-items:center;gap:8px;margin-top:26px;display:flex}.walk-count{align-items:center;gap:10px;margin-right:auto;display:inline-flex}.walk-count-num{font-family:var(--font-mono);letter-spacing:.1em;opacity:.85;font-size:12.5px}.walk-count-bar{gap:3px;display:inline-flex}.walk-count-bar span{opacity:.18;background:currentColor;border-radius:999px;width:15px;height:3px}.walk-count-bar span[data-on=true]{opacity:1;background:hsl(var(--primary))}.walk-back,.walk-next{border-radius:999px;justify-content:center;align-items:center;gap:8px;min-height:44px;padding:10px 20px;font-size:14px;font-weight:600;display:inline-flex}.walk-back{color:inherit;background:0 0;border:1px solid}.walk-back:disabled{opacity:.45;cursor:default}.walk-next{background:hsl(var(--primary));color:hsl(var(--primary-foreground));border:1px solid #0000}.walk-next:hover{filter:brightness(1.08)}.walk-final{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:24px;animation:.45s both walk-copy;display:flex}.walk-final-check{border:2px solid;border-radius:50%;place-items:center;width:46px;height:46px;display:grid}.walk-final-check path{stroke-dasharray:24;stroke-dashoffset:24px;animation:.55s .18s forwards walk-draw}@keyframes walk-rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes walk-copy{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes walk-draw{to{stroke-dashoffset:0}}@container walk (width<420px){.walk-rail{--walk-dot:40px}.walk-count{flex:1 0 100%;margin-bottom:6px}.walk-back,.walk-next{flex:1}}@container walk (width<300px){.walk-rail{--walk-dot:34px}.walk-layer svg{width:17px;height:17px}}@media (prefers-reduced-motion:reduce){.walk-card,.walk-copy,.walk-final{animation:none}.walk-final-check path{stroke-dashoffset:0;animation:none}}
