:root {
  color-scheme: dark;
  --ink: #e8e9e2;
  --muted: #a6ada4;
  --paper: #29312d;
  --line: #465049;
  --accent: #f17b5e;
  --green: #252d25;
}
body { background: var(--paper); }
.site-header { background: #222a26; position: relative; overflow: hidden; isolation: isolate; }
.site-header::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: min(1180px, calc(100% - 80px)); transform: translateX(-50%); background: url('/engine-photo-1200.webp') no-repeat right top -36px / 430px auto; opacity: .2; filter: grayscale(1) contrast(1.15); mix-blend-mode: screen; pointer-events: none; }
.header-inner { position: relative; z-index: 1; }
.brand-icon { background: #cf4f35; }
button, .button-link {
  background: #c84b32;
  border-color: #c84b32;
  color: #fff;
}
button:hover, .button-link:hover {
  background: #a93824;
  border-color: #a93824;
}
input, select {
  color: var(--ink);
  background: #202621;
  border-color: #535e52;
}
input::placeholder { color: #a3aaa1; opacity: 1; }
.hero-search {
  background: #202621;
  border-color: #53604f;
  box-shadow: 0 3px 0 #0e110f;
}
.hero-search input { background: transparent; }
.quick-search a, .text-link { border-color: #64715e; }
.make-card, .make-card.toyota, .make-card.nissan {
  background: #222923;
  border-color: #394337;
}
.make-card.toyota { background: #252c25; }
.make-card.nissan { background: #2b2823; }
.make-card:hover { background: #2d352d; }
.make-card-bottom { border-color: #414b3c; }
.circle-arrow { border-color: #66725e; }
.make-card:hover .circle-arrow { background: var(--accent); color: #141814; }
.featured:hover, .engine-table tbody tr:hover { background: #242c24; }
.site-footer { background: #202823; }
.footer-inner > span { border-color: var(--line); }
.breadcrumbs a { border-color: #58634f; }
.catalog-search, .filter-form { background: #222a22; }
.engine-table th { background: #222a23; }
.variant-id { color: #a3af9b; }
.legacy-badge { background: #293225; color: #c0cbb5; border-color: #526147; }
.detail-summary { background: #242e23; }
.not-recorded { color: #a5ae9e; }
.source-card { background: #252e23; }
.source-card a { border-color: #72825e; }
.status-dot.amber { background: #d7ac61; }
.pagination a { border-color: #66745b; }
.ad-placeholder { border-color: #4f5d47; }
.skip { background: #263023; color: #fff; }

/* The cropped photograph is deliberately presented against solid black. */
.hero-photo {
  margin: 0;
  padding: 0;
  background: #000;
  border: 1px solid #343a33;
  overflow: hidden;
}
.hero-photo img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  margin: 0;
  object-fit: contain;
  mix-blend-mode: normal;
}
.photo-heading, .photo-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 17px 20px;
  font: 8px/1.5 var(--mono);
  letter-spacing: 1.25px;
  color: #b5bdb0;
}
.photo-heading { border-bottom: 1px solid #292f28; }
.photo-caption { border-top: 1px solid #292f28; }
.photo-detail { color: #f17b5e; }
.review-notice { padding: 18px 22px; margin: -15px 0 28px; background: #302a1d; border: 1px solid #665437; color: #ebd5a9; }
.review-notice p { margin: 6px 0 0; font-size: 13px; }
.motor-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); gap: 16px; margin: 20px 0 28px; }
.motor-card { padding: 18px; border: 1px solid var(--line); background: #1d231c; }
.motor-card h3 { margin: 0 0 14px; font-size: 15px; }
.motor-card dl { margin: 0; font-size: 13px; }
.motor-card dt { color: var(--muted); margin-top: 10px; }
.motor-card dd { margin: 0; }
.power-conversion { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.4; letter-spacing: 0; text-transform: none; }
.detail-summary .power-conversion { font-size: 13px; }
.source-card li { margin: 10px 0; font-size: 12px; overflow-wrap: anywhere; }
.source-filters { display: flex; flex-wrap: wrap; gap: 10px 20px; margin: 22px 0; font-size: 12px; }
.source-filters a { padding: 5px 0; border-bottom: 1px solid var(--line); }
.source-filters a[aria-current] { border-bottom: 2px solid var(--accent); color: #f17b5e; }
.fitment-reference{margin:32px 0}.fitment-reference>.table-note{margin-bottom:25px}.fitment-generation{margin:30px 0}.fitment-generation>h3{font-size:25px;font-weight:500;border-bottom:1px solid var(--line);padding-bottom:15px}.fitment-generation>h3 span,.fitment-card h4 span{color:var(--muted);font-size:14px;margin-left:12px}.fitment-card h4{font-size:30px;font-weight:500;margin:12px 0}.fitment-card .fitment-code{color:var(--ink);font-size:14px}.fitment-code a{font:22px var(--mono);color:#f17b5e;display:block;margin-top:8px}.fitment-ratings{width:100%;border-collapse:collapse;font-size:12px;margin:20px 0}.fitment-ratings caption{text-align:left;color:var(--muted);padding:0 0 12px}.fitment-ratings th,.fitment-ratings td{padding:12px 4px;border-top:1px solid var(--line);text-align:left;vertical-align:top}.fitment-ratings th{font-size:10px;color:var(--muted)}.fitment-card details,.raw-source-records{font-size:12px;border-top:1px solid var(--line);padding:15px 0;margin-top:15px}.fitment-card summary,.raw-source-records>summary{cursor:pointer;color:var(--ink);font-weight:bold;line-height:1.6}.fitment-card li{margin:10px 0;overflow-wrap:anywhere}.fitment-card details ul{padding-left:18px}.fitment-ratings .power-conversion{font-size:10px}.raw-source-records{margin-bottom:40px}
.entity-tabs{display:flex;flex-wrap:wrap;gap:14px 25px;padding:22px 0;border-bottom:1px solid var(--line);font-size:12px}.entity-tabs a[aria-current]{color:#f17b5e}.entity-tabs.entity-discovery{margin-bottom:4px}.entity-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:25px 0 45px}.entity-card{padding:24px;border:1px solid var(--line);background:#151a17;min-width:0;overflow-wrap:anywhere}.entity-card h2{font-size:24px;font-weight:500;line-height:1.3;margin:12px 0}.entity-card p{font-size:12px;color:var(--muted)}.entity-card .text-link{display:inline-block;margin-top:15px}.entity-facts{font-size:12px}.entity-facts>div{display:grid;grid-template-columns:1fr 1fr;gap:15px;border-top:1px solid var(--line);padding:9px 0}.entity-facts dt{color:var(--muted)}.entity-facts dd{margin:0}@media(max-width:760px){.entity-grid{grid-template-columns:1fr}.entity-card{padding:20px}.entity-tabs{gap:12px 20px;font-size:11px}}
.advertisement { margin: 36px 0 44px; padding: 16px 0 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #101313; text-align: center; }
.advertisement[hidden] { display: none; }
.advertisement-label { margin: 0 0 12px; font: 9px var(--mono); letter-spacing: 1.2px; text-transform: uppercase; color: var(--muted); }
.advertisement .advertisement-preview { display: grid; place-items: center; border: 1px dashed #303737; background: #151919; color: #89918c; font: 10px var(--mono); }
.sitemap-links { display: flex; flex-wrap: wrap; gap: 16px 28px; padding-bottom: 25px; border-bottom: 1px solid var(--line); font-size: 13px; }
.sitemap-makes { list-style: none; padding: 0; margin: 24px 0 55px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0 30px; }
.sitemap-makes li { padding: 14px 0; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; font-size: 13px; }
.sitemap-makes span { display: block; color: var(--muted); margin-top: 3px; font-size: 11px; }
@media(max-width:760px) { .sitemap-makes { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 20px; } .advertisement { margin: 28px 0 34px; } }
@media (max-width: 760px) {
  .photo-heading, .photo-caption { padding: 14px 16px; font-size: 7px; letter-spacing: .8px; }
  .engine-table table { table-layout: fixed; white-space: normal; }
  .engine-table th:first-child, .engine-table td:first-child { width: 43%; overflow-wrap: anywhere; }
  .engine-table th:nth-child(2), .engine-table td:nth-child(2) { width: 24%; }
  .engine-table th:nth-child(3), .engine-table td:nth-child(3) { width: 23%; }
  .engine-table th:last-child, .engine-table td:last-child { width: 10%; }
  .engine-table th { letter-spacing: .2px; }
}

/* Keep the site's frame dark while giving content and advertising a calm, neutral canvas. */
.content-surface {
  --ink: #202925;
  --muted: #626a63;
  --paper: #f7f7f2;
  --line: #d7dbd2;
  --accent: #c84b32;
  --green: #e7eadf;
  color-scheme: light;
  color: var(--ink);
  margin-top: 0;
  margin-bottom: 0;
  padding: 0 40px;
  background: var(--paper);
  border: 1px solid #303731;
  box-shadow: 0 16px 40px rgba(0, 0, 0, .22);
}
.content-surface input, .content-surface select { color: var(--ink); background: #fff; border-color: #bfc4ba; }
.content-surface input::placeholder { color: #71786f; }
.content-surface .hero-search { background: #fff; border-color: #bfc4ba; box-shadow: 0 3px 0 #e9ebe2; }
.content-surface .make-card { background: #eeefe7; border-color: var(--line); }
.content-surface .make-card.toyota { background: #e7eade; }
.content-surface .make-card.nissan { background: #eee6db; }
.content-surface .make-card:hover { background: #f8f9f3; }
.content-surface .make-card-bottom { border-color: #d0d5c6; }
.content-surface .make-card:hover .circle-arrow { background: var(--ink); color: #fff; }
.content-surface .featured:hover, .content-surface .engine-table tbody tr:hover { background: #fff; }
.content-surface .catalog-search, .content-surface .filter-form { background: #eaece2; }
.content-surface .engine-table th { background: #edefe7; }
.content-surface .variant-id { color: #5b645c; }
.content-surface .legacy-badge { background: #edf0e5; color: #626c59; border-color: #c8d0be; }
.content-surface .detail-summary { background: #e9ecdf; }
.content-surface .not-recorded { color: #71796e; }
.content-surface .source-card { background: #edf0e6; }
.content-surface .source-card a { border-color: #a7b39b; }
.content-surface .pagination a { border-color: #b7c0b0; }
.content-surface .photo-heading, .content-surface .photo-caption { color: #b5bdb0; }
.content-surface .motor-card, .content-surface .entity-card { background: #fff; }
.content-surface .advertisement { background: #eef0e9; }
.content-surface .advertisement .advertisement-preview { border-color: #b9c1b5; background: #f8f9f5; color: #626a63; }
.content-surface .hero { grid-template-columns: minmax(0, 720px); }

@media (max-width: 760px) {
  .site-header::before { display: none; }
  .content-surface {
    width: calc(100% - 24px);
    margin-top: 0;
    margin-bottom: 0;
    padding: 0 18px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
  }
}