:root {
  --fpv-orange: #e34d36;
  --fpv-orange-bright: #ef6a53;
  --fpv-ink: #111317;
  --fpv-muted: #6f747d;
  --fpv-chart-qualifying: #6f747d;
  --fpv-chart-grid: rgba(127, 127, 127, .18);
  --fpv-chart-midfield: rgba(127, 127, 127, .5);
  --fpv-chart-kidce: #e34d36;
  --fpv-chart-maxdax: #1976c9;
  --fpv-chart-bajo: #238a62;
  --fpv-chart-zelaus: #8e57b5;
}

[data-md-color-scheme="fpv-light"] {
  --md-primary-fg-color: #15171b;
  --md-primary-bg-color: #fff;
  --md-accent-fg-color: var(--fpv-orange);
  --md-default-bg-color: #f8f8f6;
  --md-default-fg-color: var(--fpv-ink);
}

/* Dark mode builds on Material's slate scheme so tables, admonitions and code keep dark defaults. */
[data-md-color-scheme="slate"] {
  --md-hue: 220;
  --md-primary-fg-color: #111317;
  --md-primary-bg-color: #fff;
  --md-accent-fg-color: var(--fpv-orange-bright);
  --md-default-bg-color: #101216;
  --md-default-fg-color: #e7e8ea;
  --md-default-fg-color--light: #a7abb2;
  --md-code-bg-color: #191c21;
  --md-typeset-a-color: var(--fpv-orange-bright);
  --fpv-chart-qualifying: #a7abb2;
}
[data-md-color-scheme="slate"] .md-typeset .md-button:not(.md-button--primary) { border-color: var(--md-default-fg-color--light); color: var(--md-default-fg-color); }
[data-md-color-scheme="slate"] .md-typeset .md-button:not(.md-button--primary):hover { border-color: var(--fpv-orange-bright); color: var(--fpv-orange-bright); }
/* Details inside the tool's dark chart panel keep the panel's light text in both schemes. */
#fpv-nkon-tool .compare details { color: inherit; }
/* The NKON tool brings its own dark palette (tools/nkon-cell-selector/dist/style.css). */
[data-md-color-scheme="slate"] #fpv-nkon-tool { --md-admonition-fg-color: inherit; --md-admonition-bg-color: transparent; color-scheme: dark; }

.md-header { border-bottom: 1px solid rgba(127,127,127,.18); box-shadow: none; }
.md-tabs { background: var(--md-primary-fg-color); }
.md-header__button.md-logo img { height: 1.8rem; width: auto; }
.md-main__inner { margin-top: 1.2rem; }
.md-content__inner { padding-bottom: 3rem; }
.md-typeset h1, .md-typeset h2, .md-typeset h3 { font-weight: 750; letter-spacing: -.035em; }
.md-typeset h1 { color: var(--md-default-fg-color); }
.md-typeset a { transition: color .18s ease; }
.md-typeset .md-button { border-radius: 99px; border-width: 1px; font-weight: 700; padding: .65em 1.25em; }
.md-typeset .md-button--primary { background: var(--fpv-orange); border-color: var(--fpv-orange); color: white; }
.md-typeset .md-button--primary:hover { background: var(--fpv-orange-bright); border-color: var(--fpv-orange-bright); }

