:root {
  --mh4-bg: #eef1f3;
  --mh4-surface: #ffffff;
  --mh4-surface-2: #f7f8f9;
  --mh4-ink: #182027;
  --mh4-ink-soft: #52606b;
  --mh4-line: #d5dce1;
  --mh4-line-strong: #b8c2c9;
  --mh4-steel-950: #11171c;
  --mh4-steel-900: #171f26;
  --mh4-steel-850: #1e2830;
  --mh4-steel-800: #26323b;
  --mh4-steel-700: #34434d;
  --mh4-ember: #d9563d;
  --mh4-ember-dark: #a63c2b;
  --mh4-brass: #c89b42;
  --mh4-brass-light: #e1c171;
  --mh4-blue: #32728f;
  --mh4-link: #215f86;
  --mh4-link-hover: #b84432;
  --mh4-success: #3b7a5c;
  --mh4-danger: #b83f36;
  --mh4-radius: 14px;
  --mh4-radius-sm: 9px;
  --mh4-shadow: 0 10px 30px rgba(18, 30, 39, .09);
  --mh4-shadow-soft: 0 3px 14px rgba(18, 30, 39, .07);
  --mh4-max: 1240px;
  --mh4-font: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, Meiryo, sans-serif;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 92px;
}

body.mh4-modern {
  margin: 0 !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(200, 155, 66, .08), transparent 28rem),
    linear-gradient(180deg, #f7f8f9 0, var(--mh4-bg) 320px, var(--mh4-bg) 100%) !important;
  color: var(--mh4-ink) !important;
  font-family: var(--mh4-font) !important;
  font-size: 15px;
  line-height: 1.7;
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

body.mh4-modern *,
body.mh4-modern *::before,
body.mh4-modern *::after {
  box-sizing: border-box;
}

body.mh4-modern img {
  max-width: 100%;
}

body.mh4-modern a {
  color: var(--mh4-link);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

body.mh4-modern a:hover {
  color: var(--mh4-link-hover);
}

body.mh4-modern a:focus-visible,
body.mh4-modern button:focus-visible,
body.mh4-modern input:focus-visible,
body.mh4-modern select:focus-visible,
body.mh4-modern textarea:focus-visible,
body.mh4-modern [tabindex="0"]:focus-visible {
  outline: 3px solid rgba(200, 155, 66, .55) !important;
  outline-offset: 2px;
}

.mh4-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.mh4-skip-link {
  position: fixed;
  left: 16px;
  top: 8px;
  z-index: 9999;
  transform: translateY(-160%);
  padding: 9px 14px;
  border-radius: 8px;
  background: #fff;
  color: #111 !important;
  font-weight: 700;
  box-shadow: var(--mh4-shadow-soft);
  transition: transform .18s ease;
}

.mh4-skip-link:focus {
  transform: translateY(0);
}

.mh4-icon {
  display: inline-block;
  width: 1.18em;
  height: 1.18em;
  flex: 0 0 auto;
  background: currentColor;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}
.mh4-i-armor { -webkit-mask-image: url("/mh4/assets/icons/armor.svg"); mask-image: url("/mh4/assets/icons/armor.svg"); }
.mh4-i-arrow-up { -webkit-mask-image: url("/mh4/assets/icons/arrow-up.svg"); mask-image: url("/mh4/assets/icons/arrow-up.svg"); }
.mh4-i-board { -webkit-mask-image: url("/mh4/assets/icons/board.svg"); mask-image: url("/mh4/assets/icons/board.svg"); }
.mh4-i-bow { -webkit-mask-image: url("/mh4/assets/icons/bow.svg"); mask-image: url("/mh4/assets/icons/bow.svg"); }
.mh4-i-chevron { -webkit-mask-image: url("/mh4/assets/icons/chevron.svg"); mask-image: url("/mh4/assets/icons/chevron.svg"); }
.mh4-i-claw { -webkit-mask-image: url("/mh4/assets/icons/claw.svg"); mask-image: url("/mh4/assets/icons/claw.svg"); }
.mh4-i-close { -webkit-mask-image: url("/mh4/assets/icons/close.svg"); mask-image: url("/mh4/assets/icons/close.svg"); }
.mh4-i-crossmark { -webkit-mask-image: url("/mh4/assets/icons/crossmark.svg"); mask-image: url("/mh4/assets/icons/crossmark.svg"); }
.mh4-i-dual { -webkit-mask-image: url("/mh4/assets/icons/dual.svg"); mask-image: url("/mh4/assets/icons/dual.svg"); }
.mh4-i-faq { -webkit-mask-image: url("/mh4/assets/icons/faq.svg"); mask-image: url("/mh4/assets/icons/faq.svg"); }
.mh4-i-fire { -webkit-mask-image: url("/mh4/assets/icons/fire.svg"); mask-image: url("/mh4/assets/icons/fire.svg"); }
.mh4-i-forge { -webkit-mask-image: url("/mh4/assets/icons/forge.svg"); mask-image: url("/mh4/assets/icons/forge.svg"); }
.mh4-i-gem { -webkit-mask-image: url("/mh4/assets/icons/gem.svg"); mask-image: url("/mh4/assets/icons/gem.svg"); }
.mh4-i-gun { -webkit-mask-image: url("/mh4/assets/icons/gun.svg"); mask-image: url("/mh4/assets/icons/gun.svg"); }
.mh4-i-home { -webkit-mask-image: url("/mh4/assets/icons/home.svg"); mask-image: url("/mh4/assets/icons/home.svg"); }
.mh4-i-hunter-art { -webkit-mask-image: url("/mh4/assets/icons/hunter-art.svg"); mask-image: url("/mh4/assets/icons/hunter-art.svg"); }
.mh4-i-info { -webkit-mask-image: url("/mh4/assets/icons/info.svg"); mask-image: url("/mh4/assets/icons/info.svg"); }
.mh4-i-list { -webkit-mask-image: url("/mh4/assets/icons/list.svg"); mask-image: url("/mh4/assets/icons/list.svg"); }
.mh4-i-map { -webkit-mask-image: url("/mh4/assets/icons/map.svg"); mask-image: url("/mh4/assets/icons/map.svg"); }
.mh4-i-meal { -webkit-mask-image: url("/mh4/assets/icons/meal.svg"); mask-image: url("/mh4/assets/icons/meal.svg"); }
.mh4-i-menu { -webkit-mask-image: url("/mh4/assets/icons/menu.svg"); mask-image: url("/mh4/assets/icons/menu.svg"); }
.mh4-i-palico { -webkit-mask-image: url("/mh4/assets/icons/palico.svg"); mask-image: url("/mh4/assets/icons/palico.svg"); }
.mh4-i-pouch { -webkit-mask-image: url("/mh4/assets/icons/pouch.svg"); mask-image: url("/mh4/assets/icons/pouch.svg"); }
.mh4-i-quest { -webkit-mask-image: url("/mh4/assets/icons/quest.svg"); mask-image: url("/mh4/assets/icons/quest.svg"); }
.mh4-i-ranking { -webkit-mask-image: url("/mh4/assets/icons/ranking.svg"); mask-image: url("/mh4/assets/icons/ranking.svg"); }
.mh4-i-search { -webkit-mask-image: url("/mh4/assets/icons/search.svg"); mask-image: url("/mh4/assets/icons/search.svg"); }
.mh4-i-shield { -webkit-mask-image: url("/mh4/assets/icons/shield.svg"); mask-image: url("/mh4/assets/icons/shield.svg"); }
.mh4-i-skill { -webkit-mask-image: url("/mh4/assets/icons/skill.svg"); mask-image: url("/mh4/assets/icons/skill.svg"); }
.mh4-i-style { -webkit-mask-image: url("/mh4/assets/icons/style.svg"); mask-image: url("/mh4/assets/icons/style.svg"); }
.mh4-i-sword { -webkit-mask-image: url("/mh4/assets/icons/sword.svg"); mask-image: url("/mh4/assets/icons/sword.svg"); }
.mh4-i-target { -webkit-mask-image: url("/mh4/assets/icons/target.svg"); mask-image: url("/mh4/assets/icons/target.svg"); }
.mh4-i-trade { -webkit-mask-image: url("/mh4/assets/icons/trade.svg"); mask-image: url("/mh4/assets/icons/trade.svg"); }

/* Global site header */
.mh4-site-header {
  position: sticky;
  top: 0;
  z-index: 1200;
  width: 100%;
  color: #f5f7f8;
  background:
    linear-gradient(120deg, rgba(255,255,255,.035) 0 22%, transparent 22% 30%, rgba(255,255,255,.025) 30% 32%, transparent 32%),
    linear-gradient(180deg, #1b242b 0%, #12191f 100%);
  border-bottom: 1px solid rgba(225, 193, 113, .5);
  box-shadow: 0 8px 24px rgba(7, 12, 16, .22);
}

.mh4-site-header::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, var(--mh4-ember), var(--mh4-brass), transparent);
  opacity: .8;
}

.mh4-site-header__inner {
  width: min(var(--mh4-max), calc(100% - 28px));
  min-height: 68px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
}

.mh4-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: max-content;
  color: #fff !important;
  text-decoration: none !important;
}

.mh4-brand__mark {
  position: relative;
  display: grid;
  place-items: center;
  width: 43px;
  height: 43px;
  color: var(--mh4-brass-light);
  border: 1px solid rgba(225, 193, 113, .52);
  background: linear-gradient(145deg, rgba(217, 86, 61, .22), rgba(200, 155, 66, .08));
  clip-path: polygon(18% 0, 82% 0, 100% 18%, 100% 82%, 82% 100%, 18% 100%, 0 82%, 0 18%);
}

.mh4-brand__mark::before,
.mh4-brand__mark::after {
  content: "";
  position: absolute;
  inset: 5px 20px;
  background: currentColor;
  opacity: .16;
  transform: rotate(45deg);
}

.mh4-brand__mark::after {
  transform: rotate(-45deg);
}

.mh4-brand__mark .mh4-icon {
  position: relative;
  z-index: 1;
  width: 24px;
  height: 24px;
}

.mh4-brand__text {
  display: flex;
  flex-direction: column;
  line-height: 1.05;
}

.mh4-brand__text strong {
  font-size: 20px;
  letter-spacing: .02em;
  color: #fff;
}

.mh4-brand__text small {
  margin-top: 5px;
  color: #aeb9c1;
  font-size: 9px;
  letter-spacing: .18em;
  font-weight: 700;
}

.mh4-global-nav {
  min-width: 0;
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 3px;
}

.mh4-global-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  padding: 8px 9px;
  border-radius: 8px;
  color: #dbe1e5 !important;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  text-decoration: none !important;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}

.mh4-global-link .mh4-icon {
  width: 17px;
  height: 17px;
  color: #aab5bc;
}

.mh4-global-link:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, .075);
  transform: translateY(-1px);
}

.mh4-global-link:hover .mh4-icon,
.mh4-global-link.is-active .mh4-icon {
  color: var(--mh4-brass-light);
}

.mh4-global-link.is-active {
  color: #fff !important;
  background: linear-gradient(180deg, rgba(217, 86, 61, .2), rgba(200, 155, 66, .08));
  box-shadow: inset 0 0 0 1px rgba(225, 193, 113, .22);
}

.mh4-global-link.is-active::after {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 2px;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--mh4-ember), var(--mh4-brass));
}

.mh4-header-search {
  position: relative;
  display: flex;
  align-items: center;
  width: 242px;
  height: 38px;
  border: 1px solid #46545e;
  border-radius: 9px;
  overflow: hidden;
  background: #0e1419;
}

.mh4-header-search > .mh4-icon {
  position: absolute;
  left: 10px;
  width: 16px;
  height: 16px;
  color: #98a5ae;
  pointer-events: none;
}

