:root {
  --bg: #050505;
  --accent: #D956ff;
  --accent-hover: #A000CC;
  --text: #fff;
  --text-60: rgba(255, 255, 255, 0.6);
  --text-40: rgba(255, 255, 255, 0.4);
  --text-30: rgba(255, 255, 255, 0.3);
  --text-20: rgba(255, 255, 255, 0.2);
  --text-10: rgba(255, 255, 255, 0.1);
  --font-body: 'Roobert', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
  --font-heading: 'Signifier', serif;
  --font-mono: 'Roobert SemiMono', monospace;
}

@font-face {
  font-family: 'Roobert';
  src: url('/fonts/roobert/Roobert-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roobert';
  src: url('/fonts/roobert/Roobert-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roobert SemiMono';
  src: url('/fonts/roobert/RoobertSemiMono-SemiBold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Signifier';
  src: url('/fonts/signifier/Signifier-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: var(--bg);
  color: var(--text);
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.glow {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, var(--accent) 0%, transparent 70%);
  opacity: 0.04;
  filter: blur(64px);
  pointer-events: none;
}