:root {
  --bg: #faf7f2;
  --surface: #ffffff;
  --text: #1f2937;
  --muted: #6b7280;
  --primary: #334155;
  --accent: #f4a98a;
  --ok: #7a9e7e;
  --danger: #c2410c;
  --border: #e5e7eb;
  --radius: 12px;
  --space: 1rem;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0f172a; --surface: #1e293b; --text: #e2e8f0;
    --muted: #94a3b8; --primary: #cbd5e1; --border: #334155;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font: 16px/1.6 var(--font);
  min-height: 100vh; display: flex; flex-direction: column;
}
img { max-width: 100%; height: auto; }
a { color: var(--primary); }
h1, h2, h3 { line-height: 1.25; margin: 0 0 .5em; }

.container { width: 100%; max-width: 1100px; margin: 0 auto; padding: 0 var(--space); }
.main-content { flex: 1; padding-top: 2rem; padding-bottom: 2rem; }

.btn {
  display: inline-block; padding: .65rem 1.2rem; border: 0; cursor: pointer;
  background: var(--primary); color: var(--bg); border-radius: var(--radius);
  font: inherit; font-weight: 600; text-decoration: none;
}
.btn:hover { opacity: .9; }
.btn:disabled { opacity: .5; cursor: not-allowed; }

label { display: block; font-weight: 600; margin-bottom: .25rem; }
input, select, textarea {
  width: 100%; padding: .65rem .8rem; font: inherit; color: var(--text);
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
}
input:focus, select:focus, textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
.field { margin-bottom: var(--space); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; } /* honeypot */

.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: var(--space); }
.msg-ok { color: var(--ok); }
.msg-err { color: var(--danger); }