:root {
  color-scheme: dark;
  --bg: #0c0d10;
  --panel: #15171c;
  --panel-2: #1d2027;
  --border: #2a2e38;
  --text: #e8e8ea;
  --text-dim: #8d92a0;
  --accent: #d35400;
  --accent-dim: #8a3a09;
  --light: #d8c8a8;
  --dark: #6b4f3a;
  --highlight: rgba(74, 222, 128, 0.55);
  --highlight-cap: rgba(248, 113, 113, 0.65);
  --armed: rgba(211, 84, 0, 0.55);
  --touched: rgba(211, 84, 0, 0.85);
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

* { box-sizing: border-box; }

html, body, #app { margin: 0; padding: 0; height: 100%; background: var(--bg); color: var(--text); }

body {
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}

button {
  font-family: inherit;
  font-size: inherit;
  background: var(--panel-2);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 8px 14px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
button:hover:not(:disabled) { background: #252932; border-color: var(--accent); }
button:disabled { opacity: 0.5; cursor: not-allowed; }
button.primary {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
  font-weight: 600;
}
button.primary:hover { background: #e2671f; border-color: #e2671f; }

input, select {
  font-family: inherit;
  font-size: inherit;
  background: var(--panel-2);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 8px 10px;
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

.muted { color: var(--text-dim); }
.mono { font-family: ui-monospace, SFMono-Regular, monospace; }