/* Direction: developer job board — terminal-inspired, dark-first, mono accents on a clean canvas */
:root {
  --canvas: #f6f7f5;
  --surface: #ffffff;
  --surface-2: #edf1ec;
  --border: #d9ded6;
  --border-strong: #b6bfb0;
  --ink: #16201a;
  --muted: #57655c;
  --accent: #1f7a4d;
  --accent-hover: #196640;
  --accent-ink: #ffffff;
  --accent-text: #196640;
  --accent-strong: #175c3c;
  --accent-soft: #e2efe6;
  --accent-border: #a9d0ba;
  --success: #1f7a4d;
  --success-ink: #ffffff;
  --success-soft: #e2efe6;
  --success-strong: #175c3c;
  --warning: #a05a12;
  --warning-ink: #ffffff;
  --warning-soft: #f5e7d6;
  --warning-strong: #8a4c0f;
  --danger: #ad2b2b;
  --danger-ink: #ffffff;
  --danger-soft: #f6dede;
  --danger-strong: #932323;
  --chart-1: #1f7a4d;
  --chart-2: #2f5c8a;
  --chart-3: #a05a12;
  --chart-4: #6a4c93;
  --chart-5: #0f8a8a;
  --chart-6: #ad2b6b;

  --font-display: "Space Grotesk", "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --display-weight: 600;
  --display-tracking: -0.03em;
  --eyebrow-tracking: 0.08em;
  --radius-card: 16px;
  --radius-btn: 10px;
  --radius-input: 10px;
  --x-on-photo: #f6f7f5;
}

html[data-theme="dark"] {
  --canvas: #0e1512;
  --surface: #141d19;
  --surface-2: #1a2620;
  --border: #26352c;
  --border-strong: #3a4d40;
  --ink: #e9f1eb;
  --muted: #93a599;
  --accent: #3fbd7d;
  --accent-hover: #4fd18e;
  --accent-ink: #06120c;
  --accent-text: #4fd18e;
  --accent-strong: #6ddf9f;
  --accent-soft: #17301f;
  --accent-border: #2c5b3d;
  --success: #3fbd7d;
  --success-ink: #06120c;
  --success-soft: #17301f;
  --success-strong: #6ddf9f;
  --warning: #d68a3f;
  --warning-ink: #1b1206;
  --warning-soft: #33230f;
  --warning-strong: #eab27a;
  --danger: #de6a6a;
  --danger-ink: #1c0a0a;
  --danger-soft: #351616;
  --danger-strong: #f19a9a;
  --chart-1: #3fbd7d;
  --chart-2: #6ea6e0;
  --chart-3: #d68a3f;
  --chart-4: #ad8ee0;
  --chart-5: #3fc7c7;
  --chart-6: #e07bb0;
}

/* app.css — DevBoard's own bits: the terminal-style hero prompt and job-card tag chips */

.prompt-line::before {
  content: "$";
  color: var(--accent-text);
  margin-right: 0.6em;
  font-family: var(--font-mono);
}

.tag-chip {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.02em;
  border: 1px solid var(--border);
  background: var(--surface-2);
  color: var(--muted);
  border-radius: 999px;
  padding: 0.2rem 0.65rem;
}

.job-card {
  transition: transform 0.2s ease, border-color 0.2s ease;
}
.job-card:hover {
  transform: translateY(-2px);
  border-color: var(--accent-border);
}
html.reduced-motion .job-card:hover {
  transform: none;
}

[data-inview] {
  transform: translateY(14px);
  opacity: 0.001;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.6s ease;
}
[data-inview].is-inview {
  transform: translateY(0);
  opacity: 1;
}
html.reduced-motion [data-inview] {
  transform: none;
  opacity: 1;
  transition: none;
}