/* ModManual V35 theme — light "shop manual" reading surface for guides,
   dark brand chrome (nav/footer), one type family (Barlow). */

:root{
  --mm-font:'Barlow',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --mm-head:'Barlow Condensed','Barlow',system-ui,'Segoe UI',Arial,sans-serif;
}
body, body *{font-family:var(--mm-font) !important;}
h1,h2,h3,h4,.atitle,.logo-text,.sn,.bname,.bprice,.hero h1{font-family:var(--mm-head) !important;}
code,pre,kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace !important;}

/* ---------- Reading theme (articles + hubs) ---------- */
body.mm-read{
  --bg:#e8eaeb; --bg2:#f4f5f6; --card:#ffffff; --border:#d3d8dc; --border2:#c3c9ce;
  --white:#15181b; --muted:#59616a; --dim:#6b737b;
  --red:#b52f16; --red2:#9f2812; --gold:#8a6a12; --green:#1f7a43; --yellow:#a86f00;
  --ink:#15181b; --ink2:#30363c;
  background:var(--bg); color:var(--ink);
  font-size:18px; line-height:1.7;
}
/* keep nav + footer in the dark brand palette */
body.mm-read nav, body.mm-read footer, body.mm-read .site-footer{
  --bg:#0c0c0c; --bg2:#111111; --card:#181818; --border:#262626; --border2:#303030;
  --white:#f0ece6; --muted:#a39b91; --dim:#6b6560; --red:#c73519;
}
body.mm-read footer{background:#101214;color:#f0ece6;}
body.mm-read footer p{color:#a39b91;}
body.mm-read .nav-links a{color:#c9c2b8;}
body.mm-read .nav-links a:hover,body.mm-read .nav-links a[aria-current="page"]{color:#fff;background:#1e2124;}

body.mm-read .ap, body.mm-read .wrap{max-width:760px;}
body.mm-read p, body.mm-read li, body.mm-read .wrap p, body.mm-read .wrap ul, body.mm-read .wrap ol,
body.mm-read ul.article-list, body.mm-read .vt td, body.mm-read td{color:var(--ink2);}
body.mm-read p{line-height:1.75;}
body.mm-read strong{color:var(--ink);}
body.mm-read .ap a:not([class]), body.mm-read .wrap a:not([class]){color:var(--red);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;}
body.mm-read .ap a:not([class]):hover, body.mm-read .wrap a:not([class]):hover{color:var(--ink);}
body.mm-read .related a, body.mm-read .nlinks a{color:var(--red);}

body.mm-read h1.atitle, body.mm-read .wrap h1{font-size:clamp(2.1rem,5.4vw,3.1rem);font-weight:700;letter-spacing:0;line-height:1.05;color:var(--ink);text-transform:none;}
body.mm-read h2{font-size:1.85rem;font-weight:700;letter-spacing:0;line-height:1.15;color:var(--ink);border-bottom:2px solid var(--ink);padding-bottom:.35rem;margin-top:2.75rem;}
body.mm-read h2::before{width:6px;height:1.1rem;border-radius:0;}
body.mm-read h3{font-size:1.35rem;font-weight:700;color:var(--ink);margin:1.75rem 0 .6rem;}

body.mm-read .atag, body.mm-read .tag{font-size:.9rem;letter-spacing:0;text-transform:none;color:var(--red);font-weight:600;}
body.mm-read .bc{font-size:.88rem;color:var(--muted);margin-bottom:1.5rem;}
body.mm-read .bc a{color:var(--muted);text-decoration:underline;text-underline-offset:3px;}
body.mm-read .adeck, body.mm-read .deck{font-size:1.12rem;color:var(--ink2);font-weight:400;border-left-color:var(--red);}
body.mm-read .ameta, body.mm-read .meta{font-size:.88rem;color:var(--muted);gap:.4rem 1.25rem;border-bottom-color:var(--border);}
body.mm-read .ameta a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;}

body.mm-read .callout{background:#fff;border:1px solid var(--border);border-left:4px solid var(--red);}
body.mm-read .callout.green{border-left-color:var(--green);}
body.mm-read .callout.yellow{border-left-color:#d49b00;background:#fffaf0;}
body.mm-read .icard, body.mm-read .sc, body.mm-read .bbox, body.mm-read .author,
body.mm-read .cause-card, body.mm-read .fix-box, body.mm-read .toc, body.mm-read .article-image{background:#fff;border-color:var(--border);}
body.mm-read .sl, body.mm-read .bdisc, body.mm-read .alab, body.mm-read .toc-title{letter-spacing:.02em;text-transform:none;font-size:.82rem;}
body.mm-read .vt th, body.mm-read th{font-size:.82rem;letter-spacing:.02em;text-transform:none;color:var(--ink);background:#f1f3f4;}
body.mm-read .vt th:nth-child(2){background:#f8e7e2;color:var(--red);}
body.mm-read .vt td:nth-child(2){background:#fcf5f3;color:var(--ink);}
body.mm-read table{width:100%;border-collapse:collapse;}
body.mm-read .vt, body.mm-read .qa-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;}
body.mm-read .vt td, body.mm-read .vt th{min-width:7.5rem;}
body.mm-read figcaption{color:var(--muted);font-size:.88rem;padding:.6rem .9rem;}

/* ---------- Quick answer plate (the one bold element) ---------- */
.qa-plate{position:relative;margin:0 0 2.25rem;padding:1.25rem 1.35rem 1rem;background:#fff;border:2px solid #15181b;border-top-width:6px;border-radius:4px;box-shadow:4px 4px 0 #15181b;}
.qa-plate p.qa-h, body.mm-read .qa-plate p.qa-h{font-family:var(--mm-head) !important;font-weight:700;font-size:1.15rem;color:#b52f16;margin:0 0 .5rem;line-height:1.2;}
.qa-plate p{margin:0 0 .75rem;color:#30363c;}
.qa-plate p:last-child{margin-bottom:0;}
.qa-plate table{font-size:.92rem;margin:.25rem 0 .9rem;}
.qa-table{margin:1.25rem 0 1.75rem;}
.qa-table table, .qa-plate table{width:100%;border-collapse:collapse;}
.qa-table th, .qa-table td, .qa-plate th, .qa-plate td{border-bottom:1px solid #d3d8dc;padding:.55rem .6rem;text-align:left;vertical-align:top;line-height:1.45;}
.qa-table th, .qa-plate th{background:#f1f3f4;color:#15181b;font-weight:600;}
.qa-plate td:first-child{font-weight:600;color:#15181b;white-space:nowrap;}
.qa-plate td:nth-child(2),.qa-table td:nth-child(2){min-width:9.5rem;}
.qa-fits{display:flex;flex-wrap:wrap;gap:.4rem;margin:.6rem 0 0 !important;}
.qa-fits span{font-size:.82rem;font-weight:600;color:#15181b;border:1.5px solid #15181b;border-radius:999px;padding:.12rem .65rem;line-height:1.5;}
.qa-fits::before{content:"Fits";font-size:.82rem;font-weight:700;color:#59616a;padding:.15rem .15rem 0 0;}

/* ---------- Series + hub navigation ---------- */
.mm-series{margin:3rem 0 0;padding:1.4rem 1.4rem 1.1rem;border:1px solid var(--border,#d3d8dc);background:var(--card,#fff);border-radius:4px;}
.mm-series h2{margin:0 0 .9rem !important;font-size:1.4rem !important;border:0 !important;padding:0 !important;}
.mm-series h2::before{display:none !important;}
.mm-series ul{list-style:none;margin:0;padding:0;display:grid;gap:.15rem;}
.mm-series li{border-top:1px solid var(--border,#d3d8dc);margin:0;}
.mm-series li a{display:block;padding:.6rem 0;font-weight:600;color:var(--ink,#15181b) !important;text-decoration:none !important;}
.mm-series li a:hover{color:var(--red,#b52f16) !important;}
.mm-series .mm-hub-link{display:inline-block;margin-top:.8rem;font-weight:600;color:var(--red,#b52f16) !important;}

.hub-intro{font-size:1.12rem;color:var(--ink2,#30363c);}
.hub-start{display:grid;gap:.75rem;margin:1.5rem 0 2rem;}
.hub-start a{display:block;padding:1rem 1.15rem;background:#fff;border:2px solid #15181b;border-radius:4px;text-decoration:none !important;color:#15181b !important;box-shadow:3px 3px 0 #15181b;}
.hub-start a strong{display:block;font-family:var(--mm-head) !important;font-size:1.25rem;line-height:1.2;}
.hub-start a span{display:block;color:#59616a;font-size:.95rem;margin-top:.2rem;}
.hub-list{list-style:none;margin:0 0 1rem;padding:0;}
.hub-list li{border-top:1px solid var(--border,#d3d8dc);padding:.75rem 0;margin:0;}
.hub-list li a{font-weight:600;font-size:1.05rem;color:var(--ink,#15181b) !important;text-decoration:none !important;}
.hub-list li a:hover{color:var(--red,#b52f16) !important;}
.hub-list li p{margin:.2rem 0 0 !important;font-size:.95rem;color:var(--muted,#59616a) !important;line-height:1.5;}
.hub-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.75rem;margin:1rem 0 2rem;}
.hub-cards a{display:block;padding:1rem;border:1px solid var(--border,#d3d8dc);background:var(--card,#fff);border-radius:4px;text-decoration:none !important;color:var(--white,#15181b) !important;}
.hub-cards a strong{display:block;font-family:var(--mm-head) !important;font-size:1.2rem;}
.hub-cards a span{display:block;font-size:.9rem;color:var(--muted,#59616a);margin-top:.2rem;}

a:focus-visible,button:focus-visible{outline:3px solid #e0a100;outline-offset:2px;}

/* ---------- Dark preference: keep the original dark look ---------- */
@media (prefers-color-scheme: dark){
  body.mm-read{
    --bg:#0c0c0c; --bg2:#111111; --card:#181818; --border:#262626; --border2:#303030;
    --white:#f0ece6; --muted:#a39b91; --dim:#6b6560; --red:#e0502f; --red2:#c73519;
    --ink:#f0ece6; --ink2:#c9c2b8; --green:#22c55e; --yellow:#eab308;
  }
  body.mm-read .callout, body.mm-read .icard, body.mm-read .sc, body.mm-read .bbox, body.mm-read .author,
  body.mm-read .cause-card, body.mm-read .fix-box, body.mm-read .toc, body.mm-read .article-image{background:var(--card);}
  body.mm-read .callout.yellow{background:var(--card);}
  body.mm-read .vt th, body.mm-read th{background:#1d1d1d;}
  body.mm-read .vt th:nth-child(2){background:rgba(230,58,26,.12);}
  body.mm-read .vt td:nth-child(2){background:rgba(230,58,26,.05);}
  body.mm-read h2{border-bottom-color:#3a3a3a;}
  .qa-plate{background:#14171a;border-color:#f0ece6;box-shadow:4px 4px 0 #c73519;}
  .qa-plate p{color:#d7d0c6;}
  .qa-plate th,.qa-table th{background:#1f2326;color:#f0ece6;}
  .qa-plate td:first-child{color:#f0ece6;}
  .qa-plate p.qa-h, body.mm-read .qa-plate p.qa-h{color:#ff7a57;}
  .qa-plate th,.qa-plate td,.qa-table th,.qa-table td{border-bottom-color:#33383d;}
  .qa-fits span{color:#f0ece6;border-color:#f0ece6;}
  .hub-start a{background:#14171a;color:#f0ece6 !important;border-color:#f0ece6;box-shadow:3px 3px 0 #c73519;}
  .hub-start a span{color:#a39b91;}
}
@media (max-width:768px){
  body.mm-read{font-size:17px;}
  .qa-plate{padding:1rem 1rem .9rem;box-shadow:3px 3px 0 #15181b;}
  .qa-plate td:first-child{white-space:normal;}
  body.mm-read h2{font-size:1.6rem;}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important;}}

/* nav with six cluster links: collapse earlier */
@media (max-width:1020px){
  .nav-links{display:none;}
  .nav-toggle{display:inline-flex !important;}
  .nav-links.is-open{display:flex !important;}
}
.nav-links a[aria-current="page"]{color:#fff;}

/* ---------- Homepage cards: photos instead of emoji ---------- */
.acard-thumb.has-img{padding:0;font-size:0;aspect-ratio:16/10;overflow:hidden;background:#111;}
.acard-thumb .acard-img{width:100%;height:100%;object-fit:cover;object-position:50% 72%;display:block;transition:transform .35s ease;}
.acard:hover .acard-img{transform:scale(1.03);}
.acard-thumb .acard-badge{z-index:1;}
.hcard-icon.has-img{width:56px;height:56px;border-radius:8px;overflow:hidden;flex:0 0 56px;font-size:0;}
.hcard-icon .hcard-img{width:100%;height:100%;object-fit:cover;object-position:50% 70%;display:block;}
.platform-card{overflow:hidden;}
.platform-card .platform-img{display:block;width:calc(100% + 4rem);max-width:none;height:190px;margin:-2rem -2rem 1.5rem;object-fit:cover;object-position:50% 70%;}
@media (max-width:768px){.platform-card .platform-img{height:170px;}}

/* ---------- Article icon cards: plain markers instead of emoji ---------- */
.icard .ico{font-size:0 !important;width:10px;height:10px;flex:0 0 10px;margin-top:.5rem !important;background:var(--red,#b52f16);border-radius:2px;}
