.hiw-root{padding:4rem 1rem;position:relative}@media (width>=640px){.hiw-root{padding:6rem 1.5rem}}.hiw-pattern{opacity:.03;pointer-events:none;background-image:repeating-linear-gradient(-45deg, transparent, transparent 40px, oklch(from var(--background) l c h) 40px, oklch(from var(--background) l c h) 41px);position:absolute;inset:0}.hiw-container{z-index:10;max-width:1280px;margin-inline:auto;position:relative}.hiw-header{margin-bottom:4rem}@media (width>=1024px){.hiw-header{margin-bottom:6rem}}.hiw-eyebrow{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:oklch(from var(--background) l c h / .5);align-items:center;gap:.75rem;margin-bottom:1.5rem;font-size:.6875rem;font-weight:500;display:inline-flex}.hiw-eyebrow-line{background:oklch(from var(--background) l c h / .3);width:2rem;height:1px;display:inline-block}.hiw-heading{font-family:var(--font-space-grotesk);letter-spacing:-.02em;color:var(--background);opacity:0;transition:opacity .7s var(--ease-out,cubic-bezier(.16, 1, .3, 1)), transform .7s var(--ease-out,cubic-bezier(.16, 1, .3, 1));font-size:clamp(1.75rem,3.5vw,2.75rem);font-weight:500;line-height:1.15;transform:translateY(1rem)}.hiw-heading--visible{opacity:1;transform:none}.hiw-heading-faded{color:oklch(from var(--background) l c h / .45)}.hiw-description{color:oklch(from var(--background) l c h / .55);max-width:52ch;font-size:.9375rem;line-height:1.72}.hiw-body{grid-template-columns:1fr;gap:3rem;display:grid}@media (width>=1024px){.hiw-body{grid-template-columns:1fr 1fr;gap:6rem}}.hiw-steps{flex-direction:column;display:flex}.hiw-step{text-align:left;cursor:pointer;border:none;border-bottom:1px solid oklch(from var(--background) l c h / .1);opacity:.4;width:100%;transition:opacity .5s var(--ease-out,cubic-bezier(.16, 1, .3, 1));background:0 0;padding:2rem 0}.hiw-step:hover{opacity:.7}.hiw-step--active{opacity:1}.hiw-step-inner{align-items:flex-start;gap:1.5rem;display:flex}.hiw-step-number{font-family:var(--font-space-grotesk);color:oklch(from var(--background) l c h / .25);flex-shrink:0;padding-top:.3rem;font-size:1.875rem;font-weight:500;line-height:1}.hiw-step-content{flex:1}.hiw-step-title{font-family:var(--font-space-grotesk);color:var(--background);transition:transform .3s var(--ease-out,cubic-bezier(.16, 1, .3, 1));margin-bottom:.625rem;font-size:clamp(1.25rem,2.5vw,1.625rem);font-weight:500}.hiw-step--active .hiw-step-title,.hiw-step:hover .hiw-step-title{transform:translate(4px)}.hiw-step-desc{color:oklch(from var(--background) l c h / .55);font-size:.9375rem;line-height:1.72}.hiw-progress{background:oklch(from var(--background) l c h / .15);height:1px;margin-top:1rem;overflow:hidden}.hiw-progress-bar{background:var(--background);width:0;height:100%;animation:linear forwards hiw-progress}@keyframes hiw-progress{0%{width:0%}to{width:100%}}.hiw-panel{border:1px solid oklch(from var(--background) l c h / .1);background:oklch(from var(--background) l c h / .04);border-radius:.75rem;overflow:hidden}@media (width>=1024px){.hiw-panel{align-self:start;position:sticky;top:8rem}}.hiw-panel-header{border-bottom:1px solid oklch(from var(--background) l c h / .1);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex}.hiw-dots{gap:.5rem;display:flex}.hiw-dot{background:oklch(from var(--background) l c h / .18);border-radius:9999px;width:.75rem;height:.75rem}.hiw-panel-filename{font-family:var(--font-mono);letter-spacing:.04em;color:oklch(from var(--background) l c h / .35);font-size:.6875rem}.hiw-code-wrap{min-height:280px;padding:2rem}.hiw-code{font-family:var(--font-mono);color:oklch(from var(--background) l c h / .65);white-space:pre;margin:0;font-size:.8125rem;line-height:2}.hiw-code-line{opacity:0;animation:.4s cubic-bezier(.22,1,.36,1) forwards hiw-line-reveal;display:flex;transform:translate(-8px)}@keyframes hiw-line-reveal{to{opacity:1;transform:none}}.hiw-lineno{user-select:none;width:2rem;color:oklch(from var(--background) l c h / .2);flex-shrink:0;display:inline-block}.hiw-line-text{flex-wrap:nowrap;display:inline-flex}.hiw-char{opacity:0;filter:blur(8px);animation:.3s cubic-bezier(.22,1,.36,1) forwards hiw-char-reveal}@keyframes hiw-char-reveal{to{opacity:1;filter:blur()}}.hiw-panel-footer{border-top:1px solid oklch(from var(--background) l c h / .1);align-items:center;gap:.75rem;padding:1rem 1.5rem;display:flex}.hiw-status-dot{background:#4ade80;border-radius:9999px;width:.5rem;height:.5rem;animation:2s ease-in-out infinite hiw-pulse}@keyframes hiw-pulse{0%,to{opacity:1}50%{opacity:.5}}.hiw-status-text{font-family:var(--font-mono);color:oklch(from var(--background) l c h / .35);font-size:.6875rem}@media (prefers-reduced-motion:reduce){.hiw-heading{opacity:1;transition:none;transform:none}.hiw-step,.hiw-step-title{transition:none}.hiw-code-line{opacity:1;animation:none;transform:none}.hiw-char{opacity:1;filter:none;animation:none}.hiw-progress-bar{width:100%;animation:none}.hiw-status-dot{animation:none}}