/* Go Astronomy reskin | night-sky theme, blue complementary to SolarSystemOS cyan */
:root {
--bg: #070b18;
--bg2: #0b1124;
--panel: #0f1730;
--line: #1d2a4c;
--line2: #2a3b66;
--text: #dfe6f5;
--muted: #8e9bb8;
--head: #38BDF8;
--gc: #f2a65a;
--accent: #f5c46b;
--nb: #ff86a8;
--oc: #63e0c2;
--gx: #ffc75a;
--pn: #b9a2ff;
--dn: #9aa3b8;
--ds: #e8eefc;
--f-head: "Archivo", system-ui, sans-serif;
--f-body: "Instrument Sans", system-ui, sans-serif;
--f-mono: "IBM Plex Mono", ui-monospace, monospace;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.65 var(--f-body); }
a { color: var(--head); text-decoration: none; }
a:hover { text-decoration: underline; }
.wrap { max-width: 1320px; margin: 0 auto; padding: 0 28px; }

/* header */
.site-head { position: sticky; top: 0; z-index: 50; background: rgba(7,11,24,.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.head-row { display: flex; align-items: center; gap: 28px; height: 64px; }
.logo { display: flex; align-items: center; gap: 10px; color: var(--text); text-decoration: none !important; }
.logo-mark { width: 38px; height: 38px; }
.lm-ms { stroke: var(--text); }
.lm-b { fill: var(--head); }
.lm-mf { fill: var(--muted); }
.logo-word { font: 500 19px/1 var(--f-head); letter-spacing: .14em; }
.logo-word b { font-weight: 800; margin-left: .35em; }
.logo.small .logo-mark { width: 28px; height: 28px; }
.logo.small .logo-word { font-size: 14px; }
.logo-wm { display: block; height: 22px; width: auto; }
.logo.small .logo-wm { height: 15px; }
.top-nav { margin-left: auto; }
.top-nav ul { display: flex; flex-wrap: nowrap; gap: 4px; list-style: none; margin: 0; padding: 0; }
.top-nav a { display: block; padding: 10px 12px; border-radius: 8px; color: #c6d0e6; font: 600 12.5px/1 var(--f-head); letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.top-nav a:hover { color: #fff; background: var(--panel); text-decoration: none; }
.top-nav a.on { color: var(--text); background: var(--panel); box-shadow: inset 0 -2px 0 var(--head); }
.yt svg { width: 22px; height: 22px; fill: var(--muted); display: block; }
.yt:hover svg { fill: #ff4d4d; }
.menu-btn { display: none; background: none; border: 0; padding: 6px; cursor: pointer; }
.menu-btn span { display: block; width: 22px; height: 2px; background: var(--text); margin: 4px 0; }
.crumbs { font: 13px/1 var(--f-mono); color: var(--muted); padding-top: 16px; padding-bottom: 4px; }
.crumbs .sep { margin: 0 6px; opacity: .5; }

/* hero */
.hero { padding: 18px 0 26px; }
.hero-text { max-width: 820px; }
.kicker { font: 500 12px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin: 10px 0 10px; }
h1 { font: 800 clamp(30px, 4vw, 46px)/1.05 var(--f-head); margin: 0 0 8px; letter-spacing: -.01em; }
.pron { font: 13px/1.4 var(--f-mono); color: var(--muted); margin: 0 0 12px; }
.lede { font-size: 18px; color: #c6d0e6; margin: 0 0 18px; }
.chart-fig, .map-fig { margin: 0; background: var(--bg2); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.chart-fig svg, .map-fig svg { display: block; width: 100%; height: auto; }
figcaption { font-size: 13px; color: var(--muted); padding: 10px 16px 14px; }
.chart-tools { display: flex; flex-wrap: wrap; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--line); background: var(--panel); }
.seg { display: inline-flex; border: 1px solid var(--line2); border-radius: 9px; overflow: hidden; }
.seg button { background: transparent; color: var(--muted); border: 0; border-right: 1px solid var(--line2); font: 500 13px/1 var(--f-body); padding: 8px 12px; cursor: pointer; }
.seg button:last-child { border-right: 0; }
.seg button:hover { color: var(--text); }
.seg button.on { background: #1a2a52; color: var(--text); }
.legend { display: inline-flex; flex-wrap: wrap; gap: 4px 12px; margin-left: 8px; }
.lg { display: inline-block; width: 12px; height: 12px; border: 2px solid currentColor; background: rgba(255,255,255,.04); border-radius: 3px; vertical-align: -1px; margin-right: 4px; }
.lg.nb { border-color: var(--nb) !important; }
.lg.oc { border-color: var(--oc) !important; border-style: dashed; border-radius: 50%; }
.lg.gx { border-color: var(--gx) !important; border-radius: 50%; height: 7px; vertical-align: 1px; }
.lg.pn { border-color: var(--pn) !important; border-radius: 50%; }
.lg.dn { border-color: var(--dn) !important; }
.lg.ds { border-color: var(--ds) !important; border-radius: 50%; }

/* data strip */
.data-strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--bg2); }
.data-strip dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin: 0; }
.data-strip dl > div { padding: 14px 16px; border-right: 1px solid var(--line); }
.data-strip dl > div:last-child { border-right: 0; }
.data-strip dt { font: 500 11px/1 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: 7px; }
.data-strip dd { margin: 0; font: 700 18px/1.2 var(--f-head); }
.data-strip small { display: block; font: 12px/1.4 var(--f-mono); color: var(--muted); margin-top: 3px; font-weight: 400; }

/* layout */
.page-grid { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 44px; padding-top: 34px; padding-bottom: 60px; }
.side-nav { position: sticky; top: 88px; align-self: start; max-height: calc(100vh - 100px); overflow: auto; font-size: 14px; }
.side-h { font: 500 11px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin: 0 0 10px; }
.toc, .side-rel { list-style: none; margin: 0 0 26px; padding: 0; border-left: 1px solid var(--line); }
.toc a, .side-rel a { display: block; padding: 5px 0 5px 14px; color: var(--muted); border-left: 2px solid transparent; margin-left: -1px; }
.toc a:hover, .side-rel a:hover { color: var(--text); text-decoration: none; }
.toc a.on { color: var(--text); border-left-color: var(--head); }
.content { max-width: 920px; }
.content section { margin-bottom: 52px; }
h2 { font: 700 26px/1.2 var(--f-head); color: var(--head); margin: 0 0 14px; }
.content p { margin: 0 0 14px; }
.hops { padding-left: 20px; }
.hops li { margin-bottom: 6px; }
.panel { margin: 18px 0 0; background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.panel svg { display: block; width: 100%; height: auto; }
.note { font-size: 13px; color: var(--muted); }

/* tables */
.tbl-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 12px; margin-top: 14px; }
.tbl-wrap.tall { max-height: 640px; }
table.data { width: 100%; border-collapse: collapse; font-size: 14px; }
table.data th { position: sticky; top: 0; background: var(--panel); text-align: left; font: 500 11px/1.2 var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); padding: 11px 12px; border-bottom: 1px solid var(--line2); white-space: nowrap; }
table.data td { padding: 9px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
table.data tbody tr:nth-child(even) td { background: rgba(255,255,255,.015); }
table.data tbody tr:hover td { background: #111c3a; }
table.data .num { text-align: right; font-family: var(--f-mono); font-size: 13px; white-space: nowrap; }
table.sortable th { cursor: pointer; }
table.sortable th.asc::after { content: " ▲"; color: var(--head); }
table.sortable th.desc::after { content: " ▼"; color: var(--head); }
.ids { display: block; font: 12px/1.4 var(--f-mono); color: var(--muted); }
.kind { font-size: 12px; padding: 2px 8px; border-radius: 20px; border: 1px solid; white-space: nowrap; }
.k-nb { color: var(--nb); border-color: rgba(255,134,168,.4); }
.k-oc { color: var(--oc); border-color: rgba(99,224,194,.4); }
.k-gx { color: var(--gx); border-color: rgba(255,199,90,.4); }
.k-pn { color: var(--pn); border-color: rgba(185,162,255,.4); }
.k-dn { color: var(--dn); border-color: rgba(154,163,184,.4); }
.k-ds { color: var(--ds); border-color: rgba(232,238,252,.35); }
.view { font: 12px/1 var(--f-mono); white-space: nowrap; }
.view::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; }
.v-eye::before { background: #7ee787; }
.v-bino::before { background: #8db4ff; }
.v-scope::before { background: #f5c46b; }
.v-image::before { background: #ff86a8; }
.tbl-tools { display: flex; align-items: center; gap: 14px; }
.tbl-tools input { background: var(--panel); border: 1px solid var(--line2); color: var(--text); border-radius: 9px; padding: 9px 12px; font: 14px var(--f-body); width: 280px; }
#ccount { font: 12px var(--f-mono); color: var(--muted); }
tr.hl td { background: rgba(245,196,107,.07) !important; }
.zbar { height: 8px; width: 160px; background: var(--line); border-radius: 4px; }
.zbar i { display: block; height: 100%; background: linear-gradient(90deg, #f5c46b, #ff9d5c); border-radius: 4px; }

/* locator + video + chips */
.loc-demo { display: flex; gap: 18px; align-items: center; margin-top: 18px; padding: 14px; border: 1px dashed var(--line2); border-radius: 12px; }
.loc-demo svg { width: 230px; flex: none; }
.loc-demo p { margin: 0; font-size: 14px; color: #c6d0e6; }
.video-ph { aspect-ratio: 16 / 9; border: 1px solid var(--line); border-radius: 12px; background: radial-gradient(circle at 50% 40%, #16234a, #070b18); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.video-ph svg { width: 64px; height: 64px; fill: #ff4d4d; }
.video-ph p { font: 700 18px var(--f-head); margin: 10px 0 2px; }
.video-ph small { color: var(--muted); font-family: var(--f-mono); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; }
.chips a { display: block; padding: 6px 14px; border: 1px solid var(--line2); border-radius: 20px; font-size: 14px; }

/* footer */
.site-foot { border-top: 1px solid var(--line); background: var(--bg2); padding-top: 40px; }
.f-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 24px; }
.f-h { font: 700 14px/1 var(--f-head); margin: 0 0 12px; color: var(--text); }
.f-col ul { list-style: none; margin: 0; padding: 0; }
.f-col li { margin-bottom: 7px; font-size: 14px; }
.f-col a { color: var(--muted); }
.f-col a:hover { color: var(--text); }
.f-bar { display: flex; align-items: center; gap: 24px; border-top: 1px solid var(--line); margin-top: 32px; padding-top: 18px; padding-bottom: 26px; font-size: 13px; color: var(--muted); }
.f-bar p { margin: 0; }
.f-bar p:last-child { margin-left: auto; }

/* ---------- SVG: sky chart ---------- */
.sky-bg { fill: #070b18; }
.grid { fill: none; stroke: #1a2647; stroke-width: .6; }
.bnd-fill { fill: rgba(141,180,255,.045); }
.bnd { fill: none; stroke: #6f8fd6; stroke-width: 1.2; stroke-dasharray: 5 4; }
.bnd-n { fill: none; stroke: #2f4170; stroke-width: .8; stroke-dasharray: 3 4; }
.ln { fill: none; stroke: #9cc0ff; stroke-width: 1.4; stroke-opacity: .75; }
.ln-n { fill: none; stroke: #4a5f93; stroke-width: 1; stroke-opacity: .6; }
.st.out { opacity: .42; }
.lbl { font: 12px var(--f-body); fill: #c9d4ee; paint-order: stroke; stroke: #070b18; stroke-width: 3px; stroke-linejoin: round; }
.st-lbl { fill: #e8eefc; }
.nb-lbl { font: 600 11px var(--f-head); letter-spacing: .18em; fill: #5a6f9f; }
.nb-link:hover .nb-lbl { fill: var(--head); }
.dso-lbl { font: 600 12px var(--f-mono); }
.dso-m { fill: none; stroke-width: 1.7; }
.dso-m.nb { stroke: var(--nb); fill: rgba(255,134,168,.12); }
.dso-m.oc { stroke: var(--oc); }
.dso-m.gx { stroke: var(--gx); fill: rgba(255,199,90,.12); }
.dso-m.pn { stroke: var(--pn); }
.dso-m.gc { stroke: var(--oc); }
.dso-m.dn { stroke: var(--dn); fill: rgba(0,0,0,.45); }
.dso-m.ds { fill: var(--ds); stroke: none; }
.dso-ring { fill: none; stroke: var(--ds); stroke-width: 1; stroke-dasharray: 2 2; }
.dso .dso-lbl { fill: #e8eefc; }
.dso:hover .dso-m { stroke-width: 3; }
.dso:hover .dso-lbl { fill: var(--accent); }
.dso { cursor: pointer; }
.compass circle { fill: rgba(7,11,24,.6); stroke: #2a3b66; }
.compass path { stroke: #4a5f93; }
.compass text { font: 600 11px var(--f-mono); fill: #8e9bb8; }
svg.hide-c .s-c, svg.hide-b .s-b { display: none; }
svg.off-dso .lyr-dso, svg.off-ln .lyr-ln, svg.off-bnd .lyr-bnd, svg.off-lbl .lyr-lbl { display: none; }
svg.off-lbl .dso-lbl { display: none; }
.rot { transition: transform .6s ease; }
svg.flip .rot { transform: rotate(180deg); }
svg.flip .rot text { transform-box: fill-box; transform-origin: center; transform: rotate(180deg); }

/* ---------- SVG: distance view ---------- */
.dist-chart .sky-bg { fill: #070b18; }
.side-only { opacity: 0; transition: opacity .5s; }
.dist-chart.side .side-only { opacity: 1; }
.band-a { fill: rgba(141,180,255,.06); }
.band-b { fill: rgba(185,162,255,.06); }
.band-c { fill: rgba(255,199,90,.05); }
.band-lbl { font: 600 11px var(--f-mono); letter-spacing: .14em; fill: #6c7ca3; }
.tick { stroke: #1d2a4c; stroke-dasharray: 2 4; }
.tick.edge { stroke: #b9a2ff; stroke-opacity: .5; stroke-dasharray: 6 4; }
.tick-lbl { font: 11px var(--f-mono); fill: #6c7ca3; }
.eye circle { fill: none; stroke: var(--head); stroke-width: 1.5; }
.eye text { font: 600 10px var(--f-mono); fill: var(--head); letter-spacing: .1em; }
.dl { stroke: #9cc0ff; stroke-opacity: .55; stroke-width: 1.2; }
.dp-lbl { font: 600 11.5px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.dp-dist { font: 10.5px var(--f-mono); fill: var(--accent); opacity: 0; transition: opacity .4s; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.dist-chart.side .dp-dist { opacity: 1; }
.dp a:hover .dp-lbl { fill: var(--accent); }

/* ---------- SVG: visibility strip ---------- */
.vs-m, .vs-l { font: 11px var(--f-mono); fill: #8e9bb8; }
.vs-c.v0 { fill: #0c1226; stroke: #1d2a4c; }
.vs-c.v1 { fill: #1a2b55; }
.vs-c.v2 { fill: #2d4c92; }
.vs-c.v3 { fill: #4d79d6; }
.vs-c.v4 { fill: #8db4ff; }
.vs-key text { font: 11px var(--f-body); fill: #8e9bb8; }

/* ---------- SVG: locator ---------- */
.locator .bnd { stroke-width: 1; }
.loc-box { fill: rgba(245,196,107,.12); stroke: var(--accent); stroke-width: 1.6; }

/* ---------- SVG: hub map ---------- */
.cz { fill: rgba(141,180,255,.0); stroke: #2a3b66; stroke-width: .8; transition: fill .15s; cursor: pointer; }
.cz-a:hover .cz { fill: rgba(141,180,255,.18); stroke: var(--head); }
.sky-map.filtering .cz { fill: rgba(7,11,24,.0); }
.sky-map.filtering .cz.match { fill: rgba(141,180,255,.16); stroke: #6f8fd6; }
.sky-map.filtering .map-st { opacity: .5; }
.map-ln { fill: none; stroke: #4a6bb3; stroke-width: .8; stroke-opacity: .7; pointer-events: none; }
.map-st { pointer-events: none; }
.map-lbl { font: 600 9px var(--f-mono); fill: #6c7ca3; letter-spacing: .06em; pointer-events: none; }
.eq { fill: none; stroke: #2a3b66; stroke-width: 1; }
.map-gal .eq { stroke-dasharray: 3 3; stroke: #3a4f80; }
.ecl { fill: none; stroke: var(--accent); stroke-width: 1.2; stroke-dasharray: 6 4; stroke-opacity: .8; pointer-events: none; }
.axis { font: 11px var(--f-mono); fill: #6c7ca3; }
.ecl-lbl { fill: var(--accent); letter-spacing: .14em; }

/* responsive */
@media (max-width: 1100px) {
.f-grid { grid-template-columns: repeat(3, 1fr); }
.top-nav a { padding: 8px 7px; letter-spacing: .07em; }
.head-row { gap: 14px; }
}
@media (max-width: 900px) {
.page-grid { grid-template-columns: 1fr; }
.side-nav { display: none; }
.top-nav { display: none; position: absolute; top: 64px; left: 0; right: 0; background: var(--bg); border-bottom: 1px solid var(--line); }
.nav-open .top-nav { display: block; }
.top-nav ul { flex-direction: column; padding: 10px 20px; }
.menu-btn { display: block; margin-left: auto; }
.yt { margin-left: 0; }
.loc-demo { flex-direction: column; }
}

/* insets and distance groups */
.inset-bg { fill: #050815; stroke: #3a5290; stroke-width: 1.2; }
.inset-mark { fill: none; stroke: #f5c46b; stroke-width: 1; stroke-dasharray: 3 3; stroke-opacity: .8; }
.inset-lbl { font: 600 11px var(--f-mono); fill: var(--accent); }
.inset-title { font: 600 10px var(--f-mono); letter-spacing: .12em; fill: var(--accent); }
svg.flip .inset { display: none; }
.dp.in-grp .dp-lbl, .dp.in-grp .dp-dist { display: none; }
.grp-box { fill: rgba(245,196,107,.06); stroke: var(--accent); stroke-width: 1; stroke-dasharray: 4 3; }
.grp-lbl { font: 600 12.5px var(--f-body); fill: var(--accent); paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.grp-sub { font: 10.5px var(--f-mono); fill: #c9b78f; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.dso.in-inset .dso-m { opacity: .55; }

/* ---------- reskin additions, Nov 2026 ---------- */
.tagline { font-family: var(--f-head); font-weight: 700; font-size: 15px; color: var(--head) !important; letter-spacing: .02em; }
.f-grid { grid-template-columns: repeat(6, 1fr); }
/* hub: equatorial / galactic */
.maps[data-frame="eq"] .map-gal, .maps[data-frame="gal"] .map-eq { display: none; }
.cap-gal { display: none; }
.map-fig.gal .cap-gal { display: inline; }
.map-fig.gal .cap-eq { display: none; }
.gplane { stroke: var(--head); stroke-width: 1; stroke-opacity: .55; }
.gp-lbl { fill: var(--head); letter-spacing: .14em; font-size: 11px; }
.m-layer { display: none; }
.maps.show-m .m-layer { display: inline; }
.m-legend { display: none; }
.map-fig.show-m .m-legend { display: inline; }
.m-dot { stroke: #070b18; stroke-width: 1; }
.m-dot.m-nb { fill: var(--nb); }
.m-dot.m-oc { fill: var(--oc); }
.m-dot.m-gc { fill: var(--gc); }
.m-dot.m-pn { fill: var(--pn); }
.m-dot.m-gx { fill: var(--gx); }
.m-dot:hover { stroke: #fff; }
.lg.gc { border-color: var(--gc) !important; border-radius: 50%; }
/* constellation: whole-sky locator */
.hero-row { display: flex; gap: 36px; align-items: flex-end; justify-content: space-between; margin-bottom: 18px; }
.hero-row .hero-text { margin-bottom: 0; }
@media (max-width: 900px) { .hero-row { display: block; } }
.mini-fig { margin: 18px 0 0; flex: 0 0 340px; max-width: 340px; background: var(--bg2); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.mini-fig svg { display: block; width: 100%; height: auto; }
.mini-fig figcaption { padding: 6px 12px 8px; font-size: 12px; }
.mz { fill: none; stroke: #1f2d52; stroke-width: .6; }
.mz.on { fill: rgba(56,189,248,.55); stroke: var(--head); stroke-width: 1; }
.mini-sky .axis { font-size: 9px; }
/* tables */
table.data caption { caption-side: top; text-align: left; font: 700 13px var(--f-head); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); padding: 0 0 8px; }
tr.ph td { color: var(--muted); font-style: italic; background: repeating-linear-gradient(135deg, rgba(56,189,248,.04) 0 8px, transparent 8px 16px); }
tr.ph code { font-style: normal; font-family: var(--f-mono); font-size: 12px; color: var(--head); }
/* catalogs */
.cat-list { display: grid; gap: 8px; margin-top: 14px; }
details.cat { background: var(--bg2); border: 1px solid var(--line); border-radius: 10px; }
details.cat summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; padding: 10px 16px; }
details.cat summary::-webkit-details-marker { display: none; }
details.cat summary::before { content: "+"; font-family: var(--f-mono); color: var(--head); width: 12px; }
details.cat[open] summary::before { content: "-"; }
.cat-n { font-weight: 600; }
.cat-c { margin-left: auto; font-family: var(--f-mono); font-size: 13px; color: var(--head); background: rgba(56,189,248,.1); border-radius: 20px; padding: 1px 10px; }
details.cat .tbl-wrap { margin: 0 12px 12px; }
/* object page: annotated image */
.anno-fig { margin: 0; background: var(--bg2); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.anno-stage { position: relative; line-height: 0; }
.anno-stage > svg.anno-img, .anno-stage > img { display: block; width: 100%; height: auto; }
.anno-stage > svg.anno-ov { position: absolute; inset: 0; width: 100%; height: 100%; }
.anno-ov .ring { fill: none; stroke: #fff; stroke-width: 2; stroke-dasharray: 6 4; opacity: .9; }
.anno-ov .lead { stroke: #fff; stroke-width: 1.4; opacity: .85; }
.anno-ov .pin { fill: var(--head); stroke: #070b18; stroke-width: 2; }
.anno-ov circle.pin { r: 20px; }
.anno-ov .pin-n { fill: #070b18; font: 700 20px var(--f-head); text-anchor: middle; dominant-baseline: central; }
.anno-ov .tag rect { fill: rgba(7,11,24,.82); stroke: rgba(56,189,248,.6); }
.anno-ov .tag text { fill: #fff; font: 600 26px var(--f-body); dominant-baseline: central; }
.anno-ov .tag tspan.sub { fill: #b8c6e0; font-weight: 400; font-size: 20px; }
.anno-ov g.note { transition: opacity .35s; }
.anno-fig.labels-off .anno-ov g.note { opacity: 0; pointer-events: none; }
.anno-fig.stepping .anno-ov g.note { opacity: 0; }
.anno-fig.stepping .anno-ov g.note.cur { opacity: 1; }
.anno-ov g.note .tag { opacity: 0; transition: opacity .25s; }
.anno-ov g.note:hover .tag, .anno-ov g.note.cur .tag, .anno-fig.tags-on .anno-ov g.note .tag { opacity: 1; }
.anno-credit { font-size: 12px; color: var(--muted); padding: 6px 16px 0; }
.anno-list { counter-reset: n; list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 10px; }
.anno-list li { display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: start; cursor: pointer; border-radius: 8px; padding: 6px; }
.anno-list li:hover, .anno-list li.cur { background: rgba(56,189,248,.08); }
.anno-list li::before { counter-increment: n; content: counter(n); width: 26px; height: 26px; border-radius: 50%; background: var(--head); color: #070b18; font: 700 13px var(--f-head); display: grid; place-items: center; }
.obj-hero { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 28px; align-items: start; padding: 28px 0 8px; }
.obj-side .locator { width: 100%; height: auto; display: block; border: 1px solid var(--line); border-radius: 10px; }
.obj-side h1 { margin-top: 0; }
@media (max-width: 900px) { .obj-hero { grid-template-columns: 1fr; } }
.video-embed { position: relative; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); background: #000; margin-top: 14px; }
.video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-cap { font-size: 13px; color: var(--muted); margin: 6px 0 18px; }
/* phones and tablets: charts keep a readable width and pan sideways; labels grow */
.chart-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.swipe-hint { display: none; margin: 0; padding: 6px 16px 0; font-size: 12px; color: var(--muted); }
@media (max-width: 900px) {
  .chart-scroll > svg { min-width: 860px; }
  .chart-scroll > svg.sky-map { min-width: 1000px; }
  .swipe-hint { display: block; }
  .sky-chart .lbl { font-size: 17px; stroke-width: 4px; }
  .sky-chart .dso-lbl { font-size: 16px; }
  .dist-chart .lbl, .dist-chart text { font-size: 15px; }
  .sky-map .map-lbl { font-size: 14px; }
}
/* object page */
.obj-const { font: 600 20px var(--f-head); color: var(--text); margin: -4px 0 10px; }
.obj-const a { color: var(--head); }
.glance { font-size: 18px; }
dfn { font-style: normal; border-bottom: 1px dotted var(--muted); }
.term { font-size: 14px; color: var(--muted); }
table.colors td:first-child { white-space: nowrap; }
.swatch { display: inline-block; width: 14px; height: 14px; border-radius: 3px; vertical-align: -2px; margin-right: 6px; border: 1px solid rgba(255,255,255,.25); }
.finder { width: 100%; height: auto; display: block; border: 1px solid var(--line); border-radius: 10px; margin: 12px 0; }
.locator .c-name, .finder .c-name { font: 700 13px var(--f-head); letter-spacing: .16em; fill: #8e9bb8; }
.finder .f-lbl { font: 500 14px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 4px; }
.finder .f-tgt { font-weight: 700; fill: var(--accent); }
.finder .hop { fill: none; stroke: var(--head); stroke-width: 1.4; stroke-dasharray: 5 4; }
.finder .m52 { fill: none; stroke: var(--oc); stroke-width: 1.6; stroke-dasharray: 3 2; }
/* deep-sky hub */
.ladder { width: 100%; height: auto; display: block; }
.ladder .band { opacity: .55; }
.ladder .band.st { fill: #e8eefc; }
.ladder .band.nb { fill: var(--nb); }
.ladder .band.oc { fill: var(--oc); }
.ladder .band.gc { fill: var(--gc); }
.ladder .band.gx { fill: var(--gx); }
.ladder .band.pn { fill: var(--pn); }
.ladder .band-lbl { font: 600 14px var(--f-body); fill: #c9d4ee; letter-spacing: 0; }
.ladder .lm { fill: #fff; stroke: #070b18; stroke-width: 2; }
.ladder .lm-lbl { font: 12px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.ladder .tick { stroke: #1f2d52; stroke-width: 1; }
.t-group { font: 700 13px var(--f-head); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin: 26px 0 10px; }
.t-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.t-card { background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; padding: 16px 16px 12px; }
.t-card h3 { margin: 8px 0 6px; font-size: 18px; }
.t-card h3 a { color: var(--text); text-decoration: none; }
.t-card h3 a:hover { color: var(--head); }
.t-card p { font-size: 14px; margin: 0 0 8px; }
.t-card .t-links { font-size: 13px; margin: 0; }
.t-ico { width: 36px; height: 36px; display: block; }
.t-ico .i-f { fill: rgba(56,189,248,.28); stroke: var(--head); stroke-width: 1.2; }
.t-ico .i-c { fill: var(--head); }
.t-ico .i-r { fill: none; stroke: var(--head); stroke-width: 1.6; }
.t-ico .i-k { fill: #070b18; stroke: var(--accent); stroke-width: 1.6; }
.t-ico .i-l { stroke: var(--head); stroke-width: 2; }
@media (max-width: 900px) { .chart-scroll > svg.ladder { min-width: 900px; } }
/* solar system hub */
.ss-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: 32px; align-items: start; padding: 28px 0 10px; }
.orrery-fig { margin: 0; background: var(--bg2); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.orrery { width: 100%; height: auto; display: block; }
.orrery-fig figcaption { padding: 8px 14px 12px; font-size: 13px; }
.orrery .orb { fill: none; stroke: #23335c; stroke-width: 1; }
.orrery .belt { fill: none; stroke: #8e9bb8; stroke-opacity: .18; stroke-width: 14; }
.orrery .sun { fill: #ffd76a; filter: drop-shadow(0 0 8px #ffb000); }
.orrery .vernal { stroke: #23335c; stroke-dasharray: 3 4; }
.orrery .pl-lbl { font: 600 13px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.tonight { margin-top: 18px; background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; padding: 12px 16px; }
.tn-list { list-style: none; padding: 0; margin: 6px 0 4px; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px 16px; }
.tn-list li { font-size: 15px; }
.tn-list .dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 8px; }
.tn-where { color: var(--muted); }
.moon-grid { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.moon-grid a { display: flex; align-items: center; gap: 10px; background: var(--bg2); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; text-decoration: none; color: var(--text); font-weight: 600; }
.moon-grid .cat-c { margin-left: auto; }
.ph-note { color: var(--muted); font-style: italic; border: 1px dashed var(--line); border-radius: 10px; padding: 10px 14px; background: repeating-linear-gradient(135deg, rgba(56,189,248,.04) 0 8px, transparent 8px 16px); }
.ph-note code { font-style: normal; color: var(--head); }
@media (max-width: 900px) { .ss-hero { grid-template-columns: 1fr; } }
.ext::after { content: " ↗"; font-size: .85em; color: var(--muted); }
.pl-cell { white-space: nowrap; }
.p-ico { vertical-align: middle; margin-right: 8px; flex: 0 0 auto; }
.with-ico { display: flex; gap: 14px; align-items: flex-start; }
.with-ico .p-ico { margin-top: 2px; }
.orr-speed { margin-left: auto; font: 12px var(--f-mono); color: var(--muted); padding-right: 8px; }
.orrery-fig .chart-tools { display: flex; align-items: center; }
/* planet and moon pages: live panels */
.live { margin-top: 16px; background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; padding: 12px 16px; }
.live dl { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; margin: 6px 0; }
.live dt { font: 11px var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.live dd { margin: 0; font: 600 18px var(--f-head); color: var(--text); }
.jm-status { font-size: 16px; margin: 6px 0; }
.jm-status b { color: var(--head); }
.jmoons { width: 100%; height: auto; display: block; }
.jmoons .jm-axis { stroke: #1f2d52; stroke-dasharray: 2 4; }
.jmoons .jmoon circle { fill: #e8eefc; }
.jmoons .jmoon.eur circle { fill: var(--head); }
.jmoons .jmoon text { font: 600 12px var(--f-body); fill: #c9d4ee; }
.jmoons .jmoon.eur text { fill: var(--head); }
.jm-fig .chart-tools { display: flex; align-items: center; }
@media (max-width: 900px) { .chart-scroll > svg.jmoons { min-width: 700px; } }
/* event calendar */
.year-strip { width: 100%; height: auto; display: block; }
.year-strip .moonlight { fill: rgba(232,238,252,.12); stroke: rgba(232,238,252,.35); stroke-width: 1; }
.year-strip .tick { stroke: #1f2d52; }
.year-strip .met { stroke-width: 3; stroke-linecap: round; }
.year-strip .met.good { stroke: #4ade80; }
.year-strip .met.fair { stroke: #fbbf24; }
.year-strip .met.poor { stroke: #f87171; }
.year-strip .met-lbl, .year-strip .ev-lbl { font: 600 11px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.year-strip .ecl-dot { fill: #070b18; stroke: var(--accent); stroke-width: 3; }
.year-strip .opp-dot { fill: var(--head); }
.btn { display: inline-block; background: var(--head); color: #070b18 !important; font-weight: 600; padding: 9px 16px; border-radius: 8px; text-decoration: none; }
.btn:hover { filter: brightness(1.1); }
.rate { display: inline-block; padding: 1px 10px; border-radius: 20px; font: 600 12px var(--f-body); text-transform: capitalize; }
.rate.good { background: rgba(74,222,128,.15); color: #4ade80; }
.rate.fair { background: rgba(251,191,36,.15); color: #fbbf24; }
.rate.poor { background: rgba(248,113,113,.15); color: #f87171; }
.month-meta { background: var(--bg2); border: 1px solid var(--line); border-radius: 10px; padding: 8px 14px; margin: 8px 0 12px; font-size: 14px; }
.month-meta p { margin: 4px 0; }
.ev-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.ev-list li { padding: 7px 12px; border-left: 3px solid var(--line); background: rgba(255,255,255,.015); border-radius: 0 8px 8px 0; font-size: 15px; }
.ev-list li.key { border-left-color: var(--head); background: rgba(56,189,248,.06); }
.ev-list li.eclipse.key { border-left-color: var(--accent); background: rgba(245,196,107,.08); }
.ev-d { display: inline-block; min-width: 58px; font: 600 13px var(--f-mono); color: var(--head); }
.hl-list { padding-left: 18px; }
.hl-list li { margin-bottom: 10px; }
@media (max-width: 900px) { .chart-scroll > svg.year-strip { min-width: 900px; } }

/* planets */
table.data.compact td, table.data.compact th { padding-left: .5rem; padding-right: .5rem; white-space: nowrap; }
table.data.kv td:first-child { color: var(--muted, #9aa4b8); width: 42%; }
tr.dim td { opacity: .55; }
svg.size-strip { width: 100%; min-width: 760px; height: auto; display: block; }
svg.size-strip .lbl { font: 500 13px "IBM Plex Mono", monospace; fill: #c9d2e3; }
@media (max-width: 860px) { .obj-hero .obj-side { padding: 0 1rem; } }
.sky-strip-fig { margin: 22px 0 0; background: var(--bg2); border: 1px solid var(--line); border-radius: 14px; padding: 10px 14px 12px; }
.sky-strip-fig .chart-scroll, svg.sky-strip { width: 100%; height: auto; display: block; }
svg.sky-strip { min-width: 640px; }
.sky-strip-fig { overflow-x: auto; }
svg.sky-strip text { font: 500 15px "IBM Plex Mono", monospace; fill: #e6ecf7; }
svg.sky-strip g.sp text, svg.sky-strip text.axis { text-anchor: middle; }
svg.sky-strip text.axis { font-size: 12px; fill: #8792a8; }
svg.sky-strip text.end { font-size: 13px; fill: #9fb3d6; }
svg.sky-strip text.end.small { font-size: 11px; fill: #6f7d98; }
svg.sky-strip .tick, svg.sky-strip .sp-l { stroke: #4a5876; stroke-width: 1; }
svg.sky-strip .glare { fill: rgba(246,178,90,.12); }
.sky-strip-fig figcaption { font-size: 13px; color: var(--muted); margin-top: 6px; }
.t-card .kicker { margin: 0; font-size: 11px; }
.cat-list + p, details.cat + p { margin-top: 12px; }
#tonight details.cat, #eight details.cat { margin-top: 14px; }

/* planet pages: tiles, ladder, bars */
.cond-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; margin: 14px 0; }
.cond { background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; }
.cond p { margin: 0; }
svg.ic { width: 26px; height: 26px; fill: none; stroke: var(--head); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; display: block; margin-bottom: 8px; }
.cond-l { font: 600 11px var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: 4px !important; }
.cond-v { font-size: 15px; color: var(--text); line-height: 1.45; }
.cond-v.big { font: 700 22px var(--f-head); }
.cond-e { font-size: 13px; color: var(--muted); margin-top: 6px !important; }
ol.ladder { list-style: none; padding: 0; margin: 14px 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; counter-reset: none; }
ol.ladder li { background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; font-size: 14px; position: relative; }
ol.ladder li p { margin: 0; }
.vs { margin: 14px 0; border: 1px solid var(--line); border-radius: 12px; padding: 8px 16px; background: var(--bg2); }
.vs-row { display: grid; grid-template-columns: 150px 140px 1fr; gap: 12px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.vs-row:last-child { border-bottom: 0; }
.vs-head { font-size: 11px; color: var(--muted); padding: 2px 0; }
.vs-head .vs-bar { display: flex; justify-content: space-between; height: auto; }
.vs-head em { font-style: normal; font-family: var(--f-mono); }
.vs-l { color: var(--muted); }
.vs-v { font-family: var(--f-mono); font-size: 13px; }
.vs-bar { position: relative; height: 22px; }
.vs-bar::before { content: ""; position: absolute; left: 50%; top: -4px; bottom: -4px; border-left: 1px dashed #4a5876; }
.vs-bar i { position: absolute; top: 5px; height: 12px; border-radius: 3px; }
.vs-bar i.up { left: 50%; background: var(--head); }
.vs-bar i.down { right: 50%; background: #f6b25a; }
.vs-bar b { position: absolute; top: 2px; font: 500 12px var(--f-mono); }
.vs-bar b.up { right: 0; color: var(--head); }
.vs-bar b.down { left: 0; color: #f6b25a; }
@media (max-width: 640px) { .vs-row { grid-template-columns: 1fr 1fr; } .vs-bar { grid-column: 1 / -1; } }
.cat-links { padding: 0 16px 14px; margin: 0; line-height: 1.9; } svg.size-strip .lbl.dim { fill: #6f7d98; }
svg.size-strip.moons .lbl { font-size: 22px; }
.orbit-fig { margin: 14px 0; display: grid; grid-template-columns: minmax(220px, 360px) 1fr; gap: 18px; align-items: center; background: var(--bg2); border: 1px solid var(--line); border-radius: 14px; padding: 12px 16px; }
.orbit-fig svg { width: 100%; height: auto; }
.orbit-fig figcaption { font-size: 14px; color: var(--muted); }
.orbit-fig figcaption b { color: var(--text); }
.o-ring { fill: none; stroke: #2c3854; stroke-width: 1; }
.o-ring.big { stroke: #4a5876; }
.o-dot { fill: #6f7d98; }
.o-dot.retro { fill: #c98a45; }
.o-band { fill: none; stroke: rgba(56,189,248,.14); }
.o-me { fill: none; stroke: #38BDF8; stroke-width: 2; }
.o-arrow { fill: none; stroke: #38BDF8; stroke-width: 2; }
.o-moon { fill: #e6ecf7; stroke: #38BDF8; stroke-width: 2; }
.o-planet { fill: #f0d98c; }
.o-lbl { font: 500 12px "IBM Plex Mono", monospace; fill: #8792a8; text-anchor: middle; }
.o-lbl.me { fill: #e6ecf7; font-size: 14px; text-anchor: start; }
@media (max-width: 640px) { .orbit-fig { grid-template-columns: 1fr; } }
.o-belt { fill: none; stroke: rgba(160,150,140,.10); }
.o-earth { stroke: #0b1224; stroke-width: 1.5; }
.o-lbl.small { font-size: 11px; fill: #8fb8d8; }
.sys-fig svg { width: 100%; max-width: 560px; height: auto; display: block; margin: 0 auto; }
.legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 6px; }
.legend span { display: inline-flex; align-items: center; gap: 6px; }
.legend i, .gdot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }
svg.decades { width: 100%; min-width: 520px; height: auto; display: block; }
svg.decades .bar { fill: var(--head); opacity: .8; }
svg.decades .bv { font: 500 12px "IBM Plex Mono", monospace; fill: #e6ecf7; text-anchor: middle; }
svg.decades .bl { font: 500 11px "IBM Plex Mono", monospace; fill: #8792a8; text-anchor: middle; }

/* star parties */
.sp-map { margin: 0; }
.sp-stage { position: relative; line-height: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #0b1124; }
.sp-stage > img { display: block; width: 100%; height: auto; }
.sp-ov { position: absolute; inset: 0; width: 100%; height: 100%; }
.sp-ov .spd { stroke: #070b18; stroke-width: 1.5; transition: r .15s; }
.sp-ov a:hover .spd { stroke: #fff; }
.sp-ov .spd.off { fill: #5b6b93; }
.sp-ov .spd.on { fill: var(--accent); stroke: #fff; stroke-width: 2; }
.sp-ov .spd.ring { fill: none; stroke: var(--accent); stroke-width: 2; opacity: .55; }
.sp-ov .spl { fill: var(--text); font: 700 22px var(--f-head); stroke: none; }
.sp-ov .spl.halo { fill: #070b18; stroke: #070b18; stroke-width: 4px; stroke-linejoin: round; opacity: .8; }
.sp-ov .spl.sm { font: 500 16px var(--f-body); fill: var(--muted); }
.sp-ov .spl.sm.halo { fill: #070b18; }
.sp-map figcaption { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.sp-map figcaption span, .legend span { display: inline-flex; align-items: center; gap: 6px; margin-right: 12px; }
.gdot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex: none; }
.month-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; margin: 14px 0; }
.mcell { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.mname { margin: 0 0 6px; font: 700 15px var(--f-head); color: var(--head); letter-spacing: .04em; text-transform: uppercase; }
.mcell ul { list-style: none; margin: 0; padding: 0; font-size: 14px; line-height: 1.5; }
.mcell li a { display: flex; align-items: center; gap: 7px; color: var(--text); }
.osm { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; aspect-ratio: 16 / 9; background: var(--panel); }
.osm iframe { width: 100%; height: 100%; border: 0; display: block; filter: invert(.9) hue-rotate(180deg) brightness(.95) contrast(.9); }
section > .sp-map { margin: 14px 0; }
.sp-hero .sp-insets { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.sp-hero .sp-insets .sp-stage { max-height: 260px; }
.sp-hero .sp-insets .sp-stage > img, .sp-hero .sp-insets .sp-ov { height: 260px; object-fit: contain; }
.sp-leg span { display: inline-flex; align-items: center; gap: 6px; margin-left: 12px; }
tbody[data-newmoons] td { white-space: normal; }
.page-grid > .content { min-width: 0; }
@media (max-width: 560px) { .f-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .f-bar { flex-wrap: wrap; gap: 8px 16px; } .f-bar p:last-child { margin-left: 0; } }

/* Earth's Moon page */
.moon-phase { display: block; width: 96px; height: 96px; margin: 4px 0 10px; }
.moon-phase .mp-dark { fill: #1a2240; stroke: var(--line2); stroke-width: 1; }
.moon-phase .mp-lit { fill: #e8e4d8; }
tr.now td { background: rgba(245, 196, 107, .12); }
tr.now td:first-child { box-shadow: inset 3px 0 0 var(--accent); }

/* month, zodiac and asterism pages */
.dome-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 14px; }
.dome { display: block; width: 100%; height: auto; }
.dome-rim { fill: none; stroke: var(--line2); stroke-width: 1.5; }
.dome-z { stroke: var(--muted); stroke-width: 1; }
.dome-dir { font: 600 15px/1 var(--f-mono); fill: var(--accent); }
.dome .nb-lbl { font-size: 10px; }
.dome-on, .dome .dome-on { fill: var(--text); font-weight: 600; }
.dome-key { font-size: 13px; color: var(--muted); margin: 10px 0 0; }
.mo-nav { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0 0 12px; }
.mo-nav a { display: block; padding: 6px 11px; border: 1px solid var(--line2); border-radius: 8px; font: 500 13px/1 var(--f-mono); color: var(--muted); }
.mo-nav a.on, .mo-nav a:hover { color: var(--text); background: #1a2a52; text-decoration: none; }
.ecl-strip { display: block; width: 100%; min-width: 900px; height: auto; }
.ecl-strip + .ecl-strip { margin-top: 6px; }
.ecl-strip .bnd.zb { stroke: var(--accent); stroke-opacity: .55; }
.sun-dot { fill: var(--accent); }
.ast-ln { fill: none; stroke: var(--accent); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.ast-map .ast-ln { stroke-width: 2.2; }
.ast-map .ast-lbl { font-size: 11px; fill: var(--accent); }
.ast-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.ast-card { background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; scroll-margin-top: 80px; }
.ast-chart { display: block; width: 100%; height: auto; }
.ast-body { padding: 10px 14px 4px; }
.ast-body h3 { margin: 4px 0 4px; font-size: 18px; }
.ast-body p { font-size: 14px; margin: 0 0 8px; }
@media (max-width: 760px) { .dome-pair { grid-template-columns: 1fr; } }
.season-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.season-col h3 { margin: 0 0 6px; font-size: 17px; }
.month-list { list-style: none; padding: 0; margin: 0; }
.month-list li { padding: 6px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.month-list li span { display: block; color: var(--muted); font-size: 13px; }

/* catalog hubs and object pages */
.field-view { display: block; width: 100%; height: auto; }
.fov { fill: none; stroke: var(--accent); stroke-width: 1.2; stroke-dasharray: 5 4; stroke-opacity: .7; }
.fov-lbl { font: 500 12px/1 var(--f-mono); fill: var(--accent); }
.fv-target .dso-m { stroke-width: 2.2; }
.fv-scale path { stroke: var(--muted); stroke-width: 1.2; fill: none; }
.fv-scale text { font: 11px/1 var(--f-mono); fill: var(--muted); }
.cat-map .cz .dso-m { stroke-width: 1.4; }
.cat-map .cat-lbl { font-size: 9px; fill: var(--muted); pointer-events: none; }
.sky-map.filtering .cz { opacity: .12; }
.sky-map.filtering .cz.match { opacity: 1; }
.dist-strip { display: block; width: 100%; min-width: 760px; height: auto; }
.ds-mw { stroke: var(--accent); stroke-width: 1; stroke-dasharray: 4 4; fill: none; }
.ds-mw-lbl { fill: var(--accent); }
.ds-dot { fill-opacity: .25; }

/* marathon and sub-hubs */
.mm-path { fill: none; stroke: var(--accent); stroke-width: 1.3; stroke-opacity: .6; stroke-linejoin: round; }
.mw-line { fill: none; stroke: #9fb3e0; stroke-width: 28; stroke-opacity: .07; }
.mm-table td.chk { text-align: center; }
.dso-m.rn { fill: rgba(120, 170, 255, .2); stroke: #7aa8ff; }
.dso-m.dn { fill: rgba(40, 40, 60, .6); stroke: #8a8aa0; }
.dso-m.sr { fill: rgba(255, 140, 90, .18); stroke: #ff9a6a; }
.dso-m.gl, .dso-m.ge, .dso-m.gi, .dso-m.gp { fill: rgba(255, 200, 90, .15); stroke: #ffc65a; }
.dso-m.ge { stroke: #ffb04a; } .dso-m.gl { stroke: #ffd98a; } .dso-m.gi { stroke: #e6a85a; stroke-dasharray: 2 2; } .dso-m.gp { stroke: #ff8a5a; }
.lg.rn { border-color: #7aa8ff; } .lg.dn { border-color: #8a8aa0; } .lg.sr { border-color: #ff9a6a; }
.lg.ge { border-color: #ffb04a; } .lg.gl { border-color: #ffd98a; } .lg.gi { border-color: #e6a85a; } .lg.gp { border-color: #ff8a5a; }
@media print { .site-header, .side-nav, .hero, .data-strip, .site-footer, #video { display: none; } .tbl-wrap.tall { max-height: none; overflow: visible; } }

/* catalog map markers: solid dots with a dark rim, so they stay sharp when the map is scaled down */
.cat-map .cz { fill: none; stroke: none; transition: none; }
.cat-map .cz .dso-m { stroke: #070b18; stroke-width: 1; vector-effect: non-scaling-stroke; stroke-dasharray: none; shape-rendering: geometricPrecision; }
.cat-map .cz .dso-m.nb { fill: var(--nb); }
.cat-map .cz .dso-m.oc { fill: var(--oc); }
.cat-map .cz .dso-m.gc { fill: var(--gc); }
.cat-map .cz .dso-m.pn { fill: var(--pn); }
.cat-map .cz .dso-m.gx { fill: var(--gx); }
.cat-map .cz .dso-m.rn { fill: #7aa8ff; }
.cat-map .cz .dso-m.dn { fill: #8a8aa0; }
.cat-map .cz .dso-m.sr { fill: #ff9a6a; }
.cat-map .cz .dso-m.ge { fill: #ffb04a; }
.cat-map .cz .dso-m.gl { fill: #ffe3a3; }
.cat-map .cz .dso-m.gi { fill: #d9954a; }
.cat-map .cz .dso-m.gp { fill: #ff7a4a; }
.cat-map a:hover .cz .dso-m { stroke: #fff; stroke-width: 1.5; }
.map-fig:has(.cat-map) .m-legend .lg { width: 10px; height: 10px; border: 1px solid #070b18 !important; border-radius: 50%; vertical-align: 0; }
.map-fig:has(.cat-map) .m-legend .lg.nb { background: var(--nb); } .map-fig:has(.cat-map) .m-legend .lg.oc { background: var(--oc); } .map-fig:has(.cat-map) .m-legend .lg.gc { background: var(--gc); }
.map-fig:has(.cat-map) .m-legend .lg.pn { background: var(--pn); } .map-fig:has(.cat-map) .m-legend .lg.gx { background: var(--gx); } .map-fig:has(.cat-map) .m-legend .lg.rn { background: #7aa8ff; }
.map-fig:has(.cat-map) .m-legend .lg.dn { background: #8a8aa0; } .map-fig:has(.cat-map) .m-legend .lg.sr { background: #ff9a6a; } .map-fig:has(.cat-map) .m-legend .lg.ge { background: #ffb04a; }
.map-fig:has(.cat-map) .m-legend .lg.gl { background: #ffe3a3; } .map-fig:has(.cat-map) .m-legend .lg.gi { background: #d9954a; } .map-fig:has(.cat-map) .m-legend .lg.gp { background: #ff7a4a; }

/* star-type hubs: star-color markers */
.dso-m.sb { fill: rgba(143,180,255,.2); stroke: #8fb4ff; } .dso-m.sc { fill: rgba(111,224,224,.2); stroke: #6fe0e0; } .dso-m.sw { fill: rgba(232,238,252,.2); stroke: #e8eefc; }
.dso-m.sy { fill: rgba(255,224,138,.2); stroke: #ffe08a; } .dso-m.so { fill: rgba(255,184,106,.2); stroke: #ffb86a; } .dso-m.sd { fill: rgba(255,107,90,.2); stroke: #ff6b5a; }
.dso-m.sv { fill: rgba(195,155,255,.2); stroke: #c39bff; }
.lg.sb { border-color: #8fb4ff; } .lg.sc { border-color: #6fe0e0; } .lg.sw { border-color: #e8eefc; } .lg.sy { border-color: #ffe08a; } .lg.so { border-color: #ffb86a; }
.lg.sd { border-color: #ff6b5a; } .lg.sv { border-color: #c39bff; }
.cat-map .cz .dso-m.sb { fill: #8fb4ff; } .cat-map .cz .dso-m.sc { fill: #6fe0e0; } .cat-map .cz .dso-m.sw { fill: #e8eefc; } .cat-map .cz .dso-m.sy { fill: #ffe08a; }
.cat-map .cz .dso-m.so { fill: #ffb86a; } .cat-map .cz .dso-m.sd { fill: #ff6b5a; } .cat-map .cz .dso-m.sv { fill: #c39bff; }
.map-fig:has(.cat-map) .m-legend .lg.sb { background: #8fb4ff; } .map-fig:has(.cat-map) .m-legend .lg.sc { background: #6fe0e0; } .map-fig:has(.cat-map) .m-legend .lg.sw { background: #e8eefc; }
.map-fig:has(.cat-map) .m-legend .lg.sy { background: #ffe08a; } .map-fig:has(.cat-map) .m-legend .lg.so { background: #ffb86a; } .map-fig:has(.cat-map) .m-legend .lg.sd { background: #ff6b5a; }
.map-fig:has(.cat-map) .m-legend .lg.sv { background: #c39bff; }
.data td.wide { min-width: 16rem; }

/* milky-way-galaxy.htm: face-on map */
.mwf { width: 100%; height: auto; display: block; }
.mwf-bg { fill: #070b18; } .mwf-disk { fill: url(#mwglow); } .mwf-ring { fill: none; stroke: rgba(232,238,252,.12); stroke-dasharray: 3 5; }
.mwf-arm { fill: none; stroke: rgba(143,180,255,.55); stroke-width: 9; stroke-linecap: round; } .mwf-arm.far { stroke-dasharray: 2 10; stroke-width: 6; }
.mwf-arm.loc { stroke: rgba(255,224,138,.6); stroke-width: 6; } .mwf-bar { fill: rgba(255,224,138,.22); stroke: rgba(255,224,138,.5); }
.mwf-alab { fill: #b9c6e8; font-size: 15px; font-style: italic; } .mwf-o { fill: #ff6b5a; } .mwf-o.cl { fill: #6fe0e0; } .mwf-olab { fill: #e8eefc; font-size: 13px; }
.mwf-sun { fill: #ffe08a; stroke: #070b18; stroke-width: 2; } .mwf-sunlab { fill: #ffe08a; font-size: 15px; font-weight: 600; } .mwf-c { fill: #fff; }
.content figure img { max-width: 100%; height: auto; display: block; }
.mwf-scale { stroke: #b9c6e8; stroke-width: 2; } .mwf-stxt { fill: #b9c6e8; font-size: 13px; } .mwf-rot { fill: none; stroke: rgba(232,238,252,.35); stroke-width: 1.5; }

/* milky-way-loop-local-bubbles.htm: zoom panels */
.lbz { width: 100%; min-width: 900px; height: auto; display: block; } .lbz-bg { fill: #070b18; } .lbz-frame { fill: none; stroke: rgba(232,238,252,.25); }
.lbz-t { fill: #e8eefc; font-size: 15px; font-weight: 600; } .lbz-s { fill: #b9c6e8; font-size: 12px; } .lbz-l { fill: #e8eefc; font-size: 12px; }
.lbz-arm { fill: rgba(255,224,138,.16); } .lbz-armb { fill: rgba(143,180,255,.14); } .lbz-bub { fill: rgba(143,180,255,.10); stroke: rgba(143,180,255,.7); stroke-width: 1.5; }
.lbz-loop { fill: rgba(255,107,90,.08); stroke: rgba(255,107,90,.65); stroke-width: 1.5; stroke-dasharray: 5 4; } .lbz-lic { fill: rgba(111,224,224,.14); stroke: rgba(111,224,224,.7); stroke-width: 1.5; }
.lbz-g { fill: rgba(255,224,138,.12); stroke: rgba(255,224,138,.7); stroke-width: 1.5; stroke-dasharray: 4 3; } .lbz-box { fill: none; stroke: #ffe08a; stroke-width: 1.2; }
.lbz-zl { stroke: rgba(255,224,138,.35); stroke-width: 1; } .lbz-o { fill: #ff6b5a; } .lbz-st { fill: #fff; } .lbz-sun { fill: #ffe08a; stroke: #070b18; stroke-width: 1.5; }
.lbz-wave { fill: none; stroke: rgba(196,140,255,.7); stroke-width: 3; stroke-dasharray: 2 5; stroke-linecap: round; }
/* solar system child pages: the-sun.htm cutaway, meteors.php year chart */
.sun-cut .sc-streamer { fill: rgba(255,214,140,.08); }
.sun-cut .sc-chromo { fill: none; stroke: #ff6b5a; stroke-width: 5; stroke-opacity: .55; }
.sun-cut .sc-pen { fill: #b8551a; opacity: .55; } .sun-cut .sc-umbra { fill: #3a1606; }
.sun-cut .sc-prom { fill: none; stroke: #ff6b5a; stroke-width: 9; stroke-linecap: round; stroke-opacity: .8; }
.sun-cut .sc-cell { fill: none; stroke: #fff4c2; stroke-width: 2; stroke-opacity: .75; }
.sun-cut .sc-photon { fill: none; stroke: #fffbe6; stroke-width: 1.6; stroke-dasharray: 4 3; }
.sun-cut .sc-edge { fill: none; stroke: #fff4c2; stroke-width: 2; stroke-opacity: .6; }
.sun-cut .sc-bound { fill: none; stroke: #fff4c2; stroke-width: 1.2; stroke-opacity: .5; stroke-dasharray: 3 4; }
.sun-cut .sc-lead { fill: none; stroke: #e8eefc; stroke-width: 1; stroke-opacity: .55; }
.sun-cut .sc-dot { fill: #e8eefc; }
.sun-cut .sc-t { font: 700 22px var(--f-head); fill: #e8eefc; }
.sun-cut .sc-s { font: 15px var(--f-body); fill: #b9c6e8; }
table.data tr.hi td { background: rgba(245,196,107,.1); }
.mt-year { width: 100%; min-width: 760px; height: auto; display: block; }
.mt-year .mt-grid { stroke: rgba(232,238,252,.08); }
.mt-year .mt-moon { fill: rgba(232,238,252,.05); }
.mt-year .mt-full { fill: #e8eefc; }
.mt-year .mt-lbl { font: 12px var(--f-body); fill: #b9c6e8; } .mt-year .mt-lbl.mj { font-weight: 600; fill: #e8eefc; }
.mt-year .mt-bar { fill-opacity: .35; } .mt-year .mt-pk { stroke: #070b18; stroke-width: 1; }
.mt-year .sy { fill: #ffe08a; } .mt-year .sb { fill: #8fb4ff; } .mt-year .so { fill: #ffb86a; } .mt-year .sv { fill: #c39bff; }
.cat-map .mt-maplbl { font-weight: 600; }
.mt-key { font: 13px var(--f-mono); color: var(--muted); margin-top: 8px; }
.mt-key i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin: 0 6px 0 14px; }
.mt-key i:first-child { margin-left: 0; }
.mt-key i.sy { background: #ffe08a; } .mt-key i.sb { background: #8fb4ff; } .mt-key i.so { background: #ffb86a; } .mt-key i.sv { background: #c39bff; }
/* asteroids, comets and interstellar pages */
.belt-map, .comet-orbits, .iso-map { width: 100%; height: auto; display: block; }
.belt-map .bm-mb { fill: #8fb4ff; fill-opacity: .55; } .belt-map .bm-hi { fill: #ffb86a; fill-opacity: .7; } .belt-map .bm-tj { fill: #ffe08a; fill-opacity: .75; }
.belt-map .bm-nea { fill: none; stroke: #ff6b5a; stroke-width: 1.3; stroke-opacity: .8; }
.belt-map .bm-l { font: 600 14px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.belt-map .bm-l.mb { fill: #8fb4ff; } .belt-map .bm-l.hi { fill: #ffb86a; } .belt-map .bm-l.tj { fill: #ffe08a; } .belt-map .bm-l.nea { fill: #ff8a7a; font-size: 12px; }
.comet-orbits .co-jf { fill: none; stroke: #6fe0e0; stroke-opacity: .35; stroke-width: 1; }
.comet-orbits .co-ht { fill: none; stroke: #ffe08a; stroke-opacity: .55; stroke-width: 1.2; }
.comet-orbits .co-hl { stroke-opacity: 1; stroke-width: 2; }
.comet-orbits .co-l { font: 600 13px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.comet-orbits .co-ring { font: 11px var(--f-mono); fill: #8e9bb8; }
.iso-map .i1 { stroke: #ff86a8; fill: #ff86a8; } .iso-map .i2 { stroke: #6fe0e0; fill: #6fe0e0; } .iso-map .i3 { stroke: #ffe08a; fill: #ffe08a; }
.iso-map .iso-path { fill: none; stroke-width: 2.4; } .iso-map .iso-tick { stroke: none; }
.belt-map .sun, .comet-orbits .sun, .iso-map .sun { fill: #ffd166; }
.belt-map .orb, .comet-orbits .orb, .iso-map .orb { fill: none; stroke: rgba(232,238,252,.2); stroke-width: 1; }
.belt-map .pl-lbl { font: 12px var(--f-body); fill: #b9c6e8; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.iso-map .iso-l { font: 600 14px var(--f-body); paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.iso-map .iso-s { font: 12px var(--f-mono); fill: #b9c6e8; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.solo-fig { margin: 0; background: var(--bg2); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.solo-fig figcaption { padding: 12px 16px; font-size: 13.5px; color: var(--muted); }
.cm-table td { white-space: nowrap; }
.hero-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 32px; align-items: start; }
@media (max-width: 900px) { .cm-table td { white-space: nowrap; }
.hero-split { grid-template-columns: 1fr; } }
/* eclipse, conjunction and transit pages */
.ecl-map { width: 100%; min-width: 760px; height: auto; display: block; }
.ecl-map .em-sea { fill: #0b1124; } .ecl-map .em-grat { fill: none; stroke: rgba(232,238,252,.07); }
.ecl-map .em-land { fill: #1d2a4c; } .ecl-map .em-border { fill: none; stroke: #070b18; stroke-width: .5; }
.ecl-map .em-path { fill: none; stroke-opacity: .85; stroke-linecap: round; }
.ecl-map .em-l { font: 600 11px var(--f-mono); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.sky-map.ecl-map.filtering .cz { opacity: .1; } .sky-map.ecl-map.filtering .cz.match { opacity: 1; }
.shadow-map, .transit-disk { width: 100%; height: auto; display: block; }
.shadow-map .sh-pen { fill: rgba(143,155,184,.16); } .shadow-map .sh-umb { fill: rgba(150,40,30,.45); }
.shadow-map .sh-l { font: 600 13px var(--f-mono); fill: #b9c6e8; letter-spacing: .08em; }
.shadow-map .sh-trk { stroke-width: 1.2; stroke-opacity: .7; stroke-dasharray: 5 4; }
.shadow-map .sh-moon { fill: rgba(232,238,252,.12); stroke: #e8eefc; stroke-dasharray: 3 3; }
.shadow-map .sh-lead { stroke: rgba(232,238,252,.3); } .shadow-map .sh-d { font: 12px var(--f-body); }
.conj-chart { width: 100%; min-width: 760px; height: auto; display: block; }
.conj-chart .cc-grid { stroke: rgba(232,238,252,.08); }
.conj-chart .cc-l { font: 600 12px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.transit-disk .td-l { font: 600 13px var(--f-body); paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
/* ocean worlds, missions, Planet Nine and the Events subhub */
.ocean-grid, .p9-map, .mis-chart, .ev-strip { width: 100%; height: auto; display: block; }
.mis-chart, .ev-strip { min-width: 760px; }
.ocean-grid .ow-ice { fill: #d6e6fb; } .ocean-grid .ow-sea { fill: #2f6fd1; } .ocean-grid .ow-sea.unsure { stroke: #e8eefc; stroke-dasharray: 3 3; stroke-width: 1.2; }
.ocean-grid .ow-sea.past { fill: #c27a3a; } .ocean-grid .ow-ice2 { fill: #93acd4; } .ocean-grid .ow-rock { fill: #8a6a4a; } .ocean-grid .ow-iron { fill: #4b3f3a; }
.ocean-grid .ow-brine { fill: #ffe08a; } .ocean-grid rect.ow-sea { stroke: none; }
.ocean-grid .ow-n { font: 600 15px var(--f-head); fill: #e8eefc; } .ocean-grid .ow-s { font: 12px var(--f-mono); } .ocean-grid .ow-k { font: 13px var(--f-body); fill: #b9c6e8; }
.ocean-grid a:hover .ow-n { fill: var(--head); }
.mis-chart .mc-grid, .ev-strip .mc-grid { stroke: rgba(232,238,252,.08); } .mis-chart .mc-now { stroke: var(--accent); stroke-dasharray: 4 3; }
.mis-chart .mc-l, .ev-strip .mc-l { font: 13px var(--f-body); fill: #b9c6e8; }
.mis-chart .mc-d { stroke-width: 1.5; } .mis-chart .mc-d.plan { fill-opacity: 0; } .mis-chart .mc-d.fail { fill-opacity: .25; stroke-dasharray: 2 2; }
.mc-key i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin: 0 5px 0 12px; vertical-align: 0; }
.mc-key i:first-child { margin-left: 0; }
.ev-strip .ev-l { font: 600 11px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.p9-map .p9-ring { fill: none; stroke: rgba(232,238,252,.1); } .p9-map .p9-rl { font: 11px var(--f-mono); fill: #8e9bb8; }
.p9-map .p9-y { fill: none; stroke: rgba(195,155,255,.12); } .p9-map .p9-yl { font: 12px var(--f-body); fill: #c39bff; }
.p9-map .p9-etno { fill: none; stroke: #8fb4ff; stroke-width: 1.6; stroke-opacity: .85; } .p9-map .p9-pdot { fill: #8fb4ff; }
.p9-map .p9-l { font: 12px var(--f-body); fill: #b9c6e8; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.p9-map .p9-nine { fill: none; stroke: #ffe08a; stroke-width: 2.2; stroke-dasharray: 8 6; } .p9-map .p9-planet { fill: #9fe3ea; stroke: #ffe08a; stroke-width: 1.5; }
.p9-map .p9-nl { font: 600 14px var(--f-body); fill: #ffe08a; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.p9-map .p9-nep { fill: none; stroke: #5b7cf0; } .p9-map .sun { fill: #ffd166; }
/* craters, occultations, Kuiper Belt, Oort Cloud and heliosphere */
.crater-map .cr-dot { fill-opacity: .8; stroke: #070b18; stroke-width: .6; }
.sky-map.ecl-map.filtering .cz { opacity: .1; } .sky-map.ecl-map.filtering .cz.match { opacity: 1; }
.occ-map .oc-path { fill: none; stroke-width: 2.4; stroke-linecap: round; } .occ-map .oc-path.day { stroke-width: 1.2; stroke-dasharray: 3 4; stroke-opacity: .5; }
.kb-chart, .oort-chart, .helio-chart { width: 100%; height: auto; display: block; } .kb-chart, .oort-chart, .helio-chart { min-width: 760px; }
.kb-chart .kb-band { fill: rgba(143,180,255,.08); } .kb-chart .kb-band2 { fill: rgba(99,224,194,.06); stroke: rgba(99,224,194,.3); stroke-dasharray: 4 4; }
.kb-chart .kb-bl { font: 12px var(--f-body); fill: #b9c6e8; } .kb-chart .kb-res { stroke: rgba(255,184,106,.35); stroke-dasharray: 3 4; }
.kb-chart .kb-rl { font: 11px var(--f-mono); fill: #8e9bb8; } .kb-chart .kb-q { fill: none; stroke: #5b7cf0; stroke-width: 1.4; } .kb-chart .kb-q2 { fill: none; stroke: rgba(91,124,240,.45); stroke-dasharray: 5 4; }
.kb-chart circle { fill-opacity: .9; stroke: #070b18; } .kb-chart .kb-l { font: 12px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.kb-chart.filtering .cz, .kb-chart .cz { transition: opacity .2s; }
.oort-chart .oc-band { stroke: none; } .oort-chart .oc-band.kb { fill: rgba(143,180,255,.25); } .oort-chart .oc-band.inner { fill: rgba(99,224,194,.12); } .oort-chart .oc-band.outer { fill: rgba(195,155,255,.12); }
.oort-chart .oc-bl { font: 600 13px var(--f-body); fill: #e8eefc; } .oort-chart .oc-axis { stroke: #8e9bb8; } .oort-chart .oc-tick { stroke: #8e9bb8; }
.oort-chart .oc-lead { stroke: rgba(232,238,252,.25); } .oort-chart .oc-l { font: 12px var(--f-body); fill: #b9c6e8; }
.oort-chart .oc-dot { fill: #e8eefc; } .oort-chart .oc-dot.pl { fill: #8fb4ff; } .oort-chart .oc-dot.sc { fill: #ffe08a; } .oort-chart .oc-dot.hp { fill: #ffb86a; } .oort-chart .oc-dot.st { fill: #ff8a6a; } .oort-chart .oc-dot.ob { fill: #63e0c2; }
.helio-chart .hs-hp { fill: rgba(255,184,106,.07); stroke: #ffb86a; stroke-width: 1.5; } .helio-chart .hs-ts { fill: rgba(255,209,102,.08); stroke: #ffd166; stroke-dasharray: 6 4; }
.helio-chart .hs-flow { fill: none; stroke: rgba(143,180,255,.45); stroke-width: 1.5; } .helio-chart .hs-fl { font: 14px var(--f-body); fill: #8fb4ff; }
.helio-chart .hs-nep { fill: none; stroke: rgba(91,124,240,.6); } .helio-chart .sun { fill: #ffd166; }
.helio-chart .hs-l { font: 14px var(--f-body); fill: #ffb86a; } .helio-chart .hs-l.ts { fill: #ffd166; } .helio-chart .hs-l.nep { fill: #8fb4ff; font-size: 12px; }
.helio-chart .hs-traj { stroke: rgba(232,238,252,.3); stroke-dasharray: 2 4; } .helio-chart .hs-sc { fill: #e8eefc; } .helio-chart .hs-sc.nh { fill: #63e0c2; }
.helio-chart .hs-sl { font: 600 14px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; } .helio-chart .hs-sb { stroke: #8e9bb8; stroke-width: 2; }
/* near-Earth objects and quasi-moons */
.neo-chart, .size-chart, .quasi-chart { width: 100%; height: auto; display: block; min-width: 760px; }
.neo-chart .nc-q { fill: none; stroke: #5b7cf0; stroke-width: 1.4; } .neo-chart .nc-q13 { fill: none; stroke: rgba(91,124,240,.45); stroke-dasharray: 5 4; }
.neo-chart .nc-a1 { stroke: rgba(232,238,252,.25); stroke-dasharray: 3 4; } .neo-chart .nc-zl { font: 600 16px var(--f-body); fill: rgba(232,238,252,.3); }
.neo-chart .nc-dot { fill-opacity: .9; stroke: #070b18; } .neo-chart .nc-dot.pha { stroke: #ff6b5a; stroke-width: 2; } .neo-chart .nc-earth { fill: #38BDF8; }
.neo-chart .kb-l { font: 12px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; } .neo-chart .kb-rl { font: 11px var(--f-mono); fill: #8e9bb8; }
.size-chart .mc-grid { stroke: rgba(232,238,252,.08); } .size-chart .mc-l { font: 14px var(--f-body); fill: #e8eefc; }
.size-chart .sz-tot { fill: none; stroke: #8fb4ff; stroke-dasharray: 4 3; } .size-chart .sz-found { fill: #8fb4ff; }
.size-chart .sz-l { font: 600 13px var(--f-body); fill: #e8eefc; } .size-chart .sz-s { font: 12px var(--f-body); fill: #8e9bb8; }
.quasi-chart .q-eorb { fill: none; stroke: #38BDF8; stroke-opacity: .5; stroke-width: 1.5; } .quasi-chart .q-sun { stroke: #8e9bb8; stroke-dasharray: 3 4; }
.quasi-chart .q-loop { fill: none; stroke-width: 1.8; stroke-opacity: .85; } .quasi-chart .q-earth { fill: #38BDF8; stroke: #e8eefc; }
.quasi-chart .q-l { font: 600 13px var(--f-body); paint-order: stroke; stroke: #070b18; stroke-width: 3px; } .quasi-chart .q-el { font: 13px var(--f-body); fill: #b9c6e8; }
/* space telescopes page */
.scope-map { width: 100%; height: auto; display: block; min-width: 760px; }
.scope-map .sm-sun { fill: #ffd166; fill-opacity: .25; } .scope-map .sm-helio { fill: none; stroke: rgba(255,209,102,.35); stroke-dasharray: 4 5; }
.scope-map .sm-moon { fill: none; stroke: rgba(232,238,252,.15); stroke-dasharray: 3 5; } .scope-map .sm-heo { fill: none; stroke: rgba(143,180,255,.3); }
.scope-map .sm-geo { fill: none; stroke: rgba(143,180,255,.25); } .scope-map .sm-leo { fill: none; stroke: rgba(143,180,255,.45); }
.scope-map .sm-earth { fill: #38BDF8; } .scope-map .sm-axis { stroke: rgba(232,238,252,.12); stroke-dasharray: 2 6; }
.scope-map .sm-zl { font: 13px var(--f-body); fill: #8e9bb8; } .scope-map .sm-note { font: 11px var(--f-mono); fill: #5d6a88; }
.scope-map .sm-dot { stroke-width: 2; } .scope-map .sm-dot.plan { fill-opacity: 0; }
.scope-map .sm-l { font: 600 11px var(--f-body); fill: #e8eefc; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }

/* observing program pages */
.al-tbl td:nth-child(2) { white-space: nowrap; }
.month-bars { display: block; width: 100%; min-width: 560px; height: auto; }
.mb-bar { fill: var(--accent); fill-opacity: .55; }

/* satellite observing */
.sat-hero { width: 100%; height: auto; display: block; }
.sat-hero .sh { fill: #02040b; fill-opacity: .7; }
.sat-hero .day { fill: #2f6fd1; } .sat-hero .night { fill: #13213f; }
.sat-hero .term { stroke: rgba(232,238,252,.25); stroke-dasharray: 3 4; }
.sat-hero .orb { fill: none; stroke: rgba(232,238,252,.18); } .sat-hero .orb.iss { stroke: rgba(255,209,102,.5); }
.sat-hero .los { stroke: #ffd166; stroke-dasharray: 5 4; } .sat-hero .ray { stroke: rgba(255,209,102,.45); }
.sat-hero .sat.lit { fill: #ffd166; } .sat-hero .sat.dark { fill: #3a4766; stroke: #8e9bb8; }
.sat-hero .obs { fill: #9fe3ea; }
.sat-hero .lb { font: 13px var(--f-body); fill: #b9c6e8; paint-order: stroke; stroke: #070b18; stroke-width: 3px; } .sat-hero .lb.hi { fill: #ffd166; }
.sat-hero .sm { font: 11px var(--f-mono); fill: #8e9bb8; }


/* general observing pages: aurora, zodiacal light, planets in daylight, Milky Way */
.obs-fig { width: 100%; height: auto; display: block; min-width: 520px; }
.obs-fig .grid { stroke: rgba(232,238,252,.08); } .obs-fig .tick { stroke: rgba(232,238,252,.3); }
.obs-fig .ax { font: 12px var(--f-mono); fill: #8e9bb8; } .obs-fig .sm { font: 11px var(--f-mono); fill: #8e9bb8; }
.obs-fig .lb { font: 13px var(--f-body); fill: #b9c6e8; paint-order: stroke; stroke: #070b18; stroke-width: 3px; }
.obs-fig .good { fill: rgba(127,227,166,.07); }
.obs-fig .gnd { fill: none; stroke: #5b7cf0; stroke-width: 2; } .obs-fig .obs { fill: #9fe3ea; }
.obs-fig .au-g { fill: #4fd18b; } .obs-fig .au-r { fill: #e0527a; }
.obs-fig .sl { stroke-dasharray: 5 4; } .obs-fig .sl.g { stroke: #4fd18b; } .obs-fig .sl.r { stroke: #e0527a; }
.obs-fig .ev { fill: #8fb4ff; } .obs-fig .mo { fill: #ffd166; }
.obs-fig .vline { fill: none; stroke: #ffd166; stroke-width: 2; } .obs-fig .moon { fill: #e8eefc; stroke: #070b18; }
.obs-fig .b40 { fill: #8fb4ff; } .obs-fig .b30 { fill: #ffd166; fill-opacity: .8; }


/* bortle-scale.htm */
.bortle-fig .bc1 { fill: #0b1024; } .bortle-fig .bc2 { fill: #1b2550; } .bortle-fig .bc3 { fill: #26408a; } .bortle-fig .bc4 { fill: #2f7a5a; }
.bortle-fig .bc5 { fill: #b5a33a; } .bortle-fig .bc6 { fill: #d6802e; } .bortle-fig .bc7 { fill: #d4533c; } .bortle-fig .bc8 { fill: #e9e4dc; }
.bortle-fig rect[class^="bc"] { stroke: #070b18; stroke-width: 1; }
.bortle-fig .bn { font: 600 14px var(--f-mono); fill: #e8eefc; } .bortle-fig .bn.dk { fill: #070b18; }
.bortle-fig .mk { stroke: #ffd166; stroke-width: 1.2; stroke-dasharray: 3 3; } .bortle-fig .mkd { fill: #ffd166; }

/* articles/star-party-etiquette.htm */
.etq-fig .curve { fill: none; stroke: #8fb4ff; stroke-width: 2.5; } .etq-fig .curve.rec { stroke: #ffd166; }
.etq-fig .ghost { fill: none; stroke: #8fb4ff; stroke-width: 1.5; stroke-dasharray: 4 4; opacity: .5; }
.etq-fig .flash { stroke: #e8eefc; stroke-width: 2; } .etq-fig .lb.fl { fill: #e8eefc; }
.etq-tools { border: 1px solid rgba(143,180,255,.25); border-radius: 10px; padding: 14px 18px; margin: 0 0 24px; background: rgba(143,180,255,.05); }
.etq-tools p { margin: 0 0 10px; } .etq-btns { margin: 0 !important; display: flex; flex-wrap: wrap; gap: 10px; }
.etq-tools .etq-btn { display: inline-block; font: 600 14px var(--f-body); padding: 8px 16px; border-radius: 8px; border: 1px solid #8fb4ff; background: transparent; color: #8fb4ff; cursor: pointer; text-decoration: none; }
.etq-tools .etq-btn:hover { background: rgba(143,180,255,.12); }
.etq-rules { list-style: none; padding-left: 0; }
.etq-rules li { margin-bottom: 8px; position: relative; padding-left: 30px; }
.etq-rules li::before { content: ""; position: absolute; left: 0; top: .3em; width: .95em; height: .95em; border: 2px solid #8fb4ff; border-radius: 3px; box-sizing: border-box; }
.etq-print-head, .etq-print-foot { display: none; }
@media print {
  @page { size: letter; margin: 0.45in 0.5in; }
  body:has(.etq) { background: #fff !important; color: #111 !important; }
  body:has(.etq) .site-head, body:has(.etq) .crumbs, body:has(.etq) .hero, body:has(.etq) .data-strip, body:has(.etq) .side-nav,
  body:has(.etq) .site-foot, body:has(.etq) #more, body:has(.etq) .etq-tools { display: none !important; }
  body:has(.etq) .page-grid { display: block !important; padding: 0 !important; margin: 0 !important; max-width: none !important; }
  body:has(.etq) .content { max-width: none !important; padding: 0 !important; }
  .etq { font: 9.8pt/1.3 Georgia, "Times New Roman", serif; color: #111; }
  .etq a { color: #111; text-decoration: none; }
  .etq-print-head { display: block; border-bottom: 2pt solid #111; margin-bottom: 6pt; padding-bottom: 4pt; }
  .etq-print-title { font: 700 20pt/1.1 Georgia, serif; margin: 0 !important; }
  .etq-print-sub { font-size: 10pt; margin: 2pt 0 0 !important; color: #333; }
  .etq-print-head p, .etq-lede, .etq-print-foot { margin-bottom: 0 !important; }
  .etq-lede { margin-bottom: 2pt !important; }
  .etq-lede { margin: 0 0 6pt; }
  .etq > section { column-count: 1; }
  .etq-group { break-inside: avoid; margin: 0 0 4pt !important; padding: 0 !important; border: 0 !important; }
  .etq p, .etq ul, .etq li { margin-top: 0 !important; }
  .etq-group h2 { font: 700 11pt/1.2 Georgia, serif !important; color: #111 !important; margin: 6pt 0 2pt !important; padding: 0 !important; }
  .etq-intro { margin: 0 0 3pt !important; font-style: italic; color: #333; }
  .etq-rules { margin: 0 !important; padding-left: 0 !important; } .etq-rules li { margin: 0 0 2.5pt !important; padding-left: 16pt !important; color: #111; }
  .etq-rules li::before { border: 1pt solid #111 !important; top: .2em !important; width: 9pt !important; height: 9pt !important; border-radius: 1pt !important; }
  .etq-print-foot { display: block; border-top: 1pt solid #999; margin-top: 8pt; padding-top: 4pt; font-size: 8.5pt; color: #444; }
}
/* end articles/star-party-etiquette.htm */

/* articles: coordinate system, magnitude scale, eye vs binoculars vs telescope */
.coord-fig .eq { stroke: #9fe3ea; stroke-width: 1.6; } .coord-fig .eqt { fill: #9fe3ea; }
.coord-fig .ecl { fill: none; stroke: #ffd166; stroke-width: 1.6; stroke-dasharray: 6 4; } .coord-fig .eclt { fill: #ffd166; }
.coord-fig .sun { fill: #ffd166; } .coord-fig .sunt { fill: #ffd166; } .coord-fig .star { fill: #e8eefc; } .coord-fig .st { fill: #b9c6e8; }
.mag-fig .mk, .gear-fig .mk { stroke: #8e9bb8; stroke-width: 1; }
.gear-fig .ap { fill: rgba(143,180,255,.12); stroke: #8fb4ff; stroke-width: 1.5; } .gear-fig .ap.eye { fill: #ffd166; stroke: #ffd166; }
/* end articles */

/* periodic-elements.php */
.cosmo-fig .ce { fill: #24305a; } .cosmo-fig .cd { fill: #3b4682; } .cosmo-fig .co { fill: #ffd166; }
.cosmo-fig .ch { fill: #7aa2ff; } .cosmo-fig .che { fill: #b994ff; } .cosmo-fig .cz { fill: #f5b04a; }
.cosmo-fig .cm0 { fill: #f5b04a; } .cosmo-fig .cm1 { fill: #ef7a6a; } .cosmo-fig .cm2 { fill: #9fd36b; } .cosmo-fig .cm3 { fill: #5fd0c6; } .cosmo-fig .cmr { fill: #6b7896; }
.cosmo-fig rect { stroke: #070b18; stroke-width: 1; }
.cosmo-fig .zoom { fill: #ffd16612; stroke: #ffd16655; stroke-width: 1; }
.cosmo-fig .in { font: 600 13px var(--f-mono); fill: #070b18; } .cosmo-fig .in.sm2 { font-size: 11px; }
.cosmo-fig .ce + .in, .cosmo-fig .cd + .in { fill: #e8eefc; }
.pt-ctl { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 10px; }
.pt-wrap .seg { flex-wrap: wrap; }
.pt-wrap .seg button { border-bottom: 1px solid var(--line2); margin-bottom: -1px; }
.pt-lab { font: 500 13px var(--f-mono); color: var(--muted); min-width: 70px; }
.ptable { display: grid; grid-template-columns: repeat(18, minmax(34px, 1fr)); grid-template-rows: repeat(7, auto) 10px auto auto; gap: 3px; min-width: 660px; margin: 6px 0 12px; }
.ptable a { display: flex; flex-direction: column; align-items: center; justify-content: center; aspect-ratio: 1 / 1.1; border-radius: 4px; background: #1a2238; color: #8e9bb8; text-decoration: none; line-height: 1.1; }
.ptable a small { font: 10px var(--f-mono); opacity: .8; }
.ptable a b { font: 600 15px var(--f-body); }
.ptable a:hover { outline: 2px solid #fff; z-index: 1; }
.ptable .pt-f { display: flex; align-items: center; justify-content: center; font: 10px var(--f-mono); color: var(--muted); }
.ptable a[data-o1="bb"] { --o1: #7aa2ff; } .ptable a[data-o1="cr"] { --o1: #f08cc4; } .ptable a[data-o1="lms"] { --o1: #9fd36b; } .ptable a[data-o1="ms"] { --o1: #f5b04a; }
.ptable a[data-o1="wd"] { --o1: #ef7a6a; } .ptable a[data-o1="nsm"] { --o1: #b994ff; } .ptable a[data-o1="dec"] { --o1: #9aa7bf; } .ptable a[data-o1="hum"] { --o1: #5fd0c6; }
.ptable a[data-o2="bb"] { --o2: #7aa2ff; } .ptable a[data-o2="cr"] { --o2: #f08cc4; } .ptable a[data-o2="lms"] { --o2: #9fd36b; } .ptable a[data-o2="ms"] { --o2: #f5b04a; }
.ptable a[data-o2="wd"] { --o2: #ef7a6a; } .ptable a[data-o2="nsm"] { --o2: #b994ff; } .ptable a[data-o2="dec"] { --o2: #9aa7bf; } .ptable a[data-o2="hum"] { --o2: #5fd0c6; }
.ptable a[data-c="c0"] { --c: #ef7a6a; } .ptable a[data-c="c1"] { --c: #f5b04a; } .ptable a[data-c="c2"] { --c: #e5d36a; } .ptable a[data-c="c3"] { --c: #9fd36b; } .ptable a[data-c="c4"] { --c: #5fd0c6; }
.ptable a[data-c="c5"] { --c: #7aa2ff; } .ptable a[data-c="c6"] { --c: #a7c4ff; } .ptable a[data-c="c7"] { --c: #b994ff; } .ptable a[data-c="c8"] { --c: #f08cc4; } .ptable a[data-c="c9"] { --c: #d3a0c8; }
.pt-wrap[data-mode="origin"] .ptable a { background: linear-gradient(to top, var(--o2) 0 22%, var(--o1) 22%); color: #070b18; }
.pt-wrap[data-mode="cat"] .ptable a { background: var(--c); color: #070b18; }
.pt-wrap[data-mode="rad"] .ptable a[data-r="y"], .pt-wrap[data-mode="us"] .ptable a[data-us="y"], .pt-wrap[data-mode="eu"] .ptable a[data-eu="strategic"] { background: #ffd166; color: #070b18; }
.pt-wrap[data-mode="rad"] .ptable a[data-r="y"] { background: #ef7a6a; }
.pt-wrap[data-mode="eu"] .ptable a[data-eu="critical"] { background: #f5b04a99; color: #070b18; }
.pt-wrap[data-mode="ex"] .ptable a[data-net~="ex"], .pt-wrap[data-mode="sx"] .ptable a[data-net~="sx"], .pt-wrap[data-mode="dx"] .ptable a[data-net~="dx"], .pt-wrap[data-mode="sos"] .ptable a[data-net~="sos"] { background: #5fd0c6; color: #070b18; }
.pt-legend { display: none; flex-wrap: wrap; gap: 6px 18px; list-style: none; padding: 0; margin: 0 0 8px; font-size: 14px; color: var(--muted); }
.pt-legend i, .dot { display: inline-block; width: 12px; height: 12px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; }
.pt-legend .pt-note { flex-basis: 100%; font-size: 13px; }
.pt-wrap[data-mode="origin"] .pt-legend[data-for="origin"], .pt-wrap[data-mode="cat"] .pt-legend[data-for="cat"], .pt-wrap[data-mode="rad"] .pt-legend[data-for="rad"],
.pt-wrap[data-mode="us"] .pt-legend[data-for="us"], .pt-wrap[data-mode="eu"] .pt-legend[data-for="eu"], .pt-wrap[data-mode="ex"] .pt-legend[data-for="ex"],
.pt-wrap[data-mode="sx"] .pt-legend[data-for="sx"], .pt-wrap[data-mode="dx"] .pt-legend[data-for="dx"], .pt-wrap[data-mode="sos"] .pt-legend[data-for="sos"] { display: flex; }
/* end periodic-elements.php */

/* molecules-in-space.htm */
.mol-fig .mol-path { stroke: #2b3758; stroke-width: 2; fill: none; }
.mol-fig .mol-arr { stroke: #8e9bb8; stroke-width: 1.6; fill: none; }
.mol-fig .mol-n { font: 700 20px var(--f-mono); }
.mol-fig .mol-m { font: 13px var(--f-mono); fill: #c9d3ea; }
/* end molecules-in-space.htm */

/* element.php */
.el-fig .bar { fill: #8fb4ff; } .el-fig .bar.ev-orbiter, .el-fig .bar.ev-estimate, .el-fig .bar.ev-model, .el-fig .bar.ev-flyby { fill: rgba(143,180,255,.25); stroke: #8fb4ff; stroke-dasharray: 3 2; }
.el-fig .vl { fill: #e8eefc; }
#sources .src { font-size: 14px; color: #8e9bb8; }
.iso-fig .st { fill: #ffd166; } .iso-fig .rd { fill: #8fb4ff; } .iso-fig .ab { fill: #ffd166; fill-opacity: .55; }
.iso-fig .arr { stroke: #e8eefc; stroke-width: 1.5; }
.sec-fig { margin: 0 0 18px; background: rgba(143,180,255,.04); border: 1px solid rgba(143,180,255,.15); border-radius: 10px; padding: 12px; }
.sec-fig figcaption { font-size: 14px; color: #8e9bb8; margin-top: 6px; }
/* end element.php */

/* citizen-science-astronomy.htm */
.cit-fig .cit-w { font: 13px var(--f-mono); fill: #c9d3ea; }
.cit-fig .gnd2 { stroke: #2b3758; stroke-width: 2; }
/* end citizen-science-astronomy.htm */
/* Telescope type pages: optical light-path diagrams */
svg.optic { width: 100%; height: auto; display: block; }
.optic .tube { fill: none; stroke: #2a3b66; stroke-width: 2; }
.optic .glass { fill: rgba(143,180,255,.22); stroke: #8fb4ff; stroke-width: 1.5; }
.optic .mirror { fill: #c9d4ee; }
.optic .ray { fill: none; stroke: #f5c46b; stroke-width: 1.4; opacity: .9; }
.optic .ray.r { stroke: #ff86a8; }
.optic .ray.b { stroke: #8fb4ff; }
.optic .base { fill: #0f1730; stroke: #2a3b66; stroke-width: 2; }
.optic .focus { fill: #fff; }
.optic .lbl { font: 13px var(--f-body); fill: #c9d4ee; }
.optic .dim { font: 11px var(--f-mono); fill: #6c7ca3; }
.optic .ttl { font: 600 14px var(--f-body); fill: #e8eefc; }
.optic .grid { stroke: #1d2a4c; stroke-dasharray: 2 4; }
.optic .line { fill: none; stroke: #63e0c2; stroke-width: 2.5; }
.optic .line.b { stroke: #f2a65a; }
.optic .pt { fill: #e8eefc; }
/* imaging pages: telescopes/astrophotography.htm, ccd-cameras.htm, imaging-software.htm */
.ladder .band-lbl.im-on { fill: #070b18; }


/* ===== home page (index.htm) ===== */
body.home .sec-lede { color: #c6d0e6; }
body.home .btn.ghost { background: transparent; color: var(--head) !important; box-shadow: inset 0 0 0 1px var(--line2); }

/* hero: Milky Way scene behind the live sky */
body.home .scene { position: relative; overflow: hidden; }
body.home .scene > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
body.home .scene-veil { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(18,22,28,0) 0%, rgba(18,22,28,0) 46%, rgba(18,22,28,.4) 62%, rgba(18,22,28,.5) 100%); }
body.home .sky-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: 44px; align-items: center; padding-top: 30px; padding-bottom: 34px; }
body.home .scene { background: var(--bg); }
body.home .scene a { color: #DCE3EB; }
body.home .sky-side .kicker { color: var(--accent); }
body.home .sky-side h1 { color: var(--text); }
body.home .sky-side h1 { font-size: clamp(36px, 4.2vw, 56px); line-height: 1.03; margin: 0 0 14px; }
body.home .sky-when { font: 15px var(--f-mono); color: var(--accent); margin: 0 0 3px; }
body.home .sky-where { font: 13px var(--f-mono); color: var(--muted); margin: 0 0 16px; }
body.home .dome-fig { margin: 0; }
body.home .dome { display: block; width: 100%; height: auto; filter: drop-shadow(0 20px 50px rgba(0,0,0,.55)); }
body.home .dome-rim { fill: none; stroke: #12161C; stroke-opacity: .55; stroke-width: 44; }
body.home .dome-grid circle { fill: none; stroke: #8FB8E0; stroke-opacity: .14; stroke-dasharray: 2 6; }
body.home .dome-lines polyline { fill: none; stroke: #8FB8E0; stroke-opacity: .42; stroke-width: 1.3; }
body.home .dome-const { font: 600 12px var(--f-mono); letter-spacing: .14em; fill: #9fb6d6; fill-opacity: .72; }
body.home .dome-labels a:hover .dome-const { fill: var(--accent); fill-opacity: 1; }
body.home .dome-star { font: 13px var(--f-body); fill: #c9d4ee; fill-opacity: .75; }
body.home .dome-body { font: 700 17px var(--f-head); fill: #fff; paint-order: stroke; stroke: #0b0e14; stroke-width: 4px; }
body.home .dome-moonglow { fill: #f4f1e6; fill-opacity: .1; }
body.home .dome-card text { font: 700 18px var(--f-head); fill: var(--accent); }
body.home .dome-tools { display: grid; grid-template-columns: auto auto 1fr auto auto; align-items: center; gap: 10px; margin-top: 12px; font: 13px var(--f-mono); color: var(--muted); }
body.home .dome-tools input[type=range] { width: 100%; accent-color: var(--accent); }
body.home .dome-tools button { background: #232932; color: var(--text); border: 1px solid #414A57; border-radius: 8px; padding: 7px 12px; font: 600 13px var(--f-body); cursor: pointer; white-space: nowrap; }
body.home .dome-tools button:hover { border-color: var(--accent); }
body.home .tn-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
body.home .tn-card { background: rgba(27,32,39,.9); border: 1px solid #333B46; border-radius: 10px; padding: 12px 14px; }
body.home .tn-card.wide { grid-column: span 2; }
body.home .tn-card .k { font: 500 11px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: #8D97A6; margin: 0 0 7px; }
body.home .tn-card .v { font: 700 18px/1.2 var(--f-head); margin: 0 0 3px; }
body.home .tn-card .s { font-size: 14px; color: #BAC3CF; margin: 0; }
body.home .tn-card .s[data-tn=const] { min-height: 2.9em; }
body.home .tn-card .s a { color: #EEF1F5; }
body.home .tn-moon { display: flex; gap: 12px; align-items: center; }
body.home .tn-moon svg { width: 52px; height: 52px; flex: none; }
body.home .tn-planets { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 16px; font-size: 15px; }
body.home .tn-planets .dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 7px; }
body.home .tn-planets li.down { opacity: .45; }
body.home .tn-planets a { color: var(--text); font-weight: 600; }
body.home .tn-planets .tn-where { color: #8D97A6; font-size: 13.5px; }
body.home .sky-note { font-size: 13.5px; line-height: 1.5; color: #aeb9cf; margin: 12px 0 0; }

/* sections */
body.home .sec { padding: 60px 0 10px; }
body.home .sec-k { font: 500 12px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin: 0 0 10px; }
body.home .sec h2 { font: 800 clamp(28px, 3.2vw, 40px)/1.08 var(--f-head); margin: 0 0 10px; }
body.home .sec-lede { max-width: 820px; font-size: 17px; margin: 0 0 26px; }

/* seven hubs */
body.home .hubs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
body.home .hub { background: var(--bg2); border: 1px solid var(--line); border-top: 3px solid var(--c); border-radius: 10px; padding: 18px 18px 14px; }
body.home .hub > svg { width: 38px; height: 38px; color: var(--c); }
body.home .hub h3 { font: 800 20px/1.2 var(--f-head); margin: 10px 0 6px; }
body.home .hub h3 a { color: var(--text); }
body.home .hub p { font-size: 14.5px; color: var(--muted); margin: 0 0 10px; }
body.home .hub ul { list-style: none; margin: 0; padding: 0; font-size: 14px; }
body.home .hub li { padding: 4px 0; border-top: 1px solid var(--line); }
body.home .hub:first-child { grid-column: span 2; }

/* distances: ruler over eight tiles */
body.home .ruler { display: block; width: 100%; height: auto; margin: 0 0 22px; }
body.home .r-unit { font: 15px var(--f-mono); fill: #7d8db5; }
body.home .r-name { font: 600 17px var(--f-body); fill: #dfe6f5; }
body.home .r-band { font: 700 17px var(--f-head); }
body.home .ruler a:hover rect { fill-opacity: 1; }
body.home .dest { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
body.home .dcard { display: block; background: var(--bg2); padding: 18px 18px 16px; color: var(--text) !important; border-top: 3px solid var(--c); }
body.home .dcard:hover { background: var(--panel); text-decoration: none; }
body.home .dcard .dist { font: 500 12px/1 var(--f-mono); color: var(--c); }
body.home .dcard h3 { font: 800 19px/1.2 var(--f-head); margin: 8px 0 4px; }
body.home .dcard p { font-size: 13.5px; color: var(--muted); margin: 0; }

/* where to stand */
body.home .go-out { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
body.home .go-card { background: var(--bg2); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
body.home .go-card svg { display: block; width: 100%; height: auto; }
body.home .go-card div { padding: 14px 18px 16px; }
body.home .go-card h3 { font: 800 20px/1.2 var(--f-head); margin: 0 0 6px; }
body.home .go-card h3 a { color: var(--text); }
body.home .go-card p { font-size: 14.5px; color: var(--muted); margin: 0; }
body.home .strip-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; padding: 0; list-style: none; }
body.home .strip-links a { display: inline-block; font-size: 14px; border: 1px solid var(--line2); border-radius: 999px; padding: 6px 14px; color: var(--text); }
body.home .strip-links a:hover { border-color: var(--accent); text-decoration: none; }

/* video: one compact row */
body.home .vids { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
body.home .vid { display: block; color: var(--text) !important; font-size: 14px; line-height: 1.35; }
body.home .vid:hover { text-decoration: none; color: var(--head) !important; }
body.home .vid img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); background: var(--panel); margin-bottom: 7px; }
body.home .vid span { font: 12px var(--f-mono); color: var(--muted); }
body.home .vid-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 20px; margin-bottom: 14px; }
body.home .vid-head h2 { font: 800 clamp(22px, 2.4vw, 28px)/1.1 var(--f-head) !important; margin: 0 !important; }

/* thin SolarSystemOS band */
body.home .sis-band { margin-top: 56px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: linear-gradient(90deg, #0b1124, #121a36 60%, #1b1a2e); }
body.home .sis-band .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding-top: 20px; padding-bottom: 20px; }
body.home .sis-band p { margin: 0; flex: 1 1 520px; color: #c6d0e6; }
body.home .sis-band b { color: var(--text); }

/* book */
body.home .book { display: grid; grid-template-columns: 120px 1fr; gap: 22px; align-items: center; background: var(--bg2); border: 1px solid var(--line); border-radius: 14px; padding: 20px 22px; }
body.home .book-cover { width: 120px; height: 180px; border-radius: 3px; background: linear-gradient(160deg, #1b2a55, #0a0f20 60%, #3a2410); display: flex; align-items: flex-end; padding: 10px; font: 800 14px/1.1 var(--f-head); box-shadow: 0 8px 24px rgba(0,0,0,.5); }
body.home .book h3 { font: 800 22px/1.2 var(--f-head); margin: 0 0 6px; }
body.home .book p { margin: 0 0 10px; color: #c6d0e6; }

@media (max-width: 1100px) { body.home .hubs { grid-template-columns: repeat(2, 1fr); } body.home .dest { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { body.home .vids { grid-template-columns: repeat(2, 1fr); } body.home .sky-hero, body.home .go-out { grid-template-columns: 1fr; } body.home .scene-veil { background: rgba(18,22,28,.6); } body.home .ruler { min-width: 900px; } body.home .ruler-scroll { overflow-x: auto; } }
@media (max-width: 600px) { body.home .hubs, body.home .tn-cards, body.home .tn-planets { grid-template-columns: 1fr; } body.home .hub:first-child, body.home .tn-card.wide { grid-column: auto; } body.home .book { grid-template-columns: 1fr; } body.home .dome-tools { grid-template-columns: 1fr 1fr; } body.home .dome-tools input[type=range] { grid-column: span 2; order: -1; } }

/* ===== site footer: linked hub headings, three-part bottom bar, back-to-top ===== */
.f-h a { color: var(--text); }
.f-h a:hover { color: var(--head); }
.f-bar3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; align-items: start; border-top: 1px solid var(--line); margin-top: 32px; padding-top: 18px; padding-bottom: 26px; font-size: 13px; color: var(--muted); }
.f-bar3 p { margin: 6px 0 0; }
.f-brand { display: flex; align-items: center; gap: 14px; }
.f-tag { font: 500 13px var(--f-mono); color: var(--accent); }
.f-bar3 .f-mid { text-align: center; }
.f-bar3 .f-right { text-align: right; }
.f-bar3 .f-mid p:first-child, .f-bar3 .f-right p:first-child { margin-top: 4px; color: var(--text); }
.totop { position: fixed; right: 22px; bottom: 22px; z-index: 40; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line2); background: var(--panel); color: var(--muted); cursor: pointer; display: grid; place-items: center; opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .2s, transform .2s, visibility .2s, color .2s, border-color .2s; }
.totop[data-show] { opacity: 1; visibility: visible; transform: none; }
.totop:hover { color: var(--head); border-color: var(--head); }
.totop svg { width: 18px; height: 18px; }
@media (max-width: 800px) { .f-bar3 { grid-template-columns: 1fr; } .f-bar3 .f-mid, .f-bar3 .f-right { text-align: left; } }

/* hero colors: Go Astronomy blue, with charcoal tiles */
.scene-veil { background: linear-gradient(90deg, rgba(7,11,24,0) 0%, rgba(7,11,24,0) 46%, rgba(7,11,24,.4) 62%, rgba(7,11,24,.5) 100%) !important; }
.dome-rim { stroke: #070b18 !important; }
.dome-lines polyline { stroke: #6f8fd8 !important; }
.dome-tools input[type=range] { accent-color: #38BDF8; }

/* ===== equipment hub (equipment.htm) ===== */
.eq-lbl { font: 600 15px var(--f-body); fill: #dfe6f5; }
.eq-sub { font: 13px var(--f-mono); fill: #7d8db5; }
.eq-big { font: 800 44px var(--f-head); fill: #f5c46b; }
.equip-fig svg { display: block; width: 100%; height: auto; }

/* ===== site search (js/ga-search.js) and footer YouTube link ===== */
.search-btn { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--line2); background: transparent; color: #c6d0e6; cursor: pointer; flex: none; }
.search-btn:hover, .search-btn[aria-expanded="true"] { color: #fff; border-color: var(--head); }
.search-btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.search-btn svg circle { fill: none; }
.search-panel { border-top: 1px solid var(--line); background: rgba(7,11,24,.97); }
.search-inner { padding-top: 14px; padding-bottom: 16px; }
.search-input { width: 100%; font: 500 18px var(--f-body); color: var(--text); background: var(--bg2); border: 1px solid var(--line2); border-radius: 10px; padding: 12px 16px; outline: none; }
.search-input:focus { border-color: var(--head); }
.search-results { list-style: none; margin: 8px 0 0; padding: 0; }
.search-results li a { display: flex; justify-content: space-between; gap: 16px; padding: 9px 12px; border-radius: 8px; color: var(--text); }
.search-results li a:hover, .search-results li[aria-selected="true"] a { background: var(--panel); text-decoration: none; }
.search-results li span { font: 12px var(--f-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.search-results li.none { padding: 9px 12px; color: var(--muted); font-size: 14px; }
.f-yt { display: flex; align-items: center; margin-left: 10px; color: var(--muted); }
.f-yt:hover { color: #ff4d4d; }
.f-yt svg { width: 20px; height: 20px; fill: currentColor; }
@media (max-width: 900px) { .search-btn { margin-left: auto; } .menu-btn { margin-left: 6px; } }
@media (max-width: 600px) { .logo-wm { height: 16px; } .logo .logo-mark { width: 30px; height: 30px; } .logo { gap: 8px; } .search-btn { width: 34px; height: 34px; } }

/* ===== book strip, affiliate card, ad slot (added by build/propagate.py on chosen pages) ===== */
.book-strip { display: grid; grid-template-columns: 56px 1fr auto; gap: 18px; align-items: center; margin: 40px 0 10px; padding: 14px 18px; background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; }
.book-strip img { display: block; width: 56px; height: 84px; object-fit: cover; border-radius: 3px; box-shadow: 0 4px 14px rgba(0,0,0,.45); }
.book-strip p { margin: 0; font-size: 14.5px; color: #c6d0e6; }
.book-strip .btn { white-space: nowrap; }
.sp-card { margin-top: 22px; padding: 14px 14px 12px; background: var(--bg2); border: 1px solid var(--line); border-radius: 10px; }
.sp-card p { font-size: 13.5px; color: #c6d0e6; margin: 0 0 10px; }
.sp-card .btn { display: block; text-align: center; font-size: 14px; }
.sp-card .sp-note { font-size: 11.5px; color: var(--muted); margin: 8px 0 0; }
.sp-ad { margin: 28px 0; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.sp-ad .sp-label { font: 500 10.5px var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin: 0 0 6px; }
.sp-ad #leaderboard1 { width: 728px; min-height: 90px; max-width: 100%; margin: 0 auto; }
@media (max-width: 760px) { .sp-ad { display: none; } }
@media (max-width: 700px) { .book-strip { grid-template-columns: 56px 1fr; } .book-strip .btn { grid-column: span 2; justify-self: start; } }
