:root{color-scheme:dark;--night:#051226;--night-light:#0d2843;--gold:#e9b65d;--gold-soft:#f7d79b;--pearl:#eff4fc}
*{box-sizing:border-box}
html{min-height:100%;background:var(--night)}
body{margin:0;min-height:100vh;min-height:100svh;background:radial-gradient(ellipse at 50% 25%,#193b59 0%,#07192d 47%,#030b17 100%);color:var(--pearl);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;overflow-x:hidden}
.ambient-scene{position:fixed;inset:-28px;background-image:linear-gradient(90deg,rgba(0,9,20,.62),rgba(2,19,36,.10) 40%,rgba(0,7,17,.52)),url('./assets/airport-maintenance.webp');background-position:center;background-size:cover;filter:blur(20px) brightness(.48) saturate(1.15);opacity:.84;transform:scale(1.055);pointer-events:none}
.ambient-scene::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,10,21,.72),transparent 25%,transparent 72%,rgba(1,8,18,.86))}
.maintenance-page{position:relative;z-index:1;min-height:calc(100svh - 36px);display:flex;align-items:center;justify-content:center;flex-direction:column;padding:clamp(12px,2.4vh,32px) 20px 10px}
.frame{width:min(calc(100vw - 40px),calc((100svh - 110px) * 1.5),1536px);max-width:100%;position:relative;flex-shrink:0}
.artwork{position:relative;width:100%;aspect-ratio:3/2;isolation:isolate;overflow:hidden;border:1px solid rgba(253,195,99,.24);border-radius:clamp(10px,1.3vw,22px);background:#071b30;box-shadow:0 25px 100px rgba(0,0,0,.62),0 0 0 1px rgba(255,219,153,.08),inset 0 0 60px rgba(0,0,0,.2)}
.artwork::after{content:"";position:absolute;z-index:4;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 60px rgba(0,0,0,.16),inset 0 0 0 1px rgba(255,226,162,.12)}
.art-picture{position:absolute;inset:0;display:block}
.art-picture img{display:block;width:100%;height:100%;object-fit:contain;transform:scale(1.004);animation:scene-breathe 26s ease-in-out infinite alternate;transform-origin:50% 50%}
.golden-haze{position:absolute;inset:0;z-index:2;background:radial-gradient(ellipse at 29% 75%,rgba(255,193,82,.15),transparent 18%),radial-gradient(ellipse at 87% 58%,rgba(255,183,65,.10),transparent 18%);mix-blend-mode:screen;pointer-events:none;animation:haze-pulse 7s ease-in-out infinite alternate}
.signal-light{position:absolute;z-index:3;display:block;pointer-events:none;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,239,167,.44) 0%,rgba(255,173,45,.24) 18%,rgba(255,160,25,.07) 39%,transparent 72%);mix-blend-mode:screen;animation:beacon-pulse 2.6s ease-in-out infinite}
.signal-light-a{left:27.5%;top:65.8%;width:10%}
.signal-light-b{left:3.7%;top:45.1%;width:9%;animation-delay:1.35s}
.flight-sheen{position:absolute;z-index:2;inset:0;pointer-events:none;background:linear-gradient(106deg,transparent 43%,rgba(255,220,139,.035) 48%,rgba(255,232,172,.085) 50%,rgba(255,220,139,.035) 52%,transparent 57%);background-size:240% 100%;background-position:125% 0;mix-blend-mode:screen;animation:sheen-pass 18s ease-in-out infinite}
.visual-caption{display:flex;align-items:center;gap:12px;width:100%;height:36px;padding:0 8px;color:rgba(242,245,250,.65);font-size:9px;font-weight:700;letter-spacing:.18em;white-space:nowrap}
.caption-line{height:1px;background:linear-gradient(90deg,rgba(235,184,104,.30),transparent);flex:1}
.caption-detail{color:rgba(241,211,165,.65);font-weight:500}
.alive-marker{display:inline-flex;gap:3px;align-items:center}
.alive-marker span,.status-dots i{display:block;background:var(--gold);width:4px;height:4px;border-radius:100%;box-shadow:0 0 10px rgba(240,185,83,.45);animation:dot-breathe 1.65s ease-in-out infinite}
.alive-marker span:nth-child(2),.status-dots i:nth-child(2){animation-delay:.28s}
.alive-marker span:nth-child(3),.status-dots i:nth-child(3){animation-delay:.56s}
.desktop-accessible-notice{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mobile-notice{display:none}
.site-footer{position:relative;z-index:1;height:36px;display:flex;align-items:center;justify-content:center;gap:12px;text-align:center;color:rgba(204,221,237,.48);font-size:10px;letter-spacing:.12em;font-weight:600;padding:0 16px}
@keyframes scene-breathe{0%{transform:scale(1.004) translateY(0)}100%{transform:scale(1.014) translateY(-.12%)}}
@keyframes haze-pulse{0%,100%{opacity:.43}50%{opacity:.95}}
@keyframes beacon-pulse{0%,12%,75%,100%{opacity:.06;transform:translate(-50%,-50%) scale(.55)}24%,38%{opacity:.7;transform:translate(-50%,-50%) scale(1.12)}}
@keyframes sheen-pass{0%,42%,100%{background-position:125% 0;opacity:0}55%{opacity:.75}73%{background-position:-55% 0;opacity:0}}
@keyframes dot-breathe{0%,65%,100%{opacity:.25;transform:scale(.75)}28%{opacity:1;transform:scale(1.2)}}
@media (min-aspect-ratio:20/11) and (min-width:681px){.frame{width:min(calc((100svh - 94px) * 1.5),1536px)}}
@media (max-width:680px){
  body{min-height:100svh}
  .ambient-scene{filter:blur(36px) brightness(.37);opacity:.75}
  .maintenance-page{min-height:calc(100svh - 39px);display:flex;justify-content:center;padding:16px 14px 12px;gap:0}
  .frame{width:100%;max-width:550px}
  .artwork{border-radius:13px;box-shadow:0 14px 48px rgba(0,0,0,.55)}
  .visual-caption{height:27px;padding:0 2px;font-size:7px;gap:7px;letter-spacing:.11em}
  .mobile-notice{display:block;width:min(100%,550px);margin-top:22px;padding:22px 22px 20px;border:1px solid rgba(235,183,100,.24);border-radius:17px;background:linear-gradient(155deg,rgba(8,26,46,.94),rgba(4,14,29,.94));box-shadow:0 18px 35px rgba(0,0,0,.26)}
  .eyebrow{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.2em;font-size:10px;color:var(--gold-soft)}
  .eyebrow-dot{width:7px;height:7px;background:var(--gold);border-radius:50%;box-shadow:0 0 16px rgba(239,172,73,.9);animation:dot-breathe 2s ease-in-out infinite}
  .mobile-notice h1{font-size:clamp(25px,7vw,38px);line-height:1.13;margin:14px 0;letter-spacing:-.035em;font-weight:780}
  .mobile-notice h1 span{color:var(--gold)}
  .mobile-notice p{font-size:clamp(13px,3.8vw,15px);line-height:1.6;margin:0;color:#cfdeec}
  .mobile-notice .thanks{margin-top:10px;color:#f4d49d}
  .mobile-status{display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(240,200,130,.16);margin-top:18px;padding-top:14px;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(234,242,251,.75)}
  .status-dots{display:flex;gap:6px}
  .status-dots i{width:5px;height:5px}
  .site-footer{min-height:39px;height:auto;font-size:8px;line-height:1.6;letter-spacing:.05em;gap:6px}
}
@media(max-width:380px){.maintenance-page{padding-left:10px;padding-right:10px}.mobile-notice{margin-top:12px;padding:16px}.mobile-notice h1{font-size:24px}}
@media(max-height:700px) and (max-width:680px){.maintenance-page{justify-content:flex-start}.mobile-notice{margin-top:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}
