:root {
  color-scheme: dark;
  --rules-navy: #071b2a;
  --rules-deep: #051420;
  --rules-panel: #0c2536;
  --rules-ivory: #f8f2df;
  --rules-muted: #b2c1cb;
  --rules-gold: #f0c566;
  --rules-cyan: #7ed5dd;
  --rules-line: rgba(198, 217, 226, .2);
}

* { box-sizing: border-box; }
html { scroll-padding-top: 24px; }
body.rules-page {
  margin: 0;
  background: var(--rules-navy);
  color: var(--rules-ivory);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
.rules-page a { color: inherit; }
.rules-page a:focus-visible, .rules-page summary:focus-visible {
  outline: 3px solid var(--rules-cyan);
  outline-offset: 5px;
  border-radius: 3px;
}
.rules-page ::selection { background: var(--rules-gold); color: var(--rules-deep); }
.rules-page [hidden] { display: none !important; }
.rules-wrap { width: min(1120px, calc(100% - 80px)); margin-inline: auto; }
.rules-page .rules-skip-link, .rules-page .skip-link {
  position: fixed;
  z-index: 10;
  top: 12px;
  left: 16px;
  padding: 11px 17px;
  border-radius: 7px;
  background: var(--rules-gold);
  color: var(--rules-deep);
  font-weight: 650;
  text-decoration: none;
  transform: translateY(-160%);
}
.rules-skip-link:focus, .rules-page .skip-link:focus { transform: translateY(0); }
.rules-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px;
  min-height: 98px;
  padding-block: 21px;
  border-bottom: 1px solid var(--rules-line);
}
.rules-header > .rules-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px;
}
.rules-brand, .rules-header .brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--rules-ivory);
  font-size: 1.65rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.045em;
  text-decoration: none;
}
.rules-brand img, .rules-header .brand img {
  display: block;
  width: 46px;
  height: 46px;
  object-fit: contain;
}
.rules-brand strong, .rules-header .brand strong { color: var(--rules-gold); font-weight: 600; }
.rules-brand small, .rules-header .brand small {
  display: block;
  margin-top: 5px;
  color: var(--rules-muted);
  font-size: .63rem;
  font-weight: 400;
  letter-spacing: .075em;
}
.rules-header nav { display: flex; align-items: center; flex-wrap: wrap; gap: 11px; }
.rules-header nav a, .rules-tab-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: var(--rules-muted);
  font-size: .8rem;
  line-height: 1.5;
  font-weight: 550;
  text-decoration: none;
}
.rules-header nav a:hover { color: var(--rules-gold); }
.rules-tab-link[aria-current="page"], .rules-tab-link.active {
  border-color: rgba(240, 197, 102, .55);
  background: var(--rules-deep);
  color: var(--rules-gold);
}
.rules-hero { padding-block: 76px 37px; }
.rules-hero .eyebrow, .rules-hero .rules-eyebrow {
  margin: 0 0 19px;
  color: var(--rules-cyan);
  font-size: .68rem;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.rules-hero h1 {
  max-width: 900px;
  margin: 0;
  font-size: clamp(3rem, 5.1vw, 4.6rem);
  font-weight: 550;
  line-height: 1.1;
  letter-spacing: -.055em;
}
.rules-hero h1 em {
  color: var(--rules-gold);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
}
.rules-hero .lede, .rules-hero .rules-lede {
  max-width: 770px;
  margin: 23px 0 0;
  color: var(--rules-muted);
  font-size: 1.05rem;
  line-height: 1.7;
}
.rules-authority {
  max-width: 940px;
  padding: 18px 22px;
  border: 1px solid var(--rules-line);
  border-left: 3px solid var(--rules-cyan);
  border-radius: 0 9px 9px 0;
  background: var(--rules-deep);
  color: var(--rules-muted);
  font-size: .82rem;
}
.rules-authority p { margin: 0; }
.rules-authority p + p { margin-top: 9px; }
.rules-authority strong { color: var(--rules-ivory); font-weight: 650; }
.trade-rules { margin: 40px 0 0; padding: 0; list-style: none; }
.trade-rule {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 27px;
  padding: 35px 0 39px;
  border-top: 1px solid var(--rules-line);
}
.rule-number {
  padding-top: 5px;
  color: var(--rules-gold);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.35rem;
  line-height: 1.4;
}
.rule-copy { min-width: 0; }
.rule-copy h2 {
  max-width: 910px;
  margin: 0;
  color: var(--rules-ivory);
  font-size: clamp(1.85rem, 3vw, 2.7rem);
  font-weight: 600;
  line-height: 1.18;
  letter-spacing: -.035em;
  overflow-wrap: break-word;
}
.rule-copy > p {
  max-width: 850px;
  margin: 19px 0 0;
  color: var(--rules-muted);
  font-size: .96rem;
  line-height: 1.75;
}
.rule-copy a { color: var(--rules-cyan); text-underline-offset: 4px; }
.rule-copy a:hover { color: var(--rules-gold); }
.accounting-note {
  max-width: 920px;
  margin: 23px 0 0;
  padding: 20px 23px;
  border: 1px solid var(--rules-line);
  border-left: 3px solid var(--rules-gold);
  border-radius: 0 9px 9px 0;
  background: var(--rules-panel);
  color: var(--rules-muted);
  font-size: .82rem;
  line-height: 1.7;
}
.accounting-note > :first-child { margin-top: 0; }
.accounting-note > :last-child { margin-bottom: 0; }
.accounting-note strong { color: var(--rules-gold); font-weight: 650; }
.accounting-note h3 {
  margin: 0 0 12px;
  color: var(--rules-ivory);
  font-size: .92rem;
  font-weight: 650;
  line-height: 1.5;
}
.accounting-note .eyebrow {
  margin: 0 0 12px;
  color: var(--rules-cyan);
  font-size: .61rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.accounting-note h2 {
  margin: 0 0 15px;
  color: var(--rules-ivory);
  font-size: 1.55rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.03em;
}
.accounting-status { margin-top: 19px; padding-top: 16px; border-top: 1px solid var(--rules-line); }
.rules-receipt-fields {
  display: grid;
  grid-template-columns: minmax(175px, .5fr) minmax(0, 1fr);
  gap: 10px 24px;
  margin: 19px 0 0;
  padding-top: 17px;
  border-top: 1px solid var(--rules-line);
  font-size: .78rem;
  line-height: 1.7;
}
.rules-receipt-fields > div {
  display: grid;
  grid-template-columns: minmax(175px, .5fr) minmax(0, 1fr);
  grid-column: 1 / -1;
  gap: 8px 24px;
}
.rules-receipt-fields dt { margin: 0; color: var(--rules-ivory); font-weight: 600; }
.rules-receipt-fields dd { margin: 0; color: var(--rules-muted); overflow-wrap: anywhere; }
.rules-version {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px 45px;
  margin-top: 13px;
  padding-block: 26px 40px;
  border-top: 1px solid var(--rules-line);
  color: var(--rules-muted);
  font-size: .72rem;
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.rules-version p { margin: 0; max-width: 710px; }
.rules-version a {
  display: inline-block;
  min-height: 44px;
  padding-block: 9px;
  color: var(--rules-cyan);
  text-underline-offset: 4px;
}
.rules-version a:hover { color: var(--rules-gold); }
.rules-version code { font-size: .72rem; }
.rules-version details { flex-basis: 100%; }
.rules-version summary { color: var(--rules-cyan); cursor: pointer; min-height: 44px; padding-block: 9px; }

@media (max-width: 800px) {
  .rules-wrap { width: calc(100% - 40px); }
  .rules-header, .rules-header > .rules-wrap { gap: 19px; }
  .rules-brand, .rules-header .brand { font-size: 1.45rem; }
  .rules-hero { padding-top: 55px; }
  .rules-hero h1 { font-size: clamp(3rem, 7vw, 4rem); }
  .rules-hero .lede, .rules-hero .rules-lede { font-size: .96rem; }
  .trade-rule { grid-template-columns: 34px minmax(0, 1fr); gap: 20px; }
  .rule-copy > p { font-size: .9rem; }
  .rules-version { flex-direction: column; gap: 8px; }
}

@media (max-width: 540px) {
  .rules-wrap { width: calc(100% - 32px); }
  .rules-header { padding-block: 17px; }
  .rules-header, .rules-header > .rules-wrap { align-items: flex-start; gap: 17px; }
  .rules-brand, .rules-header .brand { font-size: 1.35rem; gap: 9px; }
  .rules-brand img, .rules-header .brand img { width: 38px; height: 38px; }
  .rules-brand small, .rules-header .brand small { font-size: .57rem; }
  .rules-header nav { width: 100%; gap: 7px; }
  .rules-header nav a, .rules-tab-link { font-size: .72rem; padding: 9px 10px; }
  .rules-hero { padding-block: 40px 29px; }
  .rules-hero h1 { font-size: 2.9rem; }
  .rules-hero .eyebrow, .rules-hero .rules-eyebrow { font-size: .61rem; }
  .rules-hero .lede, .rules-hero .rules-lede { font-size: .9rem; margin-top: 18px; }
  .rules-authority { padding: 16px 18px; font-size: .76rem; }
  .trade-rules { margin-top: 30px; }
  .trade-rule { grid-template-columns: 25px minmax(0, 1fr); gap: 14px; padding-block: 29px 31px; }
  .rule-number { font-size: 1.08rem; padding-top: 4px; }
  .rule-copy h2 { font-size: 1.85rem; }
  .rule-copy > p { font-size: .85rem; margin-top: 15px; }
  .accounting-note { margin-top: 20px; padding: 17px 16px; font-size: .76rem; }
  .accounting-note h3 { font-size: .86rem; }
  .rules-receipt-fields { grid-template-columns: minmax(0, 1fr); gap: 3px; font-size: .74rem; }
  .rules-receipt-fields > div { grid-template-columns: minmax(0, 1fr); gap: 3px; padding-block: 8px; }
  .rules-receipt-fields > dd { margin-bottom: 11px; }
  .rules-version { margin-top: 7px; padding-block: 22px 31px; font-size: .67rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
