:root {
  --paper:#faf8f3;
  --sand:#efebe1;
  --surface:#fffdfa;
  --panel:#ffffff;
  --ink:#211f1a;
  --muted:#5f594d;
  --faint:#8a8474;
  --line:#e2dccf;
  --line-strong:#cfc6b6;
  --snr:#35619c;
  --snr-soft:#e7f0fb;
  --cand:#b7763a;
  --cand-soft:#f5eadf;
  --wood:#9c6b43;
  --cyan:#1596a7;
  --grid:#d8d1c4;
  --shadow:0 18px 45px rgba(33,31,26,.08);
}
* { box-sizing:border-box; }
sup, sub { font-size:75%; line-height:0; position:relative; vertical-align:baseline; }
sup { top:-0.5em; }
sub { bottom:-0.25em; }
html { color-scheme:light; }
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  line-height:1.5;
  overflow-x:hidden;
}
a { color:var(--snr); text-decoration:none; }
a:hover { color:#294c7d; text-decoration:underline; text-underline-offset:3px; }
.site-header {
  display:grid;
  grid-template-columns:minmax(260px,1fr) auto auto;
  gap:22px;
  align-items:center;
  padding:14px clamp(18px,4vw,56px);
  background:rgba(250,248,243,.94);
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:20;
  backdrop-filter:blur(12px);
}
.brand-lockup { display:flex; align-items:center; gap:14px; color:var(--ink); min-width:0; }
.brand-lockup:hover { text-decoration:none; color:var(--ink); }
.brand-mark { width:78px; height:54px; object-fit:contain; flex:none; }
.brand-copy { display:flex; flex-direction:column; min-width:0; }
.brand-word { font-size:clamp(25px,3vw,38px); font-weight:650; letter-spacing:0; line-height:1; white-space:nowrap; }
.brand-tagline { margin-top:5px; color:var(--muted); font:500 12px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; letter-spacing:.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.site-nav { display:flex; align-items:center; gap:4px; }
.site-nav a { color:var(--ink); padding:8px 12px; border-radius:6px; font-weight:600; font-size:14px; }
.site-nav a:hover { background:var(--sand); text-decoration:none; }
.ver { justify-self:end; border:1px solid var(--line); border-radius:6px; padding:7px 10px; color:var(--muted); font-size:12px; background:var(--surface); white-space:nowrap; }
main { width:min(calc(100% - 40px), 1440px); margin:0 auto; padding:34px 0 24px; }
.site-footer { width:min(calc(100% - 40px), 1440px); margin:0 auto; padding:24px 0 34px; color:var(--muted); font-size:12px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:8px 18px; }
h1 { margin:0; font-size:clamp(32px,4.4vw,58px); line-height:1.05; letter-spacing:0; font-weight:720; }
/* Homepage only */
.hero h1 {
  font-size:clamp(28px,3vw,40px);
  line-height:1.12;
}
h2 { margin:0; font-size:16px; line-height:1.2; }
h3 { margin:0 0 8px; color:var(--ink); font-size:15px; }
.lede { max-width:78ch; margin:12px 0 0; color:#3f3a33; font-size:16px; }
.hero { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:28px; align-items:end; margin-bottom:24px; }
.stat-grid { display:grid; grid-template-columns:repeat(3,minmax(118px,1fr)); gap:10px; }
.stat-card { display:grid; gap:2px; border:1px solid var(--line); border-radius:8px; padding:14px 16px; background:var(--surface); min-width:118px; }
.stat-card strong { color:var(--snr); font-size:28px; line-height:1; }
.stat-card span { color:var(--muted); font-size:12px; font-weight:650; }
.stat-card.cand strong { color:var(--cand); }
.stat-card.total strong { color:var(--ink); }
.workbench, .viewer-panel, .propcard, .cutouts, pre {
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:8px;
  box-shadow:var(--shadow);
}
.workbench { overflow:hidden; min-width:0; }
#controls { display:flex; align-items:end; gap:12px; flex-wrap:wrap; padding:14px; border-bottom:1px solid var(--line); }
#controls label { display:grid; gap:5px; color:var(--muted); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.search-field { flex:1 1 300px; }
input, select, button {
  height:40px;
  background:var(--surface);
  color:var(--ink);
  border:1px solid var(--line-strong);
  border-radius:6px;
  padding:0 11px;
  font:600 14px ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}
input { width:100%; min-width:0; font-weight:500; }
button { cursor:pointer; }
button:hover, input:focus, select:focus { border-color:var(--snr); outline:none; }
.count { margin-left:auto; color:var(--ink); font-weight:750; padding:9px 0; white-space:nowrap; }
#wrap { display:grid; grid-template-columns:minmax(340px, 470px) minmax(0,1fr); min-height:560px; min-width:0; }
#skybox { border-right:1px solid var(--line); padding:0; background:linear-gradient(180deg,#fffdfa 0%,#faf8f3 100%); min-width:0; }
.panel-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:13px 16px; border-bottom:1px solid var(--line); }
.panel-head h2 span { color:var(--faint); font:700 11px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; margin-left:6px; }
.sky-zoom { display:flex; gap:4px; }
.sky-zoom button { height:26px; width:28px; padding:0; font-size:15px; font-weight:700; line-height:1; }
.sky-zoom button:disabled { opacity:.35; cursor:not-allowed; }
#sky {
  display:block; width:100%; height:auto; max-height:430px; aspect-ratio:460/430;
  background:#0b0d12; border-radius:2px; cursor:grab; touch-action:none;
  user-select:none; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none;
}
#sky:active { cursor:grabbing; }
#sky a { cursor:pointer; }
#sky circle { transition:stroke-width .12s ease, filter .12s ease; }
#sky a:hover circle, #sky a:focus circle { stroke:#f2b705; stroke-width:3; filter:drop-shadow(0 0 3px #f2b705); }
/* Fullscreen: the SVG (now viewBox-scaled) is sized to the largest 460:430
   box that fits once the header/legend/note rows are subtracted from the
   viewport height, then the whole stack is centred. --fs-w is that width;
   the surrounding rows share it so everything stays column-aligned. */
#skybox:fullscreen, #skybox:-webkit-full-screen {
  --fs-w:min(96vw, calc((100vh - 190px) * 1.069767));
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:#0b0d12; padding:24px; gap:10px;
}
#skybox:fullscreen .panel-head, #skybox:-webkit-full-screen .panel-head {
  width:var(--fs-w); border-bottom-color:#232733;
}
#skybox:fullscreen #sky-title, #skybox:-webkit-full-screen #sky-title { color:#e8e4db; }
#skybox:fullscreen .sky-zoom button, #skybox:-webkit-full-screen .sky-zoom button { background:#1b1e27; color:#e8e4db; border-color:#333c4d; }
#skybox:fullscreen #sky, #skybox:-webkit-full-screen #sky {
  width:var(--fs-w); height:auto; max-height:none; margin:0;
}
#skybox:fullscreen .map-legend, #skybox:-webkit-full-screen .map-legend,
#skybox:fullscreen .note, #skybox:-webkit-full-screen .note {
  width:var(--fs-w); color:#b9b4a6;
}
.map-legend { display:flex; gap:16px; align-items:center; padding:8px 16px 0; color:var(--muted); font-size:12px; }
.dot { display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:6px; vertical-align:-1px; }
.dot.snr { background:var(--snr); }
.dot.cand { background:var(--cand); }
.note { color:var(--muted); font-size:11.5px; opacity:.9; }
#skybox .note { margin:7px 16px 14px; }
/* The table cell has no intrinsic height (its content is absolutely
   positioned), so the sky-map cell alone sets the #wrap row height; the
   inner .table-scroll then fills that height and scrolls internally. */
