:root {
  --bg: #0D0D0D;
  --surface: #141414;
  --surface-up: #1C1C1C;
  --border: #2A2A2A;
  --text: #F0EDE8;
  --text-sub: #9A9590;
  --text-muted: #5A5550;
  --red: #C8342A;
  --red-glow: rgba(200, 52, 42, 0.15);
  --link: #2C5282;
  --badge-verified: #2D6A4F;
  --badge-probable: #7D5A1E;
  --badge-interpretive: #5A3A1E;
  --badge-speculative: #5A2D0C;
  --font-serif: Georgia, 'Times New Roman', serif;
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'SF Mono', 'Fira Code', Consolas, monospace;
  --unit: 8px;
  --card-pad: 32px;
  --max-width: 720px;
  --gap-section: 64px;
}

*, *::before, *::after { box-sizing: border-box; }

html { font-size: 16px; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-serif);
  margin: 0;
  padding: 0;
  line-height: 1.7;
}

a {
  color: var(--text);
  text-decoration: underline;
  text-underline-offset: 3px;
}
a:hover { color: var(--text-sub); }

/* ── Header / Nav ── */
.site-header {
  border-bottom: 1px solid var(--border);
  padding: 24px;
  max-width: calc(var(--max-width) + 48px);
  margin: 0 auto;
}

.nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.wordmark {
  font-family: var(--font-serif);
  font-size: 18px;
  letter-spacing: 0.15em;
  color: var(--red);
  text-decoration: none;
  font-weight: bold;
}
.wordmark:hover { color: var(--red); }

.nav-links {
  display: flex;
  gap: 24px;
  font-family: var(--font-sans);
  font-size: 14px;
}
.nav-links a {
  color: var(--text-sub);
  text-decoration: none;
}
.nav-links a:hover { color: var(--text); }

.site-subtitle {
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--text-muted);
  margin: 0;
}

/* ── Main Layout ── */
.site-main {
  max-width: calc(var(--max-width) + 48px);
  margin: 0 auto;
  padding: 48px 24px;
}

/* ── Finding Cards ── */
.finding-card {
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: var(--card-pad);
  background: var(--surface);
  margin-bottom: 32px;
  display: block;
  text-decoration: none;
  color: var(--text);
}
.finding-card:hover { border-color: #3A3A3A; color: var(--text); }

.finding-card--full { background: var(--surface); }

.finding-card--compact {
  padding: 24px;
  transition: border-color 0.15s;
}

.finding-card--empty {
  text-align: center;
  padding: 48px;
}

.finding-meta-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.finding-number {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text-muted);
}

.finding-title {
  font-family: var(--font-serif);
  font-size: 28px;
  color: var(--red);
  margin: 0 0 12px;
  line-height: 1.3;
}

.finding-card--compact .finding-title {
  font-size: 20px;
  margin-bottom: 8px;
}

.finding-hook {
  font-size: 18px;
  color: var(--text-sub);
  margin: 0 0 24px;
  font-style: italic;
  line-height: 1.5;
}
.finding-card--compact .finding-hook {
  font-size: 15px;
  margin-bottom: 0;
}

.finding-body p { margin: 0 0 16px; line-height: 1.8; }

.finding-sources, .finding-evidence, .finding-greek, .finding-correction {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
}
.finding-sources h3, .finding-evidence h3, .finding-greek h3, .finding-correction h3 {
  font-family: var(--font-sans);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  margin: 0 0 10px;
}

.source-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.source-verse {
  margin-bottom: 4px;
}
.source-verse code {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--text-sub);
  background: var(--surface-up);
  padding: 2px 6px;
  border-radius: 3px;
}

.finding-footer {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.generation-meta {
  font-family: var(--font-sans);
  font-size: 12px;
  color: var(--text-muted);
}

.share-actions {
  display: flex;
  gap: 12px;
}

.finding-date {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text-muted);
  margin: 8px 0 0;
}

.no-finding {
  color: var(--text-muted);
  font-family: var(--font-sans);
}

