:root {
  color-scheme: dark;
  --px-void: #050817;
  --px-night: #0b1230;
  --px-panel: #101936;
  --px-panel-2: #080f24;
  --px-panel-hi: #263b70;
  --px-edge-hi: #7186bd;
  --px-edge-lo: #02040c;
  --px-ink: #f4f1dc;
  --px-muted: #9ca8c7;
  --px-lime: #a6e151;
  --px-lime-down: #85cc1e;
  --px-cyan: #55e6d1;
  --px-blue: #72a7ff;
  --px-amber: #ffd166;
  --px-red: #ff6f91;
  --px-green: #76e08b;
  --px-font: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bg: var(--px-void);
  --page: var(--px-void);
  --panel: var(--px-panel);
  --panel2: var(--px-panel-2);
  --card: var(--px-panel);
  --soft: #17264b;
  --soft2: #0b1430;
  --line: #050711;
  --grid: #24345d;
  --ink: var(--px-ink);
  --txt: var(--px-ink);
  --muted: var(--px-muted);
  --dim: var(--px-muted);
  --blue: var(--px-blue);
  --teal: var(--px-cyan);
  --cyan: var(--px-cyan);
  --green: var(--px-green);
  --amber: var(--px-amber);
  --gold: var(--px-amber);
  --red: var(--px-red);
  --violet: #c7a7ff;
  --shadow: 3px 3px 0 rgba(0, 0, 0, .38);
}

