:root {color-scheme:dark;--cyan:#79dfeb;--carbon:repeating-linear-gradient(135deg,#16191d 0 4px,#292e35 4px 6px)}
* {box-sizing:border-box}
[hidden] {display:none!important}
body {margin:0;background:#080e12;color:#e5ecf2;font:15px system-ui,sans-serif}
main {max-width:1280px;margin:auto;padding:28px}
header {display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid #344451;padding-bottom:20px;font-size:11px;letter-spacing:.12em}
header span {color:var(--cyan)}
header strong {border:1px solid #71818d;border-radius:20px;padding:7px 10px}
.heading {margin:24px 0}
.eyebrow {font-size:11px;letter-spacing:.16em;color:var(--cyan)}
h1 {font-size:clamp(26px,4vw,40px);font-weight:500;margin:6px 0}
h2 {font-size:clamp(22px,3vw,34px);font-weight:500;margin:8px 0}
p {line-height:1.5;color:#c2cfda}
button {font:inherit;color:inherit;border:1px solid #81949f;border-radius:8px;background:#14242f;padding:10px 16px;cursor:pointer}
button:focus-visible {outline:3px solid #fff;outline-offset:3px}
.cockpit {position:relative;aspect-ratio:16/9;border:6px solid transparent;border-radius:18px;background:linear-gradient(#091219,#091219) padding-box,var(--carbon) border-box;box-shadow:0 0 0 1px #8a969f;overflow:hidden}
video {display:block;width:100%;height:100%;object-fit:cover}
#door {position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:0;background:linear-gradient(transparent 50%,#030a10bc);display:flex;align-items:flex-end;justify-content:center;padding:30px}
#door:hover .door-label,#door:focus-visible .door-label {background:#21444e;box-shadow:0 0 22px #79dfeb55}
#door:focus-visible {outline-offset:-5px}
.door-label {display:block;border:1px solid var(--cyan);border-radius:10px;padding:14px 28px;letter-spacing:.14em;background:#0c1c24e8}
.door-label small {display:block;font-size:12px;letter-spacing:normal;margin-top:6px;color:#c2cfda}
.controls {display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
#status {min-height:23px}
#team {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(#050e15bb,#050e15ee),url("assets/dashboard-night.jpg") center/cover}
.instrument {width:100%;max-width:1000px;max-height:100%;overflow:auto;padding:24px;border:1px solid #92bbc7;border-radius:16px;background:#0b1721ee;box-shadow:inset 0 1px 0 #d8f3fa55,0 0 32px #79dfeb22}
.roster {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0}
.roster button {text-align:left;padding:16px;background:linear-gradient(135deg,#1e3441,#0b1822)}
.roster span,.roster strong,.roster small {display:block}
.roster span {color:var(--cyan);font-size:12px;margin-bottom:10px}
.roster strong {font-weight:500}
.roster small {margin-top:12px;line-height:1.5;color:#c2cfda}
.roster [aria-pressed=true] {border-color:var(--cyan);box-shadow:0 0 0 2px var(--cyan)}
.person-detail {padding:14px;border-left:3px solid var(--cyan);background:#172c39;line-height:1.6;margin-bottom:18px}
.mantra {padding:20px;text-align:center;border:6px solid transparent;border-radius:12px;background:linear-gradient(#0d171e,#0d171e) padding-box,var(--carbon) border-box;font:clamp(18px,2vw,26px) Georgia,serif;color:#e5ecf2}
footer {font-size:12px;line-height:1.8;color:#b3c4d0}
@media (max-width:900px) {
  #team {position:relative;padding:16px}
  .cockpit.team-open {aspect-ratio:auto}
  .team-open video {display:none}
  .roster {grid-template-columns:1fr}
}
@media (max-width:600px) {
  main {padding:16px}
  header {flex-direction:column;align-items:flex-start}
  #door {padding:12px}
  .door-label {padding:8px 12px;font-size:12px}
  .door-label small {font-size:10px}
  .instrument {padding:16px}
}
