@import url("https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700;800;900&family=Inter:wght@400;500;600;700;800;900&display=swap");

:root {
  --c-gold: #C8A24C;
  --c-navy: #0A0E1A;
  --c-border: #E5E7EB;
}

html, body, #rl-app {
  font-family: "Inter", sans-serif !important;
}

body::before {
  content: "CHRONYX";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 48px;
  background: rgba(255, 255, 255, 0.95);
  border-bottom: 1px solid var(--c-border);
  display: flex;
  align-items: center;
  font-family: "Orbitron", sans-serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.18em;
  color: var(--c-navy);
  padding-left: 24px;
  z-index: 100;
  pointer-events: none;
}

/* Push #rl-app below bar AND fill remaining viewport */
#rl-app {
  position: relative !important;
  margin-top: 48px !important;
  height: calc(100vh - 48px) !important;
}