@import url('https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@600;700&display=swap');

:root {
  --bg: #0B1020;
  --surface: #141B34;
  --surface-2: #1B2447;
  --gold: #F4B400;
  --teal: #2DD4BF;
  --danger: #FB7185;
  --text: #E7E9F3;
  --muted: #8891B0;
}

body {
  background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(244,180,0,0.08), transparent), var(--bg);
  color: var(--text);
  font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
  min-height: 100vh;
  padding-bottom: 4.5rem;
}

.font-display { font-family: 'Sora', ui-sans-serif, system-ui, sans-serif; }
.font-mono { font-family: 'JetBrains Mono', ui-monospace, monospace; }

.table-felt {
  background: radial-gradient(circle at 30% 20%, rgba(255,255,255,0.04), transparent 60%), linear-gradient(160deg, #10321f, #0c2417 70%);
  border: 1px solid rgba(45,212,191,0.15);
}

.coin {
  background: radial-gradient(circle at 35% 30%, #FFE28A, var(--gold) 55%, #B87E00 100%);
  box-shadow: inset 0 -2px 3px rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.4), 0 2px 6px rgba(0,0,0,0.4);
  border-radius: 9999px;
}

@keyframes diceRoll {
  0%   { transform: rotate(0deg) scale(1); }
  30%  { transform: rotate(120deg) scale(1.08); }
  60%  { transform: rotate(250deg) scale(0.95); }
  100% { transform: rotate(360deg) scale(1); }
}
.dice-rolling { animation: diceRoll 0.6s ease-in-out; }

@keyframes fadeIn {
  from { opacity: 0; transform: translate(-50%, -8px); }
  to   { opacity: 1; transform: translate(-50%, 0); }
}

@keyframes pulseTurn {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.55; }
}
.pulse-turn { animation: pulseTurn 1.4s ease-in-out infinite; }