.hfl{--ink: #1a1a2e;--surface: #ffffff;--border: #e4e2de;--muted: #5c5c5c;--brass: #b5935a;--brass-text: #7a5c28;--brass-tint: #f3ece0;--tint: #f3f1ec;--ease: cubic-bezier(.22, .61, .36, 1);width:100%}.hfl__frame{position:relative;display:grid;background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:0 1px 2px #1a1a2e0a,0 12px 32px -18px #1a1a2e2e;overflow:hidden}.hfl__slide{grid-area:1 / 1;padding:28px;opacity:0;transform:translateY(8px);visibility:hidden;transition:opacity .5s var(--ease),transform .5s var(--ease),visibility 0s .5s}.hfl__slide.is-active{opacity:1;transform:none;visibility:visible;transition:opacity .5s var(--ease),transform .5s var(--ease)}.hfl__label{margin:0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass-text)}.hfl__title{margin:12px 0 0;font-size:24px;line-height:1.2;font-weight:500;color:var(--ink)}.hfl__text{margin:10px 0 0;font-size:15px;line-height:1.55;color:var(--muted);max-width:42ch}.hfl-svg{display:block;width:100%;height:auto;margin-top:24px;overflow:visible}.hfl-svg .t{font-family:inherit;font-size:13px;fill:var(--ink)}.hfl-svg .t--sm{font-size:11.5px}.hfl-svg .t--xs{font-size:10px}.hfl-svg .t--b{font-weight:500}.hfl-svg .t--brass{fill:var(--brass-text)}.hfl-svg .t--muted{fill:var(--muted)}.hfl-svg .t--inv{fill:var(--surface)}.hfl-svg .lane-label{letter-spacing:.06em;text-transform:uppercase;font-size:10px}.hfl-svg .node{fill:var(--tint);stroke:var(--border)}.hfl-svg .node--brass{fill:var(--brass-tint);stroke:var(--brass)}.hfl-svg .node--ink{fill:var(--ink);stroke:var(--ink)}.hfl-svg .card{fill:#fdfcfa;stroke:var(--border)}.hfl-svg .band{fill:var(--tint)}.hfl-svg .lane{fill:#e9e6e0}.hfl-svg .doc{fill:var(--surface);stroke:var(--ink);stroke-width:1.4;stroke-linejoin:round}.hfl-svg .line{fill:none;stroke:var(--ink);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.hfl-svg .person{fill:none;stroke:var(--brass-text);stroke-width:1.6;stroke-linecap:round}.hfl-svg .fi{opacity:0;transition:opacity .5s var(--ease) var(--d, 0ms)}.hfl__slide.is-active .fi{opacity:1}.hfl-svg .pop{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.6);transition:opacity .3s var(--ease) var(--d, 0ms),transform .4s var(--ease) var(--d, 0ms)}.hfl__slide.is-active .pop{opacity:1;transform:none}.hfl-svg .draw{fill:none;stroke:var(--brass);stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .7s var(--ease) var(--d, 0ms)}.hfl__slide.is-active .draw{stroke-dashoffset:0}.hfl-svg .tile{fill:var(--surface);stroke:var(--border);transition:fill .4s var(--ease) var(--d, 0ms),stroke .4s var(--ease) var(--d, 0ms)}.hfl__slide.is-active .hit .tile{fill:var(--brass-tint);stroke:var(--brass)}.hfl-svg .flow{fill:none;stroke:var(--brass);stroke-width:1.6;stroke-dasharray:4 6;animation:hfl-flow .9s linear infinite;animation-play-state:paused}.hfl__slide.is-active .flow{animation-play-state:running}@keyframes hfl-flow{to{stroke-dashoffset:-20}}.hfl__rail{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:16px}.hfl__step{appearance:none;border:0;background:none;padding:0;text-align:left;cursor:pointer;font:inherit;color:var(--muted)}.hfl__bar{display:block;height:2px;background:var(--border);border-radius:1px;overflow:hidden}.hfl__bar i{display:block;height:100%;width:0;background:var(--brass)}.hfl__step.is-done .hfl__bar i{width:100%}.hfl__step.is-active .hfl__bar i{animation:hfl-fill linear forwards;animation-duration:var(--dur, 3s)}.hfl.is-paused .hfl__step.is-active .hfl__bar i{animation-play-state:paused}.hfl__name{display:block;font-size:12px;margin-top:8px;white-space:nowrap}.hfl__step.is-active .hfl__name{color:var(--ink)}.hfl__step:focus-visible{outline:2px solid var(--brass);outline-offset:4px;border-radius:2px}@keyframes hfl-fill{0%{width:0}to{width:100%}}.hfl__foot{display:flex;justify-content:flex-end;margin-top:12px}.hfl__btn{appearance:none;border:1px solid var(--border);background:var(--surface);border-radius:15px;padding:4px 12px;font:inherit;font-size:12px;color:var(--ink);cursor:pointer}@media(max-width:480px){.hfl__slide{padding:24px 22px 28px}.hfl__title{font-size:22px}.hfl__name{font-size:11px}}@media(prefers-reduced-motion:reduce){.hfl__slide,.hfl-svg *{transition:none!important;animation:none!important}.hfl__step.is-active .hfl__bar i{animation:none;width:100%}}