:root {
  /* C8Tracker blue palette — deliberately bluer than Hyper's violet-blue default */
  --c8-primary: #2869b5;
  --c8-primary-rgb: 40, 105, 181;
  --c8-primary-dark: #205a9d;
  --c8-primary-deep: #194d87;
  --c8-primary-soft: #eaf2fb;
  --c8-secondary: #6c757d;
  --c8-success: #18a66a;
  --c8-info: #3f82c4;
  --c8-warning: #f4b740;
  --c8-danger: #e55353;

  --c8-body-bg: #f4f6f9;
  --c8-card-bg: #ffffff;
  --c8-topbar-bg: rgba(255, 255, 255, .96);
  --c8-menu-bg: #215f9f; 
  --c8-menu-bg-dark: #1b5189;
  --c8-menu-text: rgba(255, 255, 255, .82);
  --c8-menu-text-active: #ffffff;
  --c8-text: #414b5a;
  --c8-heading: #343a40;
  --c8-muted: #8391a2;
  --c8-border: #e7ebf0;
  --c8-action-bg: #f8fafc;
  --c8-action-bg-hover: #eef3f8;
  --c8-radius: .42rem;
  --c8-shadow: 0 1px 4px rgba(31, 41, 55, .07);
  --c8-header-max: 1500px;
  --c8-topbar-height: 70px;
  --c8-menu-height: 54px;
  --c8-transition: 160ms ease;

  --stingray-color-border: #2869b5;
  --stingray-color-background: rgba(40,105,181,.08);
  --z06-color-border: #c23769;
  --z06-color-background: rgba(194,55,105,.08);
  --eray-color-border: #02bc77;
  --eray-color-background: rgba(2,188,119,.08);
  --zr1-color-border: #da681c;
  --zr1-color-background: rgba(218,104,28,.08);
  --zr1x-color-border: #894db8;
  --zr1x-color-background: rgba(137,77,184,.08);
  --grandSport-color-border: #c49118;
  --grandSport-color-background: rgba(196,145,24,.08);
  --grandSportX-color-border: #1497b0;
  --grandSportX-color-background: rgba(20,151,176,.08);



}

.stingray {
  background: var(--stingray-color-background);
  color: var(--stingray-color-border);
}

.z06 {
  background: var(--z06-color-background);
  color: var(--z06-color-border);
}

.eray {
  background: var(--eray-color-background);
  color: var(--eray-color-border);
}

.zr1 {
  background: var(--zr1-color-background);
  color: var(--zr1-color-border);
}

.zr1x {
  background: var(--zr1x-color-background);
  color: var(--zr1x-color-border);
}

.gs {
  background: var(--grandSport-color-background);
  color: var(--grandSport-color-border);
}

.gsx {
  background: var(--grandSportX-color-background);
  color: var(--grandSportX-color-border);
}

.c8-content {
  padding-top: 12px !important;
  padding-bottom: 6px !important;
}

[data-bs-theme="dark"] {
  --c8-body-bg: #171b22;
  --c8-card-bg: #202630;
  --c8-topbar-bg: rgba(32, 38, 48, .97);
  --c8-menu-bg: #194a7c;
  --c8-menu-bg-dark: #153f6a;
  --c8-text: #d8dde6;
  --c8-heading: #f2f4f7;
  --c8-muted: #98a2b3;
  --c8-border: #303846;
  --c8-action-bg: #272e39;
  --c8-action-bg-hover: #2e3744;
  --c8-primary-soft: rgba(var(--c8-primary-rgb), .15);
  --c8-shadow: 0 2px 12px rgba(0, 0, 0, .18);
}

html, body { min-height: 100%; }

body {
  margin: 0;
  background: var(--c8-body-bg);
  color: var(--c8-text);
  font-family: "Nunito", sans-serif;
  font-size: .925rem;
  line-height: 1.5;
  transition: background-color var(--c8-transition), color var(--c8-transition);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--c8-primary); text-decoration: none; }
a:hover { color: var(--c8-primary-dark); }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  color: var(--c8-heading);
  font-family: "Nunito", sans-serif;
  font-weight: 700;
  letter-spacing: -.01em;
}

.text-muted { color: var(--c8-muted) !important; }

/* Bootstrap color bridge */
.btn-primary {
  --bs-btn-bg: var(--c8-primary);
  --bs-btn-border-color: var(--c8-primary);
  --bs-btn-hover-bg: var(--c8-primary-dark);
  --bs-btn-hover-border-color: var(--c8-primary-dark);
  --bs-btn-active-bg: var(--c8-primary-dark);
  --bs-btn-active-border-color: var(--c8-primary-dark);
}
.btn-outline-primary {
  --bs-btn-color: var(--c8-primary);
  --bs-btn-border-color: var(--c8-primary);
  --bs-btn-hover-bg: var(--c8-primary);
  --bs-btn-hover-border-color: var(--c8-primary);
}

/* Theme-aware neutral button. Use this instead of Bootstrap .btn-light. */
.c8-btn-neutral {
  --bs-btn-color: var(--c8-heading);
  --bs-btn-bg: var(--c8-action-bg);
  --bs-btn-border-color: var(--c8-border);
  --bs-btn-hover-color: var(--c8-heading);
  --bs-btn-hover-bg: var(--c8-action-bg-hover);
  --bs-btn-hover-border-color: rgba(var(--c8-primary-rgb), .35);
  --bs-btn-focus-shadow-rgb: var(--c8-primary-rgb);
  --bs-btn-active-color: var(--c8-heading);
  --bs-btn-active-bg: var(--c8-action-bg-hover);
  --bs-btn-active-border-color: rgba(var(--c8-primary-rgb), .45);
  --bs-btn-disabled-color: var(--c8-muted);
  --bs-btn-disabled-bg: var(--c8-action-bg);
  --bs-btn-disabled-border-color: var(--c8-border);
}

.bg-primary-subtle { background-color: var(--c8-primary-soft) !important; }
.text-primary { color: var(--c8-primary) !important; }

.form-control, .form-select, .input-group-text {
  border-color: var(--c8-border);
  border-radius: .4rem;
  min-height: 40px;
  font-family: "Nunito", sans-serif;
}
.form-control:focus, .form-select:focus {
  border-color: rgba(var(--c8-primary-rgb), .55);
  box-shadow: 0 0 0 .2rem rgba(var(--c8-primary-rgb), .12);
}

