

:root{
  --lumen-midnight-1000:#07060A;--lumen-midnight-950:#0B0A11;--lumen-midnight-900:#12111A;--lumen-midnight-800:#1B1925;--lumen-midnight-700:#242232;--lumen-midnight-600:#302C3F;--lumen-midnight-500:#3E3950;--lumen-midnight-400:#585067;--lumen-midnight-300:#7C7288;
  --lumen-starlight-100:#FAF7F1;--lumen-starlight-200:#EDE8DF;--lumen-starlight-300:#D2C9BC;--lumen-starlight-400:#AEA596;--lumen-starlight-500:#948B7E;
  --lumen-brass-200:#F3E3C0;--lumen-brass-300:#E5C98E;--lumen-brass-400:#C9A86A;--lumen-brass-500:#A2823C;--lumen-brass-600:#8A6F33;--lumen-brass-700:#63502A;--lumen-brass-900:#2E2513;
  --lumen-amber-200:#FBD4B2;--lumen-amber-300:#F3A671;--lumen-amber-400:#E4823F;--lumen-amber-500:#B85E22;--lumen-amber-700:#6E3614;--lumen-amber-900:#331808;
  --lumen-verdigris-300:#8FD9B0;--lumen-verdigris-400:#5FC594;--lumen-verdigris-700:#1C513C;--lumen-ember-300:#F0949A;--lumen-ember-400:#E86B72;--lumen-ember-500:#C3454F;--lumen-ember-700:#6B2228;--lumen-slate-700:#3E3950;
  --lumen-canvas:var(--lumen-midnight-950);--lumen-canvas-sunken:var(--lumen-midnight-1000);--lumen-surface-1:var(--lumen-midnight-900);--lumen-surface-2:var(--lumen-midnight-800);--lumen-surface-3:var(--lumen-midnight-700);--lumen-surface-raised:var(--lumen-midnight-800);--lumen-surface-overlay:#12111AF2;--lumen-surface-accent-wash:#2E251380;--lumen-surface-attention-wash:#33180880;
  --lumen-border-subtle:var(--lumen-midnight-600);--lumen-border:var(--lumen-midnight-500);--lumen-border-strong:var(--lumen-midnight-300);--lumen-border-control:var(--lumen-midnight-300);--lumen-border-accent:var(--lumen-brass-600);--lumen-hairline:#E5C98E24;
  --lumen-text-primary:var(--lumen-starlight-200);--lumen-text-secondary:var(--lumen-starlight-400);--lumen-text-muted:var(--lumen-starlight-500);--lumen-text-inverse:var(--lumen-midnight-1000);--lumen-text-on-accent:var(--lumen-midnight-1000);--lumen-text-technical:var(--lumen-starlight-300);--lumen-link:var(--lumen-brass-300);--lumen-link-hover:var(--lumen-brass-200);
  --lumen-action-primary-bg:var(--lumen-brass-400);--lumen-action-primary-bg-hover:var(--lumen-brass-300);--lumen-action-primary-bg-active:var(--lumen-brass-500);--lumen-action-primary-fg:var(--lumen-text-on-accent);--lumen-action-secondary-bg:var(--lumen-midnight-700);--lumen-action-secondary-bg-hover:var(--lumen-midnight-600);--lumen-action-secondary-fg:var(--lumen-starlight-200);--lumen-action-secondary-border:var(--lumen-midnight-500);--lumen-action-ghost-fg:var(--lumen-starlight-300);--lumen-action-ghost-bg-hover:#302C3F99;--lumen-action-disabled-bg:var(--lumen-midnight-800);--lumen-action-disabled-fg:#8E8499;
  --lumen-focus-ring:var(--lumen-brass-300);--lumen-focus-ring-offset:var(--lumen-canvas);--lumen-focus-ring-width: 2px;--lumen-focus-ring-offset-width: 2px;
  --lumen-selected-bg:#2E2513CC;--lumen-selected-border:var(--lumen-brass-500);--lumen-current-marker:var(--lumen-brass-300);
  --lumen-status-live-fg:var(--lumen-verdigris-300);--lumen-status-live-bg:#1C513C33;--lumen-status-live-border:var(--lumen-verdigris-700);--lumen-status-stale-fg:var(--lumen-amber-300);--lumen-status-stale-bg:#6E361433;--lumen-status-stale-border:var(--lumen-amber-700);--lumen-status-offline-fg:#C2BBC9;--lumen-status-offline-bg:#3E39504D;--lumen-status-offline-border:var(--lumen-slate-700);--lumen-status-unknown-fg:var(--lumen-starlight-400);--lumen-status-unknown-bg:#1B1925CC;--lumen-status-unknown-border:var(--lumen-midnight-400);--lumen-status-error-fg:var(--lumen-ember-300);--lumen-status-error-bg:#6B222833;--lumen-status-error-border:var(--lumen-ember-700);--lumen-status-success-fg:var(--lumen-verdigris-300);--lumen-status-warning-fg:var(--lumen-amber-300);--lumen-status-busy-fg:var(--lumen-brass-300);--lumen-status-confirmed-fg:var(--lumen-brass-200);--lumen-status-observed-fg:var(--lumen-starlight-400);
  --lumen-mark-delegate:var(--lumen-brass-300);--lumen-mark-task:var(--lumen-starlight-300);--lumen-mark-return:var(--lumen-verdigris-300);--lumen-mark-handoff:var(--lumen-brass-700);--lumen-mark-service:var(--lumen-amber-300);--lumen-mark-schedule:var(--lumen-starlight-400);--lumen-mark-defect:var(--lumen-ember-400);
  
  --lumen-duration-1: 120ms;--lumen-duration-2: 180ms;--lumen-duration-3: 260ms;--lumen-duration-4: 420ms;--lumen-duration-decor-max: 900ms;
  --lumen-ease-standard:cubic-bezier(.2,.6,.2,1);--lumen-ease-entry:cubic-bezier(.16,.84,.34,1);--lumen-ease-exit:cubic-bezier(.4,0,.9,.4);--lumen-ease-instrument:cubic-bezier(.34,1.12,.64,1);
  --lumen-motion-amplitude: 6px;--lumen-motion-scale-press: 0.985;--lumen-motion-decor-amplitude: 2px;
  
  --lumen-decor-opacity: 0.5;--lumen-decor-texture-opacity: 0.05;--lumen-texture-opacity: 0.75;
  --lumen-decor-star-color:rgba(243,227,192,.92);--lumen-decor-star-dim:rgba(174,165,150,.55);--lumen-decor-nebula-brass:rgba(99,80,42,.34);--lumen-decor-nebula-amber:rgba(110,54,20,.18);--lumen-decor-geometry-stroke:rgba(229,201,142,.16);--lumen-decor-grid-stroke:rgba(62,57,80,.5);--lumen-decor-grid-size: 96px;
  --lumen-texture-hatch:repeating-linear-gradient(135deg,rgba(229,201,142,.07) 0 1px,transparent 1px 6px);--lumen-texture-engrave:repeating-linear-gradient(0deg,rgba(7,6,10,.10) 0 1px,transparent 1px 3px);
  --lumen-metal-brass:linear-gradient(177deg,#D9BC82 0%,#C9A86A 42%,#B08F52 72%,#C4A264 100%);--lumen-metal-bronze:linear-gradient(177deg,#7A6335 0%,#63502A 55%,#4E3F20 100%);
  --lumen-layer-nightsky:radial-gradient(1.4px 1.4px at 18% 22%,var(--lumen-decor-star-color) 50%,transparent 51%),radial-gradient(1.1px 1.1px at 63% 14%,var(--lumen-decor-star-dim) 50%,transparent 51%),radial-gradient(1.6px 1.6px at 81% 44%,var(--lumen-decor-star-color) 50%,transparent 51%),radial-gradient(1px 1px at 34% 61%,var(--lumen-decor-star-dim) 50%,transparent 51%),radial-gradient(1.3px 1.3px at 54% 78%,var(--lumen-decor-star-color) 50%,transparent 51%),radial-gradient(1px 1px at 12% 86%,var(--lumen-decor-star-dim) 50%,transparent 51%),radial-gradient(1.2px 1.2px at 92% 72%,var(--lumen-decor-star-dim) 50%,transparent 51%),radial-gradient(120% 90% at 78% 8%,var(--lumen-decor-nebula-brass) 0%,transparent 60%),radial-gradient(90% 70% at 8% 96%,var(--lumen-decor-nebula-amber) 0%,transparent 62%);
  --lumen-layer-grid:linear-gradient(var(--lumen-decor-grid-stroke) 1px,transparent 1px),linear-gradient(90deg,var(--lumen-decor-grid-stroke) 1px,transparent 1px);
  
  --lumen-font-display:"Newsreader","Noto Serif","Liberation Serif",Georgia,"Times New Roman",serif;
  --lumen-font-interface:"Public Sans","Noto Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --lumen-font-technical:"IBM Plex Mono","DejaVu Sans Mono",ui-monospace,Menlo,Consolas,monospace;
  --lumen-radius-xs: 3px;--lumen-radius-sm: 5px;--lumen-radius-md: 8px;--lumen-radius-lg: 12px;
  --lumen-shadow-1: 0 1px 2px rgba(5,3,8,.7);--lumen-shadow-2: 0 4px 14px -4px rgba(5,3,8,.78),0 1px 2px rgba(5,3,8,.65);--lumen-shadow-glow: 0 0 0 1px var(--lumen-brass-700),0 0 20px -6px rgba(201,168,106,.38);
  --lumen-hex-clip-flat:polygon(50% 1%,96% 26%,96% 74%,50% 99%,4% 74%,4% 26%);
  --lumen-size-min-interface:.8125rem;--lumen-size-min-technical:.6875rem;--lumen-text-body-size:.9375rem;
  
  --sky-opacity:var(--lumen-decor-opacity);--day-geometry: 0;
  color-scheme:dark;
}

:root[data-theme="light"]{
  --lumen-canvas:#F4F0E8;--lumen-canvas-sunken:#EBE5DA;--lumen-surface-1:#FFFCF7;--lumen-surface-2:#EEE7DC;--lumen-surface-3:#E4DACA;--lumen-surface-raised:#FFFCF7;--lumen-surface-overlay:#FFFCF7F2;
  --lumen-text-primary:#241F2C;--lumen-text-secondary:#50475A;--lumen-text-muted:#655C6D;--lumen-text-technical:#50475A;--lumen-text-inverse:#FFFCF7;
  --lumen-border-subtle:#CFC4B3;--lumen-border:#958675;--lumen-border-strong:#786858;--lumen-border-control:#786858;
  --lumen-link:#705016;--lumen-link-hover:#513907;--lumen-action-primary-bg:#705016;--lumen-action-primary-bg-hover:#513907;--lumen-action-primary-fg:#FFFFFF;
  --lumen-action-secondary-bg:#EEE7DC;--lumen-action-secondary-bg-hover:#E4DACA;--lumen-action-secondary-fg:#241F2C;--lumen-action-disabled-bg:#EEE7DC;--lumen-action-disabled-fg:#655C6D;
  --lumen-focus-ring:#705016;--lumen-selected-bg:#E4DACA;--lumen-selected-border:#705016;--lumen-action-ghost-fg:#50475A;--lumen-action-ghost-bg-hover:#E4DACA;
  --lumen-status-live-fg:#205D43;--lumen-status-success-fg:#205D43;--lumen-status-warning-fg:#8A3B12;--lumen-status-stale-fg:#8A3B12;--lumen-status-error-fg:#A22B3A;--lumen-status-offline-fg:#655C6D;--lumen-status-unknown-fg:#655C6D;--lumen-status-busy-fg:#705016;--lumen-status-confirmed-fg:#513907;--lumen-status-observed-fg:#50475A;
  --lumen-mark-task:#50475A;--lumen-mark-return:#205D43;--lumen-mark-delegate:#705016;--lumen-mark-defect:#A22B3A;
  --lumen-hairline:#70501633;--lumen-shadow-glow: 0 0 0 1px #705016,0 0 20px -6px rgba(112,80,22,.3);
  --lumen-decor-grid-stroke:rgba(112,80,22,.14);
  --lumen-surface-accent-wash:#70501614;--lumen-surface-attention-wash:#8A3B1214;--lumen-status-live-bg:#205D4322;--lumen-status-stale-bg:#8A3B1222;--lumen-status-error-bg:#A22B3A22;--lumen-surface-overlay:#FFFCF7F2;
  --sky-opacity: 0;--day-geometry: 1;
  color-scheme:light;
}

:root[data-theme="light"]{--lumen-mark-service:#9A4A16;--lumen-decor-geometry-stroke:rgba(112,80,22,.26)}

html[data-motion="reduced"],html[data-motion="off"]{--lumen-duration-1: 0ms;--lumen-duration-2: 0ms;--lumen-duration-3: 0ms;--lumen-duration-4: 0ms;--lumen-duration-decor-max: 0ms;--lumen-motion-amplitude: 0px;--lumen-motion-decor-amplitude: 0px;--lumen-ease-instrument:var(--lumen-ease-standard)}
html[data-motion="reduced"] *,html[data-motion="reduced"] *::before,html[data-motion="reduced"] *::after,html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after{animation:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){
  :root{--lumen-duration-1: 0ms;--lumen-duration-2: 0ms;--lumen-duration-3: 0ms;--lumen-duration-4: 0ms;--lumen-duration-decor-max: 0ms;--lumen-motion-amplitude: 0px;--lumen-motion-decor-amplitude: 0px;--lumen-ease-instrument:var(--lumen-ease-standard)}
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}


*{box-sizing:border-box}
html,body{margin: 0}
body{background:var(--lumen-canvas);color:var(--lumen-text-primary);font: 400 var(--lumen-text-body-size)/1.45 var(--lumen-font-interface);min-height: 100vh;overflow-x:hidden}
a{color:var(--lumen-link)}
a:hover{color:var(--lumen-link-hover)}
button{font-family:var(--lumen-font-interface);font-size:var(--lumen-size-min-interface);color:var(--lumen-action-secondary-fg);background:var(--lumen-action-secondary-bg);border: 1px solid var(--lumen-border-control);border-radius:var(--lumen-radius-sm);padding:.3rem .6rem;cursor:pointer;transition:background-color var(--lumen-duration-1) var(--lumen-ease-standard),border-color var(--lumen-duration-1) var(--lumen-ease-standard)}
button:hover{background:var(--lumen-action-secondary-bg-hover)}
button[aria-pressed="true"]{background:var(--lumen-selected-bg);border-color:var(--lumen-selected-border);color:var(--lumen-text-primary)}
button.ghost{background:transparent;border-color:transparent;color:var(--lumen-action-ghost-fg)}
button.ghost:hover{background:var(--lumen-action-ghost-bg-hover)}
:focus-visible{outline:var(--lumen-focus-ring-width) solid var(--lumen-focus-ring);outline-offset:var(--lumen-focus-ring-offset-width)}
.skip{position:absolute;left:-999px;top: 0;background:var(--lumen-action-primary-bg);color:var(--lumen-action-primary-fg);padding:.5rem;z-index: 50}
.skip:focus{left: 8px;top: 8px}
.tech,code{font-family:var(--lumen-font-technical);font-size:var(--lumen-size-min-technical);font-variant-numeric:tabular-nums slashed-zero;color:var(--lumen-text-technical)}
.muted{color:var(--lumen-text-muted)}
.small{font-size:var(--lumen-size-min-interface)}
.sr{position:absolute;width: 1px;height: 1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.chip{display:inline-flex;align-items:center;gap:.3rem;padding:.1rem .5rem;border-radius: 999px;border: 1px solid var(--lumen-border);font-family:var(--lumen-font-technical);font-size:var(--lumen-size-min-technical);letter-spacing:.02em;color:var(--lumen-text-secondary);white-space:nowrap}
.chip.live{border-color:var(--lumen-status-live-border);color:var(--lumen-status-live-fg);background:var(--lumen-status-live-bg)}
.chip.stale{border-color:var(--lumen-status-stale-border);color:var(--lumen-status-stale-fg);background:var(--lumen-status-stale-bg)}
.chip.error{border-color:var(--lumen-status-error-border);color:var(--lumen-status-error-fg);background:var(--lumen-status-error-bg)}
.chip.offline{border-color:var(--lumen-status-offline-border);color:var(--lumen-status-offline-fg);background:var(--lumen-status-offline-bg)}
.chip.unknown{color:var(--lumen-status-unknown-fg);border-style:dashed}

.sg{display:inline-block;width: 10px;height: 10px;border-radius: 3px;border: 1.5px solid currentColor;vertical-align:-1px;margin-right:.3rem;flex:none}
.sg.stale{border-style:dashed}.sg.unknown{border-style:dotted}.sg.offline{opacity:.6}
.sg.error{background:linear-gradient(currentColor,currentColor) center/100% 1.5px no-repeat}
.st{font-family:var(--lumen-font-technical);font-size:var(--lumen-size-min-technical);white-space:nowrap;display:inline-flex;align-items:center}
.st.live{color:var(--lumen-status-live-fg)}.st.stale{color:var(--lumen-status-stale-fg)}.st.unknown{color:var(--lumen-status-unknown-fg)}.st.offline{color:var(--lumen-status-offline-fg)}.st.error{color:var(--lumen-status-error-fg)}
.kindb{font-family:var(--lumen-font-technical);font-size:.625rem;font-weight: 500;letter-spacing:.08em;padding: 0 .35rem;border: 1px solid var(--lumen-border-accent);border-radius:var(--lumen-radius-xs);color:var(--lumen-link);white-space:nowrap;line-height: 1.5}

header.t1{display:flex;align-items:center;gap:.75rem;padding:.4rem 1rem;border-bottom: 1px solid var(--lumen-border-subtle);background:var(--lumen-surface-1);background-image:var(--lumen-texture-engrave);flex-wrap:wrap;min-height: 48px}
.wordmark{display:flex;align-items:baseline;gap:.6rem}
.wordmark h1{font-family:var(--lumen-font-display);font-weight: 500;font-size: 1.45rem;margin: 0;letter-spacing:.01em;color:var(--lumen-brass-200)}
:root[data-theme="light"] .wordmark h1{color:var(--lumen-brass-700)}
.wordmark .sub{font-family:var(--lumen-font-technical);font-size:var(--lumen-size-min-technical);color:var(--lumen-text-muted);letter-spacing:.08em;text-transform:uppercase}
.t1 .grow{flex: 1}
.t1 .group{display:flex;gap:.25rem;align-items:center}
.t1 .group .lab{font-family:var(--lumen-font-technical);font-size:var(--lumen-size-min-technical);color:var(--lumen-text-muted);margin-right:.2rem;text-transform:uppercase;letter-spacing:.06em}

main.page{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap: 8px;padding: 8px;align-items:start}
.slot{background:var(--lumen-surface-1);border: 1px solid var(--lumen-border-subtle);border-radius:var(--lumen-radius-md);box-shadow:var(--lumen-shadow-2);min-width: 0;display:flex;flex-direction:column;position:relative;overflow:hidden}
.slot>.hd{display:flex;align-items:center;gap:.5rem;padding:.35rem .6rem;border-bottom: 1px solid var(--lumen-border-subtle);background:var(--lumen-surface-2);background-image:var(--lumen-texture-engrave);flex-wrap:wrap;min-height: 34px}
.slot>.hd h2{font-size:var(--lumen-size-min-interface);font-weight: 600;margin: 0;letter-spacing:.04em;text-transform:uppercase;color:var(--lumen-text-secondary)}
.slot>.hd .grow{flex: 1}
#slot-sky{grid-column: 1;grid-row: 1}
#slot-ref{grid-column: 2;grid-row: 1 / span 2;position:sticky;top: 8px;max-height:calc(100vh - 16px);overflow:auto}
#slot-list{grid-column: 1;grid-row: 2}


.skywrap{position:relative;min-height: 200px}
#sky{position:absolute;inset: 0;background:var(--lumen-layer-nightsky);background-size: 520px 380px,420px 300px,640px 460px,380px 280px,560px 400px,300px 240px,480px 340px,100% 100%,100% 100%;opacity:var(--sky-opacity);pointer-events:none}
#day-geometry{position:absolute;inset: 0;background:var(--lumen-layer-grid);background-size:var(--lumen-decor-grid-size) var(--lumen-decor-grid-size);opacity:var(--day-geometry);pointer-events:none}
#constellations{display:block;width: 100%;height:auto;position:relative;font-family:var(--lumen-font-interface);margin: 0 auto}
#constellations[data-layout="wide"]{max-height:calc(100vh - 150px);min-height: 560px}
#constellations text{fill:var(--lumen-text-secondary);font-size: 12px;user-select:none;-webkit-user-select:none;paint-order:stroke;stroke:var(--lumen-surface-1);stroke-width: 3px;stroke-linejoin:round}
#constellations .nm{fill:var(--lumen-text-primary);font-weight: 600;font-size: 12px}
#constellations .host .nm{font-size: 13px}
#constellations .kind{font-family:var(--lumen-font-technical);font-size: 8.5px;font-weight: 500;letter-spacing:.08em;fill:var(--lumen-link)}
#constellations .wd{font-family:var(--lumen-font-technical);font-size: 10px;letter-spacing:.02em;fill:var(--lumen-text-muted)}
#constellations .wd.live{fill:var(--lumen-status-live-fg)}#constellations .wd.stale{fill:var(--lumen-status-stale-fg)}#constellations .wd.unknown{fill:var(--lumen-status-unknown-fg)}#constellations .wd.offline{fill:var(--lumen-status-offline-fg)}#constellations .wd.error{fill:var(--lumen-status-error-fg)}
#constellations .ctitle{font-family:var(--lumen-font-display);font-size: 15px;font-weight: 500;letter-spacing:.16em;fill:var(--lumen-brass-300)}
:root[data-theme="light"] #constellations .ctitle{fill:var(--lumen-brass-700)}
#constellations .csub{font-family:var(--lumen-font-technical);font-size: 10px;letter-spacing:.04em;fill:var(--lumen-text-muted)}
#constellations .edge-label{font-family:var(--lumen-font-technical);font-size: 9.5px;fill:var(--lumen-text-muted)}
.figure{fill:none;stroke:var(--lumen-decor-geometry-stroke);stroke-width: 1;stroke-linejoin:round}
.edge{fill:none;stroke:var(--lumen-brass-500);stroke-width: 1.5;opacity:.75}
.edge.to-offline{opacity:.35}
.edge.to-unknown{stroke:var(--lumen-border-strong);stroke-dasharray: 2 4}
.edge.to-error{stroke:var(--lumen-status-error-border)}
.edge.trunk{opacity:.55}
.edge.link{stroke:var(--lumen-brass-400);opacity:.8}

.host{cursor:pointer;outline:none}
.host .hex{fill:var(--lumen-surface-2);stroke:var(--lumen-mark-delegate);stroke-width: 1.6;stroke-linejoin:round}
.host .hex-hatch{fill:url(#hatch);stroke:none}
.host .core{fill:var(--lumen-brass-200)}
.host .lens{fill:none;stroke:var(--lumen-brass-700);stroke-width: 1.4}
.host .ring{fill:none;stroke-width: 2}
.host[data-status="live"] .ring{stroke:var(--lumen-status-live-fg)}
.host[data-status="unknown"] .ring{stroke:var(--lumen-status-unknown-fg);stroke-dasharray: 3 4}
.host[data-status="offline"] .ring{stroke:var(--lumen-status-offline-fg);opacity:.6}
.host[data-status="unknown"] .hex,.host[data-status="offline"] .hex{stroke:var(--lumen-border-strong)}
.host[data-status="unknown"] .core,.host[data-status="offline"] .core{fill:var(--lumen-text-muted)}
.host.is-selected .hex{stroke:var(--lumen-brass-200);stroke-width: 2.4}
:root[data-theme="light"] .host .core{fill:var(--lumen-brass-500)}

.site{cursor:pointer;outline:none}
.site .body{fill:var(--lumen-surface-2);stroke:var(--lumen-mark-service);stroke-width: 1.5}
.site .glyph{fill:none;stroke:var(--lumen-brass-200);stroke-width: 1.1;stroke-linecap:round;stroke-linejoin:round}
.site .core{fill:var(--lumen-brass-200)}
:root[data-theme="light"] .site .glyph{stroke:var(--lumen-brass-700)}:root[data-theme="light"] .site .core{fill:var(--lumen-brass-700)}
.site .ring{fill:none;stroke-width: 1.6}
.site[data-status="live"] .ring{stroke:var(--lumen-status-live-fg)}
.site[data-status="stale"] .ring{stroke:var(--lumen-status-stale-fg);stroke-dasharray: 7 3}
.site[data-status="unknown"] .ring{stroke:var(--lumen-status-unknown-fg);stroke-dasharray: 1.2 3.2;stroke-linecap:round}
.site[data-status="unknown"] .body{stroke-dasharray: 2.5 2}
.site[data-status="offline"]{opacity:.72}
.site[data-status="offline"] .ring{stroke:var(--lumen-status-offline-fg);opacity:.6}
.site[data-status="offline"] .body{stroke:var(--lumen-border-strong)}
.site[data-status="error"] .ring{stroke:var(--lumen-status-error-fg)}
.site[data-status="stale"] .core,.site[data-status="unknown"] .core,.site[data-status="offline"] .core{fill:var(--lumen-text-muted)}
.site[data-status="stale"] .glyph,.site[data-status="unknown"] .glyph,.site[data-status="offline"] .glyph{stroke:var(--lumen-text-muted)}
.site .bar{stroke:var(--lumen-status-error-fg);stroke-width: 2;stroke-linecap:round}
.site .clock{fill:var(--lumen-surface-1);stroke:var(--lumen-status-stale-fg);stroke-width: 1.3}
.site .clock-hands{fill:none;stroke:var(--lumen-status-stale-fg);stroke-width: 1.2;stroke-linecap:round}
.site:hover .body,.host:hover .hex{stroke-width: 2.2}
.site.is-selected .body{stroke:var(--lumen-brass-200);stroke-width: 2.4;fill:var(--lumen-selected-bg)}
:root[data-theme="light"] .site.is-selected .body{stroke:var(--lumen-brass-700)}
.site .focus,.host .focus{fill:none;stroke:none}
.site:focus-visible .focus,.host:focus-visible .focus{stroke:var(--lumen-focus-ring);stroke-width: 2}

.site.pulse .ring{animation:markPulse var(--lumen-duration-4) var(--lumen-ease-instrument) 1}
@keyframes markPulse{0%{stroke-width: 1.6}40%{stroke-width: 4.5}100%{stroke-width: 1.6}}

.legend{display:flex;gap:.4rem 1rem;flex-wrap:wrap;padding:.4rem .7rem;border-top: 1px solid var(--lumen-border-subtle);font-family:var(--lumen-font-technical);font-size:var(--lumen-size-min-technical);color:var(--lumen-text-muted);align-items:center}
.legend span{display:inline-flex;align-items:center;white-space:nowrap}
.legend .hx{display:inline-block;width: 12px;height: 12px;clip-path:var(--lumen-hex-clip-flat);background:var(--lumen-surface-3);box-shadow:inset 0 0 0 1.5px var(--lumen-mark-delegate);margin-right:.3rem}
.legend .sq{display:inline-block;width: 10px;height: 10px;border: 1.5px solid var(--lumen-mark-service);border-radius: 2px;margin-right:.3rem}
.legend .ar{display:inline-block;width: 18px;height: 0;border-top: 1.5px solid var(--lumen-brass-500);margin-right:.3rem;position:relative}
.legend .ar::after{content:"";position:absolute;right:-1px;top:-4.5px;border: 3.5px solid transparent;border-left: 5px solid var(--lumen-brass-500)}
.legend .fl{display:inline-block;width: 18px;height: 0;border-top: 1px solid var(--lumen-decor-geometry-stroke);margin-right:.3rem}
.legend .live{color:var(--lumen-status-live-fg)}.legend .stale{color:var(--lumen-status-stale-fg)}.legend .unknown{color:var(--lumen-status-unknown-fg)}.legend .offline{color:var(--lumen-status-offline-fg)}.legend .error{color:var(--lumen-status-error-fg)}
.hint{font-family:var(--lumen-font-technical);font-size:var(--lumen-size-min-technical);color:var(--lumen-text-muted)}


.inspector{padding:.6rem .8rem .8rem;font-size:var(--lumen-size-min-interface);display:flex;flex-direction:column;gap:.55rem}
.inspector h3{font-family:var(--lumen-font-display);font-weight: 500;font-size: 1.3rem;margin: 0;color:var(--lumen-brass-200);line-height: 1.2}
:root[data-theme="light"] .inspector h3{color:var(--lumen-brass-700)}
.inspector .ihead{display:flex;flex-direction:column;gap:.3rem}
.inspector .row{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.inspector p{margin: 0}
.inspector dl{display:grid;grid-template-columns:auto 1fr;gap:.2rem .7rem;margin: 0}
.inspector dt{font-family:var(--lumen-font-technical);font-size:var(--lumen-size-min-technical);color:var(--lumen-text-muted);text-transform:uppercase;letter-spacing:.06em;padding-top:.1rem}
.inspector dd{margin: 0;min-width: 0;overflow-wrap:anywhere}
.inspector .summary{border-left: 3px solid var(--lumen-border-accent);padding:.25rem .55rem;background:var(--lumen-surface-accent-wash);border-radius: 0 var(--lumen-radius-xs) var(--lumen-radius-xs) 0}
.inspector .note{color:var(--lumen-text-secondary)}
.inspector ul{margin: 0;padding-left: 1.1rem}
.inspector li{margin:.15rem 0}
.inspector details summary{cursor:pointer;color:var(--lumen-text-secondary)}
.open-link{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .8rem;border-radius:var(--lumen-radius-sm);background:var(--lumen-action-primary-bg);color:var(--lumen-action-primary-fg);font-weight: 600;text-decoration:none;align-self:flex-start;max-width: 100%;flex-wrap:wrap}
.open-link:hover{background:var(--lumen-action-primary-bg-hover);color:var(--lumen-action-primary-fg)}
.open-link .tech{color:inherit;opacity:.85;overflow-wrap:anywhere}
.nolink{border: 1px dashed var(--lumen-border);border-radius:var(--lumen-radius-sm);padding:.35rem .6rem;color:var(--lumen-text-secondary)}
.counts{display:flex;flex-wrap:wrap;gap:.3rem}
.chiplist button{margin:.15rem .15rem 0 0;padding:.15rem .45rem;font-size:var(--lumen-size-min-technical);font-family:var(--lumen-font-technical)}


details.fold{background:var(--lumen-surface-1)}
details.fold>summary{cursor:pointer;padding:.45rem .7rem;font-size:var(--lumen-size-min-interface);color:var(--lumen-text-secondary);background:var(--lumen-surface-2);border-bottom: 1px solid var(--lumen-border-subtle)}
.list{padding:.5rem .8rem .9rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:.8rem 1.4rem}
.list h3{font-family:var(--lumen-font-display);font-weight: 500;font-size: 1.05rem;margin:.1rem 0 .25rem;color:var(--lumen-brass-200)}
:root[data-theme="light"] .list h3{color:var(--lumen-brass-700)}
.list h3 .tech{font-weight: 400;margin-left:.4rem}
.list ul{list-style:none;margin: 0;padding: 0}
.list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.1rem .5rem;padding:.35rem 0;border-top: 1px solid var(--lumen-border-subtle);align-items:baseline}
.list .lname{display:flex;gap:.4rem;align-items:baseline;flex-wrap:wrap;min-width: 0}
.list .lname a,.list .lname .nolinkname{font-weight: 600;overflow-wrap:anywhere}
.list .addr{grid-column: 1;overflow-wrap:anywhere;color:var(--lumen-text-muted)}
.list .show{grid-column: 2;grid-row: 1 / span 2;align-self:center;padding:.15rem .4rem;font-size:var(--lumen-size-min-technical)}
.excluded{padding: 0 .8rem .8rem;font-size:var(--lumen-size-min-interface);color:var(--lumen-text-secondary)}
.excluded summary{cursor:pointer}
.excluded ul{margin:.3rem 0 0;padding-left: 1.1rem}

footer.strip{display:flex;gap: 1rem;align-items:center;padding:.4rem 1rem;border-top: 1px solid var(--lumen-border-subtle);background:var(--lumen-surface-1);background-image:var(--lumen-texture-engrave);font-family:var(--lumen-font-technical);font-size:var(--lumen-size-min-technical);color:var(--lumen-text-muted);flex-wrap:wrap}
#tooltip{position:fixed;z-index: 40;pointer-events:none;background:var(--lumen-surface-overlay);border: 1px solid var(--lumen-border-accent);border-radius:var(--lumen-radius-sm);padding:.35rem .55rem;font-size:var(--lumen-size-min-interface);max-width: 320px;box-shadow:var(--lumen-shadow-2);opacity: 0;transition:opacity var(--lumen-duration-2)}
#tooltip.show{opacity: 1}
#tooltip .tech{display:block;margin-bottom:.15rem;overflow-wrap:anywhere}
.loadfail{padding: 1rem;margin: 1rem;border: 1px solid var(--lumen-status-error-border);color:var(--lumen-status-error-fg);border-radius:var(--lumen-radius-md)}


@media (max-width: 1099px){
  main.page{grid-template-columns:minmax(0,1fr)}
  #slot-sky{grid-row:auto}#slot-list{grid-row:auto}
  #slot-ref{grid-column: 1;grid-row:auto;position:static;max-height:none}
  body.has-selection #slot-ref{position:fixed;left: 8px;right: 8px;bottom: 8px;top:auto;max-height:min(52vh,460px);z-index: 30;border-color:var(--lumen-border-accent)}
  body.has-selection{padding-bottom:min(52vh,460px)}
}
@media (max-width: 600px){
  header.t1{padding:.4rem .6rem;gap:.4rem .6rem}
  .hint{display:none}
  main.page{padding: 6px;gap: 6px}
}
@media (forced-colors:active){
  .edge,.host .hex,.host .ring,.site .body,.site .ring,.figure{forced-color-adjust:auto;stroke:CanvasText}
  #constellations text{fill:CanvasText;stroke:Canvas}
  .site:focus-visible .focus,.host:focus-visible .focus{stroke:Highlight}
}

/* Showcase layout and accessible controls. */
header.t1{padding: 1rem clamp(1rem,3vw,2.5rem);gap:.7rem 1.1rem}
.back-link{font-size:.875rem;text-decoration:none;min-height: 44px;display:inline-flex;align-items:center}
.wordmark h1{font-size: 1.6rem}.wordmark{flex-wrap:wrap;gap:.35rem .7rem}
.demo-chip{color:var(--lumen-link);border-color:var(--lumen-border-accent);font-size:.8rem;padding:.25rem .65rem}
.demo-intro{padding: 1.5rem clamp(1rem,3vw,2.5rem) 1rem;max-width: 70rem}
.demo-intro h2{font: 500 clamp(2rem,4vw,3.2rem)/1.05 var(--lumen-font-display);margin: 0 0 .65rem}
.demo-intro p{color:var(--lumen-text-secondary);max-width: 66ch;margin: 0;line-height: 1.6}
main.page{grid-template-columns:minmax(0,1fr) 300px;gap: 16px;padding: 1rem clamp(1rem,2vw,2rem) 2rem;max-width: 1800px;margin:auto}
button{min-height: 44px;padding:.55rem .75rem;font-size:.85rem}
.slot>.hd{padding:.65rem .85rem}.slot>.hd h2{font-size:.8rem}
#slot-ref{top: 16px;max-height:calc(100vh - 32px)}
#constellations[data-layout="wide"]{min-height: 0;max-height:none}
#constellations text{font-size: 15px}
#constellations .nm,#constellations .host .nm{font-size: 15px}
#constellations .wd{font-size: 12px}
#constellations .ctitle{font-size: 18px}
#constellations .csub{font-size: 11px}
#constellations .hit{fill:transparent;stroke:none}
.inspector{padding: 1rem;font-size:.9rem;gap:.85rem;line-height: 1.6}
.inspector h3{font-size: 1.7rem}.inspector .summary{padding:.6rem .7rem}
.inspector dl{grid-template-columns: 1fr;gap:.1rem}.inspector dd{margin-bottom:.35rem}
.inspector dt{font-size:.72rem}
.counts{gap:.4rem}.counts .chip{font-size:.73rem}
.legend{font-size:.72rem;padding:.75rem 1rem;line-height: 1.6}
.list{grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));padding: 1rem;gap: 1.5rem}
.list h3{font-size: 1.4rem}.list li{display:block;padding:.7rem 0}
.service-button{width: 100%;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:.7rem;background:transparent}
.service-button strong{font-weight: 600}.service-button .st{font-size:.7rem;white-space:normal}
.service-description{font-size:.8rem;line-height: 1.5;color:var(--lumen-text-secondary);margin:.45rem .2rem 0}
#slot-list{grid-column: 1 / -1;grid-row: 2}
#slot-ref{grid-row: 1}
.hint{display:block;font-size:.73rem;line-height: 1.5;padding:.75rem 1rem;margin: 0;color:var(--lumen-text-secondary);border-top: 1px solid var(--lumen-border-subtle)}
footer.strip{padding: 1rem clamp(1rem,3vw,2.5rem);font-size:.75rem;justify-content:space-between}
.noscript{padding: 1rem;background:var(--lumen-surface-attention-wash)}
@media(max-width: 1100px){main.page{grid-template-columns:minmax(0,1fr)}#slot-ref{grid-column: 1;grid-row: 2;position:static;max-height:none}#slot-list{grid-row: 3}body.has-selection #slot-ref{position:static;max-height:none}body.has-selection{padding-bottom: 0}.inspector{max-width: 65ch}}
@media(max-width: 600px){header.t1{align-items:flex-start}.wordmark{width: 100%}.t1 .grow{display:none}.demo-intro{padding-top: 1rem}main.page{padding:.5rem .6rem 1rem;gap: 12px}.demo-intro h2{font-size: 2.25rem}.legend{gap:.35rem .85rem}footer.strip{gap:.7rem}#constellations .ctitle{font-size: 17px}}
@media(forced-colors:active){.host .core,.site .core{fill:CanvasText}.demo-chip{border-color:CanvasText}.site.is-selected .body,.host.is-selected .hex{stroke:Highlight}}

:root[data-theme="light"] .host.is-selected .hex{stroke:var(--lumen-brass-700)}
#constellations[data-layout="stack"] .nm{font-size: 16px}
#constellations[data-layout="stack"] .wd{font-size: 13px}
