/* Page-scoped campaign tokens; the shared header and other pages stay unchanged. */
.ma-page {
  --ma-jade: #0d2f28;
  --ma-gold: #e6cf9c;
  --ma-gold-deep: #87652f;
  --ma-gold-line: #e5d5b0;
  --ma-ivory: #f8f5ee;
  --ma-paper: #fbf8f1;
  --ma-surface: #fff;
  --ma-ink: #1c2b25;
  --ma-muted: #5f6b65;
  --ma-line: #e7e0d2;
  --ma-on-dark: #fbf7ec;
  --ma-on-dark-soft: #d5dccf;
  --ma-on-dark-muted: #b4c2b7;
  --ma-night: linear-gradient(125deg, #0a2924, #123a31);
  /* Latin serif first keeps numerals elegant; CJK falls through to the Song faces. */
  --ma-serif: "Palatino Linotype", Palatino, "Songti SC", STSong, "Noto Serif SC", "Source Han Serif SC", "Noto Serif CJK SC", SimSun, serif;
  color: var(--ma-ink);
  background: var(--ma-ivory);
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
  overflow-x: clip;
}
.ma-page :where(h1, h2, h3, h4, p, ul, dl, dd) { margin: 0; }
.ma-page :where(h1, h2, h3, .ma-hero-lead, .ma-section-description, .ma-rules-heading > p, .ma-closing p) { text-wrap: balance; }
.ma-page [id] { scroll-margin-top: 140px; }
.ma-container { width: min(1680px, calc(100% - 48px)); margin-inline: auto; }
.ma-page .icon-svg { flex-shrink: 0; width: 18px; height: 18px; }
.ma-page a:focus-visible, .ma-page button:focus-visible { outline: 3px solid var(--cc-brand); outline-offset: 4px; }
.ma-page .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 46px;
  padding: 12px 24px;
  border: 1px solid transparent;
  border-radius: 8px;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  box-shadow: none;
  transform: none;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
.ma-page .btn-primary { color: #fff; background: var(--cc-brand-strong); }
.ma-page .btn-primary:hover:not(:disabled) { color: #fff; background: var(--cc-brand-dark); }
.ma-page .btn-outline { border-color: var(--ma-line); color: var(--ma-ink); background: var(--ma-surface); }
.ma-page .btn-outline:hover:not(:disabled) { border-color: var(--cc-brand-border); color: var(--cc-brand-dark); background: var(--ma-surface); }
.ma-page .btn:disabled { border-color: transparent; background: var(--ma-line); color: var(--ma-muted); cursor: not-allowed; }
.ma-page [hidden] { display: none; }
.ma-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; }
.ma-status { display: inline-flex; align-items: center; padding: 3px 11px; border: 1px solid var(--ma-line); border-radius: 999px; color: var(--ma-muted); background: transparent; font-size: 12px; line-height: 1.6; white-space: nowrap; }
.ma-section { padding: 88px 0; }
.ma-section-head { max-width: 640px; margin-bottom: 40px; }
.ma-section-kicker { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; color: var(--ma-gold-deep); font-size: 12px; font-weight: 600; letter-spacing: .16em; }
.ma-section-kicker::before { content: ""; flex: none; width: 24px; height: 1px; background: currentColor; }
.ma-section h2 { font-family: var(--ma-serif); font-size: clamp(28px, 2.6vw, 36px); font-weight: 500; line-height: 1.4; letter-spacing: .02em; }
.ma-section-description { margin-top: 12px; color: var(--ma-muted); font-size: 15px; line-height: 1.9; }
.ma-muted { color: var(--ma-muted); font-size: 13px; }
.ma-text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--cc-brand-dark); font-size: 14px; font-weight: 600; }
.ma-text-link:hover { color: var(--cc-brand-strong); }

.ma-jump-nav { position: sticky; top: 62px; z-index: 30; background: rgba(248, 245, 238, .96); border-bottom: 1px solid var(--ma-line); }
.ma-jump-inner { min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.ma-jump-brand { color: var(--ma-ink); font-family: var(--ma-serif); font-size: 17px; letter-spacing: .08em; white-space: nowrap; }
.ma-jump-links { display: flex; align-items: center; gap: 36px; }
.ma-jump-links a { position: relative; padding: 19px 0; color: var(--ma-muted); font-size: 14px; white-space: nowrap; }
.ma-jump-links a:hover, .ma-jump-links a[aria-current="location"] { color: var(--ma-ink); }
.ma-jump-links a[aria-current="location"]::after { content: ""; position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--cc-brand-strong); }