.mh4-header-search input[type="search"] {
  width: 100% !important;
  min-width: 0;
  height: 100%;
  padding: 0 58px 0 34px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #f5f7f8 !important;
  font: inherit;
  font-size: 12px !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.mh4-header-search input::placeholder {
  color: #87959f;
  opacity: 1;
}

.mh4-header-search button {
  position: absolute;
  top: 4px;
  right: 4px;
  bottom: 4px;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: linear-gradient(180deg, #b64a36, #943524) !important;
  color: #fff !important;
  font: inherit;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}

.mh4-menu-button {
  display: none;
}

/* Legacy duplicate PC navigation is replaced by the global header. */
body.mh4-modern #subheader {
  display: none !important;
}

body.mh4-modern > table[height="30"][bgcolor="#222233"],
body.mh4-modern > table[height="30"][bgcolor="#222933"] {
  display: none !important;
}

/* Main shell */
body.mh4-modern #container {
  width: min(var(--mh4-max), calc(100% - 28px)) !important;
  max-width: var(--mh4-max) !important;
  margin: 22px auto 32px !important;
  padding: 0 !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

@media (min-width: 1051px) {
  body.mh4-modern:not(.mh4-home) #container {
    display: flex !important;
    align-items: flex-start;
    gap: 24px;
  }
  body.mh4-modern:not(.mh4-home) #main {
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    flex: 1 1 auto;
  }
  body.mh4-modern:not(.mh4-home) #side {
    float: none !important;
    width: 300px !important;
    flex: 0 0 300px;
    margin: 0 !important;
  }
}

body.mh4-modern #main {
  color: var(--mh4-ink);
}

body.mh4-modern #side {
  color: var(--mh4-ink);
}

/* Page title bands emitted by legacy templates. */
body.mh4-modern > table[align="center"] {
  width: min(var(--mh4-max), calc(100% - 28px)) !important;
  margin: 20px auto 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden;
  border-radius: var(--mh4-radius) !important;
  background: transparent !important;
  box-shadow: var(--mh4-shadow-soft);
}

body.mh4-modern > table[align="center"] > tbody > tr > td[bgcolor="#222233"],
body.mh4-modern > table[align="center"] > tbody > tr > td[bgcolor="#222933"],
body.mh4-modern > table[align="center"] > tr > td[bgcolor="#222233"],
body.mh4-modern > table[align="center"] > tr > td[bgcolor="#222933"] {
  position: relative;
  padding: 17px 22px !important;
  background:
    linear-gradient(120deg, rgba(217, 86, 61, .18), transparent 28%),
    linear-gradient(135deg, var(--mh4-steel-850), var(--mh4-steel-950)) !important;
  border: 1px solid #2d3942 !important;
}

body.mh4-modern > table[align="center"] h1 {
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  font-family: var(--mh4-font) !important;
  font-size: clamp(22px, 3vw, 32px) !important;
  line-height: 1.35 !important;
  letter-spacing: .015em;
  text-shadow: 0 2px 10px rgba(0,0,0,.25);
}

body.mh4-modern > table[align="center"] h1::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 1.1em;
  margin-right: 10px;
  vertical-align: -.12em;
  border-radius: 3px;
  background: linear-gradient(180deg, var(--mh4-ember), var(--mh4-brass));
}

/* Breadcrumbs */
body.mh4-modern #navia {
  width: min(var(--mh4-max), calc(100% - 28px)) !important;
  margin: 9px auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

body.mh4-modern #navib {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.mh4-modern #breadcrumbs {
  color: #67747e;
  font-size: 12px;
}

body.mh4-modern #breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  margin: 0;
  padding: 7px 10px;
  list-style: none;
  border-radius: 8px;
  background: rgba(255,255,255,.68);
  border: 1px solid rgba(188,199,206,.7);
}

body.mh4-modern #breadcrumbs li {
  display: inline-flex;
  align-items: center;
}

body.mh4-modern #breadcrumbs li + li::before {
  content: ">";
  margin: 0 8px;
  color: #9aa5ad;
}

body.mh4-modern #breadcrumbs a {
  color: #496675;
  text-decoration: none;
}

/* Typography and section headings */
body.mh4-modern h1,
body.mh4-modern h2,
body.mh4-modern h3,
body.mh4-modern h4 {
  font-family: var(--mh4-font);
}

body.mh4-modern #main h2,
body.mh4-modern #main h3,
body.mh4-modern #box h2,
body.mh4-modern #box h3,
body.mh4-modern #box3 h2,
body.mh4-modern #box3 h3,
body.mh4-modern #side h3 {
  position: relative;
  margin: 20px 0 10px !important;
  padding: 11px 14px 11px 46px !important;
  min-height: 44px;
  border: 1px solid #cbd3d9 !important;
  border-left: 4px solid var(--mh4-ember) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(90deg, rgba(200,155,66,.08), transparent 46%),
    linear-gradient(180deg, #fff, #f5f7f8) !important;
  color: #202b33 !important;
  font-size: 17px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
  text-align: left !important;
  letter-spacing: .01em;
  box-shadow: 0 2px 7px rgba(19, 31, 39, .04);
  text-indent: 0 !important;
  height: auto !important;
  overflow: visible !important;
}

body.mh4-modern .mh4-heading-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  transform: translateY(-50%);
  color: var(--mh4-ember);
}

body.mh4-modern .mh4-heading-icon .mh4-icon {
  width: 21px;
  height: 21px;
}

body.mh4-modern font[size="1"] {
  font-size: 11px !important;
}

body.mh4-modern font[size="2"] {
  font-size: 14px !important;
  line-height: 1.65;
}

body.mh4-modern font[size="3"] {
  font-size: 15px !important;
}

body.mh4-modern p {
  line-height: 1.8;
}

/* Section/card treatment for common legacy wrappers. */
body.mh4-modern #main > #margin10,
body.mh4-modern #main > #divmargin,
body.mh4-modern #block > #margin10,
body.mh4-modern #box > #margin10,
body.mh4-modern #box3 > #margin10,
body.mh4-modern #box4 > #margin10,
body.mh4-modern #side > #divmargin {
  margin: 0 0 16px !important;
  padding: 0 !important;
  border-radius: var(--mh4-radius);
}

body.mh4-modern #main > #margin10 > table,
body.mh4-modern #main > #divmargin > table,
body.mh4-modern #block > #margin10 > table,
body.mh4-modern #box > #margin10 > table,
body.mh4-modern #box3 > #margin10 > table,
body.mh4-modern #box4 > #margin10 > table,
body.mh4-modern #side > #divmargin > table {
  border: 1px solid var(--mh4-line) !important;
  border-radius: 10px;
  overflow: hidden;
  background: var(--mh4-surface);
  box-shadow: var(--mh4-shadow-soft);
}

/* Tables */
body.mh4-modern table {
  max-width: 100%;
  color: var(--mh4-ink);
}

body.mh4-modern #main table,
body.mh4-modern #box table,
body.mh4-modern #box3 table,
body.mh4-modern #box4 table,
body.mh4-modern #side table,
body.mh4-modern #block table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

body.mh4-modern #main td,
body.mh4-modern #main th,
body.mh4-modern #box td,
body.mh4-modern #box th,
body.mh4-modern #box3 td,
body.mh4-modern #box3 th,
body.mh4-modern #box4 td,
body.mh4-modern #box4 th,
body.mh4-modern #side td,
body.mh4-modern #side th,
body.mh4-modern #block td,
body.mh4-modern #block th {
  padding: 8px 10px;
  border-color: #d8dfe4 !important;
  vertical-align: middle;
}

body.mh4-modern td[bgcolor="#efefef"],
body.mh4-modern td[bgcolor="#eeeeee"],
body.mh4-modern td[bgcolor="#e6e6e6"],
body.mh4-modern td[bgcolor="#f6f6f6"],
body.mh4-modern th[bgcolor="#efefef"],
body.mh4-modern th[bgcolor="#eeeeee"],
body.mh4-modern th[bgcolor="#e6e6e6"],
body.mh4-modern th[bgcolor="#f6f6f6"] {
  background: #f6f8f9 !important;
}

body.mh4-modern td[bgcolor="#222233"],
body.mh4-modern td[bgcolor="#222933"],
body.mh4-modern td[bgcolor="#333344"],
body.mh4-modern td[bgcolor="#555566"],
body.mh4-modern td[bgcolor="#666677"],
body.mh4-modern th[bgcolor="#222233"],
body.mh4-modern th[bgcolor="#222933"],
body.mh4-modern th[bgcolor="#333344"],
body.mh4-modern th[bgcolor="#555566"],
body.mh4-modern th[bgcolor="#666677"] {
  background: linear-gradient(180deg, #34414a, #27323a) !important;
  color: #fff !important;
}

body.mh4-modern td[bgcolor="#222233"] a,
body.mh4-modern td[bgcolor="#222933"] a,
body.mh4-modern td[bgcolor="#333344"] a,
body.mh4-modern td[bgcolor="#555566"] a,
body.mh4-modern td[bgcolor="#666677"] a,
body.mh4-modern th[bgcolor="#222233"] a,
body.mh4-modern th[bgcolor="#222933"] a,
body.mh4-modern th[bgcolor="#333344"] a,
body.mh4-modern th[bgcolor="#555566"] a,
body.mh4-modern th[bgcolor="#666677"] a {
  color: #fff !important;
}

.mh4-table-scroll {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  margin: 0 0 14px;
  border-radius: 10px;
}

.mh4-table-scroll > table {
  margin-bottom: 0 !important;
}

.mh4-table-scroll.is-scrollable {
  border-right: 1px solid var(--mh4-line);
  border-left: 1px solid var(--mh4-line);
  background: linear-gradient(90deg, rgba(31,47,58,.04), transparent 18px, transparent calc(100% - 18px), rgba(31,47,58,.04));
}

.mh4-scroll-hint {
  display: none;
  margin: -7px 0 12px;
  color: #77848d;
  font-size: 11px;
  text-align: right;
}

/* Forms */
body.mh4-modern input[type="text"],
body.mh4-modern input[type="search"],
body.mh4-modern input[type="password"],
body.mh4-modern input[type="email"],
body.mh4-modern input[type="number"],
body.mh4-modern select,
body.mh4-modern textarea {
  max-width: 100%;
  min-height: 38px;
  padding: 7px 10px;
  border: 1px solid #aeb9c1;
  border-radius: 8px;
  background: #fff;
  color: #172128;
  font-family: var(--mh4-font);
  font-size: 14px;
  box-shadow: inset 0 1px 2px rgba(15, 24, 30, .04);
}

body.mh4-modern textarea {
  line-height: 1.65;
  resize: vertical;
}

body.mh4-modern input[type="submit"],
body.mh4-modern input[type="button"],
body.mh4-modern button:not(.mh4-menu-button):not(.mh4-back-to-top) {
  min-height: 38px;
  padding: 7px 14px;
  border: 1px solid #9d3c2d;
  border-radius: 8px;
  background: linear-gradient(180deg, #d75a42, #b3402e);
  color: #fff;
  font-family: var(--mh4-font);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(111, 42, 31, .16);
}

body.mh4-modern input[type="submit"]:hover,
body.mh4-modern input[type="button"]:hover,
body.mh4-modern button:not(.mh4-menu-button):not(.mh4-back-to-top):hover {
  filter: brightness(.96);
}

/* Link chips and legacy badges */
body.mh4-modern .sklinks,
body.mh4-modern .bclinks,
body.mh4-modern .bc-links1,
body.mh4-modern .bc-links3 {
  display: inline-block;
  margin: 2px;
  border-radius: 7px;
}

body.mh4-modern .bcit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  min-height: 20px;
  padding: 1px 5px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}

body.mh4-modern .bc-it1 { background: #e6f3ec; color: #286544; }
body.mh4-modern .bc-it2 { background: #f9e5df; color: #9f3b2c; }
body.mh4-modern .bc-it3 { background: #e9eef1; color: #5c6870; }
body.mh4-modern .bc-it4 { background: #e7edf5; color: #365f86; }

/* Homepage */
body.mh4-home #container {
  display: block !important;
  margin-top: 18px !important;
}

body.mh4-home #header {
  position: relative;
  isolation: isolate;
  min-height: 196px;
  margin: 0 0 18px !important;
  padding: 38px 42px !important;
  overflow: hidden;
  border: 1px solid #2f3b44;
  border-radius: 18px;
  background:
    linear-gradient(90deg, rgba(14, 20, 25, .98) 0%, rgba(18, 25, 31, .96) 46%, rgba(18,25,31,.56) 72%, rgba(18,25,31,.34) 100%),
    url("/mh4/img/topbg.png") right center / auto 100% no-repeat !important;
  box-shadow: 0 16px 36px rgba(16, 25, 32, .18);
}

body.mh4-home #header::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -58px;
  top: 20px;
  width: 285px;
  height: 285px;
  border: 1px solid rgba(225, 193, 113, .16);
  transform: rotate(45deg);
}

body.mh4-home #header::after {
  content: "MH4  /  GUILD HUNTER DATABASE";
  position: absolute;
  left: 44px;
  bottom: 28px;
  color: #9facb4;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .22em;
}

body.mh4-home #header h1 {
  max-width: 660px;
  margin: 0 !important;
  padding: 0 0 48px !important;
  color: #fff !important;
  font-size: clamp(30px, 4vw, 52px) !important;
  line-height: 1.25 !important;
  letter-spacing: .01em;
  text-shadow: 0 3px 15px rgba(0,0,0,.38);
}

