/* Craftie Game V1 -- DUNIA MUSLIM palette (emerald + gold on webVault cream).
   Chrome-only override: page bg, header/footer, titles, CTA buttons.
   Gameplay cells/options keep their own colors so contrasts stay safe. */
:root {
  --cgp: #0f8b5f;
  --cgpd: #0a4632;
  --cga: #c8a06a;
  --cgbg: #f6f1ea;
  --cgline: #e8e4df;
}

html, body {
  background: var(--cgbg) !important;
  font-family: "DM Sans", "Nunito", system-ui, sans-serif !important;
}

/* root containers: kill clashing per-game gradients -> palette cream */
#app, .app-wrapper, body > div:first-child {
  background-color: var(--cgbg) !important;
  background-image: none !important;
}

/* start screens get a soft palette wash instead of random candy gradients */
#start-screen, .start-screen {
  background: linear-gradient(160deg, var(--cgbg), #ffffff) !important;
}

/* header / footer chrome -> emerald */
header, .app-wrapper > header, body > header {
  background: linear-gradient(135deg, var(--cgpd), var(--cgp)) !important;
  border: 0 !important;
}
header h1, header h2, header h3 { color: #fff !important; text-shadow: none !important; }
header p { color: #f3e9d8 !important; }
footer {
  background: var(--cgpd) !important;
  color: #e8e2d8 !important;
}
footer p { color: #cfe3d8 !important; }

/* big titles -> webVault serif voice */
h1#main-title, h1#game-title, h1#gameTitle {
  font-family: "Playfair Display", "DM Sans", serif !important;
  letter-spacing: -0.02em;
}

/* CTA buttons in chrome / start screens -> palette pill */
header button, footer button,
#start-screen button, .start-screen button {
  background: linear-gradient(135deg, var(--cgp), var(--cgpd)) !important;
  color: #fff !important;
  border-radius: 999px !important;
  box-shadow: 0 6px 18px rgba(15, 139, 95, 0.25) !important;
}