/* ========================================================================
 * base.css — element resets, body, global keyframes, table defaults
 *
 * Targets bare elements or sets up app-wide primitives. Loaded after
 * tokens.css so that var(--*) references resolve.
 * ======================================================================== */

/* ── Reset ──────────────────────────────────────────────── */
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: 'Inter', system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}

/* ── Screen primitives ──────────────────────────────────── */
.screen { width: 100vw; min-height: 100vh; }
.screen-dark {
  background: radial-gradient(ellipse at 30% 20%, #1C2340 0%, #0F1320 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── Animations / keyframes ─────────────────────────────── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}
.fade-up { animation: fadeUp 0.35s ease forwards; }

@keyframes blink { 0%,100% { opacity: 1; } 50% { opacity: 0.35; } }
@keyframes spin  { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* ── Table defaults ─────────────────────────────────────── */
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th {
  background: rgba(0,0,0,0.2);
  text-align: left;
  padding: 10px 14px;
  font-size: 10.5px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  white-space: nowrap;
}
td {
  padding: 10px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.035);
  color: var(--text);
}
tr:hover td { background: rgba(255,255,255,0.025); }
tr:last-child td { border-bottom: none; }

/* ── Auth-session helper ────────────────────────────────── */
/* Hide login screen on reload if a Supabase session is in localStorage —
   prevents the login flash before async restoreSession() flips screens. */
html.has-session #screen-login { display: none !important; }