body.mh4-home #header h1::before {
  content: "";
  display: block;
  width: 62px;
  height: 5px;
  margin-bottom: 16px;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--mh4-ember), var(--mh4-brass));
  box-shadow: 0 0 18px rgba(217, 86, 61, .35);
}

body.mh4-home #tbox {
  width: 100% !important;
  margin: 0 0 20px !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
  gap: 18px;
}

body.mh4-home #tbox > #box,
body.mh4-home #tbox > #box3,
body.mh4-home #tbox > #box4 {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
}

body.mh4-home #tbox > #box3,
body.mh4-home #tbox > #box4 {
  grid-column: 1 / -1;
}

body.mh4-home #box > #margin10,
body.mh4-home #box3 > #margin10 {
  overflow: hidden;
  border: 1px solid var(--mh4-line);
  border-radius: var(--mh4-radius);
  background: #fff;
  box-shadow: var(--mh4-shadow-soft);
}

body.mh4-home #box > #margin10 > h3,
body.mh4-home #box3 > #margin10 > h3 {
  margin: 0 !important;
  border-width: 0 0 1px 4px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.mh4-home #box > #margin10 > table,
body.mh4-home #box3 > #margin10 > table {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.mh4-home #box3 img[src*="topbg.png"] {
  display: none !important;
}

body.mh4-home #box3 td {
  padding: 16px 18px !important;
  background: #fff !important;
}

body.mh4-home #box3 font[size="2"] {
  font-size: 14px !important;
  color: #43515b !important;
}

.mh4-home-quick {
  margin: 0 0 24px;
  padding: 24px;
  border: 1px solid #cbd4da;
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(200,155,66,.06), transparent 34%),
    #fff;
  box-shadow: var(--mh4-shadow);
}

.mh4-home-quick__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}

.mh4-eyebrow {
  display: inline-block;
  margin-bottom: 3px;
  color: var(--mh4-ember-dark);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .18em;
}

.mh4-home-quick h2 {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #1c272f !important;
  font-size: clamp(20px, 3vw, 28px) !important;
}

.mh4-home-quick p {
  margin: 7px 0 0;
  color: #65727c;
  font-size: 13px;
}

.mh4-home-quick__search {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 8px 13px;
  border: 1px solid #b8c2c9;
  border-radius: 9px;
  background: #f6f8f9;
  color: #33434d !important;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none !important;
  white-space: nowrap;
}

.mh4-home-quick__search .mh4-icon {
  color: var(--mh4-ember);
}

.mh4-home-quick__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.mh4-quick-card {
  position: relative;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 11px;
  min-height: 78px;
  padding: 13px 12px;
  overflow: hidden;
  border: 1px solid #d4dce1;
  border-radius: 11px;
  background: linear-gradient(180deg, #fff, #f7f9fa);
  color: var(--mh4-ink) !important;
  text-decoration: none !important;
  transition: transform .17s ease, border-color .17s ease, box-shadow .17s ease;
}

.mh4-quick-card::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 3px;
  height: 100%;
  background: linear-gradient(180deg, var(--mh4-ember), var(--mh4-brass));
  opacity: .85;
}

.mh4-quick-card:hover {
  transform: translateY(-2px);
  border-color: #b6c1c8;
  box-shadow: 0 8px 18px rgba(20, 32, 40, .09);
}

.mh4-quick-card__icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(145deg, #35434d, #1e2931);
  box-shadow: inset 0 0 0 1px rgba(225,193,113,.25);
}

.mh4-quick-card__icon .mh4-icon {
  width: 23px;
  height: 23px;
  color: var(--mh4-brass-light);
}

.mh4-quick-card__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.mh4-quick-card__body strong {
  color: #1c262d;
  font-size: 14px;
  line-height: 1.3;
}

.mh4-quick-card__body small {
  color: #6b7780;
  font-size: 11px;
  line-height: 1.45;
}

.mh4-quick-card__arrow {
  width: 16px;
  height: 16px;
  color: #9aa6ae;
  transition: transform .17s ease, color .17s ease;
}

.mh4-quick-card:hover .mh4-quick-card__arrow {
  transform: translateX(2px);
  color: var(--mh4-ember);
}

/* Side ranking */
body.mh4-modern #side > #divmargin:first-of-type {
  margin-top: 0 !important;
}

body.mh4-modern #side > #divmargin:first-of-type > h3,
body.mh4-modern #side h3 {
  margin: 0 0 8px !important;
  padding: 10px 12px 10px 42px !important;
  min-height: 42px;
  background: linear-gradient(145deg, #26333c, #172027) !important;
  color: #fff !important;
  border: 1px solid #33414b !important;
  border-left: 4px solid var(--mh4-brass) !important;
  box-shadow: var(--mh4-shadow-soft);
}

body.mh4-modern #side #sidetable {
  width: 100% !important;
  border: 1px solid var(--mh4-line) !important;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  box-shadow: var(--mh4-shadow-soft);
}

body.mh4-modern #side #sidetable tr:nth-child(even) td {
  background: #f7f9fa !important;
}

body.mh4-modern #side #sidetable td:first-child {
  width: 50px !important;
  color: #33434d;
}

body.mh4-modern #side #sidetable td {
  font-size: 12px;
  line-height: 1.45;
}

/* Tabs and in-page navigation */
body.mh4-modern #tab-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0 !important;
  padding: 0 !important;
  list-style: none;
}

body.mh4-modern #tab-menu li {
  padding: 7px 12px !important;
  border: 1px solid #c8d0d6;
  border-radius: 8px;
  background: #f4f6f7;
  color: #46555f;
  cursor: pointer;
}

body.mh4-modern #tab-menu li.active {
  border-color: #a94332;
  background: linear-gradient(180deg, #d75a42, #b44130);
  color: #fff;
}

body.mh4-modern #block > table:first-child a,
body.mh4-modern #block > table:first-child font {
  text-decoration: none;
}

/* BBS */
body.mh4-bbs #main > table,
body.mh4-bbs #main #block > table {
  border: 1px solid var(--mh4-line) !important;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  box-shadow: var(--mh4-shadow-soft);
}

body.mh4-bbs #main textarea {
  width: min(100%, 760px) !important;
}

body.mh4-bbs #main form {
  line-height: 1.8;
}

/* Make / user generated equipment */
body.mh4-make #main > form,
body.mh4-make #main #block > form {
  display: block;
  padding: 14px;
  border: 1px solid var(--mh4-line);
  border-radius: 10px;
  background: #fff;
}

/* Hide the small legacy copyright strip after the modern footer is present. */
body.mh4-modern .mh4-legacy-footer {
  display: none !important;
}

/* Footer */
.mh4-site-footer {
  margin-top: 34px;
  color: #c6cfd5;
  background:
    linear-gradient(120deg, rgba(217,86,61,.08), transparent 25%),
    #12191f;
  border-top: 1px solid #36434c;
}

.mh4-site-footer__inner {
  width: min(var(--mh4-max), calc(100% - 28px));
  min-height: 112px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 24px;
}

.mh4-site-footer__brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--mh4-brass-light);
}

.mh4-site-footer__brand > .mh4-icon {
  width: 26px;
  height: 26px;
}

.mh4-site-footer__brand span {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}

.mh4-site-footer__brand strong {
  color: #fff;
  font-size: 15px;
}

.mh4-site-footer__brand small {
  margin-top: 4px;
  color: #7f8d97;
  font-size: 10px;
  letter-spacing: .12em;
}

.mh4-site-footer__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.mh4-site-footer__nav a {
  color: #c5ced4 !important;
  font-size: 12px;
  text-decoration: none !important;
}

.mh4-site-footer__nav a:hover {
  color: #fff !important;
}

.mh4-site-footer__copy {
  color: #77858e;
  font-size: 11px;
}

.mh4-back-to-top {
  position: fixed;
  z-index: 1100;
  right: 18px;
  bottom: 18px;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  padding: 0 !important;
  border: 1px solid #47545e !important;
  border-radius: 10px !important;
  background: rgba(23, 31, 38, .92) !important;
  color: var(--mh4-brass-light) !important;
  box-shadow: 0 8px 20px rgba(8, 14, 18, .24);
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease;
  cursor: pointer;
}

.mh4-back-to-top .mh4-icon {
  width: 20px;
  height: 20px;
}

.mh4-back-to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

/* Responsive */
@media (max-width: 1180px) {
  .mh4-site-header__inner {
    grid-template-columns: auto 1fr;
    gap: 10px 14px;
    padding: 10px 0;
  }
  .mh4-global-nav {
    grid-column: 1 / -1;
    order: 3;
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 1px;
    scrollbar-width: thin;
  }
  .mh4-header-search {
    justify-self: end;
  }
}

