/* Isolated copy of galaxy presentation; original template remains unchanged. */

  :root{ --stage-bg:#1b2735; --stage-bg-deep:#141d28; --on-dark-ink:#e7eae4; --on-dark-soft:#9fb0c0; }
  .gx-head{padding:20px 0 4px;}
  .gx-head h1{font-size:clamp(22px,4vw,32px);}
  .gx-head p{margin:6px 0 0;max-width:70ch;}
  #gx-wrap{position:relative;margin-top:14px;border:1px solid var(--rule);overflow:hidden;
    background:radial-gradient(ellipse at 50% 30%, var(--stage-bg) 0%, var(--stage-bg-deep) 100%);}
  #gx{display:block;width:100%;height:min(74vh,760px);touch-action:none;cursor:grab;}
  #gx:active{cursor:grabbing;}
  .gx-tip{position:absolute;pointer-events:none;max-width:260px;background:var(--ink);color:var(--chart);font-size:13px;
    line-height:1.45;padding:8px 10px;border-radius:2px;opacity:0;transition:opacity .1s;z-index:3;}
  .gx-tip b{font-weight:700;}
  .gx-tip .sub{color:#b9c6d2;}
  .gx-card{position:absolute;right:12px;top:12px;width:min(280px,calc(100% - 24px));background:#f5f6f1;color:var(--ink);
    border:1px solid var(--rule);border-radius:8px;padding:14px 16px;box-shadow:0 14px 34px rgba(0,0,0,.35);display:none;z-index:4;font-size:13.5px;}
  .gx-card h3{font-size:16px;margin:0 28px 2px 0;overflow-wrap:anywhere;}
  .gx-card .sub{color:var(--ink-soft);font-size:12.5px;overflow-wrap:anywhere;}
  .gx-card dl{margin:10px 0 0;display:grid;grid-template-columns:auto 1fr;gap:3px 12px;}
  .gx-card dt{color:var(--ink-soft);} .gx-card dd{margin:0;text-align:right;font-weight:600;}
  .gx-card dl + .sub{margin-top:6px;}
  .gx-card .links{margin-top:12px;display:flex;gap:14px;flex-wrap:wrap;font-size:13px;}
  .gx-card .x{position:absolute;right:8px;top:6px;padding:2px 8px;font-size:18px;line-height:1;background:none;color:var(--ink-soft);border:none;}
  .gx-card .x:hover{background:none;color:var(--ink);}
  .gx-legend{margin-top:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px 22px;}
  .gx-key{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.35;}
  .gx-key button{all:unset;cursor:pointer;display:flex;gap:10px;align-items:flex-start;}
  .gx-key button:focus-visible{outline:2px solid var(--ink);outline-offset:3px;}
  .gx-key .dot{flex:none;width:12px;height:12px;border-radius:50%;margin-top:3px;}
  .gx-key.off{opacity:.4;}
  .gx-key .soft{color:var(--ink-soft);font-size:12.5px;display:block;}
  .gx-note{margin:14px 0 40px;}
  .gx-search{position:relative;margin-top:12px;max-width:520px;}
  .gx-search input{width:100%;box-sizing:border-box;font:inherit;font-size:16px;padding:10px 12px;border:1px solid var(--rule);border-radius:6px;background:#f2f4ef;color:var(--ink);}
  .gx-search input:focus{outline:2px solid var(--ink);outline-offset:1px;}
  .gx-search ul{position:absolute;left:0;right:0;top:100%;margin:4px 0 0;padding:4px;list-style:none;background:#f5f6f1;border:1px solid var(--rule);border-radius:6px;box-shadow:0 14px 34px rgba(0,0,0,.25);z-index:6;max-height:320px;overflow-y:auto;}
  .gx-search li{padding:8px 10px;border-radius:4px;cursor:pointer;font-size:14px;overflow-wrap:anywhere;}
  .gx-search li small{display:block;color:var(--ink-soft);font-size:12px;}
  .gx-search li:hover,.gx-search li.is-active{background:#e4e8df;}
  .gx-search .gx-q-msg{margin:6px 0 0;font-size:12.5px;color:var(--ink-soft);}
  .gx-card .gx-card-actions{margin-top:12px;display:flex;gap:8px;flex-wrap:wrap;}
  .gx-card .gx-card-actions button,.gx-hidden button{background:#f2f4ef;color:var(--ink);border:1px solid var(--rule);border-radius:6px;font-size:13px;padding:6px 10px;cursor:pointer;}
  .gx-card .gx-card-actions button:hover,.gx-hidden button:hover{background:#e4e8df;border-color:var(--ink);}
  .gx-card .gx-card-actions button:focus-visible,.gx-hidden button:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
  .gx-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
  .gx-hidden{margin-top:10px;max-width:520px;font-size:13px;}
  .gx-hidden-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--ink-soft);}
  .gx-hidden-bar .gx-hidden-count{margin-right:auto;color:var(--ink);font-weight:600;}
  .gx-chips{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px;max-height:84px;overflow-y:auto;}   /* two rows of 36px chips fit at 390px */
  .gx-chips button{display:inline-flex;gap:6px;align-items:center;max-width:100%;padding:3px 8px;font-size:12.5px;border-radius:999px;}
  .gx-chips[hidden]{display:none;}
  .gx-chips .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px;}
  .gx-chips .x{color:var(--ink-soft);font-size:14px;line-height:1;}
  /* link filter: a native range input plus -/+ steppers; nothing moves, so reduced motion needs no override */
  .gx-links{margin-top:10px;max-width:520px;font-size:13.5px;}
  .gx-links[hidden]{display:none;}
  .gx-links-label{display:block;color:var(--ink);}
  .gx-links-label output{font-weight:700;}
  .gx-links-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px;}
  .gx-links-row input[type=range]{flex:1 1 140px;min-width:120px;margin:0;accent-color:var(--ink);}
  .gx-links-row input[type=range]:focus-visible{outline:2px solid var(--ink);outline-offset:3px;}
  .gx-links-row input[type=range]:disabled{opacity:.45;}
  .gx-links-count{color:var(--ink-soft);font-variant-numeric:tabular-nums;}
  .gx-links button{background:#f2f4ef;color:var(--ink);border:1px solid var(--rule);border-radius:6px;font-size:13px;padding:6px 10px;cursor:pointer;}
  .gx-links button.step{min-width:32px;padding:6px 0;font-weight:700;}
  .gx-links button:hover:not(:disabled){background:#e4e8df;border-color:var(--ink);}
  .gx-links button:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
  .gx-links button:disabled{opacity:.45;cursor:not-allowed;}
  .gx-links-help{margin:4px 0 0;color:var(--ink-soft);font-size:12.5px;line-height:1.4;}
  /* size samples in the legend: drawn at 1x zoom with the same starR as the map */
  .gx-sizes{display:flex;align-items:flex-end;gap:14px;margin-top:6px;flex-wrap:wrap;}
  .gx-size{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:12px;color:var(--ink-soft);}
  .gx-size i{display:block;border-radius:50%;background:#f3e7c0;border:1px solid var(--ink-soft);box-sizing:border-box;}
  #gx-empty{display:none;padding:40px 20px;color:var(--on-dark-soft);text-align:center;}
  .gx-actions{position:absolute;left:12px;top:12px;z-index:3;display:flex;gap:6px;}
  .gx-actions button{font-size:12.5px;padding:6px 10px;}
  .gx-window{display:flex;gap:2px;background:var(--ink);border-radius:2px;padding:2px;}
  .gx-window button{background:transparent;padding:6px 10px;border:none;}
  .gx-window button:hover:not(:disabled){background:#2b3f54;}
  .gx-window button.is-active,.gx-window button.is-active:hover:not(:disabled){background:var(--chart);color:var(--ink);}
  .gx-window button:disabled{opacity:.45;cursor:not-allowed;}
  .gx-actions{flex-wrap:wrap;}
  /* Phones: the card is a bottom sheet inside the chart. (It used to be static, which put it
     below the canvas inside an overflow-hidden box, so it was never visible.) */
  @media (max-width:700px){ .gx-card{left:8px;right:8px;top:auto;bottom:8px;width:auto;max-height:46%;overflow-y:auto;padding:12px 14px;} #gx{height:60vh;}
    /* the sheet scrolls; keep Hide / Show only in view at its bottom edge instead of below the fold */
    .gx-card .gx-card-actions{position:sticky;bottom:-12px;margin:12px -14px -12px;padding:10px 14px 12px;background:#f5f6f1;border-top:1px solid var(--rule);}
    /* finger-sized targets: at least 36px tall */
    .gx-card .gx-card-actions button,.gx-hidden button{min-height:36px;}
    .gx-chips button{padding-top:6px;padding-bottom:6px;}
    .gx-links button{min-height:36px;} .gx-links button.step{min-width:40px;} }