/* ── Badges ── */
.badge {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 3px;
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.badge--verified   { background: var(--badge-verified);    color: var(--text); }
.badge--probable   { background: var(--badge-probable);    color: var(--text); }
.badge--interpretive { background: var(--badge-interpretive); color: var(--text); }
.badge--speculative { background: var(--badge-speculative); color: var(--text); }
.badge--safety     { background: var(--surface-up); border: 1px solid var(--border); color: var(--text-sub); }
.badge--category   { background: var(--surface-up); border: 1px solid var(--border); color: var(--text-sub); }
.badge--status     { background: var(--surface-up); border: 1px solid var(--border); color: var(--text-sub); }

/* ── Subscribe Section ── */
.subscribe-section {
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: var(--card-pad);
  background: var(--surface);
  margin: var(--gap-section) 0;
}

.subscribe-heading {
  font-family: var(--font-serif);
  font-size: 22px;
  color: var(--text);
  margin: 0 0 8px;
}

.subscribe-sub {
  font-family: var(--font-sans);
  font-size: 14px;
  color: var(--text-muted);
  margin: 0 0 20px;
}

.subscribe-form {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.subscribe-form input[type="email"] {
  flex: 1;
  min-width: 200px;
  padding: 10px 14px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 3px;
  color: var(--text);
  font-family: var(--font-sans);
  font-size: 15px;
}
.subscribe-form input[type="email"]:focus {
  outline: none;
  border-color: var(--text-muted);
}
.subscribe-form input[type="email"]::placeholder { color: var(--text-muted); }

.subscribe-form button {
  padding: 10px 20px;
  background: var(--surface-up);
  border: 1px solid var(--border);
  border-radius: 3px;
  color: var(--text);
  font-family: var(--font-sans);
  font-size: 14px;
  cursor: pointer;
  white-space: nowrap;
}
.subscribe-form button:hover { border-color: var(--text-muted); }

/* ── Recent / Archive Grids ── */
.section-heading {
  font-family: var(--font-sans);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  margin: 0 0 16px;
}

.finding-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.archive-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

/* ── Filters ── */
.filter-form {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 32px;
  align-items: center;
}
.filter-form select {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 7px 12px;
  border-radius: 3px;
  font-family: var(--font-sans);
  font-size: 14px;
}
.filter-form button {
  padding: 7px 16px;
  background: var(--surface-up);
  border: 1px solid var(--border);
  border-radius: 3px;
  color: var(--text);
  font-family: var(--font-sans);
  font-size: 14px;
  cursor: pointer;
}

/* ── Page Headers ── */
.page-header {
  margin-bottom: 40px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--border);
}
.page-header h1 {
  font-family: var(--font-serif);
  font-size: 32px;
  margin: 0 0 8px;
  color: var(--text);
}
.page-sub {
  font-family: var(--font-sans);
  font-size: 14px;
  color: var(--text-muted);
  margin: 0;
}

/* ── Prose (Methodology) ── */
.prose { max-width: var(--max-width); }
.prose h2 {
  font-family: var(--font-serif);
  font-size: 20px;
  color: var(--text);
  margin: 40px 0 12px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 8px;
}
.prose p { color: var(--text-sub); line-height: 1.8; margin: 0 0 16px; }
.prose ol, .prose ul { color: var(--text-sub); line-height: 1.8; margin: 0 0 16px; padding-left: 20px; }
.prose li { margin-bottom: 8px; }
.prose dt { font-weight: bold; color: var(--text); margin-top: 12px; }
.prose dd { color: var(--text-sub); margin-left: 0; margin-bottom: 8px; }
.prose strong { color: var(--text); }
.prose code {
  font-family: var(--font-mono);
  font-size: 13px;
  background: var(--surface-up);
  padding: 2px 6px;
  border-radius: 3px;
}

/* ── Flash Messages ── */
.flash-container { max-width: calc(var(--max-width) + 48px); margin: 0 auto; padding: 0 24px; }
.flash {
  padding: 12px 16px;
  border-radius: 3px;
  font-family: var(--font-sans);
  font-size: 14px;
  margin-bottom: 8px;
  border: 1px solid var(--border);
}
.flash-success { background: #1A2E1A; border-color: #2D6A4F; color: #6FCF97; }
.flash-error   { background: #2E1A1A; border-color: #5A2D0C; color: #EB5757; }
.flash-info    { background: var(--surface); color: var(--text-sub); }

/* ── Buttons / Links ── */
.btn-link {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--text-sub);
  text-decoration: none;
  padding: 5px 12px;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: none;
  cursor: pointer;
}
.btn-link:hover { border-color: var(--text-muted); color: var(--text); }

.empty-state {
  font-family: var(--font-sans);
  font-size: 15px;
  color: var(--text-muted);
  text-align: center;
  padding: 48px 0;
}

/* ── Finding Nav ── */
.finding-nav {
  display: flex;
  gap: 16px;
  margin-top: 32px;
}

/* ── Footer ── */
.site-footer {
  border-top: 1px solid var(--border);
  margin-top: 80px;
}
.footer-inner {
  max-width: calc(var(--max-width) + 48px);
  margin: 0 auto;
  padding: 32px 24px;
}
.disclaimer {
  font-family: var(--font-sans);
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.7;
  margin: 0 0 16px;
}
.footer-links {
  display: flex;
  gap: 16px;
  font-family: var(--font-sans);
  font-size: 12px;
}
.footer-links a { color: var(--text-muted); }

/* ── Mobile ── */
@media (max-width: 600px) {
  .nav-inner { flex-direction: column; align-items: flex-start; gap: 12px; }
  .nav-links { gap: 16px; }
  .finding-title { font-size: 22px; }
  .finding-hook { font-size: 16px; }
  .finding-footer { flex-direction: column; }
  .subscribe-form { flex-direction: column; }
  .subscribe-form input[type="email"] { min-width: 0; }
  .filter-form select { font-size: 13px; }
}