/*
Theme Name: GoSum Coming Soon
Theme URI: https://gosum.fun/
Author: GoSum
Description: Lightweight GoSum.fun theme with coming-soon homepage and How to Play guide.
Version: 1.2.0
Text Domain: gosum-coming-soon
*/

:root {
  --gs-blue: #20afea;
  --gs-blue-deep: #147fc9;
  --gs-blue-dark: #185491;
  --gs-purple: #6643a6;
  --gs-red: #f23a32;
  --gs-cream: #fff9ef;
  --gs-ink: #202536;
  --gs-white: #ffffff;
  --gs-shadow: rgba(24, 53, 104, .24);
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  color: var(--gs-ink);
  font-family: ui-rounded, "SF Pro Rounded", "Avenir Next", Avenir, Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #75c7f2;
  overflow-x: hidden;
}

body.admin-bar .site-shell { min-height: calc(100vh - 32px); }

.site-shell {
  position: relative;
  min-height: 100vh;
  display: grid;
  grid-template-rows: 1fr auto;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 24%, rgba(255,255,255,.62) 0 3%, rgba(255,255,255,.15) 29%, transparent 48%),
    linear-gradient(160deg, #7657ae 0%, #6a70c1 14%, #54b9e8 43%, #86d7f2 72%, #7fc0ee 100%);
}

.site-shell::before {
  content: "";
  position: absolute;
  z-index: -3;
  width: 150vmax;
  height: 150vmax;
  left: 50%;
  top: -112vmax;
  transform: translateX(-50%);
  border-radius: 50%;
  background: repeating-conic-gradient(
    from -4deg,
    rgba(255,255,255,.15) 0 4deg,
    rgba(255,255,255,0) 4deg 10deg
  );
  opacity: .55;
}

.site-shell::after {
  content: "";
  position: absolute;
  z-index: -2;
  inset: auto -10% 0;
  height: 24vh;
  min-height: 180px;
  background:
    radial-gradient(ellipse at 5% 92%, #81baf0 0 22%, transparent 22.5%),
    radial-gradient(ellipse at 22% 104%, #82bef0 0 29%, transparent 29.5%),
    radial-gradient(ellipse at 43% 94%, #a6d7f6 0 28%, transparent 28.5%),
    radial-gradient(ellipse at 68% 103%, #8bc7f3 0 28%, transparent 28.5%),
    radial-gradient(ellipse at 91% 91%, #7db9ef 0 25%, transparent 25.5%);
  filter: drop-shadow(0 -10px 20px rgba(255,255,255,.45));
  opacity: .96;
}

.hero {
  width: min(1180px, calc(100% - 38px));
  margin: 0 auto;
  padding: clamp(42px, 7vh, 92px) 0 clamp(190px, 24vh, 275px);
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(290px, .95fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
}

.copy { position: relative; z-index: 2; }
.brand-card {
  width: min(650px, 100%);
  margin-bottom: 28px;
  border-radius: 32px;
  overflow: hidden;
  box-shadow: 0 22px 55px rgba(36, 33, 72, .25), inset 0 0 0 1px rgba(255,255,255,.5);
  transform: rotate(-1deg);
  background: rgba(255,255,255,.12);
}
.brand-card img { display: block; width: 100%; height: auto; }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .55em;
  margin: 0 0 16px;
  padding: 8px 14px;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 999px;
  color: #fff;
  background: rgba(28, 80, 145, .24);
  backdrop-filter: blur(8px);
  font-size: clamp(.8rem, 1.4vw, .95rem);
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  box-shadow: 0 8px 25px rgba(35,66,114,.12);
}
.eyebrow::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--gs-red);
  box-shadow: 0 0 0 4px rgba(255,255,255,.22);
}

h1 {
  margin: 0;
  max-width: 760px;
  color: #fff;
  font-size: clamp(3rem, 7vw, 6.7rem);
  line-height: .92;
  letter-spacing: -.055em;
  text-wrap: balance;
  text-shadow: 0 7px 25px rgba(34,70,124,.25);
}

.intro {
  max-width: 660px;
  margin: 22px 0 0;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.08rem, 2vw, 1.45rem);
  line-height: 1.52;
  font-weight: 650;
  text-shadow: 0 3px 12px rgba(22,68,113,.24);
}

.badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}
.badge {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 9px 15px;
  border-radius: 14px;
  color: #fff;
  background: rgba(42,75,138,.22);
  border: 1px solid rgba(255,255,255,.34);
  font-weight: 750;
  font-size: .92rem;
  backdrop-filter: blur(7px);
}

.mascot-wrap {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  min-height: 400px;
}
.mascot-glow {
  position: absolute;
  width: 88%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.52), rgba(255,255,255,.10) 45%, transparent 70%);
  filter: blur(6px);
}
.mascot {
  position: relative;
  width: min(510px, 100%);
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 19%;
  box-shadow: 0 32px 55px rgba(27,60,111,.28), 0 0 0 1px rgba(255,255,255,.38);
  transform: rotate(3deg);
  animation: gs-float 5.2s ease-in-out infinite;
}

