/* ══════════════════════════════════════
   RESET & VARIABLES
══════════════════════════════════════ */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none
}

:root {
  --bg: #0a0a0a;
  --bg2: #111111;
  --card: #181818;
  --card2: #1e1e1e;
  --border: #2a2a2a;
  --border2: #333;
  --red: #e01515;
  --red2: #b01010;
  --red-glow: rgba(224, 21, 21, .18);
  --green: #00e676;
  --green-dim: rgba(0, 230, 118, .12);
  --yellow: #ffb300;
  --purple: #a78bfa;
  --text: #f5f5f5;
  --sub: #888;
  --dim: #444;
  --sat: env(safe-area-inset-top, 0px);
  --sab: env(safe-area-inset-bottom, 0px);
  --sal: env(safe-area-inset-left, 0px);
  --sar: env(safe-area-inset-right, 0px);
  --nav-h: 64px;
}

html,
body {
  height: 100%;
  min-height: 100%;
  background: var(--bg);
  font-family: 'DM Sans', sans-serif;
  color: var(--text);
  overflow: hidden;
  font-size: 15px;
  line-height: 1.4;
}