:root {
  color-scheme: dark;
  --bg: #090b10;
  --panel: #12151d;
  --panel-2: #191d27;
  --text: #f5f2ea;
  --muted: #969baa;
  --accent: #ffcc66;
  --accent-strong: #ffb82e;
  --danger: #ff6b6b;
  --border: rgba(255, 255, 255, 0.09);
}

* { box-sizing: border-box; }

html, body { margin: 0; min-height: 100%; }

body {
  background:
    radial-gradient(circle at 15% 0%, rgba(255, 184, 46, 0.08), transparent 32rem),
    var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

button, textarea { font: inherit; }

button {
  border: 0;
  cursor: pointer;
  touch-action: manipulation;
}

.brand {
  color: var(--accent);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.status {
  align-items: center;
  color: var(--muted);
  display: inline-flex;
  font-size: .83rem;
  gap: .5rem;
}

.status::before {
  background: var(--danger);
  border-radius: 50%;
  content: "";
  height: .48rem;
  width: .48rem;
}

.status.online::before {
  background: #62df93;
  box-shadow: 0 0 0 .2rem rgba(98, 223, 147, .12);
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; }
}