:root,
[data-theme="dark"] {
  --bg: #1f1e1d;
  --bg-elev: #262624;
  --text: #e8e6de;
  --text-dim: #9b958a;
  --accent: #d97757;
  --error: #e07a5f;
  --border: #3a3937;
}

[data-theme="light"] {
  --bg: #faf9f5;
  --bg-elev: #ffffff;
  --text: #2b2a28;
  --text-dim: #6b6862;
  --accent: #c15f3c;
  --error: #b3402a;
  --border: #e3e1d8;
}

* { box-sizing: border-box; }

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

/* Hide the scrollbar visually; scrolling stays functional
   (wheel, trackpad, keyboard, and auto-scroll-to-bottom). */
html, body {
  scrollbar-width: none;      /* Firefox */
  -ms-overflow-style: none;   /* legacy Edge/IE */
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
  display: none;              /* Chrome, Safari, modern Edge */
}

body {
  background: var(--bg);
  color: var(--text);
  font-family: "JetBrains Mono", "Fira Code", "SF Mono", Menlo, Consolas, "Courier New", monospace;
  font-size: 15px;
  line-height: 1.6;
  transition: background 0.2s ease, color 0.2s ease;
}

.theme-toggle {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 10;
  background: var(--bg-elev);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.4rem 0.6rem;
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.theme-toggle:hover { border-color: var(--accent); }