/* Match the subtitle tool's light slate / blue palette. */
:root {
  color-scheme: light;
  color: #1e293b;
  background: #f8fafc;
  --accent: #3b82f6;
  --accent-strong: #2563eb;
  --line: rgba(30, 41, 59, 0.1);
}
body { background: #f8fafc; }
nav {
  background: rgba(255, 255, 255, 0.95);
  border-color: var(--line);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}
a { color: var(--accent-strong); }
nav a { color: #475569; }
nav a:hover { color: var(--accent); }
p, .muted, footer { color: #64748b; }
label { color: #475569; }
.eyebrow, .step { color: var(--accent-strong); }
.card {
  background: rgba(255, 255, 255, 0.92);
  border-color: var(--line);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}
.tag { background: #eff6ff; border-color: #c7dafe; color: var(--accent-strong); }
input, select, textarea {
  color: #1e293b;
  background: #fff;
  border-color: var(--line);
  border-radius: 12px;
}
input::placeholder, textarea::placeholder { color: #94a3b8; }
input:focus, select:focus, textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.14);
}
input[type=checkbox], input[type=range] { accent-color: var(--accent-strong); }
input[type=file] { background: #f8fafc; border-color: rgba(30, 41, 59, 0.16); }
input[type=file]::file-selector-button {
  color: var(--accent-strong);
  background: #eff6ff;
  border: 1px solid #c7dafe;
  border-radius: 8px;
  padding: 8px 12px;
  margin-right: 12px;
  cursor: pointer;
}
button, .button {
  color: #fff;
  background: linear-gradient(135deg, #2563eb, #3b82f6);
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.16);
  border-radius: 12px;
}
button:hover, .button:hover { background: #2563eb; }
.secondary { color: var(--accent-strong); background: #eff6ff; border: 1px solid #c7dafe; box-shadow: none; }
.secondary:hover { background: #dbeafe; }
.notice { color: #475569; background: #eff6ff; border: 1px solid #dbeafe; }
.error { color: #b05656; background: #fff5f5; border-color: #fecaca; }