.hn-lab{padding-block:clamp(4rem,10vw,6rem)}.hn-lab-grid{gap:2rem;display:grid}.hn-lab-panel{display:contents}.hn-lab-panel>.hn-eyebrow{order:1}.hn-lab-title{order:2}.hn-lab-intro{order:3}.hn-lab-display{order:4}.hn-lab-list-wrap{order:5}.hn-lab-title{color:var(--hn-white);margin-top:-1rem;font-size:clamp(2.4rem,6.4vw,4.5rem)}.hn-lab-intro{max-width:30rem;color:var(--hn-muted);margin-top:-.75rem;font-size:clamp(1.02rem,1.3vw,1.15rem);line-height:1.55}.hn-lab-display{min-width:0;display:none}.hn-js .hn-lab-display{flex-direction:column;gap:.85rem;display:flex}.hn-lab-screen{aspect-ratio:5/4;border:1px solid var(--hn-faint);background:radial-gradient(ellipse 80% 70% at 50% 45%, oklch(31.83% .0493 197.07/.9), transparent 75%), var(--hn-ink);border-radius:1rem;position:relative;overflow:hidden}.hn-lab-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.hn-lab-corner{pointer-events:none;border:0 solid oklch(100% 0 0/.35);width:.9rem;height:.9rem;position:absolute}.hn-lab-corner-tl{border-top-width:1px;border-left-width:1px;top:.85rem;left:.85rem}.hn-lab-corner-tr{border-top-width:1px;border-right-width:1px;top:.85rem;right:.85rem}.hn-lab-corner-bl{border-bottom-width:1px;border-left-width:1px;bottom:.85rem;left:.85rem}.hn-lab-corner-br{border-bottom-width:1px;border-right-width:1px;bottom:.85rem;right:.85rem}.hn-lab-readout{letter-spacing:.14em;text-transform:uppercase;color:oklch(100% 0 0/.45);align-items:center;gap:.6rem;min-height:1.2em;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:.6875rem;line-height:1.6;display:flex}.hn-lab-readout>span:last-child{transition:opacity .3s var(--hn-ease)}.hn-lab-readout-live{background:var(--hn-neon);border-radius:9999px;flex-shrink:0;align-self:flex-start;width:.4rem;height:.4rem;margin-top:.4em;box-shadow:0 0 .5rem oklch(64.76% .2041 11.06/.8)}.hn-lab-list-wrap{position:relative}.hn-lab-list{border-top:1px solid var(--hn-faint);margin:0;padding:0;list-style:none}.hn-lab-item{border-bottom:1px solid var(--hn-faint)}.hn-lab-item-heading{margin:0}.hn-lab-item-button{text-align:left;width:100%;color:var(--hn-white);cursor:pointer;font:inherit;background:0 0;border:0;border-radius:.25rem;grid-template-columns:2.5rem minmax(0,1fr) .75rem;align-items:baseline;gap:.5rem;padding:1.05rem 0;display:grid}.hn-lab-item-button:focus-visible{outline:2px solid var(--hn-neon);outline-offset:3px}.hn-lab-item-index{letter-spacing:.1em;color:var(--hn-orange);font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:.75rem}.hn-lab-item-title{font-family:var(--hn-font-display);transition:color .45s var(--hn-ease);font-size:clamp(1.05rem,1.35vw,1.25rem);font-weight:700;line-height:1.25}.hn-lab-item-dot{background:var(--hn-neon);opacity:0;width:.5rem;height:.5rem;transition:opacity .4s var(--hn-ease), transform .5s var(--hn-ease);border-radius:9999px;align-self:center;transform:scale(.2);box-shadow:0 0 .7rem .15rem oklch(64.76% .2041 11.06/.7)}.hn-lab-item-body{transition:grid-template-rows .55s var(--hn-ease), opacity .45s var(--hn-ease);grid-template-rows:1fr;display:grid}.hn-lab-item-body-inner{min-height:0;padding-left:3rem;overflow:hidden}.hn-lab-item-desc{max-width:28rem;color:var(--hn-muted);font-size:.975rem;line-height:1.55}.hn-lab-item-tag{letter-spacing:.14em;text-transform:uppercase;color:var(--hn-orange);margin:.7rem 0 1.25rem;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:.6875rem}[data-hn-lab-ready] .hn-lab-item .hn-lab-item-title{color:oklch(100% 0 0/.5)}[data-hn-lab-ready] .hn-lab-item-button:hover .hn-lab-item-title{color:oklch(100% 0 0/.8)}[data-hn-lab-ready] .hn-lab-item:not(.is-active) .hn-lab-item-body{opacity:0;grid-template-rows:0fr}[data-hn-lab-ready] .hn-lab-item.is-active .hn-lab-item-title{color:var(--hn-white)}[data-hn-lab-ready] .hn-lab-item.is-active .hn-lab-item-dot{opacity:1;transform:scale(1)}.hn-lab-thread{display:none}@media (width>=640px) and (width<=1023px){.hn-lab-screen{aspect-ratio:16/10}}@media (width>=1024px){.hn-lab{padding-block:0}.hn-lab-pin{min-height:100vh;padding-top:var(--hn-header);align-items:center;display:flex}.hn-lab-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;column-gap:clamp(2.5rem,5vw,5.5rem);padding-block:2rem}.hn-lab-panel{display:block}.hn-lab-display{order:0}.hn-lab-screen{aspect-ratio:5/4;max-height:min(calc(100vh - var(--hn-header) - 7rem), 44rem);min-height:24rem}[data-hn-lab-mode=pin] .hn-lab-item-dot{display:none}.hn-lab-title{margin-top:1rem;font-size:clamp(2.4rem,3.6vw,3.6rem)}.hn-lab-intro{margin-top:1.25rem}.hn-lab-list-wrap{margin-top:clamp(1.5rem,3.5vh,2.5rem)}[data-hn-lab-mode=pin] .hn-lab-thread{background:var(--hn-faint);width:1px;display:block;position:absolute;top:0;bottom:0;left:-1.5rem}.hn-lab-thread-fill{background:var(--hn-neon);transform-origin:50% 0;position:absolute;inset:0;transform:scaleY(0)}.hn-lab-thread-spark{background:var(--hn-neon);border-radius:9999px;width:7px;height:7px;position:absolute;top:0;left:-3px;box-shadow:0 0 12px 3px oklch(64.76% .2041 11.06/.7)}}@media (width>=1024px) and (height<=760px){.hn-lab-item-button{padding:.75rem 0}.hn-lab-title{font-size:clamp(2rem,3vw,2.8rem)}.hn-lab-intro{margin-top:.9rem;font-size:1rem}}@media (width<=1023px){.lab-page .hn-lab{padding-top:calc(var(--hn-header) + 2.5rem)}}.lab-cta{border-top:1px solid var(--hn-faint);padding-block:clamp(4rem,10vw,8rem)}.lab-cta-title{max-width:18ch;color:var(--hn-white);margin-top:1rem;font-size:clamp(2.2rem,5vw,4rem)}.lab-cta-text{max-width:34rem;color:var(--hn-muted);margin-top:1.25rem;font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.55}.lab-cta-actions{flex-wrap:wrap;gap:.75rem;margin-top:2rem;display:flex}