/* Visual system B ("The instrument"), applied site-wide on top of Material. */
:root, [data-md-color-scheme="slate"] {
  --gx-bg: #0b0b0c; --gx-surface: #0f0f11; --gx-fg: #ededed; --gx-dim: #8a8a8f;
  --gx-line: #1f1f22; --gx-line2: #2a2a2e; --gx-acc: #ff6b35; --gx-ok: #4ade80;

  --md-default-bg-color: var(--gx-bg);
  --md-default-fg-color: var(--gx-fg);
  --md-default-fg-color--light: var(--gx-dim);
  --md-default-fg-color--lighter: #5c5c62;
  --md-default-fg-color--lightest: var(--gx-line2);
  --md-primary-fg-color: var(--gx-bg);
  --md-primary-bg-color: var(--gx-fg);
  --md-accent-fg-color: var(--gx-acc);
  --md-typeset-a-color: var(--gx-acc);
  --md-code-bg-color: var(--gx-surface);
  --md-code-fg-color: #d6d6da;
  --md-footer-bg-color: var(--gx-bg);
  --md-footer-fg-color: var(--gx-fg);
  --md-text-font: "Geist";
  --md-code-font: "Geist Mono";
  --md-typeset-table-color: var(--gx-line2);
}

body { font-feature-settings: "ss01"; -webkit-font-smoothing: antialiased; }
.gx-mono { font-family: "Geist Mono", ui-monospace, monospace; }
.gx-dim { color: var(--gx-dim); }

/* Header: flat, hairline, no colour block */
.md-header { background: var(--gx-bg); border-bottom: 1px solid var(--gx-line2); box-shadow: none; }
.md-header__title { font-weight: 600; letter-spacing: -.01em; }
.md-tabs { background: var(--gx-bg); border-bottom: 1px solid var(--gx-line); }
.md-tabs__link { font-family: "Geist Mono", monospace; font-size: .62rem; text-transform: lowercase; opacity: .7; }
.md-tabs__link--active, .md-tabs__link:hover { opacity: 1; color: var(--gx-fg); }

/* Typography */
.md-typeset { font-size: .82rem; line-height: 1.65; }
.md-typeset h1 { font-weight: 600; letter-spacing: -.035em; color: var(--gx-fg); }
.md-typeset h2 { font-weight: 600; letter-spacing: -.02em; margin-top: 2.2em; }
.md-typeset h3 { font-weight: 600; letter-spacing: -.01em; }
.md-typeset a { text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--gx-acc) 45%, transparent); }
.md-typeset a:hover { border-bottom-color: var(--gx-acc); }
.md-typeset code { border-radius: 0; }

/* Tables: datasheet look */
.md-typeset table:not([class]) { border: 1px solid var(--gx-line2); border-radius: 0; font-size: .74rem; box-shadow: none; }
.md-typeset table:not([class]) th { background: var(--gx-surface); font-family: "Geist Mono", monospace; font-weight: 500;
  text-transform: uppercase; letter-spacing: .06em; font-size: .62rem; color: var(--gx-dim); }
.md-typeset table:not([class]) td, .md-typeset table:not([class]) th { border-top: 1px solid var(--gx-line2); }

/* Admonitions and details */
.md-typeset .admonition, .md-typeset details { border-radius: 0; border: 1px solid var(--gx-line2); border-left: 2px solid var(--gx-acc);
  background: var(--gx-surface); box-shadow: none; font-size: .78rem; }
.md-typeset .admonition-title, .md-typeset summary { background: transparent !important; font-weight: 600; }
.md-typeset .admonition-title::before, .md-typeset summary::before { background-color: var(--gx-acc); }

