/* "Link-Galaxie" page (/link-galaxie/): domain form, orbit loader, 3D galaxy canvas with HUD tooltip and controls, "Befunde" panel
   (health, stats, findings lists), AI astronomer, page table (text alternative), legend, share row, wall of recent galaxies.
   The galaxy panel uses fixed colours so it reads the same in light and dark theme. */
.glx { --bg: #03040a; --line-c: rgba(62, 240, 255, .22); --cream: #e6f3ff; --soft: #93a9c9;
  --cy: #3ef0ff; --mg: #ff3ea5; --am: #ffb454; --gr: #5ce8c8; --red: #ff3b5c; --mono: ui-monospace, "IBM Plex Mono", Menlo, Consolas, monospace; }
.glx [hidden] { display: none !important; }
.glx .glx-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.gxi-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.glx-fun { display: inline-block; margin: 0 0 10px; padding: 5px 12px; border-radius: 4px; font: 700 13px var(--font-m); letter-spacing: .08em; text-transform: uppercase;
  color: #05070d; background: linear-gradient(135deg, #ffd27f, #ff3ea5 55%, #7a5cff); }
.glx-hero .h2 { font-size: clamp(34px, 6vw, 60px); line-height: 1.05; letter-spacing: -.01em; }

/* ---- form */
.glx-ask { margin: 22px 0 6px; max-width: 640px; }
.glx-label { display: block; margin: 0 0 8px; font: 600 15px var(--font-m); color: var(--muted); }
.glx-row { display: flex; flex-wrap: wrap; gap: 10px; }
.glx-in { flex: 1 1 240px; min-width: 0; min-height: 56px; padding: 0 18px; border-radius: 10px; border: 1px solid var(--line-2, rgba(127, 127, 127, .45));
  background: var(--panel, transparent); color: var(--text); font: 500 17px var(--font-m); }
.glx-in::placeholder { color: var(--dim, #888); }
.glx-go { flex: 0 0 auto; min-height: 56px; padding: 0 28px; border: 1px solid #a99bff; border-radius: 10px; color: #fff; font: 700 18px var(--font-b); cursor: pointer;
  background: linear-gradient(135deg, #1a0f3a, #3a0d34); box-shadow: 0 0 0 1px rgba(169, 155, 255, .25), 0 0 18px rgba(169, 155, 255, .35);
  animation: glx-glow 3s infinite; transition: transform .2s, filter .2s; }
.glx-go:hover { filter: brightness(1.2); transform: translateY(-2px); }
.glx-go[disabled] { opacity: .6; cursor: wait; animation: none; transform: none; }
.glx-demo { margin: 10px 0 0; min-height: 40px; padding: 0 14px; border-radius: 8px; border: 1px dashed var(--line-2, rgba(127, 127, 127, .45));
  background: transparent; color: var(--muted); font: 500 14px var(--font-m); cursor: pointer; }
.glx-demo:hover { color: var(--text); border-style: solid; }
.glx-in:focus-visible, .glx-go:focus-visible, .glx-demo:focus-visible, .glx-share a:focus-visible, .glx-share button:focus-visible, .gxw-list a:focus-visible,
.glx-ctl button:focus-visible, .glx-fl a:focus-visible, .glx-tbl a:focus-visible, .glx-all summary:focus-visible { outline: 3px solid #3ef0ff; outline-offset: 3px; }
.glx-msg { margin: 12px 0 0; color: var(--muted); font-size: 15px; max-width: 60ch; }
.glx-msg:empty { display: none; }
.glx-msg.ok { color: var(--ok); font-weight: 600; }
.glx-msg.warn { color: var(--accent); font-weight: 500; }
@keyframes glx-glow { 0%, 100% { box-shadow: 0 0 0 1px rgba(169, 155, 255, .25), 0 0 12px rgba(169, 155, 255, .25); } 50% { box-shadow: 0 0 0 1px rgba(255, 62, 165, .4), 0 0 24px rgba(255, 62, 165, .4); } }

/* ---- loader: orbit system */
.gyl { margin: 18px 0 8px; padding: 22px 16px 20px; border-radius: var(--radius); text-align: center; color: var(--cream);
  background: radial-gradient(520px 260px at 50% 40%, #1a1240, var(--bg) 72%); border: 1px solid var(--line-c); }
.gyl-scan { display: block; width: min(260px, 78%); height: auto; margin: 0 auto; }
.gyl-ring { transform-box: view-box; transform-origin: 110px 80px; animation: gyl-spin 5s linear infinite; }
.gyl-ring.r2 { animation-duration: 3.4s; animation-direction: reverse; } .gyl-ring.r3 { animation-duration: 2.2s; }
.gyl-core { transform-box: fill-box; transform-origin: 50% 50%; animation: gyl-pulse 1.6s ease-in-out infinite; }
.gyl-step { margin: 14px 0 0; font: 500 15px var(--mono); color: #e3dcff; min-height: 1.6em; }
@keyframes gyl-spin { to { transform: rotate(360deg); } }
@keyframes gyl-pulse { 50% { transform: scale(1.25); opacity: .7; } }

/* ---- result panel */
.glx-r { margin: 22px 0 8px; padding: 18px clamp(10px, 3vw, 26px) 22px; border-radius: var(--radius); color: var(--cream);
  background: radial-gradient(900px 420px at 50% 0, #120e30, var(--bg) 72%); border: 1px solid var(--line-c); scroll-margin-top: 80px; }
.glx-head { margin: 0 0 12px; }
.glx-title { margin: 0; font: 700 clamp(22px, 3.4vw, 32px)/1.15 var(--font-d, var(--font-b)); color: #fff; overflow-wrap: anywhere; }
.glx-meta { margin: 4px 0 0; font: 500 13px var(--mono); color: var(--soft); overflow-wrap: anywhere; }
.glx-meta:empty { display: none; }
.glx-main { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 980px) { .glx-main { grid-template-columns: minmax(0, 1fr) minmax(0, 340px); } }
.glx-col { min-width: 0; }

.glx-stage { position: relative; border-radius: 12px; overflow: hidden; background: #03040a;
  box-shadow: inset 0 0 0 1px rgba(169, 155, 255, .28), 0 0 30px rgba(120, 90, 255, .1); }
.glx-cv { display: block; width: 100%; aspect-ratio: 16 / 10.5; touch-action: none; cursor: grab; user-select: none; -webkit-user-select: none; }
.glx-cv:active { cursor: grabbing; }
.glx-stage.has-hot .glx-cv { cursor: pointer; }
@media (max-width: 600px) { .glx-cv { aspect-ratio: 1 / 1.08; } }
.glx-hint { margin: 6px 0 0; font: 500 12px var(--mono); color: var(--soft); text-align: center; }

/* HUD tooltip (positioned by galaxy.js) */
.glx-tip { position: absolute; left: 0; top: 0; z-index: 2; max-width: min(300px, calc(100% - 12px)); padding: 8px 11px; pointer-events: none;
  font: 500 12.5px/1.45 var(--mono); color: #e9fdff; background: rgba(4, 7, 18, .92); border: 1px solid rgba(62, 240, 255, .8);
  box-shadow: 0 0 16px rgba(62, 240, 255, .35); clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 9px 100%, 0 calc(100% - 9px)); }
.glx-tip span { display: block; }
.glx-tip-p { display: block; font-weight: 700; color: #fff; overflow-wrap: anywhere; }
.glx-tip-t { color: var(--soft); overflow-wrap: anywhere; }
.glx-tip-r { display: flex !important; flex-wrap: wrap; gap: 2px 10px; margin-top: 3px; color: #bff8ff; }
.glx-tip-s { margin-top: 2px; font-weight: 700; color: var(--gr); }
.glx-tip-s.bad { color: #ff8095; } .glx-tip-s.redir { color: #bff8ff; } .glx-tip-s.orph { color: #b9c3ee; }
.glx-tip-o { margin-top: 3px; color: var(--mg); }

/* controls */
.glx-ctl { position: absolute; right: 8px; bottom: 8px; display: flex; gap: 6px; }
.glx-ctl button { min-width: 40px; min-height: 40px; padding: 0 10px; border-radius: 6px; border: 1px solid rgba(62, 240, 255, .45); cursor: pointer;
  background: rgba(4, 7, 18, .82); color: #e6f3ff; font: 700 14px var(--mono); }
.glx-ctl button:hover { background: rgba(62, 240, 255, .16); }
.glx-open { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }

/* astronomer */
.glx-astro { margin: 14px 0 0; padding: 14px 18px 16px; background: rgba(12, 10, 32, .9); color: #e3dcff; border: 1px solid rgba(169, 155, 255, .5);
  box-shadow: 0 0 18px rgba(169, 155, 255, .12); }
.glx-astro h3 { margin: 0 0 6px; font: 700 13px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: #c3b8ff; }
.glx-astro-t { margin: 0; min-height: 3em; font: 400 clamp(15px, 2vw, 16.5px)/1.6 var(--mono); }
.glx-caret { color: var(--cy); animation: glx-blink .8s steps(1) infinite; }
@keyframes glx-blink { 50% { opacity: .2; } }

/* findings panel */
.glx-panel { min-width: 0; padding: 14px; background: rgba(8, 10, 24, .92); border: 1px solid var(--line-c); }
@media (min-width: 980px) { .glx-panel { max-height: 760px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(62, 240, 255, .4) transparent; } }
.glx-ph { margin: 0 0 10px; font: 700 13px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cy); }
.glx-health { display: grid; grid-template-columns: auto 1fr; align-items: end; gap: 0 10px; padding: 10px 12px 12px; border: 1px solid var(--c, #93a9c9);
  background: rgba(4, 7, 18, .8); box-shadow: 0 0 14px color-mix(in srgb, var(--c, #93a9c9) 30%, transparent); }
.glx-hl { grid-column: 1 / -1; font: 700 11px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--soft); }
.glx-health b { font: 800 46px/1 var(--mono); color: var(--c, #fff); text-shadow: 0 0 14px var(--c, #fff); }
.glx-hs { font: 700 15px var(--mono); color: var(--soft); padding-bottom: 6px; }
.glx-meter { grid-column: 1 / -1; width: 100%; height: 6px; margin-top: 8px; }
.glx-meter-v { fill: var(--c, #93a9c9); }
.g-a { --c: #5ce8c8; } .g-b { --c: #3ef0ff; } .g-c { --c: #ffb454; } .g-d { --c: #ff8a3d; } .g-e, .g-f { --c: #ff3b5c; } .g-x { --c: #93a9c9; }
.glx-stats { list-style: none; margin: 10px 0 4px; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.glx-stats li { padding: 6px 9px; background: rgba(12, 18, 36, .9); border-left: 2px solid var(--cy); min-width: 0; }
.glx-stats b { display: block; font: 700 16px var(--mono); color: #fff; overflow-wrap: anywhere; }
.glx-stats span { display: block; font: 600 10.5px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--soft); }
.glx-stats .s-broken { border-left-color: var(--red); } .glx-stats .s-redirects { border-left-color: #bff8ff; } .glx-stats .s-orphans { border-left-color: #b9c3ee; }
.glx-stats .s-deep, .glx-stats .s-max_depth { border-left-color: var(--am); } .glx-stats .s-ext { border-left-color: var(--mg); }
.glx-f { margin-top: 14px; }
.glx-f h4 { display: flex; justify-content: space-between; gap: 8px; margin: 0 0 6px; font: 700 13px var(--font-b); color: #fff; }
.glx-fn { font: 700 12px var(--mono); color: var(--soft); }
.glx-f[data-k="broken"] h4 { color: #ff9aaa; }
.glx-fl { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.glx-li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; padding: 5px 8px; font: 500 12.5px/1.4 var(--mono); color: var(--soft);
  background: rgba(12, 18, 36, .7); border: 1px solid transparent; min-width: 0; }
.glx-li.hot, .glx-li:hover { border-color: rgba(62, 240, 255, .6); }
.glx-lp { color: #e6f3ff; overflow-wrap: anywhere; min-width: 0; }
a.glx-lp { text-decoration: underline; text-decoration-color: rgba(62, 240, 255, .4); }
a.glx-lp:hover { color: var(--cy); }
.glx-st { flex: 0 0 auto; font-weight: 700; color: var(--am); }
.glx-st.bad { color: #ff8095; } .glx-st.redir { color: #bff8ff; } .glx-st.orph { color: #b9c3ee; } .glx-st.in { color: var(--cy); }
.glx-more { padding: 3px 8px; font: 500 12px var(--mono); color: var(--soft); }
.glx-none { margin: 0; font: 500 12.5px/1.5 var(--mono); color: var(--gr); }

/* table */
.glx-all { margin: 18px 0 0; border: 1px solid var(--line-c); background: rgba(8, 10, 24, .85); }
.glx-all summary { padding: 12px 14px; font: 700 14px var(--font-b); color: #fff; cursor: pointer; }
.glx-tw { max-height: 460px; overflow: auto; }
.glx-tbl { width: 100%; border-collapse: collapse; font: 500 12.5px var(--mono); color: var(--soft); }
.glx-tbl th, .glx-tbl td { padding: 5px 10px; text-align: left; border-top: 1px solid rgba(62, 240, 255, .1); white-space: nowrap; }
.glx-tbl td:first-child { white-space: normal; overflow-wrap: anywhere; min-width: 160px; }
.glx-tbl th { position: sticky; top: 0; background: #0a0d20; color: var(--cy); font-weight: 700; }

/* legend */
.glx-legw > .glx-ph { margin-top: 22px; }
.glx-leg { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 8px; }
.glx-leg li { display: flex; gap: 12px; padding: 10px 12px; background: rgba(8, 10, 24, .9); border: 1px solid var(--line-c); min-width: 0; }
.glx-leg svg { flex: 0 0 40px; width: 40px; height: 36px; }
.glx-leg div { min-width: 0; }
.glx-leg b { display: block; font: 700 14px var(--font-b); color: #fff; }
.glx-leg p { margin: 4px 0 0; font-size: 13.5px; line-height: 1.45; color: var(--soft); }

/* share */
.glx-share { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 22px 0 0; }
.glx-share a, .glx-share button { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 6px; font: 600 14px var(--font-b);
  color: var(--cream); background: rgba(62, 240, 255, .06); border: 1px solid rgba(62, 240, 255, .45); text-decoration: none; cursor: pointer; }
.glx-share a:hover, .glx-share button:hover { background: rgba(62, 240, 255, .16); }
.glx-share .glx-wa { background: #1f8f4e; border-color: #1f8f4e; color: #fff; }
.glx-share .glx-del { color: #ffd0d8; background: rgba(255, 59, 92, .08); border-color: rgba(255, 59, 92, .55); }
.glx-clip { position: fixed; opacity: 0; left: 0; top: 0; }

/* delete dialog (native <dialog>, built by galaxy.js) */
.glx-dlg { width: min(560px, calc(100vw - 28px)); max-height: calc(100vh - 32px); margin: auto; padding: 0; border: 1px solid rgba(255, 59, 92, .6);
  border-radius: 14px; background: radial-gradient(700px 320px at 50% 0, #1b1030, #05070d 74%); color: #e6f3ff; box-shadow: 0 30px 90px rgba(0, 0, 0, .7); }
.glx-dlg::backdrop { background: rgba(3, 5, 10, .74); }
.glx-dlg-in { padding: 24px clamp(16px, 4vw, 30px) 22px; }
.glx-dlg h2 { margin: 0 0 12px; font: 700 clamp(20px, 4vw, 26px)/1.2 var(--font-b, system-ui); color: #fff; }
.glx-dlg p { margin: 0 0 10px; font: 400 15px/1.6 var(--mono, ui-monospace, monospace); color: #c8d9f0; }
.glx-dlg .glx-dlg-only { margin: 0; color: #93a9c9; font-size: 13.5px; }
.glx-dlg-b { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; margin-top: 20px; }
.glx-dlg button { min-height: 46px; padding: 0 18px; border-radius: 8px; font: 700 15px var(--font-b, system-ui); cursor: pointer; }
.glx-dlg-no { color: #e6f3ff; background: rgba(62, 240, 255, .06); border: 1px solid rgba(62, 240, 255, .45); }
.glx-dlg-yes { color: #fff; background: linear-gradient(135deg, #6b0f22, #b3173a); border: 1px solid #ff3b5c; }
.glx-dlg button:disabled { opacity: .6; cursor: wait; }
.glx-dlg button:focus-visible { outline: 3px solid #3ef0ff; outline-offset: 3px; }
.glx-dlg [hidden] { display: none !important; }
/* deletion request form (visitors whose IP/browser is not the owner) */
.glx-req-f { display: block; margin-top: 16px; }
.glx-req-l { display: block; margin: 0 0 12px; font: 600 12.5px/1.4 var(--mono); letter-spacing: .04em; color: #9fb6d6; text-transform: uppercase; }
.glx-req-in { display: block; box-sizing: border-box; width: 100%; margin-top: 6px; min-height: 46px; padding: 11px 12px; border-radius: 8px;
  border: 1px solid rgba(62, 240, 255, .35); background: rgba(4, 9, 18, .85); color: #e6f3ff; font: 400 15px/1.5 var(--mono); text-transform: none; letter-spacing: 0; }
.glx-req-in:focus-visible { outline: 3px solid #3ef0ff; outline-offset: 2px; }
textarea.glx-req-in { min-height: 94px; resize: vertical; }
.glx-req-hpw { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.glx-req-msg { margin: 12px 0 0 !important; color: #ffb040 !important; }

/* wall */
.gxw { margin-top: 36px; }
.gxw-list { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 10px; }
.gxw-list a { display: flex; align-items: center; gap: 12px; height: 100%; padding: 12px 14px; border-radius: 8px; text-decoration: none;
  background: #080a18; color: #e6f3ff; border: 1px solid rgba(169, 155, 255, .25); transition: border-color .2s, transform .2s; }
.gxw-list a:hover, .gxw-list a.cur { border-color: #a99bff; transform: translateY(-2px); }
.gxw-g { flex: 0 0 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--c); color: var(--c); background: rgba(5, 9, 18, .8);
  border-radius: 50%; font: 800 17px ui-monospace, Menlo, monospace; }
.gxw-b { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gxw-t { font: 700 15px/1.3 var(--font-b); overflow-wrap: anywhere; }
.gxw-d { font: 12px ui-monospace, Menlo, monospace; color: #93a9c9; overflow-wrap: anywhere; }

/* how it works */
.gxh { margin-top: 40px; }
.gxh-steps { margin: 14px 0 18px; padding-left: 1.3em; }
.gxh-steps li { margin: 0 0 10px; }
.gxh-steps b { display: block; }
.gxh-steps span { color: var(--muted); }

@media (max-width: 560px) {
  .glx-go { flex: 1 1 100%; }
  .glx-ctl { right: 6px; bottom: 6px; gap: 4px; }
  .glx-ctl button { min-width: 38px; padding: 0 8px; font-size: 13px; }
  .glx-tip { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .glx-go, .gyl-ring, .gyl-core, .glx-caret, .glx *, .glx *::before { animation: none !important; }
}