
:root{
    --aos-css-loaded:1;
    --bg:#0b1220; --panel:#111827; --panel2:#0f172a; --border:#23314d; --muted:#9fb0cc;
    --text:#eaf2ff; --accent:#59c3ff; --accent2:#7ee787; --warn:#ffb86c;
    --pill:#162235; --pillActive:#1f6feb; --shadow:0 18px 40px rgba(0,0,0,.28); --radius:18px;
  }
  :root[data-theme="light"]{
    --bg:#eef4fb; --panel:#ffffff; --panel2:#f7fbff; --border:#c9d8ea; --muted:#51647d;
    --text:#132033; --accent:#1976d2; --accent2:#178a43; --warn:#a85f00;
    --pill:#edf4fc; --pillActive:#1976d2; --shadow:0 14px 34px rgba(31,58,87,.14);
  }
  *{box-sizing:border-box}
  body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:linear-gradient(180deg,rgba(7,13,24,.72),rgba(11,18,32,.96) 52%,var(--bg)),url('/assets/images/earth-horizon.webp') center top / cover fixed no-repeat,var(--bg);color:var(--text)}
  .wrap{max-width:1220px;margin:0 auto;padding:18px 18px 24px}
  h1{margin:0 0 4px;font-size:28px;letter-spacing:.2px}
  .sub{color:var(--muted);margin-bottom:14px;font-size:14px}
  .titleLine{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:14px}
  .titleLine h1{margin:0}
  .titleLine .sub{margin:0;line-height:1.35}
  @media (max-width:620px){.titleLine{display:block}.titleLine .sub{margin-top:4px}}
  .presets{display:flex;flex-wrap:nowrap;gap:10px;overflow-x:auto;margin-bottom:14px;padding-bottom:2px}
  .preset{white-space:nowrap;border:1px solid var(--border);background:var(--pill);color:var(--text);border-radius:999px;padding:10px 14px;cursor:pointer;transition:.18s ease;font-size:14px;box-shadow:var(--shadow)}
  .preset.active{background:linear-gradient(180deg,#2588ff,var(--pillActive));border-color:#4ea1ff}
  .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:14px;align-items:start}
  .stack{display:grid;gap:14px}
  .card{background:linear-gradient(180deg,rgba(17,24,39,.98),rgba(15,23,42,.98));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}
  .card h2{margin:0 0 6px;font-size:16px}
  .hint{margin:0 0 12px;color:var(--muted);font-size:13px}
  .fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .fields.small{grid-template-columns:repeat(4,minmax(0,1fr))}
  .field label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px;letter-spacing:.2px}
  .field input,.field textarea,.field select{width:100%;border-radius:12px;border:1px solid #30415f;background:#1e2a40; color:#ffffff;color:var(--text);padding:10px 12px;font-size:14px;outline:none}
  .field select{cursor:pointer}
  .field input:focus,.field textarea:focus,.field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(89,195,255,.14)}
  input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
  input[type="number"]{-moz-appearance:textfield}
  .actions{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
  .btn{border:none;border-radius:12px;padding:11px 14px;font-weight:600;cursor:pointer}
  .btn.primary{background:linear-gradient(180deg,#59c3ff,#2b95ff);color:#051321}
  .btn.secondary{background:#13203a;color:var(--text);border:1px solid var(--border)}
  .status{font-size:13px;color:var(--muted)}
  #map{width:100%;height:360px;border-radius:16px;overflow:hidden;border:1px solid #2c3d59;background:#0b1528}
  .results{display:grid;gap:10px}
  .rowResult{display:grid;grid-template-columns:170px 1fr auto;gap:12px;align-items:center;padding:14px 14px;background:#1e2a40; color:#ffffff;border:1px solid #273857;border-radius:14px}
  .rowResult .label{color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.5px}
  .rowResult .value{font-size:24px;font-weight:700;letter-spacing:.3px}
  .rowResult .copy{border:none;border-radius:10px;padding:9px 12px;background:#13203a;color:var(--text);cursor:pointer}
  .utc .value{color:#b9e7ff}.obs .value{color:#eaf2ff}.qld .value{color:#b7f5c2}
  .metaGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}
  .mini{background:#1e2a40; color:#ffffff;border:1px solid #273857;border-radius:14px;padding:12px}
  .mini .k{color:var(--muted);font-size:12px;margin-bottom:4px}
  .mini .v{font-size:15px;font-weight:600}
  details summary{cursor:pointer;list-style:none;font-weight:700}
  details summary::-webkit-details-marker{display:none}
  .footerNote{color:var(--muted);font-size:13px;line-height:1.45}
  .legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;font-size:12px;color:var(--muted);align-items:center}
  .legend span{display:inline-flex;align-items:center;line-height:1.2}
  .dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:6px;transform:translateY(1px)}
  .errorBox{margin-top:10px;padding:10px 12px;border-radius:12px;background:#2a1010;border:1px solid #6b2e2e;color:#ffd6d6;display:none}
  @media (max-width:980px){.grid{grid-template-columns:1fr}#map{height:300px}.fields,.fields.small,.metaGrid{grid-template-columns:1fr 1fr}.rowResult{grid-template-columns:1fr}}
  @media (max-width:620px){.fields,.fields.small,.metaGrid{grid-template-columns:1fr}.wrap{padding:14px}h1{font-size:24px}}

a {
  color: #9fd3ff !important;
  text-decoration: none;
}
a:hover {
  color: #c9e7ff !important;
  text-decoration: underline;
}


/* SpaceOpsLab branded breadcrumb - inline fallback so it always renders */
.breadcrumb{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:12px;
  color:var(--muted);
  font-size:1.15rem;
  line-height:1.2;
}
.breadcrumb a.sol-brand-link{
  display:inline-flex;
  align-items:center;
  gap:0;
  color:inherit !important;
  font-weight:850;
  text-decoration:none !important;
}
.breadcrumb a.sol-brand-link:hover{
  text-decoration:none !important;
}
.sol-site-mark{
  display:inline-flex;
  width:1.6em;
  height:1.6em;
  margin-right:.42em;
  vertical-align:-.22em;
  flex:0 0 auto;
  filter:drop-shadow(0 0 8px rgba(126,231,135,.25));
}
.sol-site-mark svg{
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
}
.sol-brand-space,
.sol-brand-lab{
  color:#7ee787;
  font-weight:900;
}
.sol-brand-ops{
  color:#9ad7ff;
  font-weight:850;
}
.breadcrumb a.sol-brand-link:hover .sol-brand-space,
.breadcrumb a.sol-brand-link:hover .sol-brand-lab{
  color:#9ff5ad;
}
.breadcrumb a.sol-brand-link:hover .sol-brand-ops{
  color:#c9e7ff;
}
.breadcrumb .sep{
  color:#6f819f;
  padding:0 2px;
}
.breadcrumb .current{
  color:var(--muted);
}
.sol-orbit-logo{
  overflow:visible;
}
.sol-orbit-radiation{
  opacity:0;
  stroke:#7ee787;
  stroke-width:3.2;
  stroke-linecap:round;
  fill:none;
  transform-origin:76px 43px;
  filter:drop-shadow(0 0 8px rgba(126,231,135,.45));
}
.sol-orbit-radiation-1{
  animation:solOrbitRadiationPulse 5.5s ease-out .8s infinite;
}
.sol-orbit-radiation-2{
  animation:solOrbitRadiationPulse 5.5s ease-out 1.25s infinite;
}
@keyframes solOrbitRadiationPulse{
  0%{opacity:0;transform:scale(.72);}
  10%{opacity:.95;transform:scale(1.02);}
  22%{opacity:0;transform:scale(1.35);}
  100%{opacity:0;transform:scale(1.35);}
}
@media (prefers-reduced-motion: reduce){
  .sol-orbit-radiation-1,
  .sol-orbit-radiation-2{
    animation:none !important;
    opacity:0 !important;
  }
}
.actionRow{margin:12px 0 14px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.observerActionRow{justify-content:space-between;align-items:center}
.helperActions,.runActions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.runActions{margin-left:auto}
.observerActionRow #calcBtn{margin-left:0}
.btn .ico{margin-right:6px}
.advancedSettings{margin-top:12px;border:1px solid rgba(159,176,204,.20);border-radius:14px;background:rgba(11,18,32,.22);padding:0;overflow:hidden}
.advancedSettings summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;cursor:pointer;color:var(--text);font-size:13px;font-weight:850;list-style:none}
.advancedSettings summary::-webkit-details-marker{display:none}
.advancedSettings summary::after{content:'▾';color:var(--muted);font-size:12px;transition:transform .16s ease}
.advancedSettings[open] summary::after{transform:rotate(180deg)}
.advancedSettingsBody{padding:0 12px 12px}
.advancedSettings .hint{margin:0 0 10px}
.advancedSettings .fields{grid-template-columns:repeat(3,minmax(0,1fr))}
.advancedSettings .fields.small{grid-template-columns:repeat(4,minmax(0,1fr))}
:root[data-theme="light"] .advancedSettings{background:#edf4fc;border-color:#dce7f3}
@media (max-width:620px){.advancedSettings .fields,.advancedSettings .fields.small{grid-template-columns:1fr}}
.btn.primary{transition:transform .16s ease, box-shadow .16s ease, filter .16s ease}
.btn.primary:hover{transform:translateY(-1px);filter:saturate(1.08);box-shadow:0 0 0 1px rgba(159,211,255,.35),0 0 18px rgba(89,195,255,.38),0 10px 24px rgba(43,149,255,.22)}
.btn.primary:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(89,195,255,.28),0 0 22px rgba(89,195,255,.44)}
.status{font-size:13px;color:var(--muted);min-height:18px;flex-basis:100%;text-align:right}
@media (max-width:620px){.observerActionRow{display:grid;grid-template-columns:1fr;align-items:stretch}.helperActions,.runActions{display:grid;grid-template-columns:1fr 1fr;margin-left:0}.observerActionRow #calcBtn{width:100%}.status{text-align:left}}

.customAosControls{margin-top:10px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.addCustomBtn{padding:9px 12px}
.customHint{font-size:12px;color:var(--muted)}

.gridSquareReadout{margin-top:12px;min-height:42px;border:1px solid #273857;background:#1e2a40;color:var(--text);border-radius:12px;padding:10px 12px;font-size:13px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.gridSquareReadout span{color:var(--muted)}
.gridSquareReadout strong{font-size:15px;letter-spacing:.8px;color:#b7f5c2}
:root[data-theme="light"] .gridSquareReadout{background:#ffffff;color:var(--text);border-color:var(--border)}
.customAosList{display:grid;gap:10px}
.customAosRow{grid-template-columns:minmax(250px,.9fr) minmax(255px,1fr) auto auto;align-items:center}
.customAosLabelStack{display:grid;gap:8px}
.customAosLabelStack .label{margin:0}
.customAosValue{white-space:nowrap;min-width:230px}
.customAosPicker{width:100%;min-width:0;border-radius:12px;border:1px solid #30415f;background:#111827;color:var(--text);padding:10px 12px;font-size:14px;outline:none}
.customAosPicker:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(89,195,255,.14)}
.iconBtn{border:none;border-radius:10px;padding:9px 11px;background:#13203a;color:var(--text);border:1px solid var(--border);cursor:pointer}
@media (max-width:980px){.customAosRow{grid-template-columns:1fr}.customAosValue{min-width:0;white-space:normal}.customAosPicker{width:100%}}
.subLabel{margin-top:4px;font-size:12px;color:var(--muted);text-transform:none;letter-spacing:0;white-space:normal;line-height:1.25;}

/* SpaceOpsLab-style inline help popups */
.helpTip{
  display:inline-grid;
  place-items:center;
  width:16px;
  height:16px;
  margin-left:6px;
  border-radius:50%;
  border:1px solid rgba(159,211,255,.65);
  background:rgba(89,195,255,.10);
  color:#9fd3ff;
  font-size:11px;
  font-weight:800;
  line-height:1;
  cursor:help;
  position:relative;
  vertical-align:middle;
  text-transform:none;
  letter-spacing:0;
  z-index:20;
}
.helpTip:hover,
.helpTip:focus,
.helpTip:focus-visible{
  background:rgba(89,195,255,.18);
  border-color:#9fd3ff;
  color:#d9f0ff;
  outline:none;
}
.helpTip::after{
  content:attr(data-tip);
  position:absolute;
  left:50%;
  bottom:calc(100% + 10px);
  transform:translateX(-50%);
  width:260px;
  max-width:calc(100vw - 32px);
  padding:10px 12px;
  border-radius:12px;
  border:1px solid #30415f;
  background:#0b1220;
  color:var(--text);
  box-shadow:0 14px 34px rgba(0,0,0,.42);
  font-size:12px;
  font-weight:500;
  line-height:1.4;
  text-align:left;
  text-transform:none;
  letter-spacing:0;
  white-space:normal;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .14s ease, transform .14s ease;
  z-index:9999;
}
.helpTip::before{
  content:'';
  position:absolute;
  left:50%;
  bottom:calc(100% + 4px);
  transform:translateX(-50%);
  border:6px solid transparent;
  border-top-color:#30415f;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  z-index:10000;
}
.helpTip:hover::after,
.helpTip:focus::after,
.helpTip:focus-visible::after,
.helpTip:hover::before,
.helpTip:focus::before,
.helpTip:focus-visible::before{
  opacity:1;
  visibility:visible;
}
.field:nth-child(3n) .helpTip::after,
.fields.small .field:nth-child(4n) .helpTip::after,
.mini:nth-child(4n) .helpTip::after{
  left:auto;
  right:-8px;
  transform:none;
}
.field:nth-child(3n) .helpTip::before,
.fields.small .field:nth-child(4n) .helpTip::before,
.mini:nth-child(4n) .helpTip::before{
  left:auto;
  right:0;
  transform:none;
}
.card,.rowResult,.mini{overflow:visible;}

.aosSummaryHelp{
  transform:translateY(-1px);
}
#aosHeader .helpTip::after{
  left:0;
  right:auto;
  bottom:auto;
  top:calc(100% + 10px);
  transform:none;
}
#aosHeader .helpTip::before{
  left:6px;
  right:auto;
  bottom:auto;
  top:calc(100% + 4px);
  transform:none;
  border:6px solid transparent;
  border-bottom-color:#30415f;
}
@media (max-width:620px){
  .helpTip::after{
    left:auto;
    right:-8px;
    transform:none;
    width:min(260px, calc(100vw - 44px));
  }
  .helpTip::before{
    left:auto;
    right:0;
    transform:none;
  }
}

/* Observer search heading help opens downward and stays inside the card edge. */
.observerSearchHeading{position:relative;overflow:visible;}
.observerSearchHeading .observerSearchHelp::after{
  top:calc(100% + 10px) !important;
  bottom:auto !important;
  left:50% !important;
  right:auto !important;
  transform:translateX(-50%) !important;
  width:min(300px, calc(100vw - 56px)) !important;
  max-width:min(300px, calc(100vw - 56px)) !important;
  z-index:40001 !important;
}
.observerSearchHeading .observerSearchHelp::before{
  top:calc(100% + 4px) !important;
  bottom:auto !important;
  left:50% !important;
  right:auto !important;
  transform:translateX(-50%) !important;
  border:6px solid transparent !important;
  border-bottom-color:#30415f !important;
  border-top-color:transparent !important;
  z-index:40002 !important;
}
@media (max-width:620px){
  .observerSearchHeading .observerSearchHelp::after{
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
    width:min(280px, calc(100vw - 56px)) !important;
    max-width:min(280px, calc(100vw - 56px)) !important;
  }
  .observerSearchHeading .observerSearchHelp::before{
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
  }
}


.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.theme-toggle {
  display: inline-flex;
  align-items: center;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: rgba(11,20,40,0.80);
  cursor: pointer;
  flex:0 0 auto;
  box-shadow:var(--shadow);
}
.theme-toggle:hover{border-color:rgba(126,231,255,.40)}
.theme-toggle:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(89,195,255,.20),var(--shadow)}
.toggle-track {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 58px;
  height: 30px;
  padding: 0 7px;
  border-radius: 999px;
  background: rgba(5,10,22,0.65);
}
.toggle-icon {
  position: relative;
  z-index: 1;
  font-size: 0.83rem;
  line-height:1;
}
.toggle-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: linear-gradient(180deg, #ffffff, #d9e8ff);
  box-shadow: 0 4px 12px rgba(0,0,0,0.26);
  transition: transform 180ms ease;
}
:root[data-theme="light"] .toggle-thumb {
  transform: translateX(28px);
  background: linear-gradient(180deg, #fff6c7, #ffd166);
}
:root[data-theme="light"] .theme-toggle{
  background:rgba(11,20,40,0.82);
  border-color:rgba(19,32,51,.26);
}
:root[data-theme="light"] body{background:linear-gradient(180deg,rgba(7,13,24,.62),rgba(11,18,32,.88) 52%,rgba(238,244,251,.96)),url('/assets/images/earth-horizon.webp') center top / cover fixed no-repeat,var(--bg);}
:root[data-theme="light"] .card{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,251,255,.98));}
:root[data-theme="light"] .field input,
:root[data-theme="light"] .field textarea,
:root[data-theme="light"] .field select,
:root[data-theme="light"] .rowResult,
:root[data-theme="light"] .mini{background:#ffffff;color:var(--text);border-color:var(--border)}
:root[data-theme="light"] .btn.secondary,
:root[data-theme="light"] .rowResult .copy,
:root[data-theme="light"] .iconBtn{background:#edf4fc;color:var(--text);border-color:var(--border)}
:root[data-theme="light"] .btn.primary{background:linear-gradient(180deg,#3aa0ff,#1976d2);color:#ffffff}
:root[data-theme="light"] .customAosPicker{background:#ffffff;color:var(--text);border-color:var(--border)}
:root[data-theme="light"] #map{background:#e8f1fb;border-color:var(--border)}
:root[data-theme="light"] .helpTip::after{background:#ffffff;color:var(--text);border-color:var(--border);box-shadow:0 14px 34px rgba(31,58,87,.20)}
:root[data-theme="light"] .errorBox{background:#fff1f1;border-color:#e0aaaa;color:#7a1515}
/* Light mode SpaceOpsLab brand: subtle space-glass treatment so it reads over the hero image. */
:root[data-theme="light"] .breadcrumb{
  color:rgba(234,246,255,.86);
  text-shadow:0 2px 10px rgba(0,0,0,.34);
}
:root[data-theme="light"] .breadcrumb a.sol-brand-link{
  background:rgba(5,10,22,.30);
  border:1px solid rgba(234,246,255,.14);
  border-radius:999px;
  padding:3px 9px 3px 5px;
  box-shadow:0 8px 20px rgba(5,10,22,.16);
  backdrop-filter:blur(7px);
}
:root[data-theme="light"] .breadcrumb a.sol-brand-link:hover{
  background:rgba(5,10,22,.40);
  border-color:rgba(126,231,255,.26);
}
:root[data-theme="light"] .sol-site-mark{filter:drop-shadow(0 0 7px rgba(126,231,135,.26));}
:root[data-theme="light"] .sol-brand-space,
:root[data-theme="light"] .sol-brand-lab{color:#7ee787;}
:root[data-theme="light"] .sol-brand-ops{color:#9ad7ff;}
:root[data-theme="light"] .utc .value{color:#0b5fa5;}
:root[data-theme="light"] .obs .value{color:#132033;}
:root[data-theme="light"] .qld .value{color:#08722f;}
/* Light mode title/header readability. Make it clearly switch to a light treatment without washing out the background. */
:root[data-theme="light"] .titleLine{
  display:inline-flex;
  align-items:baseline;
  max-width:100%;
  padding:7px 11px;
  border:1px solid rgba(19,32,51,.12);
  border-radius:14px;
  background:rgba(255,255,255,.72);
  box-shadow:0 10px 24px rgba(11,18,32,.13);
  backdrop-filter:blur(8px);
}
:root[data-theme="light"] .titleLine h1{
  color:#10223a;
  text-shadow:none;
}
:root[data-theme="light"] .titleLine .sub{
  color:#2e435d;
  text-shadow:none;
  font-weight:560;
}
@media (max-width:620px){
  :root[data-theme="light"] .titleLine{display:flex;}
}
@media (max-width:620px){.topbar{align-items:flex-start}.theme-toggle{padding:5px}.toggle-track{width:54px;height:28px}.toggle-thumb{width:22px;height:22px}:root[data-theme="light"] .toggle-thumb{transform:translateX(26px)}}

/* Upcoming AOS table: keep the table INSIDE the map card, with its own scrollbar */
.grid{min-width:0;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr) !important}
.grid > *, .stack, .card{min-width:0 !important;max-width:100%}
.mapCard{min-width:0 !important;max-width:100%;overflow:hidden !important}
.mapCard #map{min-width:0;max-width:100%}
.upcomingPasses{margin-top:14px;border-top:1px solid var(--border);padding-top:14px;min-width:0 !important;width:100%;max-width:100%;overflow:hidden !important}
.upcomingPassesHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px;min-width:0;max-width:100%}
.upcomingPassesHeader h3{margin:0;font-size:15px}
.upcomingPassesHint{margin-top:4px;color:var(--muted);font-size:12px;line-height:1.35}
.upcomingTableWrap{display:block;box-sizing:border-box;width:100%;max-width:100%;min-width:0;overflow-x:auto !important;overflow-y:hidden;border:1px solid #273857;border-radius:14px;background:#1e2a40;color:#ffffff;-webkit-overflow-scrolling:touch;scrollbar-width:thin;contain:inline-size}
.upcomingTable{width:1080px !important;min-width:1080px !important;max-width:1080px;border-collapse:collapse;font-size:13px;table-layout:fixed}
.upcomingTable th,.upcomingTable td{padding:10px 12px;text-align:left;border-bottom:1px solid rgba(159,176,204,.18);white-space:nowrap;vertical-align:middle}
.upcomingTable th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.45px;background:rgba(11,18,32,.35)}
.upcomingTable th:nth-child(1),.upcomingTable td:nth-child(1){width:46px;text-align:center}
.upcomingTable th:nth-child(2),.upcomingTable td:nth-child(2){width:210px}
.upcomingTable th:nth-child(3),.upcomingTable td:nth-child(3){width:260px}
.upcomingTable th:nth-child(4),.upcomingTable td:nth-child(4){width:112px}
.upcomingTable th:nth-child(5),.upcomingTable td:nth-child(5){width:90px}
.upcomingTable th:nth-child(6),.upcomingTable td:nth-child(6){width:135px}
.upcomingTable th:nth-child(7),.upcomingTable td:nth-child(7){width:145px}
.upcomingCellScroll{display:block;max-width:100%;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:thin;padding-bottom:1px}

.upcomingTableWrap::-webkit-scrollbar,.upcomingCellScroll::-webkit-scrollbar{height:10px}
.upcomingTableWrap::-webkit-scrollbar-track,.upcomingCellScroll::-webkit-scrollbar-track{background:rgba(159,176,204,.14);border-radius:999px}
.upcomingTableWrap::-webkit-scrollbar-thumb,.upcomingCellScroll::-webkit-scrollbar-thumb{background:rgba(159,211,255,.55);border-radius:999px}
.upcomingTableWrap::-webkit-scrollbar-thumb:hover,.upcomingCellScroll::-webkit-scrollbar-thumb:hover{background:rgba(159,211,255,.78)}
.upcomingTable tr:last-child td{border-bottom:none}
.upcomingTable tbody tr.passRow{cursor:pointer;transition:background .14s ease, outline .14s ease}
.upcomingTable tbody tr.passRow:hover{background:rgba(89,195,255,.10)}
.upcomingTable tbody tr.passRow.selected{background:rgba(126,231,135,.12);outline:1px solid rgba(126,231,135,.45);outline-offset:-1px}
.visibilityBadge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:4px 8px;font-weight:800;font-size:12px;border:1px solid rgba(159,176,204,.25)}
.visibilityBadge.visible{color:#b7f5c2;background:rgba(126,231,135,.12);border-color:rgba(126,231,135,.38)}
.visibilityBadge.maybe{color:#ffe4ad;background:rgba(255,184,108,.12);border-color:rgba(255,184,108,.38)}
.visibilityBadge.no{color:#c9d7ec;background:rgba(159,176,204,.10);border-color:rgba(159,176,204,.22)}
.upcomingTable td:first-child{font-weight:800;color:#b7f5c2}
.upcomingEmpty{padding:12px;color:var(--muted);font-size:13px}
:root[data-theme="light"] .upcomingTableWrap{background:#ffffff;color:var(--text);border-color:var(--border)}
:root[data-theme="light"] .upcomingTable th{background:#edf4fc;color:var(--muted)}
:root[data-theme="light"] .upcomingTable th,
:root[data-theme="light"] .upcomingTable td{border-bottom-color:#dce7f3}
:root[data-theme="light"] .upcomingTable tbody tr.passRow:hover{background:#edf7ff}
:root[data-theme="light"] .upcomingTable tbody tr.passRow.selected{background:#eefbef;outline-color:rgba(23,138,67,.35)}
@media (max-width:620px){.upcomingPassesHeader{display:block}.upcomingTable{width:980px !important;min-width:980px !important;max-width:980px}.upcomingTable th,.upcomingTable td{padding:9px 10px}}
@media (max-width:980px){.grid{grid-template-columns:1fr !important}.mapCard{overflow:hidden !important}.upcomingTable{width:980px !important;min-width:980px !important;max-width:980px}}





/* Final containment fix: the upcoming AOS table is now OUTSIDE the two-column grid.
   This prevents it from changing the left/right column widths at all. */
.upcomingPassesCard{margin-top:14px;min-width:0 !important;width:100%;max-width:100%;overflow:hidden !important}
.upcomingPassesCard h2{margin:0;font-size:16px}
.upcomingPassesCard .upcomingTableWrap{display:block;width:100%;max-width:100%;min-width:0;overflow-x:scroll !important;overflow-y:hidden;border:1px solid #273857;border-radius:14px;background:#1e2a40;color:#ffffff;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(159,211,255,.75) rgba(159,176,204,.18)}
.upcomingPassesCard .upcomingTable{width:1320px !important;min-width:1320px !important;max-width:none !important;border-collapse:collapse;table-layout:fixed}
.upcomingPassesCard .upcomingTable th:nth-child(1),.upcomingPassesCard .upcomingTable td:nth-child(1){width:54px}
.upcomingPassesCard .upcomingTable th:nth-child(2),.upcomingPassesCard .upcomingTable td:nth-child(2){width:255px}
.upcomingPassesCard .upcomingTable th:nth-child(3),.upcomingPassesCard .upcomingTable td:nth-child(3){width:330px}
.upcomingPassesCard .upcomingTable th:nth-child(4),.upcomingPassesCard .upcomingTable td:nth-child(4){width:135px}
.upcomingPassesCard .upcomingTable th:nth-child(5),.upcomingPassesCard .upcomingTable td:nth-child(5){width:120px}
.upcomingPassesCard .upcomingTable th:nth-child(6),.upcomingPassesCard .upcomingTable td:nth-child(6){width:165px}
.upcomingPassesCard .upcomingTable th:nth-child(7),.upcomingPassesCard .upcomingTable td:nth-child(7){width:170px}
.upcomingPassesCard .upcomingTableWrap::-webkit-scrollbar{height:13px}
.upcomingPassesCard .upcomingTableWrap::-webkit-scrollbar-track{background:rgba(159,176,204,.18);border-radius:999px}
.upcomingPassesCard .upcomingTableWrap::-webkit-scrollbar-thumb{background:rgba(159,211,255,.75);border-radius:999px;border:2px solid rgba(30,42,64,.85)}
.upcomingPassesCard .upcomingCellScroll{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root[data-theme="light"] .upcomingPassesCard .upcomingTableWrap{background:#ffffff;color:var(--text);border-color:var(--border)}
@media (max-width:980px){.upcomingPassesCard .upcomingTable{width:1240px !important;min-width:1240px !important}}



/* FINAL SCROLL FIX v6 - force upcoming AOS table to be contained.
   The table is deliberately wider than its wrapper, and the wrapper owns the horizontal scroll. */
.wrap,
.grid,
.stack,
.mapCard,
.card,
.upcomingPassesCard{
  min-width:0 !important;
  box-sizing:border-box !important;
}
.grid{
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr) !important;
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
}
.stack,
.mapCard{
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
}
.upcomingPassesCard{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
  margin-top:14px !important;
}
.upcomingPassesCard .upcomingTableWrap{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow-x:scroll !important;
  overflow-y:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  border:1px solid #273857 !important;
  border-radius:14px !important;
}
.upcomingPassesCard .upcomingTable{
  display:table !important;
  table-layout:fixed !important;
  width:1420px !important;
  min-width:1420px !important;
  max-width:none !important;
  border-collapse:collapse !important;
}
.upcomingPassesCard .upcomingTable th,
.upcomingPassesCard .upcomingTable td{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.upcomingPassesCard .upcomingTable th:nth-child(1),
.upcomingPassesCard .upcomingTable td:nth-child(1){width:54px !important;}
.upcomingPassesCard .upcomingTable th:nth-child(2),
.upcomingPassesCard .upcomingTable td:nth-child(2){width:275px !important;}
.upcomingPassesCard .upcomingTable th:nth-child(3),
.upcomingPassesCard .upcomingTable td:nth-child(3){width:390px !important;}
.upcomingPassesCard .upcomingTable th:nth-child(4),
.upcomingPassesCard .upcomingTable td:nth-child(4){width:140px !important;}
.upcomingPassesCard .upcomingTable th:nth-child(5),
.upcomingPassesCard .upcomingTable td:nth-child(5){width:120px !important;}
.upcomingPassesCard .upcomingTable th:nth-child(6),
.upcomingPassesCard .upcomingTable td:nth-child(6){width:180px !important;}
.upcomingPassesCard .upcomingTable th:nth-child(7),
.upcomingPassesCard .upcomingTable td:nth-child(7){width:180px !important;}
.upcomingPassesCard .upcomingCellScroll{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
.upcomingPassesCard .upcomingTableWrap::-webkit-scrollbar{height:14px !important;}
.upcomingPassesCard .upcomingTableWrap::-webkit-scrollbar-track{background:rgba(159,176,204,.22) !important;border-radius:999px !important;}
.upcomingPassesCard .upcomingTableWrap::-webkit-scrollbar-thumb{background:rgba(159,211,255,.85) !important;border-radius:999px !important;border:2px solid rgba(30,42,64,.9) !important;}
@media (max-width:980px){
  .grid{grid-template-columns:1fr !important;}
  .upcomingPassesCard .upcomingTable{width:1320px !important;min-width:1320px !important;}
}


/* FINAL layout update: upcoming AOS lives under the map, but scrolls inside the map card. */
.grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr) !important;}
.grid > *, .stack, .mapCard{min-width:0 !important;}
.mapCard{overflow:hidden !important;}
.mapCard .upcomingPasses{
  margin-top:14px !important;
  padding-top:14px !important;
  border-top:1px solid var(--border) !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow:hidden !important;
}
.mapCard .upcomingPassesHeader{display:block !important;margin-bottom:10px !important;min-width:0 !important;}
.mapCard .upcomingPassesHeader h3{margin:0 !important;font-size:15px !important;}
.mapCard .upcomingTableWrap{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  border:1px solid #273857 !important;
  border-radius:14px !important;
  background:#1e2a40 !important;
  color:#ffffff !important;
  -webkit-overflow-scrolling:touch !important;
  scrollbar-width:thin !important;
  scrollbar-color:rgba(159,211,255,.85) rgba(159,176,204,.22) !important;
}
.mapCard .upcomingTable{
  width:880px !important;
  min-width:880px !important;
  max-width:880px !important;
  border-collapse:collapse !important;
  table-layout:fixed !important;
  font-size:12.5px !important;
}
.mapCard .upcomingTable th,.mapCard .upcomingTable td{
  padding:9px 10px !important;
  text-align:left !important;
  white-space:nowrap !important;
}
.mapCard .upcomingTable th:nth-child(1),.mapCard .upcomingTable td:nth-child(1){width:42px !important;text-align:center !important;}
.mapCard .upcomingTable th:nth-child(2),.mapCard .upcomingTable td:nth-child(2){width:185px !important;}
.mapCard .upcomingTable th:nth-child(3),.mapCard .upcomingTable td:nth-child(3){width:235px !important;}
.mapCard .upcomingTable th:nth-child(4),.mapCard .upcomingTable td:nth-child(4){width:96px !important;}
.mapCard .upcomingTable th:nth-child(5),.mapCard .upcomingTable td:nth-child(5){width:76px !important;}
.mapCard .upcomingTable th:nth-child(6),.mapCard .upcomingTable td:nth-child(6){width:105px !important;}
.mapCard .upcomingTable th:nth-child(7),.mapCard .upcomingTable td:nth-child(7){width:86px !important;}
.mapCard .upcomingCellScroll{display:block;max-width:100%;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:thin;}
.mapCard .upcomingTableWrap::-webkit-scrollbar,.mapCard .upcomingCellScroll::-webkit-scrollbar{height:12px !important;}
.mapCard .upcomingTableWrap::-webkit-scrollbar-track,.mapCard .upcomingCellScroll::-webkit-scrollbar-track{background:rgba(159,176,204,.22) !important;border-radius:999px !important;}
.mapCard .upcomingTableWrap::-webkit-scrollbar-thumb,.mapCard .upcomingCellScroll::-webkit-scrollbar-thumb{background:rgba(159,211,255,.85) !important;border-radius:999px !important;border:2px solid rgba(30,42,64,.9) !important;}
:root[data-theme="light"] .mapCard .upcomingTableWrap{background:#ffffff !important;color:var(--text) !important;border-color:var(--border) !important;}
@media (max-width:980px){.grid{grid-template-columns:1fr !important}.mapCard .upcomingTable{width:860px !important;min-width:860px !important;max-width:860px !important;}}



/* FINAL column balance tweak: keep Observer search/AOS results narrower and give the map/table side more room. */
@media (min-width:981px){
  .grid{
    grid-template-columns:minmax(380px,.86fr) minmax(0,1.14fr) !important;
    gap:14px !important;
  }
  .stack{
    max-width:560px !important;
    justify-self:stretch !important;
  }
  .mapCard{
    min-width:0 !important;
  }
}



/* FINAL small table tidy: keep upcoming AOS under the map, but make columns content-tight. */
.mapCard .upcomingTable{
  width:max-content !important;
  min-width:760px !important;
  max-width:none !important;
  table-layout:auto !important;
  font-size:12.25px !important;
}
.mapCard .upcomingTable th,
.mapCard .upcomingTable td{
  padding:8px 8px !important;
  white-space:nowrap !important;
}
.mapCard .upcomingTable th:nth-child(1),.mapCard .upcomingTable td:nth-child(1){width:34px !important;min-width:34px !important;text-align:center !important;}
.mapCard .upcomingTable th:nth-child(2),.mapCard .upcomingTable td:nth-child(2){width:150px !important;min-width:150px !important;}
.mapCard .upcomingTable th:nth-child(3),.mapCard .upcomingTable td:nth-child(3){width:165px !important;min-width:165px !important;}
.mapCard .upcomingTable th:nth-child(4),.mapCard .upcomingTable td:nth-child(4){width:82px !important;min-width:82px !important;}
.mapCard .upcomingTable th:nth-child(5),.mapCard .upcomingTable td:nth-child(5){width:62px !important;min-width:62px !important;}
.mapCard .upcomingTable th:nth-child(6),.mapCard .upcomingTable td:nth-child(6){width:86px !important;min-width:86px !important;}
.mapCard .upcomingTable th:nth-child(7),.mapCard .upcomingTable td:nth-child(7){width:70px !important;min-width:70px !important;}
.mapCard .upcomingCellScroll{
  display:block !important;
  width:max-content !important;
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
}
.mapCard .visibilityBadge{padding:3px 7px !important;font-size:11.5px !important;}
@media (max-width:980px){
  .mapCard .upcomingTable{width:max-content !important;min-width:760px !important;max-width:none !important;}
}



/* Final AOS table column tighten: remove spare width from UTC/Observer AOS columns. */
.mapCard .upcomingTable{
  width:max-content !important;
  min-width:680px !important;
  max-width:none !important;
  table-layout:auto !important;
  font-size:12px !important;
}
.mapCard .upcomingTable th,
.mapCard .upcomingTable td{
  padding:7px 6px !important;
  white-space:nowrap !important;
}
.mapCard .upcomingTable th:nth-child(1),
.mapCard .upcomingTable td:nth-child(1){width:30px !important;min-width:30px !important;max-width:30px !important;text-align:center !important;}
.mapCard .upcomingTable th:nth-child(2),
.mapCard .upcomingTable td:nth-child(2){width:132px !important;min-width:132px !important;max-width:132px !important;}
.mapCard .upcomingTable th:nth-child(3),
.mapCard .upcomingTable td:nth-child(3){width:138px !important;min-width:138px !important;max-width:138px !important;}
.mapCard .upcomingTable th:nth-child(4),
.mapCard .upcomingTable td:nth-child(4){width:76px !important;min-width:76px !important;max-width:76px !important;}
.mapCard .upcomingTable th:nth-child(5),
.mapCard .upcomingTable td:nth-child(5){width:58px !important;min-width:58px !important;max-width:58px !important;}
.mapCard .upcomingTable th:nth-child(6),
.mapCard .upcomingTable td:nth-child(6){width:76px !important;min-width:76px !important;max-width:76px !important;}
.mapCard .upcomingTable th:nth-child(7),
.mapCard .upcomingTable td:nth-child(7){width:64px !important;min-width:64px !important;max-width:64px !important;}
.mapCard .upcomingTable td:nth-child(2) .upcomingCellScroll{max-width:120px !important;width:120px !important;overflow:hidden !important;text-overflow:clip !important;}
.mapCard .upcomingTable td:nth-child(3) .upcomingCellScroll{max-width:126px !important;width:126px !important;overflow:hidden !important;text-overflow:clip !important;}
.mapCard .visibilityBadge{padding:3px 6px !important;font-size:11px !important;}
@media (max-width:980px){
  .mapCard .upcomingTable{min-width:680px !important;width:max-content !important;}
}



/* Final custom AOS row tidy: keep Copy buttons visible and collapse timezone picker after selection. */
.customAosRow{
  grid-template-columns:minmax(118px,.8fr) minmax(190px,1fr) auto auto !important;
  gap:8px !important;
  padding:12px !important;
  min-width:0 !important;
}
.customAosRow .customAosLabelStack{min-width:0 !important;gap:6px !important;}
.customAosRow .customAosValue{
  min-width:190px !important;
  max-width:none !important;
  white-space:nowrap !important;
  overflow:visible !important;
  font-size:20px !important;
  line-height:1.15 !important;
}
.customAosRow .customAosPicker{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  padding:8px 10px !important;
  font-size:13px !important;
}
.customTzChip{
  display:inline-flex;
  align-items:center;
  max-width:100%;
  min-width:0;
  border:1px solid var(--border);
  background:#13203a;
  color:var(--text);
  border-radius:999px;
  padding:6px 9px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.customTzChip:hover{border-color:var(--accent);}
:root[data-theme="light"] .customTzChip{background:#edf4fc;color:var(--text);border-color:var(--border);}
@media (max-width:980px){
  .customAosRow{grid-template-columns:1fr !important;}
  .customAosRow .customAosValue{min-width:0 !important;font-size:20px !important;}
}


/* Custom AOS timezone selector: keep rows compact, use a roomy popup for searching. */
.customAosRow{
  grid-template-columns:minmax(130px,.75fr) minmax(205px,1fr) auto auto !important;
  gap:8px !important;
}
.customAosRow .customAosPicker{display:none !important;}
.customAosRow .customTzChip{
  display:inline-flex !important;
  max-width:150px !important;
  min-width:120px !important;
  justify-content:center;
}
.customAosTzDialog{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(3,7,18,.55);
  z-index:20000;
}
.customAosTzDialog.open{display:flex;}
.customAosTzPanel{
  width:min(520px, calc(100vw - 32px));
  border:1px solid var(--border);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(17,24,39,.98),rgba(15,23,42,.98));
  box-shadow:0 22px 58px rgba(0,0,0,.42);
  padding:16px;
}
.customAosTzPanel h3{margin:0 0 6px;font-size:16px;}
.customAosTzPanel p{margin:0 0 12px;color:var(--muted);font-size:13px;line-height:1.35;}
.customAosTzSearch{
  width:100%;
  border-radius:12px;
  border:1px solid #30415f;
  background:#111827;
  color:var(--text);
  padding:12px 13px;
  font-size:15px;
  outline:none;
}
.customAosTzSearch:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(89,195,255,.14)}
.customAosTzActions{display:flex;gap:10px;justify-content:flex-end;margin-top:12px;flex-wrap:wrap;}
:root[data-theme="light"] .customAosTzPanel{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,251,255,.98));}
:root[data-theme="light"] .customAosTzSearch{background:#ffffff;color:var(--text);border-color:var(--border)}
@media (max-width:980px){
  .customAosRow{grid-template-columns:1fr !important;}
  .customAosRow .customTzChip{max-width:100% !important;width:max-content;}
}



/* ISS frequencies reference */
.issFreqTableWrap{
  margin-top:12px;
  overflow-x:auto;
  border:1px solid #273857;
  border-radius:14px;
  background:#1e2a40;
}
.issFreqTable{
  width:100%;
  min-width:760px;
  border-collapse:collapse;
  font-size:13px;
}
.issFreqTable th,
.issFreqTable td{
  padding:10px 11px;
  text-align:left;
  border-bottom:1px solid rgba(159,176,204,.18);
  vertical-align:top;
}
.issFreqTable tr:last-child td{border-bottom:none}
.issFreqTable th{
  color:var(--muted);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.45px;
  background:rgba(11,18,32,.35);
}
.issFreqTable code{
  color:#b7f5c2;
  background:rgba(11,18,32,.34);
  border:1px solid rgba(159,176,204,.16);
  border-radius:7px;
  padding:2px 5px;
  white-space:nowrap;
}
:root[data-theme="light"] .issFreqTableWrap{background:#ffffff;border-color:var(--border)}
:root[data-theme="light"] .issFreqTable th{background:#edf4fc}
:root[data-theme="light"] .issFreqTable th,
:root[data-theme="light"] .issFreqTable td{border-bottom-color:#dce7f3}
:root[data-theme="light"] .issFreqTable code{background:#edf4fc;color:#08722f;border-color:#dce7f3}

/* Map layer toggle */
.mapHeader{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.mapHeader h2{margin:0;font-size:16px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.mapInlineHint{color:var(--muted);font-size:12px;font-weight:500;line-height:1.2}
.mapLayerToggle{white-space:nowrap;border:1px solid var(--border);background:var(--pill);color:var(--text);border-radius:999px;padding:8px 11px;cursor:pointer;font-size:12px;font-weight:800;box-shadow:var(--shadow);display:inline-flex;align-items:center;gap:6px}
.mapLayerToggle:hover{border-color:var(--accent)}
.mapLayerToggle:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(89,195,255,.20),var(--shadow)}
.leaflet-control-layers{border:1px solid var(--border) !important;border-radius:12px !important;background:rgba(17,24,39,.94) !important;color:var(--text) !important;box-shadow:var(--shadow) !important;}
.leaflet-control-layers-expanded{padding:8px 10px !important;}
.leaflet-control-layers label{font-size:12px !important;}
:root[data-theme="light"] .leaflet-control-layers{background:rgba(255,255,255,.96) !important;color:var(--text) !important;}
@media (max-width:620px){.mapHeader{align-items:center}.mapLayerToggle{padding:7px 10px}.mapInlineHint{font-size:11.5px}}


/* Long-range upcoming AOS: vertical scroll + simple paging. */
.mapCard .upcomingTableWrap{
  max-height:460px !important;
  overflow-x:auto !important;
  overflow-y:auto !important;
}
.mapCard .upcomingTable thead th{
  position:sticky !important;
  top:0 !important;
  z-index:3 !important;
}
.upcomingPager{
  margin-top:10px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  color:var(--muted);
  font-size:12px;
}
.upcomingPager .iconBtn[disabled]{
  opacity:.45;
  cursor:not-allowed;
}
@media (max-width:620px){
  .mapCard .upcomingTableWrap{max-height:360px !important;}
  .upcomingPager{justify-content:space-between;}
}


/* Final fix: Upcoming AOS tooltip + vertical scroll clipping. */
.mapCard{
  position:relative !important;
}
.mapCard #map{
  position:relative !important;
  z-index:1 !important;
}
.mapCard .upcomingPasses{
  position:relative !important;
  z-index:5 !important;
}
.mapCard .upcomingPassesHeader{
  position:relative !important;
  z-index:20 !important;
}
.mapCard .upcomingPassesHeader .helpTip{
  z-index:30000 !important;
}
/* This tooltip sits below the heading instead of trying to open upward over the map. */
.mapCard .upcomingPassesHeader .helpTip::after{
  top:calc(100% + 10px) !important;
  bottom:auto !important;
  left:auto !important;
  right:-8px !important;
  transform:none !important;
  z-index:30001 !important;
}
.mapCard .upcomingPassesHeader .helpTip::before{
  top:calc(100% + 4px) !important;
  bottom:auto !important;
  left:auto !important;
  right:0 !important;
  transform:none !important;
  border:6px solid transparent !important;
  border-bottom-color:#30415f !important;
  border-top-color:transparent !important;
  z-index:30002 !important;
}
/* Make the scroll area do all clipping so body rows cannot slide under the header text. */
.mapCard .upcomingTableWrap{
  position:relative !important;
  overflow-x:auto !important;
  overflow-y:auto !important;
  clip-path:inset(0 round 14px) !important;
  z-index:2 !important;
}
.mapCard .upcomingTable{
  border-collapse:separate !important;
  border-spacing:0 !important;
}
.mapCard .upcomingTable thead{
  position:sticky !important;
  top:0 !important;
  z-index:50 !important;
}
.mapCard .upcomingTable thead th{
  position:sticky !important;
  top:0 !important;
  z-index:60 !important;
  background:#111827 !important;
  box-shadow:0 1px 0 rgba(159,176,204,.28), 0 8px 12px rgba(11,18,32,.55) !important;
}
.mapCard .upcomingTable tbody td{
  position:relative !important;
  z-index:1 !important;
}
:root[data-theme="light"] .mapCard .upcomingTable thead th{
  background:#edf4fc !important;
  box-shadow:0 1px 0 #dce7f3, 0 8px 12px rgba(31,58,87,.10) !important;
}


/* FINAL tooltip placement fix: keep Upcoming AOS help popup inside the map card.
   Previous versions positioned it to the left of the ? icon, which could let it sit
   underneath/behind the left column in the two-column layout. */
@media (min-width:981px){
  .grid{
    overflow:visible !important;
  }
  .grid > .stack{
    position:relative !important;
    z-index:1 !important;
  }
  .grid > .mapCard{
    position:relative !important;
    z-index:100 !important;
  }
}
.mapCard .upcomingPassesHeader h3{
  position:relative !important;
  overflow:visible !important;
}
.mapCard .upcomingPassesHeader .helpTip::after{
  top:calc(100% + 10px) !important;
  bottom:auto !important;
  left:0 !important;
  right:auto !important;
  transform:none !important;
  width:min(340px, calc(100vw - 44px)) !important;
  max-width:min(340px, calc(100vw - 44px)) !important;
  z-index:40001 !important;
}
.mapCard .upcomingPassesHeader .helpTip::before{
  top:calc(100% + 4px) !important;
  bottom:auto !important;
  left:3px !important;
  right:auto !important;
  transform:none !important;
  border:6px solid transparent !important;
  border-bottom-color:#30415f !important;
  border-top-color:transparent !important;
  z-index:40002 !important;
}
@media (max-width:620px){
  .mapCard .upcomingPassesHeader .helpTip::after{
    left:auto !important;
    right:-8px !important;
    width:min(300px, calc(100vw - 44px)) !important;
    max-width:min(300px, calc(100vw - 44px)) !important;
  }
  .mapCard .upcomingPassesHeader .helpTip::before{
    left:auto !important;
    right:0 !important;
  }
}


/* Sortable Upcoming AOS table headers */
.mapCard .upcomingTable th{user-select:none;}
.upcomingSortBtn{
  appearance:none;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  text-transform:inherit;
  letter-spacing:inherit;
  padding:0;
  margin:0;
  display:inline-flex;
  align-items:center;
  gap:4px;
  cursor:pointer;
  width:100%;
  justify-content:flex-start;
}
.mapCard .upcomingTable th:first-child .upcomingSortBtn{justify-content:center;}
.upcomingSortBtn:hover{color:#c9e7ff;}
.upcomingSortBtn:focus-visible{outline:2px solid rgba(89,195,255,.85);outline-offset:3px;border-radius:6px;}
.sortArrow{font-size:10px;opacity:.42;line-height:1;min-width:10px;text-align:center;}
.upcomingSortBtn.active .sortArrow{opacity:1;color:#7ee787;}
:root[data-theme="light"] .upcomingSortBtn:hover{color:#1976d2;}


/* Pass simulation controls */
.passSimulator{
  margin-top:12px;
  border:1px solid #273857;
  border-radius:14px;
  background:#1e2a40;
  color:#ffffff;
  padding:10px;
  display:grid;
  gap:8px;
}
.passSimulatorHeader{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.passSimulatorTitle{font-size:13px;font-weight:850;letter-spacing:.25px;text-transform:uppercase;color:var(--muted)}
.passSimulatorHint{margin-top:3px;color:var(--muted);font-size:12px;line-height:1.35;text-transform:none;letter-spacing:0;font-weight:500}
.passSimulatorControls{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.passSimulatorControls .iconBtn{padding:7px 9px;font-size:12px;font-weight:800}
.passSimTimeInline{display:inline-flex;align-items:center;gap:5px;border:1px solid rgba(159,176,204,.22);background:rgba(11,18,32,.30);border-radius:999px;padding:6px 9px;font-size:12px;white-space:nowrap;max-width:100%;}
.passSimTimeInline .k{color:var(--muted);font-weight:800;}
.passSimTimeInline .v{font-weight:900;color:var(--text);letter-spacing:-.08px;}
.simTimeRadioGroup{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;max-width:100%;}
.simControlSep{width:1px;height:20px;background:rgba(159,176,204,.32);flex:0 0 auto;}
.simTimeRadioGroup .radioDopplerBtn{padding:6px 9px !important;font-size:11.5px !important;box-shadow:none !important;}
.passSpeedSelect{border-radius:10px;border:1px solid var(--border);background:#13203a;color:var(--text);padding:7px 9px;font-size:12px;font-weight:800;outline:none;cursor:pointer}
.passSpeedSelect:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(89,195,255,.14)}
.passSimReadouts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.passSimMini{border:1px solid rgba(159,176,204,.18);border-radius:12px;background:rgba(11,18,32,.28);padding:7px 8px;min-width:0}
.passSimMini .k{color:var(--muted);font-size:11px;margin-bottom:3px}
.passSimMini .v{font-weight:850;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#simUtcOut{font-size:12px;letter-spacing:-.12px;text-overflow:clip}
#simRangeOut{font-size:12.5px;letter-spacing:-.08px;text-overflow:clip}
.passProgress{width:100%;accent-color:#59c3ff;cursor:pointer}
.passProgress:disabled{cursor:not-allowed;opacity:.55}
:root[data-theme="light"] .passSimulator{background:#ffffff;color:var(--text);border-color:var(--border)}
:root[data-theme="light"] .passSimMini{background:#edf4fc;border-color:#dce7f3}
:root[data-theme="light"] .passSimTimeInline{background:#edf4fc;border-color:#dce7f3}
:root[data-theme="light"] .passSpeedSelect{background:#edf4fc;color:var(--text);border-color:var(--border)}
@media (max-width:620px){.passSimReadouts{grid-template-columns:1fr 1fr}.passSimulatorHeader{display:block}.passSimulatorControls{margin-top:8px;justify-content:flex-start}.simTimeRadioGroup{width:100%;justify-content:center}.passSimTimeInline{justify-content:center}}


/* Optional radio/Doppler panel */
.radioDopplerToggleRow{display:contents}
.radioDopplerBtn{white-space:nowrap;border-radius:999px !important;padding:7px 10px !important}
.radioDopplerBtn.active{border-color:rgba(126,231,135,.55);background:rgba(126,231,135,.13);color:#b7f5c2;box-shadow:0 0 0 3px rgba(126,231,135,.08)}
.radioDopplerPanel{display:none;border:1px solid rgba(159,176,204,.18);border-radius:14px;background:rgba(11,18,32,.24);padding:8px;gap:8px}
.radioDopplerPanel.show{display:grid}
.radioDopplerControls{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(100px,.55fr);gap:7px;align-items:end}
.radioDopplerControls label{display:block;color:var(--muted);font-size:10.5px;margin-bottom:3px}
.radioDopplerControls select,.radioDopplerControls input{width:100%;border-radius:10px;border:1px solid var(--border);background:#13203a;color:var(--text);padding:7px 8px;font-size:12px;font-weight:750;outline:none}
.radioDopplerReadouts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.radioDopplerMini{border:1px solid rgba(159,176,204,.16);border-radius:12px;background:rgba(11,18,32,.22);padding:7px 8px;min-width:0}
.radioDopplerMini .k{color:var(--muted);font-size:10px;margin-bottom:2px}
.radioDopplerMini .v{font-weight:850;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.radioDopplerNote{color:var(--muted);font-size:11px;line-height:1.3}
:root[data-theme="light"] .radioDopplerPanel{background:#f7fbff;border-color:#dce7f3}
:root[data-theme="light"] .radioDopplerMini{background:#edf4fc;border-color:#dce7f3}
:root[data-theme="light"] .radioDopplerControls select,
:root[data-theme="light"] .radioDopplerControls input{background:#ffffff;color:var(--text);border-color:var(--border)}
@media (max-width:620px){.radioDopplerControls{grid-template-columns:1fr}.radioDopplerReadouts{grid-template-columns:1fr 1fr}}


/* Location undo strip: forgiving map-click location changes without popups. */
.locationUndoBar{
  display:none;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:10px;
  border:1px solid rgba(255,184,108,.42);
  background:rgba(255,184,108,.12);
  color:var(--text);
  border-radius:14px;
  padding:9px 10px;
  font-size:12.5px;
  line-height:1.35;
}
.locationUndoBar.show{display:flex;}
.locationUndoBar strong{font-weight:850;color:#ffe4ad;}
.locationUndoBtn{
  border:1px solid rgba(255,184,108,.55);
  background:#13203a;
  color:var(--text);
  border-radius:999px;
  padding:7px 10px;
  font-size:12px;
  font-weight:850;
  cursor:pointer;
  white-space:nowrap;
}
.locationUndoBtn:hover{border-color:#ffcf8a;}
:root[data-theme="light"] .locationUndoBar{background:#fff7ea;border-color:#e7b569;color:var(--text);}
:root[data-theme="light"] .locationUndoBar strong{color:#8a4f00;}
:root[data-theme="light"] .locationUndoBtn{background:#ffffff;color:var(--text);border-color:#d99a43;}
@media (max-width:620px){.locationUndoBar{align-items:flex-start;flex-direction:column}.locationUndoBtn{width:100%;}}


/* Radio/Doppler lives with pass simulation because Doppler changes during the pass. */
.passRadioBlock{
  border-top:1px solid rgba(159,176,204,.16);
  padding-top:10px;
  margin-top:0;
  display:grid;
  gap:10px;
}
.passRadioBlock{display:grid;gap:0;}
.passRadioBlock .radioDopplerPanel{margin-top:0;}



/* Status now lives beside the Map title instead of under Calculate. */
.mapHeader .status{
  min-height:0;
  flex-basis:auto;
  text-align:left;
}
.gridLocationSep{color:var(--muted);margin:0 2px;}
#currentLocationName{
  letter-spacing:0;
  color:#b9e7ff;
  max-width:260px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@media (max-width:620px){
  .mapHeader .status{text-align:left;}
  #currentLocationName{max-width:100%;}
}



/* Reverse-geocode troubleshooting panel */
.geocodeDebugGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:10px;
}
.geocodeDebugItem{
  border:1px solid rgba(159,176,204,.18);
  border-radius:12px;
  background:rgba(11,18,32,.24);
  padding:10px;
  min-width:0;
}
.geocodeDebugItem .k{color:var(--muted);font-size:12px;margin-bottom:4px;}
.geocodeDebugItem .v{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
:root[data-theme="light"] .geocodeDebugItem{background:#edf4fc;border-color:#dce7f3;}
@media (max-width:620px){.geocodeDebugGrid{grid-template-columns:1fr;}}



/* Light mode result/readout contrast fixes. */
:root[data-theme="light"] .gridSquareReadout{
  background:rgba(255,255,255,.96) !important;
  color:#132033 !important;
  border-color:#b8c9dd !important;
  box-shadow:0 8px 22px rgba(31,58,87,.08) !important;
}
:root[data-theme="light"] .gridSquareReadout span,
:root[data-theme="light"] .gridLocationSep{
  color:#42566f !important;
}
:root[data-theme="light"] .gridSquareReadout strong,
:root[data-theme="light"] #currentGridSquare,
:root[data-theme="light"] #currentLocationName{
  color:#0f5f2f !important;
  font-weight:900 !important;
  text-shadow:none !important;
}
:root[data-theme="light"] .visibilityBadge.visible{
  color:#075d2a !important;
  background:#e7f8eb !important;
  border-color:#70b883 !important;
}
:root[data-theme="light"] .visibilityBadge.no{
  color:#25364c !important;
  background:#e8eef6 !important;
  border-color:#9fb1c7 !important;
}
:root[data-theme="light"] .visibilityBadge.maybe{
  color:#7a4500 !important;
  background:#fff3dc !important;
  border-color:#d99a43 !important;
}


/* SpaceOpsLab AOS layout refresh - compact observer controls, mini pass simulation, and tighter AOS cards. */
.advancedToolsRow{
  margin-top:12px;
  display:flex;
  align-items:flex-start;
  gap:10px;
  flex-wrap:wrap;
}
.advancedToolsRow .advancedSettings{
  margin-top:0 !important;
  min-width:190px;
  max-width:100%;
}
.advancedToolsRow .advancedSettings:not([open]){
  flex:0 0 auto;
  width:max-content;
}
.advancedToolsRow .advancedSettings[open]{
  flex:1 1 100%;
  order:2;
}
.clearSavedObserverBtn{
  align-self:flex-start;
  white-space:nowrap;
  padding:10px 12px !important;
  font-size:12.5px;
  min-height:40px;
}
.advancedSettings summary{
  min-height:40px;
  white-space:nowrap;
}
@media (max-width:720px){
  .advancedToolsRow{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:start;}
  .advancedToolsRow .advancedSettings{min-width:0;width:100%;}
  .advancedToolsRow .advancedSettings[open]{grid-column:1 / -1;order:0;}
  .clearSavedObserverBtn{width:auto;max-width:100%;}
}
@media (max-width:470px){
  .advancedToolsRow{grid-template-columns:1fr;}
  .clearSavedObserverBtn{width:100%;}
}

#aosHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
}
.resultTimeNote{
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(159,176,204,.20);
  background:rgba(11,18,32,.22);
  color:var(--muted);
  border-radius:999px;
  padding:4px 8px;
  font-size:11.5px;
  font-weight:750;
  line-height:1;
}
:root[data-theme="light"] .resultTimeNote{background:#edf4fc;border-color:#dce7f3;color:#42566f;}
.results{gap:8px !important;}
.rowResult{
  grid-template-columns:minmax(112px,.55fr) minmax(0,1fr) auto !important;
  gap:9px !important;
  padding:11px 12px !important;
}
.rowResult .value{
  font-size:clamp(19px, 2.1vw, 23px) !important;
  line-height:1.08;
  min-width:0;
  overflow-wrap:anywhere;
}
.rowResult .copy{padding:7px 10px !important;font-size:12px;font-weight:800;}
.metaGrid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:8px !important;margin-top:10px !important;}
.mini{padding:10px !important;}
.mini .v{font-size:14px !important;}
.customAosControls{margin-top:8px !important;}
.addCustomBtn{padding:8px 10px !important;font-size:12.5px;}
@media (max-width:620px){
  #aosHeader{align-items:flex-start;}
  .rowResult{grid-template-columns:1fr auto !important;}
  .rowResult .label,.rowResult .subLabel{grid-column:1 / -1;}
  .rowResult .value{font-size:21px !important;}
  .metaGrid{grid-template-columns:1fr 1fr !important;}
}
@media (max-width:420px){.metaGrid{grid-template-columns:1fr !important;}}

/* Keep the simulator useful, but shorter, so Upcoming AOS appears sooner. */
#map{height:340px !important;}
.passSimulator{
  margin-top:10px !important;
  padding:8px !important;
  gap:7px !important;
}
.passSimulatorHeader{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center !important;
  gap:8px !important;
}
.passSimulatorTitle{
  font-size:12px !important;
  white-space:nowrap;
}
.passSimulatorControls{
  justify-content:end !important;
  gap:5px !important;
  flex-wrap:nowrap !important;
  min-width:0;
}
.passSimulatorControls .iconBtn,
.passSpeedSelect{
  min-height:32px;
  padding:6px 8px !important;
  font-size:11.5px !important;
}
.simIconOnly{
  width:34px !important;
  min-width:34px !important;
  padding-left:0 !important;
  padding-right:0 !important;
  text-align:center;
}
.simTimeRadioGroup{gap:5px !important;min-width:0;}
.passSimTimeInline{
  padding:5px 8px !important;
  max-width:170px;
}
.passSimTimeInline .v{
  overflow:hidden;
  text-overflow:ellipsis;
}
.radioDopplerBtn{
  max-width:120px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.passProgress{
  margin:0 !important;
  height:22px;
}
.passSimReadouts{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:5px !important;
}
.passSimMini{padding:6px 7px !important;border-radius:10px !important;}
.passSimMini .k{font-size:10px !important;margin-bottom:2px !important;}
.passSimMini .v{font-size:12px !important;}
.legend{
  margin-top:8px !important;
  gap:8px 12px !important;
  font-size:11.5px !important;
}
.mapCard .upcomingPasses{
  margin-top:10px !important;
  padding-top:10px !important;
}
.mapCard .upcomingPassesHeader{margin-bottom:7px !important;}
.mapCard .upcomingPassesHeader h3{font-size:14px !important;}
.mapCard .upcomingTableWrap{max-height:390px !important;}
.mapCard .upcomingTable th,
.mapCard .upcomingTable td{padding:6px 6px !important;font-size:11.75px !important;}
.upcomingPager{margin-top:7px !important;}
@media (min-width:981px) and (max-height:820px){
  #map{height:300px !important;}
  .mapCard .upcomingTableWrap{max-height:330px !important;}
}
@media (max-width:980px){
  #map{height:310px !important;}
  .passSimulatorHeader{grid-template-columns:1fr !important;}
  .passSimulatorControls{justify-content:flex-start !important;flex-wrap:wrap !important;}
  .passProgress{order:-1;}
  .mapCard .upcomingPasses{margin-top:10px !important;}
}
@media (max-width:620px){
  #map{height:285px !important;}
  .passSimulator{margin-top:8px !important;}
  .passSimulatorTitle{font-size:11.5px !important;}
  .passSimulatorControls{display:grid !important;grid-template-columns:auto auto auto 1fr;align-items:center;gap:6px !important;}
  .simTimeRadioGroup{grid-column:1 / -1;width:100%;justify-content:space-between !important;}
  .passSimTimeInline{max-width:none;flex:1;}
  .radioDopplerBtn{max-width:155px;}
  .passSimReadouts{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .legend{font-size:11px !important;}
  .mapCard .upcomingTableWrap{max-height:320px !important;}
}


/* SpaceOpsLab AOS compact layout update - HTML/CSS/JS aligned */
#aosHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.resultTimeNote{
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(159,176,204,.22);
  border-radius:999px;
  padding:3px 8px;
  color:var(--muted);
  font-size:11.5px;
  font-weight:750;
  white-space:nowrap;
}
.advancedToolsRow{
  display:grid;
  grid-template-columns:max-content auto;
  align-items:start;
  gap:10px;
  margin-top:12px;
}
.advancedToolsRow .advancedSettings{
  margin-top:0;
  width:max-content;
  min-width:176px;
  max-width:100%;
}
.advancedToolsRow .advancedSettings[open]{
  grid-column:1 / -1;
  width:100%;
}
.clearSavedObserverBtn{
  align-self:start;
  justify-self:start;
  min-height:40px;
  padding:9px 11px;
  font-size:12.5px;
  line-height:1.15;
  white-space:nowrap;
}
.clearSavedObserverBtn:disabled{opacity:.78;cursor:default;}
.gridSquareReadout{min-height:38px;padding:8px 10px;}
.rowResult{padding:11px 12px;gap:10px;}
.rowResult .value{font-size:21px;line-height:1.15;}
.metaGrid{gap:8px;margin-top:10px;}
.mini{padding:10px;}
.passSimulator{
  margin-top:10px;
  border:1px solid rgba(159,176,204,.18);
  border-radius:14px;
  background:rgba(11,18,32,.18);
  padding:10px;
}
.passSimulatorHeader{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:8px;
}
.passSimulatorTitle{font-size:13px;font-weight:850;}
.passSimulatorControls{
  display:flex;
  gap:6px;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
}
.passSimulatorControls .iconBtn,
.passSimulatorControls .passSpeedSelect{
  min-height:34px;
}
.simIconOnly,
.radioDopplerBtn{
  width:36px;
  min-width:36px;
  padding:7px 0 !important;
  text-align:center;
  font-weight:900;
}
.passSpeedSelect{
  border-radius:10px;
  border:1px solid var(--border);
  background:#13203a;
  color:var(--text);
  padding:7px 8px;
  font-weight:800;
}
.simTimeRadioGroup{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}
.passSimTimeInline{
  display:flex;
  align-items:center;
  gap:5px;
  min-height:34px;
  padding:7px 9px;
  border:1px solid rgba(159,176,204,.18);
  border-radius:10px;
  background:rgba(30,42,64,.72);
}
.passSimTimeInline .k{font-size:11px;color:var(--muted);white-space:nowrap;}
.passSimTimeInline .v{font-size:12px;font-weight:800;white-space:nowrap;}
.passProgress{margin:9px 0 8px;width:100%;}
.passSimReadouts{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
}
.passSimMini{padding:8px 9px;border-radius:10px;}
.passSimMini .k{font-size:11px;margin-bottom:2px;}
.passSimMini .v{font-size:13px;}
.legend{margin-top:8px;gap:10px;}
.mapCard .upcomingPasses{margin-top:10px !important;padding-top:10px !important;}
.mapCard .upcomingPassesHeader{margin-bottom:7px !important;}
.mapCard .upcomingPassesHeader h3{font-size:14px !important;}
.mapCard .upcomingTable th,.mapCard .upcomingTable td{padding:7px 7px !important;}
.upcomingPager{margin-top:8px;}
:root[data-theme="light"] .passSimulator{background:rgba(237,244,252,.78);border-color:#dce7f3;}
:root[data-theme="light"] .passSimTimeInline{background:#ffffff;border-color:var(--border);}
:root[data-theme="light"] .passSpeedSelect{background:#edf4fc;color:var(--text);border-color:var(--border);}
@media (min-width:981px){
  #map{height:340px;}
  .passSimulator{padding:9px 10px;}
}
@media (max-width:980px){
  .advancedToolsRow{grid-template-columns:max-content minmax(0,auto);}
  .passSimulatorHeader{grid-template-columns:1fr;align-items:start;}
  .passSimulatorControls{justify-content:flex-start;}
  #map{height:320px;}
}
@media (max-width:620px){
  .advancedToolsRow{grid-template-columns:1fr;gap:8px;}
  .advancedToolsRow .advancedSettings,
  .advancedToolsRow .advancedSettings[open],
  .clearSavedObserverBtn{width:100%;justify-self:stretch;}
  #aosHeader{align-items:flex-start;}
  .resultTimeNote{font-size:11px;}
  .rowResult{grid-template-columns:1fr auto;padding:10px;}
  .rowResult .value{font-size:19px;}
  .rowResult .copy{grid-column:2;grid-row:1 / span 2;align-self:center;}
  .passSimulator{margin-top:8px;padding:9px;}
  .passSimulatorControls{display:grid;grid-template-columns:auto auto auto 1fr;gap:6px;width:100%;}
  .simTimeRadioGroup{grid-column:1 / -1;width:100%;display:grid;grid-template-columns:1fr auto;gap:6px;}
  .simControlSep{display:none;}
  .radioDopplerBtn{justify-self:end;}
  .passSimTimeInline{justify-content:center;}
  .passSimReadouts{grid-template-columns:1fr 1fr;}
  .legend{font-size:11.5px;gap:8px;}
  #map{height:300px;}
}


/* SpaceOpsLab AOS layout fixes */
/* Advanced settings: keep it inside the observer card and hide clear action until expanded. */
.advancedToolsRow{display:contents !important;}
.advancedSettings{
  margin-top:12px !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow:hidden !important;
}
.advancedSettings summary{
  width:100% !important;
  min-height:40px !important;
}
.advancedSettingsBody{
  min-width:0 !important;
  max-width:100% !important;
  overflow:hidden !important;
}
.advancedSettings .advancedFieldsMain,
.advancedSettings .advancedFieldsCompact,
.advancedSettings .fields,
.advancedSettings .fields.small{
  min-width:0 !important;
  max-width:100% !important;
}
.advancedSettings .advancedFieldsMain{
  grid-template-columns:minmax(0,1fr) !important;
}
.advancedSettings .advancedFieldsCompact{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}
.advancedFooterActions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:12px;
  padding-top:10px;
  border-top:1px solid rgba(159,176,204,.16);
}
.clearSavedObserverBtn{
  width:auto !important;
  max-width:100% !important;
  min-height:34px !important;
  padding:7px 10px !important;
  font-size:12px !important;
  white-space:normal !important;
}
/* Legend belongs directly under the map, before simulation controls. */
.mapCard > #map + .legend{
  margin-top:8px !important;
  margin-bottom:8px !important;
  padding-bottom:8px;
  border-bottom:1px solid rgba(159,176,204,.14);
}
/* Radio control: icon-only toggle so it cannot be cut off. */
.radioDopplerBtn{
  width:36px !important;
  min-width:36px !important;
  max-width:36px !important;
  padding-left:0 !important;
  padding-right:0 !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
}
.simTimeRadioGroup{
  flex:0 1 auto !important;
}
@media (max-width:620px){
  .advancedSettings .advancedFieldsCompact{grid-template-columns:1fr !important;}
  .advancedFooterActions{justify-content:stretch;}
  .clearSavedObserverBtn{width:100% !important;}
  .passSimulatorControls{grid-template-columns:auto auto auto auto !important;}
  .simTimeRadioGroup{grid-column:1 / -1 !important;grid-template-columns:1fr auto !important;}
}


/* SpaceOpsLab AOS refinements */
/* Compact identity header: brand, page title and subtitle share one top area to save height. */
.compactTopbar{
  align-items:flex-start !important;
  margin-bottom:10px !important;
}
.topbarIdentity{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
  flex:1 1 auto;
}
.topbarIdentity .breadcrumb{
  margin-bottom:0 !important;
  flex:0 0 auto;
}
.topbarIdentity .titleLine{
  margin:0 !important;
  display:flex !important;
  align-items:baseline !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  min-width:0;
}
.topbarIdentity .titleLine h1{
  font-size:24px !important;
  line-height:1.08 !important;
}
.topbarIdentity .titleLine .sub{
  font-size:13px !important;
  line-height:1.25 !important;
}
:root[data-theme="light"] .topbarIdentity .titleLine{
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
@media (max-width:860px){
  .topbarIdentity{display:grid;grid-template-columns:1fr;gap:5px;}
  .topbarIdentity .titleLine{display:block !important;}
  .topbarIdentity .titleLine .sub{margin-top:2px !important;}
}
@media (max-width:620px){
  .compactTopbar{align-items:flex-start !important;gap:10px !important;}
  .topbarIdentity .titleLine h1{font-size:22px !important;}
}

/* Custom AOS row delete: make it a small quiet control, not a huge X. */
.customAosRow .removeCustom{
  width:30px !important;
  min-width:30px !important;
  height:30px !important;
  min-height:30px !important;
  padding:0 !important;
  display:inline-grid !important;
  place-items:center !important;
  align-self:center !important;
  justify-self:end !important;
  border-radius:999px !important;
  font-size:16px !important;
  line-height:1 !important;
  font-weight:800 !important;
  color:var(--muted) !important;
  background:rgba(159,176,204,.08) !important;
  border:1px solid rgba(159,176,204,.22) !important;
  box-shadow:none !important;
}
.customAosRow .removeCustom:hover,
.customAosRow .removeCustom:focus-visible{
  color:#ffd6d6 !important;
  background:rgba(255,107,107,.14) !important;
  border-color:rgba(255,107,107,.45) !important;
  outline:none !important;
}
@media (max-width:980px){
  .customAosRow .removeCustom{justify-self:start !important;}
}

/* Radio toggle: keep icon-only but make it easier to hit and read. */
.radioDopplerBtn{
  width:44px !important;
  min-width:44px !important;
  max-width:44px !important;
  height:36px !important;
  min-height:36px !important;
  font-size:20px !important;
  line-height:1 !important;
  display:inline-grid !important;
  place-items:center !important;
}
.radioDopplerBtn.active{
  box-shadow:0 0 0 1px rgba(126,231,135,.38),0 0 16px rgba(126,231,135,.20) !important;
}

/* SpaceOpsLab AOS layout shift */
/* Put the upcoming AOS table in the results column, then move detailed AOS cards lower. */
.resultsUpcomingCard{
  padding:12px !important;
}
.resultsUpcomingCard .upcomingPassesHeader{
  margin-bottom:8px !important;
}
.resultsUpcomingCard .upcomingPassesHeader h3{
  margin:0 !important;
  font-size:15px !important;
}
.resultsUpcomingCard .upcomingTableWrap{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  border:1px solid #273857 !important;
  border-radius:14px !important;
  background:#1e2a40 !important;
  color:#ffffff !important;
  -webkit-overflow-scrolling:touch !important;
  scrollbar-width:thin !important;
  scrollbar-color:rgba(159,211,255,.85) rgba(159,176,204,.22) !important;
}
.resultsUpcomingCard .upcomingTable{
  width:max-content !important;
  min-width:700px !important;
  max-width:none !important;
  table-layout:auto !important;
  font-size:12px !important;
}
.resultsUpcomingCard .upcomingTable th,
.resultsUpcomingCard .upcomingTable td{
  padding:7px 7px !important;
  white-space:nowrap !important;
}
.resultsUpcomingCard .upcomingTable th:nth-child(1),
.resultsUpcomingCard .upcomingTable td:nth-child(1){width:34px !important;min-width:34px !important;text-align:center !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(2),
.resultsUpcomingCard .upcomingTable td:nth-child(2){width:150px !important;min-width:150px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(3),
.resultsUpcomingCard .upcomingTable td:nth-child(3){width:165px !important;min-width:165px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(4),
.resultsUpcomingCard .upcomingTable td:nth-child(4){width:82px !important;min-width:82px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(5),
.resultsUpcomingCard .upcomingTable td:nth-child(5){width:62px !important;min-width:62px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(6),
.resultsUpcomingCard .upcomingTable td:nth-child(6){width:86px !important;min-width:86px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(7),
.resultsUpcomingCard .upcomingTable td:nth-child(7){width:70px !important;min-width:70px !important;}
.resultsUpcomingCard .upcomingCellScroll{
  display:block !important;
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
}
.resultsUpcomingCard .visibilityBadge{padding:3px 7px !important;font-size:11.5px !important;}
.resultsUpcomingCard .upcomingPager{margin-top:8px !important;}
:root[data-theme="light"] .resultsUpcomingCard .upcomingTableWrap{background:#ffffff !important;color:var(--text) !important;border-color:var(--border) !important;}

/* With upcoming AOS removed from the map card, let the map breathe. */
.mapCard{display:grid;gap:8px;}
.mapCard #map{height:460px !important;}
.mapCard .passSimulator{margin-top:0 !important;}
@media (min-width:981px) and (max-height:820px){
  .mapCard #map{height:410px !important;}
}
@media (max-width:980px){
  .mapCard #map{height:380px !important;}
  .resultsUpcomingCard .upcomingTable{min-width:720px !important;}
}
@media (max-width:620px){
  .mapCard #map{height:330px !important;}
  .resultsUpcomingCard .upcomingTable{min-width:700px !important;}
}

/* Custom AOS row v6: wider timezone chip, actions stacked right. */
.customAosRow{
  grid-template-columns:minmax(0,1fr) auto !important;
  grid-template-areas:
    "main actions"
    "tz actions" !important;
  gap:8px 10px !important;
  align-items:center !important;
}
.customAosMain{grid-area:main;min-width:0;display:grid;gap:4px;}
.customAosTzArea{grid-area:tz;min-width:0;max-width:100%;}
.customAosActions{
  grid-area:actions;
  display:grid;
  gap:6px;
  align-content:center;
  justify-items:stretch;
  min-width:74px;
}
.customAosRow .customAosValue{
  min-width:0 !important;
  max-width:100% !important;
  font-size:21px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.customAosRow .customTzChip{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  justify-content:flex-start !important;
  padding:7px 10px !important;
}
.customAosRow .customCopy{
  width:100%;
  min-height:32px;
  padding:7px 10px !important;
}
.customAosRow .removeCustom{
  width:100% !important;
  min-width:0 !important;
  height:30px !important;
  min-height:30px !important;
  justify-self:stretch !important;
  font-size:11.5px !important;
  border-radius:10px !important;
  padding:0 8px !important;
}
@media (max-width:620px){
  .customAosRow{
    grid-template-columns:1fr !important;
    grid-template-areas:"main" "tz" "actions" !important;
  }
  .customAosActions{grid-template-columns:1fr 1fr;min-width:0;}
}

/* Amateur-radio style Doppler toggle icon. */
.radioDopplerBtn{
  width:48px !important;
  min-width:48px !important;
  max-width:48px !important;
  height:40px !important;
  min-height:40px !important;
  padding:0 !important;
}
.radioHamIcon,
.radioHamIcon svg{
  display:block;
  width:30px;
  height:30px;
}
.radioHamIcon .mast,
.radioHamIcon .wave{
  fill:none;
  stroke:currentColor;
  stroke-width:3.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.radioHamIcon .outer{opacity:.68;}
.radioHamIcon .core{fill:currentColor;}
.radioDopplerBtn.active .radioHamIcon{color:#b7f5c2;filter:drop-shadow(0 0 7px rgba(126,231,135,.35));}


/* SpaceOpsLab AOS table and radio refinements */
/* Upcoming table: show 10 at a time in JS, tighten the columns, and make AOS times copyable. */
.resultsUpcomingCard .upcomingTable{
  min-width:620px !important;
  font-size:11.8px !important;
}
.resultsUpcomingCard .upcomingTable th,
.resultsUpcomingCard .upcomingTable td{
  padding:6px 6px !important;
}
.resultsUpcomingCard .upcomingTable th:nth-child(1),
.resultsUpcomingCard .upcomingTable td:nth-child(1){width:30px !important;min-width:30px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(2),
.resultsUpcomingCard .upcomingTable td:nth-child(2){width:118px !important;min-width:118px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(3),
.resultsUpcomingCard .upcomingTable td:nth-child(3){width:126px !important;min-width:126px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(4),
.resultsUpcomingCard .upcomingTable td:nth-child(4){width:72px !important;min-width:72px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(5),
.resultsUpcomingCard .upcomingTable td:nth-child(5){width:54px !important;min-width:54px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(6),
.resultsUpcomingCard .upcomingTable td:nth-child(6){width:72px !important;min-width:72px !important;}
.resultsUpcomingCard .upcomingTable th:nth-child(7),
.resultsUpcomingCard .upcomingTable td:nth-child(7){width:56px !important;min-width:56px !important;}
.tableCopyTime{
  display:inline-flex;
  align-items:center;
  max-width:100%;
  border:0;
  border-radius:8px;
  padding:4px 6px;
  margin:-4px -5px;
  background:transparent;
  color:var(--text);
  font:inherit;
  font-weight:650;
  white-space:nowrap;
  cursor:copy;
}
.tableCopyTime:hover,
.tableCopyTime:focus-visible{
  background:rgba(89,195,255,.12);
  color:#c9e7ff;
  outline:none;
  box-shadow:0 0 0 1px rgba(159,211,255,.28);
}
.tableCopyTime.copied{
  background:rgba(126,231,135,.14);
  color:#b7f5c2;
}
:root[data-theme="light"] .tableCopyTime:hover,
:root[data-theme="light"] .tableCopyTime:focus-visible{
  color:#0b5fa5;
  background:#edf7ff;
}
@media (max-width:620px){
  .resultsUpcomingCard .upcomingTable{min-width:640px !important;}
}

/* Radio Doppler helper: now an expandable section above the radio controls. */
.passRadioBlock{
  margin-top:8px !important;
  border:1px solid rgba(159,176,204,.20);
  border-radius:14px;
  overflow:hidden;
  background:rgba(11,18,32,.18);
}
.radioDopplerHeader{
  width:100%;
  border:0;
  border-bottom:1px solid rgba(159,176,204,.16);
  background:rgba(19,32,58,.78);
  color:var(--text);
  min-height:42px;
  padding:8px 11px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:10px;
  cursor:pointer;
  text-align:left;
  font-weight:850;
}
.radioDopplerHeader:hover,
.radioDopplerHeader:focus-visible{
  background:rgba(89,195,255,.12);
  outline:none;
}
.radioDopplerHeaderIcon{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  color:#9fd3ff;
}
.radioDopplerHeaderIcon .radioHamIcon,
.radioDopplerHeaderIcon .radioHamIcon svg{
  width:34px !important;
  height:34px !important;
}
.radioDopplerHeaderText{
  font-size:13px;
  letter-spacing:.1px;
}
.radioDopplerHeaderState{
  color:var(--muted);
  font-size:15px;
}
.radioDopplerPanel{
  display:none !important;
  padding:10px !important;
  margin:0 !important;
}
.radioDopplerPanel.show{
  display:grid !important;
}
.passRadioBlock .radioDopplerControls,
.passRadioBlock .radioDopplerReadouts{
  margin-top:0 !important;
}
:root[data-theme="light"] .passRadioBlock{
  background:#edf4fc;
  border-color:#dce7f3;
}
:root[data-theme="light"] .radioDopplerHeader{
  background:#edf4fc;
  border-bottom-color:#dce7f3;
}
:root[data-theme="light"] .radioDopplerHeader:hover,
:root[data-theme="light"] .radioDopplerHeader:focus-visible{
  background:#e5f3ff;
}


/* Custom AOS row v8: match UTC/Observer row rhythm, no info popup, smaller actions. */
.customAosRow{
  grid-template-columns:150px minmax(0,1fr) auto !important;
  grid-template-areas:
    "label value actions"
    "tz tz actions" !important;
  gap:7px 12px !important;
  align-items:center !important;
}
.customAosRow .customAosLabel{
  grid-area:label !important;
  min-width:0 !important;
}
.customAosRow .customAosValue{
  grid-area:value !important;
  min-width:0 !important;
  max-width:100% !important;
  font-size:23px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.customAosRow .customAosTzArea{
  grid-area:tz !important;
  min-width:0 !important;
  max-width:100% !important;
}
.customAosRow .customTzChip{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  justify-content:flex-start !important;
  padding:7px 10px !important;
}
.customAosRow .customAosActions{
  grid-area:actions !important;
  display:grid !important;
  gap:6px !important;
  align-content:center !important;
  justify-items:stretch !important;
  min-width:0 !important;
}
.customAosRow .customCopy,
.customAosRow .removeCustom{
  width:auto !important;
  min-width:64px !important;
  height:auto !important;
  min-height:0 !important;
  padding:9px 12px !important;
  border-radius:10px !important;
  font-size:13px !important;
  font-weight:600 !important;
  line-height:1.1 !important;
}
.customAosRow .removeCustom{
  opacity:.86;
}
.customAosRow .removeCustom:hover,
.customAosRow .removeCustom:focus-visible{
  opacity:1;
}
@media (max-width:620px){
  .customAosRow{
    grid-template-columns:1fr auto !important;
    grid-template-areas:
      "label actions"
      "value actions"
      "tz tz" !important;
    gap:7px 10px !important;
  }
  .customAosRow .customAosActions{align-self:center !important;}
  .customAosRow .customAosValue{font-size:20px !important;}
}

/* SpaceOpsLab AOS custom AOS final alignment fix.
   Make Custom AOS use the same left/value/action rhythm as UTC and Observer AOS. */
.customAosRow{
  grid-template-columns:minmax(112px,.55fr) minmax(0,1fr) max-content !important;
  grid-template-areas:
    "label value actions"
    "tz tz actions" !important;
  gap:7px 9px !important;
  align-items:center !important;
}
.customAosRow .customAosLabel{
  grid-area:label !important;
  align-self:center !important;
  min-width:0 !important;
}
.customAosRow .customAosValue{
  grid-area:value !important;
  min-width:0 !important;
  max-width:100% !important;
  font-size:clamp(19px, 2.1vw, 23px) !important;
  line-height:1.08 !important;
  letter-spacing:.3px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  justify-self:start !important;
}
.customAosRow .customAosTzArea{
  grid-area:tz !important;
  min-width:0 !important;
  max-width:100% !important;
}
.customAosRow .customAosActions{
  grid-area:actions !important;
  display:grid !important;
  grid-template-columns:max-content !important;
  gap:5px !important;
  align-content:center !important;
  justify-items:end !important;
  min-width:0 !important;
  width:max-content !important;
}
.customAosRow .customCopy,
.customAosRow .removeCustom{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  height:auto !important;
  min-height:0 !important;
  padding:7px 10px !important;
  border-radius:10px !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1.1 !important;
  white-space:nowrap !important;
  justify-self:end !important;
  align-self:center !important;
}
.customAosRow .removeCustom{
  opacity:.86 !important;
  color:var(--text) !important;
  background:#13203a !important;
  border:1px solid var(--border) !important;
  box-shadow:none !important;
}
.customAosRow .removeCustom:hover,
.customAosRow .removeCustom:focus-visible{
  opacity:1 !important;
  color:#ffd6d6 !important;
  background:rgba(255,107,107,.14) !important;
  border-color:rgba(255,107,107,.45) !important;
  outline:none !important;
}
:root[data-theme="light"] .customAosRow .removeCustom{
  background:#edf4fc !important;
  color:var(--text) !important;
  border-color:var(--border) !important;
}
@media (max-width:620px){
  .customAosRow{
    grid-template-columns:1fr max-content !important;
    grid-template-areas:
      "label actions"
      "value actions"
      "tz tz" !important;
    gap:7px 9px !important;
  }
  .customAosRow .customAosValue{font-size:20px !important;}
  .customAosRow .customAosActions{align-self:center !important;}
}

/* PROD light-mode readability fix: compact top title sits over the hero image. */
:root[data-theme="light"] .topbarIdentity .titleLine{
  padding:6px 10px !important;
  border:1px solid rgba(234,246,255,.16) !important;
  border-radius:14px !important;
  background:rgba(5,10,22,.34) !important;
  box-shadow:0 8px 20px rgba(5,10,22,.16) !important;
  backdrop-filter:blur(7px) !important;
}
:root[data-theme="light"] .topbarIdentity .titleLine h1{
  color:#f4fbff !important;
  text-shadow:0 2px 10px rgba(0,0,0,.42) !important;
}
:root[data-theme="light"] .topbarIdentity .titleLine .sub{
  color:rgba(234,246,255,.88) !important;
  text-shadow:0 2px 10px rgba(0,0,0,.38) !important;
  font-weight:560 !important;
}
@media (max-width:860px){
  :root[data-theme="light"] .topbarIdentity .titleLine{
    width:fit-content;
    max-width:100%;
  }
}


/* Compact Observer / Upcoming AOS UI update - 20260613 */
.observerTimeFields{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto !important;
  align-items:end;
}
.nowButtonField{
  align-self:end;
}
.nowButtonField .btn{
  width:100%;
  min-width:88px;
  padding:10px 12px;
}
.observerActionRow{
  margin-top:10px;
  margin-bottom:12px;
}
.observerActionRow .helperActions,
.observerActionRow .runActions{
  gap:8px;
}
.observerActionRow #getMyLocationBtn,
.observerActionRow #calcBtn{
  white-space:nowrap;
}
.upcomingPassesHeader{
  align-items:center;
}
.upcomingPassesHeader > div{
  min-width:0;
}
.upcomingRangeBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  white-space:nowrap;
  border:1px solid rgba(126,231,135,.35);
  background:rgba(126,231,135,.10);
  color:#b7f5c2;
  border-radius:999px;
  padding:4px 8px;
  font-size:11.5px;
  font-weight:850;
  line-height:1;
  letter-spacing:.15px;
}
:root[data-theme="light"] .upcomingRangeBadge{
  background:#eefbef;
  color:#08722f;
  border-color:rgba(23,138,67,.28);
}
@media (max-width:620px){
  .observerTimeFields{
    grid-template-columns:1fr 1fr auto !important;
    gap:8px;
  }
  .observerTimeFields .field label{
    font-size:11px;
    margin-bottom:5px;
  }
  .observerTimeFields .field input{
    padding:9px 9px;
    font-size:13px;
  }
  .nowButtonField .btn{
    min-width:64px;
    padding:9px 10px;
  }
  .nowButtonField .ico{
    display:none;
  }
  .observerActionRow{
    grid-template-columns:1fr 1fr !important;
    gap:8px;
  }
  .observerActionRow .helperActions,
  .observerActionRow .runActions{
    display:block;
    width:100%;
  }
  .observerActionRow #getMyLocationBtn,
  .observerActionRow #calcBtn{
    width:100%;
    padding-left:10px;
    padding-right:10px;
  }
  .upcomingPassesHeader{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:8px !important;
  }
  .mapCard .upcomingPassesHeader h3,
  .upcomingPassesHeader h3{
    font-size:14px !important;
  }
  .upcomingRangeBadge{
    font-size:11px;
    padding:4px 7px;
  }
}
@media (max-width:380px){
  .observerTimeFields{
    grid-template-columns:1fr 1fr !important;
  }
  .nowButtonField{
    grid-column:1 / -1;
  }
}

/* Observer card tighter header/tools layout - 20260613 ui4 */
.observerCard{
  padding-top:14px;
}
.observerHeaderRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.observerHeaderRow .observerSearchHeading{
  margin:0 !important;
  min-width:0;
}
.observerHeaderCalcBtn{
  flex:0 0 auto;
  white-space:nowrap;
  padding:9px 12px !important;
  min-height:38px;
}
.observerToolsRow{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) !important;
  align-items:start !important;
  gap:8px !important;
  margin:9px 0 10px !important;
}
.observerToolsRow #getMyLocationBtn{
  grid-column:1;
  justify-self:start;
  white-space:nowrap;
  min-height:38px;
  padding:9px 12px !important;
}
.observerAdvancedSettings{
  grid-column:2;
  justify-self:end;
  margin-top:0 !important;
  min-width:0;
  max-width:100%;
}
.observerAdvancedSettings:not([open]){
  width:max-content;
}
.observerAdvancedSettings summary{
  min-height:38px !important;
  padding:9px 11px !important;
}
.observerAdvancedSettings[open]{
  grid-column:1 / -1;
  width:100%;
  justify-self:stretch;
}
.observerAdvancedSettings[open] summary{
  width:max-content;
  max-width:100%;
  margin-left:auto;
}
.observerAdvancedSettings .advancedSettingsBody{
  padding-top:2px;
}
@media (max-width:620px){
  .observerHeaderRow{
    gap:8px;
  }
  .observerHeaderCalcBtn{
    padding:9px 10px !important;
    font-size:13px;
  }
  .observerHeaderCalcBtn .ico{
    display:none;
  }
  .observerToolsRow{
    grid-template-columns:1fr 1fr !important;
    align-items:start !important;
  }
  .observerToolsRow #getMyLocationBtn,
  .observerAdvancedSettings,
  .observerAdvancedSettings:not([open]){
    width:100%;
  }
  .observerToolsRow #getMyLocationBtn{
    justify-self:stretch;
  }
  .observerAdvancedSettings{
    justify-self:stretch;
  }
  .observerAdvancedSettings summary{
    justify-content:center;
  }
  .observerAdvancedSettings[open]{
    grid-column:1 / -1;
  }
  .observerAdvancedSettings[open] summary{
    margin-left:0;
    width:100%;
  }
}
@media (max-width:390px){
  .observerHeaderRow{
    display:grid;
    grid-template-columns:1fr;
  }
  .observerHeaderCalcBtn{
    width:100%;
  }
}

/* Observer next-pass smart status - 20260613 ui5 */
.observerHeaderActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  min-width:0;
  flex:0 1 auto;
}
.observerAosState{
  display:none;
  align-items:center;
  max-width:220px;
  min-width:0;
  border:1px solid rgba(126,231,135,.34);
  background:rgba(126,231,135,.11);
  color:#b7f5c2;
  border-radius:999px;
  padding:7px 10px;
  font-size:12px;
  font-weight:850;
  line-height:1.1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.observerAosState.show{display:inline-flex;}
.observerAosState[data-state="dirty"]{
  border-color:rgba(255,184,108,.42);
  background:rgba(255,184,108,.12);
  color:#ffe4ad;
}
.observerAosState[data-state="calculating"]{
  border-color:rgba(89,195,255,.38);
  background:rgba(89,195,255,.11);
  color:#c9e7ff;
}
.observerAosState[data-state="error"]{
  border-color:rgba(255,130,130,.42);
  background:rgba(255,130,130,.12);
  color:#ffd6d6;
}
.observerHeaderCalcBtn.isRecalculate{
  background:linear-gradient(180deg,#7ee787,#37a957) !important;
  color:#04120a !important;
}
.observerHeaderCalcBtn.isCalculating{
  opacity:.78;
  cursor:wait;
}
:root[data-theme="light"] .observerAosState{
  background:#eefbef;
  color:#08722f;
  border-color:rgba(23,138,67,.28);
}
:root[data-theme="light"] .observerAosState[data-state="dirty"]{
  background:#fff7ea;
  color:#8a4f00;
  border-color:#e7b569;
}
:root[data-theme="light"] .observerAosState[data-state="calculating"]{
  background:#edf7ff;
  color:#0b5fa5;
  border-color:#b8d9f5;
}
:root[data-theme="light"] .observerAosState[data-state="error"]{
  background:#fff1f1;
  color:#7a1515;
  border-color:#e0aaaa;
}
@media (max-width:620px){
  .observerHeaderActions{
    gap:6px;
    max-width:70%;
  }
  .observerAosState{
    max-width:150px;
    padding:7px 8px;
    font-size:11.5px;
  }
}
@media (max-width:390px){
  .observerHeaderActions{
    width:100%;
    max-width:100%;
    justify-content:space-between;
  }
  .observerAosState{
    max-width:calc(100% - 126px);
  }
}


/* Mobile polish - 20260613 mobile1
   Desktop layout is intentionally unchanged. */
.locateShort{display:none;}

@media (max-width:620px){
  .titleLine .sub{
    font-size:13px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:100%;
  }

  .observerHeaderRow{
    display:grid !important;
    grid-template-columns:1fr auto !important;
    align-items:start !important;
    gap:6px !important;
  }
  .observerHeaderRow .observerSearchHeading{
    grid-column:1;
    grid-row:1;
    align-self:center;
  }
  .observerHeaderActions{
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    width:100% !important;
    max-width:100% !important;
    justify-content:space-between !important;
    gap:8px !important;
  }
  .observerAosState{
    flex:1 1 auto !important;
    max-width:none !important;
    min-width:0 !important;
    padding:6px 8px !important;
    font-size:11px !important;
  }
  .observerHeaderCalcBtn{
    flex:0 0 auto !important;
    width:auto !important;
    min-width:0 !important;
    padding:8px 10px !important;
    font-size:12px !important;
    min-height:34px !important;
  }
  .observerHeaderCalcBtn .calcBtnText{white-space:nowrap;}

  .observerTimeFields{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto !important;
    gap:8px !important;
  }
  .nowButtonField .btn{
    width:auto !important;
    min-width:0 !important;
    padding:9px 11px !important;
    justify-self:start !important;
  }

  .locateFull{display:none;}
  .locateShort{display:inline;}
  .observerToolsRow #getMyLocationBtn,
  .observerAdvancedSettings summary{
    min-height:36px !important;
    padding:8px 10px !important;
    font-size:12px !important;
  }
  .observerToolsRow #getMyLocationBtn .ico{margin-right:4px;}

  .gridSquareReadout{
    min-height:0 !important;
    margin-top:8px !important;
    padding:8px 10px !important;
    font-size:12px !important;
  }
  .gridSquareReadout span:first-child,
  #currentGridSquare,
  .gridLocationSep{
    display:none !important;
  }
  .gridSquareReadout strong{
    font-size:13px !important;
    letter-spacing:0 !important;
  }
}

@media (max-width:980px){
  /* Mobile/tablet reading order: Observer → Upcoming table → Map → Results. */
  .grid{
    display:grid !important;
    grid-template-columns:1fr !important;
  }
  .stack{
    display:contents !important;
  }
  .observerCard{order:1;}
  .resultsUpcomingCard{order:2;}
  .mapCard{order:3;}
  .aosResultsCard{order:4;}
}

@media (max-width:390px){
  .observerHeaderRow{
    grid-template-columns:1fr !important;
  }
  .observerHeaderCalcBtn{
    width:auto !important;
  }
  .observerTimeFields{
    grid-template-columns:1fr 1fr auto !important;
  }
  .nowButtonField{
    grid-column:auto !important;
  }
}


/* Mobile polish - 20260613 mobile2: compact icon-first observer buttons */
.iconOnlyBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}
.iconOnlyBtn .ico,
.nowIconBtn .ico{
  margin-right:0 !important;
}
.nowIconBtn{
  width:44px !important;
  min-width:44px !important;
  min-height:42px !important;
  padding:9px !important;
}
.nowIconBtn .ico{
  display:inline-flex !important;
  font-size:1.28rem;
  line-height:1;
}
.locateBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
}
.locateBtn .ico{
  margin-right:0 !important;
  font-size:1.18rem;
  line-height:1;
}
.locateText{
  display:inline;
}
.locateFull,
.locateShort{
  display:none !important;
}

@media (max-width:620px){
  .nowIconBtn{
    width:42px !important;
    min-width:42px !important;
    min-height:38px !important;
    padding:8px !important;
  }
  .nowIconBtn .ico{
    font-size:1.35rem;
  }
  .locateBtn{
    gap:6px;
  }
  .locateBtn .ico{
    font-size:1.22rem;
  }
  .observerToolsRow #getMyLocationBtn .ico{
    margin-right:0 !important;
  }
}

@media (max-width:380px){
  .locateText{
    display:none !important;
  }
  .observerToolsRow #getMyLocationBtn{
    min-width:44px !important;
    width:auto !important;
    justify-self:start !important;
    padding-left:11px !important;
    padding-right:11px !important;
  }
  .observerToolsRow{
    grid-template-columns:auto minmax(0,1fr) !important;
  }
}


/* Mobile polish - 20260613 mobile3: location first, compact grid readout, shorter Next passes heading */
.gridSquareReadout{
  align-items:center;
  gap:6px;
}
#currentLocationName{
  max-width:360px;
}
#currentGridSquare{
  flex:0 0 auto;
}

@media (max-width:620px){
  .gridSquareReadout{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:4px !important;
    min-height:0 !important;
    padding:7px 8px !important;
    font-size:11px !important;
    line-height:1.2 !important;
    overflow:hidden !important;
  }
  .gridSquareReadout span,
  .gridLocationSep,
  #currentGridSquare,
  #currentLocationName{
    display:inline !important;
  }
  .gridSquareReadout span,
  .gridLocationSep{
    flex:0 0 auto !important;
    font-size:11px !important;
  }
  #currentLocationName{
    flex:1 1 auto !important;
    min-width:0 !important;
    max-width:42vw !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    font-size:12px !important;
    letter-spacing:0 !important;
  }
  #currentGridSquare{
    flex:0 0 auto !important;
    min-width:max-content !important;
    font-size:11px !important;
    letter-spacing:.25px !important;
    white-space:nowrap !important;
  }
}

@media (max-width:380px){
  #currentLocationName{
    max-width:34vw !important;
  }
  .gridSquareReadout{
    gap:3px !important;
    font-size:10.5px !important;
  }
  .gridSquareReadout span,
  .gridLocationSep,
  #currentGridSquare{
    font-size:10.5px !important;
  }
}
