:root {
  --bg-void: #020305;
  --bg-deep: #08101b;
  --bg-panel: rgba(8, 15, 27, 0.86);
  --bg-card: rgba(255, 255, 255, 0.04);
  --header-bg: #090d14;
  --sidebar-bg: #070b12;
  --main-bg: #030507;
  --header-height: 68px;
  --line-soft: rgba(255, 255, 255, 0.09);
  --line-strong: rgba(255, 255, 255, 0.16);
  --text-main: #f4f7fb;
  --text-muted: rgba(244, 247, 251, 0.66);
  --text-dim: rgba(244, 247, 251, 0.46);
  --gold: #f5b335;
  --gold-soft: rgba(245, 179, 53, 0.16);
  --gold-strong: rgba(245, 179, 53, 0.36);
  --shadow-xl: 0 28px 60px rgba(0, 0, 0, 0.45);
  --shadow-card: 0 20px 35px rgba(0, 0, 0, 0.24);
}

html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: "Space Grotesk", "Rubik", "Segoe UI", sans-serif;
  font-size: 15px;
  color: var(--text-main);
  background: var(--main-bg);
  padding: 0;
}

body::before,
body::after {
  display: none;
}

* {
  box-sizing: border-box;
}

:where(a, button, input, select, textarea):focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

html {
  scroll-behavior: smooth;
}