/* MIND PAUSE · Design-Tokens
 * Die einzige Stelle für Schriften, Farben, Abstände, Schatten und Bewegung.
 * Eine Änderung hier wirkt in allen Spielen. Siehe shared/README.md.
 */

:root {
  --bg: #ece8e1;
  --bg-edge: #e2ddd4;
  --ink: #1a1d4e;
  --ink-soft: #6b6d85;
  --btn: #f7f4ef;
  --btn-border: rgba(26, 29, 78, 0.12);
  --card: #faf8f4;
  --sheet: #f6f3ee;
  --accent: #3f6ef0;
  --star: #e0a526;
  --hint: #ffd36b;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 4px 14px rgba(26, 29, 78, 0.08);
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-display: "Didot", "Bodoni 72", "Playfair Display", Georgia, "Times New Roman", serif;
  --ease: cubic-bezier(0.32, 0.72, 0, 1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #141519;
    --bg-edge: #0d0e11;
    --ink: #e9e7f2;
    --ink-soft: #8f91a6;
    --btn: #1e2027;
    --btn-border: rgba(255, 255, 255, 0.08);
    --card: #1e2027;
    --sheet: #1b1d23;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 4px 14px rgba(0, 0, 0, 0.3);
  }
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

body {
  background: radial-gradient(120% 90% at 50% 40%, var(--bg) 55%, var(--bg-edge) 100%);
  background-color: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  touch-action: manipulation;
}

button {
  font: inherit;
  color: inherit;
}

[hidden] {
  display: none !important;
}