/* base.css — shared reset + tokens for Tif.Pink marketing pages and the game shell.
   Balanced world palette (NOT all pink): pink · cream · green · sky · brown · gold. */
@font-face {
  font-family: "Baloo 2";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/baloo2-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Nunito";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/nunito-latin.woff2") format("woff2");
}

:root {
  --pink: #ffb6d5;
  --pink-soft: #ffd9e6;
  --cream: #fff6ea;
  --green: #8fd49b;
  --green-deep: #4f9d6b;
  --sky: #aee3ff;
  --brown: #b98a5e;
  --brown-deep: #8a5a36;
  --gold: #ffd166;
  --ink: #3a2f2a;
  --ink-soft: #6b5b52;
  --shadow: 0 8px 24px rgba(80, 50, 40, .15);
  --radius: 18px;
  --font: "Baloo 2", "Quicksand", "Segoe UI", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
body {
  font-family: var(--font);
  color: var(--ink);
  background: var(--cream);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: var(--brown-deep); }
img { max-width: 100%; }
button { font-family: inherit; cursor: pointer; }
.hidden { display: none !important; }
.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;
}

/* accessible focus ring */
:focus-visible { outline: 3px solid var(--brown-deep); outline-offset: 2px; border-radius: 8px; }

.skip-link {
  position: absolute; left: -999px; top: 0; background: #fff; padding: 10px 14px; border-radius: 8px; z-index: 50;
}
.skip-link:focus { left: 12px; top: 12px; }