/* Horizontal application shell */
.c8-app { min-height: 100vh; }
.c8-header-shell {
  position: sticky;
  top: 0;
  z-index: 1030;
  width: 100%;
}
.c8-header-container {
  width: 100%;
  max-width: var(--c8-header-max);
  margin-inline: auto;
  padding-inline: 1.5rem;
  display: flex;
  align-items: center;
}

.c8-topbar {
  min-height: var(--c8-topbar-height);
  display: flex;
  align-items: center;
  background: var(--c8-topbar-bg);
  border-bottom: 1px solid var(--c8-border);
  backdrop-filter: blur(10px);
  box-shadow: 0 1px 3px rgba(31, 41, 55, .035);
}

.c8-brand {
  min-height: var(--c8-topbar-height);
  display: flex;
  align-items: center;
  gap: .7rem;
  color: var(--c8-heading);
  flex: 0 0 auto;
}
.c8-brand:hover { color: var(--c8-heading); }
.c8-brand-mark {
  width: 38px;
  height: 38px;
  border-radius: 9px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  background: linear-gradient(135deg, #347bc7, #205a9d);
  box-shadow: 0 7px 16px rgba(var(--c8-primary-rgb), .25);
  color: #fff;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: -.04em;
}
.c8-brand-text {
  display: block;
  font-size: 1.08rem;
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.05;
}
.c8-brand-subtitle {
  display: block;
  color: var(--c8-muted);
  font-size: .61rem;
  font-weight: 700;
  letter-spacing: .075em;
  line-height: 1.3;
  text-transform: uppercase;
  margin-top: 2px;
}

.c8-mobile-menu-toggle { margin-left: 1rem; }
.c8-topbar-search { width: min(390px, 35vw); }
.c8-topbar-search .input-group-text,
.c8-topbar-search .form-control {
  background: var(--c8-body-bg);
  border: 0;
  min-height: 38px;
}
.c8-topbar-search .form-control { padding-left: .1rem; }
.c8-account-btn { border: 0; }
.c8-account-name { color: var(--c8-heading); font-size: .82rem; }
.c8-account-subtitle { font-size: .69rem; }
.c8-account-chevron { font-size: .7rem; }

/* Hyper-style horizontal navigation bar */
.c8-horizontal-nav {
  padding: 0;
  min-height: var(--c8-menu-height);
  background: linear-gradient(90deg, var(--c8-menu-bg), var(--c8-menu-bg-dark));
  box-shadow: 0 3px 10px rgba(24, 70, 116, .16);
}
.c8-horizontal-nav .navbar-collapse { width: 100%; }
.c8-menu { min-height: var(--c8-menu-height); align-items: stretch; gap: .08rem; }
.c8-menu .nav-item { display: flex; align-items: stretch; }
.c8-menu .nav-link {
  display: flex;
  align-items: center;
  gap: .48rem;
  min-height: var(--c8-menu-height);
  padding: 0 .92rem;
  color: var(--c8-menu-text);
  border-radius: 0;
  font-size: .86rem;
  font-weight: 700;
  transition: color var(--c8-transition), background-color var(--c8-transition);
}
.c8-menu .nav-link .bi { font-size: 1rem; }
.c8-menu .nav-link:hover,
.c8-menu .nav-link:focus,
.c8-menu .nav-link.active,
.c8-menu .show > .nav-link {
  color: var(--c8-menu-text-active);
  background: rgba(255, 255, 255, .105);
}
.c8-menu .dropdown-toggle::after {
  margin-left: .18rem;
  font-size: .68rem;
  opacity: .8;
}
.c8-menu-secondary .nav-link { padding-inline: .8rem; }

.c8-menu-dropdown {
  min-width: 205px;
  margin-top: 0 !important;
  padding: .45rem;
  border: 1px solid var(--c8-border);
  border-radius: .45rem;
  background: var(--c8-card-bg);
  box-shadow: 0 8px 28px rgba(31, 41, 55, .13);
}
.c8-menu-dropdown-wide { min-width: 225px; }
.c8-menu-dropdown .dropdown-item {
  padding: .48rem .62rem;
  border-radius: .32rem;
  color: var(--c8-text);
  font-size: .84rem;
  font-weight: 600;
}
.c8-menu-dropdown .dropdown-item:hover,
.c8-menu-dropdown .dropdown-item:focus {
  color: var(--c8-primary);
  background: var(--c8-primary-soft);
}
.c8-menu-dropdown .dropdown-item.active,
.c8-menu-dropdown .dropdown-item:active {
  color: var(--c8-primary);
  background: var(--c8-primary-soft);
}

.c8-main { min-height: calc(100vh - var(--c8-topbar-height) - var(--c8-menu-height)); }
.c8-content {
  width: 100%;
  max-width: var(--c8-header-max);
  margin-inline: auto;
  padding: 1.65rem 1.5rem 2.5rem;
}
.c8-page-header { margin-bottom: 1.25rem; }
.c8-page-title { margin: 0; font-size: 1.38rem; font-weight: 700; }
.c8-breadcrumb { --bs-breadcrumb-divider: '/'; margin: .28rem 0 0; font-size: .79rem; }
.c8-breadcrumb .breadcrumb-item.active { color: var(--c8-muted); }

/* Cards and common content */
.card {
  --bs-card-bg: var(--c8-card-bg);
  --bs-card-border-color: var(--c8-border);
  border: 0;
  border-radius: var(--c8-radius);
  box-shadow: var(--c8-shadow);
}
.card-header {
  background: transparent;
  border-bottom: 1px solid var(--c8-border);
  padding: 1rem 1.15rem;
}
.card-body { padding: 1.15rem; }
.c8-card-title { font-size: .97rem; margin: 0; font-weight: 700; }
.c8-card-subtitle { margin-top: .2rem; color: var(--c8-muted); font-size: .79rem; }

.c8-stat-card { position: relative; overflow: hidden; }
.c8-stat-card::after {
  content: "";
  position: absolute;
  width: 90px;
  height: 90px;
  right: -42px;
  top: -44px;
  border-radius: 50%;
  background: rgba(var(--c8-primary-rgb), .065);
}
.c8-stat-label { color: var(--c8-muted); text-transform: uppercase; letter-spacing: .055em; font-size: .69rem; font-weight: 700; }
.c8-stat-value { color: var(--c8-heading); font-size: 1.65rem; font-weight: 700; letter-spacing: -.025em; line-height: 1.2; }
.c8-stat-meta { font-size: .76rem; color: var(--c8-muted); }
.c8-stat-icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: inline-grid;
  place-items: center;
  background: var(--c8-primary-soft);
  color: var(--c8-primary);
  font-size: 1.12rem;
}

