.hl-hero{--hl-amber:#ffa91f;--hl-paper:#f4efe6;--hl-blue:#5aa6ff;--hl-muted:#7f97ad;--hl-board:#04101d;--hl-tile:#0d1d30;--hl-tilt:58deg;--hl-mono:var(--font-board)}
.hl-hero .hero-wrap{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);min-height:660px;gap:28px}
.hl-hero h1{margin:0}
.hl-hero h1 span{display:block;color:var(--orange)}
.hero-features{display:grid;grid-template-columns:repeat(2,max-content);gap:14px 30px;margin:34px 0 0;padding:0;list-style:none;color:#d7e4ed;font-size:1.08rem;font-weight:600}
.hero-features li{display:flex;align-items:center;gap:11px}
.hero-features svg{flex:none;width:22px;height:22px;color:var(--hl-paper);opacity:.72}
.hl-hero .hero-actions{margin-top:44px}
.hl-scene{--hl-view:1000;--hl-shift:0px;position:relative;width:100%;aspect-ratio:1000/690;align-self:center;margin-block:40px}
.hl-stage{position:absolute;left:0;top:0;width:1000px;height:780px;transform:scale(var(--k,.6)) translate(var(--hl-shift),-90px);transform-origin:0 0;perspective:2200px;perspective-origin:50% 20%}

.hl-backdrop{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:var(--hl-paper);stroke-width:1;opacity:.11;-webkit-mask-image:linear-gradient(#000 35%,transparent 85%);mask-image:linear-gradient(#000 35%,transparent 85%)}

.hl-board{position:absolute;left:84px;top:104px;width:832px;padding:16px 22px 18px;background:var(--hl-board);border:1px solid #f4efe62e;border-radius:12px;box-shadow:0 30px 70px #00000066,inset 0 1px 0 #ffffff12;font:700 19px/1 var(--hl-mono);color:var(--hl-paper)}
.hl-board::before,.hl-board::after{content:"";position:absolute;bottom:-46px;width:2px;height:46px;background:#f4efe633}
.hl-board::before{left:14%}.hl-board::after{right:14%}
.hl-board-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:13px;margin-bottom:12px;border-bottom:1px solid #f4efe61f}
.hl-board-title{color:var(--hl-amber);font-size:22px;letter-spacing:.14em}
.hl-live{display:flex;align-items:center;gap:9px;color:var(--hl-muted);font-size:13px;letter-spacing:.18em}
.hl-live::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--hl-amber);box-shadow:0 0 10px var(--hl-amber);animation:hl-pulse 2.4s ease-in-out infinite}
.hl-cols,.hl-row{display:grid;grid-template-columns:100px 160px 140px 340px;column-gap:16px}
.hl-cols{padding-bottom:9px;color:var(--hl-muted);font-size:12px;letter-spacing:.18em}
.hl-window{height:220px;overflow:hidden}
.hl-row{position:relative;height:44px;align-items:center;transition:opacity .5s}
.hl-row::before{content:"";position:absolute;left:-14px;top:8px;bottom:8px;width:3px;border-radius:2px;background:var(--hl-amber);box-shadow:0 0 10px var(--hl-amber);opacity:0;transition:opacity .3s}
.hl-row.is-active::before{opacity:1}
.hl-row.is-done{opacity:.55}
.hl-row.is-leaving{opacity:0}
.hl-cell{display:flex;gap:2px}
.hl-t{position:relative;display:grid;place-items:center;width:18px;height:32px;background:var(--hl-tile);border-radius:3px;transition:color .3s}
.hl-t::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:#00000099}
.hl-cell.c-amber{color:var(--hl-amber)}
.hl-cell.c-blue{color:var(--hl-blue)}
.hl-cell.c-muted{color:var(--hl-muted)}

.hl-plane{position:absolute;left:0;top:220px;width:1000px;height:560px;transform-origin:50% 100%;transform:rotateX(var(--hl-tilt));transform-style:preserve-3d}
.hl-floor{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke:var(--hl-paper);stroke-width:1.4}
.hl-floor-label{fill:var(--hl-paper);stroke:none;font:600 14px var(--hl-mono);letter-spacing:.16em;opacity:.45}

.hl-car{--c:var(--hl-paper);position:absolute;left:0;top:0;transform-style:preserve-3d;will-change:transform}
.hl-car.is-hot{--c:var(--hl-amber)}
.hl-f{position:absolute;left:0;top:0;box-sizing:border-box;transform-origin:0 0;border:1.5px solid var(--c);background:#0a2038;opacity:var(--o,1);transition:border-color .35s,box-shadow .35s}
.hl-car.is-hot .hl-f{box-shadow:0 0 12px #ffa91f40}
.hl-top.hl-body{background:#0c2642}
.hl-top.hl-cabin{background:#0e2a48}
.hl-cabin.hl-side::after,.hl-cabin.hl-front::after,.hl-cabin.hl-back::after{content:"";position:absolute;inset:3px 5px 2px;border:1px solid var(--c);border-radius:2px;background:#f4efe60f;opacity:.7}
.hl-cabin.hl-front::after,.hl-cabin.hl-back::after{inset:5px 2px}
.hl-body.hl-front::before,.hl-body.hl-front::after,.hl-body.hl-back::before,.hl-body.hl-back::after{content:"";position:absolute;left:5px;width:4px;height:9px;border-radius:1px;background:var(--hl-paper)}
.hl-body.hl-back::before,.hl-body.hl-back::after{background:var(--hl-amber)}
.hl-body.hl-front::before,.hl-body.hl-back::before{top:4px}
.hl-body.hl-front::after,.hl-body.hl-back::after{bottom:4px}
.hl-wheel{border-radius:5px;background:#020b15}
.hl-f.hl-scan{border:0;background:linear-gradient(90deg,#ffa91f00,#ffa91fd9 45%,#ffe2a8 55%,#ffa91f00);box-shadow:0 0 18px #ffa91f80;opacity:0}

.hl-tag,.hl-psign{position:absolute;left:0;top:0;transform-origin:50% 100%;pointer-events:none}
.hl-tag{padding:6px 11px;border:1.5px solid var(--hl-amber);border-radius:7px;background:#05182bf0;color:var(--hl-amber);font:700 21px/1 var(--hl-mono);letter-spacing:.06em;white-space:nowrap;opacity:0}
.hl-psign{display:flex;flex-direction:column;align-items:center}
.hl-psign b{display:grid;place-items:center;width:44px;height:44px;border:2px solid var(--hl-blue);border-radius:7px;color:var(--hl-blue);font:800 28px/1 var(--font-body)}
.hl-psign i{width:2px;height:56px;background:#5aa6ff99}

.hl-gate-arm{position:absolute;left:-3px;top:0;width:6px;height:176px;transform-origin:3px 0;border-radius:3px;background:repeating-linear-gradient(180deg,var(--hl-amber) 0 16px,var(--hl-paper) 16px 32px);opacity:.85}

.hl-canvas,.hl-tags{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hl-tags{overflow:hidden}
.hl-tags .hl-tag{padding:4px 8px;border-width:1px;border-radius:5px;font-size:13px;transform-origin:50% 100%}

.hl-labnav{position:fixed;right:18px;bottom:18px;z-index:50;display:flex;gap:4px;padding:4px;border:1px solid #f4efe633;border-radius:999px;background:#04101de6;font:600 .8rem/1 var(--font-body)}
.hl-labnav a{padding:8px 14px;border-radius:999px;color:#c9d6e2}
.hl-labnav a[aria-current]{background:#ffa91f;color:#092340}

@keyframes hl-pulse{50%{opacity:.35}}

@media(max-width:850px){
 .hl-hero .hero-wrap{grid-template-columns:1fr;min-height:auto}
 .hl-scene{order:-1;width:calc(100% + 34px);margin:28px -17px 0}
 .hl-hero .hero-text{padding:8px 0 64px}
}
@media(max-width:640px){
 .hl-scene{--hl-view:760;--hl-shift:-120px;aspect-ratio:760/690}
 .hl-board{left:142px;width:716px}
 .hl-cols,.hl-row{grid-template-columns:160px 140px 340px}
 .hl-cols>span:first-child,.hl-row>.hl-cell:first-child{display:none}
}
@media(max-width:480px){
 .hero-features{grid-template-columns:1fr;gap:10px;font-size:1rem}
}
@media(prefers-reduced-motion:reduce){
 .hl-live::before{animation:none}
}
