/* ============================================================
   LOCATIONCAST — "THE BOARD"
   Design identity: broadcast control room × trades dispatch board.
   Locations are channels. The board is dark; paperwork is paper.
   Flat color only. No gradients. No frameworks.
   ============================================================ */

:root{
  --night:#0c1118;          /* board black — winter night */
  --panel:#131b27;          /* tile face */
  --panel-2:#182233;        /* raised panel */
  --line:#2b3a4f;           /* hairline on dark */
  --line-soft:#1f2b3d;
  --tx:#ece7da;             /* warm off-white on dark */
  --tx-dim:#a9b3c2;         /* secondary on dark */
  --tx-faint:#7e8b9d;       /* tertiary on dark */
  --paper:#f3efe4;          /* dispatch paper */
  --paper-2:#e9e2cf;        /* aged paper band */
  --ink:#17202b;            /* ink on paper */
  --ink-dim:#4c5866;        /* secondary on paper */
  --ink-line:#c9c0a6;       /* hairline on paper */
  --amber:#ffb224;          /* ON AIR lamp */
  --orange:#f0541e;         /* plow / safety orange */
  --orange-deep:#a83c0a;    /* orange for text on paper */
  --green:#4cc38a;          /* live lamp */
  --red:#e5533a;            /* exception lamp */
  --ice:#a8d4de;            /* cold accent, used flat + sparingly */
  --mono:ui-monospace,"Cascadia Mono","SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --sans:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --maxw:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--night);color:var(--tx);
  font-family:var(--sans);font-size:17px;line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--amber);text-underline-offset:3px}