.sparkle,
.sparkle::before,
.sparkle::after {
  position: absolute;
  width: 11px;
  height: 11px;
  content: "";
  background: white;
  clip-path: polygon(50% 0, 61% 38%, 100% 50%, 61% 62%, 50% 100%, 39% 62%, 0 50%, 39% 38%);
  filter: drop-shadow(0 2px 6px rgba(255,255,255,.55));
}
.sparkle { right: 1%; top: 18%; transform: scale(1.4); }
.sparkle::before { left: -110px; top: 260px; transform: scale(.8); }
.sparkle::after { left: 34px; top: 330px; transform: scale(.55); }

.site-footer {
  position: relative;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
  padding: 17px clamp(22px, 4vw, 58px);
  color: rgba(255,255,255,.92);
  background: rgba(38,73,127,.58);
  border-top: 1px solid rgba(255,255,255,.2);
  backdrop-filter: blur(8px);
  font-size: .95rem;
  font-weight: 700;
}
.site-footer a { color: #fff; text-decoration: none; }
.site-footer a:hover, .site-footer a:focus { text-decoration: underline; }

@keyframes gs-float {
  0%, 100% { transform: translateY(0) rotate(3deg); }
  50% { transform: translateY(-12px) rotate(1.5deg); }
}

@media (prefers-reduced-motion: reduce) {
  .mascot { animation: none; }
}

@media (max-width: 820px) {
  body.admin-bar .site-shell { min-height: calc(100vh - 46px); }
  .hero {
    width: min(680px, calc(100% - 28px));
    grid-template-columns: 1fr;
    text-align: center;
    padding-top: 30px;
    padding-bottom: 180px;
  }
  .brand-card { margin-inline: auto; margin-bottom: 22px; border-radius: 24px; }
  .eyebrow { margin-inline: auto; }
  .intro { margin-inline: auto; }
  .badges { justify-content: center; }
  .mascot-wrap { min-height: 0; margin-top: -8px; }
  .mascot { width: min(390px, 88vw); }
  .sparkle { display: none; }
}

@media (max-width: 560px) {
  h1 { font-size: clamp(2.75rem, 16vw, 4.4rem); }
  .intro { font-size: 1.05rem; }
  .brand-card { border-radius: 18px; }
  .site-footer {
    flex-direction: column;
    align-items: center;
    gap: 5px;
    text-align: center;
    padding-block: 13px;
  }
  .badge { font-size: .84rem; }
}

/* =========================================================
   How to Play
   ========================================================= */
body.gosum-how-to-play {
  background: #eef9ff;
}

.rules-shell {
  min-height: 100vh;
  background:
    radial-gradient(circle at 8% 16%, rgba(255,255,255,.92), transparent 25rem),
    linear-gradient(180deg, #72caf3 0 41rem, #f7fbfe 41rem 100%);
}

.rules-topbar {
  position: relative;
  z-index: 10;
  width: min(1180px, calc(100% - 36px));
  margin: 0 auto;
  padding: 18px 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.rules-brand {
  display: block;
  width: min(210px, 45vw);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(27,68,119,.16);
}
.rules-brand img { display: block; width: 100%; height: auto; }
.rules-home-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 9px 17px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.55);
  color: #fff;
  background: rgba(31,76,133,.24);
  text-decoration: none;
  font-weight: 850;
  backdrop-filter: blur(8px);
}
.rules-home-link:hover,
.rules-home-link:focus { background: rgba(31,76,133,.38); }

.rules-hero {
  position: relative;
  width: min(1180px, calc(100% - 36px));
  min-height: 570px;
  margin: 0 auto;
  padding: clamp(42px, 6vw, 82px) 0 90px;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, .92fr);
  align-items: center;
  gap: clamp(25px, 5vw, 75px);
}
.rules-hero::before {
  content: "";
  position: absolute;
  z-index: 0;
  width: 1200px;
  height: 1200px;
  right: -620px;
  top: -790px;
  border-radius: 50%;
  background: repeating-conic-gradient(from 5deg, rgba(255,255,255,.16) 0 4deg, transparent 4deg 11deg);
  pointer-events: none;
}
.rules-hero-copy { position: relative; z-index: 2; }
.rules-eyebrow,
.rules-kicker {
  margin: 0 0 10px;
  font-size: .82rem;
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.rules-eyebrow { color: rgba(255,255,255,.95); }
.rules-kicker { color: var(--gs-red); }
.rules-hero h1 {
  margin: 0;
  color: #fff;
  font-size: clamp(4.5rem, 9vw, 8.5rem);
  line-height: .86;
  letter-spacing: -.07em;
  text-shadow: 0 9px 28px rgba(31,72,128,.20);
}
.rules-lead {
  max-width: 690px;
  margin: 25px 0 0;
  color: #1c2340;
  font-size: clamp(1.15rem, 2.1vw, 1.48rem);
  line-height: 1.5;
  font-weight: 700;
  text-shadow: 0 3px 12px rgba(24,72,120,.18);
}
.rules-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}
.rules-facts > div {
  min-width: 120px;
  padding: 12px 17px;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 17px;
  background: rgba(34,79,139,.20);
  color: white;
  backdrop-filter: blur(8px);
}
.rules-facts strong { display: block; font-size: 1.35rem; line-height: 1; }
.rules-facts span { display: block; margin-top: 4px; font-size: .78rem; font-weight: 800; opacity: .9; }
.rules-mascot-wrap { position: relative; z-index: 2; display: grid; place-items: center; }
.rules-mascot-glow {
  position: absolute;
  width: 95%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.7), rgba(255,255,255,.12) 53%, transparent 70%);
}
.rules-mascot {
  position: relative;
  width: min(420px, 88%);
  border-radius: 18%;
  transform: rotate(4deg);
  box-shadow: 0 30px 60px rgba(25,67,120,.25), 0 0 0 1px rgba(255,255,255,.35);
  animation: gs-float 5.2s ease-in-out infinite;
}

