/* Manultas: the shell around the trace and network maps (graph.js, from TokenValue), and the map's ground in Manultas's black */
:root {
  --m-void: #04060b; --m-ink: #e7edf7; --m-dim: #7f8ba3; --m-line: rgba(140, 170, 220, 0.16); --m-signal: #ffb547;
  --m-display: "Unbounded", "Arial Black", system-ui, sans-serif;
  --m-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  color-scheme: dark;
}
body { background: var(--m-void); color: var(--m-ink); }
.mbar { flex: none; display: flex; align-items: center; gap: 28px; flex-wrap: wrap; background: var(--m-void); border-bottom: 1px solid var(--m-line);
  padding-block: calc(10px + env(safe-area-inset-top, 0px)) 10px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.mbar .brand { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--m-ink); }
.mbar .brand svg { width: 26px; height: 26px; flex: none; }
.mbar .brand b { font-family: var(--m-display); font-weight: 600; font-size: 16px; letter-spacing: 0.26em; }
.mbar .mtabs { display: flex; gap: 4px; }
.mbar .tab { position: relative; padding: 8px 12px; font-family: var(--m-mono); font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--m-dim); text-decoration: none; }
.mbar .tab:hover, .mbar .tab[aria-current="page"] { color: var(--m-ink); }
.mbar .tab[aria-current="page"]::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px; height: 1px; background: var(--m-signal); box-shadow: 0 0 8px var(--m-signal); }
.mbar .end { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.mbar .pill { font-family: var(--m-mono); font-size: 11px; letter-spacing: 0.14em; color: var(--m-signal); border: 1px solid rgba(255, 181, 71, 0.45); padding: 4px 9px; border-radius: 999px; }
.mbar :focus-visible { outline: 1px solid var(--m-signal); outline-offset: 3px; }
.mfoot { flex: none; background: var(--m-void); border-top: 1px solid var(--m-line); color: var(--m-dim); font-family: var(--m-mono); font-size: 11px; }
.mfoot .foot-lite-in { padding: 8px max(16px, env(safe-area-inset-right, 0px)) calc(8px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); display: flex; gap: 16px; align-items: center; }
.mfoot .mlinks { margin-left: auto; display: flex; flex-wrap: wrap; gap: 4px 16px; }
.mfoot a { color: var(--m-ink); text-decoration: none; }
.mfoot a:hover { color: var(--m-signal); }
@media (max-width: 600px) { .mfoot .foot-lite-in { flex-wrap: wrap; gap: 4px 16px; } .mfoot .mlinks { margin-left: 0; } }
/* the map's ground: Manultas's blue-black for TokenValue's navy */
.ng-main { --ng-bg-0: #0b1222; --ng-bg-1: #060a14; --ng-bg-2: #020308; --ng-panel: #0a0f1b; --ng-panel-solid: #0b111e;
  --ng-panel-2: rgb(16 24 42 / 0.78); --ng-line: rgb(140 170 220 / 0.2); --ng-line-2: rgb(140 170 220 / 0.36); --ng-accent: #9fb4ff; --ng-outline: #04060b; }
.ng-ssr { color: var(--m-ink); }
@media (max-width: 600px) { .mbar { gap: 8px 16px; } .mbar .pill { display: none; } }
/* the map's glow in Manultas's cold blues, not TokenValue's purple */
.ng-main .ng-root { background:
  radial-gradient(38% 34% at 30% 34%, rgb(70 110 200 / 0.10), transparent 72%),
  radial-gradient(34% 30% at 74% 64%, rgb(40 160 240 / 0.05), transparent 72%),
  radial-gradient(farthest-corner at 50% 50%, var(--ng-bg-0) 0%, var(--ng-bg-1) 48%, var(--ng-bg-2) 100%); }