@media (max-width: 1050px) {
  body.mh4-modern #container {
    display: block !important;
  }
  body.mh4-modern #main,
  body.mh4-modern #side {
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }
  body.mh4-modern #side {
    margin-top: 22px !important;
  }
  body.mh4-modern #side #sidetable {
    columns: auto;
  }
  .mh4-home-quick__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.mh4-home #tbox {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.mh4-home #tbox > #box3,
  body.mh4-home #tbox > #box4 {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  html {
    scroll-padding-top: 72px;
  }
  body.mh4-modern {
    font-size: 14px;
  }
  .mh4-site-header {
    position: sticky;
  }
  .mh4-site-header__inner {
    width: min(100% - 18px, var(--mh4-max));
    min-height: 60px;
    padding: 8px 0;
    grid-template-columns: 1fr auto;
  }
  .mh4-brand__mark {
    width: 38px;
    height: 38px;
  }
  .mh4-brand__mark .mh4-icon {
    width: 21px;
    height: 21px;
  }
  .mh4-brand__text strong {
    font-size: 18px;
  }
  .mh4-brand__text small {
    font-size: 8px;
  }
  .mh4-menu-button {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 38px;
    padding: 7px 10px;
    border: 1px solid #45535d;
    border-radius: 8px;
    background: #202a32;
    color: #fff;
    font-family: var(--mh4-font);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
  }
  .mh4-menu-button .mh4-icon {
    width: 17px;
    height: 17px;
    color: var(--mh4-brass-light);
  }
  .mh4-menu-button__close {
    display: none;
  }
  .mh4-menu-button[aria-expanded="true"] .mh4-menu-button__open {
    display: none;
  }
  .mh4-menu-button[aria-expanded="true"] .mh4-menu-button__close {
    display: inline-block;
  }
  .mh4-global-nav {
    display: none;
    grid-column: 1 / -1;
    order: 3;
    padding: 7px 0 1px;
    overflow: visible;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .mh4-global-nav.is-open {
    display: grid;
  }
  .mh4-global-link {
    justify-content: flex-start;
    min-height: 42px;
    padding: 9px 10px;
    background: rgba(255,255,255,.035);
    border: 1px solid rgba(255,255,255,.045);
  }
  .mh4-header-search {
    display: none;
    grid-column: 1 / -1;
    order: 4;
    justify-self: stretch;
    width: 100%;
    margin-top: 4px;
  }
  .mh4-site-header.is-menu-open .mh4-header-search {
    display: flex;
  }
  body.mh4-modern #container,
  body.mh4-modern #navia,
  body.mh4-modern > table[align="center"] {
    width: calc(100% - 18px) !important;
  }
  body.mh4-modern #container {
    margin-top: 12px !important;
  }
  body.mh4-modern > table[align="center"] {
    margin-top: 12px !important;
    border-radius: 11px !important;
  }
  body.mh4-modern > table[align="center"] > tbody > tr > td[bgcolor="#222233"],
  body.mh4-modern > table[align="center"] > tbody > tr > td[bgcolor="#222933"] {
    padding: 13px 14px !important;
  }
  body.mh4-modern > table[align="center"] h1 {
    font-size: 22px !important;
  }
  body.mh4-modern #breadcrumbs ol {
    padding: 6px 8px;
  }
  body.mh4-modern #main h2,
  body.mh4-modern #main h3,
  body.mh4-modern #box h2,
  body.mh4-modern #box h3,
  body.mh4-modern #box3 h2,
  body.mh4-modern #box3 h3 {
    padding: 10px 11px 10px 42px !important;
    min-height: 41px;
    font-size: 16px !important;
  }
  body.mh4-modern #main td,
  body.mh4-modern #main th,
  body.mh4-modern #box td,
  body.mh4-modern #box th,
  body.mh4-modern #box3 td,
  body.mh4-modern #box3 th,
  body.mh4-modern #block td,
  body.mh4-modern #block th {
    padding: 7px 8px;
  }
  body.mh4-modern font[size="2"] {
    font-size: 13px !important;
  }
  body.mh4-home #header {
    min-height: 164px;
    padding: 25px 22px !important;
    background:
      linear-gradient(90deg, rgba(14,20,25,.97), rgba(18,25,31,.82)),
      url("/mh4/img/topbg.png") 70% center / cover no-repeat !important;
  }
  body.mh4-home #header::after {
    left: 24px;
    bottom: 20px;
    font-size: 8px;
  }
  body.mh4-home #header h1 {
    max-width: 78%;
    padding-bottom: 42px !important;
    font-size: clamp(27px, 8vw, 38px) !important;
  }
  .mh4-home-quick {
    padding: 17px 13px;
    border-radius: 14px;
  }
  .mh4-home-quick__head {
    display: block;
  }
  .mh4-home-quick__search {
    width: 100%;
    justify-content: center;
    margin-top: 12px;
  }
  .mh4-home-quick__grid,
  body.mh4-home #tbox {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  body.mh4-home #tbox > #box3,
  body.mh4-home #tbox > #box4 {
    grid-column: auto;
  }
  .mh4-quick-card {
    min-height: 70px;
    grid-template-columns: 39px minmax(0,1fr) 16px;
  }
  .mh4-quick-card__icon {
    width: 38px;
    height: 38px;
  }
  .mh4-quick-card__body small {
    font-size: 10px;
  }
  .mh4-scroll-hint {
    display: block;
  }
  .mh4-site-footer__inner {
    width: calc(100% - 24px);
    padding: 24px 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }
  .mh4-site-footer__nav {
    gap: 10px 16px;
  }
  .mh4-back-to-top {
    right: 12px;
    bottom: 12px;
  }
}

@media (max-width: 420px) {
  .mh4-global-nav {
    grid-template-columns: 1fr 1fr;
  }
  .mh4-global-link {
    font-size: 11px;
  }
  body.mh4-home #header h1 {
    max-width: 100%;
  }
  .mh4-quick-card__body small {
    display: none;
  }
  .mh4-quick-card {
    min-height: 58px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}

/* Compact factual badges in the top quick-access panel. */
.mh4-home-quick__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 11px;
}

.mh4-home-quick__meta > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 27px;
  padding: 4px 9px;
  border: 1px solid #d3d9dd;
  border-radius: 999px;
  background: #f3f6f7;
  color: #46545d;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .01em;
}

.mh4-home-quick__meta .mh4-icon {
  width: 14px;
  height: 14px;
  color: var(--mh4-ember);
}

@media (max-width: 760px) {
  .mh4-home-quick__meta {
    gap: 5px;
    margin-top: 9px;
  }
  .mh4-home-quick__meta > span {
    min-height: 25px;
    padding: 3px 7px;
    font-size: 10px;
  }
}



/* 2026-09-17c: compact top introduction and retire duplicated legacy footer. */
body.mh4-modern #footer,
body.mh4-modern #last,
body.mh4-modern .gc-mh-series-links {
  display: none !important;
}

body.mh4-home .mh4-top-intro td {
  padding: 14px 18px !important;
}

body.mh4-home .mh4-top-intro__content {
  text-align: left;
}

body.mh4-home .mh4-top-intro__text {
  margin: 0;
  color: #43515b;
  font-size: 14px;
  line-height: 1.8;
}

body.mh4-home .mh4-top-intro__links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 11px;
}

body.mh4-home .mh4-top-intro__links a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid #c9d1d6;
  border-radius: 8px;
  background: #f5f7f8;
  color: #344650 !important;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none !important;
}

body.mh4-home .mh4-top-intro__links a:hover {
  border-color: #9eabb3;
  background: #eef2f4;
}

.mh4-site-footer__copy a {
  color: inherit !important;
  text-decoration: none !important;
}

.mh4-site-footer__copy a:hover {
  color: #c6cfd5 !important;
}

@media (max-width: 760px) {
  body.mh4-home .mh4-top-intro td {
    padding: 11px 13px !important;
  }

  body.mh4-home .mh4-top-intro__text {
    font-size: 13px;
    line-height: 1.7;
  }

  body.mh4-home .mh4-top-intro__links {
    gap: 6px;
    margin-top: 9px;
  }

  body.mh4-home .mh4-top-intro__links a {
    min-height: 30px;
    padding: 5px 9px;
    font-size: 11px;
  }

  .mh4-site-footer {
    margin-top: 24px;
  }

  .mh4-site-footer__inner {
    padding: 18px 0;
    gap: 10px;
  }
}

/* 2026-09-17e: faster mobile discovery, section navigation, and contextual links. */
.mh4-home-quick__utility {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e0e5e8;
}

.mh4-home-quick__utility a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid #d1d8dd;
  border-radius: 999px;
  background: #f7f9fa;
  color: #3b4c56 !important;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none !important;
}

.mh4-home-quick__utility a:hover {
  border-color: #aeb9c0;
  background: #f0f3f5;
}

.mh4-home-quick__utility .mh4-icon {
  width: 15px;
  height: 15px;
  color: var(--mh4-ember);
}

/* In-page navigation for long database/detail pages. */
.mh4-page-jump {
  width: min(var(--mh4-max), calc(100% - 28px));
  margin: 10px auto 4px;
  padding: 9px 10px;
  border: 1px solid #c8d1d7;
  border-radius: 11px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 4px 14px rgba(18,30,39,.08);
}

.mh4-page-jump__inner {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.mh4-page-jump__title {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  color: #33444e;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .04em;
  white-space: nowrap;
}

.mh4-page-jump__title .mh4-icon {
  width: 15px;
  height: 15px;
  color: var(--mh4-brass);
}

.mh4-page-jump__links {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.mh4-page-jump__links a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  min-height: 31px;
  padding: 5px 9px;
  border: 1px solid #d3dade;
  border-radius: 8px;
  background: #f6f8f9;
  color: #3c4d57 !important;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none !important;
}

.mh4-page-jump__links a:hover,
.mh4-page-jump__links a.is-active {
  border-color: #c47a68;
  background: #fff5f1;
  color: #913d2f !important;
}

.mh4-page-jump__links .mh4-icon {
  width: 14px;
  height: 14px;
  color: var(--mh4-ember);
}

.mh4-section-target {
  scroll-margin-top: 120px;
}

@media (min-width: 761px) {
  .mh4-page-jump {
    position: sticky;
    top: 72px;
    z-index: 650;
  }
}

/* Route-aware related links are rendered server-side so they remain crawlable. */
.mh4-related-guide {
  width: min(var(--mh4-max), calc(100% - 28px));
  margin: 26px auto 0;
}

.mh4-related-guide__inner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 15px;
  border: 1px solid #cbd3d8;
  border-radius: 12px;
  background:
    linear-gradient(110deg, rgba(200,155,66,.07), transparent 34%),
    #fff;
  box-shadow: var(--mh4-shadow-soft);
}

.mh4-related-guide__title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  color: #26343d;
  font-size: 12px;
  white-space: nowrap;
}

.mh4-related-guide__title .mh4-icon {
  width: 17px;
  height: 17px;
  color: var(--mh4-brass);
}

.mh4-related-guide__links {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.mh4-related-guide__links a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 31px;
  padding: 5px 9px;
  border: 1px solid #d5dce0;
  border-radius: 8px;
  background: #f6f8f9;
  color: #3d505b !important;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none !important;
}

.mh4-related-guide__links a:hover {
  border-color: #b9c3c9;
  background: #eef2f4;
}

.mh4-related-guide__links .mh4-icon {
  width: 14px;
  height: 14px;
  color: var(--mh4-ember);
}

.mh4-legacy-jump {
  display: none !important;
}

