@font-face {
  font-family: "Victor Mono";
  font-style: normal;
  font-weight: 200 700;
  font-display: swap;
  src: url("/fonts/VictorMono-VariableFont_wght.woff2") format("woff2");
}

:root {
  color-scheme: light;
  --page-bg: #e1e2e7;
  --panel-bg: #f1f2f5;
  --chrome-bg: #d4d5da;
  --border: #bfc1c8;
  --text: #34364a;
  --muted: #6f7180;
  --green: #36804a;
  --blue: #4267a8;
  --cyan: #147b8a;
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --page-bg: #1a1b26;
    --panel-bg: #24283b;
    --chrome-bg: #292e42;
    --border: #414868;
    --text: #c0caf5;
    --muted: #7982a8;
    --green: #9ece6a;
    --blue: #7aa2f7;
    --cyan: #7dcfff;
  }
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0;
  background: var(--page-bg);
  color: var(--text);
  font-family: "Victor Mono", monospace;
  font-feature-settings: "ss01";
}

.terminal-page {
  min-height: 100vh;
  padding: 2.5rem 1rem 6rem;
}

.terminal-window {
  width: min(100%, 42rem);
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 0.375rem;
  box-shadow: 0 1rem 2rem rgb(0 0 0 / 12%);
}

.terminal-chrome {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.5rem 0.75rem;
  background: var(--chrome-bg);
  border-bottom: 1px solid var(--border);
  font: italic 0.75rem/1 "Victor Mono", monospace;
  color: var(--muted);
}

.dot { width: 0.5rem; height: 0.5rem; border-radius: 999px; }
.dot-red { background: #f7768e; }
.dot-yellow { background: #e0af68; }
.dot-green { background: #9ece6a; }

.terminal-body {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 12rem);
  min-height: 20rem;
  padding: 1rem;
  background: var(--panel-bg);
  font: 0.875rem/1.7 "Victor Mono", monospace;
}

.command { color: var(--text); }
.command-symbol { color: var(--green); }
.command-name { color: var(--blue); }
.command-file { color: var(--cyan); }
.terminal-output {
  flex: 1;
  min-height: 0;
  margin-top: 1rem;
  padding-inline: 0.5rem;
  border-radius: 0.5rem;
  white-space: pre-wrap;
  overflow-y: auto;
  scrollbar-width: none;
  overflow-wrap: anywhere;
  font-family: "Victor Mono", monospace;
  font-feature-settings: "ss01";
  color: var(--text);
}
.terminal-output::-webkit-scrollbar { display: none; }
.terminal-output a { color: var(--blue); }
.terminal-prompt { flex: 0 0 auto; margin-top: 1.25rem; padding-top: 0.75rem; border-top: 1px solid var(--border); }
.cursor { color: var(--text); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }