/* shared tokens + control recipes, sampled from the hall scene.
   layout styles stay page-local — only identity lives here. */
:root {
  --plum: #211626;      /* sprite outline ink */
  --cream: #f8e3c6;     /* walls */
  --cream2: #fdf2df;    /* card fill */
  --white: #fff8ec;
  --peach: #f8c4ae;     /* floor */
  --mauve: #7d5f66;     /* grout / muted text */
  --teal: #58858b;      /* wall band */
  --teal2: #d9e8e4;
  --gold: #e8a531;      /* coin */
  --gold2: #f5c05e;
  --bad: #c14b52;
}

@font-face{font-family:'Pixelify Sans';src:url(./assets/fonts/pixelify.woff2) format('woff2');font-display:swap}
@font-face{font-family:'Space Grotesk';src:url(./assets/fonts/grotesk-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url(./assets/fonts/grotesk-500.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url(./assets/fonts/grotesk-700.woff2) format('woff2');font-weight:700;font-display:swap}

.btn {
  font: 500 0.85rem 'Space Grotesk', sans-serif;
  color: var(--plum);
  background: var(--white);
  border: 2px solid var(--plum);
  border-radius: 8px;
  padding: 0.5rem 0.85rem;
  cursor: pointer;
  box-shadow: 0 2px 0 var(--plum);
  text-decoration: none;
  display: inline-block;
}
.btn:active:not(:disabled) { transform: translateY(2px); box-shadow: none; }
.btn:hover:not(:disabled) { background: #ffffff; }
.btn:disabled { opacity: 0.5; cursor: default; box-shadow: none; }
.btn.gold { background: var(--gold); font-weight: 700; }
.btn.gold:hover:not(:disabled) { background: var(--gold2); }

.pixcard {
  border: 2px solid var(--plum);
  border-radius: 10px;
  background: var(--cream2);
  box-shadow: 0 3px 0 rgba(33, 22, 38, 0.35);
}