.hero { align-items: center; display: grid; gap: clamp(2rem, 6vw, 6rem); grid-template-columns: 1.05fr .95fr; min-height: 67vh; padding: 3rem 0 5rem; }
.hero__copy h1 { font-size: clamp(2.9rem, 7vw, 5.9rem); line-height: .93; margin: .22em 0 .3em; max-width: 9ch; }
.hero__copy h1 span { color: var(--fpv-orange); }
.hero__copy p { color: var(--md-default-fg-color--light); font-size: clamp(1rem, 2vw, 1.25rem); line-height: 1.6; max-width: 34rem; }
.eyebrow { color: var(--fpv-orange); font-size: .68rem; font-weight: 800; letter-spacing: .22em; }
.hero__actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.8rem; }
.hero__visual { filter: drop-shadow(0 28px 35px rgba(0,0,0,.22)); transform: rotate(-3deg); }
.hero__visual img { width: 100%; }
.section-heading { margin: 1rem 0 1.6rem; }
.section-heading h2 { font-size: clamp(1.8rem, 4vw, 2.8rem); margin: .2rem 0; }
.feature-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
.md-typeset .feature-card { background: var(--md-code-bg-color, #fff); border: 1px solid rgba(127,127,127,.18); border-radius: 1rem; color: var(--md-default-fg-color); display: flex; flex-direction: column; min-height: 15rem; padding: 1.4rem; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.md-typeset .feature-card:hover { border-color: var(--fpv-orange); box-shadow: 0 16px 32px rgba(0,0,0,.08); transform: translateY(-4px); }
.feature-card__number { color: var(--fpv-orange); font-family: var(--md-code-font-family); font-size: .7rem; }
.feature-card h3 { font-size: 1.25rem; margin: 1.3rem 0 .4rem; }
.feature-card__title { color: var(--md-default-fg-color); }
.feature-card p { color: var(--md-default-fg-color--light); font-size: .78rem; flex: 1; }
.feature-card__link { color: var(--fpv-orange); font-size: .72rem; font-weight: 750; }
.section-heading__lead { color: var(--md-default-fg-color--light); font-size: .86rem; max-width: 42rem; }
.home-overview { align-items: end; display: grid; gap: 2rem; grid-template-columns: minmax(0, 1.2fr) minmax(16rem, .8fr); margin: 0 0 4rem; }
.home-overview__copy h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin: .25rem 0 .5rem; }
.home-overview__copy p { color: var(--md-default-fg-color--light); font-size: .88rem; line-height: 1.65; margin: 0; max-width: 42rem; }
.home-signals { display: grid; gap: .7rem; grid-template-columns: repeat(2, 1fr); }
.home-signal { border-top: 2px solid var(--fpv-orange); padding: .65rem 0 .2rem; }
.home-signal strong, .home-signal span { display: block; }
.home-signal strong { font-family: var(--md-code-font-family); font-size: 1.15rem; letter-spacing: -.04em; }
.home-signal span { color: var(--md-default-fg-color--light); font-size: .68rem; margin-top: .2rem; }
.home-route-grid { margin-bottom: 4rem; }
.feature-card__list { color: var(--md-default-fg-color--light); font-size: .72rem; list-style: none; margin: 1rem 0 1.25rem; padding: 0; }
.feature-card__list li { padding-left: 1rem; position: relative; }
.feature-card__list li::before { color: var(--fpv-orange); content: "→"; left: 0; position: absolute; }
.feature-card__list li + li { margin-top: .35rem; }
.home-latest { background: var(--md-code-bg-color, #fff); border: 1px solid rgba(127,127,127,.18); border-radius: 1rem; display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1.35fr) minmax(15rem, .65fr); margin: 0 0 4.5rem; overflow: hidden; }
.home-latest__copy { padding: 1.8rem 1.8rem 2rem; }
.home-latest__copy h2 { font-size: clamp(1.5rem, 3vw, 2.2rem); margin: .35rem 0 .5rem; }
.home-latest__copy p, .home-latest__aside p { color: var(--md-default-fg-color--light); font-size: .82rem; line-height: 1.6; }
.home-latest__aside { background: rgba(227,77,54,.09); border-left: 1px solid rgba(127,127,127,.18); display: flex; flex-direction: column; justify-content: center; padding: 1.8rem; }
.home-latest__aside strong { font-size: 1.1rem; margin-top: .7rem; }
.home-latest__aside p { margin: .45rem 0 1.1rem; }
.home-gallery { margin: 0 0 4rem; }
.home-gallery__grid { display: grid; gap: 1rem; grid-template-columns: repeat(3, 1fr); }
.home-gallery__item { background: var(--md-code-bg-color, #fff); border: 1px solid rgba(127,127,127,.18); border-radius: 1rem; overflow: hidden; }
.home-gallery__item a { display: block; }
.home-gallery__item img { aspect-ratio: 1.45; display: block; object-fit: cover; transition: transform .25s ease; width: 100%; }
.home-gallery__item a:hover img { transform: scale(1.035); }
.home-gallery__item figcaption { color: var(--md-default-fg-color--light); font-size: .72rem; line-height: 1.5; padding: .9rem 1rem 1.1rem; }
.home-gallery__item figcaption strong { color: var(--md-default-fg-color); display: block; font-size: .82rem; margin-bottom: .25rem; }
.project-gallery { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); margin: 1rem 0 3rem; }
.project-gallery figure { background: var(--md-code-bg-color, #fff); border: 1px solid rgba(127,127,127,.18); border-radius: 1rem; margin: 0; overflow: hidden; }
.project-gallery figure a { display: block; }
.project-gallery figure img { aspect-ratio: 1.45; display: block; object-fit: cover; transition: transform .25s ease; width: 100%; }
.project-gallery figure a:hover img { transform: scale(1.035); }
.project-gallery figcaption { color: var(--md-default-fg-color--light); font-size: .76rem; line-height: 1.5; padding: .9rem 1rem 1.1rem; }
.project-gallery figcaption strong { color: var(--md-default-fg-color); display: block; font-size: .86rem; margin-bottom: .25rem; }
.home-quote { border-left: 3px solid var(--fpv-orange); margin: 5rem auto 2rem; max-width: 34rem; padding: .4rem 0 .4rem 1.4rem; }
.home-quote p { font-size: 1.25rem; font-weight: 700; margin: 0; }
.home-quote span { color: var(--md-default-fg-color--light); font-size: .7rem; }
.wiki-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); margin: 2rem 0; }
.wiki-grid > div { border: 1px solid rgba(127,127,127,.2); border-radius: .8rem; padding: .5rem 1.2rem 1.2rem; }
.profile-intro { align-items: center; display: grid; gap: 2rem; grid-template-columns: auto 1fr; margin: 2rem 0 4rem; }
.profile-avatar { align-items: center; background: linear-gradient(135deg, var(--fpv-orange), #b83228); border-radius: 50%; box-shadow: 0 14px 30px rgba(227,77,54,.25); color: white; display: flex; font-size: 2rem; font-weight: 850; height: 8rem; justify-content: center; width: 8rem; }
.profile-intro h2 { margin-top: 0; }
.stat-grid { display: grid; gap: .7rem; grid-template-columns: repeat(2, 1fr); margin: 1rem 0 3rem; }
.stat-grid > div { background: var(--md-code-bg-color, #fff); border: 1px solid rgba(127,127,127,.18); border-radius: .65rem; padding: 1rem; }
.stat-grid strong, .stat-grid span { display: block; }
.stat-grid span { color: var(--md-default-fg-color--light); font-size: .72rem; margin-top: .25rem; }
.performance-chart { height: clamp(19rem, 46vw, 28rem); margin: 1rem 0 1.4rem; position: relative; }
.performance-chart--events { height: clamp(22rem, 52vw, 32rem); }
.performance-chart--squad { height: clamp(20rem, 48vw, 27rem); margin-bottom: 2.5rem; }
.performance-chart--comparison { height: clamp(23rem, 55vw, 34rem); margin-bottom: 3rem; }
.squad-grid { display: grid; gap: .8rem; grid-template-columns: repeat(4, 1fr); margin: 2rem 0 3rem; }
.squad-card { background: var(--md-code-bg-color, #fff); border: 1px solid rgba(127,127,127,.18); border-radius: .8rem; padding: 1rem; text-align: center; }
.squad-card__avatar { align-items: center; background: linear-gradient(135deg, var(--fpv-orange), #b83228); border-radius: 50%; color: #fff; display: inline-flex; font-family: var(--md-code-font-family); font-size: .72rem; font-weight: 800; height: 2.8rem; justify-content: center; width: 2.8rem; }
.squad-card h2 { font-size: .95rem; margin: .75rem 0 .1rem; }
.squad-card p { color: var(--md-default-fg-color--light); font-size: .65rem; margin: 0; }
.squad-stats-grid { display: grid; gap: .8rem; grid-template-columns: repeat(2, 1fr); margin: 1rem 0 1.5rem; }
.squad-stat-card { background: var(--md-code-bg-color, #fff); border: 1px solid rgba(127,127,127,.18); border-radius: .8rem; padding: .8rem 1rem; }
.squad-stat-card h3 { font-size: .9rem; margin: 0 0 .7rem; }
.squad-stat-card p { color: var(--md-default-fg-color--light); font-size: .65rem; margin: .7rem 0 0; }
.squad-stat-row { align-items: center; display: grid; gap: .5rem; grid-template-columns: 2.5rem minmax(0,1fr) 2.3rem; margin: .35rem 0; }
.squad-stat-row > span, .squad-stat-row > strong { font-family: var(--md-code-font-family); font-size: .6rem; }
.squad-stat-row > strong { font-variant-numeric: tabular-nums; text-align: right; }
.squad-stat-fill--2024 { background: var(--md-default-fg-color--light); }
.squad-stat-fill--2025 { background: var(--fpv-orange-bright); }
.squad-stat-fill--2026 { background: var(--fpv-orange); }
.squad-results { border: 1px solid rgba(127,127,127,.18); border-radius: .8rem; margin: .8rem 0; padding: 0 1rem 1rem; }
.squad-results summary { color: var(--md-default-fg-color); cursor: pointer; padding: 1rem 0; }
.squad-results[open] summary { border-bottom: 1px solid rgba(127,127,127,.14); margin-bottom: 1rem; }
.setup-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); margin: 1rem 0 3rem; }
.setup-card { background: var(--md-code-bg-color, #fff); border: 1px solid rgba(127,127,127,.18); border-radius: .8rem; padding: .4rem 1.2rem 1rem; }
.setup-card h3 { color: var(--fpv-orange); }
.setup-card ul { margin-bottom: .6rem; }
.build-grid { display: grid; gap: 1rem; grid-template-columns: repeat(3, 1fr); margin: 2rem 0; }
.md-typeset .build-card { background: var(--md-code-bg-color, #fff); border: 1px solid rgba(127,127,127,.18); border-radius: 1rem; color: var(--md-default-fg-color); display: flex; flex-direction: column; min-height: 14rem; padding: 1.3rem; transition: transform .2s ease, border-color .2s ease; }
.md-typeset .build-card:hover { border-color: var(--fpv-orange); transform: translateY(-4px); }
.build-card h2 { font-size: 1.15rem; margin: 1.2rem 0 .4rem; }
.build-card p { color: var(--md-default-fg-color--light); flex: 1; font-size: .75rem; }
.build-card > span:last-child { color: var(--fpv-orange); font-size: .7rem; font-weight: 750; }
.md-typeset img { border-radius: .6rem; }
.md-typeset figure { margin-left: 0; margin-right: 0; max-width: 100%; }

@media (max-width: 800px) {
  .hero { grid-template-columns: 1fr; min-height: auto; padding: 2.5rem 0 4rem; }
  .hero__visual { margin: 0 auto; max-width: 25rem; order: -1; }
  .home-overview, .home-latest { grid-template-columns: 1fr; }
  .home-latest__aside { border-left: 0; border-top: 1px solid rgba(127,127,127,.18); }
  .home-gallery__grid, .project-gallery { grid-template-columns: repeat(2, 1fr); }
  .feature-grid, .build-grid { grid-template-columns: 1fr; }
  .squad-grid { grid-template-columns: repeat(2, 1fr); }
  .feature-card { min-height: 12rem; }
}
@media (max-width: 520px) {
  .wiki-grid, .stat-grid, .setup-grid, .squad-grid, .squad-stats-grid, .home-signals, .home-gallery__grid, .project-gallery { grid-template-columns: 1fr; }
  .profile-intro { grid-template-columns: 1fr; }
}


/* Tinywhoop gate project cover */
.tg-hero { margin: 1.2rem 0 1.4rem; padding: .7rem; border: 1px solid rgba(127,127,127,.2); border-radius: 1rem; background: var(--md-code-bg-color); }
.tg-hero img { display: block; width: 100%; max-height: 26rem; object-fit: contain; background: #fff; }
.tg-hero figcaption { font-size: .65rem; text-align: left; margin: .55rem .25rem 0; color: var(--md-default-fg-color--light); }
.md-typeset .gate-card-image { width: 100%; height: 9rem; object-fit: contain; background: #fff; margin-bottom: 1rem; }

/* Cost estimate visual summaries */
.md-typeset .cost-visual { background:var(--md-code-bg-color); border:1px solid var(--md-default-fg-color--lightest); border-radius:.8rem; padding:1rem 1.1rem; margin:1rem 0 1.8rem; }
.cost-visual__total { display:flex; align-items:baseline; gap:.7rem; flex-wrap:wrap; margin:0 0 .8rem!important; }
.cost-visual__total strong { font-size:1.35rem; }
.cost-visual__total span,.cost-note { color:var(--md-default-fg-color--light); font-size:.68rem; }
.cost-stack { display:flex; width:100%; height:1.05rem; overflow:hidden; border-radius:1rem; background:var(--md-default-fg-color--lightest); }
.cost-stack span { width:var(--w); background:var(--c); }
.md-typeset .cost-legend { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.35rem 1rem; list-style:none; padding:0; margin:.8rem 0; }
.md-typeset .cost-legend li { display:flex; gap:.45rem; align-items:center; margin:0; font-size:.68rem; }
.cost-legend i { width:.6rem; height:.6rem; flex:none; background:var(--c); border-radius:50%; }
.cost-legend strong { margin-left:auto; white-space:nowrap; }
.cost-range { display:grid; grid-template-columns:4.6rem 1fr 6.6rem; align-items:center; gap:.6rem; font-size:.68rem; margin:.65rem 0; }
.cost-range__track { position:relative; background:var(--md-default-fg-color--lightest); border-radius:1rem; height:.65rem; }
.cost-range__track i { display:block; position:absolute; left:var(--start); width:var(--size); height:100%; border-radius:1rem; background:#5798d8; }
.cost-range strong { text-align:right; white-space:nowrap; }
@media(max-width:600px){.md-typeset .cost-legend{grid-template-columns:1fr}.cost-range{grid-template-columns:3.6rem 1fr 6rem;gap:.35rem}}

/* Per-gate cost ranges; numeric labels remain visible on small screens. */
.batch-row { display:grid; grid-template-columns:4rem minmax(3rem,1fr) auto; gap:.65rem; align-items:center; margin:.55rem 0; font-size:.68rem; }
.batch-track { height:.7rem; position:relative; background:var(--md-default-fg-color--lightest); border-radius:1rem; }
.batch-track i { position:absolute; left:var(--start); width:var(--size); height:100%; background:#5798d8; border-radius:1rem; }
.batch-row strong { white-space:nowrap; }

/* GateLink simulator page: the simulator embedded full width */
.gatelink-sim { width: 100%; height: min(88vh, 900px); min-height: 560px; border: 1px solid var(--md-default-fg-color--lightest); border-radius: 8px; background: #0b0e14; display: block; margin: 1em 0; }

/* Card grids: plain div cards with one stretched title link (no nested anchors). */
.md-typeset .build-card { position: relative; }
.md-typeset .build-card h2 { margin: .8rem 0 .4rem; }
.md-typeset .build-card h2 a { color: inherit; }
.md-typeset .build-card .build-card__link::after { content: ""; inset: 0; position: absolute; border-radius: 1rem; }
.build-card__more { color: var(--fpv-orange); font-size: .7rem; font-weight: 750; }
.md-typeset .build-card:focus-within { border-color: var(--fpv-orange); }
.wiki-grid > div h3 { margin-top: 1rem; }

/* Status chips */
.status-chip { border: 1px solid rgba(127,127,127,.45); border-radius: 99px; color: var(--md-default-fg-color--light); display: inline-block; font-size: .6rem; font-weight: 750; letter-spacing: .08em; padding: .2rem .6rem; text-transform: uppercase; }
.status-chip--live { border-color: var(--fpv-orange); color: var(--fpv-orange); }

/* Home hero as project highlight */
.hero--project .hero__copy h1 { font-size: clamp(2.2rem, 5vw, 4rem); line-height: 1; max-width: 14ch; }
.hero--project .hero__copy .eyebrow { margin-right: .6rem; }
.hero__visual--render { filter: none; transform: none; }
.hero__visual--render img { border: 1px solid rgba(127,127,127,.2); border-radius: 1rem; display: block; }

/* Home: latest updates */
.home-updates { margin: 0 0 4rem; }
.update-list { display: grid; gap: 0; }
.update-item { border-top: 1px solid rgba(127,127,127,.2); padding: 1rem 0; }
.update-item--lead { align-items: center; display: grid; gap: 1.4rem; grid-template-columns: minmax(11rem, 26%) minmax(0, 1fr); }
.update-item__image { border-radius: .7rem; display: block; overflow: hidden; background: #15171b; }
.update-item__image img { display: block; width: 100%; }
.md-typeset .update-item p { color: var(--md-default-fg-color--light); font-size: .78rem; margin: 0 0 .4rem; }
.md-typeset .update-item__meta span { color: var(--fpv-orange); font-weight: 750; }
.md-typeset .update-item h3 { font-size: 1.1rem; margin: 0 0 .3rem; }
.md-typeset .update-item h3 a { color: var(--md-default-fg-color); }
.home-updates__all { margin: 1rem 0 0; }

/* Projects page */
.project-feature { align-items: center; background: var(--md-code-bg-color, #fff); border: 1px solid rgba(227,77,54,.55); border-radius: 1rem; display: grid; gap: 1.6rem; grid-template-columns: minmax(12rem, 40%) minmax(0, 1fr); margin: 1.6rem 0 2.4rem; padding: 1.2rem; }
.project-feature__image { border-radius: .7rem; display: block; overflow: hidden; }
.project-feature__image img { display: block; width: 100%; }
.md-typeset .project-feature h2 { font-size: 1.5rem; margin: .7rem 0 .4rem; }
.md-typeset .project-feature h2 a { color: var(--md-default-fg-color); }
.md-typeset .project-feature p { font-size: .8rem; margin: .4rem 0; }
.project-feature__links { color: var(--md-default-fg-color--light); }
.md-typeset .project-list__title { color: var(--md-default-fg-color--light); font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; }
.md-typeset .project-list { list-style: none; margin: 0; padding: 0; }
.project-list li { border-top: 1px solid rgba(127,127,127,.2); margin: 0; padding: 1rem 0; }
.project-list li > div { align-items: center; display: flex; flex-wrap: wrap; gap: .6rem; }
.md-typeset .project-list h3 { font-size: 1.1rem; margin: .5rem 0 .2rem; }
.md-typeset .project-list p { color: var(--md-default-fg-color--light); font-size: .78rem; margin: 0; }

/* All Articles filter */
.article-filter { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.2rem 0 0; }
.article-filter__chip { background: transparent; border: 1px solid rgba(127,127,127,.35); border-radius: 99px; color: var(--md-default-fg-color); cursor: pointer; font: inherit; font-size: .72rem; font-weight: 650; padding: .35rem .9rem; }
.article-filter__chip.is-active { background: var(--fpv-orange); border-color: var(--fpv-orange); color: #fff; }
.article-filter__chip:focus-visible { outline: 3px solid var(--fpv-orange); outline-offset: 2px; }
.article-row[hidden] { display: none; }

@media (max-width: 760px) {
  .project-feature, .update-item--lead { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .update-item__image { display: none; }
}
@media (max-width: 960px) {
  .hero--project .hero__visual { margin: 0; max-width: none; order: 0; }
}

/* GateLink race receiver OLED mock-up */
.gl-oled { background: #1c1f26; border: 1px solid rgba(127,127,127,.35); border-radius: 12px; box-sizing: border-box; margin: 1.2rem 0 .4rem; max-width: 100%; padding: 14px; width: 340px; }
.gl-oled__screen { background: #000; border-radius: 4px; color: #7fd8ff; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: .62rem; line-height: 1.45; overflow: hidden; padding: .5rem .6rem; white-space: pre; }
.gl-oled__bar { background: #7fd8ff; color: #000; display: block; font-weight: 700; margin: -.1rem -.2rem .3rem; padding: 0 .2rem; }