@media (max-width: 760px) {
  /* The global brand already provides visual identity, so keep the H1 hero compact. */
  body.mh4-home #header {
    min-height: 0;
    margin-bottom: 10px !important;
    padding: 13px 15px !important;
    border-radius: 12px;
    background:
      linear-gradient(120deg, rgba(217,86,61,.13), transparent 34%),
      linear-gradient(135deg, #202b33, #12191f) !important;
  }

  body.mh4-home #header::before,
  body.mh4-home #header::after,
  body.mh4-home #header img {
    display: none !important;
  }

  body.mh4-home #header h1 {
    max-width: none;
    padding: 0 !important;
    font-size: 21px !important;
    line-height: 1.35 !important;
  }

  body.mh4-home #header h1::before {
    display: inline-block;
    width: 4px;
    height: 1.05em;
    margin: 0 9px 0 0;
    vertical-align: -.08em;
  }

  .mh4-home-quick {
    margin-bottom: 12px;
    padding: 14px 10px 11px;
  }

  .mh4-home-quick__head {
    margin-bottom: 11px;
  }

  .mh4-home-quick h2 {
    font-size: 19px !important;
    line-height: 1.35 !important;
  }

  .mh4-home-quick p {
    margin-top: 5px;
    font-size: 11px;
    line-height: 1.55;
  }

  .mh4-home-quick__meta {
    display: none;
  }

  .mh4-home-quick__search {
    min-height: 38px;
    margin-top: 9px;
    font-size: 11px;
  }

  .mh4-home-quick__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  .mh4-quick-card {
    min-height: 58px;
    grid-template-columns: 31px minmax(0, 1fr);
    gap: 7px;
    padding: 8px 7px;
    border-radius: 9px;
  }

  .mh4-quick-card__icon {
    width: 31px;
    height: 31px;
    border-radius: 8px;
  }

  .mh4-quick-card__icon .mh4-icon {
    width: 18px;
    height: 18px;
  }

  .mh4-quick-card__body {
    gap: 0;
  }

  .mh4-quick-card__body strong {
    font-size: 12px;
    line-height: 1.35;
  }

  .mh4-quick-card__body small,
  .mh4-quick-card__arrow {
    display: none !important;
  }

  .mh4-home-quick__utility {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-top: 9px;
    padding-top: 9px;
  }

  .mh4-home-quick__utility a {
    justify-content: center;
    min-width: 0;
    padding: 5px 6px;
    border-radius: 8px;
    font-size: 10px;
    text-align: center;
    white-space: nowrap;
  }

  .mh4-home-quick__utility .mh4-icon {
    display: none;
  }

  .mh4-page-jump,
  .mh4-related-guide {
    width: calc(100% - 18px);
  }

  .mh4-page-jump {
    margin-top: 7px;
    padding: 7px 8px;
  }

  .mh4-page-jump__inner {
    display: block;
  }

  .mh4-page-jump__title {
    margin: 0 0 6px 2px;
    font-size: 10px;
  }

  .mh4-page-jump__links {
    gap: 5px;
  }

  .mh4-page-jump__links a {
    min-height: 30px;
    padding: 5px 8px;
    font-size: 10px;
  }

  .mh4-section-target {
    scroll-margin-top: 78px;
  }

  .mh4-related-guide {
    margin-top: 18px;
  }

  .mh4-related-guide__inner {
    display: block;
    padding: 11px;
  }

  .mh4-related-guide__title {
    margin-bottom: 8px;
  }

  .mh4-related-guide__links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  .mh4-related-guide__links a {
    min-width: 0;
    justify-content: flex-start;
    padding: 6px 7px;
    font-size: 10px;
  }
}

@media (max-width: 380px) {
  .mh4-quick-card__body strong {
    font-size: 11px;
  }

  .mh4-home-quick__utility a {
    font-size: 9px;
  }
}

/* ========================================================================== 
   MH4 identity layer - Guild Forge / Obsidian Archive
   Keeps the shared Game-Cap UX model while giving MH4 its own visual identity.
   ========================================================================== */
:root {
  --mh4-bg: #edf0ed;
  --mh4-surface: #fff;
  --mh4-surface-2: #f7f8f5;
  --mh4-ink: #1b2422;
  --mh4-ink-soft: #59645f;
  --mh4-line: #d5dad5;
  --mh4-line-strong: #b9c1bb;
  --mh4-steel-950: #101614;
  --mh4-steel-900: #151d1a;
  --mh4-steel-850: #1c2723;
  --mh4-steel-800: #27342f;
  --mh4-steel-700: #3b4b44;
  --mh4-ember: #a74334;
  --mh4-ember-dark: #7f3026;
  --mh4-brass: #b9904e;
  --mh4-brass-light: #dfc17c;
  --mh4-blue: #356d66;
  --mh4-link: #225f63;
  --mh4-link-hover: #96392d;
  --mh4-success: #3f7257;
  --mh4-danger: #a13d35;
  --mh4-shadow: 0 12px 34px rgba(19, 31, 27, .10);
  --mh4-shadow-soft: 0 3px 14px rgba(19, 31, 27, .075);
}

body.mh4-modern {
  background:
    radial-gradient(circle at 14% -6%, rgba(185,144,78,.12), transparent 28rem),
    radial-gradient(circle at 94% 5%, rgba(53,109,102,.06), transparent 25rem),
    linear-gradient(180deg, #f8f8f5 0, var(--mh4-bg) 330px, var(--mh4-bg) 100%) !important;
}

.mh4-i-guild { -webkit-mask-image: url("/mh4/assets/icons/guild.svg"); mask-image: url("/mh4/assets/icons/guild.svg"); }
.mh4-i-relic { -webkit-mask-image: url("/mh4/assets/icons/relic.svg"); mask-image: url("/mh4/assets/icons/relic.svg"); }
.mh4-i-frenzy { -webkit-mask-image: url("/mh4/assets/icons/frenzy.svg"); mask-image: url("/mh4/assets/icons/frenzy.svg"); }
.mh4-i-wyvern { -webkit-mask-image: url("/mh4/assets/icons/wyvern.svg"); mask-image: url("/mh4/assets/icons/wyvern.svg"); }
.mh4-i-caravan { -webkit-mask-image: url("/mh4/assets/icons/caravan.svg"); mask-image: url("/mh4/assets/icons/caravan.svg"); }

.mh4-site-header {
  background:
    linear-gradient(118deg, rgba(223,193,124,.045) 0 18%, transparent 18% 25%, rgba(255,255,255,.025) 25% 27%, transparent 27%),
    linear-gradient(180deg, #1b2521 0%, #101714 100%);
  border-bottom-color: rgba(223,193,124,.55);
  box-shadow: 0 8px 26px rgba(6,14,11,.26);
}

.mh4-site-header::after {
  background: linear-gradient(90deg, transparent, #7f3026 18%, var(--mh4-brass) 50%, #356d66 82%, transparent);
}

.mh4-brand__mark {
  color: var(--mh4-brass-light);
  border-color: rgba(223,193,124,.58);
  background:
    radial-gradient(circle at 50% 45%, rgba(185,144,78,.16), transparent 58%),
    linear-gradient(145deg, rgba(127,48,38,.24), rgba(53,109,102,.10));
  clip-path: polygon(22% 0, 78% 0, 100% 22%, 100% 78%, 78% 100%, 22% 100%, 0 78%, 0 22%);
}

.mh4-header-search button {
  border-color: #7b3229 !important;
  background: linear-gradient(180deg, #a94a3a, #813127) !important;
}

/* Legacy section blocks used heavily by the MH4 top page. */
body.mh4-modern #main > #mj10,
body.mh4-modern #block > #mj10,
body.mh4-modern #box > #mj10,
body.mh4-modern #box1 > #mj10,
body.mh4-modern #box2 > #mj10,
body.mh4-modern #box3 > #mj10,
body.mh4-modern #box4 > #mj10 {
  margin: 0 0 16px !important;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid var(--mh4-line);
  border-radius: var(--mh4-radius);
  background: #fff;
  box-shadow: var(--mh4-shadow-soft);
}

body.mh4-modern #main > #mj10 > table,
body.mh4-modern #block > #mj10 > table,
body.mh4-modern #box > #mj10 > table,
body.mh4-modern #box1 > #mj10 > table,
body.mh4-modern #box2 > #mj10 > table,
body.mh4-modern #box3 > #mj10 > table,
body.mh4-modern #box4 > #mj10 > table {
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.mh4-modern #main td[bgcolor="#222933"],
body.mh4-modern #main th[bgcolor="#222933"],
body.mh4-modern #box td[bgcolor="#222933"],
body.mh4-modern #box th[bgcolor="#222933"],
body.mh4-modern #mj10 td[bgcolor="#222933"],
body.mh4-modern #mj10 th[bgcolor="#222933"] {
  background:
    linear-gradient(90deg, rgba(185,144,78,.11), transparent 32%),
    linear-gradient(180deg, #334039 0%, #222d28 100%) !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.05);
}

body.mh4-modern td[bgcolor="#555566"],
body.mh4-modern th[bgcolor="#555566"] {
  background: linear-gradient(180deg, #526159, #404d47) !important;
}

.mh4-section-icon {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  margin-right: 7px;
  vertical-align: middle;
  color: var(--mh4-brass-light);
}

.mh4-section-icon .mh4-icon {
  width: 18px;
  height: 18px;
}

/* Home hero: no dependency on omitted large artwork. */
body.mh4-home #header {
  min-height: 190px;
  padding: 37px 42px !important;
  border-color: #39483f;
  background:
    linear-gradient(118deg, rgba(127,48,38,.16) 0 17%, transparent 17% 31%),
    radial-gradient(circle at 78% 44%, rgba(185,144,78,.13), transparent 12rem),
    repeating-linear-gradient(135deg, rgba(255,255,255,.018) 0 1px, transparent 1px 15px),
    linear-gradient(135deg, #26342e 0%, #111815 70%, #0d1311 100%) !important;
}

body.mh4-home #header::before {
  content: "4G";
  left: auto;
  right: 38px;
  top: 50%;
  width: auto;
  height: auto;
  border: 0;
  color: rgba(223,193,124,.10);
  font-size: clamp(96px, 14vw, 168px);
  font-weight: 950;
  line-height: .8;
  letter-spacing: -.08em;
  transform: translateY(-50%);
}

body.mh4-home #header::after {
  content: "MH4  /  GUILD HUNTER DATABASE";
  color: #9aa69f;
}

body.mh4-home #header h1::before {
  background: linear-gradient(90deg, #87352a, var(--mh4-brass), #397269);
  box-shadow: 0 0 18px rgba(185,144,78,.26);
}

body.mh4-home #header img {
  display: none !important;
}

/* Quick access and intro must span the legacy three-column tbox grid. */
body.mh4-home #tbox > .mh4-home-quick,
body.mh4-home #tbox > .mh4-top-intro {
  grid-column: 1 / -1;
  min-width: 0;
}

.mh4-home-quick {
  border-color: #cdd4ce;
  background:
    linear-gradient(135deg, rgba(185,144,78,.075), transparent 34%),
    linear-gradient(315deg, rgba(53,109,102,.045), transparent 30%),
    #fff;
}

.mh4-eyebrow {
  color: #8e3a2d;
}

