:root {
  --bg: #fff8e7;
  --fg: #3a2a1a;
  --fg-soft: #6b5a4a;
  --accent: #ff8a4c;
  --accent-fg: #fff;
  --card-new: #ffd9a3;
  --card-review: #b8e0d2;
  --card-shadow: 0 4px 12px rgba(58, 42, 26, 0.15);
  --radius-card: 24px;
  --radius-button: 16px;
  --gap: 20px;
  --max-width: 480px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  background: var(--bg);
  color: var(--fg);
  font-family: system-ui, -apple-system, "Segoe UI", "PingFang TC", "Microsoft JhengHei", sans-serif;
  font-size: 18px;
  line-height: 1.5;
  -webkit-tap-highlight-color: transparent;
}

#app {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 24px 16px;
  min-height: 100vh;
}