.hb{--hb-lime:#cddc39;--hb-ink:#141712;--hb-on-dark:#e8eee4;--hb-on-dark-muted:#a8b3a1;--hb-display:var(--font-oswald), "Arial Narrow", sans-serif;--hb-mono:var(--font-plex-mono), ui-monospace, Consolas, monospace;--hb-ease:cubic-bezier(.22, .61, .36, 1);--hb-gutter:clamp(16px, 2.2vw, 28px);--hb-max:1440px;--hb-pad:max(24px, calc((100% - var(--hb-max)) / 2));height:560vh;position:relative}.hb *,.hb :before,.hb :after{box-sizing:border-box}.hb-pin{height:100svh;position:sticky;top:0}.hb-shell{width:100%;height:100%;position:relative;overflow:hidden}.hb-canvas{background:#2c3429;width:100%;height:100%;display:block;position:absolute;inset:0}.hb-veil{z-index:20;opacity:calc(var(--exit,0) * .55);pointer-events:none;background:#0b0f0a;position:absolute;inset:0}.hb-copy{z-index:5;left:var(--hb-pad);gap:24px;width:min(520px,40%);display:grid;position:absolute;top:clamp(96px,14%,140px)}.hb-copy:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(closest-side,#0c1210cc,#0c12108c 55%,#0c121000);position:absolute;inset:-64px -120px -64px -64px}.hb-copy p{color:var(--hb-on-dark);text-shadow:0 1px 14px #0a0e0ce6;max-width:44ch;margin:0;font-size:15.5px;line-height:1.6}.hb-title{font:500 clamp(40px, 5.2vw, 76px)/1 var(--hb-display);text-transform:uppercase;color:#f5f8f2;margin:0}.hb-title em{color:var(--hb-lime);font-style:normal}.hb-btn{background:var(--hb-lime);color:var(--hb-ink);font:500 13px/1 var(--hb-mono);letter-spacing:.06em;text-transform:uppercase;transition:filter .18s var(--hb-ease);border-radius:2px;justify-self:start;align-items:center;padding:14px 20px;text-decoration:none;display:inline-flex}.hb-btn:hover{filter:brightness(1.06)}.hb-log{z-index:6;left:var(--hb-pad);width:min(440px,40%);color:var(--hb-on-dark);gap:10px;display:grid;position:absolute;bottom:24px}.hb-log-head{justify-content:space-between;align-items:baseline;gap:16px;display:flex}.hb-now{align-items:baseline;gap:12px;margin:0;display:flex}.hb-step{font:500 13px/1 var(--hb-mono);color:var(--hb-lime);letter-spacing:.06em}.hb-name{font:500 26px/1 var(--hb-display);text-transform:uppercase;color:#fff}.hb-meta{font:500 12px/1 var(--hb-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--hb-on-dark-muted);font-variant-numeric:tabular-nums;gap:16px;margin:0;display:flex}.hb-meta b{color:#fff;font-weight:500}.hb-tape{background:#e8eee41f repeating-linear-gradient(90deg,#e8eee459 0 1px,#0000 1px 10%);border-radius:2px;height:10px;position:relative;overflow:hidden}.hb-tape i{background:var(--hb-lime);transform-origin:0;transform:scaleX(var(--p,0));position:absolute;inset:0}.hb-stages{font:500 12px/1.2 var(--hb-mono);letter-spacing:.04em;text-transform:uppercase;grid-template-columns:repeat(5,1fr);margin:0;padding:0;list-style:none;display:grid}.hb-stages li{color:#e8eee473;transition:color .3s var(--hb-ease)}.hb-stages li.done{color:var(--hb-on-dark-muted)}.hb-stages li.now{color:var(--hb-lime)}.hb-cue{z-index:6;font:500 12px/1 var(--hb-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--hb-on-dark);opacity:calc(1 - var(--p,0) * 30);pointer-events:none;align-items:center;gap:10px;margin:0;display:flex;position:absolute;bottom:26px;left:50%;transform:translate(-50%)}.hb-cue i{background:linear-gradient(var(--hb-lime), transparent);width:1px;height:30px;animation:hb-cue 1.8s var(--hb-ease) infinite;transform-origin:top}@keyframes hb-cue{0%{transform:scaleY(0)}60%{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(1)}}.hb-handover{z-index:7;right:var(--hb-pad);-webkit-backdrop-filter:blur(12px);width:min(360px,32%);color:var(--hb-on-dark);opacity:0;visibility:hidden;transition:opacity .6s var(--hb-ease), transform .6s var(--hb-ease), visibility 0s .6s;background:#0c1214b8;border:1px solid #e8eee429;border-radius:6px;justify-items:start;gap:8px;padding:20px 22px 22px;display:grid;position:absolute;bottom:24px;transform:translateY(16px)}.hb.is-done .hb-handover{opacity:1;visibility:visible;transition:opacity .6s var(--hb-ease), transform .6s var(--hb-ease), visibility 0s;transform:none}.hb-kicker{font:500 12px/1.2 var(--hb-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--hb-lime);margin:0}.hb-hv-title{font:500 26px/1.05 var(--hb-display);text-transform:uppercase;color:#fff;margin:0}.hb-hv-text{color:var(--hb-on-dark-muted);margin:0 0 8px;font-size:14px;line-height:1.5}.hb-after{z-index:3;background:#e6ebe3;border-radius:28px 28px 0 0;margin-top:-100svh;position:relative;box-shadow:0 -24px 60px #080c0747}@media (max-width:980px){.hb{height:470vh}.hb-copy{width:auto;opacity:calc(1 - var(--p,0) * 9);transform:translateY(calc(var(--p,0) * -120px));gap:18px;top:92px;left:16px;right:16px}.hb-title{font-size:clamp(34px,9.5vw,52px)}.hb-log{width:auto;bottom:16px;left:16px;right:16px}.hb-name{font-size:22px}.hb-stages{font-size:11px}.hb-handover{width:auto;bottom:16px;left:16px;right:16px}.hb.is-done .hb-log{opacity:0}.hb-cue{bottom:128px}}@media (max-width:640px){.hb-stages li:not(.now){display:none}.hb-stages li.now{grid-column:1/-1}}@media (prefers-reduced-motion:reduce){.hb{height:auto}.hb-pin{height:min(100svh,920px);min-height:640px;position:relative}.hb-after{box-shadow:none;border-radius:0;margin-top:0}.hb-cue,.hb-tape{display:none}}