.mh4-quick-card__icon {
  background: linear-gradient(145deg, #26352f, #18211d) !important;
  color: var(--mh4-brass-light) !important;
  border-color: rgba(185,144,78,.48) !important;
}

.mh4-quick-card:hover {
  border-color: #b79a69 !important;
  box-shadow: 0 8px 22px rgba(34,48,42,.10) !important;
}

.mh4-home-quick__search {
  border-color: #aab7af !important;
  background: linear-gradient(180deg, #fbfcfb, #f1f4f1) !important;
}

/* Compact factual intro below quick access. */
.mh4-top-intro {
  position: relative;
  margin: 0 0 18px;
  padding: 18px 21px;
  overflow: hidden;
  border: 1px solid #d0d6d1;
  border-left: 4px solid #9a4032;
  border-radius: 14px;
  background:
    linear-gradient(110deg, rgba(185,144,78,.065), transparent 30%),
    #fff;
  box-shadow: var(--mh4-shadow-soft);
}

.mh4-top-intro::after {
  content: "GUILD ARCHIVE";
  position: absolute;
  right: 18px;
  top: 12px;
  color: rgba(37,51,45,.06);
  font-size: clamp(24px, 5vw, 54px);
  font-weight: 950;
  letter-spacing: .04em;
  pointer-events: none;
}

.mh4-top-intro__content {
  position: relative;
  z-index: 1;
}

.mh4-top-intro h2 {
  margin: 0 0 7px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #26332d !important;
  font-size: 18px !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
}

.mh4-top-intro__text {
  max-width: 960px;
  margin: 0;
  color: #52605a;
  font-size: 13px;
  line-height: 1.75;
}

.mh4-top-intro__links {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.mh4-top-intro__links a {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid #d2d8d3;
  border-radius: 999px;
  background: #f5f7f5;
  color: #40504a !important;
  font-size: 11px;
  font-weight: 800;
  text-decoration: none !important;
}

.mh4-top-intro__links a:hover {
  border-color: #b9a47b;
  background: #fbf7ee;
}

/* Keep the modern footer as the single footer; old access counters/device switches are retired. */
body.mh4-modern #footer,
body.mh4-modern #last,
body.mh4-modern .gc-mh-series-links {
  display: none !important;
}

.mh4-site-footer {
  background:
    linear-gradient(120deg, rgba(185,144,78,.055), transparent 34%),
    linear-gradient(180deg, #17211d, #0f1613) !important;
  border-top-color: rgba(223,193,124,.34) !important;
}

/* In-page navigation / contextual links inherit the guild palette. */
.mh4-page-jump__links a:hover,
.mh4-page-jump__links a.is-active {
  border-color: #b89559;
  background: #fcf8ee;
  color: #77332a !important;
}

.mh4-related-guide__inner {
  background:
    linear-gradient(110deg, rgba(185,144,78,.085), transparent 34%),
    linear-gradient(300deg, rgba(53,109,102,.035), transparent 34%),
    #fff;
}

@media (max-width: 760px) {
  body.mh4-home #container {
    margin-top: 12px !important;
  }

  body.mh4-home #header {
    min-height: 0;
    margin-bottom: 10px !important;
    padding: 13px 15px !important;
    border-radius: 12px;
    background:
      linear-gradient(120deg, rgba(127,48,38,.18), transparent 36%),
      linear-gradient(135deg, #26342e, #121a17) !important;
  }

  body.mh4-home #header::before,
  body.mh4-home #header::after,
  body.mh4-home #header img {
    display: none !important;
  }

  body.mh4-home #header h1 {
    max-width: none;
    padding: 0 !important;
    font-size: 21px !important;
    line-height: 1.35 !important;
  }

  body.mh4-home #header h1::before {
    display: inline-block;
    width: 4px;
    height: 1.05em;
    margin: 0 9px 0 0;
    vertical-align: -.08em;
  }

  .mh4-top-intro {
    margin-bottom: 12px;
    padding: 12px 13px;
    border-left-width: 3px;
    border-radius: 11px;
  }

  .mh4-top-intro::after,
  .mh4-top-intro .mh4-eyebrow,
  .mh4-top-intro__links {
    display: none;
  }

  .mh4-top-intro h2 {
    margin-bottom: 4px !important;
    font-size: 15px !important;
  }

  .mh4-top-intro__text {
    font-size: 12px;
    line-height: 1.65;
  }

  body.mh4-home #tbox {
    gap: 10px !important;
  }

  body.mh4-home #box > #mj10,
  body.mh4-home #box1 > #mj10,
  body.mh4-home #box2 > #mj10,
  body.mh4-home #box3 > #mj10,
  body.mh4-home #box4 > #mj10 {
    margin-bottom: 10px !important;
    border-radius: 10px;
  }

  .mh4-section-icon {
    width: 19px;
    height: 19px;
    margin-right: 4px;
  }

  .mh4-section-icon .mh4-icon {
    width: 15px;
    height: 15px;
  }
}

/* Complete the shared table/card treatment for MH4 legacy box1/box2 wrappers. */
body.mh4-modern #box1 > #margin10,
body.mh4-modern #box2 > #margin10 {
  margin: 0 0 16px !important;
  padding: 0 !important;
  border-radius: var(--mh4-radius);
}

body.mh4-modern #box1 > #margin10 > table,
body.mh4-modern #box2 > #margin10 > table {
  border: 1px solid var(--mh4-line) !important;
  border-radius: 10px;
  overflow: hidden;
  background: var(--mh4-surface);
  box-shadow: var(--mh4-shadow-soft);
}

body.mh4-modern #box1 table,
body.mh4-modern #box2 table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

body.mh4-modern #box1 td,
body.mh4-modern #box1 th,
body.mh4-modern #box2 td,
body.mh4-modern #box2 th {
  padding: 8px 10px;
  border-color: #d8dfe4 !important;
  vertical-align: middle;
}

@media (max-width: 760px) {
  /* Keep the SEO intro readable but compact; utility links already exist in QUICK ACCESS. */
  body.mh4-home .mh4-top-intro__links {
    display: none !important;
  }
}

/* ========================================================================== 
   MH4 V1 legacy-structure hardening - 2026-09-17
   Fixes found in production after V1 deployment and aligns detail-page quality
   while preserving legacy MH4 data, URLs, and page semantics.
   ========================================================================== */

/* The legacy desktop stylesheet reserved a right-hand promo column.  The modern
   hero is now the only element in this row, so it must own the full content width. */
body.mh4-home #header {
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Legacy MH4 detail pages use a two-row title table: a dark game-name row and
   a pale page-title row.  Keep that hierarchy, but make the actual page title
   high-contrast instead of inheriting the white H1 used on dark title bars. */
body.mh4-modern:not(.mh4-home) > table[align="center"] > tbody > tr > td[bgcolor="#e6e6ee"],
body.mh4-modern:not(.mh4-home) > table[align="center"] > tr > td[bgcolor="#e6e6ee"] {
  padding: 14px 22px !important;
  border: 1px solid #d3d9d5 !important;
  border-top: 0 !important;
  background:
    linear-gradient(90deg, rgba(185,144,78,.10), transparent 34%),
    linear-gradient(180deg, #fcfcf9 0%, #f1f4f1 100%) !important;
  color: #22302a !important;
}

body.mh4-modern:not(.mh4-home) > table[align="center"] td[bgcolor="#e6e6ee"] h1,
body.mh4-modern:not(.mh4-home) > table[align="center"] td[bgcolor="#e6e6ee"] h2,
body.mh4-modern:not(.mh4-home) > table[align="center"] td[bgcolor="#e6e6ee"] h1 *,
body.mh4-modern:not(.mh4-home) > table[align="center"] td[bgcolor="#e6e6ee"] h2 * {
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  color: #22302a !important;
  -webkit-text-fill-color: #22302a !important;
  text-shadow: none !important;
}

body.mh4-modern:not(.mh4-home) > table[align="center"] td[bgcolor="#e6e6ee"] h1 {
  font-size: clamp(22px, 3vw, 32px) !important;
  font-weight: 900 !important;
}

body.mh4-modern:not(.mh4-home) > table[align="center"] td[bgcolor="#e6e6ee"] h2 {
  font-size: clamp(19px, 2.5vw, 27px) !important;
  line-height: 1.35 !important;
  font-weight: 850 !important;
}

/* The old sidebar logo is redundant with the global MH4 brand and, because it
   is a sibling of #side, it becomes an accidental third flex column. */
body.mh4-modern #sidetop {
  display: none !important;
}

/* MH4's sidebar is a category navigator. Undo the legacy first-column width
   rule and give each card a
   consistent, compact presentation. */
body.mh4-modern #side #sidetable {
  table-layout: fixed;
}

body.mh4-modern #side #sidetable td:first-child {
  width: auto !important;
}

body.mh4-modern #side > #divmargin {
  overflow: hidden;
  border: 1px solid #d2d9d4;
  border-radius: 12px !important;
  background: #fff;
  box-shadow: 0 4px 14px rgba(19,31,27,.07);
}

body.mh4-modern #side > #divmargin > h3 {
  margin: 0 !important;
  border-width: 0 0 1px 4px !important;
  border-radius: 0 !important;
}

body.mh4-modern #side > #divmargin > #sidetable,
body.mh4-modern #side > #divmargin > table#sidetable {
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.mh4-modern #side #sidetable td {
  padding: 8px 7px !important;
}

body.mh4-modern #side #sidetable a {
  min-height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #335f68 !important;
  text-decoration: none !important;
}

body.mh4-modern #side #sidetable a:hover {
  color: #7d342b !important;
  background: #faf6ee !important;
}

/* Explicit sidebar search treatment.  The older mh4-modern.css made all side
   buttons pale, which left V1's white submit label almost invisible. */
body.mh4-modern #side form {
  display: flex;
  align-items: center;
  gap: 7px;
  width: 100%;
  margin: 0;
}

body.mh4-modern #side form input[type="text"],
body.mh4-modern #side form input[type="search"] {
  flex: 1 1 auto;
  width: auto !important;
  min-width: 0 !important;
  min-height: 38px;
}

body.mh4-modern #side form input[type="submit"] {
  flex: 0 0 auto;
  min-width: 64px;
  min-height: 38px;
  border-color: #7b3229 !important;
  background: linear-gradient(180deg, #a94a3a 0%, #813127 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

/* The runtime removes the common footer server-side. These are defensive
   fallbacks for old templates with alternate wrappers. */
body.mh4-modern #footersab,
body.mh4-modern .mh4-legacy-footer,
body.mh4-modern .mh4-legacy-footer-wrap {
  display: none !important;
}

/* Home-only Monster Hunter series links. */
.mh4-site-footer__shell {
  width: min(var(--mh4-max), calc(100% - 28px));
  margin: 0 auto;
}

.mh4-site-footer__shell .mh4-site-footer__inner {
  width: 100%;
}

.mh4-series-links {
  padding: 26px 0 24px;
  border-bottom: 1px solid rgba(223,193,124,.18);
}

.mh4-series-links__head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 13px;
}

.mh4-series-links__eyebrow {
  color: #b99a62;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .16em;
}

.mh4-series-links__head > strong {
  color: #f2f5f3;
  font-size: 15px;
  letter-spacing: .03em;
}

.mh4-series-links__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.mh4-series-link {
  min-width: 0;
  min-height: 64px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 14px;
  align-items: center;
  gap: 9px;
  padding: 10px 11px;
  border: 1px solid rgba(164,181,172,.20);
  border-radius: 10px;
  background: rgba(255,255,255,.035);
  color: #dce4df !important;
  text-decoration: none !important;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}

.mh4-series-link:hover {
  transform: translateY(-1px);
  border-color: rgba(223,193,124,.48);
  background: rgba(185,144,78,.075);
}

.mh4-series-link.is-current {
  border-color: rgba(223,193,124,.50);
  background:
    linear-gradient(125deg, rgba(127,48,38,.15), transparent 58%),
    rgba(185,144,78,.075);
}

.mh4-series-link__icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(223,193,124,.28);
  border-radius: 9px;
  color: var(--mh4-brass-light);
  background: #17231e;
}

.mh4-series-link__icon .mh4-icon {
  width: 19px;
  height: 19px;
}