a:hover{color:#ffc85e}
.paper a{color:var(--orange-deep)}
.paper a:hover{color:#7e2d06}
.paper-2 a{color:var(--orange-deep)}
.paper-2 a:hover{color:#7e2d06}
/* solid buttons keep their dark label on light sections (link rules outrank .btn) */
.paper a.btn:not(.ghost),.paper-2 a.btn:not(.ghost),
.paper a.btn:not(.ghost):hover,.paper-2 a.btn:not(.ghost):hover{color:#191007}
/* ghost buttons on light sections: resting + hover, no inline styles needed */
.paper .btn.ghost,.paper-2 .btn.ghost{color:var(--ink);border-color:#b7ac8d}
.paper .btn.ghost:hover,.paper-2 .btn.ghost:hover{color:#7e2d06;border-color:#7e2d06}

:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:1px}
.paper :focus-visible,.paper-2 :focus-visible{outline-color:#8a3205}
.signage :focus-visible{outline-color:#191007}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.skip{
  position:absolute;left:-999px;top:0;background:var(--orange);color:#14100c;
  font-weight:700;padding:10px 16px;z-index:60;
}
.skip:focus{left:8px;top:8px;color:#14100c}

/* ---------- board bar ---------- */
.boardbar{
  position:sticky;top:0;z-index:50;background:#080b10;
  border-bottom:2px solid var(--orange);
}
.boardbar .barrow{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding-top:10px;padding-bottom:10px;
}
.lamp{
  display:inline-block;width:11px;height:11px;border-radius:50%;
  background:var(--amber);flex:none;
  box-shadow:0 0 0 3px rgba(255,178,36,.18);
  animation:pulse 2.4s ease-in-out infinite;
}
.lamp.green{background:var(--green);box-shadow:0 0 0 3px rgba(76,195,138,.16)}
.lamp.red{background:var(--red);box-shadow:0 0 0 3px rgba(229,83,58,.16)}
.lamp.dim{background:#5b6a7d;box-shadow:none;animation:none}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}
.wordmark{
  font-weight:800;letter-spacing:.14em;font-size:19px;color:var(--tx);
  text-decoration:none;text-transform:uppercase;white-space:nowrap;
}
.wordmark:hover{color:var(--tx)}
.wordmark .cast{color:var(--orange)}
.boardmeta{
  margin-left:auto;display:flex;align-items:center;gap:16px;
  font-family:var(--mono);font-size:12.5px;color:var(--tx-dim);
  letter-spacing:.06em;text-transform:uppercase;
}
.boardmeta .st{display:flex;align-items:center;gap:8px;color:var(--tx)}
.clock{color:var(--ice)}
nav.channels{border-top:1px solid var(--line-soft)}
nav.channels ul{
  list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;
}
nav.channels a{
  display:block;padding:9px 14px 10px;color:var(--tx-dim);text-decoration:none;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;
  border-right:1px solid var(--line-soft);
}
nav.channels a .n{color:var(--orange);margin-right:7px}
nav.channels a:hover{color:var(--tx);background:var(--panel)}
nav.channels a[aria-current="page"]{color:var(--tx);background:var(--panel-2);box-shadow:inset 0 -3px 0 var(--amber)}

/* ---------- generic type ---------- */
h1,h2,h3{line-height:1.12;margin:0 0 .45em;font-weight:800;letter-spacing:-.01em}
h1{font-size:clamp(34px,5.4vw,58px)}
h2{font-size:clamp(26px,3.6vw,38px)}
h3{font-size:20px}
p{margin:0 0 1em}
.lede{font-size:clamp(18px,2.3vw,22px);line-height:1.45;color:var(--tx)}
.paper .lede{color:var(--ink)}
.kicker{
  font-family:var(--mono);font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--amber);margin:0 0 14px;display:flex;align-items:center;gap:10px;
}
.kicker::after{content:"";height:1px;background:var(--line);flex:1}
.paper .kicker{color:var(--orange-deep)}
.paper .kicker::after{background:var(--ink-line)}
.paper-2 .kicker{color:var(--orange-deep)}
.paper-2 .kicker::after{background:var(--ink-line)}
.mono{font-family:var(--mono)}
.dim{color:var(--tx-dim)}
.paper .dim{color:var(--ink-dim)}
.paper-2 .dim{color:var(--ink-dim)}
.small{font-size:14px}
section{padding:64px 0}
section.tight{padding:40px 0}

/* safety-signage strip */
.signage{
  background:var(--orange);color:#191007;
  font-family:var(--mono);font-size:13.5px;letter-spacing:.05em;
  padding:11px 0;text-transform:uppercase;
}
.signage .wrap{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}
.signage strong{font-weight:800;letter-spacing:.12em}
.signage a{color:#191007;font-weight:700}

/* paper section */
.paper{background:var(--paper);color:var(--ink)}
.paper-2{background:var(--paper-2);color:var(--ink)}
.paper h2,.paper h3,.paper-2 h2,.paper-2 h3{color:var(--ink)}

/* ---------- hero ---------- */
.hero{padding:72px 0 56px;border-bottom:1px solid var(--line-soft)}
.hero h1 .hl{color:var(--amber)}
.hero .sub{max-width:44em}
.hero-grid{display:grid;grid-template-columns:1fr;gap:28px}
@media(min-width:900px){.hero-grid{grid-template-columns:1.5fr 1fr;align-items:start}}
.manifest{
  border:1px solid var(--line);background:var(--panel);
  font-family:var(--mono);font-size:13.5px;
}
.manifest .mtitle{
  font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  margin:0;padding:11px 14px;border-bottom:1px solid var(--line);color:var(--tx-dim);font-weight:400;
}
.vh{
  position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;
}
.manifest table{width:100%;border-collapse:collapse}
.manifest td,.manifest th{padding:8px 14px;border-bottom:1px dotted var(--line-soft);vertical-align:top}
.manifest tr:last-child td,.manifest tr:last-child th{border-bottom:none}
.manifest th[scope="row"]{color:var(--tx-faint);white-space:nowrap;width:38%;text-align:left;font-weight:400}
.manifest td{color:var(--tx)}

/* buttons */
.btn{
  display:inline-block;background:var(--orange);color:#191007;text-decoration:none;
  font-weight:800;letter-spacing:.04em;padding:13px 22px;border:2px solid var(--orange);
  font-size:16px;
}
.btn:hover{background:#ff6a38;color:#191007;border-color:#ff6a38}
.btn.ghost{background:transparent;color:var(--tx);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--amber);color:var(--amber)}
.btnrow{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}

/* ---------- the wall ---------- */
.wallhead{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:8px}
.wallhead .count{font-family:var(--mono);color:var(--tx-faint);font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.wall{display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,1fr));gap:12px;margin-top:22px}
.tile{
  background:var(--panel);border:1px solid var(--line);padding:16px 16px 14px;
  display:flex;flex-direction:column;gap:7px;min-height:172px;
}
.tile .top{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--tx-faint);text-transform:uppercase}
.tile .top .st{margin-left:auto;display:flex;align-items:center;gap:7px;color:var(--tx-dim)}
.tile .top .lamp{width:9px;height:9px}
.tile h3{font-size:19px;margin:2px 0 0}
.tile .trade{font-family:var(--mono);font-size:12.5px;color:var(--ice);letter-spacing:.06em;text-transform:uppercase}
.tile .now{margin-top:auto;font-size:14px;color:var(--tx-dim);border-top:1px dotted var(--line-soft);padding-top:9px}
.tile .now b{color:var(--tx);font-weight:700}
.tile.flagship{grid-column:span 1;padding:0;overflow:hidden}
@media(min-width:900px){.tile.flagship{grid-column:span 2;flex-direction:row}}
.tile.flagship .shot{flex:none}
.tile.flagship .shot img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;aspect-ratio:9/13;max-height:340px}
.tile h3 a{color:inherit;text-decoration:none}
.tile h3 a:hover{text-decoration:underline}
@media(min-width:900px){.tile.flagship .shot img{width:230px;aspect-ratio:auto}}
.tile.flagship .body{padding:16px;display:flex;flex-direction:column;gap:7px;flex:1}
.tile.open{
  border:1.5px dashed var(--orange);background:transparent;align-items:flex-start;justify-content:center;
}
.tile.open h3{color:var(--orange)}
.tile.open p{color:var(--tx-dim);font-size:14.5px;margin:0}

/* ---------- rows / boards ---------- */
.rows{border-top:1px solid var(--line)}
.row{
  display:grid;grid-template-columns:1fr;gap:4px;padding:20px 0;border-bottom:1px solid var(--line);
}
@media(min-width:820px){.row{grid-template-columns:64px 240px 1fr;gap:20px}}
.row .no{font-family:var(--mono);color:var(--orange);font-size:15px;padding-top:3px}
.row h3{margin:0;font-size:19px}
.row p{margin:0;color:var(--tx-dim)}
.paper .row{border-color:var(--ink-line)}
.paper .row p{color:var(--ink-dim)}
.paper .row .no{color:var(--orange-deep)}
.paper-2 .row .no{color:var(--orange-deep)}

/* log / data tables */
.tablewrap{overflow-x:auto;border:1px solid var(--line);background:var(--panel)}
.paper .tablewrap,.paper-2 .tablewrap{border-color:var(--ink-line);background:#fbf8f0}
table.log{width:100%;border-collapse:collapse;font-size:15px;min-width:640px}
table.log caption{
  text-align:left;font-family:var(--mono);font-size:12px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--tx-dim);padding:12px 14px;border-bottom:1px solid var(--line);
}
.paper table.log caption,.paper-2 table.log caption{color:var(--ink-dim);border-color:var(--ink-line)}
table.log th,table.log td{padding:11px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line-soft)}
.paper table.log th,.paper table.log td,.paper-2 table.log th,.paper-2 table.log td{border-color:#ddd5bd}
table.log thead th{
  font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--tx-faint);font-weight:400;border-bottom:1px solid var(--line);
}
.paper table.log thead th,.paper-2 table.log thead th{color:var(--ink-dim);border-color:var(--ink-line)}
table.log td.num,table.log th.num{text-align:right;font-family:var(--mono);white-space:nowrap}
table.log tr.total td{border-top:2px solid var(--amber);border-bottom:none;font-weight:800;color:var(--tx)}
.paper table.log tr.total td,.paper-2 table.log tr.total td{border-top-color:var(--orange);color:var(--ink)}
table.log .win{color:var(--amber);font-weight:700}
.paper table.log .win,.paper-2 table.log .win{color:var(--orange-deep)}

/* doors */
.doors{display:grid;grid-template-columns:1fr;gap:14px;margin-top:26px}
@media(min-width:900px){.doors{grid-template-columns:repeat(3,1fr)}}
.door{background:#fbf8f0;border:1px solid var(--ink-line);padding:22px}
.door .tag{
  display:flex;align-items:center;gap:12px;margin-bottom:12px;
}
.door .no{
  background:var(--orange);color:#191007;font-family:var(--mono);font-weight:700;
  font-size:15px;padding:5px 10px;letter-spacing:.08em;
}
.door h3{margin:0;font-size:19px}
.door .big{font-family:var(--mono);font-size:30px;font-weight:700;letter-spacing:-.02em;margin:6px 0 2px}
.door p{color:var(--ink-dim);font-size:15px}
.door .calc{font-family:var(--mono);font-size:13px;color:var(--ink-dim);border-top:1px dotted var(--ink-line);padding-top:10px;margin-top:12px}

/* callout */
.callout{border-left:4px solid var(--amber);background:var(--panel);padding:18px 20px;margin:26px 0}
.paper .callout{background:#fbf8f0;border-left-color:var(--orange)}
.callout p:last-child{margin-bottom:0}
.callout .who{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-faint);margin-bottom:8px}
.paper .callout .who{color:var(--ink-dim)}

/* two-col prose */
.cols{display:grid;grid-template-columns:1fr;gap:30px}
@media(min-width:900px){.cols{grid-template-columns:1fr 1fr}}
.cols h3{margin-top:0}

/* figure */
figure{margin:0}
figure img{border:1px solid var(--line)}
figcaption{font-family:var(--mono);font-size:12.5px;color:var(--tx-faint);margin-top:8px;letter-spacing:.03em}
.paper figcaption{color:var(--ink-dim)}

/* faq */
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-of-type{border-top:1px solid var(--line)}
.faq summary{
  cursor:pointer;padding:18px 34px 18px 0;font-weight:700;font-size:18px;list-style:none;position:relative;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";position:absolute;right:2px;top:14px;font-family:var(--mono);
  font-size:24px;color:var(--amber);font-weight:400;
}
.faq details[open ] summary::after{content:"–"}
.faq details .a{padding:0 0 20px;color:var(--tx-dim);max-width:52em}
.faq details .a p:last-child{margin-bottom:0}

/* form */
.formnote{
  border:1.5px dashed var(--orange);padding:14px 16px;font-size:15px;margin-bottom:22px;background:var(--panel);
}
form.intake{display:grid;grid-template-columns:1fr;gap:16px;max-width:720px}
@media(min-width:720px){form.intake .half{display:grid;grid-template-columns:1fr 1fr;gap:16px}}
form.intake label{font-weight:700;font-size:15px;display:block;margin-bottom:6px}
form.intake .hint{font-weight:400;color:var(--tx-dim);font-size:13.5px;display:block;margin-top:2px}
form.intake input[type=text],form.intake input[type=email],form.intake input[type=tel],
form.intake select,form.intake textarea{
  width:100%;background:var(--panel);border:1px solid var(--line);color:var(--tx);
  padding:11px 12px;font:inherit;font-size:16px;border-radius:0;
}
form.intake fieldset{border:1px solid var(--line);padding:14px 16px;margin:0}
form.intake legend{font-weight:700;font-size:15px;padding:0 6px}
form.intake .checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}
form.intake .checks label{font-weight:400;display:flex;gap:9px;align-items:flex-start;margin:0;font-size:15px}
form.intake input[type=checkbox]{width:19px;height:19px;margin-top:2px;accent-color:var(--orange);flex:none}
#form-result{
  display:none;border:1.5px solid var(--amber);background:var(--panel-2);padding:16px 18px;margin-top:20px;max-width:720px;
}
#form-result.show{display:block}
#form-result h3{margin-top:0}
#form-result dl.echo{margin:14px 0}
#form-result dl.echo div{display:grid;grid-template-columns:170px 1fr;gap:10px;padding:6px 0;border-bottom:1px dotted var(--line-soft)}
#form-result dt{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-faint);padding-top:3px}
#form-result dd{margin:0}

/* footer */
footer{background:#080b10;border-top:2px solid var(--orange);padding:42px 0 50px;margin-top:0}
footer .cols{gap:22px}
footer h3{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx-faint);font-weight:400}
footer p,footer li{font-size:14.5px;color:var(--tx-dim)}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin-bottom:7px}
footer li a{display:inline-block;padding:3px 0}
footer a{color:var(--tx-dim);text-decoration:none}
footer a:hover{color:var(--amber);text-decoration:underline}
.footline{border-top:1px solid var(--line-soft);margin-top:30px;padding-top:16px;font-family:var(--mono);font-size:12px;color:var(--tx-faint);letter-spacing:.04em}

/* video embed */
.embed{position:relative;aspect-ratio:16/9;background:#000;border:1px solid var(--line)}
.embed .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* small screens: the boardbar stays a compact strip, not a third of the phone */
@media(max-width:720px){
  .boardbar .barrow{gap:10px;padding-top:8px;padding-bottom:8px}
  .wordmark{font-size:16px}
  .boardmeta{gap:10px;font-size:11.5px}
  .boardmeta>span:last-child{display:none}
  nav.channels ul{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
  nav.channels a{white-space:nowrap}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .lamp{animation:none}
  *{transition:none!important}
}

/* print: run sheets and gate tables are the pages operators print — keep them legible */
@media print{
  body{background:#fff;color:#17202b}
  .boardbar,.signage,.skip,.btnrow{display:none!important}
  section{padding:16px 0}
  .hero{border-bottom:none}
  h1,h2,h3,.kicker,.lede,.sub,.dim,.small,.tile .now,.tile .trade,.door p,.door .calc{color:#17202b!important}
  .hero h1 .hl{color:#17202b}
  a{color:#17202b}
  .tile,.manifest,.callout,.formnote,.door,#form-result{background:#fff!important;color:#17202b;border-color:#999}
  .manifest td,.manifest th[scope="row"],.callout .who,.manifest .mtitle{color:#17202b!important}
  .tablewrap{overflow:visible;border-color:#999;background:#fff}
  table.log{min-width:0}
  table.log caption,table.log thead th{color:#17202b}
  table.log td,table.log th{border-color:#bbb}
  table.log .win{color:#17202b}
  footer{background:#fff;border-top:1px solid #999}
  footer h3,footer p,footer li,footer a,.footline{color:#17202b}
  .lamp{box-shadow:none;animation:none}
}
