/* GSCE Registry public site. Palette from the car: Watkins Glen Gray, Tension Blue, satin black stripe, brushed plaque. */
:root {
    --paper: #f2f3f4;
    --ink: #1e2023;          /* satin black stripe */
    --glen: #4d4e52;         /* Watkins Glen Gray (Ken's site colour) */
    --glen-light: #a3a8ad;
    --plate: #d5d9dc;        /* brushed dash plaque */
    --tension: #55c8ff;      /* Tension Blue: Ken's sampled colour from his earlier site work (PPG 922601 cited as close; GM publishes no screen value). Use on dark and as fills next to dark. */
    --tension-ink: #0d6d9c;  /* Tension Blue, darkened for text, links and fills on light backgrounds (5.1:1 on paper) */
    --tension-soft: #e6f7ff;
    --tension-light: #55c8ff; /* Tension Blue on dark (7.3:1 on Carbon Flash) */
    --carbon: #2b2d30;        /* Carbon Flash Metallic (approximation) */
    --rule: #c9cdd1;
    --amber: #8a5a00;
    --wide: 'wdth' 125;
    --narrow: 'wdth' 75;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 1rem/1.55 'Archivo', system-ui, sans-serif; }
a { color: var(--tension-ink); text-underline-offset: 0.18em; }
a:hover { color: var(--ink); }
:focus-visible { outline: 3px solid var(--tension-ink); outline-offset: 2px; }
.wrap { max-width: 72rem; margin: 0 auto; padding: 0 1.25rem; }
.skip { position: absolute; left: -999px; }
.skip:focus { left: 1rem; top: 1rem; background: #fff; padding: .5rem 1rem; z-index: 10; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.muted { color: var(--glen); }
.small { font-size: .875rem; }

/* Masthead: Carbon Flash band with the ruled wordmark (Venus Rising outlines, slanted "2017 GRAND SPORT", white over blue rules) */
.masthead { background: var(--carbon); color: #fff; --accent: var(--tension-light); }
.mark__wordmark { display: block; height: 3.1rem; width: auto; max-width: 100%; color: #fff; }
@media (max-width: 40rem) { .mark__wordmark { height: 2.4rem; } }
.masthead__inner { max-width: 72rem; margin: 0 auto; padding: .9rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; }
.mark { display: flex; align-items: center; gap: .85rem; color: #fff; text-decoration: none; }
.mark:hover { color: #fff; }
.hash { display: inline-flex; gap: 5px; transform: skewX(-24deg); }
.hash i { display: block; width: 7px; height: 26px; background: var(--tension); }
.mark__text { font-variation-settings: var(--narrow); font-weight: 600; font-size: 1.05rem; letter-spacing: .01em; }
.mark__year { font-variation-settings: var(--wide); font-weight: 800; }
.nav { display: flex; gap: 1.5rem; flex-wrap: wrap; }
.nav a { color: #e4e7ea; text-decoration: none; font-weight: 500; padding: .25rem 0; border-bottom: 2px solid transparent; }
.nav a:hover { color: #fff; border-bottom-color: var(--glen-light); }
.nav a[aria-current="page"] { color: #fff; border-bottom-color: var(--tension); }
.devbar { background: var(--tension-soft); color: var(--ink); font-size: .85rem; text-align: center; padding: .35rem 1rem; }

/* Type */
.display { font-variation-settings: var(--wide); font-weight: 750; font-size: clamp(2rem, 4.6vw, 3.4rem); line-height: 1.04; letter-spacing: -0.02em; margin: 0 0 1rem; max-width: 16ch; }
.h1 { font-variation-settings: var(--wide); font-weight: 700; font-size: clamp(1.6rem, 3vw, 2.3rem); line-height: 1.1; letter-spacing: -0.01em; margin: 0 0 .75rem; }
.h2 { font-variation-settings: var(--wide); font-weight: 700; font-size: 1.3rem; line-height: 1.2; margin: 2.25rem 0 .75rem; }
.h3 { font-weight: 650; font-size: 1rem; margin: 1.25rem 0 .4rem; color: var(--glen); }
.lede { font-size: 1.15rem; max-width: 60ch; color: #33373b; margin: 0; }
.code { font-variation-settings: var(--narrow); font-weight: 650; letter-spacing: .04em; color: var(--glen); }
a.code { color: var(--tension-ink); }
.mono-num { font-variant-numeric: tabular-nums; letter-spacing: .02em; }

/* Home intro + plaque lookup */
.intro { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 2.5rem; align-items: end; padding-top: 3rem; padding-bottom: 2rem; }
.plaque { background: linear-gradient(100deg, #e3e6e8 0%, var(--plate) 45%, #e9ebed 70%, #cfd3d6 100%); border-radius: 10px; padding: 1.25rem 1.25rem 1.4rem; box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 #b8bdc1; }
.plaque__label { display: block; font-size: .9rem; color: #3a3e42; margin-bottom: .6rem; }
.plaque__badge { position: relative; container-type: inline-size; max-width: 30rem; margin: 0 0 .75rem -.3rem; }
.plaque__badge svg { display: block; width: 100%; height: auto; }
.plaque__ce { transition: opacity .15s; }
/* The input sits in the number slot of the plaque: after COLLECTOR EDITION, before the chrome (viewBox 0 40 800 162: the render has empty rows above and below). */
.plaque__input { position: absolute; left: 43.4%; width: 10.4%; top: 33.6%; height: 30.3%; box-sizing: border-box; padding: 0 .1em; margin: 0;
    font-family: Montserrat, Archivo, sans-serif; font-weight: 600; font-size: 4cqw; letter-spacing: .06em; line-height: 1;
    color: #fff; caret-color: #fff; background: transparent; border: 0; border-bottom: 2px solid rgba(255,255,255,.55); border-radius: 0;
    text-shadow: 0 1px 1.5px rgba(0,40,90,.75); text-transform: uppercase; }
.plaque__input::placeholder { color: rgba(255,255,255,.5); text-shadow: none; }
.plaque__input:focus-visible { outline: none; border-bottom-color: #fff; background: rgba(0,40,90,.18); }
.plaque.is-vin .plaque__ce { opacity: 0; }
.plaque.is-vin .plaque__input { left: 7.4%; width: 46.6%; font-size: 3.3cqw; letter-spacing: 0; }
.plaque__row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.plaque__hint { font-size: .85rem; color: #4d4e52; }
.plaque__go, .btn { font: inherit; font-weight: 650; background: var(--ink); color: #fff; border: 0; border-radius: 6px; padding: .6rem 1.1rem; cursor: pointer; }
.plaque__go:hover, .btn:hover { background: var(--tension-ink); }

/* The production run: one square per plaque number */
.run { padding-bottom: 3rem; }
.run__head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.run__head .h2 { margin-bottom: .25rem; }
.run__sub { margin: 0; color: var(--glen); font-size: .95rem; }
.legend { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; padding: 0; margin: .75rem 0 1rem; font-size: .9rem; }
.legend li { display: flex; align-items: center; gap: .4rem; }
.sw { width: 14px; height: 14px; display: inline-block; border-radius: 2px; }
.sw--us, .cell--us { background: var(--glen); }
.sw--ca, .cell--ca { background: var(--glen-light); }
.sw--ex, .cell--ex { background: var(--tension); }
.sw--nb, .cell--nb { background: transparent; box-shadow: inset 0 0 0 1.5px var(--glen); }
.sw--gone, .cell--gone { background: linear-gradient(135deg, transparent 44%, var(--ink) 44%, var(--ink) 56%, transparent 56%), #fff; box-shadow: inset 0 0 0 1.5px var(--ink); }
.grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(40, minmax(0, 1fr)); gap: 3px; }
.cell { display: block; aspect-ratio: 1; border-radius: 2px; }
.cell:hover { outline: 2px solid var(--ink); outline-offset: 1px; }
.run__foot { margin-top: 1rem; color: #3a3e42; max-width: 70ch; }

/* Car page */
.car { padding-top: 2rem; padding-bottom: 3rem; }
.car__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .4rem 1.5rem; align-items: start; }
.car__badge { grid-column: 1; grid-row: 1; width: min(100%, 30rem); height: auto; display: block; margin-left: -.4rem; }
.car__step { grid-column: 2; grid-row: 1; align-self: center; }
.car__title { grid-column: 1 / -1; grid-row: 2; }
.badge__text { font-family: Montserrat, Archivo, sans-serif; font-weight: 600; font-size: 32px; fill: #fff; letter-spacing: .06em; }
.car__plate { background: linear-gradient(100deg, #e3e6e8 0%, var(--plate) 45%, #e9ebed 70%, #cfd3d6 100%); border-radius: 10px; padding: .6rem 1.1rem .5rem; text-align: center; box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 #b8bdc1; }
.car__plate-label { display: block; font-variation-settings: var(--narrow); font-weight: 600; font-size: .8rem; color: var(--glen); letter-spacing: .03em; }
.car__plate-num { display: block; font-variation-settings: var(--wide); font-weight: 800; font-size: clamp(2.6rem, 6vw, 3.8rem); line-height: 1; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.car__title .h1 { margin-bottom: .25rem; }
.car__vin { margin: 0; color: var(--glen); }
.car__fate { margin: .5rem 0 0; font-weight: 600; }
.car__step { display: flex; gap: 1rem; font-size: .95rem; }
.car__note { margin: 1.5rem 0 0; padding: .9rem 1.1rem; background: var(--tension-soft); border-left: 4px solid var(--tension-ink); max-width: 70ch; }
.car__body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 3rem; }
.car__body .notes { grid-column: 1 / -1; }
.facts { margin: 0; }
.facts > div { display: grid; grid-template-columns: 11rem 1fr; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--rule); }
.facts dt { color: var(--glen); }
.facts dd { margin: 0; font-weight: 500; }
.facts dd small { display: block; font-weight: 400; color: var(--glen); font-size: .82rem; margin-top: .15rem; }
.term { color: inherit; text-decoration: underline dotted var(--glen-light); text-underline-offset: .2em; }
.term:hover { color: var(--tension-ink); }
.flag { display: inline-block; font-size: .75rem; font-weight: 600; color: var(--amber); border: 1px solid currentColor; border-radius: 3px; padding: 0 .35rem; margin-left: .35rem; vertical-align: .1em; }
.optlist { list-style: none; padding: 0; margin: 0; }
.optlist li { display: grid; grid-template-columns: 3rem 1fr auto; gap: .75rem; padding: .45rem 0; border-bottom: 1px solid var(--rule); }
.optlist__price { color: var(--glen); font-variant-numeric: tabular-nums; }
.notes__item { max-width: 75ch; }
.draft { font-size: .75rem; font-weight: 600; background: #fff3d6; color: var(--amber); padding: .05rem .4rem; border-radius: 3px; margin-right: .35rem; }

/* Lists and tables */
.list, .stats { padding-top: 2rem; padding-bottom: 3rem; }
.filters { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: end; margin: 1rem 0; }
.filters label { display: flex; flex-direction: column; font-size: .85rem; color: var(--glen); gap: .2rem; }
.filters select { font: inherit; color: var(--ink); padding: .4rem .5rem; border: 1px solid var(--glen-light); border-radius: 6px; background: #fff; max-width: 15rem; }
.reset { align-self: center; }
.count { color: var(--glen); margin: .5rem 0; }
.alert { background: #fff3d6; padding: .75rem 1rem; border-left: 4px solid var(--amber); }
.tablewrap { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; }
th, td { text-align: left; padding: .45rem .75rem .45rem 0; border-bottom: 1px solid var(--rule); white-space: nowrap; }
thead th { font-weight: 600; color: var(--glen); font-size: .85rem; border-bottom: 2px solid var(--ink); }
tbody th { font-variation-settings: var(--wide); font-weight: 700; }
.cars tr.is-nb td { color: var(--glen); font-style: italic; }
.cars tr.is-gone td { color: var(--glen); text-decoration: line-through; text-decoration-color: var(--glen-light); }
.tbl { max-width: 48rem; }
.tbl td { white-space: normal; }
.tbl td.num { white-space: nowrap; }
.num { text-align: right; padding-right: 0; padding-left: 1rem; }
tr.total td { font-weight: 700; border-top: 2px solid var(--ink); }

/* How it works */
.prose { padding-top: 2rem; padding-bottom: 3rem; max-width: 48.5rem; margin: 0 auto 0 max(0px, calc((100% - 72rem) / 2)); }
.prose h1 { font-variation-settings: var(--wide); font-weight: 700; font-size: clamp(1.6rem, 3vw, 2.3rem); line-height: 1.1; }
.prose h2 { font-variation-settings: var(--wide); font-weight: 700; font-size: 1.3rem; margin-top: 2.5rem; padding-top: 1rem; border-top: 2px solid var(--ink); }
.prose p { margin: .8rem 0; }
.prose p[id] strong:first-child, .prose strong { font-weight: 650; }
.prose :target { background: var(--tension-soft); outline: 6px solid var(--tension-soft); }
.prose table { margin: 1rem 0; }
.prose td { white-space: normal; }

.footer { background: var(--ink); color: #c9cdd1; margin-top: 2rem; }
.footer__inner { max-width: 72rem; margin: 0 auto; padding: 1.5rem 1.25rem; font-size: .9rem; }
.footer p { margin: .3rem 0; max-width: 70ch; }

@media (max-width: 800px) {
    .intro { grid-template-columns: minmax(0, 1fr); padding-top: 2rem; gap: 1.5rem; }
    .masthead__inner { padding: .75rem 1.25rem; }
    .nav { gap: .25rem 1.25rem; }
    .grid { grid-template-columns: repeat(20, minmax(0, 1fr)); gap: 2px; }
    .car__step { grid-column: 1 / -1; grid-row: 3; }
    .car__body { grid-template-columns: minmax(0, 1fr); }
    .facts > div { grid-template-columns: 1fr; gap: .1rem; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }

/* Sections, site map and planned pages */
.section-page, .placeholder { padding-top: 2rem; padding-bottom: 3rem; }
.pages { list-style: none; padding: 0; margin: 1.25rem 0 0; max-width: 52rem; }
.pages__item { padding: .85rem 0; border-bottom: 1px solid var(--rule); }
.pages__title { font-variation-settings: var(--wide); font-weight: 700; font-size: 1.05rem; text-decoration: none; }
.pages__item--planned .pages__title { color: var(--ink); }
.pages__about { margin: .3rem 0 0; color: #3a3e42; max-width: 70ch; }
.status { display: inline-block; font-size: .75rem; font-weight: 600; border-radius: 3px; padding: .05rem .45rem; margin-left: .5rem; vertical-align: .15em; }
.status--live { background: var(--tension-ink); color: #fff; }
.status--partial { background: var(--tension-soft); color: var(--tension-ink); }
.status--planned { background: transparent; color: var(--glen); box-shadow: inset 0 0 0 1px var(--glen-light); }
p.status { margin: 0 0 1rem; }
.sitemap { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 3rem; }
.sitemap .h2 a { color: inherit; text-decoration: none; }
.sitemap .pages { margin-top: .5rem; }
.crumb { margin: 0 0 .5rem; font-size: .9rem; }
.placeholder__dev { max-width: 40rem; margin: 1rem 0 1.5rem; }
.footer a { color: #fff; }
@media (max-width: 800px) { .sitemap { grid-template-columns: minmax(0, 1fr); } }
.footer__links { display: flex; gap: 1.5rem; }

/* DEV-only planning marks on the site map */
.release { display: inline-block; font-size: .7rem; font-weight: 600; letter-spacing: .02em; border-radius: 3px; padding: .05rem .4rem; margin-left: .35rem; vertical-align: .15em; color: var(--glen); background: #eef0f1; }
.release--launch { color: #fff; background: var(--glen); }
.pages__dev { margin: .2rem 0 0; font-size: .8rem; color: var(--glen); display: flex; flex-direction: column; gap: .1rem; }

/* The cars: column chooser (public/js/cars-table.js) */
.cartable[hidden], .js-fallback[hidden] { display: none; }
.ct-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; margin: 1rem 0 .25rem; }
.ct-bar .count { margin: 0 0 0 auto; }
.btn--ghost { background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1px var(--glen-light); }
.btn--ghost:hover { background: var(--tension-soft); color: var(--ink); }
.ct-cols { position: relative; }
.ct-cols > summary { list-style: none; display: inline-block; }
.ct-cols > summary::-webkit-details-marker { display: none; }
.ct-cols__panel { position: absolute; z-index: 6; top: calc(100% + .4rem); left: 0; width: min(52rem, 92vw); max-height: 72vh; overflow: auto; background: #fff; border: 1px solid var(--rule); border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,.12); padding: .75rem 1rem; }
.ct-cols__panel[hidden] { display: none; }
.ct-cols__groups { display: block; }
.ct-cols__panel fieldset { margin: 0 0 .75rem; padding: 0 0 .6rem; border: 0; border-bottom: 1px solid #eceef0; min-width: 0; }
.ct-cols__panel fieldset:last-child { border-bottom: 0; margin-bottom: 0; }
.ct-cols__panel legend { padding: 0 0 .2rem; margin-bottom: .3rem; width: 100%; border-bottom: 1px solid var(--rule); }
.ct-cols__items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1.25rem; }
@media (max-width: 52rem) { .ct-cols__items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 34rem) { .ct-cols__items { grid-template-columns: 1fr; } }
.ct-cols__panel fieldset { border: 0; margin: 0 0 .5rem; padding: 0; }
.ct-cols__panel legend { font-weight: 650; font-size: .85rem; color: var(--glen); margin-bottom: .25rem; }
.ct-cols__panel label { display: flex; gap: .4rem; align-items: baseline; font-size: .875rem; padding: .1rem 0; }
.ct-cols__actions { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: 0 0 .75rem; padding-bottom: .6rem; border-bottom: 1px solid var(--rule); }
.ct-cols__close { margin-left: auto; font-weight: 650; }
.linkbtn { font: inherit; background: none; border: 0; padding: 0; color: var(--tension-ink); text-decoration: underline; text-underline-offset: .18em; cursor: pointer; }
.linkbtn:hover { color: var(--ink); }
.ct-hint { font-size: .85rem; color: var(--glen); margin: .25rem 0 .5rem; }
.ct-sort { font: inherit; font-weight: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; display: inline-flex; gap: .3rem; align-items: baseline; white-space: nowrap; }
.ct-arrow { font-size: .7em; color: var(--tension-ink); min-width: .8em; }
.ct-filters td { padding-top: .25rem; padding-bottom: .4rem; background: #f7f8f9; }
.ct-filters select, .ct-filters input { font: inherit; font-size: .8rem; width: 100%; min-width: 4.5rem; padding: .2rem .3rem; border: 1px solid var(--glen-light); border-radius: 4px; background: #fff; color: var(--ink); }
.ct-range { display: flex; gap: .25rem; }
.ct-range input { min-width: 6.5rem; }
.ct td.num { text-align: right; font-variant-numeric: tabular-nums; }
.ct td.tick { text-align: center; color: var(--tension-ink); font-weight: 700; }

/* Statistics charts (dataviz method: one hue + gray, thin marks, 4px data-ends, 2px surface gaps, table view behind each) */
.stats { --viz-a: var(--tension-ink); --viz-b: #c9cdd1; --viz-surface: var(--paper); }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); gap: 1rem; margin: 1.5rem 0 1rem; }
.kpi { margin: 0; padding: .9rem 1rem; background: #fff; border-radius: 8px; box-shadow: inset 0 0 0 1px var(--rule); display: flex; flex-direction: column; }
.kpi dt { font-size: .85rem; color: var(--glen); margin-top: .6rem; }
.kpi dd { margin: 0 0 .25rem; font-weight: 650; font-size: 2rem; line-height: 1.1; white-space: nowrap; }
.kpi p { margin: 0; font-size: .85rem; color: var(--glen); font-variant-numeric: tabular-nums; }
.viz { margin: 2.5rem 0 0; }
.viz .h2 { margin-bottom: .25rem; }
.viz__sub { margin: 0 0 .75rem; color: var(--glen); font-size: .925rem; max-width: 70ch; }
.viz__legend { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; padding: 0; margin: 0 0 .6rem; font-size: .85rem; color: var(--glen); }
.viz__legend li { display: flex; align-items: center; gap: .4rem; }
.key { display: inline-block; width: 12px; height: 12px; border-radius: 2px; }
.key--a { background: var(--viz-a); } .key--b, .key--rest { background: var(--viz-b); }
.key--nb { box-shadow: inset 0 0 0 1.5px var(--glen-light); }
.viz__controls { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem 1rem; margin: 0 0 .6rem; }
.viz__controls label { display: flex; flex-direction: column; font-size: .85rem; color: var(--glen); gap: .2rem; }
.viz__controls select { font: inherit; color: var(--ink); padding: .35rem .5rem; border: 1px solid var(--glen-light); border-radius: 6px; background: #fff; }
.viz__count { font-weight: 650; padding-bottom: .4rem; }
.viz__table { margin-top: .75rem; font-size: .9rem; }
.viz__table summary { cursor: pointer; color: var(--tension-ink); }
/* Horizontal bars */
.hbars { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.hbar { display: grid; grid-template-columns: minmax(9rem, 16rem) 1fr; align-items: center; gap: .75rem; padding: 2px 0; border-radius: 4px; }
.hbar:hover, .hbar:focus-visible { background: #e9ebed; outline: none; }
.hbar__label { font-size: .9rem; line-height: 1.25; }
.hbar__label a { color: var(--ink); text-decoration: none; }
.hbar__label a:hover { color: var(--tension-ink); text-decoration: underline; }
.hbars--opts .hbar { grid-template-columns: minmax(12rem, 24rem) 1fr; }
.hbar__track { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.hbar__stack { display: flex; gap: 2px; height: 18px; min-width: 3px; }
.seg { display: block; height: 100%; min-width: 2px; }
.seg--a { background: var(--viz-a); } .seg--b { background: var(--viz-b); }
.hbar__stack .seg:first-child { border-radius: 0; }
.hbar__stack .seg:last-child { border-radius: 0 4px 4px 0; }
.hbar__val { font-size: .85rem; font-variant-numeric: tabular-nums; color: var(--ink); white-space: nowrap; }
/* Columns */
.cols { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 6px; align-items: end; height: 15rem; border-bottom: 1px solid var(--rule); }
.col { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; position: relative; border-radius: 4px 4px 0 0; }
.col:hover, .col:focus-visible { background: #e9ebed; outline: none; }
.col__bar { display: block; width: min(24px, 70%); background: var(--viz-a); border-radius: 4px 4px 0 0; min-height: 0; }
.col__val { font-size: .8rem; font-variant-numeric: tabular-nums; margin-bottom: .2rem; }
.col__label { position: absolute; top: calc(100% + .35rem); font-size: .75rem; color: var(--glen); text-align: center; line-height: 1.1; }
.cols + .viz__table { margin-top: 2.75rem; }
/* Production run grid: numbered squares, 20 across (10 on a phone) */
.rungrid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(20, minmax(0, 1fr)); gap: 3px; }
.rc { display: grid; place-items: center; aspect-ratio: 1.6; border-radius: 3px; background: #e2e5e8; color: var(--ink); text-decoration: none; font-size: clamp(.6rem, 1.05vw, .8rem); font-variant-numeric: tabular-nums; font-weight: 500; }
.rungrid.is-picking .rc:not(.on):not(.rc--nb) { background: #eceef0; color: #8a8e93; }
.rc.on { background: var(--viz-a); color: #fff; font-weight: 650; }
.rc--nb { background: transparent; box-shadow: inset 0 0 0 1.5px var(--glen-light); color: var(--glen); }
.rc:hover, .rc:focus-visible { outline: 2px solid var(--ink); outline-offset: 1px; }
@media (max-width: 40rem) {
  .rungrid { grid-template-columns: repeat(10, minmax(0, 1fr)); }
  .rc { aspect-ratio: 1.4; font-size: .72rem; }
  .hbar, .hbars--opts .hbar { grid-template-columns: 1fr; gap: .2rem; }
  .cols { height: 11rem; gap: 3px; }
}
/* Tooltip */
.viz-tip { position: absolute; z-index: 20; max-width: 18rem; pointer-events: none; background: var(--carbon); color: #fff; font-size: .8rem; line-height: 1.35; padding: .4rem .6rem; border-radius: 6px; box-shadow: 0 4px 14px rgba(0,0,0,.2); }

/* Where they went: state tile map (one blue, five validated steps; ink or white labels by step) */
.tilemap { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 3px; max-width: 46rem; margin: .5rem 0 0; }
.tile { aspect-ratio: 1; display: grid; place-items: center; font-size: clamp(.55rem, 1.3vw, .8rem); font-weight: 600; border-radius: 3px; color: var(--ink); }
.tile:hover, .tile:focus-visible { outline: 2px solid var(--ink); outline-offset: 1px; }
.tile--b0 { background: transparent; box-shadow: inset 0 0 0 1px var(--glen-light); color: var(--glen); font-weight: 500; }
.tile--b1 { background: #84b4cc; } .tile--b2 { background: #5296ba; }
.tile--b3 { background: #1f78a6; color: #fff; } .tile--b4 { background: #0b5a80; color: #fff; } .tile--b5 { background: #063a54; color: #fff; }
.geo__scale .key { width: 14px; height: 14px; }
.notice { padding: .75rem 1rem; background: var(--tension-soft); border-radius: 6px; color: var(--ink); }

.ct-groups th { font-size: .72rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--glen); text-align: left; padding: .25rem .5rem; border-bottom: 0; white-space: nowrap; }
.ct-g--0 { background: #e9ebed; } .ct-g--1 { background: #f5f6f7; }
.ct-th { display: inline-flex; align-items: baseline; gap: .25rem; }
.ct-info { font: inherit; font-size: .8em; line-height: 1; background: none; border: 0; padding: 0 .1rem; color: var(--glen); cursor: pointer; }
.ct-info:hover, .ct-info:focus-visible { color: var(--tension-ink); }
.list { position: relative; }
.cartable { position: relative; }
.ct-pop { position: absolute; z-index: 7; width: min(20rem, 90vw); background: #fff; border: 1px solid var(--rule); border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,.14); padding: .65rem .8rem; font-size: .85rem; line-height: 1.4; }
.ct-pop[hidden] { display: none; }
.ct-pop p { margin: 0 0 .35rem; } .ct-pop p:last-child { margin-bottom: 0; }
.ct-pop__title { font-weight: 650; color: var(--ink); }

/* The cars table scrolls in its own box, so the sideways scrollbar is always on screen; headings stay put */
.ct-scroll { overflow: auto; max-height: calc(100vh - 1.5rem); min-height: 20rem; border: 1px solid var(--rule); border-radius: 6px; background: #fff; }
.ct-scroll .cars { margin: 0; }
.ct thead { position: sticky; top: 0; z-index: 2; box-shadow: 0 1px 0 var(--rule); }
.ct thead th, .ct thead td { background: #fff; }
.ct thead .ct-filters td { background: #f7f8f9; }
.ct thead .ct-g--0 { background: #e9ebed; } .ct thead .ct-g--1 { background: #f5f6f7; }
.ct tbody th { position: sticky; left: 0; z-index: 1; background: #fff; }
.ct thead tr > :first-child { position: sticky; left: 0; z-index: 3; }

.ct-topscroll { overflow-x: auto; overflow-y: hidden; height: 16px; margin: 0 0 2px; }
.ct-topscroll[hidden] { display: none; }
.ct-topscroll > div { height: 1px; }
.ct-filters select { max-width: 9rem; }
.ct-filters input[type=search] { max-width: 11rem; }
/* Separate borders so each sticky heading cell carries its own border (collapsed borders stay behind and leave gaps) */
.ct { border-collapse: separate; border-spacing: 0; }
.ct thead tr { background: #fff; }
.ct td.num { padding-right: 1rem; }

.stats > .lede { max-width: none; }
.kpi__sep { color: var(--glen-light); font-weight: 400; margin: 0 .1rem; }

/* Car status marks in the production run, kept in every highlight state: gone = heavy dark inner border; titled = dashed inner border */
.rc--gone { box-shadow: inset 0 0 0 3px var(--carbon); }
.rc--title { outline: 2px dashed var(--carbon); outline-offset: -4px; }
.rc--gone:hover, .rc--gone:focus-visible, .rc--title:hover, .rc--title:focus-visible { outline: 2px solid var(--ink); outline-offset: 1px; }
.key--gone { background: #e2e5e8; box-shadow: inset 0 0 0 2.5px var(--carbon); }
.key--title { background: #e2e5e8; outline: 1.5px dashed var(--carbon); outline-offset: -2px; }
.hbars--dealers .hbar { grid-template-columns: minmax(12rem, 22rem) 1fr; }

/* Finder results and misses */
.find { padding-top: 2.5rem; padding-bottom: 3rem; }
.find__lede { max-width: 62ch; color: #3a3e42; }
.find__again { max-width: 34rem; margin-top: 2rem; }
.find__list { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: .75rem 1.5rem; }
.find__car { display: grid; gap: .35rem; padding: .6rem .6rem .7rem; border-radius: 8px; color: inherit; text-decoration: none; }
.find__car:hover, .find__car:focus-visible { background: #e6e8ea; }
.find__badge { display: block; width: 100%; height: auto; }
.find__meta { display: flex; justify-content: space-between; gap: .75rem; font-size: .9rem; padding: 0 .3rem; }
.find__what { font-weight: 600; }
.find__vin { color: var(--glen); }
.find__vin mark { background: var(--tension-soft); color: var(--tension-ink); font-weight: 700; padding: 0 1px; }

/* Verification badge + pop-up */
.ev { position: relative; display: inline-block; vertical-align: .1em; font-family: Archivo, sans-serif; font-variation-settings: normal; letter-spacing: 0; }
.ev__badge { display: inline-flex; align-items: center; gap: .3rem; font: 600 .72rem/1 Archivo, sans-serif; padding: .28rem .5rem; border-radius: 999px; cursor: pointer;
    border: 1px solid currentColor; background: transparent; white-space: nowrap; }
.ev--gm-verified .ev__badge, .ev--corroborated .ev__badge { color: var(--tension-ink); background: var(--tension-soft); border-color: #9fd3ee; }
.ev--gm-record .ev__badge { color: #4d4e52; background: #fff; border-color: #b9bcc0; }
.ev--one-source .ev__badge { color: #8a5a00; background: #fff8e6; border-color: #e3c27a; }
.ev__mark { font-size: .8rem; }
.ev__count { display: inline-grid; place-items: center; min-width: 1.05rem; height: 1.05rem; border-radius: 999px; background: currentColor; font-size: .65rem; }
.ev__count { color: #fff; } .ev--gm-verified .ev__count, .ev--corroborated .ev__count { background: var(--tension-ink); }
.ev--gm-record .ev__count { background: #4d4e52; } .ev--one-source .ev__count { background: #8a5a00; }
.ev__pop { position: absolute; z-index: 20; left: 0; top: calc(100% + .4rem); width: min(20rem, 80vw); padding: .75rem .85rem; border-radius: 8px;
    background: var(--carbon); color: #e8eaec; font: 400 .82rem/1.45 Archivo, sans-serif; box-shadow: 0 6px 24px rgba(0,0,0,.25); display: none; text-align: left; }
.ev__pop strong { color: #fff; }
.ev__pop a { color: var(--tension); }
.ev__basis, .ev__srcs { display: block; margin-top: .45rem; }
.ev__srcs span { display: block; padding-left: .7rem; position: relative; }
.ev__srcs span::before { content: ""; position: absolute; left: 0; top: .6em; width: .3rem; height: .3rem; border-radius: 50%; background: var(--tension); }
.ev__srcs time { color: #a9adb2; }
.ev__pop a { display: inline-block; margin-top: .45rem; }
.ev:hover .ev__pop, .ev:focus-within .ev__pop, .ev.is-open .ev__pop { display: block; }
h2 .ev { margin-left: .4rem; }

/* Options and price, built up like the sticker */
.sticker__lines { list-style: none; margin: 0; padding: 0; }
.sticker__line { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr) auto; gap: .75rem; padding: .55rem 0; border-bottom: 1px solid #d5d8db; align-items: start; }
.sticker__line--model { font-weight: 650; }
.sticker__line--package .sticker__desc { font-weight: 600; }
.sticker__price { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.sticker__inc summary { font-weight: 400; font-size: .82rem; color: var(--tension-ink); cursor: pointer; margin-top: .15rem; }
.sticker__inc ul { margin: .35rem 0 .1rem; padding-left: 1.1rem; font-weight: 400; font-size: .85rem; color: #3a3e42; columns: 2 12rem; column-gap: 1.25rem; }
.sticker__totals { margin: .5rem 0 1rem; }
.sticker__totals > div { display: flex; justify-content: space-between; gap: 1rem; padding: .3rem 0; font-variant-numeric: tabular-nums; }
.sticker__totals dt { margin: 0; } .sticker__totals dd { margin: 0; }
.sticker__total { border-top: 2px solid var(--ink); margin-top: .25rem; padding-top: .5rem !important; font-weight: 700; font-size: 1.05rem; }
.sticker__gap { color: #8a5a00; }
@media (max-width: 600px) {
    .ev__pop { position: fixed; left: 1rem; right: 1rem; top: auto; bottom: 1rem; width: auto; }
}

/* Release 3 preview: claimed car */
.mockbar { background: #fff8e6; border: 1px solid #e3c27a; color: #5c3d00; border-radius: 8px; padding: .6rem .9rem; font-size: .9rem; margin: 0 0 1rem; }
.car__owner { display: flex; flex-wrap: wrap; gap: .4rem; margin: .1rem 0 .45rem; }
.otag { font: 600 .78rem/1 Archivo, sans-serif; padding: .35rem .6rem; border-radius: 999px; background: #fff; border: 1px solid #b9bcc0; color: var(--glen); }
.otag--first { background: var(--carbon); border-color: var(--carbon); color: #fff; }
.otag--ok { background: var(--tension-soft); border-color: #9fd3ee; color: var(--tension-ink); }
.r3chip { display: inline-block; vertical-align: .2em; margin-left: .5rem; font: 600 .68rem/1 Archivo, sans-serif; letter-spacing: .04em; text-transform: uppercase;
    padding: .3rem .5rem; border-radius: 4px; background: var(--carbon); color: var(--tension); font-variation-settings: normal; }
.owner-block { margin-top: 2.5rem; max-width: 60rem; }
.lineage { list-style: none; margin: 0; padding: 0; }
.lineage__item { display: grid; gap: .2rem; padding: .9rem 1rem; border-left: 4px solid var(--tension-ink); background: #fff; border-radius: 0 8px 8px 0; }
.lineage__who { font-weight: 700; display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.lineage__tag { font: 600 .72rem/1 Archivo, sans-serif; padding: .28rem .5rem; border-radius: 999px; background: #eef0f2; color: var(--glen); }
.lineage__tag--ok { background: var(--tension-soft); color: var(--tension-ink); }
.lineage__when { font-weight: 600; } .lineage__where, .lineage__note { font-size: .88rem; color: #3a3e42; }
.owner-contact { margin-top: .75rem; display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.btn--ghost { background: transparent; color: var(--ink); border: 1px solid #9aa0a5; }
.btn--ghost:disabled { opacity: .6; cursor: not-allowed; }
.timeline { list-style: none; margin: 1rem 0 0; padding: 0 0 0 1rem; border-left: 2px solid #c9ccd0; }
.timeline__item { position: relative; display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 1rem; padding: 0 0 1.1rem; }
.timeline__item::before { content: ""; position: absolute; left: calc(-1rem - 6px); top: .35rem; width: 10px; height: 10px; border-radius: 50%; background: var(--tension-ink); border: 2px solid var(--paper); }
.timeline__date { font-size: .85rem; color: var(--glen); font-variant-numeric: tabular-nums; padding-top: .1rem; }
.timeline__body p { margin: .2rem 0 .35rem; font-size: .92rem; color: #3a3e42; }
.timeline__mi { margin-left: .5rem; font-size: .8rem; color: var(--glen); font-variant-numeric: tabular-nums; }
.ev__badge--static { cursor: default; }
.svc td, .svc th { font-size: .9rem; }
.docs { list-style: none; margin: 0; padding: 0; }
.docs__item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .75rem; align-items: center; padding: .6rem 0; border-bottom: 1px solid #d5d8db; }
.vis { font: 600 .74rem/1 Archivo, sans-serif; padding: .3rem .55rem; border-radius: 999px; }
.vis--public { background: var(--tension-soft); color: var(--tension-ink); }
.vis--future { background: #eef0f2; color: var(--glen); }
.vis--private { background: #fff; border: 1px dashed #9aa0a5; color: var(--glen); }
@media (max-width: 600px) {
    .timeline__item { grid-template-columns: minmax(0, 1fr); gap: .15rem; }
    .docs__item { grid-template-columns: minmax(0, 1fr) auto; }
}

/* Reconstructed window sticker and factory order */
.stk-page { padding-top: 2rem; padding-bottom: 3rem; }
.stk-back { margin: 0 0 1rem; }
.stk-warn { background: #fff8e6; border: 1px solid #e3c27a; color: #4a3200; border-radius: 8px; padding: .75rem 1rem; font-size: .9rem; max-width: 70rem; margin-bottom: 1.25rem; }
.docs-links { display: block; font-size: .85rem; margin-top: .3rem; }
.stk, .inv { position: relative; background: #fff; color: #111; border: 1px solid #c9ccd0; border-radius: 4px; padding: 1.25rem 1.4rem; max-width: 70rem;
    box-shadow: 0 2px 10px rgba(0,0,0,.06); font: 400 .78rem/1.35 "Arial Narrow", Archivo, sans-serif; font-variation-settings: "wdth" 80; overflow: hidden; }
.stk__stamp { position: absolute; right: -3.2rem; top: 1.6rem; transform: rotate(35deg); background: var(--tension-ink); color: #fff; font: 700 .7rem/1 Archivo, sans-serif;
    letter-spacing: .08em; text-transform: uppercase; padding: .35rem 5rem; opacity: .9; }
.stk__head { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; align-items: flex-start; padding-bottom: .9rem; border-bottom: 2px solid #111; }
.stk__model { font: 800 1.35rem/1.1 Archivo, sans-serif; font-variation-settings: "wdth" 75; margin: 0; max-width: 18rem; text-transform: uppercase; }
.stk__spec { display: grid; grid-template-columns: repeat(2, auto); gap: .1rem 2rem; margin: 0; font-weight: 700; text-transform: uppercase; font-size: .82rem; }
.stk__spec div { display: flex; gap: .35rem; } .stk__spec dd { margin: 0; }
.stk__body { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 1.25rem; margin-top: .9rem; }
.stk__std { columns: 3 11rem; column-gap: 1.1rem; }
.stk__grp { break-inside: avoid; margin-bottom: .7rem; }
.stk__h { font: 800 .85rem/1.2 Archivo, sans-serif; font-variation-settings: "wdth" 80; text-transform: uppercase; margin: 0 0 .3rem; }
.stk__h--bar { background: #111; color: #fff; padding: .3rem .5rem; }
.stk ul, .inv ul { list-style: none; margin: 0; padding: 0; }
.stk__grp li, .stk__inc li { text-transform: uppercase; padding-left: .7rem; position: relative; }
.stk__grp li::before, .stk__inc li::before { content: "•"; position: absolute; left: 0; }
.stk__fine { font-size: .7rem; text-transform: uppercase; color: #333; margin: .2rem 0 .45rem; }
.stk__right { text-align: right; }
.stk__base { display: flex; justify-content: space-between; border: 2px solid #111; padding: .35rem .5rem; font-weight: 800; text-transform: uppercase; margin-bottom: .5rem; }
.stk__optlist > li { margin-bottom: .45rem; break-inside: avoid; }
.stk__opt { display: flex; justify-content: space-between; gap: 1rem; text-transform: uppercase; font-weight: 600; }
.stk .num, .inv .num { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.stk__sum { margin: .6rem 0 .4rem; border-top: 1px solid #111; padding-top: .35rem; }
.stk__sum div { display: flex; justify-content: space-between; text-transform: uppercase; } .stk__sum dt, .stk__sum dd { margin: 0; }
.stk__total { display: flex; justify-content: space-between; border: 2px solid #111; padding: .4rem .55rem; font: 800 .95rem/1 Archivo, sans-serif; font-variation-settings: "wdth" 80; text-transform: uppercase; }
.stk__foot { margin-top: 1rem; border-top: 2px solid #111; padding-top: .6rem; }
.stk__foot dl { display: flex; flex-wrap: wrap; gap: .4rem 2rem; margin: 0 0 .4rem; text-transform: uppercase; }
.stk__foot dt { font-size: .68rem; color: #333; } .stk__foot dd { margin: 0; font-weight: 700; }
.stk-actions { margin-top: 1rem; }
/* Factory order: invoice-style, monospace */
.inv { font: 400 .82rem/1.35 ui-monospace, "Courier New", monospace; font-variation-settings: normal; max-width: 52rem; }
.inv__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem 2rem; border-bottom: 1px dashed #333; padding-bottom: .8rem; }
.inv__car { margin: 0; font: inherit; white-space: pre-wrap; }
.inv__meta { margin: 0; display: grid; gap: .15rem; }
.inv__meta div { display: grid; grid-template-columns: 7rem minmax(0, 1fr); } .inv__meta dt { text-transform: uppercase; } .inv__meta dd { margin: 0; }
.inv__tbl { width: 100%; border-collapse: collapse; margin-top: .6rem; }
.inv__tbl th { text-align: left; font-weight: 700; border-bottom: 1px dashed #333; padding: .25rem 0; }
.inv__tbl td { padding: .15rem 0; vertical-align: top; }
.inv__code { display: inline-block; width: 4.2rem; }
.inv__inc { margin-left: 4.2rem !important; } .inv__inc li::before { content: "* "; }
.inv__tbl tfoot td { border-top: 1px dashed #333; padding-top: .3rem; }
.inv__total td { font-weight: 700; }
@media (max-width: 760px) {
    .stk__body, .inv__top { grid-template-columns: minmax(0, 1fr); }
    .stk__std { columns: 2 9rem; }
}
@page { size: letter landscape; margin: .35in; }
@media print {
    .stk { font-size: .6rem; line-height: 1.25; padding: 0; } .stk__std { columns: 3; } .stk__opts .stk__inc { columns: 2; column-gap: .8rem; } .stk__body { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); } .stk-page { padding: 0; } .stk-warn { font-size: .7rem; padding: .35rem .6rem; margin-bottom: .5rem; }
    .masthead, .footer, .devbar, .stk-back, .stk-actions, .skip, .stk-warn { display: none !important; }
    body { background: #fff; }
    .stk, .inv { box-shadow: none; border: 0; max-width: none; }
    .stk-warn { border: 1px solid #999; }
}

/* Feedback */
/* Feedback: a small tab fixed to the bottom-right of every page (and a footer link) */
.fbtab { position: fixed; right: 1rem; bottom: 1rem; z-index: 30; font: 600 .82rem/1 Archivo, sans-serif; color: #fff; background: var(--carbon);
    border: 1px solid var(--tension); border-radius: 999px; padding: .55rem .9rem; text-decoration: none; box-shadow: 0 4px 14px rgba(0,0,0,.25); }
.fbtab:hover, .fbtab:focus-visible { background: var(--tension-ink); color: #fff; }
@media print { .fbtab { display: none; } }
.fb { padding-top: 2.5rem; padding-bottom: 3rem; max-width: 46rem; }
.fb__note { background: #fff8e6; border: 1px solid #e3c27a; color: #4a3200; border-radius: 8px; padding: .7rem .9rem; margin: 1rem 0 1.5rem; font-size: .92rem; }
.fb__form { display: grid; gap: 1.1rem; }
.fb__field { display: grid; gap: .35rem; font-weight: 600; border: 0; padding: 0; margin: 0; }
.fb__field legend { font-weight: 600; margin-bottom: .35rem; }
.fb__opt { display: flex; gap: .5rem; align-items: center; font-weight: 400; padding: .15rem 0; }
.fb__field textarea, .fb__field input[type=text], .fb__field input[type=email] { font: inherit; font-weight: 400; padding: .55rem .65rem; border: 1px solid #9aa0a5; border-radius: 6px; background: #fff; width: 100%; box-sizing: border-box; }
.fb__field textarea:focus-visible, .fb__field input:focus-visible { outline: 2px solid var(--tension-ink); outline-offset: 1px; }
.fb__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem; }
.fb__err { color: #a12a00; font-weight: 400; font-size: .85rem; }
.fb__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.footer__support a { color: var(--tension); }

/* The Car pages */
.prose-page { padding-top: 2rem; padding-bottom: 3rem; }
.prose-page .lede { max-width: 68ch; }
.prose-sec { margin-top: 2.25rem; max-width: 62rem; }
.prose-sec > p { max-width: 70ch; }
.pkg-hero { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem 2.5rem; margin: 1.5rem 0 .5rem; }
.pkg-hero__badge { width: min(100%, 30rem); height: auto; display: block; }
.swatches { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; font-size: .92rem; }
.swatches li { display: flex; align-items: center; gap: .6rem; }
.swatch { width: 1.6rem; height: 1.6rem; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15); display: inline-block; }
.swatch--satin { background: linear-gradient(135deg, #1b1c1e, #3a3c40 60%, #1b1c1e); }
.pkg-list { list-style: none; margin: 0; padding: 0; columns: 2 22rem; column-gap: 2rem; }
.pkg-list li { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr); gap: .6rem; padding: .45rem 0; border-bottom: 1px solid #d5d8db; break-inside: avoid; }
.cols-list { columns: 3 14rem; column-gap: 2rem; padding-left: 1.1rem; }
.cols-list li { margin-bottom: .25rem; break-inside: avoid; }
.opt-tbl { width: 100%; }
.opt-tbl td { vertical-align: top; }
.opt-tbl__note { display: block; font-size: .82rem; color: var(--glen); }
.opt-tbl__pct { display: inline-block; min-width: 2.8rem; color: var(--glen); font-size: .82rem; }
.opt-tbl__bar { width: 22%; }
.opt-tbl__bar span { display: block; height: .55rem; margin-top: .45rem; background: var(--tension-ink); border-radius: 0 3px 3px 0; min-width: 2px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 640px) { .opt-tbl__bar { display: none; } }
.ce-codes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr)); gap: 1.25rem; margin-top: 1.75rem; }
.ce-card { background: #fff; border-radius: 10px; padding: 1.1rem 1.25rem 1.25rem; border-top: 4px solid var(--tension-ink); }
.ce-card__code { font: 800 1.6rem/1 Archivo, sans-serif; font-variation-settings: var(--wide); margin: 0 0 .35rem; display: flex; align-items: baseline; gap: .75rem; }
.ce-card__code span { font-size: 1rem; font-weight: 600; color: var(--glen); }
.ce-card .h3 { margin: 0 0 .5rem; }
.pkg-list--one { columns: 1; }
.cols-list--one { columns: 1; margin: .25rem 0 0; }
.ce-steps { padding-left: 1.3rem; max-width: 70ch; } .ce-steps li { margin-bottom: .6rem; }
.ce-find { max-width: 34rem; margin-top: 1.25rem; }
.gmdocs { list-style: none; margin: 1.5rem 0 0; padding: 0; max-width: 62rem; }
.gmdoc { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem 2rem; align-items: center; padding: 1rem 0; border-bottom: 1px solid #d5d8db; }
.gmdoc .h3 { margin: .15rem 0 .35rem; } .gmdoc p { margin: 0; max-width: 64ch; }
.gmdoc__kind { font-size: .8rem; color: var(--glen); text-transform: uppercase; letter-spacing: .04em; }
.gmdoc__size { font-weight: 400; opacity: .8; margin-left: .3rem; }
.gmdoc__soon { font-size: .85rem; color: var(--glen); border: 1px dashed #9aa0a5; border-radius: 999px; padding: .35rem .7rem; }
@media (max-width: 600px) { .gmdoc { grid-template-columns: minmax(0, 1fr); } }
.price-ex { display: grid; grid-template-columns: minmax(0, 22rem) minmax(0, 1fr); gap: 1.5rem 2.5rem; align-items: start; }
.price-ex__badge { width: 100%; height: auto; display: block; }
.price-ex__side .plaque { margin-top: 1rem; }
@media (max-width: 760px) { .price-ex { grid-template-columns: minmax(0, 1fr); } }
.opt-tbl tr:target td { background: var(--tension-soft); } .opt-tbl tr { scroll-margin-top: 5rem; }
.md-steps { max-width: 70ch; padding-left: 1.2rem; } .md-steps li { margin-bottom: .35rem; }
.md-note { font-size: .82rem; color: #8a5a00; padding: 0 .3rem; }
.gs-photos { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(16rem, 28rem); gap: .75rem; overflow-x: auto; margin: 1.5rem 0 .25rem; padding-bottom: .5rem; scroll-snap-type: x mandatory; }
.gs-photos figure { margin: 0; scroll-snap-align: start; } .gs-photos img { width: 100%; height: 100%; object-fit: cover; border-radius: 6px; display: block; aspect-ratio: 16 / 10; }
.gs-facts { list-style: none; padding: 0; margin: 1rem 0; max-width: 62ch; } .gs-facts li { padding: .45rem 0; border-bottom: 1px solid #d5d8db; } .gs-facts strong { display: inline-block; min-width: 11rem; }

/* Phone review fixes (2026-10-11) */
a.btn, a.btn:hover { text-decoration: none; display: inline-flex; align-items: center; gap: .4rem; }
.footer__links { flex-wrap: wrap; gap: .6rem 1.5rem; }
.footer__links a { white-space: nowrap; }
.footer__inner { padding-bottom: 4.5rem; } /* keeps the Feedback tab clear of the last footer line */
@keyframes ev-rise { from { transform: translateY(1.5rem); opacity: 0; } to { transform: none; opacity: 1; } }
@media (max-width: 600px) { .ev.is-open .ev__pop, .ev:focus-within .ev__pop { animation: ev-rise .18s ease-out; } }
@media (prefers-reduced-motion: reduce) { .ev .ev__pop { animation: none !important; } }
.gs-photos__open { display: block; cursor: zoom-in; }
.lightbox { border: 0; padding: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100vw; height: 100vh; }
.lightbox::backdrop { background: rgba(10,11,12,.92); }
.lightbox__img { position: absolute; inset: 0; margin: auto; max-width: 94vw; max-height: 82vh; object-fit: contain; border-radius: 4px; }
.lightbox__count { position: absolute; left: 0; right: 0; bottom: 1.25rem; text-align: center; color: #c9cdd1; font-size: .9rem; margin: 0; }
.lightbox__btn, .lightbox__close { position: absolute; background: rgba(43,45,48,.85); color: #fff; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; width: 2.75rem; height: 2.75rem; font-size: 1.6rem; line-height: 1; cursor: pointer; }
.lightbox__prev { left: .75rem; top: 50%; transform: translateY(-50%); } .lightbox__next { right: .75rem; top: 50%; transform: translateY(-50%); }
.lightbox__close { right: .75rem; top: .75rem; }
.lightbox__btn:focus-visible, .lightbox__close:focus-visible { outline: 2px solid var(--tension); }
.nb-list { list-style: none; margin: 1.75rem 0 0; padding: 0; display: grid; gap: 1.25rem; max-width: 62rem; }
.nb-pair { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: .75rem 1.25rem; align-items: center; background: #fff; border-radius: 10px; padding: 1rem 1.1rem; }
.nb-pair p { margin: .35rem 0 0; }
.nb-badge { width: 100%; height: auto; display: block; }
.nb-badge--never { filter: grayscale(1) opacity(.55); }
.nb-pair__never p { color: var(--glen); }
.nb-pair__arrow { font-size: 1.6rem; color: var(--tension-ink); }
.nb-codes { display: flex; flex-wrap: wrap; gap: .3rem .6rem; font-size: .82rem; }
@media (max-width: 640px) { .nb-pair { grid-template-columns: minmax(0, 1fr); } .nb-pair__arrow { transform: rotate(90deg); justify-self: center; } }
.nt-toc { display: flex; flex-wrap: wrap; gap: .4rem .5rem; margin: 1.25rem 0 0; }
.nt-toc a { font-size: .85rem; padding: .3rem .65rem; border-radius: 999px; background: #fff; border: 1px solid #c9ccd0; text-decoration: none; color: var(--ink); }
.nt-toc a:hover { border-color: var(--tension-ink); color: var(--tension-ink); }
.nt-sec { scroll-margin-top: 5rem; }
.nt-n { font-size: .9rem; font-weight: 600; color: var(--glen); margin-left: .3rem; }
.car__notable { display: flex; flex-wrap: wrap; gap: .4rem; margin: .5rem 0 0; }
.car__notable a { font: 600 .75rem/1 Archivo, sans-serif; padding: .32rem .6rem; border-radius: 999px; background: var(--carbon); color: #fff; text-decoration: none; }
.car__notable a:hover { background: var(--tension-ink); }
main section[id], main h2[id] { scroll-margin-top: 1rem; }
.toc { margin: 1.25rem 0 0; }
.toc > summary { display: none; }
.toc .nt-toc { margin: 0; }
@media (max-width: 640px) {
    .toc { border: 1px solid #c9ccd0; border-radius: 8px; background: #fff; }
    .toc > summary { display: list-item; cursor: pointer; padding: .6rem .85rem; font-weight: 600; font-size: .92rem; }
    .toc[open] > summary { border-bottom: 1px solid #e3e5e7; }
    .toc .nt-toc { display: grid; gap: 0; padding: .25rem 0; }
    .toc .nt-toc a { border: 0; background: none; border-radius: 0; padding: .55rem .85rem; font-size: .95rem; color: var(--tension-ink); }
}
.weblinks { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); gap: 1rem; max-width: 66rem; }
.weblink { display: grid; gap: .3rem; height: 100%; box-sizing: border-box; background: #fff; border-radius: 10px; padding: 1rem 1.1rem; text-decoration: none; color: var(--ink); border-top: 3px solid var(--tension-ink); }
a.weblink:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); } a.weblink:hover strong { color: var(--tension-ink); }
.weblink span:last-child { font-size: .9rem; color: #3a3e42; }
.weblink__src { font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: var(--glen); }
.weblink--static { border-top-color: #b9bcc0; }

/* Collectables photos (2026-10-11) */
.weblink__fig { margin: -1rem -1.1rem .5rem; background: #f1f2f3; border-radius: 7px 7px 0 0; overflow: hidden; }
.weblink__fig img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: contain; }
.weblink__fig figcaption { font-size: .78rem; color: #5a5e62; padding: .35rem 1.1rem .1rem; }

/* Home: registry claim and ten-year reunion block (2026-10-11) */
.intro__brag { font-size: 1rem; color: var(--glen); max-width: 52ch; border-left: 3px solid var(--tension-ink); padding-left: .8rem; margin-top: 1rem; }
.anniv { background: var(--ink); color: #e8eaec; margin: 2rem 0; padding: 2.25rem 0; }
.anniv__in { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem 2.5rem; align-items: start; }
.anniv__ten { margin: 0; font-family: Montserrat, system-ui, sans-serif; font-weight: 700; font-size: clamp(4.5rem, 12vw, 8rem); line-height: .85; color: var(--tension-light); display: grid; }
.anniv__ten span { font-size: .2em; letter-spacing: .3em; text-transform: uppercase; color: var(--glen-light); font-weight: 600; margin-top: .6rem; }
.anniv__eyebrow { margin: 0; font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--glen-light); }
.anniv__h { margin: .35rem 0 .75rem; color: #fff; font-size: clamp(1.4rem, 3vw, 1.9rem); }
.anniv__text p { max-width: 62ch; }
.anniv a { color: var(--tension-light); }
.anniv__links { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; align-items: center; margin-top: 1.25rem; }
.anniv__links .btn { display: inline-block; background: var(--tension); color: var(--ink); font-weight: 600; text-decoration: none; padding: .6rem 1.1rem; border-radius: 6px; }
.anniv__links .btn:hover { background: #fff; }
@media (max-width: 640px) { .anniv__in { grid-template-columns: 1fr; } .anniv__ten { display: flex; align-items: baseline; gap: .6rem; font-size: 3.5rem; } .anniv__ten span { margin-top: 0; font-size: .26em; } }
.anniv { position: relative; background: linear-gradient(90deg, rgba(22,23,26,.94) 0%, rgba(22,23,26,.86) 55%, rgba(22,23,26,.62) 100%), var(--anniv-img) center / cover no-repeat, var(--ink); }
.anniv__credit { margin: 1rem auto 0; font-size: .72rem; color: var(--glen-light); }
@media (max-width: 640px) { .anniv { background: linear-gradient(rgba(22,23,26,.9), rgba(22,23,26,.9)), var(--anniv-img) center / cover no-repeat, var(--ink); } }
.anniv { background: linear-gradient(90deg, rgba(22,23,26,.94) 0%, rgba(22,23,26,.86) 55%, rgba(22,23,26,.6) 100%), var(--anniv-img) center / cover no-repeat, var(--ink); }
.anniv__credit { margin: 1rem auto 0; font-size: .72rem; color: var(--glen-light); }
@media (max-width: 640px) { .anniv { background: linear-gradient(rgba(22,23,26,.9), rgba(22,23,26,.9)), var(--anniv-img) center / cover no-repeat, var(--ink); } }
/* Collector Edition sits on the left of the GM track photo; use the cropped car, anchored right where the fade is lightest */
.anniv { background: linear-gradient(90deg, rgba(22,23,26,1) 0%, rgba(22,23,26,.95) 40%, rgba(22,23,26,.55) 70%, rgba(22,23,26,.25) 100%), var(--anniv-img) right center / auto 100% no-repeat, var(--ink); }
@media (max-width: 640px) { .anniv { background: linear-gradient(rgba(22,23,26,.88), rgba(22,23,26,.88)), var(--anniv-img) center / cover no-repeat, var(--ink); } }
/* image now carries its own soft left edge; keep the overlay light so the car reads */
.anniv { background: linear-gradient(90deg, rgba(22,23,26,1) 0%, rgba(22,23,26,1) 45%, rgba(22,23,26,.35) 80%, rgba(22,23,26,.2) 100%), var(--anniv-img) right center / auto 100% no-repeat, rgb(22,23,26); }
.anniv { background-position: 0 0, right 4% center, 0 0; }
/* tail of the car must stay clear: overlay is solid only behind the text, the photo keeps a short fade of its own */
.anniv { background: linear-gradient(90deg, rgba(22,23,26,1) 0%, rgba(22,23,26,1) 52%, rgba(22,23,26,.15) 64%, rgba(22,23,26,.1) 100%), var(--anniv-img) right center / auto 100% no-repeat, rgb(22,23,26); background-position: 0 0, right center, 0 0; }
@media (max-width: 640px) { .anniv { background: linear-gradient(rgba(22,23,26,.88), rgba(22,23,26,.88)), var(--anniv-img) center / cover no-repeat, rgb(22,23,26); } }
.interim { max-width: 62ch; background: var(--tension-soft); border-left: 3px solid var(--tension-ink); padding: .7rem 1rem; border-radius: 0 6px 6px 0; }
/* Notable Cars: short groups show each car on its own row with its own line of text (Ken, 2026-10-11) */
.nt-items { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .75rem; max-width: 62rem; }
.nt-item { display: grid; grid-template-columns: minmax(14rem, 18rem) minmax(0, 1fr); gap: 1.25rem; align-items: center; }
.nt-item__text { margin: 0; max-width: 60ch; }
@media (max-width: 640px) { .nt-item { grid-template-columns: 1fr; gap: .4rem; } }
/* Photo evidence under a car's note */
.evidence { margin: .5rem 0 1rem; max-width: 62ch; }
.evidence summary { cursor: pointer; color: var(--tension-ink); }
.evidence__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr)); gap: .75rem; margin-top: .75rem; }
.evidence figure { margin: 0; } .evidence img { width: 100%; height: auto; border-radius: 6px; display: block; }
.evidence figcaption { font-size: .8rem; color: var(--glen); margin-top: .25rem; }
.nt-photo { margin: 1rem 0 1.25rem; max-width: 34rem; }
.nt-photo img { width: 100%; height: auto; max-height: 30rem; object-fit: contain; object-position: left; border-radius: 8px; display: block; }
.nt-photo figcaption { font-size: .82rem; color: var(--glen); margin-top: .35rem; }
