@font-face{font-family:"KlarariEmoji";src:url("vendor/twemoji.woff2") format("woff2");font-display:swap;unicode-range:U+00A9,U+00AE,U+203C,U+2049,U+20E3,U+2122,U+2139,U+2194-2199,U+21A9-21AA,U+231A-231B,U+2328,U+23CF,U+23E9-23F3,U+23F8-23FA,U+24C2,U+25AA-25AB,U+25B6,U+25C0,U+25FB-25FE,U+2600-27EF,U+2934-2935,U+2B00-2BFF,U+3030,U+303D,U+3297,U+3299,U+1F000-1FAFF,U+1F1E6-1F1FF,U+FE00-FE0F;}
/* tokens.css - sameiginlegir litir, letur og form fyrir Klárara (klarari.is).
   Forsíðan notar þetta beint. Nýir leikir mega afrita þessi gildi inn í
   sína sjálfstæðu HTML skrá (leikir eiga að vera sjálfstæðir, sjá CLAUDE.md). */

:root{
  /* Litir */
  --bg1:#eef4ff;
  --bg2:#fdf6ec;
  --ink:#2b3445;
  --ink-soft:#5b6779;
  --card:#ffffff;
  --line:#dde4ef;
  --accent:#4361ee;
  --accent-soft:#e4e9ff;
  --good:#2fbf71;
  --bad:#ef476f;
  --gold:#ffb703;

  /* Form */
  --radius:18px;
  --radius-lg:22px;

  /* Letur */
  --font: "KlarariEmoji", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Sameiginlegur takki, má nota á forsíðu og í leikjum */
.btn{
  font-family:var(--font);
  border:none; border-radius:14px; padding:12px 20px;
  font-size:16px; font-weight:700;
  background:var(--accent); color:#fff; cursor:pointer;
  box-shadow:0 3px 0 rgba(0,0,0,.12);
}
.btn:active{ transform:translateY(2px); box-shadow:none; }
.btn.ghost{ background:var(--card); color:var(--ink); border:1px solid var(--line); }