html { background: var(--px-void) !important; }
body.pixel-theme {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  background: linear-gradient(180deg, #111b50 0, #16255e 24%, #101a42 57%, #060a1b 100%) !important;
  color: var(--px-ink) !important;
  font-family: var(--px-font) !important;
  font-variant-numeric: tabular-nums;
}
body.pixel-theme::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -3;
  pointer-events: none;
  background:
    radial-gradient(circle at 7% 8%, #fff 0 1px, transparent 2px),
    radial-gradient(circle at 17% 17%, #8db8ff 0 1px, transparent 2px),
    radial-gradient(circle at 29% 6%, #fff 0 1px, transparent 2px),
    radial-gradient(circle at 43% 16%, #8db8ff 0 2px, transparent 3px),
    radial-gradient(circle at 57% 7%, #fff 0 1px, transparent 2px),
    radial-gradient(circle at 71% 13%, #8db8ff 0 1px, transparent 2px),
    radial-gradient(circle at 85% 5%, #fff 0 1px, transparent 2px),
    radial-gradient(circle at 94% 21%, #8db8ff 0 2px, transparent 3px),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .018) 0 1px, transparent 1px 4px);
}
body.pixel-theme::after {
  content: "";
  position: fixed;
  left: -5vw;
  right: -5vw;
  bottom: 0;
  height: 46vh;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(145deg, transparent 0 37%, #16234d 37.2% 47%, transparent 47.2%) 0 100% / 52% 100% no-repeat,
    linear-gradient(215deg, transparent 0 38%, #1d2f68 38.2% 54%, transparent 54.2%) 50% 100% / 66% 100% no-repeat,
    linear-gradient(145deg, transparent 0 49%, #0b1434 49.2% 66%, transparent 66.2%) 100% 100% / 62% 90% no-repeat,
    linear-gradient(180deg, transparent 0 62%, rgba(3, 6, 18, .82) 62% 100%);
  image-rendering: pixelated;
}

body.pixel-theme *, body.pixel-theme *::before, body.pixel-theme *::after { box-sizing: border-box; }
body.pixel-theme ::selection { background: var(--px-lime); color: #050711; }
body.pixel-theme button, body.pixel-theme input, body.pixel-theme select { font-family: var(--px-font); }
body.pixel-theme a { color: inherit; }
body.pixel-theme button:focus-visible,
body.pixel-theme input:focus-visible,
body.pixel-theme select:focus-visible,
body.pixel-theme a:focus-visible { outline: 2px solid var(--px-amber); outline-offset: 3px; }
body.pixel-theme .page { position: relative; z-index: 0; }

/* Shared information architecture -------------------------------------------------
   Global navigation is deliberately separate from local filters/tabs. */
body.pixel-theme .global-nav {
  position: relative;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  margin: 10px 0 14px;
  padding: 7px 9px;
  border: 2px solid var(--px-edge-lo);
  background: rgba(5, 8, 23, .96);
  box-shadow: inset 2px 2px 0 #314776, inset -2px -2px 0 var(--px-edge-lo), 3px 3px 0 rgba(0, 0, 0, .3);
}
body.pixel-theme .global-nav a { text-decoration: none; }
body.pixel-theme .global-nav__brand {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 8px;
  padding-right: 12px;
  color: #fff;
  border-right: 1px solid #30436d;
  font: 900 11px/1 var(--px-font);
  letter-spacing: .2px;
}
body.pixel-theme .global-nav__brand-mark {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  border: 2px solid #02040c;
  background: var(--px-lime);
  color: #071006;
  box-shadow: inset 1px 1px 0 #efffc2, inset -1px -1px 0 #528c10;
  font-size: 9px;
}
body.pixel-theme .global-nav__groups { display: flex; min-width: 0; align-items: center; gap: 4px; }
body.pixel-theme .global-nav__item,
body.pixel-theme .global-nav__group > summary {
  display: flex;
  min-height: 30px;
  align-items: center;
  gap: 5px;
  padding: 6px 9px;
  border: 0;
  color: #aeb8d1;
  cursor: pointer;
  list-style: none;
  font: 800 10px/16px var(--px-font);
  white-space: nowrap;
}
body.pixel-theme .global-nav__group > summary::-webkit-details-marker { display: none; }
body.pixel-theme .global-nav__item:hover,
body.pixel-theme .global-nav__group > summary:hover { color: #fff; background: #152044; }
body.pixel-theme .global-nav__item.is-active,
body.pixel-theme .global-nav__group.is-active > summary {
  background: var(--px-lime);
  color: #071006;
  box-shadow: inset 1px 1px 0 #efffc2, inset -1px -1px 0 #528c10;
}
body.pixel-theme .global-nav__group { position: relative; }
body.pixel-theme .global-nav__menu {
  position: absolute;
  top: calc(100% + 7px);
  left: 0;
  width: 230px;
  padding: 6px;
  border: 2px solid var(--px-edge-lo);
  background: #080f24;
  box-shadow: inset 2px 2px 0 #314776, inset -2px -2px 0 var(--px-edge-lo), 5px 5px 0 rgba(0, 0, 0, .36);
}
body.pixel-theme .global-nav__menu a { display: block; padding: 9px 10px; color: #d7dced; }
body.pixel-theme .global-nav__menu a + a { border-top: 1px solid #22345b; }
body.pixel-theme .global-nav__menu a:hover,
body.pixel-theme .global-nav__menu a.is-active { background: #18254d; color: #fff; }
body.pixel-theme .global-nav__menu strong,
body.pixel-theme .global-nav__menu small { display: block; }
body.pixel-theme .global-nav__menu strong { font: 900 11px/1.3 var(--px-font); }
body.pixel-theme .global-nav__menu small { margin-top: 3px; color: #8491af; font: 500 9px/1.35 var(--px-font); }
body.pixel-theme .global-nav__context {
  margin-left: auto;
  color: #70809f;
  font: 700 9px/1 var(--px-font);
  white-space: nowrap;
}
@media (max-width: 760px) {
  body.pixel-theme .global-nav { align-items: flex-start; overflow-x: auto; }
  body.pixel-theme .global-nav__brand span:last-child,
  body.pixel-theme .global-nav__context { display: none; }
  body.pixel-theme .global-nav__brand { padding-right: 8px; }
  body.pixel-theme .global-nav__menu { position: fixed; top: auto; left: 10px; right: 10px; width: auto; }
}

/* Shell / page headers */
body.pixel-theme .page > header,
body.pixel-theme .page > .site-head,
body.pixel-theme .page > .topbar,
body.pixel-theme > header {
  position: relative;
  padding: 12px 14px;
  background: rgba(5, 8, 23, .92) !important;
  border: 2px solid var(--px-edge-lo) !important;
  border-radius: 0 !important;
  box-shadow: inset 2px 2px 0 #314776, inset -2px -2px 0 var(--px-edge-lo), 4px 4px 0 rgba(0, 0, 0, .34) !important;
}
body.pixel-theme .brand,
body.pixel-theme .page > .site-head { min-width: 0; }
body.pixel-theme .mark {
  display: grid;
  place-items: center;
  flex: none;
  width: 48px !important;
  height: 48px !important;
  border: 2px solid var(--px-edge-lo) !important;
  border-radius: 0 !important;
  background: var(--px-lime) !important;
  color: #071006 !important;
  box-shadow: inset 2px 2px 0 #efffc2, inset -2px -2px 0 #528c10, 3px 3px 0 var(--px-edge-lo) !important;
  font: 900 14px/1 var(--px-font) !important;
  letter-spacing: -1px;
  text-transform: uppercase;
}
body.pixel-theme h1,
body.pixel-theme h2,
body.pixel-theme .title,
body.pixel-theme .panel-title,
body.pixel-theme .filter-title,
body.pixel-theme .dir-name {
  color: #fff;
  font-family: var(--px-font) !important;
  font-weight: 900 !important;
  letter-spacing: .35px !important;
  text-shadow: 1px 1px 0 #050711;
}
body.pixel-theme h1 { text-shadow: 2px 0 #263b70; }
body.pixel-theme .eyebrow {
  color: var(--px-lime) !important;
  font: 800 10px/1.3 var(--px-font) !important;
  letter-spacing: 1.6px !important;
}
body.pixel-theme .sub,
body.pixel-theme .note,
body.pixel-theme .mini,
body.pixel-theme .dim,
body.pixel-theme .intro,
body.pixel-theme .panel-note,
body.pixel-theme .card-meta,
body.pixel-theme .foot,
body.pixel-theme .page-foot { color: var(--px-muted) !important; }

/* Navigation and controls */
body.pixel-theme .nav,
body.pixel-theme .site-nav {
  flex-wrap: nowrap !important;
  overflow-x: auto;
  max-width: 100%;
  padding: 8px !important;
  border: 2px solid var(--px-edge-lo) !important;
  border-radius: 0 !important;
  background: rgba(5, 8, 23, .9) !important;
  box-shadow: inset 2px 2px 0 #314776, inset -2px -2px 0 var(--px-edge-lo) !important;
  scrollbar-color: #52638d #070d20;
}
body.pixel-theme .site-nav { justify-content: flex-start !important; }
body.pixel-theme .site-head .site-nav { flex-wrap: wrap !important; overflow: visible; }
body.pixel-theme .nav > *, body.pixel-theme .site-nav > * { flex: none; }
body.pixel-theme .nav a,
body.pixel-theme .site-nav a,
body.pixel-theme .nav button,
body.pixel-theme .btn,
body.pixel-theme .ctrl,
body.pixel-theme .mini-btn,
body.pixel-theme .png-btn,
body.pixel-theme .icon-btn,
body.pixel-theme .seg-btn,
body.pixel-theme .tab,
body.pixel-theme .chip {
  min-height: 30px;
  padding: 5px 9px;
  border: 2px solid var(--px-edge-lo) !important;
  border-radius: 0 !important;
  background: #151f40 !important;
  color: #d7dced !important;
  box-shadow: inset 1px 1px 0 var(--px-edge-hi), inset -1px -1px 0 var(--px-edge-lo) !important;
  text-decoration: none;
  font: 800 10px/16px var(--px-font) !important;
}
body.pixel-theme .nav a::before,
body.pixel-theme .site-nav a::before { content: "▪"; margin-right: 6px; color: #68789e; }
body.pixel-theme .nav a:hover,
body.pixel-theme .site-nav a:hover,
body.pixel-theme .nav button:hover,
body.pixel-theme .btn:hover,
body.pixel-theme .ctrl:hover,
body.pixel-theme .mini-btn:hover,
body.pixel-theme .png-btn:hover,
body.pixel-theme .tab:hover,
body.pixel-theme .chip:hover { background: #1d2b57 !important; color: #fff !important; }
body.pixel-theme .nav .active,
body.pixel-theme .site-nav .active,
body.pixel-theme .btn.active,
body.pixel-theme .ctrl.active,
body.pixel-theme .mini-btn.active,
body.pixel-theme .seg-btn.active,
body.pixel-theme .tab.active,
body.pixel-theme .chip.active,
body.pixel-theme #reload,
body.pixel-theme #refresh.btn {
  background: var(--px-lime) !important;
  color: #071006 !important;
  box-shadow: inset 2px 2px 0 #efffc2, inset -2px -2px 0 #528c10 !important;
}
body.pixel-theme .nav .active::before,
body.pixel-theme .site-nav .active::before { color: #071006; }
body.pixel-theme .nav a:active,
body.pixel-theme .site-nav a:active,
body.pixel-theme button:active { transform: translate(2px, 2px); }
body.pixel-theme .pill,
body.pixel-theme .status {
  border: 2px solid var(--px-edge-lo) !important;
  border-radius: 0 !important;
  background: #101a38 !important;
  color: #d7dced !important;
  box-shadow: inset 1px 1px 0 var(--px-edge-hi), inset -1px -1px 0 var(--px-edge-lo) !important;
}
body.pixel-theme .dot,
body.pixel-theme .status-dot {
  width: 8px;
  height: 8px;
  border-radius: 0 !important;
  background: var(--px-amber);
  box-shadow: 0 0 0 1px #02040c, 0 0 0 3px rgba(255, 209, 102, .12) !important;
}
body.pixel-theme .dot.ok,
body.pixel-theme .status.ready .status-dot { background: var(--px-green) !important; }

/* Cards, panels and title bars */
body.pixel-theme .kpi,
body.pixel-theme .panel,
body.pixel-theme .chart-card,
body.pixel-theme .method-card,
body.pixel-theme .search-panel,
body.pixel-theme .metric-card,
body.pixel-theme .filters,
body.pixel-theme .results,
body.pixel-theme .directory,
body.pixel-theme .dir-card,
body.pixel-theme .quick-card,
body.pixel-theme .mini,
body.pixel-theme .window-card,
body.pixel-theme .open-card,
body.pixel-theme .capture,
body.pixel-theme .callout,
body.pixel-theme .formula,
body.pixel-theme .stat,
body.pixel-theme .block {
  min-width: 0;
  border: 2px solid var(--px-edge-lo) !important;
  border-radius: 0 !important;
  background: rgba(10, 17, 40, .97) !important;
  color: var(--px-ink) !important;
  box-shadow: inset 2px 2px 0 var(--px-panel-hi), inset -2px -2px 0 var(--px-edge-lo), 3px 3px 0 rgba(0, 0, 0, .34) !important;
}
body.pixel-theme .kpi,
body.pixel-theme .metric-card { position: relative; }
body.pixel-theme .kpi::before,
body.pixel-theme .metric-card::before {
  content: "";
  position: absolute;
  left: 4px;
  right: 4px;
  top: 4px;
  height: 3px;
  background: linear-gradient(90deg, var(--px-lime) 0 18%, #314776 18% 100%);
}
body.pixel-theme .kpi .label,
body.pixel-theme .kpi-label,
body.pixel-theme .metric-card .label {
  color: #b7c0d8 !important;
  font: 800 10px/1.25 var(--px-font) !important;
  letter-spacing: .6px;
  text-transform: uppercase;
}
body.pixel-theme .kpi .value,
body.pixel-theme .kpi-value,
body.pixel-theme .metric-card .value { color: #fff !important; font-family: var(--px-font) !important; font-weight: 900 !important; }
body.pixel-theme .panel-head,
body.pixel-theme .filter-head,
body.pixel-theme .results-head,
body.pixel-theme .directory-head,
body.pixel-theme .card-head,
body.pixel-theme .matrix-head {
  border-bottom: 2px solid var(--px-edge-lo) !important;
  border-radius: 0 !important;
  background: linear-gradient(90deg, #263f83 0, #182a5b 62%, #101b3d 100%) !important;
  box-shadow: inset 0 1px 0 #4d63a0 !important;
}
body.pixel-theme .chart-card > .card-head { margin: -22px -24px 15px; padding: 12px 16px; }
body.pixel-theme .method-card h2 { margin: -25px -28px 15px !important; padding: 12px 16px; background: linear-gradient(90deg, #263f83, #101b3d); border-bottom: 2px solid #050711; }

/* Data surfaces */
body.pixel-theme .table-wrap { width: 100%; max-width: 100%; overflow: auto; background: #070d20 !important; scrollbar-color: #52638d #070d20; }
body.pixel-theme table { color: var(--px-ink); font-family: var(--px-font); font-variant-numeric: tabular-nums; }
body.pixel-theme th {
  background: #18264d !important;
  color: #b5bed5 !important;
  border-color: #050711 !important;
  font: 800 9px/1.2 var(--px-font) !important;
  letter-spacing: .35px;
}
body.pixel-theme td { border-color: #1c2a4e !important; }
body.pixel-theme tbody tr:nth-child(even) { background: rgba(27, 39, 76, .28); }
body.pixel-theme tbody tr:hover { background: #1a2a54 !important; }
body.pixel-theme .chart,
body.pixel-theme .chart-shell,
body.pixel-theme .chart-wrap,
body.pixel-theme .map-shell,
body.pixel-theme .matrix {
  min-width: 0;
  border-radius: 0 !important;
  background: #070d20 !important;
}
body.pixel-theme .chart > svg,
body.pixel-theme .chart svg,
body.pixel-theme svg.chart { image-rendering: pixelated; }
body.pixel-theme .chart svg rect[fill="#fff"],
body.pixel-theme .chart svg rect[fill="#ffffff"] { fill: #070d20 !important; }
body.pixel-theme .chart svg line[stroke="#ecebe5"],
body.pixel-theme .chart svg line[stroke="#f2f1ed"] { stroke: #24345d !important; }
body.pixel-theme .axis-label { fill: #8996b5 !important; }
body.pixel-theme .chart-title-note { fill: #9ca8c7 !important; }
body.pixel-theme .tip,
body.pixel-theme .chart-tip {
  border: 2px solid #050711 !important;
  border-radius: 0 !important;
  background: rgba(7, 13, 32, .98) !important;
  color: var(--px-ink) !important;
  box-shadow: 4px 4px 0 rgba(0, 0, 0, .45) !important;
}
body.pixel-theme .badge,
body.pixel-theme .tag,
body.pixel-theme .seg-item,
body.pixel-theme .legend-pill,
body.pixel-theme .window-pill {
  border: 1px solid #40527d !important;
  border-radius: 0 !important;
  background: #152142 !important;
  color: #d7dced !important;
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .1) !important;
}
body.pixel-theme .bar { border-radius: 0 !important; background: #0a1128 !important; border-color: #050711 !important; }
body.pixel-theme .bar > i, body.pixel-theme .fill { border-radius: 0 !important; }

/* Inputs / filters / GPU directory */
body.pixel-theme .input,
body.pixel-theme .select,
body.pixel-theme input:not([type="checkbox"]):not([type="radio"]),
body.pixel-theme select {
  border: 2px solid #050711 !important;
  border-radius: 0 !important;
  background: #0a1128 !important;
  color: #f4f1dc !important;
  box-shadow: inset 2px 2px 0 #02040c, inset -1px -1px 0 #40527d !important;
}
body.pixel-theme input::placeholder { color: #7481a3; }
body.pixel-theme .filter-body,
body.pixel-theme .tabs,
body.pixel-theme .dir-grid { background: rgba(7, 13, 32, .55); }
body.pixel-theme .main-grid > * { min-width: 0 !important; }
body.pixel-theme .filters,
body.pixel-theme .results,
body.pixel-theme .directory { width: 100%; max-width: 100%; }
body.pixel-theme .check,
body.pixel-theme .dir-desc,
body.pixel-theme .filter-title { color: #c6cee2 !important; }
body.pixel-theme .price { color: var(--px-green) !important; }
body.pixel-theme .launch { color: var(--px-cyan) !important; }
body.pixel-theme .quick-card.active { background: #172a35 !important; border-color: var(--px-lime) !important; }

/* Research page and guide */
body.pixel-theme .seg-item { color: var(--px-muted) !important; }
body.pixel-theme .metric-note { border-color: #24345d !important; }
body.pixel-theme .metric-note dd { color: #b8c2d9 !important; }
body.pixel-theme .page-foot a, body.pixel-theme .sub a { color: var(--px-cyan) !important; }
body.pixel-theme .export-stage { background: var(--px-void) !important; }
body.pixel-theme .hero:not(.hero-grid) { color: var(--px-ink); }

/* Grafana wrapper */
body.pixel-theme > header { min-height: 58px; height: auto !important; overflow-x: auto; white-space: nowrap; }
body.pixel-theme > header h1 { flex: none; }
body.pixel-theme > header a {
  flex: none;
  padding: 5px 8px;
  border: 1px solid #334776;
  background: #111b38;
  color: #c8d0e3 !important;
  text-decoration: none;
}
body.pixel-theme > header a.active { background: var(--px-lime); color: #071006 !important; }
body.pixel-theme #frame { height: calc(100% - 58px) !important; border: 2px solid #050711 !important; background: #070d20; }

@media (max-width: 1120px) {
  body.pixel-theme .page > header,
  body.pixel-theme .page > .topbar { grid-template-columns: 1fr !important; }
  body.pixel-theme .actions,
  body.pixel-theme .top-actions { justify-content: flex-start !important; }
  body.pixel-theme .hero,
  body.pixel-theme .main-grid { grid-template-columns: minmax(0, 1fr) !important; }
  body.pixel-theme .filters { position: static !important; }
}

@media (max-width: 700px) {
  body.pixel-theme .page { width: calc(100vw - 16px) !important; padding-top: 8px !important; }
  body.pixel-theme .page > header,
  body.pixel-theme .page > .site-head,
  body.pixel-theme .page > .topbar { align-items: flex-start !important; flex-direction: column !important; padding: 10px !important; }
  body.pixel-theme .site-head { display: block !important; }
  body.pixel-theme .site-nav { margin-top: 12px; }
  body.pixel-theme .mark { width: 42px !important; height: 42px !important; }
  body.pixel-theme h1 { font-size: 18px !important; }
  body.pixel-theme .chart-card { padding: 17px 14px 14px !important; }
  body.pixel-theme .chart-card > .card-head { margin: -17px -14px 14px; padding: 11px 12px; }
  body.pixel-theme .method-card { padding: 20px 17px !important; }
  body.pixel-theme .method-card h2 { margin: -20px -17px 15px !important; }
  body.pixel-theme .search-row,
  body.pixel-theme .quick,
  body.pixel-theme .metrics { grid-template-columns: 1fr !important; }
  body.pixel-theme > header #hint { display: none; }
}

@media (prefers-reduced-motion: no-preference) {
  body.pixel-theme .dot.ok,
  body.pixel-theme .status.ready .status-dot { animation: pxPulse 1.6s steps(2, end) infinite; }
  @keyframes pxPulse { 50% { opacity: .45; } }
}