:root { --ink:#e9f3ef; --muted:#829691; --cyan:#69e9dd; --green:#63e6a4; --amber:#ffc857; --red:#ff716c; --panel:rgba(13,28,31,.78); --line:rgba(162,218,210,.14); --bg:#061012; }
* { box-sizing:border-box; }
html { background:var(--bg); color:var(--ink); }
body { margin:0; min-width:320px; background:radial-gradient(circle at 75% -10%,rgba(24,98,97,.26),transparent 36%),radial-gradient(circle at -10% 40%,rgba(29,68,71,.2),transparent 30%),#061012; font-family:Arial,Helvetica,sans-serif; }
button,input { font:inherit; }
button { color:inherit; }
.flight-deck { width:min(1500px,100%); min-height:100vh; margin:auto; padding:24px 30px 40px; }
.topbar { display:flex; align-items:center; justify-content:space-between; min-height:74px; border-bottom:1px solid var(--line); }
.brand-lockup,.top-actions,.card-heading,.status-main,.section-title,.section-title>div,.time-inputs { display:flex; align-items:center; }
.brand-mark { display:grid; place-items:center; width:54px; height:54px; margin-right:16px; border:1px solid var(--cyan); border-radius:50%; color:var(--cyan); font:700 13px/1 monospace; box-shadow:inset 0 0 20px rgba(105,233,221,.13),0 0 20px rgba(105,233,221,.07); }
.eyebrow { display:flex; align-items:baseline; gap:9px; margin:0 0 5px; font-family:monospace; line-height:1.2; }
.brand-name { color:var(--cyan); font-size:10px; font-weight:700; letter-spacing:.2em; }
.brand-descriptor { color:#667b77; font-size:7px; font-weight:500; letter-spacing:.15em; }
h1 { margin:0; font:700 27px/1.1 monospace; letter-spacing:.03em; } h1 span { color:var(--muted); font-weight:400; }
.top-actions { gap:10px; }
.source-pill { padding:10px 13px; border:1px solid var(--line); border-radius:4px; background:rgba(0,0,0,.18); color:var(--muted); font:700 9px/1 monospace; letter-spacing:.12em; }
.source-pill span { display:inline-block; width:7px; height:7px; margin-right:8px; border-radius:50%; background:var(--amber); }.source-pill.live span{background:var(--green);box-shadow:0 0 8px var(--green)}
.refresh { min-height:36px; padding:0 14px; border:1px solid rgba(105,233,221,.35); border-radius:4px; background:rgba(105,233,221,.06); color:var(--cyan); font:700 10px monospace; letter-spacing:.1em; cursor:pointer; }.refresh:hover{background:rgba(105,233,221,.12)}
.advisory-strip { display:flex; gap:14px; align-items:center; padding:10px 14px; margin:14px 0; border:1px solid rgba(255,200,87,.18); border-radius:4px; background:rgba(255,200,87,.055); color:#b5bdb7; font:11px/1.4 monospace; }.advisory-strip strong{color:var(--amber);letter-spacing:.12em}.advisory-strip span{border-left:1px solid rgba(255,200,87,.2);padding-left:14px}
.glass-card { border:1px solid var(--line); border-radius:6px; background:linear-gradient(145deg,rgba(17,38,41,.82),rgba(8,20,22,.72)); box-shadow:0 16px 40px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.025); }
.hero-grid { display:grid; grid-template-columns:.92fr 1.5fr; gap:14px; }
.status-card,.weather-card,.system-card,.station-comparison,.alerts-card{padding:18px}
.card-heading { min-height:24px; gap:9px; margin-bottom:16px; }.card-heading p{margin:0;color:#bdd0cb;font:700 10px monospace;letter-spacing:.16em}.section-number{color:var(--cyan);font:700 9px monospace}.section-number:after{content:"/";margin-left:3px;color:#446661}
.status-main { gap:14px; min-height:75px; border-bottom:1px solid var(--line); }.status-light{width:13px;height:13px;border-radius:50%;background:var(--amber);box-shadow:0 0 14px rgba(255,200,87,.6)}.status-light.live{background:var(--green);box-shadow:0 0 14px var(--green)}
.status-main h2{margin:0 0 5px;font:700 22px monospace;letter-spacing:.04em}.status-main p{margin:0;color:var(--muted);font-size:11px}
.observation-source{display:flex;flex-direction:column;gap:5px;padding:14px 0}.observation-source span,.wind-reading>span,.metric-row span,.components span,.system-card>p,.time-inputs label,.bottom-line>div>span{color:var(--muted);font:700 9px monospace;letter-spacing:.13em}.observation-source strong{font:700 15px monospace}.observation-source small{color:var(--muted);font-size:10px}
.station-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.station-tabs button{padding:8px 3px;border:1px solid var(--line);border-radius:3px;background:rgba(0,0,0,.17);color:var(--muted);font:700 11px monospace;cursor:pointer}.station-tabs button small{display:block;margin-top:3px;font-size:7px}.station-tabs button.active{border-color:var(--cyan);color:var(--cyan);background:rgba(105,233,221,.07)}
.category{margin-left:auto;padding:5px 8px;border-radius:3px;font:700 10px monospace}.category.vfr,.vfr{color:var(--green)!important;background:rgba(99,230,164,.08)}.mvfr{color:#72b7ff!important;background:rgba(114,183,255,.08)}.ifr{color:var(--red)!important;background:rgba(255,113,108,.08)}.lifr{color:#dc83ff!important;background:rgba(220,131,255,.09)}
.weather-primary{display:flex;align-items:center;gap:26px;min-height:124px}.wind-dial{display:flex;align-items:center;gap:14px}.dial-ring{position:relative;width:78px;height:78px;border:1px solid #4c6c68;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(105,233,221,.3) 0deg 1deg,transparent 1deg 30deg)}.dial-ring:after{content:"";position:absolute;inset:7px;border-radius:50%;background:#0a181a}.dial-ring span{position:absolute;z-index:2;left:50%;top:7px;transform:translateX(-50%);color:var(--muted);font:8px monospace}.dial-ring i{position:absolute;z-index:3;left:50%;top:50%;width:2px;height:31px;transform-origin:50% 100%;background:var(--cyan);box-shadow:0 0 5px var(--cyan)}.wind-dial>strong{font:700 18px monospace}.wind-reading{flex:1}.wind-reading>strong{display:block;margin:5px 0 1px;font:700 clamp(29px,4vw,50px) monospace;letter-spacing:-.06em}.wind-reading b{color:var(--muted);font-weight:400}.wind-reading em{color:var(--amber);font-style:normal}.wind-reading small{color:var(--muted);font:8px monospace;letter-spacing:.2em}
.metric-row{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.metric-row>div{padding:13px 10px;border-right:1px solid var(--line)}.metric-row>div:last-child{border:0}.metric-row span{display:block;margin-bottom:5px}.metric-row strong{font:700 12px monospace}.raw-toggle,.text-button{margin-top:12px;padding:0;border:0;background:none;color:var(--cyan);font:700 9px monospace;letter-spacing:.1em;cursor:pointer}.raw-metar{margin:10px 0 0;padding:10px;border-radius:3px;background:rgba(0,0,0,.2);color:#9db1ac;font:11px/1.5 monospace}
.runway-section{padding-top:22px}.section-title{justify-content:space-between;margin-bottom:11px}.section-title h2{margin:0 0 0 8px;font:700 11px monospace;letter-spacing:.16em}.section-title p{margin:0;color:var(--muted);font:9px monospace}.runway-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(390px,1fr));gap:14px}.runway-card{display:grid;grid-template-columns:110px 80px 1fr;min-height:154px;padding:18px;align-items:center}.runway-card.preferred{border-color:rgba(99,230,164,.36);box-shadow:inset 3px 0 var(--green)}.runway-label span{display:block;color:var(--muted);font:8px monospace}.runway-label strong{display:block;font:700 40px/1 monospace}.runway-label small{display:block;margin-top:6px;color:var(--muted);font:7px monospace}.runway-label em{display:inline-block;margin-top:8px;padding:4px;background:rgba(99,230,164,.1);color:var(--green);font:normal 7px monospace}.runway-center{text-align:center}.runway-line{position:relative;width:37px;height:82px;margin:auto;border:1px solid #46625e;background:repeating-linear-gradient(0deg,#1e3436 0 12px,#142527 12px 15px)}.runway-line span{position:absolute;left:50%;top:4px;bottom:4px;border-left:1px dashed #76908b}.runway-line i{position:absolute;z-index:2;bottom:5px;left:50%;transform:translateX(-50%);background:#172c2e;font:normal 7px monospace}.runway-center small{display:block;margin-top:7px;color:var(--muted);font:7px monospace}.components{display:grid;grid-template-columns:1fr 1fr;gap:10px}.components>div{padding-left:12px;border-left:1px solid var(--line)}.components span,.components strong{display:block}.components strong{margin-top:7px;font:700 10px monospace}.components .gust-component strong{color:var(--amber)}
.systems-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px}.big-number{margin:15px 0 9px;font:700 40px monospace}.big-number small{margin-left:7px;color:var(--muted);font-size:12px}.system-card>p{margin:0}.system-card>p strong{color:var(--ink)}.mini-note{margin-top:13px;padding-top:11px;border-top:1px solid var(--line);color:var(--muted);font:9px/1.5 monospace}.time-inputs{justify-content:space-between;margin:18px 0}.time-inputs label{display:flex;flex-direction:column;gap:6px}.time-inputs input{width:112px;padding:8px;border:1px solid var(--line);border-radius:3px;background:#091719;color:var(--ink);font:700 16px monospace;color-scheme:dark}.time-inputs>span{color:var(--cyan)}.aloft-list>div{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--line);font:10px monospace}.aloft-list span{color:var(--muted)}.aloft-list strong{color:var(--cyan);font-size:8px}
.station-comparison{margin-top:14px}.card-heading .muted{margin-left:auto;color:var(--muted);font:8px monospace}.station-table{display:grid;gap:4px}.station-table button{display:grid;grid-template-columns:70px 1fr 65px 150px 80px 80px;gap:12px;align-items:center;padding:10px;border:1px solid transparent;border-radius:3px;background:rgba(0,0,0,.12);text-align:left;color:#adbfba;font:10px monospace;cursor:pointer}.station-table button.active{border-color:rgba(105,233,221,.3);background:rgba(105,233,221,.04)}.station-table b{width:max-content;padding:3px 6px;border-radius:2px;font-size:8px}
.briefing-grid{display:grid;grid-template-columns:.85fr 1.5fr;gap:14px;margin-top:14px}.alerts-card ul{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:0;margin:0;list-style:none}.alerts-card li{display:flex;align-items:center;gap:8px;padding:10px;background:rgba(0,0,0,.13);font:9px monospace}.alerts-card li i{width:7px;height:7px;border-radius:50%;background:var(--green)}.alerts-card li.caution i{background:var(--amber)}.alerts-card li.info i{background:#69aee9}.text-button{margin:0 0 0 auto}.limits-panel{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}.limits-panel p{grid-column:1/-1;margin:0 0 4px;color:var(--amber);font:9px monospace}.limits-panel label{color:var(--muted);font:9px monospace}.limits-panel input{width:45px;margin:0 4px;padding:5px;border:1px solid var(--line);background:#071517;color:var(--ink)}
.bottom-line{display:flex;gap:18px;align-items:center;padding:20px;border:1px solid rgba(99,230,164,.36);border-radius:6px;background:linear-gradient(110deg,rgba(13,56,43,.54),rgba(8,25,26,.78))}.bottom-line.caution{border-color:rgba(255,200,87,.4);background:linear-gradient(110deg,rgba(65,47,15,.45),rgba(8,25,26,.78))}.bottom-icon{display:grid;place-items:center;flex:0 0 54px;height:54px;border:1px solid var(--green);border-radius:50%;color:var(--green);font:700 27px monospace}.bottom-line.caution .bottom-icon{border-color:var(--amber);color:var(--amber)}.bottom-line h2{margin:5px 0;font:700 16px/1.25 monospace}.bottom-line p{margin:0;color:#9fb2ad;font:11px/1.5 Arial}.bottom-line small{display:block;margin-top:8px;color:var(--muted);font:8px monospace;text-transform:uppercase;letter-spacing:.1em}
footer{display:flex;justify-content:space-between;margin-top:20px;padding-top:14px;border-top:1px solid var(--line);color:var(--muted);font:8px monospace;letter-spacing:.09em}footer span{color:#46625e}footer strong{color:#b9cbc6}.footer-descriptor{color:#526762;font-size:7px;letter-spacing:.06em}
@media(max-width:900px){.hero-grid,.runway-grid,.systems-grid,.briefing-grid{grid-template-columns:1fr}.runway-card{grid-template-columns:100px 1fr 1.25fr}.station-table button{grid-template-columns:55px 1fr 55px 120px}.station-table button span:nth-last-child(-n+2){display:none}.alerts-card ul{grid-template-columns:1fr}.topbar{align-items:flex-start}.source-pill{display:none}}
@media(max-width:600px){.flight-deck{padding:14px 12px 28px}.topbar{min-height:64px}.brand-mark{width:43px;height:43px;margin-right:10px}h1{font-size:19px}.eyebrow{font-size:8px}.advisory-strip{align-items:flex-start;gap:8px}.advisory-strip span{padding-left:8px}.status-card,.weather-card,.system-card,.station-comparison,.alerts-card{padding:14px}.weather-primary{gap:10px}.wind-dial{display:none}.wind-reading>strong{font-size:34px}.metric-row{grid-template-columns:1fr 1fr}.metric-row>div:nth-child(2){border-right:0}.metric-row>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.runway-card{grid-template-columns:72px 1fr;padding:14px}.runway-label strong{font-size:38px}.runway-center{display:none}.components{gap:4px}.components>div{padding-left:8px}.systems-grid{gap:10px}.time-inputs input{width:105px}.station-table button{grid-template-columns:52px 1fr 52px}.station-table button span:nth-of-type(n+2){display:none}.station-table button b{display:block}.bottom-line{align-items:flex-start;padding:16px}.bottom-icon{flex-basis:40px;height:40px;font-size:20px}.bottom-line h2{font-size:13px}.limits-panel{grid-template-columns:1fr}footer{display:block;line-height:1.5}.top-actions{margin-left:8px}.refresh{padding:0 9px;font-size:8px}}

/* Airport command bar */
.airport-command{display:grid;grid-template-columns:minmax(270px,.8fr) minmax(320px,1.2fr) auto;gap:18px;align-items:center;margin:14px 0;padding:14px 16px}.airport-command label,.favorite-block span{color:var(--muted);font:700 8px monospace;letter-spacing:.13em}.airport-command form>div{display:flex;margin:5px 0 3px}.airport-command input{width:150px;min-height:34px;padding:0 10px;border:1px solid var(--line);border-radius:4px 0 0 4px;background:rgba(0,0,0,.18);color:var(--ink);font:700 14px monospace;text-transform:uppercase}.airport-command form button{min-height:34px;padding:0 12px;border:1px solid rgba(105,233,221,.35);border-left:0;border-radius:0 4px 4px 0;background:rgba(105,233,221,.08);color:var(--cyan);font:700 9px monospace;cursor:pointer}.airport-command small{color:var(--muted);font:8px monospace}.favorite-block>div:first-child{display:flex;align-items:center;gap:10px;margin-bottom:6px}.favorite-button{padding:0;border:0;background:none;color:var(--cyan);font:700 8px monospace;cursor:pointer}.favorite-list{display:flex;flex-wrap:wrap;gap:6px}.favorite-list button{padding:7px 9px;border:1px solid var(--line);border-radius:3px;background:rgba(0,0,0,.13);color:var(--muted);font:700 9px monospace;cursor:pointer}.favorite-list button.active{border-color:var(--cyan);color:var(--cyan)}.airport-tools{display:flex;flex-direction:column;align-items:flex-end;gap:10px}.airport-tools>a{padding:8px 10px;border:1px solid rgba(105,233,221,.28);border-radius:3px;color:var(--cyan);font:700 9px monospace;text-decoration:none}.flight-legend{display:flex;gap:8px}.flight-legend span{font:700 7px monospace}.flight-legend span:before{content:"";display:inline-block;width:6px;height:6px;margin-right:4px;border-radius:50%}.vfr-dot{color:var(--green)}.vfr-dot:before{background:var(--green)}.mvfr-dot{color:#72b7ff}.mvfr-dot:before{background:#72b7ff}.ifr-dot{color:var(--red)}.ifr-dot:before{background:var(--red)}.lifr-dot{color:#dc83ff}.lifr-dot:before{background:#dc83ff}.empty-state{grid-column:1/-1;padding:24px;border:1px dashed var(--line);color:var(--muted);font:10px monospace;text-align:center}
@media(max-width:900px){.airport-command{grid-template-columns:1fr 1fr}.airport-tools{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between}}
@media(max-width:600px){.airport-command{grid-template-columns:1fr;gap:13px}.airport-command input{flex:1;width:auto}.airport-tools{grid-column:auto;align-items:flex-start;flex-direction:column}.runway-grid{grid-template-columns:1fr}.runway-card{grid-template-columns:75px 1fr}.runway-label strong{font-size:32px}}

/* Appearance control */
.theme-control{display:flex;flex-direction:column;gap:3px;color:var(--muted);font:700 7px monospace;letter-spacing:.11em}.theme-control select{min-height:28px;padding:0 7px;border:1px solid var(--line);border-radius:4px;background:rgba(0,0,0,.18);color:var(--ink);font:700 9px monospace;cursor:pointer}
:root[data-theme="dark"],:root[data-theme="system"]{color-scheme:dark}
:root[data-theme="light"]{color-scheme:light;--ink:#142826;--muted:#60746f;--cyan:#087c76;--green:#087e4f;--amber:#9b6500;--red:#b73532;--panel:rgba(255,255,255,.9);--line:rgba(25,73,68,.18);--bg:#edf4f1}
:root[data-theme="light"] body{background:radial-gradient(circle at 75% -10%,rgba(71,170,159,.18),transparent 36%),radial-gradient(circle at -10% 40%,rgba(91,139,134,.14),transparent 30%),var(--bg)}
:root[data-theme="light"] .glass-card{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(240,248,245,.9));box-shadow:0 14px 35px rgba(31,67,63,.09),inset 0 1px 0 rgba(255,255,255,.8)}
:root[data-theme="light"] .source-pill,:root[data-theme="light"] .station-tabs button,:root[data-theme="light"] .station-table button,:root[data-theme="light"] .alerts-card li,:root[data-theme="light"] .raw-metar,:root[data-theme="light"] .limits-panel input,:root[data-theme="light"] .time-inputs input,:root[data-theme="light"] .theme-control select{background:rgba(255,255,255,.65);color:var(--ink)}
:root[data-theme="light"] .airport-command input,:root[data-theme="light"] .favorite-list button{background:rgba(255,255,255,.65);color:var(--ink)}
:root[data-theme="light"] .dial-ring:after{background:#f5faf8}:root[data-theme="light"] .runway-line{background:repeating-linear-gradient(0deg,#d7e7e2 0 12px,#edf5f2 12px 15px)}:root[data-theme="light"] .runway-line i{background:#e3efeb}:root[data-theme="light"] .advisory-strip{color:#536762}:root[data-theme="light"] .station-table button{color:#334d48}:root[data-theme="light"] .bottom-line{background:linear-gradient(110deg,rgba(188,238,213,.72),rgba(248,252,250,.94))}:root[data-theme="light"] .bottom-line.caution{background:linear-gradient(110deg,rgba(255,232,177,.62),rgba(250,252,250,.94))}:root[data-theme="light"] .bottom-line p{color:#49625d}
@media(prefers-color-scheme:light){
  :root[data-theme="system"]{color-scheme:light;--ink:#142826;--muted:#60746f;--cyan:#087c76;--green:#087e4f;--amber:#9b6500;--red:#b73532;--panel:rgba(255,255,255,.9);--line:rgba(25,73,68,.18);--bg:#edf4f1}
  :root[data-theme="system"] body{background:radial-gradient(circle at 75% -10%,rgba(71,170,159,.18),transparent 36%),radial-gradient(circle at -10% 40%,rgba(91,139,134,.14),transparent 30%),var(--bg)}
  :root[data-theme="system"] .glass-card{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(240,248,245,.9));box-shadow:0 14px 35px rgba(31,67,63,.09),inset 0 1px 0 rgba(255,255,255,.8)}
  :root[data-theme="system"] .source-pill,:root[data-theme="system"] .station-tabs button,:root[data-theme="system"] .station-table button,:root[data-theme="system"] .alerts-card li,:root[data-theme="system"] .raw-metar,:root[data-theme="system"] .limits-panel input,:root[data-theme="system"] .time-inputs input,:root[data-theme="system"] .theme-control select{background:rgba(255,255,255,.65);color:var(--ink)}
  :root[data-theme="system"] .airport-command input,:root[data-theme="system"] .favorite-list button{background:rgba(255,255,255,.65);color:var(--ink)}
  :root[data-theme="system"] .dial-ring:after{background:#f5faf8}:root[data-theme="system"] .runway-line{background:repeating-linear-gradient(0deg,#d7e7e2 0 12px,#edf5f2 12px 15px)}:root[data-theme="system"] .runway-line i{background:#e3efeb}:root[data-theme="system"] .advisory-strip{color:#536762}:root[data-theme="system"] .station-table button{color:#334d48}:root[data-theme="system"] .bottom-line{background:linear-gradient(110deg,rgba(188,238,213,.72),rgba(248,252,250,.94))}:root[data-theme="system"] .bottom-line.caution{background:linear-gradient(110deg,rgba(255,232,177,.62),rgba(250,252,250,.94))}:root[data-theme="system"] .bottom-line p{color:#49625d}
}
@media(max-width:600px){.theme-control>span{display:none}.theme-control select{width:72px;padding:0 4px;font-size:8px}.top-actions{gap:6px}}