.ma-rules-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 72px; }
.ma-rules-heading { display: flex; flex-direction: column; align-items: flex-start; }
.ma-rules-heading .ma-rules-highlights { align-self: stretch; }
.ma-rules-heading > .ma-text-link { margin-top: auto; padding-top: 32px; }
.ma-rules-heading > p:not(.ma-section-kicker) { margin: 16px 0 20px; color: var(--ma-muted); font-size: 15px; line-height: 1.9; }
.ma-rules-heading > .ma-rules-caveat { margin: 14px 0 22px; font-size: 13px; }
.ma-rules-highlights { margin-bottom: 0; padding: 4px 18px; border: 1px solid var(--ma-gold-line); border-radius: 10px; background: var(--ma-paper); }
.ma-rules-highlights > div { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 2px 12px; padding: 12px 0; }
.ma-rules-highlights > div + div { border-top: 1px solid var(--ma-line); }
.ma-rules-highlights dt { color: var(--ma-muted); font-size: 13px; }
.ma-rules-highlights dd { color: var(--ma-ink); font-size: 14px; font-weight: 600; }
.ma-rule-list { min-width: 0; border-top: 1px solid var(--ma-line); }
.ma-rule-item { border-bottom: 1px solid var(--ma-line); interpolate-size: allow-keywords; }
.ma-rule-item > summary { display: flex; align-items: baseline; gap: 16px; padding: 19px 4px 19px 0; cursor: pointer; list-style: none; font-size: 16px; font-weight: 600; line-height: 1.6; }
.ma-rule-item > summary::-webkit-details-marker { display: none; }
.ma-rule-item > summary::marker { content: ""; }
.ma-rule-item > summary:hover, .ma-rule-item[open] > summary { color: var(--cc-brand-dark); }
.ma-rule-item > summary:focus-visible { outline: 2px solid var(--cc-brand-strong); outline-offset: 2px; border-radius: 4px; }
.ma-rule-number { flex-shrink: 0; color: var(--ma-gold-deep); font-family: var(--ma-serif); font-size: 14px; font-weight: 400; font-variant-numeric: tabular-nums; }
.ma-rule-question { flex: 1; min-width: 0; }
.ma-rule-chevron { flex: none; align-self: center; width: 9px; height: 9px; margin-right: 4px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform .2s ease; }
.ma-rule-item[open] .ma-rule-chevron { transform: rotate(225deg); }
.ma-rule-item > p { max-width: 46em; margin: 0 36px 20px 34px; color: var(--ma-muted); font-size: 15px; line-height: 1.9; }
.ma-rule-item::details-content { display: block; height: 0; opacity: 0; overflow: hidden; transition: height .24s ease, opacity .2s ease, content-visibility .24s allow-discrete; }
.ma-rule-item[open]::details-content { height: auto; opacity: 1; }
@starting-style {
  .ma-rule-item[open]::details-content { height: 0; opacity: 0; }
}

/* The closing band echoes the hero so the page is bookended in the same voice. */
.ma-closing { position: relative; isolation: isolate; overflow: hidden; padding: 88px 0; color: var(--ma-on-dark); background: var(--ma-night); text-align: center; }
.ma-closing::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("../../img/pages/mid-autumn-gold-pattern.svg") center / cover no-repeat; opacity: .5; pointer-events: none; }
.ma-closing-inner { display: flex; flex-direction: column; align-items: center; }
.ma-closing p { color: var(--ma-on-dark-muted); font-size: 14px; letter-spacing: .08em; }
.ma-closing h2 { margin-top: 14px; color: var(--ma-on-dark); font-family: var(--ma-serif); font-size: clamp(26px, 2.6vw, 38px); font-weight: 400; line-height: 1.4; letter-spacing: .06em; }
.ma-page .ma-closing-button { margin-top: 32px; border-color: rgba(230, 207, 156, .5); color: var(--ma-gold); background: transparent; }
.ma-page .ma-closing-button:hover:not(:disabled) { border-color: var(--ma-gold); color: var(--ma-on-dark); background: rgba(230, 207, 156, .08); }
.ma-closing a:focus-visible { outline-color: var(--ma-gold); }

@media (max-width: 1100px) {
  .ma-jump-links { gap: 26px; }
  .ma-rules-grid { gap: 48px; }
  .ma-rules-heading > p br { display: none; }
}
@media (max-width: 760px) {
  .ma-container { width: calc(100% - 32px); }
  .ma-page [id] { scroll-margin-top: 124px; }
  .ma-section { padding: 60px 0; }
  .ma-section-head { margin-bottom: 28px; }
  .ma-section h2 { font-size: 26px; }
  .ma-section-description { font-size: 14px; }
  .ma-jump-nav { top: 60px; }
  .ma-jump-inner { min-height: 52px; gap: 0; }
  .ma-jump-brand { display: none; }
  .ma-jump-links { width: 100%; justify-content: space-between; gap: 12px; overflow-x: auto; }
  .ma-jump-links a { padding: 16px 0; font-size: 13px; }
  .ma-rules-grid { grid-template-columns: 1fr; gap: 28px; }
  .ma-rules-heading > .ma-text-link { margin-top: 22px; padding-top: 0; }
  .ma-rules-heading h2 br { display: none; }
  .ma-rules-heading > p:not(.ma-section-kicker) { margin: 12px 0 16px; font-size: 14px; }
  .ma-rules-heading > .ma-rules-caveat { margin: 12px 0 18px; font-size: 13px; }
  .ma-rule-item > summary { gap: 12px; padding: 17px 0; font-size: 15px; }
  .ma-rule-item > p { margin: 0 24px 18px 30px; font-size: 14px; }
  .ma-closing { padding: 64px 0 108px; }
  .ma-closing p { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(.ma-page) { scroll-behavior: auto; }
  .ma-page .btn, .ma-page .ma-wheel-rotor, .ma-rule-chevron, .ma-rule-item::details-content { transition: none; }
}