/* Theme-aware homepage/data quick links. */
.c8-jump-link {
  display: flex;
  align-items: center;
  width: 100%;
  background-color: var(--c8-action-bg) !important;
  border: 1px solid var(--c8-border) !important;
  border-radius: var(--c8-radius);
  color: var(--c8-text) !important;
  text-align: left;
  transition: background-color var(--c8-transition), border-color var(--c8-transition), transform var(--c8-transition), box-shadow var(--c8-transition);
}
.c8-jump-link strong { color: var(--c8-heading); }
.c8-jump-link .c8-stat-icon { flex: 0 0 auto; }
.c8-jump-link:hover,
.c8-jump-link:focus-visible {
  background-color: var(--c8-action-bg-hover) !important;
  border-color: rgba(var(--c8-primary-rgb), .35) !important;
  color: var(--c8-text) !important;
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(31, 41, 55, .08);
}
[data-bs-theme="dark"] .c8-jump-link {
  background-color: #272e39 !important;
  border-color: #303846 !important;
}
[data-bs-theme="dark"] .c8-jump-link:hover,
[data-bs-theme="dark"] .c8-jump-link:focus-visible {
  background-color: #2e3744 !important;
  border-color: rgba(var(--c8-primary-rgb), .45) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
}


.c8-pill {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  border-radius: 999px;
  padding: .3rem .6rem;
  font-size: .72rem;
  font-weight: 700;
  background: var(--c8-primary-soft);
  color: var(--c8-primary);
}

.c8-model-tabs { display: flex; flex-wrap: wrap; gap: .45rem; }
.c8-model-tabs .nav-link {
  padding: .4rem .75rem;
  border-radius: 999px;
  color: var(--c8-muted);
  background: transparent;
  border: 1px solid var(--c8-border);
  font-size: .8rem;
  font-weight: 700;
}
.c8-model-tabs .nav-link:hover { color: var(--c8-heading); }
.c8-model-tabs .nav-link.active { color: #fff; background: var(--c8-primary); border-color: var(--c8-primary); }

.table { --bs-table-bg: transparent; --bs-table-color: var(--c8-text); margin-bottom: 0; }
.table > :not(caption) > * > * { border-bottom-color: var(--c8-border); padding: .72rem .75rem; vertical-align: middle; }
.table thead th {
  color: var(--c8-muted);
  font-size: .69rem;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
  white-space: nowrap;
  border-bottom-width: 1px;
}
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: rgba(var(--c8-primary-rgb), .035); }
.c8-table-link { color: var(--c8-heading); font-weight: 700; }
.c8-table-link:hover { color: var(--c8-primary); }

.badge { font-weight: 700; letter-spacing: .01em; }
.c8-badge-us { background: #e9f2ff; color: #2768bd; }
.c8-badge-ca { background: #fff0f0; color: #be3f3f; }
[data-bs-theme="dark"] .c8-badge-us { background: rgba(59,142,243,.16); color: #7db7ff; }
[data-bs-theme="dark"] .c8-badge-ca { background: rgba(229,83,83,.16); color: #ff9696; }

.c8-progress-thin { height: 5px; background: var(--c8-border); }
.c8-progress-thin .progress-bar { background: var(--c8-primary); }

.c8-filter-bar { display: flex; align-items: end; gap: .75rem; flex-wrap: wrap; }
.c8-filter-group { min-width: 145px; }
.c8-filter-group.c8-grow { flex: 1 1 260px; }
.form-label { color: var(--c8-muted); font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .045em; margin-bottom: .35rem; }

.c8-empty-icon {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: var(--c8-primary-soft);
  color: var(--c8-primary);
  font-size: 1.35rem;
  margin: 0 auto .8rem;
}

.c8-footer {
  width: 100%;
  max-width: var(--c8-header-max);
  margin-inline: auto;
  padding: 1.25rem 1.5rem 1.75rem;
  color: var(--c8-muted);
  font-size: .78rem;
}
.c8-footer a { color: var(--c8-muted); }
.c8-footer a:hover { color: var(--c8-primary); }

.c8-icon-btn {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 0;
  border-radius: .4rem;
  color: var(--c8-muted);
  background: transparent;
}
.c8-icon-btn:hover { color: var(--c8-heading); background: var(--c8-body-bg); }

.c8-user-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--c8-primary-soft);
  color: var(--c8-primary);
  font-size: .8rem;
  font-weight: 800;
}

/* Desktop dropdowns open with a little more polish, while staying Bootstrap-native. */
@media (min-width: 992px) {
  .c8-horizontal-nav .dropdown:hover > .dropdown-menu { display: block; }
  .c8-horizontal-nav .dropdown-menu { top: 100%; }
}

/* Mobile horizontal menu becomes a compact stacked menu below the top bar. */
@media (max-width: 991.98px) {
  :root { --c8-menu-height: 0px; }
  .c8-header-container { padding-inline: 1rem; }
  .c8-topbar { min-height: 66px; }
  .c8-brand { min-height: 66px; }
  .c8-brand-subtitle { display: none; }
  .c8-horizontal-nav { min-height: 0; box-shadow: 0 5px 14px rgba(24, 70, 116, .18); }
  .c8-horizontal-nav .c8-header-container { display: block; padding-inline: 0; }
  .c8-horizontal-nav .navbar-collapse { width: 100%; }
  .c8-menu { min-height: 0; display: block; padding: .45rem .7rem .65rem; }
  .c8-menu .nav-item { display: block; }
  .c8-menu .nav-link {
    min-height: 42px;
    padding: .55rem .65rem;
    border-radius: .35rem;
  }
  .c8-menu-secondary { border-top: 1px solid rgba(255,255,255,.12); padding-top: .55rem; }
  .c8-menu-dropdown {
    position: static !important;
    transform: none !important;
    width: 100%;
    min-width: 0;
    margin: .15rem 0 .45rem !important;
    border: 0;
    box-shadow: none;
  }
  .c8-content { padding: 1.2rem 1rem 2rem; }
  .c8-footer { padding-inline: 1rem; }
}

@media (max-width: 575.98px) {
  .c8-brand-copy { display: none; }
  .c8-mobile-menu-toggle { margin-left: .45rem; }
  .c8-page-title { font-size: 1.2rem; }
  .card-body { padding: 1rem; }
  .c8-stat-value { font-size: 1.45rem; }
  .c8-filter-bar > * { width: 100%; min-width: 0; }
  .c8-filter-bar .btn { width: 100%; }
}

@media print {
  .c8-header-shell, .c8-footer { display: none !important; }
  .c8-main { margin: 0 !important; padding: 0 !important; }
  .c8-content { max-width: none; padding: 0 !important; }
  .card { box-shadow: none; border: 1px solid #ddd; }
}


/* --------------------------------------------------------------------------
   Expanded page patterns: home, authentication, FAQ, notices and list pages
   -------------------------------------------------------------------------- */
.c8-page-intro {
  max-width: 760px;
  color: var(--c8-muted);
  font-size: .9rem;
}
.c8-section-title { font-size: 1.05rem; margin-bottom: .25rem; }
.c8-section-copy { color: var(--c8-muted); font-size: .82rem; }

.c8-status-card { overflow: hidden; }
.c8-status-strip {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .85rem 1rem;
  background: linear-gradient(90deg, rgba(var(--c8-primary-rgb), .10), rgba(var(--c8-primary-rgb), .025));
  border-bottom: 1px solid var(--c8-border);
}
.c8-status-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--c8-success);
  box-shadow: 0 0 0 4px rgba(24, 166, 106, .12);
  flex: 0 0 auto;
}
.c8-status-dot.is-running { background: var(--c8-warning); box-shadow: 0 0 0 4px rgba(244,183,64,.14); }
.c8-status-dot.is-error { background: var(--c8-danger); box-shadow: 0 0 0 4px rgba(229,83,83,.13); }
.c8-status-label { font-size: .76rem; color: var(--c8-muted); }
.c8-status-value { color: var(--c8-heading); font-weight: 700; font-size: .87rem; }
.c8-status-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.c8-status-item { padding: 1rem; border-right: 1px solid var(--c8-border); }
.c8-status-item:last-child { border-right: 0; }

.c8-hero-card {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 90% 15%, rgba(var(--c8-primary-rgb), .18), transparent 32%),
    var(--c8-card-bg);
}
.c8-hero-card::after {
  content: "C8";
  position: absolute;
  right: 2rem;
  bottom: -3.1rem;
  color: rgba(var(--c8-primary-rgb), .045);
  font-size: 10rem;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -.08em;
  pointer-events: none;
}
.c8-hero-eyebrow { color: var(--c8-primary); text-transform: uppercase; letter-spacing: .08em; font-size: .7rem; font-weight: 800; }
.c8-hero-title { font-size: clamp(1.65rem, 3vw, 2.45rem); max-width: 760px; line-height: 1.16; }
.c8-hero-copy { max-width: 740px; color: var(--c8-muted); font-size: .96rem; }

