/* Self-hosted (SIL OFL) so the page needs nothing outside cloudytower.com */
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-condensed-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-condensed-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/source-sans-3-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/source-sans-3-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/source-sans-3-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibm-plex-mono-latin-600-normal.woff2) format("woff2")}
/* Layout: a sectional-chart briefing desk. Sticky top bar with search and two views (Airport, Plan); cards in a two-column grid that stacks on phones. */
:root{
  --bg:#EEF2F1; --panel:#FFFFFF; --ink:#14212B; --muted:#5B6B76; --line:#CBD6D8;
  --water:#D6E6EE; --land:#F4F5EE; --magenta:#9C2B78; --blue:#1D5F9A; --amber:#B86A00; --green:#1E7A45; --red:#B3262E;
  --face:#151A1E; --faceInk:#EEF1F2; --chip:#E3EAEB; --route:#9C2B78;
  --display:"Barlow Condensed","Arial Narrow",system-ui,sans-serif;
  --body:"Source Sans 3",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0F1519; --panel:#172026; --ink:#E4ECEF; --muted:#94A6B0; --line:#2B3A43;
  --water:#13283A; --land:#1B242A; --magenta:#E07BC4; --blue:#6FB1EA; --amber:#F2A93B; --green:#5BC98A; --red:#F0727A;
  --face:#0A0D0F; --faceInk:#EEF1F2; --chip:#22303A; --route:#E07BC4; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0F1519; --panel:#172026; --ink:#E4ECEF; --muted:#94A6B0; --line:#2B3A43;
  --water:#13283A; --land:#1B242A; --magenta:#E07BC4; --blue:#6FB1EA; --amber:#F2A93B; --green:#5BC98A; --red:#F0727A;
  --face:#0A0D0F; --faceInk:#EEF1F2; --chip:#22303A; --route:#E07BC4; color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.45}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:var(--ink);color:var(--panel)}
.top .in{max-width:1240px;margin:0 auto;padding-inline:16px;padding-block:10px;display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
.brand{font-family:var(--display);font-weight:700;font-size:24px;letter-spacing:.02em;line-height:1}
.brand small{font-family:var(--mono);font-weight:500;font-size:10px;letter-spacing:.12em;display:block;opacity:.7;margin-top:2px}
.tabs{display:flex;gap:4px}
.tab{font-family:var(--display);font-weight:600;font-size:16px;letter-spacing:.08em;text-transform:uppercase;background:transparent;color:var(--panel);border:1px solid transparent;border-radius:4px;padding:5px 12px;cursor:pointer;opacity:.75}
.tab[aria-selected="true"]{border-color:var(--panel);opacity:1}
.search{position:relative;flex:1 1 260px;max-width:420px}
.search input{width:100%;background:var(--panel);color:var(--ink);border:0;border-radius:4px;padding:8px 10px;font-family:var(--mono);font-size:14px}
.sug{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:4px;list-style:none;margin:0;padding:4px 0;max-height:60vh;overflow:auto;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.sug li{padding:6px 10px;cursor:pointer;display:grid;grid-template-columns:4.6em 1fr;gap:8px;font-size:14px}
.sug li b{font-family:var(--mono);font-weight:600}
.sug li span{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sug li[aria-selected="true"]{background:var(--chip)}
.wrap{max-width:1240px;margin:0 auto;padding-inline:16px;padding-block:18px 48px;display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
.wrap>*{min-width:0}
@media (max-width:560px){.tabs{order:3}.search{flex-basis:100%;max-width:none}.tab{font-size:14px;padding:4px 9px}}
header.ap{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:end;border-bottom:2px solid var(--ink);padding-bottom:12px}
h1{font-family:var(--display);font-weight:700;font-size:clamp(28px,5vw,42px);line-height:1;margin:0;text-wrap:balance}
h1 small{display:block;font-size:13px;font-family:var(--mono);font-weight:500;color:var(--magenta);letter-spacing:.08em;margin-bottom:6px}
.facts{display:flex;flex-wrap:wrap;gap:6px 18px;font-family:var(--mono);font-size:12.5px}
.facts b{display:block;font-family:var(--display);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600}
h2{font-family:var(--display);font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-weight:600}
.grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:900px){.grid{grid-template-columns:minmax(0,1fr)}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:16px;min-width:0}
.stack{display:grid;gap:16px}
.controls{display:flex;flex-wrap:wrap;gap:14px 20px;align-items:end}
.rwys{display:flex;gap:6px;flex-wrap:wrap}
.rwy{font-family:var(--display);font-weight:700;font-size:21px;min-width:60px;padding:6px 10px 4px;border:2px solid var(--ink);background:var(--panel);color:var(--ink);border-radius:4px;cursor:pointer;line-height:1;text-align:center}
.rwy span{display:block;font-family:var(--mono);font-size:10px;font-weight:500;color:var(--muted);margin-top:3px}
.rwy[aria-pressed="true"]{background:var(--ink);color:var(--panel)}
.rwy[aria-pressed="true"] span{color:var(--panel);opacity:.75}
.rwy .rec{color:var(--green)} .rwy[aria-pressed="true"] .rec{color:var(--panel)}
label.f{display:grid;gap:3px;font-family:var(--display);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600}
input,select{font-family:var(--mono);font-size:15px;padding:6px 8px;border:1px solid var(--line);border-radius:4px;background:var(--bg);color:var(--ink);width:7em}
input.wide{width:14em;max-width:100%}
.btn{font-family:var(--display);font-weight:700;font-size:16px;letter-spacing:.08em;text-transform:uppercase;background:var(--ink);color:var(--panel);border:0;border-radius:4px;padding:8px 16px;cursor:pointer}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
a{color:var(--blue)}
table.t{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
table.t th{font-family:var(--display);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:left;font-weight:600;padding:5px 6px;border-bottom:1px solid var(--line);white-space:nowrap}
table.t td{padding:5px 6px;border-bottom:1px solid var(--line);vertical-align:top}
table.t td.n,table.t th.n{text-align:right;font-family:var(--mono)}
table.t tr.sel td{font-weight:600;background:var(--chip)}
table.t tr.tot td{font-weight:700;border-top:2px solid var(--ink)}
.tblwrap{overflow-x:auto}
.mono{font-family:var(--mono)}
.warn{color:var(--red)} .ok{color:var(--green)} .amb{color:var(--amber)}
svg.map{width:100%;height:auto;display:block;border-radius:4px;background:var(--water);touch-action:none}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--muted);margin-top:8px}
.legend i{display:inline-block;width:18px;height:0;border-top:3px solid;vertical-align:middle;margin-right:5px}
.panel{background:var(--face);border-radius:10px;padding:12px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.panel svg{width:100%;height:auto;display:block}
.panel figure{margin:0;display:grid;gap:2px}
.panel figcaption{font-family:var(--mono);font-size:10px;color:#9FB0B9;text-align:center;letter-spacing:.06em}
.gnx{margin-top:10px;background:var(--face);border-radius:8px;padding:10px 12px;color:var(--faceInk);font-family:var(--mono);font-size:12px;display:grid;grid-template-columns:auto 1fr;gap:4px 14px}
.gnx b{color:#6FE38F;font-weight:500} .gnx .lab{color:#8FA3AD}
.legs{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.leg{border:1px solid var(--line);border-radius:5px;background:var(--panel)}
.leg>button{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:grid;grid-template-columns:2.2em minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 12px}
.leg>button:focus-visible{outline:3px solid var(--blue);outline-offset:-3px;border-radius:5px}
.leg .n{font-family:var(--display);font-weight:700;font-size:22px;color:var(--magenta);text-align:center}
.leg .t{font-family:var(--display);font-weight:600;font-size:19px;letter-spacing:.02em}
.leg .q{font-family:var(--mono);font-size:12px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}
.leg.on{border-color:var(--ink);box-shadow:inset 4px 0 0 var(--magenta)}
.detail{padding:0 12px 12px;display:grid;gap:10px}
.leg:not(.on) .detail{display:none}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:6px}
.kv div{background:var(--chip);border-radius:4px;padding:6px 8px;min-width:0}
.kv b{display:block;font-family:var(--display);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600}
.kv span{font-family:var(--mono);font-size:13.5px;font-variant-numeric:tabular-nums}
.do{margin:0;padding-left:1.15em} .do li{margin:2px 0}
.call{font-family:var(--mono);font-size:13px;background:var(--bg);border-left:3px solid var(--magenta);padding:8px 10px;border-radius:0 4px 4px 0}
.call b{display:block;font-family:var(--display);font-size:10.5px;letter-spacing:.14em;color:var(--magenta);font-weight:600}
.tip{font-size:13.5px;color:var(--muted);margin:0} .tip strong{color:var(--ink)}
.note{font-size:13px;color:var(--muted);max-width:80ch;margin:6px 0 0}
.alerts{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.alerts li{font-size:13.5px;padding:7px 10px;border-radius:4px;background:var(--chip)}
.alerts li.bad{box-shadow:inset 3px 0 0 var(--red)} .alerts li.mid{box-shadow:inset 3px 0 0 var(--amber)} .alerts li.good{box-shadow:inset 3px 0 0 var(--green)}
.alerts li strong{font-family:var(--display);letter-spacing:.04em;font-size:14.5px}
.freqs{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px}
.freqs div{background:var(--chip);border-radius:4px;padding:6px 8px;font-size:13px;min-width:0}
.freqs b{display:block;font-family:var(--display);font-size:10.5px;letter-spacing:.14em;color:var(--muted);font-weight:600}
.freqs span{font-family:var(--mono);font-size:15px}
.rmk{margin:0;padding-left:1.1em;font-family:var(--mono);font-size:12px;color:var(--muted);columns:2 320px;column-gap:28px}
.rmk li{break-inside:avoid;margin-bottom:4px}
.zoom{display:flex;gap:6px;margin-top:6px}
.zoom button{font-family:var(--mono);font-size:14px;width:34px;height:30px;border-radius:4px;border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer}
.loading{padding:60px 0;text-align:center;font-family:var(--mono);color:var(--muted)}
@media (prefers-reduced-motion:no-preference){.ptr{transition:transform .5s ease}}

/* Site chrome around the planner: brand links home, the app link, static pages (landing, states, airport summaries) */
.brand{color:inherit;text-decoration:none}
.top .home{margin-left:auto;font-family:var(--display);font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--panel);text-decoration:none;opacity:.85;white-space:nowrap}
.top .home:hover{opacity:1;text-decoration:underline}
@media (max-width:560px){.top .home{order:2}}
a{color:var(--blue)}
.cta{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;border-color:var(--magenta);border-width:2px}
.cta p{margin:0;max-width:62ch}
.cta .btn{text-decoration:none;background:var(--magenta);color:#fff;white-space:nowrap}
.hero{padding-block:12px 4px}
.hero h1{font-size:clamp(34px,6vw,56px);max-width:18ch}
.hero p{font-size:18px;max-width:60ch;color:var(--muted);margin:14px 0 0}
.links{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:6px 18px;list-style:none;margin:0;padding:0}
.links a{text-decoration:none}
.links a:hover{text-decoration:underline}
.links b{font-family:var(--mono);font-weight:600;margin-right:6px}
.links span{color:var(--muted)}
.feat{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:18px}
.feat h3{font-family:var(--display);font-size:20px;margin:0 0 6px}
.feat p{margin:0;color:var(--muted)}
footer.site{max-width:1240px;margin:0 auto;padding:0 16px 40px;color:var(--muted);font-size:13px}