.rules-section {
  position: relative;
  width: min(1120px, calc(100% - 36px));
  margin: 0 auto 30px;
  padding: clamp(34px, 5vw, 62px);
  border-radius: 34px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(34,74,120,.10);
}
.rules-section-heading { max-width: 790px; margin-bottom: 30px; }
.rules-section h2 {
  margin: 0 0 13px;
  color: var(--gs-ink);
  font-size: clamp(2rem, 4.7vw, 3.6rem);
  line-height: 1;
  letter-spacing: -.045em;
}
.rules-section p { font-size: 1.05rem; line-height: 1.65; }
.rules-section-heading > p:last-child { color: #586176; }
.rules-intro-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(20px, 4vw, 45px);
  align-items: start;
  margin-top: -35px;
}
.section-number {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  border-radius: 21px;
  background: linear-gradient(145deg, #23b5ef, #147fc9);
  color: #fff;
  font-weight: 950;
  font-size: 1.55rem;
  box-shadow: 0 11px 25px rgba(20,127,201,.25);
}

.rack-demo {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(8px, 1.4vw, 14px);
  padding: 25px;
  border-radius: 24px;
  background: linear-gradient(135deg, #eff9ff, #e1f3ff);
  border: 1px solid #d2ebf9;
}
.demo-tile {
  position: relative;
  display: grid;
  place-items: center;
  width: clamp(58px, 8.5vw, 82px);
  aspect-ratio: 1;
  border-radius: 15px;
  font-size: clamp(1.8rem, 4vw, 2.5rem);
  font-weight: 950;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.6), 0 7px 13px rgba(49,69,91,.14);
}
.demo-number { color: #24314f; background: linear-gradient(145deg, #fff8d9, #e9c769); }
.demo-number small { position: absolute; right: 8px; bottom: 5px; font-size: .64rem; }
.demo-symbol { color: #fff; background: linear-gradient(145deg, #7551b6, #513190); }
.rules-callout {
  margin-top: 24px;
  padding: 20px 22px;
  border-radius: 20px;
  border-left: 5px solid var(--gs-red);
  background: #fff5f3;
  font-size: 1rem;
  line-height: 1.6;
}
.blank-callout { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 16px; }
.blank-demo {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  color: #513190;
  background: #fff;
  box-shadow: 0 5px 13px rgba(45,56,88,.12);
}

.rules-blue,
.rules-finish {
  overflow: hidden;
  color: #fff;
  background: linear-gradient(145deg, #1baeea, #167fc8 65%, #6550a6 130%);
}
.rules-blue::after,
.rules-finish::after {
  content: "";
  position: absolute;
  width: 550px;
  height: 550px;
  right: -260px;
  top: -280px;
  border-radius: 50%;
  background: repeating-conic-gradient(rgba(255,255,255,.08) 0 5deg, transparent 5deg 14deg);
}
.light .rules-kicker { color: #fff; opacity: .78; }
.rules-blue h2,
.rules-finish h2 { color: #fff; }
.step-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
}
.step-card {
  padding: 22px;
  border-radius: 22px;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(6px);
}
.step-card > span {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #fff;
  color: var(--gs-blue-dark);
  font-weight: 950;
}
.step-card h3 { margin: 16px 0 8px; font-size: 1.08rem; }
.step-card p { margin: 0; font-size: .94rem; line-height: 1.5; color: rgba(255,255,255,.92); }
.first-move-note {
  position: relative;
  z-index: 1;
  margin-top: 20px;
  padding: 17px 20px;
  border-radius: 18px;
  color: #26334b;
  background: #dff8e3;
  font-size: .96rem;
}

.equation-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }
.equation-card {
  min-height: 146px;
  padding: 20px;
  border-radius: 22px;
  border: 1px solid #e1e8ef;
  background: #f9fbfd;
}
.equation-card.correct { border-color: #cfead5; background: #f2fcf4; }
.equation-card.wrong { border-color: #f0d2ce; background: #fff6f4; }
.equation-status { display: block; margin-bottom: 16px; font-size: .8rem; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; }
.correct .equation-status { color: #248a44; }
.wrong .equation-status { color: #c53c31; }
.equation { font-size: clamp(1.45rem, 4vw, 2.15rem); font-weight: 950; color: #26334b; letter-spacing: -.025em; }
.equation-card p { margin: 8px 0 0; font-size: .9rem; color: #73798a; }
.inline-equation { white-space: nowrap; font-weight: 900; color: #2a3c64; }
.adjacency-note { margin: 22px 0 0; color: #697083; font-size: .96rem !important; }

.bonus-section { background: linear-gradient(180deg, #fff 0, #fffaf0 100%); }
.bonus-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.bonus-grid article {
  padding: 24px 18px;
  border: 1px solid #ece4d5;
  border-radius: 22px;
  background: #fff;
  text-align: center;
}
.bonus-grid h3 { margin: 15px 0 8px; font-size: 1.02rem; }
.bonus-grid p { margin: 0; color: #697083; font-size: .9rem; line-height: 1.5; }
.bonus-badge {
  display: grid;
  place-items: center;
  width: 70px;
  height: 70px;
  margin: 0 auto;
  border-radius: 19px;
  color: #fff;
  font-size: 1.35rem;
  font-weight: 950;
  box-shadow: 0 8px 18px rgba(47,65,92,.18);
}
.bonus-badge.dn { background: linear-gradient(145deg, #25b7ed, #1688ce); }
.bonus-badge.tn { background: linear-gradient(145deg, #6844a9, #4e2e89); }
.bonus-badge.ds { background: linear-gradient(145deg, #f06155, #d5342d); }
.bonus-badge.ts { background: linear-gradient(145deg, #efb83d, #d78b19); }
.fifty-bonus {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 20px;
  padding: 19px 22px;
  border-radius: 20px;
  color: #594411;
  background: linear-gradient(90deg, #ffe8a4, #fff4d1);
}
.fifty-bonus strong { flex: 0 0 auto; font-size: 1.35rem; }

.option-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.option-grid article { padding: 25px; border-radius: 22px; background: #eef8fe; }
.option-grid h3 { margin: 0 0 9px; color: var(--gs-blue-dark); font-size: 1.3rem; }
.option-grid p { margin: 0; font-size: .96rem; color: #59647a; }

.rules-finish p { position: relative; z-index: 1; max-width: 850px; }
.winner-card {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px;
  align-items: center;
  margin-top: 25px;
  padding: 23px;
  border-radius: 22px;
  color: #293752;
  background: #fff;
}
.winner-card > span { font-size: 2.1rem; }
.winner-card strong { font-size: 1.15rem; }
.winner-card p { margin: 5px 0 0; color: #5e687d; font-size: .96rem; }

.rules-summary {
  display: grid;
  grid-template-columns: 170px 1fr;
  gap: 35px;
  align-items: center;
  margin-bottom: 45px;
  background: linear-gradient(135deg, #f0f9ff, #fff);
}
.rules-summary > img { width: 100%; border-radius: 21%; transform: rotate(-4deg); box-shadow: 0 15px 28px rgba(35,69,112,.16); }
.rules-summary p { color: #59647a; }
.rules-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  margin-top: 8px;
  padding: 10px 20px;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(145deg, var(--gs-blue), var(--gs-blue-deep));
  text-decoration: none;
  font-weight: 900;
  box-shadow: 0 9px 20px rgba(20,127,201,.23);
}
.rules-footer { position: static; }

@media (max-width: 900px) {
  .rules-hero { grid-template-columns: 1fr; text-align: center; padding-bottom: 75px; }
  .rules-facts { justify-content: center; }
  .rules-mascot { width: min(330px, 72vw); }
  .step-grid, .bonus-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 620px) {
  .rules-shell { background: linear-gradient(180deg, #72caf3 0 48rem, #f7fbfe 48rem 100%); }
  .rules-topbar { width: min(100% - 24px, 1180px); }
  .rules-brand { width: 165px; }
  .rules-hero { width: min(100% - 24px, 1180px); min-height: 0; padding-top: 42px; }
  .rules-hero h1 { font-size: clamp(4rem, 22vw, 6rem); }
  .rules-facts > div { flex: 1 1 30%; min-width: 92px; padding-inline: 9px; }
  .rules-section { width: min(100% - 20px, 1120px); padding: 28px 20px; border-radius: 25px; margin-bottom: 18px; }
  .rules-intro-card { grid-template-columns: 1fr; }
  .section-number { width: 58px; height: 58px; border-radius: 17px; }
  .rules-section h2 { font-size: 2.25rem; }
  .rack-demo { justify-content: center; padding: 18px 12px; }
  .demo-tile { width: calc(25% - 9px); max-width: 68px; }
  .blank-callout, .winner-card { grid-template-columns: 1fr; }
  .step-grid, .equation-grid, .bonus-grid, .option-grid { grid-template-columns: 1fr; }
  .fifty-bonus { align-items: flex-start; flex-direction: column; gap: 4px; }
  .rules-summary { grid-template-columns: 1fr; text-align: center; }
  .rules-summary > img { width: min(170px, 55vw); margin: 0 auto; }
}

.coming-soon-link { margin: 18px 0 0; }
.coming-soon-link a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 17px;
  border-radius: 999px;
  color: #fff;
  background: rgba(242,58,50,.88);
  border: 1px solid rgba(255,255,255,.28);
  text-decoration: none;
  font-weight: 900;
  box-shadow: 0 8px 20px rgba(99,49,66,.18);
}
.coming-soon-link a:hover,
.coming-soon-link a:focus { background: #d92f29; }

/* =========================================================
   How to Play contrast fixes - v1.2
   Keep white/light cards dark and coloured panels light.
   ========================================================= */
.rules-section:not(.rules-blue):not(.rules-finish),
.rules-section:not(.rules-blue):not(.rules-finish) p,
.rules-section:not(.rules-blue):not(.rules-finish) li,
.rules-section:not(.rules-blue):not(.rules-finish) h3,
.rules-section:not(.rules-blue):not(.rules-finish) strong {
  color: var(--gs-ink);
}

.rules-section:not(.rules-blue):not(.rules-finish) .rules-section-heading > p:last-child,
.rules-section:not(.rules-blue):not(.rules-finish) .adjacency-note,
.rules-section:not(.rules-blue):not(.rules-finish) .bonus-grid p,
.rules-section:not(.rules-blue):not(.rules-finish) .option-grid p,
.rules-section:not(.rules-blue):not(.rules-finish) .rules-summary p,
.rules-section:not(.rules-blue):not(.rules-finish) .equation-card p {
  color: #465269;
}

/* Preserve deliberate accent colours on light cards. */
.rules-section:not(.rules-blue):not(.rules-finish) .rules-kicker {
  color: var(--gs-red);
}
.rules-section:not(.rules-blue):not(.rules-finish) .correct .equation-status {
  color: #1f7438;
}
.rules-section:not(.rules-blue):not(.rules-finish) .wrong .equation-status {
  color: #a92f27;
}
.rules-section:not(.rules-blue):not(.rules-finish) .inline-equation {
  color: #24365d;
}

/* Coloured sections must remain white. */
.rules-blue,
.rules-blue p,
.rules-blue li,
.rules-blue h2,
.rules-blue h3,
.rules-blue strong,
.rules-finish,
.rules-finish > p,
.rules-finish .rules-section-heading p,
.rules-finish h2 {
  color: #fff;
}

/* White card inside the finish panel intentionally uses dark copy. */
.rules-finish .winner-card,
.rules-finish .winner-card strong {
  color: #202b43;
}
.rules-finish .winner-card p {
  color: #465269;
}


/* How to Play hero intro contrast fix - v1.3 */
.rules-hero .rules-lead {
  color: #1c2340;
  text-shadow: none;
}

/* v1.4: ensure the First move label stays readable on the pale green note */
.first-move-note strong {
  color: #1c2340;
}

/* v1.5 – improve contrast on quick-fact cards */
.rules-facts > div,
.rules-facts > div strong,
.rules-facts > div span {
  color: #1c2340;
  text-shadow: none;
}