#tablebox { position:relative; min-width:0; max-width:100%; background:var(--panel); }
.table-scroll { position:absolute; inset:0; overflow:auto; }
table { border-collapse:collapse; width:100%; font-size:12.5px; }
#tbl { min-width:1040px; }
th,td { padding:9px 12px; text-align:left; white-space:nowrap; border-bottom:1px solid #eee8dc; }
th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
#tbl th { position:sticky; top:0; z-index:1; background:#fbf8f1; cursor:pointer; user-select:none; }
#tbl tr:hover { background:#f6f0e7; }
.status-pill, .type-pill {
  display:inline-flex;
  align-items:center;
  min-height:22px;
  border-radius:6px;
  padding:2px 8px;
  font-size:12px;
  font-weight:750;
  line-height:1;
}
.status-pill.snr { color:var(--snr); background:var(--snr-soft); border:1px solid #b8d0ee; }
.status-pill.cand { color:#9b4f16; background:var(--cand-soft); border:1px solid #e2c4a7; }
.type-pill { color:#276071; background:#e1f4f6; border:1px solid #b9dfe5; }
.coverage { display:grid; grid-template-columns:1.2fr repeat(4,1fr); gap:18px; align-items:start; margin-top:24px; padding:22px 0 0; border-top:1px solid var(--line); }
.coverage h2 { font-size:22px; }
.coverage div { display:grid; gap:3px; border-left:1px solid var(--line); padding-left:16px; }
.coverage strong { color:var(--ink); }
.coverage span { color:var(--muted); font-size:12px; }
.page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:20px; }
.object-head h1 { font-size:clamp(30px,4vw,48px); }
.banner { background:#f6eadf; border-left:3px solid var(--cand); padding:10px 12px; font-size:13px; border-radius:6px; }
/* Balanced two-column flow (not a fixed grid): the Aladin viewer and each
   property-group card are independent break units, so shorter cards flow up
   to fill the column under the viewer instead of leaving it empty while a
   single tall column of cards runs down the other side. */
.objgrid { column-count:2; column-width:360px; column-gap:18px; }
.viewer-panel, .propcard { break-inside:avoid; -webkit-column-break-inside:avoid; margin-bottom:18px; }
.viewer-panel { padding:12px; }
#aladin { border-radius:6px; overflow:hidden; background:#111; }
#aladin.aladin-fullscreen { z-index:999; }
/* Aladin Lite's own CSS caps the SIMBAD source popup at 200px with clipped
   cells; widen it and turn on horizontal scroll so long values (designations,
   coordinates) stay readable. !important guards against load-order with
   aladin.css, which is injected by the script tag after ours. */
.aladin-popup-container { width:auto !important; max-width:min(90vw,480px) !important; }
.aladin-marker-measurement { overflow-x:auto !important; }
.aladin-measurement-div { overflow-x:auto !important; }
.aladin-measurement-div table { width:max-content !important; }
.aladin-measurement-div table tr td, .aladin-measurement-div table tr td a {
  max-width:none !important; white-space:nowrap !important;
}
.controls { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin:10px 0; }
.linkrow { display:flex; gap:10px; margin:10px 0 2px; flex-wrap:wrap; }
.linkrow a { border:1px solid var(--line); border-radius:6px; padding:6px 9px; background:var(--surface); font-size:13px; font-weight:650; }
.propcard { padding:12px; box-shadow:none; }
.propcard table th { width:56%; color:var(--muted); font-weight:650; text-transform:none; letter-spacing:0; font-size:12px; }
.propcard table th .note { margin-left:6px; }
pre { padding:14px; overflow-x:auto; font-size:12px; box-shadow:none; }
ul { padding-left:22px; }
.cutouts { padding:14px; margin-top:18px; }
.cutgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:12px; }
.cutgrid figure { margin:0; }
.cutgrid img { width:100%; border-radius:6px; display:block; image-rendering:auto; border:1px solid var(--line); }
.cutgrid figcaption { font-size:11.5px; margin-top:5px; line-height:1.35; color:var(--muted); }
.cutgrid figcaption .note { display:block; margin-left:0; }
.viz { background:var(--cand); color:#fff; border-radius:6px; padding:1px 6px; font-size:10px; margin-left:6px; }
@media (max-width:1100px) {
  .site-header { grid-template-columns:1fr; gap:10px; position:static; }
  .site-nav { order:2; overflow-x:auto; }
  .ver { justify-self:start; }
  .hero { grid-template-columns:1fr; }
  .stat-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  #wrap, .coverage { grid-template-columns:1fr; }
  #skybox { border-right:0; border-bottom:1px solid var(--line); }
  /* Stacked: the table gets its own row, so restore normal flow and cap the
     height instead of filling the (now absent) sibling column. */
  #tablebox { position:static; }
  .table-scroll { position:static; inset:auto; max-height:70vh; }
}
@media (max-width:680px) {
  main, .site-footer { width:min(calc(100% - 28px), 1440px); }
  h1 { font-size:28px; line-height:1.08; }
  .hero > div:first-child, .hero h1, .hero .lede { max-width:22.5rem; }
  .brand-mark { width:58px; height:40px; }
  .brand-word { font-size:25px; }
  .brand-tagline { display:none; }
  .stat-grid { grid-template-columns:1fr; }
  .objgrid { column-count:1; }
  #controls { align-items:stretch; }
  #controls label, #controls button, .count { width:100%; }
  .count { margin-left:0; padding:0; }
  th,td { padding:8px 10px; }
}

.litpanel{margin:1.2rem 0}
.litpanel summary{cursor:pointer;font-weight:600;padding:.5rem .75rem;background:var(--panel,#16213a);border-radius:8px}
.litpanel table{width:100%;font-size:.85rem;border-collapse:collapse;margin-top:.5rem}
.litpanel th,.litpanel td{text-align:left;padding:.25rem .5rem;border-bottom:1px solid rgba(125,150,200,.15)}
.litpanel td.note{opacity:.65;font-size:.78rem}