/* RailIncident.com canonical site chrome.
   Keep this aligned with the Explore page header/footer. Loaded after page-specific CSS. */
.topbar {
  min-height: 68px;
  display: grid;
  grid-template-columns: minmax(220px,auto) minmax(280px,640px) auto;
  gap: 18px;
  align-items: center;
  padding: 10px 16px;
  background: rgba(17,22,28,.97);
  border-bottom: 1px solid var(--line);
  z-index: 20;
}
.brand {
  display: flex;
  flex-direction: column;
  line-height: 1.15;
  min-width: 290px;
}
.brand-name {
  color: var(--text);
  text-decoration: none;
  font-size: 19px;
  font-weight: 750;
  letter-spacing: .01em;
  white-space: nowrap;
}
.brand .brand-incident {
  color: #ef5350;
  font-size: inherit;
  margin: 0;
}
.primary-nav {
  display: flex;
  gap: 13px;
  margin-top: 6px;
  flex-wrap: wrap;
}
.primary-nav a {
  color: var(--muted);
  text-decoration: none;
  font-size: 12px;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
}
.primary-nav a:hover,
.primary-nav a[aria-current="page"] {
  color: #fff;
}
.topbar-middle,
.topbar-right { min-width: 0; }

footer {
  min-height: 30px;
  padding: 9px 12px;
  border-top: 1px solid var(--line);
  background: #10151a;
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}
.fra-api-notice {
  color: #eef2f5;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
  margin: 0 auto 4px;
}
.site-footer-meta { line-height: 1.4; }
footer a { color: #cbd4dc; }

@media (max-width: 900px) {
  .topbar {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 8px 10px;
  }
  .brand { min-width: 0; }
  footer { display: block; }
}

@media (max-width: 720px) {
  .topbar {
    display: flex;
    flex-wrap: wrap;
    padding: 8px 12px;
    gap: 8px;
  }
  .brand {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
  }
  .brand-name { font-size: 22px; }
  .primary-nav {
    margin-top: 4px;
    gap: 12px;
    flex-wrap: wrap;
  }
  .primary-nav a { min-height: 40px; }
  footer { font-size: 11px; padding: 7px 10px; }
}

@media (max-height: 500px) and (max-width: 900px) {
  .topbar {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 12px;
    padding: 5px 10px;
  }
  .brand {
    flex: 1 1 250px;
    width: auto;
  }
  footer { padding: 2px 8px; }
}

/* Version 1.0 shared dialogs and nonblocking content advice. */
.welcome-overlay[hidden],.content-advisory[hidden]{display:none!important}
.welcome-overlay{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:16px;background:rgba(4,8,12,.65)}
.welcome-panel{position:relative;width:min(480px,100%);max-height:90dvh;overflow:auto;padding:28px;background:#171e26;color:#ecf1f5;border:1px solid #43515e;border-radius:10px;box-shadow:0 16px 50px rgba(0,0,0,.5)}
.welcome-panel h2{font-size:24px;margin:0 26px 16px 0}.welcome-panel p{line-height:1.55}.welcome-panel #welcome-advisory{color:#c8d1da;font-size:14px}
.welcome-panel button{font:inherit;cursor:pointer}.welcome-panel #welcome-explore{background:#234e70;color:#fff;border:1px solid #799bb4;border-radius:5px;min-height:44px;padding:10px 18px}
.modal-close{position:absolute;right:10px;top:10px;background:transparent;border:0;color:inherit;font-size:26px!important;width:40px;height:40px}
.welcome-panel button:focus-visible,.content-advisory button:focus-visible{outline:3px solid #a5d9ff;outline-offset:3px}
.content-advisory{position:fixed;z-index:80;right:14px;top:90px;width:min(350px,calc(100vw - 28px));background:#edf1f4;color:#17212b;border:1px solid #bccad6;border-radius:6px;padding:14px 42px 14px 16px;box-shadow:0 3px 12px rgba(0,0,0,.22);font-size:13px;line-height:1.5;max-height:40dvh;overflow:auto}
.content-advisory p{margin:6px 0}.content-advisory a{color:#234e70;text-decoration:underline}.content-advisory button{position:absolute;top:4px;right:4px;min-width:36px;min-height:36px;border:0;background:transparent;color:#17212b;font-size:24px;cursor:pointer}
@media(max-width:720px){.content-advisory{top:auto;bottom:12px}.welcome-panel{padding:24px}}
/* Keep both filter labels inside the shared header at intermediate widths. */
@media (min-width:901px) and (max-width:1100px) {
 .topbar{grid-template-columns:minmax(290px,1fr) minmax(280px,1fr);gap:8px 18px}
 .topbar .controls{grid-column:1 / -1;flex-wrap:wrap}
}

/* Compact shared footer; disclosures expand only on request. */
footer{display:block;white-space:nowrap;overflow-x:auto;max-width:100%;min-height:36px;padding:0 12px;line-height:36px;text-align:center;font-size:11px}
footer a,footer .privacy-control{display:inline-block;vertical-align:middle;min-height:36px;padding:0 4px;line-height:36px}
.footer-disclosure{display:inline-block;vertical-align:middle}
.footer-disclosure summary{display:inline-block;cursor:pointer;text-decoration:underline;min-height:36px;line-height:36px}
.footer-disclosure[open]{display:block;white-space:normal}
.footer-disclosure .fra-api-notice,.footer-disclosure p{max-width:800px;margin:4px auto 12px;line-height:1.5}
footer:has(.footer-disclosure[open]){white-space:normal}

/* Welcome typography and a centered primary action. */
.welcome-panel h2{font-size:clamp(23px,4vw,28px);line-height:1.2;letter-spacing:-.025em;font-weight:750;margin-bottom:20px}
.welcome-panel #welcome-body{font-size:16px;line-height:1.65;color:#ecf1f5;margin:0 0 20px}
.welcome-panel #welcome-advisory{font-size:14px;line-height:1.6;padding:12px 14px;background:#202a35;border-left:3px solid #ef5350;border-radius:4px;margin:0 0 24px;color:#d6dee6}
.welcome-panel #welcome-explore{display:block;margin:0 auto;font-weight:650;padding:11px 24px;border-radius:6px;box-shadow:0 3px 10px rgba(0,0,0,.2)}

.welcome-panel{text-align:center}
.welcome-panel h2{margin-right:0}
.welcome-panel #welcome-advisory{border:1px solid #ef5350}

.welcome-panel .welcome-advisory-title{font-size:16px;line-height:1.5}

/* Controlled responsive advertising, isolated from navigation and charts. */
.ad-container{width:100%;max-width:100%;margin:32px 0;padding:16px 0;clear:both;overflow:hidden;border:0;min-height:140px}.ad-label{display:block;text-align:center;font-size:10px;letter-spacing:.12em;color:#aab4be;margin-bottom:10px}.ad-container .adsbygoogle{min-height:100px}.ad-preview{min-height:110px;display:flex;align-items:center;justify-content:center;background:#161e26;border:1px dashed #526170;color:#aab4be;font-size:14px}@media(max-width:600px){.ad-container{margin:24px 0;min-height:290px}.ad-container .adsbygoogle,.ad-preview{min-height:250px}}

.ad-container::before{content:none}.ad-label-bottom{margin-top:10px;margin-bottom:0}

.ad-container.ad-horizontal{min-height:0}.ad-horizontal .ad-preview{margin:0 auto;max-width:100%;box-sizing:border-box}
