/*
 * The Avid Wargamer: shared brand and responsive layout correction, 14 Nov 2026.
 * Presentation only. Keeps article text, image ratios and established button treatment.
 */
:root {
  --awf-plum: #2f3c5c !important;
  --awf-oxblood: #2f3c5c !important;
}
body.awf-on.awf-look [style*="#5b3a5e" i],
body.awf-on.awf-look [style*="#8c2f23" i] {
  --awf-c: #2f3c5c !important;
}
body.awf-on.awf-look .awf-lead {
  --awf-c: #21332b !important;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  align-items: stretch !important;
  background: #21332b;
}
body.awf-on.awf-look .awf-lead__img {
  min-width: 0;
  align-self: center;
}
body.awf-on.awf-look .awf-lead__img img {
  display: block;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  object-fit: contain;
}
body.awf-on.awf-look .awf-lead__panel {
  min-width: 0;
  box-sizing: border-box;
  background: #21332b;
  color: #f4eedc;
  padding: clamp(20px, 2.2vw, 30px) !important;
  gap: 12px !important;
}
body.awf-on.awf-look .awf-lead__panel .awf-lead__h {
  font-size: clamp(28px, 2.8vw, 38px) !important;
  line-height: 1.12 !important;
  font-weight: 700 !important;
  overflow-wrap: break-word;
  margin: 0;
}
body.awf-on.awf-look .awf-lead__panel .awf-lead__h a { color: #fbf8ef !important; }
body.awf-on.awf-look .awf-lead__panel > p {
  font-size: 18px !important;
  line-height: 1.45 !important;
  color: #f4eedc;
}
body.awf-on.awf-look .awf-lead .awf-kicker {
  font-size: 13px !important;
  line-height: 1.4;
  margin: 0;
  color: #e6c98f !important;
}
body.awf-on.awf-look .awf-lead .awf-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 18px;
}
body.awf-on.awf-look .awf-lead .awf-btn {
  font-size: 16px !important;
  line-height: 1.35;
  padding: 10px 16px;
}
body.awf-on.awf-look .awf-lead .awf-btn--ghost { padding: 10px 0; }
body.awf-on.awf-look .awf-btn {
  box-sizing: border-box;
  max-width: 100%;
  min-height: 44px;
  white-space: normal;
}
body.awf-on.awf-look .awf-single__title {
  font-size: clamp(30px, 3.4vw, 44px) !important;
  line-height: 1.12 !important;
}
body.awf-on.awf-look .awf-starthere h2 { font-size: 26px; line-height: 1.2; }
body.awf-on.awf-look .awf-starthere__link { font-size: 16px !important; line-height: 1.5; }
body.awf-on.awf-look .awf-single__main,
body.awf-on.awf-look .awf-guide-main { overflow-wrap: break-word; }
body.awf-on.awf-look .wp-block-table { max-width: 100%; overflow-x: auto; }
body.awf-on.awf-look .awf-eo-form input { max-width: 100%; box-sizing: border-box; }
body.awf-on.awf-look .awf-lead a:focus-visible,
body.awf-on.awf-look .awf-btn:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
@media (max-width: 900px) {
  body.awf-on.awf-look .awf-lead { grid-template-columns: minmax(0, 1fr); }
  body.awf-on.awf-look .awf-lead__img { width: 100%; }
  body.awf-on.awf-look .awf-lead__panel { padding: 22px !important; }
  body.awf-on.awf-look .awf-lead__panel .awf-lead__h { font-size: 30px !important; }
}
@media (max-width: 600px) {
  body.awf-on.awf-look .awf-lead__panel { padding: 18px !important; gap: 10px !important; }
  body.awf-on.awf-look .awf-lead__panel .awf-lead__h { font-size: 27px !important; }
  body.awf-on.awf-look .awf-lead__panel > p { font-size: 17px !important; }
  body.awf-on.awf-look .awf-single__title { font-size: 30px !important; }
  body.awf-on.awf-look .awf-single__dek { font-size: 19px; }
  body.awf-on.awf-look .awf-single__main,
  body.awf-on.awf-look .awf-guide-main { font-size: 18px !important; line-height: 1.65 !important; }
  body.awf-on.awf-look .awf-starthere { padding: 20px; }
  body.awf-on.awf-look .awf-starthere h2 { font-size: 25px; }
}

/* Keep navigation keys and difficulty markers in the same brand palette. */
body.awf-on.awf-look .awf-dot[style*="#5b3a5e" i],
body.awf-on.awf-look .awf-dot[style*="#8c2f23" i],
body.awf-on.awf-look .awf-guide-legend .awf-dot--steep,
body.awf-on.awf-look .awf-rating--steep .awf-rating__dot {
  background: #2f3c5c !important;
}
body.awf-on.awf-look .awf-guide-legend .awf-dot:not(.awf-dot--homework):not(.awf-dot--steep),
body.awf-on.awf-look .awf-rating:not(.awf-rating--homework):not(.awf-rating--steep) .awf-rating__dot {
  background: #21332b;
}
body.awf-on.awf-look .awf-guide-legend .awf-dot--homework,
body.awf-on.awf-look .awf-rating--homework .awf-rating__dot {
  background: #7a5a2e;
}