@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Chakra+Petch:wght@500;600;700&display=swap");

:root {
  --cc-bg: #05070a;
  --cc-panel: #0b1119;
  --cc-panel-border: #1b2b26;
  --cc-green: #35ffb0;
  --cc-green-dim: #1c8f6d;
  --cc-amber: #ffb020;
  --cc-red: #ff4d5e;
  --cc-text: #d6f2e6;
  --cc-text-dim: #7ea394;
  --cc-font-display: "Chakra Petch", "JetBrains Mono", monospace;
  --cc-font-mono: "JetBrains Mono", ui-monospace, monospace;
}

* {
  box-sizing: border-box;
}

html,
body {
  height: 100%;
}

body {
  margin: 0;
  background: var(--cc-bg);
  color: var(--cc-text);
  font-family: var(--cc-font-mono);
  overflow-x: hidden;
}

#background-slot {
  position: fixed;
  inset: 0;
  z-index: 0;
}

.console-shell {
  position: relative;
  z-index: 1;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 1.5rem;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}