.c8-chart-wrap { position: relative; min-height: 280px; }
.c8-chart-wrap-sm { position: relative; min-height: 250px; }
.c8-chart-legend { display: flex; flex-wrap: wrap; gap: .55rem 1rem; font-size: .76rem; color: var(--c8-muted); }
.c8-chart-key { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: .35rem; }

.c8-blog-item { padding: 1rem 0; border-bottom: 1px solid var(--c8-border); }
.c8-blog-item:first-child { padding-top: 0; }
.c8-blog-item:last-child { border-bottom: 0; padding-bottom: 0; }
.c8-blog-date { color: var(--c8-muted); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.c8-blog-title { font-size: .94rem; margin: .22rem 0 .3rem; }
.c8-blog-excerpt { color: var(--c8-muted); font-size: .82rem; margin: 0; line-height: 1.55; }

.c8-segmented {
  display: inline-flex;
  padding: .2rem;
  border: 1px solid var(--c8-border);
  border-radius: .42rem;
  background: var(--c8-body-bg);
}
.c8-segmented .btn {
  border: 0;
  border-radius: .28rem !important;
  padding: .32rem .68rem;
  color: var(--c8-muted);
  background: transparent;
  font-size: .78rem;
  font-weight: 700;
}
.c8-segmented .btn.active { color: #fff; background: var(--c8-primary); box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.c8-year-links { display: flex; flex-wrap: wrap; gap: .4rem; }
.c8-year-links a {
  min-width: 48px;
  padding: .34rem .55rem;
  text-align: center;
  color: var(--c8-muted);
  border: 1px solid var(--c8-border);
  border-radius: .35rem;
  font-size: .78rem;
  font-weight: 700;
}
.c8-year-links a:hover { color: var(--c8-primary); border-color: rgba(var(--c8-primary-rgb), .35); }
.c8-year-links a.active { color: #fff; background: var(--c8-primary); border-color: var(--c8-primary); }
.c8-result-count { font-size: 1.15rem; color: var(--c8-heading); font-weight: 700; }
.c8-table-meta { color: var(--c8-muted); font-size: .78rem; }

.c8-faq-search { max-width: 560px; }
.c8-faq-section + .c8-faq-section { margin-top: 1.5rem; }
.c8-faq-heading { margin-bottom: .75rem; }
.c8-faq-heading h2 { font-size: 1rem; margin-bottom: .15rem; }
.accordion { --bs-accordion-bg: var(--c8-card-bg); --bs-accordion-border-color: var(--c8-border); --bs-accordion-color: var(--c8-text); }
.accordion-item { border: 0; border-bottom: 1px solid var(--c8-border); }
.accordion-item:first-of-type, .accordion-item:first-of-type > .accordion-header .accordion-button { border-radius: 0; }
.accordion-button { color: var(--c8-heading); background: var(--c8-card-bg); font-weight: 700; font-size: .88rem; padding: 1rem 1.05rem; box-shadow: none !important; }
.accordion-button:not(.collapsed) { color: var(--c8-primary); background: var(--c8-primary-soft); }
.accordion-button::after { opacity: .7; }
.accordion-body { color: var(--c8-text); font-size: .87rem; line-height: 1.65; padding: 1rem 1.05rem 1.15rem; }

.c8-auth-body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(circle at 15% 10%, rgba(var(--c8-primary-rgb), .10), transparent 30%),
    radial-gradient(circle at 88% 86%, rgba(var(--c8-primary-rgb), .08), transparent 28%),
    var(--c8-body-bg);
}
.c8-auth-top { width: 100%; max-width: 1180px; margin-inline: auto; padding: 1.25rem 1.25rem 0; display: flex; align-items: center; justify-content: space-between; }
.c8-auth-main { flex: 1; display: grid; place-items: center; width: 100%; padding: 2rem 1rem 3rem; }
.c8-auth-card { width: min(100%, 430px); }
.c8-auth-card .card-body { padding: 2rem; }
.c8-auth-icon { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 14px; background: var(--c8-primary-soft); color: var(--c8-primary); font-size: 1.3rem; }
.c8-password-toggle { border-left: 0; }
.c8-auth-note { color: var(--c8-muted); font-size: .78rem; }

.c8-notice {
  position: relative;
  display: flex;
  gap: .85rem;
  padding: .9rem 1rem;
  border: 1px solid var(--c8-border);
  border-left-width: 4px;
  border-radius: .42rem;
  background: var(--c8-card-bg);
  box-shadow: 0 1px 3px rgba(31,41,55,.035);
}
.c8-notice-icon { width: 32px; height: 32px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; font-size: .92rem; }
.c8-notice-title { color: var(--c8-heading); font-size: .86rem; font-weight: 800; margin-bottom: .08rem; }
.c8-notice-copy { color: var(--c8-muted); font-size: .8rem; margin: 0; }
.c8-notice-success { border-left-color: var(--c8-success); }
.c8-notice-success .c8-notice-icon { color: var(--c8-success); background: rgba(24,166,106,.11); }
.c8-notice-danger { border-left-color: var(--c8-danger); }
.c8-notice-danger .c8-notice-icon { color: var(--c8-danger); background: rgba(229,83,83,.11); }
.c8-notice-warning { border-left-color: var(--c8-warning); }
.c8-notice-warning .c8-notice-icon { color: #a36d00; background: rgba(244,183,64,.16); }
.c8-notice-info { border-left-color: var(--c8-info); }
.c8-notice-info .c8-notice-icon { color: var(--c8-info); background: rgba(63,130,196,.12); }

@media (max-width: 767.98px) {
  .c8-status-grid { grid-template-columns: 1fr; }
  .c8-status-item { border-right: 0; border-bottom: 1px solid var(--c8-border); }
  .c8-status-item:last-child { border-bottom: 0; }
  .c8-hero-card::after { display: none; }
  .c8-auth-card .card-body { padding: 1.4rem; }
}


.c8-explore-link {
  display: flex;
  align-items: center;
  color: var(--c8-heading);
}
.c8-explore-link:hover,
.c8-explore-link:focus-visible {
  color: var(--c8-heading);
}

/* --------------------------------------------------------------------------
   Blog post detail page
   -------------------------------------------------------------------------- */
.c8-post-wrap { max-width: 1180px; margin-inline: auto; }
.c8-post-header { max-width: 900px; margin-bottom: 1.25rem; }
.c8-post-kicker {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: var(--c8-primary);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .065em;
  text-transform: uppercase;
}
.c8-post-title {
  margin: .55rem 0 .7rem;
  font-size: clamp(2rem, 5vw, 3.35rem);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.c8-post-dek {
  max-width: 820px;
  margin: 0;
  color: var(--c8-muted);
  font-size: clamp(1rem, 2vw, 1.18rem);
  line-height: 1.65;
}
.c8-post-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .55rem 1rem;
  padding-top: 1rem;
  color: var(--c8-muted);
  font-size: .8rem;
}
.c8-post-meta-item { display: inline-flex; align-items: center; gap: .35rem; }
.c8-post-meta-sep { width: 3px; height: 3px; border-radius: 50%; background: var(--c8-border); }
.c8-post-share { display: flex; flex-wrap: wrap; gap: .45rem; }
.c8-post-share .btn { min-width: 40px; }

.c8-post-feature {
  position: relative;
  overflow: hidden;
  min-height: 270px;
  display: flex;
  align-items: end;
  background:
    radial-gradient(circle at 82% 24%, rgba(255,255,255,.16), transparent 22%),
    linear-gradient(135deg, #2869b5 0%, #205a9d 55%, #173f6f 100%);
  color: #fff;
}
.c8-post-feature::before,
.c8-post-feature::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 50%;
}
.c8-post-feature::before { width: 290px; height: 290px; right: 4%; top: -145px; }
.c8-post-feature::after { width: 430px; height: 430px; right: -8%; top: -210px; }
.c8-post-feature-mark {
  position: absolute;
  right: 6%;
  bottom: -2.9rem;
  color: rgba(255,255,255,.075);
  font-size: clamp(8rem, 18vw, 15rem);
  line-height: 1;
  font-weight: 800;
  letter-spacing: -.1em;
  user-select: none;
}
.c8-post-feature-content { position: relative; z-index: 1; max-width: 720px; padding: 2rem; }
.c8-post-feature-eyebrow { color: rgba(255,255,255,.72); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.c8-post-feature-title { color: #fff; font-size: clamp(1.35rem, 3vw, 2rem); margin: .45rem 0 .25rem; }
.c8-post-feature-copy { color: rgba(255,255,255,.78); margin: 0; max-width: 610px; }

.c8-post-card .card-body { padding: clamp(1.25rem, 3vw, 2.35rem); }
.c8-post-body {
  max-width: 790px;
  color: var(--c8-text);
  font-size: 1rem;
  line-height: 1.82;
}
.c8-post-body > *:first-child { margin-top: 0; }
.c8-post-body p { margin-bottom: 1.35rem; }
.c8-post-body h2 {
  margin: 2.3rem 0 .8rem;
  font-size: 1.45rem;
  letter-spacing: -.02em;
}
.c8-post-body h3 { margin: 1.8rem 0 .65rem; font-size: 1.12rem; }
.c8-post-body ul,
.c8-post-body ol { margin: 0 0 1.35rem; padding-left: 1.35rem; }
.c8-post-body li + li { margin-top: .45rem; }
.c8-post-body strong { color: var(--c8-heading); }
.c8-post-body a { font-weight: 700; }
.c8-post-body hr { margin: 2rem 0; border-color: var(--c8-border); opacity: 1; }
.c8-post-lead {
  margin-bottom: 1.5rem !important;
  color: var(--c8-heading);
  font-size: 1.11rem;
  line-height: 1.78;
  font-weight: 600;
}
.c8-post-callout {
  margin: 1.6rem 0;
  padding: 1rem 1.1rem;
  border-left: 4px solid var(--c8-primary);
  border-radius: .25rem .4rem .4rem .25rem;
  background: var(--c8-primary-soft);
}
.c8-post-callout-title { color: var(--c8-primary); font-size: .82rem; font-weight: 800; text-transform: uppercase; letter-spacing: .045em; }
.c8-post-callout p:last-child { margin-bottom: 0; }
.c8-post-figure {
  margin: 1.8rem 0;
  padding: 1rem;
  border: 1px solid var(--c8-border);
  border-radius: var(--c8-radius);
  background: var(--c8-body-bg);
}
.c8-post-figure-chart { min-height: 310px; position: relative; }
.c8-post-caption { margin-top: .7rem; color: var(--c8-muted); font-size: .76rem; line-height: 1.5; }
.c8-post-quote {
  margin: 1.7rem 0;
  padding: .25rem 0 .25rem 1.2rem;
  border-left: 3px solid var(--c8-border);
  color: var(--c8-heading);
  font-size: 1.06rem;
  font-weight: 700;
  line-height: 1.65;
}
.c8-post-tags { display: flex; flex-wrap: wrap; gap: .4rem; }
.c8-post-tag {
  display: inline-flex;
  align-items: center;
  padding: .32rem .62rem;
  border: 1px solid var(--c8-border);
  border-radius: 999px;
  color: var(--c8-muted);
  background: var(--c8-body-bg);
  font-size: .75rem;
  font-weight: 700;
}
.c8-post-tag:hover { color: var(--c8-primary); border-color: rgba(var(--c8-primary-rgb), .35); }
.c8-post-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.c8-post-nav-link {
  display: block;
  height: 100%;
  padding: 1rem;
  border: 1px solid var(--c8-border);
  border-radius: var(--c8-radius);
  background: var(--c8-card-bg);
}
.c8-post-nav-link:hover { border-color: rgba(var(--c8-primary-rgb), .3); box-shadow: var(--c8-shadow); }
.c8-post-nav-label { color: var(--c8-muted); font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .055em; }
.c8-post-nav-title { display: block; margin-top: .3rem; color: var(--c8-heading); font-size: .88rem; font-weight: 700; line-height: 1.45; }
.c8-post-nav-link:hover .c8-post-nav-title { color: var(--c8-primary); }

.c8-post-sidebar { position: sticky; top: calc(var(--c8-topbar-height) + 1rem); }
.c8-post-side-list { list-style: none; margin: 0; padding: 0; }
.c8-post-side-list li { padding: .8rem 0; border-bottom: 1px solid var(--c8-border); }
.c8-post-side-list li:first-child { padding-top: 0; }
.c8-post-side-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.c8-post-side-date { color: var(--c8-muted); font-size: .69rem; font-weight: 700; text-transform: uppercase; letter-spacing: .035em; }
.c8-post-side-title { display: block; margin-top: .2rem; color: var(--c8-heading); font-size: .84rem; font-weight: 700; line-height: 1.45; }
.c8-post-side-title:hover { color: var(--c8-primary); }
.c8-post-status-row { display: flex; align-items: flex-start; gap: .7rem; }
.c8-post-status-icon {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: var(--c8-primary-soft);
  color: var(--c8-primary);
}

@media (max-width: 991.98px) {
  .c8-post-sidebar { position: static; }
  .c8-post-feature { min-height: 230px; }
}
@media (max-width: 575.98px) {
  .c8-post-meta-sep { display: none; }
  .c8-post-meta { gap: .45rem .85rem; }
  .c8-post-feature-content { padding: 1.35rem; }
  .c8-post-card .card-body { padding: 1.15rem; }
  .c8-post-body { font-size: .95rem; line-height: 1.75; }
  .c8-post-nav { grid-template-columns: 1fr; }
}

/* ==========================================================================
   User Profile + Edit Profile
   Shared styles for profile.html and edit-profile.html.
   Consolidated into the master theme so these pages require no inline CSS.
   ========================================================================== */

.c8-profile-hero {
      display: flex;
      align-items: center;
      gap: 1rem;
    }

    .c8-profile-avatar {
      width: 68px;
      height: 68px;
      flex: 0 0 68px;
      display: grid;
      place-items: center;
      border-radius: 18px;
      background: rgba(var(--c8-primary-rgb), .12);
      border: 1px solid rgba(var(--c8-primary-rgb), .16);
      color: var(--c8-primary);
      font-size: 1.3rem;
      font-weight: 800;
      letter-spacing: .02em;
    }

    .c8-profile-name {
      margin: 0;
      color: var(--c8-heading);
      font-size: 1.08rem;
      font-weight: 800;
    }

    .c8-profile-email {
      margin-top: .15rem;
      color: var(--c8-muted);
      font-size: .84rem;
    }

    .c8-profile-badges {
      display: flex;
      flex-wrap: wrap;
      gap: .45rem;
      margin-top: .7rem;
    }

    .c8-profile-badge {
      display: inline-flex;
      align-items: center;
      gap: .35rem;
      padding: .34rem .58rem;
      border-radius: 999px;
      font-size: .72rem;
      font-weight: 800;
      line-height: 1;
    }

    .c8-profile-badge-role {
      color: var(--c8-primary);
      background: rgba(var(--c8-primary-rgb), .11);
    }

    .c8-profile-badge-verified {
      color: var(--c8-success);
      background: rgba(24, 166, 106, .11);
    }

    .c8-profile-badge-unverified {
      color: var(--c8-warning);
      background: rgba(244, 183, 64, .13);
    }

    .c8-profile-fields {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      border-top: 1px solid var(--c8-border);
      border-left: 1px solid var(--c8-border);
      border-radius: .55rem;
      overflow: hidden;
    }

    .c8-profile-field {
      min-width: 0;
      padding: 1rem 1.05rem;
      border-right: 1px solid var(--c8-border);
      border-bottom: 1px solid var(--c8-border);
      background: var(--c8-card-bg);
    }

    .c8-profile-field-label {
      margin-bottom: .25rem;
      color: var(--c8-muted);
      font-size: .72rem;
      font-weight: 700;
      letter-spacing: .035em;
      text-transform: uppercase;
    }

    .c8-profile-field-value {
      color: var(--c8-heading);
      font-size: .9rem;
      font-weight: 700;
      overflow-wrap: anywhere;
    }

    .c8-log-summary {
      display: flex;
      align-items: center;
      gap: .5rem;
      color: var(--c8-muted);
      font-size: .78rem;
    }

    .c8-log-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--c8-success);
      box-shadow: 0 0 0 3px rgba(24, 166, 106, .10);
    }

    .c8-log-action {
      display: flex;
      align-items: flex-start;
      gap: .65rem;
    }

    .c8-log-icon {
      width: 31px;
      height: 31px;
      flex: 0 0 31px;
      display: grid;
      place-items: center;
      border-radius: 8px;
      color: var(--c8-primary);
      background: rgba(var(--c8-primary-rgb), .1);
    }

    .c8-log-title {
      color: var(--c8-heading);
      font-weight: 700;
      line-height: 1.2;
    }

    .c8-log-detail {
      margin-top: .15rem;
      color: var(--c8-muted);
      font-size: .76rem;
      line-height: 1.35;
    }

    .c8-status-pill {
      display: inline-flex;
      align-items: center;
      gap: .3rem;
      padding: .3rem .48rem;
      border-radius: 999px;
      font-size: .69rem;
      font-weight: 800;
      white-space: nowrap;
    }

    .c8-status-pill-success {
      color: var(--c8-success);
      background: rgba(24, 166, 106, .1);
    }

    .c8-status-pill-info {
      color: var(--c8-info);
      background: rgba(63, 130, 196, .11);
    }

    .c8-status-pill-warning {
      color: #b77800;
      background: rgba(244, 183, 64, .14);
    }

    [data-bs-theme="dark"] .c8-status-pill-warning {
      color: var(--c8-warning);
    }

    .c8-log-table td:first-child,
    .c8-log-table th:first-child {
      padding-left: 1rem;
    }

    .c8-log-table td:last-child,
    .c8-log-table th:last-child {
      padding-right: 1rem;
    }

    @media (max-width: 767.98px) {
      .c8-profile-fields {
        grid-template-columns: 1fr;
      }

      .c8-profile-hero {
        align-items: flex-start;
      }

      .c8-profile-avatar {
        width: 58px;
        height: 58px;
        flex-basis: 58px;
        border-radius: 15px;
      }
    }

/* Edit profile page */
    .c8-edit-form .form-label {
      margin-bottom: .42rem;
      color: var(--c8-heading);
      font-size: .78rem;
      font-weight: 800;
    }

    .c8-edit-form .form-text {
      margin-top: .4rem;
      color: var(--c8-muted);
      font-size: .73rem;
    }

    .c8-edit-form .form-control,
    .c8-edit-form .form-select {
      min-height: 42px;
    }

    .c8-edit-section + .c8-edit-section {
      margin-top: 1.6rem;
      padding-top: 1.6rem;
      border-top: 1px solid var(--c8-border);
    }

    .c8-edit-section-title {
      margin: 0 0 .2rem;
      color: var(--c8-heading);
      font-size: .9rem;
      font-weight: 800;
    }

    .c8-edit-section-copy {
      margin: 0 0 1rem;
      color: var(--c8-muted);
      font-size: .76rem;
    }

    .c8-edit-meta {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: .75rem;
    }

    .c8-edit-meta-item {
      padding: .8rem .9rem;
      border: 1px solid var(--c8-border);
      border-radius: .55rem;
      background: var(--c8-action-bg);
    }

    .c8-edit-meta-label {
      margin-bottom: .2rem;
      color: var(--c8-muted);
      font-size: .68rem;
      font-weight: 800;
      letter-spacing: .035em;
      text-transform: uppercase;
    }

    .c8-edit-meta-value {
      color: var(--c8-heading);
      font-size: .82rem;
      font-weight: 700;
    }

    .c8-setting-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      padding: .9rem 0;
    }

    .c8-setting-row + .c8-setting-row {
      border-top: 1px solid var(--c8-border);
    }

    .c8-setting-title {
      color: var(--c8-heading);
      font-size: .82rem;
      font-weight: 800;
    }

    .c8-setting-copy {
      margin-top: .15rem;
      color: var(--c8-muted);
      font-size: .73rem;
      line-height: 1.4;
    }

    .c8-edit-actions {
      position: sticky;
      bottom: 0;
      z-index: 5;
      margin: 1.5rem -.01rem 0;
      padding: .9rem 1rem;
      border-top: 1px solid var(--c8-border);
      background: color-mix(in srgb, var(--c8-card-bg) 94%, transparent);
      backdrop-filter: blur(9px);
    }

    .c8-danger-box {
      border: 1px solid rgba(229, 83, 83, .25);
      border-radius: .6rem;
      background: rgba(229, 83, 83, .045);
    }

    [data-bs-theme="dark"] .c8-danger-box {
      background: rgba(229, 83, 83, .06);
    }

    @media (max-width: 767.98px) {
      .c8-edit-meta {
        grid-template-columns: 1fr;
      }

      .c8-setting-row {
        align-items: flex-start;
      }
    }

/* ==========================================================================
   Vehicle detail page
   ========================================================================== */

/* Vehicle-detail-only styles. These intentionally build on c8tracker-theme.css. */
    /* Portal account menu: kept outside the sticky header so navigation can never cover it. */
    .c8-account-popover {
      position: fixed !important;
      z-index: 2147483000 !important;
      min-width: 220px;
      margin: 0 !important;
      background: var(--c8-card-bg);
      border: 1px solid var(--c8-border) !important;
      color: var(--c8-text);
    }
    .c8-account-popover .dropdown-item { color: var(--c8-text); }
    .c8-account-popover .dropdown-item:hover,
    .c8-account-popover .dropdown-item:focus { color: var(--c8-primary); background: var(--c8-primary-soft); }
    .c8-account-popover .dropdown-divider { border-color: var(--c8-border); }

    .c8-vehicle-title {
      font-size: clamp(1.45rem, 2.4vw, 2rem);
      margin: 0;
      letter-spacing: -.025em;
    }

    .c8-vin-line {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: .5rem;
      margin-top: .4rem;
      color: var(--c8-muted);
      font-size: .8rem;
    }

    .c8-vin-code {
      display: inline-flex;
      align-items: center;
      gap: .4rem;
      padding: .34rem .55rem;
      border: 1px solid var(--c8-border);
      border-radius: .38rem;
      background: var(--c8-action-bg);
      color: var(--c8-heading);
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
      font-size: .78rem;
      font-weight: 700;
      letter-spacing: .025em;
    }

    .c8-copy-vin {
      display: inline-grid;
      place-items: center;
      width: 28px;
      height: 28px;
      padding: 0;
      border: 0;
      border-radius: .35rem;
      background: transparent;
      color: var(--c8-muted);
    }
    .c8-copy-vin:hover { background: var(--c8-primary-soft); color: var(--c8-primary); }

    .c8-gallery-card .card-body { padding: .8rem; }

    .c8-vehicle-main-photo {
      position: relative;
      overflow: hidden;
      aspect-ratio: 16 / 9;
      border-radius: .48rem;
      background: #111827;
      border: 1px solid var(--c8-border);
    }

    .c8-vehicle-main-photo img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
      transition: opacity 150ms ease;
    }

    .c8-photo-count {
      position: absolute;
      right: .75rem;
      bottom: .75rem;
      display: inline-flex;
      align-items: center;
      gap: .35rem;
      padding: .34rem .55rem;
      border-radius: 999px;
      color: #fff;
      background: rgba(17, 24, 39, .72);
      backdrop-filter: blur(8px);
      font-size: .72rem;
      font-weight: 700;
    }

    .c8-photo-placeholder-note {
      position: absolute;
      left: .75rem;
      bottom: .75rem;
      padding: .34rem .55rem;
      border-radius: .35rem;
      color: rgba(255,255,255,.82);
      background: rgba(17, 24, 39, .58);
      backdrop-filter: blur(8px);
      font-size: .69rem;
      font-weight: 700;
    }

    .c8-photo-thumbs {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: .55rem;
      margin-top: .6rem;
    }

    .c8-photo-thumb {
      position: relative;
      overflow: hidden;
      aspect-ratio: 16 / 10;
      padding: 0;
      border: 2px solid transparent;
      border-radius: .42rem;
      background: var(--c8-action-bg);
      opacity: .72;
      transition: opacity var(--c8-transition), border-color var(--c8-transition), transform var(--c8-transition);
    }

    .c8-photo-thumb:hover { opacity: 1; transform: translateY(-1px); }
    .c8-photo-thumb.active { opacity: 1; border-color: var(--c8-primary); }
    .c8-photo-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

    .c8-vehicle-summary-card .card-body { padding: 1.25rem; }
    .c8-price-label {
      color: var(--c8-muted);
      font-size: .69rem;
      font-weight: 800;
      letter-spacing: .07em;
      text-transform: uppercase;
    }
    .c8-price-value {
      color: var(--c8-heading);
      font-size: 2rem;
      font-weight: 800;
      line-height: 1.15;
      letter-spacing: -.035em;
    }
    .c8-price-note { color: var(--c8-muted); font-size: .73rem; }

    .c8-detail-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0;
      border: 1px solid var(--c8-border);
      border-radius: .48rem;
      overflow: hidden;
    }

    .c8-detail-item {
      min-width: 0;
      padding: .85rem .9rem;
      background: var(--c8-card-bg);
      border-bottom: 1px solid var(--c8-border);
    }
    .c8-detail-item:nth-child(odd) { border-right: 1px solid var(--c8-border); }
    .c8-detail-item:nth-last-child(-n+2) { border-bottom: 0; }

    .c8-detail-label {
      margin-bottom: .22rem;
      color: var(--c8-muted);
      font-size: .66rem;
      font-weight: 800;
      letter-spacing: .055em;
      text-transform: uppercase;
    }
    .c8-detail-value {
      color: var(--c8-heading);
      font-size: .88rem;
      font-weight: 700;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }

    .c8-country-flag {
      display: inline-grid;
      place-items: center;
      width: 27px;
      height: 19px;
      margin-right: .35rem;
      border-radius: 2px;
      color: #fff;
      background: linear-gradient(to bottom,
        #b22234 0 7.7%, #fff 7.7% 15.4%, #b22234 15.4% 23.1%, #fff 23.1% 30.8%,
        #b22234 30.8% 38.5%, #fff 38.5% 46.2%, #b22234 46.2% 53.9%, #fff 53.9% 61.6%,
        #b22234 61.6% 69.3%, #fff 69.3% 77%, #b22234 77% 84.7%, #fff 84.7% 92.4%, #b22234 92.4% 100%);
      border: 1px solid rgba(0,0,0,.08);
      box-shadow: inset 11px 0 0 #3c3b6e;
      vertical-align: middle;
    }

    .c8-vehicle-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: .55rem;
    }

    .c8-info-row {
      display: grid;
      grid-template-columns: 150px minmax(0, 1fr);
      gap: 1rem;
      padding: .82rem 0;
      border-bottom: 1px solid var(--c8-border);
    }
    .c8-info-row:last-child { border-bottom: 0; }
    .c8-info-row-label { color: var(--c8-muted); font-size: .75rem; font-weight: 700; }
    .c8-info-row-value { color: var(--c8-heading); font-size: .86rem; font-weight: 700; }

    .c8-dealer-icon {
      width: 44px;
      height: 44px;
      display: inline-grid;
      place-items: center;
      flex: 0 0 auto;
      border-radius: .65rem;
      background: var(--c8-primary-soft);
      color: var(--c8-primary);
      font-size: 1.15rem;
    }

    .c8-options-summary {
      display: flex;
      flex-wrap: wrap;
      gap: .45rem;
    }

    .c8-option-code {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 46px;
      padding: .27rem .45rem;
      border-radius: .34rem;
      background: var(--c8-primary-soft);
      color: var(--c8-primary);
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
      font-size: .72rem;
      font-weight: 800;
    }

    .c8-option-category {
      display: inline-flex;
      align-items: center;
      padding: .24rem .46rem;
      border: 1px solid var(--c8-border);
      border-radius: 999px;
      color: var(--c8-muted);
      background: var(--c8-action-bg);
      font-size: .68rem;
      font-weight: 700;
    }

    .c8-photo-empty {
      display: grid;
      place-items: center;
      min-height: 260px;
      border: 1px dashed var(--c8-border);
      border-radius: .48rem;
      background: var(--c8-action-bg);
      color: var(--c8-muted);
      text-align: center;
    }

    @media (max-width: 767.98px) {
      .c8-photo-thumbs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .c8-detail-grid { grid-template-columns: 1fr; }
      .c8-detail-item:nth-child(odd) { border-right: 0; }
      .c8-detail-item:nth-last-child(-n+2) { border-bottom: 1px solid var(--c8-border); }
      .c8-detail-item:last-child { border-bottom: 0; }
      .c8-vehicle-actions { grid-template-columns: 1fr; }
      .c8-info-row { grid-template-columns: 1fr; gap: .25rem; }
      .c8-photo-placeholder-note { display: none; }
    }
