/* Explore, the orbit map (loaded only by the page that uses explore-cosmos.js).
   Line weights and opacities are (dark / light): ring 1px .14/.18 · orbits .75px .07/.10, looked-at orbit 1px .30/.34 · chords strong 1.4px .38/.44, mid 1px .22/.28, weak .75px .11/.15 (set in the script) ·
   chords of what you look at: light grey, 1px .40/.46 · tag links (tethers): 1.2px .78/.85, in the colour of their work (the script sets the stroke: the dominant lighter colour of its picture) ·
   everything else while you look: .03 · dimmed planets .35, tags .4. Colour appears only for the work or tag you look at. */
.explore-cosmos .cx-ring{fill:none;stroke:var(--fg);stroke-opacity:.14;stroke-width:1}
:where(:root[data-theme="light"]) .cx-ring{stroke-opacity:.18}
.cx-orbit{fill:none;stroke:var(--fg);stroke-opacity:.07;stroke-width:.75;transition:stroke-opacity .4s}
:where(:root[data-theme="light"]) .cx-orbit{stroke-opacity:.10}
.cx-orbit.dim{stroke-opacity:.03}
.cx-orbit.hl{stroke-opacity:.3;stroke-width:1}
:where(:root[data-theme="light"]) .cx-orbit.hl{stroke-opacity:.34}
.cx-chord{stroke:var(--fg);stroke-linecap:round;fill:none}
.cx-chord.strong{stroke-width:1.4;stroke-opacity:.34}
.cx-chord.mid{stroke-width:1;stroke-opacity:.2}
.cx-chord.weak{stroke-width:.75;stroke-opacity:.1}
:where(:root[data-theme="light"]) .cx-chord.strong{stroke-opacity:.4}
:where(:root[data-theme="light"]) .cx-chord.mid{stroke-opacity:.25}
:where(:root[data-theme="light"]) .cx-chord.weak{stroke-opacity:.14}
.cx-chord.dim{stroke-opacity:.03!important}
.cx-chord.lit{stroke-opacity:.4!important;stroke-width:1}
:where(:root[data-theme="light"]) .cx-chord.lit{stroke-opacity:.46!important}
.cx-tether{stroke:var(--fg);stroke-opacity:.78;stroke-width:1.2;stroke-linecap:round;fill:none}
:where(:root[data-theme="light"]) .cx-tether{stroke-opacity:.85}
.cx-axis{stroke:var(--fg);stroke-opacity:.25;stroke-width:1}
.cx-orbits,.cx-chords,.cx-tethers,.cx-axis,.cx-ring{pointer-events:none}
/* tags: one size, the square carries the count */
.explore-cosmos .tag-n .lab{font:400 15px var(--font);fill:var(--mut);transition:fill .25s,opacity .3s}
.explore-cosmos .tag-n:hover .lab,.explore-cosmos .tag-n.hl .lab,.explore-cosmos .tag-n.sel .lab,.explore-cosmos .tag-n:focus-visible .lab{fill:var(--c,var(--fg))}
.explore-cosmos .tag-n:hover .lab,.explore-cosmos .tag-n:focus-visible .lab,.explore-cosmos .tag-n.sel .lab{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px}
.explore-cosmos .tag-n.sel .lab{font-weight:600}
.cx-lab{paint-order:stroke;stroke:var(--bg);stroke-width:4px;stroke-linejoin:round}
.explore-cosmos .tag-n.dim{opacity:.4}
.explore-cosmos .tag-n.dim:is(:hover,:focus-visible){opacity:1}
.cx-panel .tag-n:not(.sel):not(.hl) .lab{opacity:0}
.explore-cosmos .tag-n:focus-visible .pt{stroke:var(--fg);stroke-width:2}
:root[data-theme="light"] .explore-cosmos .tag-n .pt{fill-opacity:.75}
/* planets: small discs; the name is always there */
.explore-cosmos .work.dim{opacity:.35}
.explore-cosmos .work:hover .pop,.explore-cosmos .work.hl .pop,.explore-cosmos .work.active .pop,.explore-cosmos .work:focus-visible .pop{transform:scale(1.4)}   /* = GROW in the script */
.explore-cosmos .work .ring{stroke-width:1.2;stroke-opacity:.35}
.explore-cosmos .work:hover .ring,.explore-cosmos .work.hl .ring,.explore-cosmos .work.active .ring,.explore-cosmos .work:focus-visible .ring{stroke-width:1.5;stroke-opacity:1}
.explore-cosmos .work .cap-g{pointer-events:none;transition:transform .3s ease,opacity .3s}
.explore-cosmos .work.hidden{pointer-events:none}
.cx-panel .work:not(.active):not(.hl) .cap-g{opacity:.5}   /* with the drawer open the map is the backdrop: the open work's name stays at full strength */
.explore-cosmos .work .cap{font-size:14px;font-weight:500;fill:var(--text)}
.explore-cosmos .work .cap.alt{font-size:13px;font-weight:400;fill:var(--mut)}
.explore-cosmos .grp-h{font-size:14px}
.explore-cosmos .work .hit,.explore-cosmos .tag-n .hit{fill:transparent}
/* bar */
.cx-tools{display:flex;align-items:center;gap:18px}
.cx-motion{font-size:14px;color:var(--mut);border-bottom:1px solid var(--rule);padding-bottom:1px}
.cx-motion:hover{color:var(--fg);border-color:var(--fg)}
.cx-list .cx-motion{display:none}
/* the panel: a 360 px drawer beside the map on wide screens, a sheet over a frozen map otherwise */
.explore-cosmos .panel{width:min(380px,100%)}
@media (min-width:1300px){.explore-cosmos .panel{width:min(420px,100%)}}
@media (max-width:1239px){
  .explore-cosmos .panel{top:auto;height:min(50dvh,460px);width:100%;border-left:0;border-top:1px solid var(--rule-2);padding:52px var(--pad) 30px;transform:translateY(100%)}
  .explore-cosmos .panel.open{transform:none}
}
