:root {
  --bg: #060a13;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  background:
    radial-gradient(1200px 600px at 15% -10%, rgba(34,211,238,0.10), transparent 60%),
    radial-gradient(1000px 500px at 100% 0%, rgba(168,85,247,0.10), transparent 55%),
    linear-gradient(180deg, #060a13 0%, #070b16 100%);
  background-attachment: fixed;
  min-height: 100vh;
  color: #e2e8f0;
}
.font-display { font-family: 'Space Grotesk', sans-serif; }
.font-mono { font-family: 'IBM Plex Mono', monospace; }

/* subtle grid texture overlay */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image:
    linear-gradient(rgba(148,163,184,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,163,184,0.035) 1px, transparent 1px);
  background-size: 44px 44px;
  pointer-events: none;
  z-index: 0;
}
#root { position: relative; z-index: 1; }

/* shimmer for pending rows */
.shimmer {
  background: linear-gradient(90deg, transparent 0%, rgba(34,211,238,0.06) 50%, transparent 100%);
  background-size: 200% 100%;
  animation: shimmer 1.2s linear infinite;
}
@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.toast-in { animation: toastIn 0.25s ease-out; }
@keyframes toastIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* scrollbar */
::-webkit-scrollbar { height: 10px; width: 10px; }
::-webkit-scrollbar-track { background: #0b1220; }
::-webkit-scrollbar-thumb { background: #1e293b; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #334155; }

input[type="range"] { height: 4px; border-radius: 4px; }
table th { position: sticky; top: 0; }