.mh4-series-link > span:nth-child(2) {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.mh4-series-link strong {
  overflow: hidden;
  color: #f1f4f2;
  font-size: 13px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mh4-series-link small {
  overflow: hidden;
  color: #8fa097;
  font-size: 10px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mh4-series-link__arrow {
  width: 13px;
  height: 13px;
  color: #71847b;
}

@media (max-width: 1050px) {
  .mh4-series-links__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  body.mh4-modern:not(.mh4-home) > table[align="center"] {
    margin-top: 12px !important;
  }

  body.mh4-modern:not(.mh4-home) > table[align="center"] > tbody > tr > td[bgcolor="#e6e6ee"],
  body.mh4-modern:not(.mh4-home) > table[align="center"] > tr > td[bgcolor="#e6e6ee"] {
    padding: 11px 14px !important;
  }

  body.mh4-modern:not(.mh4-home) > table[align="center"] td[bgcolor="#e6e6ee"] h1 {
    font-size: 22px !important;
  }

  body.mh4-modern #side {
    margin-top: 14px !important;
  }

  .mh4-series-links {
    padding: 20px 0 18px;
  }

  .mh4-series-links__head {
    display: block;
    margin-bottom: 11px;
  }

  .mh4-series-links__eyebrow {
    display: block;
    margin-bottom: 3px;
    font-size: 9px;
  }

  .mh4-series-links__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mh4-series-link {
    min-height: 56px;
    grid-template-columns: 30px minmax(0, 1fr) 12px;
    gap: 7px;
    padding: 8px;
  }

  .mh4-series-link__icon {
    width: 30px;
    height: 30px;
  }

  .mh4-series-link small {
    display: none;
  }
}

/* --------------------------------------------------------------------------
   MH4 V3: legacy status/statistics hardening
   -------------------------------------------------------------------------- */

/* The original status icon GIF directory was intentionally omitted from the
   supplied archive.  Use dependency-free semantic markers instead of broken
   image placeholders, while keeping the original status text as the source of
   truth. */
body.mh4-modern .mh4-status-overview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 18px;
}

body.mh4-modern .mh4-status-overview__item {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  min-height: 72px;
  padding: 13px 15px;
  border: 1px solid #d0d8dd;
  border-left: 4px solid var(--mh4-brass);
  border-radius: 12px;
  background: linear-gradient(180deg, #ffffff, #f6f8f9);
  color: var(--mh4-ink) !important;
  text-decoration: none !important;
  box-shadow: var(--mh4-shadow-soft);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

body.mh4-modern .mh4-status-overview__item:hover {
  transform: translateY(-1px);
  border-color: #b8c3ca;
  box-shadow: 0 8px 20px rgba(18, 30, 39, .10);
}

body.mh4-modern .mh4-status-overview__item--danger { border-left-color: var(--mh4-ember); }
body.mh4-modern .mh4-status-overview__item--buff { border-left-color: var(--mh4-success); }
body.mh4-modern .mh4-status-overview__item--other { border-left-color: var(--mh4-blue); }

body.mh4-modern .mh4-status-overview__mark,
body.mh4-modern .mh4-status-row-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: 50%;
  font-family: Arial, sans-serif;
  font-weight: 900;
  line-height: 1;
}

body.mh4-modern .mh4-status-overview__mark {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(200, 155, 66, .34);
  background: #17221e;
  color: var(--mh4-brass-light);
  font-size: 18px;
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.025);
}

body.mh4-modern .mh4-status-overview__item--danger .mh4-status-overview__mark {
  border-color: rgba(217, 86, 61, .42);
  color: #ef806c;
}

body.mh4-modern .mh4-status-overview__item--buff .mh4-status-overview__mark {
  border-color: rgba(59, 122, 92, .44);
  color: #79b897;
}

body.mh4-modern .mh4-status-overview__item--other .mh4-status-overview__mark {
  border-color: rgba(50, 114, 143, .44);
  color: #79adc4;
}

body.mh4-modern .mh4-status-overview__item strong {
  display: block;
  margin-bottom: 2px;
  color: #1e2930;
  font-size: 15px;
  line-height: 1.3;
}

body.mh4-modern .mh4-status-overview__item small {
  display: block;
  color: var(--mh4-ink-soft);
  font-size: 12px;
  line-height: 1.45;
}

body.mh4-modern .mh4-status-table {
  overflow: hidden;
  border-radius: 10px;
}

body.mh4-modern .mh4-status-table td[id^="mh4-status-cat-"] {
  scroll-margin-top: 96px;
  background: linear-gradient(180deg, #26332f, #1a2421) !important;
  color: #fff !important;
  font-size: 15px;
  letter-spacing: .03em;
}

body.mh4-modern .mh4-status-name {
  color: #202a31;
  white-space: normal;
}

body.mh4-modern .mh4-status-row-mark {
  width: 24px;
  height: 24px;
  margin-right: 8px;
  border: 1px solid #cad3d8;
  background: #f2f5f6;
  color: #56646d;
  font-size: 12px;
  vertical-align: middle;
}

body.mh4-modern .mh4-status-row-mark--0 {
  border-color: rgba(217, 86, 61, .35);
  background: rgba(217, 86, 61, .08);
  color: #b84432;
}

body.mh4-modern .mh4-status-row-mark--1 {
  border-color: rgba(59, 122, 92, .35);
  background: rgba(59, 122, 92, .08);
  color: #347052;
}

body.mh4-modern .mh4-status-row-mark--2 {
  border-color: rgba(50, 114, 143, .35);
  background: rgba(50, 114, 143, .08);
  color: #2e6b86;
}

/* Rebuild the old three-GIF +/- graph as a single non-wrapping CSS meter.
   This preserves the centered zero point and relative scale while avoiding
   line wrapping caused by legacy table widths and modern cell padding. */
body.mh4-modern .mh4-stat-meter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: min(150px, 100%);
  min-width: 0;
  white-space: nowrap;
  vertical-align: middle;
}

body.mh4-modern .mh4-stat-meter__track {
  position: relative;
  flex: 1 1 112px;
  min-width: 76px;
  max-width: 120px;
  height: 14px;
  overflow: hidden;
  border: 1px solid #aeb8bf;
  border-radius: 999px;
  background: linear-gradient(180deg, #f8f9fa 0%, #d9dee2 52%, #bcc5ca 100%);
  box-shadow: inset 0 1px 2px rgba(18, 30, 39, .13);
}

body.mh4-modern .mh4-stat-meter__track::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: -1px;
  bottom: -1px;
  left: 50%;
  width: 1px;
  background: #66737b;
  opacity: .72;
}

body.mh4-modern .mh4-stat-meter__fill {
  position: absolute;
  z-index: 1;
  top: 2px;
  bottom: 2px;
  width: var(--mh4-meter-size, 0%);
  border-radius: 999px;
}

body.mh4-modern .mh4-stat-meter.is-plus .mh4-stat-meter__fill {
  left: 50%;
  background: linear-gradient(90deg, #cf6b5a, #dc4f77);
  box-shadow: 0 0 5px rgba(220, 79, 119, .28);
}

body.mh4-modern .mh4-stat-meter.is-minus .mh4-stat-meter__fill {
  right: 50%;
  background: linear-gradient(90deg, #2d74a3, #245d8d);
  box-shadow: 0 0 5px rgba(45, 116, 163, .25);
}

body.mh4-modern .mh4-stat-meter__value {
  flex: 0 0 28px;
  min-width: 28px;
  color: #344149;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  text-align: right;
}

body.mh4-modern .mh4-stat-meter.is-rate .mh4-stat-meter__value {
  color: #a43d50;
}

body.mh4-modern .mh4-stat-meter.is-fixed .mh4-stat-meter__value {
  color: #356482;
}

@media (max-width: 760px) {
  body.mh4-modern .mh4-status-overview {
    grid-template-columns: 1fr;
    gap: 8px;
    margin-bottom: 14px;
  }

  body.mh4-modern .mh4-status-overview__item {
    min-height: 58px;
    padding: 10px 12px;
  }

  body.mh4-modern .mh4-status-overview__mark {
    width: 32px;
    height: 32px;
    font-size: 15px;
  }

  body.mh4-modern .mh4-status-table td:first-child {
    width: 38% !important;
  }

  body.mh4-modern .mh4-status-row-mark {
    width: 21px;
    height: 21px;
    margin-right: 5px;
    font-size: 11px;
  }

  body.mh4-modern .mh4-stat-meter {
    width: 126px;
    gap: 5px;
  }

  body.mh4-modern .mh4-stat-meter__track {
    min-width: 68px;
  }

  body.mh4-modern .mh4-stat-meter__value {
    flex-basis: 24px;
    min-width: 24px;
    font-size: 11px;
  }
}

/* ==========================================================
   MH4 V1 - CARAVAN OBSIDIAN theme
   MH4 is deliberately distinct from MH4G: graphite / violet
   guild cloth / aged brass / warm copper.  This final layer
   overrides the shared legacy-layout hardening above.
   ========================================================== */
:root {
  --mh4-bg: #f1f0f3;
  --mh4-surface: #ffffff;
  --mh4-surface-2: #f8f7f9;
  --mh4-ink: #201d24;
  --mh4-ink-soft: #5d5664;
  --mh4-line: #d9d4de;
  --mh4-line-strong: #bbb3c2;
  --mh4-steel-950: #110f15;
  --mh4-steel-900: #17131f;
  --mh4-steel-850: #211a2b;
  --mh4-steel-800: #2c2338;
  --mh4-steel-700: #44364f;
  --mh4-ember: #c75b3c;
  --mh4-ember-dark: #943d2c;
  --mh4-brass: #cfa858;
  --mh4-brass-light: #ead087;
  --mh4-blue: #536b91;
  --mh4-link: #365d82;
  --mh4-link-hover: #9b4532;
  --mh4-success: #55725f;
  --mh4-danger: #a84438;
}

body.mh4-modern {
  background:
    radial-gradient(circle at 11% 0%, rgba(207,168,88,.09), transparent 27rem),
    radial-gradient(circle at 92% 12%, rgba(94,68,116,.055), transparent 26rem),
    linear-gradient(180deg, #faf9fb 0, var(--mh4-bg) 330px, var(--mh4-bg) 100%) !important;
}

.mh4-site-header {
  background:
    linear-gradient(118deg, rgba(207,168,88,.045) 0 17%, transparent 17% 25%, rgba(126,93,148,.055) 25% 27%, transparent 27%),
    linear-gradient(180deg, #211b29 0%, #121016 100%);
  border-bottom-color: rgba(234,208,135,.50);
  box-shadow: 0 8px 26px rgba(18,12,23,.28);
}

.mh4-site-header::after {
  background: linear-gradient(90deg, transparent, #95422f 17%, var(--mh4-brass) 49%, #6b537d 82%, transparent);
}

.mh4-brand__mark {
  color: var(--mh4-brass-light);
  border-color: rgba(234,208,135,.58);
  background:
    radial-gradient(circle at 50% 46%, rgba(207,168,88,.17), transparent 58%),
    linear-gradient(145deg, rgba(148,61,44,.25), rgba(103,80,125,.18));
  clip-path: polygon(21% 0, 79% 0, 100% 21%, 100% 79%, 79% 100%, 21% 100%, 0 79%, 0 21%);
}

.mh4-header-search button {
  border-color: #7f3729 !important;
  background: linear-gradient(180deg, #b24f38, #853326) !important;
}

body.mh4-modern #main td[bgcolor="#222933"],
body.mh4-modern #main th[bgcolor="#222933"],
body.mh4-modern #box td[bgcolor="#222933"],
body.mh4-modern #box th[bgcolor="#222933"],
body.mh4-modern #mj10 td[bgcolor="#222933"],
body.mh4-modern #mj10 th[bgcolor="#222933"] {
  background:
    linear-gradient(90deg, rgba(207,168,88,.12), transparent 31%),
    linear-gradient(180deg, #3a3045 0%, #261f2f 100%) !important;
}

body.mh4-modern td[bgcolor="#555566"],
body.mh4-modern th[bgcolor="#555566"] {
  background: linear-gradient(180deg, #5b5065, #443b4c) !important;
}

/* Home hero: strong MH4 identity without depending on omitted artwork. */
body.mh4-home #header {
  min-height: 190px;
  padding: 37px 42px !important;
  border-color: #463b4e;
  background:
    linear-gradient(118deg, rgba(151,66,47,.18) 0 17%, transparent 17% 31%),
    radial-gradient(circle at 79% 44%, rgba(207,168,88,.13), transparent 12rem),
    radial-gradient(circle at 62% 30%, rgba(105,79,126,.13), transparent 15rem),
    repeating-linear-gradient(135deg, rgba(255,255,255,.019) 0 1px, transparent 1px 15px),
    linear-gradient(135deg, #30283a 0%, #19151f 70%, #100e13 100%) !important;
}

body.mh4-home #header::before {
  content: "4";
  left: auto;
  right: 42px;
  top: 50%;
  width: auto;
  height: auto;
  border: 0;
  color: rgba(234,208,135,.10);
  font-size: clamp(108px, 15vw, 180px);
  font-weight: 950;
  line-height: .78;
  letter-spacing: -.08em;
  transform: translateY(-50%);
}

body.mh4-home #header::after {
  content: "MH4  /  CARAVAN HUNTER DATABASE";
  color: #aaa2b1;
}

body.mh4-home #header h1::before {
  background: linear-gradient(90deg, #9a4530, var(--mh4-brass), #6c547f);
  box-shadow: 0 0 18px rgba(207,168,88,.26);
}

body.mh4-home #header img {
  display: none !important;
}

.mh4-home-quick {
  border-color: #d5d0d8;
  background:
    linear-gradient(135deg, rgba(207,168,88,.075), transparent 34%),
    linear-gradient(315deg, rgba(101,77,121,.055), transparent 30%),
    #fff;
}

.mh4-eyebrow { color: #91402f; }

.mh4-quick-card__icon {
  background: linear-gradient(145deg, #30273a, #1c1722) !important;
  color: var(--mh4-brass-light) !important;
  border-color: rgba(207,168,88,.48) !important;
}

.mh4-quick-card:hover {
  border-color: #baa16f !important;
  box-shadow: 0 8px 22px rgba(47,37,55,.11) !important;
}

.mh4-home-quick__search {
  border-color: #b4acb9 !important;
  background: linear-gradient(180deg, #fdfcfd, #f3f1f5) !important;
}

.mh4-top-intro {
  border-color: #d9d4dc;
  border-left-color: #94402e;
  background:
    linear-gradient(110deg, rgba(207,168,88,.065), transparent 30%),
    linear-gradient(300deg, rgba(104,79,125,.04), transparent 35%),
    #fff;
}

.mh4-top-intro::after {
  content: "CARAVAN ARCHIVE";
  color: rgba(46,36,54,.055);
}

.mh4-top-intro h2 { color: #2c2532 !important; }
.mh4-top-intro__text { color: #605966; }

.mh4-site-footer {
  background:
    linear-gradient(120deg, rgba(207,168,88,.06), transparent 34%),
    linear-gradient(300deg, rgba(104,79,125,.055), transparent 38%),
    linear-gradient(180deg, #1d1824, #100e13) !important;
  border-top-color: rgba(234,208,135,.34) !important;
}

.mh4-page-jump__links a:hover,
.mh4-page-jump__links a.is-active {
  border-color: #b99a61;
  background: #fcf8ef;
  color: #7c352a !important;
}

.mh4-related-guide__inner {
  background:
    linear-gradient(110deg, rgba(207,168,88,.085), transparent 34%),
    linear-gradient(300deg, rgba(104,79,125,.045), transparent 34%),
    #fff;
}

/* Retire the old desktop/mobile split footer and duplicate series list. */
body.mh4-modern #footer,
body.mh4-modern #last,
body.mh4-modern .gc-mh-series-links {
  display: none !important;
}

/* The legacy side logo is redundant after the new global header and otherwise
   becomes a third flex column on some pages. */
body.mh4-modern #sidetop { display: none !important; }

@media (max-width: 760px) {
  body.mh4-home #header {
    min-height: 0;
    margin-bottom: 10px !important;
    padding: 13px 15px !important;
    border-radius: 12px;
    background:
      linear-gradient(120deg, rgba(151,66,47,.19), transparent 36%),
      linear-gradient(135deg, #30283a, #17131c) !important;
  }
  body.mh4-home #header::before,
  body.mh4-home #header::after,
  body.mh4-home #header img { display: none !important; }
}

/* MH4-specific icon masks. */
.mh4-i-kinsect { -webkit-mask-image:url('/mh4/assets/icons/kinsect.svg'); mask-image:url('/mh4/assets/icons/kinsect.svg'); }
.mh4-i-expedition { -webkit-mask-image:url('/mh4/assets/icons/expedition.svg'); mask-image:url('/mh4/assets/icons/expedition.svg'); }
.mh4-i-charm { -webkit-mask-image:url('/mh4/assets/icons/charm.svg'); mask-image:url('/mh4/assets/icons/charm.svg'); }
.mh4-i-village { -webkit-mask-image:url('/mh4/assets/icons/village.svg'); mask-image:url('/mh4/assets/icons/village.svg'); }
.mh4-i-crest { -webkit-mask-image:url('/mh4/assets/icons/crest.svg'); mask-image:url('/mh4/assets/icons/crest.svg'); }


/* ========================================================================== 
   MH4 V2 contrast hardening - 2026-09-17
   Legacy pages sometimes place H2/H3 headings inside an already-dark table
   section bar.  The shared heading-card treatment must not paint a pale card
   behind text that is explicitly white in those old templates.
   ========================================================================== */
body.mh4-modern #main tr[bgcolor="#111122"] > td > h2,
body.mh4-modern #main tr[bgcolor="#111122"] > td > h3,
body.mh4-modern #main tr[bgcolor="#222233"] > td > h2,
body.mh4-modern #main tr[bgcolor="#222233"] > td > h3,
body.mh4-modern #main tr[bgcolor="#222933"] > td > h2,
body.mh4-modern #main tr[bgcolor="#222933"] > td > h3,
body.mh4-modern #main tr[bgcolor="#333344"] > td > h2,
body.mh4-modern #main tr[bgcolor="#333344"] > td > h3,
body.mh4-modern #main tr[bgcolor="#334455"] > td > h2,
body.mh4-modern #main tr[bgcolor="#334455"] > td > h3,
body.mh4-modern #main tr[bgcolor="#555566"] > td > h2,
body.mh4-modern #main tr[bgcolor="#555566"] > td > h3,
body.mh4-modern #main tr[bgcolor="#666677"] > td > h2,
body.mh4-modern #main tr[bgcolor="#666677"] > td > h3,
body.mh4-modern #main td[bgcolor="#111122"] > h2,
body.mh4-modern #main td[bgcolor="#111122"] > h3,
body.mh4-modern #main td[bgcolor="#222233"] > h2,
body.mh4-modern #main td[bgcolor="#222233"] > h3,
body.mh4-modern #main td[bgcolor="#222933"] > h2,
body.mh4-modern #main td[bgcolor="#222933"] > h3,
body.mh4-modern #main td[bgcolor="#333344"] > h2,
body.mh4-modern #main td[bgcolor="#333344"] > h3,
body.mh4-modern #main td[bgcolor="#334455"] > h2,
body.mh4-modern #main td[bgcolor="#334455"] > h3,
body.mh4-modern #main td[bgcolor="#555566"] > h2,
body.mh4-modern #main td[bgcolor="#555566"] > h3,
body.mh4-modern #main td[bgcolor="#666677"] > h2,
body.mh4-modern #main td[bgcolor="#666677"] > h3 {
  margin: 0 !important;
  padding: 8px 12px !important;
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 16px !important;
  line-height: 1.45 !important;
  font-weight: 800 !important;
  text-align: center !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

body.mh4-modern #main tr[bgcolor="#111122"] > td > h2 *,
body.mh4-modern #main tr[bgcolor="#111122"] > td > h3 *,
body.mh4-modern #main tr[bgcolor="#222233"] > td > h2 *,
body.mh4-modern #main tr[bgcolor="#222233"] > td > h3 *,
body.mh4-modern #main tr[bgcolor="#222933"] > td > h2 *,
body.mh4-modern #main tr[bgcolor="#222933"] > td > h3 *,
body.mh4-modern #main tr[bgcolor="#333344"] > td > h2 *,
body.mh4-modern #main tr[bgcolor="#333344"] > td > h3 *,
body.mh4-modern #main tr[bgcolor="#334455"] > td > h2 *,
body.mh4-modern #main tr[bgcolor="#334455"] > td > h3 *,
body.mh4-modern #main tr[bgcolor="#555566"] > td > h2 *,
body.mh4-modern #main tr[bgcolor="#555566"] > td > h3 *,
body.mh4-modern #main tr[bgcolor="#666677"] > td > h2 *,
body.mh4-modern #main tr[bgcolor="#666677"] > td > h3 *,
body.mh4-modern #main td[bgcolor="#111122"] > h2 *,
body.mh4-modern #main td[bgcolor="#111122"] > h3 *,
body.mh4-modern #main td[bgcolor="#222233"] > h2 *,
body.mh4-modern #main td[bgcolor="#222233"] > h3 *,
body.mh4-modern #main td[bgcolor="#222933"] > h2 *,
body.mh4-modern #main td[bgcolor="#222933"] > h3 *,
body.mh4-modern #main td[bgcolor="#333344"] > h2 *,
body.mh4-modern #main td[bgcolor="#333344"] > h3 *,
body.mh4-modern #main td[bgcolor="#334455"] > h2 *,
body.mh4-modern #main td[bgcolor="#334455"] > h3 *,
body.mh4-modern #main td[bgcolor="#555566"] > h2 *,
body.mh4-modern #main td[bgcolor="#555566"] > h3 *,
body.mh4-modern #main td[bgcolor="#666677"] > h2 *,
body.mh4-modern #main td[bgcolor="#666677"] > h3 * {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* mh4-modern.css has a higher-specificity #main button rule that paints old
   controls pale.  The new theme uses white labels, so those two rules together
   could produce white-on-white buttons.  Force the modern action surface for
   ordinary public controls while leaving gc-primary / gc-secondary alone. */
body.mh4-modern input[type="submit"]:not(.gc-primary):not(.gc-secondary),
body.mh4-modern input[type="button"]:not(.gc-primary):not(.gc-secondary),
body.mh4-modern button:not(.gc-primary):not(.gc-secondary):not(.mh4-menu-button):not(.mh4-back-to-top) {
  border-color: #7f3729 !important;
  background: linear-gradient(180deg, #b4513c 0%, #853427 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  opacity: 1 !important;
  text-shadow: none !important;
  box-shadow: 0 2px 7px rgba(81, 35, 28, .18) !important;
}

body.mh4-modern input[type="submit"]:not(.gc-primary):not(.gc-secondary):hover,
body.mh4-modern input[type="button"]:not(.gc-primary):not(.gc-secondary):hover,
body.mh4-modern button:not(.gc-primary):not(.gc-secondary):not(.mh4-menu-button):not(.mh4-back-to-top):hover {
  background: linear-gradient(180deg, #a84936 0%, #773025 100%) !important;
  border-color: #6f2e24 !important;
  filter: none !important;
}

/* Disabled controls stay intentionally muted, but the label remains legible. */
body.mh4-modern input[type="submit"]:not(.gc-primary):not(.gc-secondary):disabled,
body.mh4-modern input[type="button"]:not(.gc-primary):not(.gc-secondary):disabled,
body.mh4-modern button:not(.gc-primary):not(.gc-secondary):not(.mh4-menu-button):not(.mh4-back-to-top):disabled {
  border-color: #c3c9ce !important;
  background: linear-gradient(180deg, #f1f3f4 0%, #e2e6e9 100%) !important;
  color: #66717a !important;
  -webkit-text-fill-color: #66717a !important;
  opacity: 1 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

/* Posting-flow secondary buttons intentionally keep their light surface. */
body.mh4-modern .gc-secondary,
body.mh4-modern input.gc-secondary,
body.mh4-modern button.gc-secondary {
  color: #26323b !important;
  -webkit-text-fill-color: #26323b !important;
}
