Constant ANALYTICS_CSS 

const ANALYTICS_CSS: &str = "/* The same instrument-panel register as assets/dashboard/dashboard.css \u{2014}\n * bordered readout boxes, monospace, high contrast \u{2014} without the wave\n * field: this page is one wide document a reader scrolls, and a fixed\n * canvas behind it would be a second scrolling surface to fight. Colours\n * are repeated rather than shared because the two pages are served\n * independently and a reader of one never loads the other\'s stylesheet. */\n\n:root {\n  --paper: #ececec;\n  --ink: #0a0a0a;\n  --panel-bg: rgba(236, 236, 236, 0.94);\n  --verified: #0a5c1e;\n  --paused: #8a5a00;\n  --locked: #8a1a1a;\n  --border: 2px solid var(--ink);\n}\n\n* { box-sizing: border-box; }\n\nhtml, body {\n  margin: 0;\n  background: var(--paper);\n  color: var(--ink);\n  font: 14px/1.5 ui-monospace, \"SF Mono\", \"JetBrains Mono\", monospace;\n}\n\nheader.col {\n  max-width: 44rem;\n  margin: 0 auto;\n  padding: 24px 20px 12px;\n  background: var(--panel-bg);\n  border-bottom: var(--border);\n}\n\nh1 {\n  font-size: 1.25em;\n  font-weight: normal;\n  margin: 0 0 12px;\n}\n\ndl.server {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  gap: 2px 12px;\n  margin: 0;\n  font-size: 12px;\n}\ndl.server dt { color: #333; }\ndl.server dd { margin: 0; font-weight: bold; overflow-wrap: anywhere; }\n\n.hint {\n  font-size: 11px;\n  color: #444;\n  margin: 12px 0 0;\n}\n\nmain {\n  max-width: 72rem;\n  margin: 0 auto;\n  padding: 20px;\n}\n\n.readout {\n  border: var(--border);\n  background: var(--panel-bg);\n  padding: 14px 16px;\n  min-width: 0;\n}\n\n.readout h2 {\n  font-size: 1em;\n  font-weight: bold;\n  margin: 0 0 10px;\n  text-transform: lowercase;\n}\n\n/* A deep tree indents past any viewport. It scrolls inside its own box\n * rather than dragging the page sideways with it, so the header and the\n * server\'s own line stay where a reader left them. */\n.tree-scroll {\n  overflow-x: auto;\n  padding-bottom: 4px;\n}\n\nul.tree, ul.tree ul {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n/* Each level steps right, with a rule down the gutter so a long subtree\n * still reads as belonging to the node above it. */\nul.tree ul {\n  margin-left: 14px;\n  padding-left: 16px;\n  border-left: 1px solid #999;\n}\n\nul.tree li {\n  margin: 8px 0;\n}\n\n.node {\n  display: inline-block;\n  min-width: 22rem;\n  border: 1px solid var(--ink);\n  background: var(--paper);\n  padding: 8px 10px;\n}\n\n.node-name {\n  margin: 0 0 6px;\n  font-weight: bold;\n}\n\n.badge {\n  font-weight: normal;\n  font-size: 11px;\n  border: 1px solid currentColor;\n  padding: 0 4px;\n  margin-left: 4px;\n}\n\n.node dl {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  gap: 1px 10px;\n  margin: 0;\n  font-size: 12px;\n}\n.node dt { color: #444; }\n.node dd { margin: 0; overflow-wrap: anywhere; }\n\n/* The three edge states, distinct at a glance rather than only by the word\n * inside the badge: a screenshot alone shows which chains a stranger can\n * walk and which stop short. */\n.node[data-edge=\"verified\"] { border-color: var(--verified); }\n.node[data-edge=\"verified\"] .badge.edge { color: var(--verified); }\n\n.node[data-edge=\"paused\"] { border-color: var(--paused); border-style: dashed; }\n.node[data-edge=\"paused\"] .badge.edge { color: var(--paused); font-weight: bold; }\n\n.node[data-edge=\"locked\"] { border-color: var(--locked); }\n.node[data-edge=\"locked\"] .badge.edge { color: var(--locked); font-weight: bold; }\n\n.walk {\n  margin: 6px 0 0;\n  font-size: 11px;\n}\n.node[data-edge=\"paused\"] .walk { color: var(--paused); }\n.node[data-edge=\"locked\"] .walk { color: var(--locked); }\n\n.unrooted-title {\n  font-size: 1em;\n  margin: 20px 0 4px;\n  text-transform: lowercase;\n}\n\n.closed, .empty {\n  font-size: 12px;\n  color: #444;\n  margin: 0;\n}\n\na:focus-visible {\n  outline: 3px solid #1a4fd6;\n  outline-offset: 2px;\n}\n\n@media (max-width: 700px) {\n  header.col { padding: 16px; }\n  main { padding: 12px; }\n  .node { min-width: 18rem; }\n}\n";