:root{--red:#e31b23;--ink:#f3f5f8;--mute:#9aa3b2;--line:rgba(255,255,255,.12);--cyan:#7fd8ff}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
body{background:#05070b;color:var(--ink);font:400 15px/1.55 Inter,system-ui,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}

.hero{position:relative;height:100vh;min-height:560px;overflow:hidden;background:#05070b}
.stage{position:absolute;left:50%;top:50%;width:max(100vw,calc(100vh*1376/768));aspect-ratio:1376/768;transform:translate(-50%,-50%);container-type:inline-size}
.stage.shake{animation:shake .35s steps(3)}
@keyframes shake{33%{transform:translate(-50.4%,-49.6%)}66%{transform:translate(-49.6%,-50.3%)}}
.bg{position:absolute;inset:0;width:100%;height:100%}
.row{position:absolute;inset:0}
.parked,.car{position:absolute;bottom:16.2%}
.parked img,.car img{width:100%;display:block;filter:brightness(.8) contrast(1.06) saturate(.92)}
.parked:after,.car:after{content:'';position:absolute;left:4%;right:4%;bottom:-.5cqw;height:1.3cqw;background:radial-gradient(closest-side,rgba(0,0,0,.75),transparent);z-index:-1}
.parked{transition:left .6s ease,width .6s ease,opacity .5s}
.parked.new{opacity:0}
.car{left:5%;width:13.5%;transform-origin:50% 80%;z-index:50}
.car.off:after{opacity:0}
.jets{position:absolute;left:12%;right:12%;bottom:-.3cqw;height:0;opacity:0;z-index:-1}
.jets i{position:absolute;bottom:0;width:4cqw;height:5cqw;margin-left:-2cqw;border-radius:50%;background:radial-gradient(ellipse at 50% 20%,rgba(255,255,255,.95),rgba(200,230,255,.5) 40%,transparent 70%);filter:blur(.3cqw)}
.jets i:nth-child(1){left:8%}.jets i:nth-child(2){left:36%}.jets i:nth-child(3){left:64%}.jets i:nth-child(4){left:92%}
.jets.on{opacity:1}.jets.on i{animation:jet .12s steps(2) infinite alternate}
@keyframes jet{to{height:7cqw;transform:scaleX(1.25)}}
.fx{position:absolute;inset:0;pointer-events:none;z-index:60}
.puff{position:absolute;width:10cqw;height:10cqw;margin:-5cqw 0 0 -5cqw;border-radius:50%;background:radial-gradient(circle,rgba(220,225,235,.75),rgba(160,170,185,.35) 45%,transparent 70%);animation:puff 1.6s ease-out forwards}
@keyframes puff{from{transform:scale(.3)}to{transform:scale(2.4);opacity:0}}
.vig{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(5,7,11,.7),rgba(5,7,11,0) 22%,rgba(5,7,11,0) 70%,rgba(5,7,11,.85))}

header{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:12px;padding:18px 24px;z-index:6}
.live{display:flex;align-items:center;gap:0;font:800 14px Inter;letter-spacing:.06em;box-shadow:0 8px 24px -10px #000}
.live b{background:var(--red);color:#fff;padding:7px 10px;display:flex;align-items:center;gap:7px}
.live b:before{content:'';width:8px;height:8px;border-radius:50%;background:#fff;animation:rec 1s steps(1) infinite}
@keyframes rec{50%{opacity:.2}}
.live span{background:#fff;color:#0a0d12;padding:7px 12px}
.sp{flex:1}
.xl,.ca{display:flex;align-items:center;gap:8px;background:rgba(5,7,11,.7);border:1px solid var(--line);backdrop-filter:blur(8px);border-radius:8px;padding:8px 12px;font:700 12px Inter}
.xl:hover,.ca:hover{border-color:#fff}
.ca code{max-width:330px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 12px 'JetBrains Mono'}
.ca b{color:var(--cyan)}

.cap{position:absolute;left:0;right:0;top:36vh;text-align:center;z-index:5;font:400 clamp(40px,6.4vw,104px)/1 Anton,Impact,sans-serif;letter-spacing:.01em;color:#fff;text-shadow:0 6px 40px rgba(0,0,0,.8);opacity:0;transform:translateY(10px);transition:opacity .4s,transform .4s;pointer-events:none}
.cap.on{opacity:1;transform:none}
.cap small{display:block;font:700 clamp(12px,1.1vw,16px) Inter;letter-spacing:.24em;text-transform:uppercase;color:var(--mute);margin-top:14px}
.cap.bad{color:#ffd0d0}

.gauge{position:absolute;left:3vw;top:82px;width:250px;z-index:5;background:rgba(5,7,11,.72);border:1px solid var(--line);border-radius:16px;padding:14px 16px 12px;backdrop-filter:blur(10px)}
.gauge svg{width:100%;display:block}
.trk,.val{fill:none;stroke-width:14;stroke-linecap:round}
.trk{stroke:rgba(255,255,255,.1)}
.val{stroke:url(#g);stroke:var(--cyan);stroke-dasharray:252;stroke-dashoffset:252;transition:stroke-dashoffset .6s ease,stroke .3s}
.val.full{stroke:#fff;animation:rec .5s steps(1) infinite}
.gv{position:absolute;left:0;right:0;top:62px;text-align:center}
.gv b{font:400 44px/1 Anton;display:block}.gv span{font:700 10px Inter;letter-spacing:.2em;color:var(--mute)}
.gl{text-align:center;font:700 10px Inter;letter-spacing:.24em;color:var(--mute);margin-top:4px}
.feed{position:absolute;left:100%;top:14px;margin-left:12px;width:200px;pointer-events:none}
.feed div{font:700 13px 'JetBrains Mono';white-space:nowrap;animation:fade 2.6s forwards;text-shadow:0 2px 8px #000}
.feed .in{color:var(--cyan)}.feed .out{color:#ff7a7a}
@keyframes fade{0%{opacity:0;transform:translateY(6px)}10%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0;transform:translateY(-14px)}}
.board{position:absolute;right:3vw;top:82px;z-index:5;display:grid;grid-template-columns:repeat(2,150px);gap:8px}
.board div{background:rgba(5,7,11,.72);border:1px solid var(--line);border-radius:12px;padding:10px 12px;backdrop-filter:blur(10px)}
.board span{display:block;font:700 9px Inter;letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
.board b{font:400 30px/1.1 Anton}
.board small{display:block;font:500 11px Inter;color:var(--mute)}

.how{padding:80px 0 30px}
.how h2{font:400 clamp(40px,5vw,68px)/1 Anton;text-align:center}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:34px}
.cols div{border:1px solid var(--line);border-radius:16px;padding:22px;background:rgba(255,255,255,.025)}
.cols b{font:700 12px 'JetBrains Mono';color:var(--cyan)}
.cols h4{font:400 26px Anton;margin:8px 0}
.cols p{color:var(--mute)}
.fine{margin:22px auto 0;max-width:820px;text-align:center;color:#6e7686;font-size:13px}
.logs{padding:30px 0 70px}
.logs .wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:16px}
.lg{border:1px solid var(--line);border-radius:16px;padding:20px;background:rgba(255,255,255,.025)}
.lg h3{font:400 24px Anton;margin-bottom:10px}
.j{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}
.j .tag{font:700 10px Inter;letter-spacing:.12em;padding:4px 8px;border-radius:6px}
.j .ok{background:rgba(127,216,255,.15);color:var(--cyan)}.j .no{background:rgba(255,80,80,.15);color:#ff8a8a}
.j time{color:var(--mute);font:500 12px 'JetBrains Mono'}
.air{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.air div{border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.air span{display:block;font:700 9px Inter;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.air b{font:400 20px Anton}
.a{display:flex;justify-content:space-between;font:500 13px 'JetBrains Mono';padding:4px 0;color:var(--mute)}
.a .in{color:var(--cyan)}.a .out{color:#ff8a8a}
.none{color:var(--mute);padding:6px 0}
footer{display:flex;justify-content:space-between;max-width:1140px;margin:0 auto;padding:22px 24px 40px;border-top:1px solid var(--line);color:#6e7686;font-size:12px}
@media(max-width:900px){
  .hero{height:auto;min-height:0;padding-bottom:16px}
  .stage{position:relative;left:auto;top:auto;transform:none;width:100vw}
  .stage.shake{animation:none}
  .vig{display:none}
  header{padding:12px}.ca code{max-width:100px}
  .cap{top:64px;font-size:30px}
  .gauge,.board{position:relative;left:auto;right:auto;bottom:auto;margin:12px auto 0}
  .gauge{width:240px}.feed{display:none}
  .board{grid-template-columns:repeat(2,1fr);width:calc(100% - 24px)}
  .cols,.logs .wrap{grid-template-columns:1fr}
}