/* Buttons */
.gx-btn, .md-typeset .md-button { display: inline-flex; align-items: center; gap: .4rem; border-radius: 0; padding: .55rem .9rem;
  font: 500 .72rem "Geist", sans-serif; border: 1px solid var(--gx-line2); color: var(--gx-fg); background: #121214; }
.gx-btn--primary, .md-typeset .md-button--primary { background: var(--gx-fg); color: var(--gx-bg); border-color: var(--gx-fg); }
.md-typeset .md-button:hover { border-color: var(--gx-acc); color: var(--gx-fg); background: #121214; }
.md-typeset .md-button--primary:hover { background: var(--gx-fg); color: var(--gx-bg); }

/* Panels and datasheet cells */
.gx-panel { border: 1px solid var(--gx-line2); background: var(--gx-surface); }
.gx-cell { border: 1px solid var(--gx-line2); padding: 1rem; background: var(--gx-surface); }

/* Footer */
.gx-footer { border-top: 1px solid var(--gx-line2); }
.gx-footer__inner { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; padding: 1.2rem .8rem; }
.gx-footer__who { display: flex; flex-direction: column; gap: .1rem; }
.gx-footer__name { font-weight: 600; }
.gx-footer__links { display: flex; gap: 1.2rem; font-size: .7rem; }
.gx-footer__links a { color: var(--gx-fg); }
.gx-footer__links a:hover { color: var(--gx-acc); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-delay: 0ms !important; transition-duration: .01ms !important; }
}

/* Charts */
.gx-figure { margin: 1.4rem 0 .6rem; padding: 1.1rem 1.2rem .8rem; border: 1px solid var(--gx-line2); background: var(--gx-surface); }
.gx-chart { display: block; max-width: 100%; height: auto; }
.md-typeset .gx-table { font-size: .68rem; }

/* Under the hood */
.gx-lanes-fig figcaption { color: var(--gx-dim); font-size: .7rem; margin-top: .6rem; }
.gx-records { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--gx-line2); border: 1px solid var(--gx-line2); margin: 1rem 0 .4rem; }
.gx-record { background: var(--gx-surface); padding: 1rem 1.1rem; min-width: 0; }
.gx-record__hd { display: flex; justify-content: space-between; gap: .6rem; font: 500 .6rem "Geist Mono", monospace; text-transform: uppercase; letter-spacing: .08em; color: var(--gx-dim); }
.gx-record__hd code { text-transform: none; letter-spacing: 0; font-size: .6rem; background: none; padding: 0; color: var(--gx-dim); }
.gx-record__title { font: 600 .9rem "Geist Mono", monospace; margin: .5rem 0 .2rem; overflow-wrap: anywhere; }
.gx-small { font-size: .66rem; }
.gx-sub { font: .64rem "Geist Mono", monospace; color: var(--gx-dim); margin: .7rem 0 .4rem; }
.gx-kv { display: grid; grid-template-columns: 1fr 1fr; gap: .1rem 1rem; margin: .7rem 0; font-size: .68rem; }
.gx-kv div { display: flex; justify-content: space-between; gap: .5rem; border-bottom: 1px solid var(--gx-line); padding: .2rem 0; }
.gx-kv dt { color: var(--gx-dim); } .gx-kv dd { margin: 0; font-family: "Geist Mono", monospace; text-align: right; }
.gx-kv--inline { grid-template-columns: 1fr; }
.gx-legend { display: flex; align-items: center; gap: .5rem; font-size: .62rem; color: var(--gx-dim); margin-bottom: .2rem; }
.gx-l { display: inline-block; width: 14px; height: 2px; } .gx-l--loss { background: #5c5c62; } .gx-l--eval { background: #e0622c; height: 3px; margin-left: .6rem; }
.gx-span { display: grid; grid-template-columns: 9rem 1fr 4rem; gap: .6rem; align-items: center; font: .66rem "Geist Mono", monospace; }
.gx-span__bar { position: relative; height: 8px; background: var(--gx-line); }
.gx-span__bar i { position: absolute; top: 0; bottom: 0; background: var(--gx-acc); }
.gx-span__ms { text-align: right; color: var(--gx-dim); }
@media (max-width: 760px) { .gx-records { grid-template-columns: 1fr; } .gx-kv { grid-template-columns: 1fr; } }

/* ===================== Home ===================== */
.gx-home { max-width: 61rem; margin: 0 auto; padding: 0 .8rem 2rem; }
.gx-home .md-typeset, .gx-home { font-size: .8rem; }
.gx-statusbar { display: flex; justify-content: space-between; gap: .8rem; flex-wrap: wrap; padding: .55rem 0;
  border-bottom: 1px solid var(--gx-line2); font: .6rem "Geist Mono", monospace; text-transform: uppercase; letter-spacing: .06em; color: var(--gx-dim); }
.gx-api::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #55555b; margin-right: .45rem; vertical-align: 1px; }
.gx-api[data-state="online"] { color: var(--gx-ok); }
.gx-api[data-state="online"]::before { background: var(--gx-ok); box-shadow: 0 0 8px var(--gx-ok); }
.gx-hero { display: grid; grid-template-columns: 5fr 7fr; gap: 2rem; padding: 2.6rem 0 2.2rem; align-items: start;
  background-image: linear-gradient(var(--gx-line) 1px, transparent 1px), linear-gradient(90deg, var(--gx-line) 1px, transparent 1px);
  background-size: 100% 3.2rem, calc(100% / 12) 100%; }
.gx-id { font: .58rem/1.8 "Geist Mono", monospace; color: var(--gx-dim); margin-bottom: 1.3rem; }
.gx-id b { color: var(--gx-fg); font-weight: 500; }
.md-typeset .gx-h1, .gx-h1 { font-size: clamp(2.1rem, 5.2vw, 3.7rem); line-height: .98; letter-spacing: -.045em; font-weight: 600; margin: 0 0 1.1rem; color: var(--gx-fg); }
.gx-h1 span { color: var(--gx-acc); }
.gx-lede { font-size: .9rem; line-height: 1.55; color: #c4c4c8; max-width: 28em; margin: 0 0 1.4rem; }
.gx-lede--sm { font-size: .8rem; max-width: 40em; }
.gx-acts { display: flex; gap: .5rem; flex-wrap: wrap; }
.gx-home a.gx-btn { text-decoration: none; border-bottom: 1px solid var(--gx-line2); }
.gx-home a.gx-btn--primary { border-color: var(--gx-fg); color: var(--gx-bg); }
.gx-home a.gx-btn:hover { border-color: var(--gx-acc); }
.gx-kbd { font: .55rem "Geist Mono", monospace; color: var(--gx-dim); }
/* trace panel */
.gx-trace { border: 1px solid var(--gx-line2); background: var(--gx-surface); min-width: 0; }
.gx-trace__hd, .gx-trace__ft { display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: .5rem .7rem;
  font: .6rem "Geist Mono", monospace; color: var(--gx-dim); }
.gx-trace__hd { border-bottom: 1px solid var(--gx-line2); } .gx-trace__ft { border-top: 1px solid var(--gx-line2); flex-wrap: wrap; }
.gx-run { font: inherit; color: var(--gx-acc); background: none; border: 1px solid #3a2a22; padding: .15rem .55rem; cursor: pointer; }
.gx-run[disabled] { color: #55555b; border-color: var(--gx-line2); cursor: default; }
.gx-trace__in { padding: .7rem; border-bottom: 1px solid var(--gx-line2); font-size: .72rem; line-height: 1.65; color: #d6d6da; }
.gx-trace__in mark { color: #fff; background: rgba(255, 107, 53, 0); border-radius: 2px; animation: gx-hl .5s forwards; animation-delay: 1.6s; }
@keyframes gx-hl { to { background: rgba(255, 107, 53, .2); } }
.gx-step { display: grid; grid-template-columns: 1.4rem 1fr 5.5rem 6.5rem; gap: .5rem; align-items: center; padding: .38rem .7rem;
  border-bottom: 1px solid var(--gx-line); font: .62rem "Geist Mono", monospace; color: #d6d6da; opacity: .3; animation: gx-in .3s forwards; animation-delay: calc(var(--i) * .3s); }
@keyframes gx-in { to { opacity: 1; } }
.gx-step__ix { color: #55555b; } .gx-step__v { text-align: right; color: var(--gx-dim); }
.gx-step__bar { height: 4px; background: #1c1c20; position: relative; }
.gx-step__bar i { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--gx-acc); animation: gx-bar .6s ease forwards; animation-delay: calc(var(--i) * .3s); }
@keyframes gx-bar { to { width: var(--w); } }
.md-typeset pre.gx-json, pre.gx-json { margin: 0; padding: .7rem; background: none; font: .66rem/1.7 "Geist Mono", monospace; white-space: pre-wrap; color: #e7e7ea; }
.gx-ln { opacity: 0; animation: gx-in .3s forwards; animation-delay: calc(1.3s + var(--i) * .18s); }
.gx-k { color: #9aa0ff; } .gx-n { color: #ffcf70; } .gx-s { color: #e7e7ea; } .gx-nul { color: var(--gx-acc); font-weight: 600; } .gx-c { color: #6b6b72; }
/* spec sheet */
.gx-spec { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--gx-line2); border-left: 1px solid var(--gx-line2); margin-top: .4rem; }
.gx-spec__cell { border-right: 1px solid var(--gx-line2); border-bottom: 1px solid var(--gx-line2); padding: 1rem .9rem; }
.gx-spec__k { font: .55rem "Geist Mono", monospace; color: var(--gx-dim); text-transform: uppercase; letter-spacing: .08em; }
.gx-spec__v { font-size: 1.7rem; font-weight: 600; letter-spacing: -.03em; margin: .35rem 0 .2rem; }
.gx-spec__d { font: .58rem/1.5 "Geist Mono", monospace; color: #6b6b72; }
.gx-note { font: .58rem "Geist Mono", monospace; color: #6b6b72; margin: .5rem 0 0; }
/* sections */
.gx-home section { padding: 2.4rem 0 0; }
.md-typeset .gx-h2, .gx-h2 { font-size: 1.15rem; letter-spacing: -.02em; font-weight: 600; margin: 0 0 .8rem; color: var(--gx-fg); }
.gx-built__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--gx-line2); border: 1px solid var(--gx-line2); }
.gx-home a.gx-built__item { display: flex; flex-direction: column; gap: .35rem; padding: 1rem; background: var(--gx-surface); color: var(--gx-fg); border: 0; text-decoration: none; }
.gx-home a.gx-built__item:hover { background: #141417; }
.gx-built__ix { font: .58rem "Geist Mono", monospace; color: var(--gx-acc); }
.gx-built__item span:last-child { color: var(--gx-dim); font-size: .72rem; line-height: 1.5; }
.gx-teaser { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.gx-teaser p { color: var(--gx-dim); margin: 0; max-width: 38em; }
.gx-rec { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--gx-line2); border: 1px solid var(--gx-line2); }
.gx-rec__cell { background: var(--gx-surface); padding: .2rem 1rem; font-size: .74rem; }
.gx-contact { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; padding-bottom: 1rem !important; border-top: 1px solid var(--gx-line2); margin-top: 2.4rem; }
.gx-contact__q { font-size: clamp(1.2rem, 3vw, 1.8rem); font-weight: 600; letter-spacing: -.03em; line-height: 1.15; max-width: 16em; }
.gx-contact__q span { color: var(--gx-acc); }
.gx-contact__ls { font: .7rem "Geist Mono", monospace; display: flex; gap: 1rem; }
@media (max-width: 860px) {
  .gx-hero { grid-template-columns: 1fr; gap: 1.4rem; padding-top: 1.6rem; }
  .gx-spec { grid-template-columns: repeat(2, 1fr); }
  .gx-built__grid, .gx-rec { grid-template-columns: 1fr; }
  .gx-step { grid-template-columns: 1.4rem 1fr 6.5rem; } .gx-step__bar { display: none; }
}
.md-typeset figure.gx-figure { display: block; width: auto; max-width: none; text-align: left; }
.gx-home a.gx-btn { color: var(--gx-fg); }
.gx-home a.gx-btn.gx-btn--primary { color: var(--gx-bg); }
.gx-step { grid-template-columns: 1.4rem 1fr 4.5rem 8rem; }
@media (max-width: 860px) { .gx-step { grid-template-columns: 1.4rem 1fr 8rem; } }

.md-typeset a:not(.gx-btn):not(.md-button):not(.gx-built__item), .gx-contact__ls a { color: var(--gx-acc); }
.gx-record .gx-kv { grid-template-columns: 1fr; }
.gx-span { grid-template-columns: 1fr auto; row-gap: .3rem; margin: .2rem 0 .6rem; }
.gx-span__bar { grid-column: 1 / -1; grid-row: 2; height: 10px; }
.gx-step { grid-template-columns: 1.4rem 1fr auto; }
@media (max-width: 860px) { .gx-step { grid-template-columns: 1.4rem 1fr auto; } }
/* Charts stay legible on phones: the figure scrolls instead of shrinking the text */
.gx-figure { overflow-x: auto; }
.gx-figure .gx-chart { min-width: 620px; }
.gx-figure .gx-lanes { min-width: 620px; }
.gx-home section.gx-recognition { padding-top: 1.6rem; }

/* Stack strip on the home page */
.gx-stack__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--gx-line2); border: 1px solid var(--gx-line2); }
.gx-tech { display: flex; flex-direction: column; gap: .3rem; padding: .9rem .9rem .8rem; background: var(--gx-surface); min-width: 0; }
.gx-tech .twemoji, .gx-tech__word { height: 1.6rem; display: flex; align-items: center; color: #c9c9ce; transition: color .2s; }
.gx-tech .twemoji svg { width: 1.6rem; height: 1.6rem; fill: currentColor; }
.gx-tech__word { font: 600 .82rem "Geist Mono", monospace; letter-spacing: -.02em; }
.gx-tech:hover .twemoji { color: var(--brand, var(--gx-acc)); }
.gx-tech:hover .gx-tech__word { color: var(--gx-acc); }
.gx-tech b { font-size: .74rem; font-weight: 600; }
.gx-tech span:last-child { font: .58rem/1.4 "Geist Mono", monospace; color: var(--gx-dim); }
@media (max-width: 860px) { .gx-stack__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 520px) { .gx-stack__grid { grid-template-columns: repeat(2, 1fr); } }
.gx-tech__word { width: 1.6rem; justify-content: center; border: 1.5px solid currentColor; font-size: .62rem; }
