:root {
  --base: #E9EBE6; --surface: #FBFBF9; --ink: #15242B; --muted: #6E7C82; --line: #D5D9D3;
  --amber: #F5A623; --amber-ink: #1A1200; --soft: #F1F3EE; --ok: #2F8F5B; --err: #B4361A; --warn: #B4650A;
  --radius: 14px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --base: #141A1C; --surface: #1E2528; --ink: #ECEFEA; --muted: #98A4A8; --line: #2F393D; --soft: #242D30;
    --err: #FF8A6E; --warn: #F0B35E;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --base: #141A1C; --surface: #1E2528; --ink: #ECEFEA; --muted: #98A4A8; --line: #2F393D; --soft: #242D30;
  --err: #FF8A6E; --warn: #F0B35E;
  color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  background: var(--base); color: var(--ink);
  font-family: "Golos Text", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 16px; line-height: 1.45; -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--amber); outline-offset: 2px; }
img { max-width: 100%; display: block; }
[hidden] { display: none !important; }

.logo { font-weight: 800; font-size: 20px; letter-spacing: -.02em; text-decoration: none; display: inline-flex; align-items: baseline; }
.logo i { display: inline-block; width: 10px; height: 10px; background: var(--amber); border-radius: 2px; margin-left: 4px; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border-radius: var(--radius); padding: 14px 22px; font-weight: 700; text-decoration: none;
  transition: transform .08s, opacity .15s; white-space: nowrap;
}
.btn:active { transform: scale(.985); }
.btn:disabled { opacity: .45; cursor: default; }
.btn-primary { background: var(--amber); color: var(--amber-ink); }
.btn-dark { background: var(--ink); color: var(--surface); }
.btn-ghost { border: 1.5px solid var(--line); }
.btn-sm { padding: 9px 14px; font-size: 14px; border-radius: 11px; }

.input {
  width: 100%; border: 1.5px solid var(--line); background: var(--soft); border-radius: var(--radius);
  padding: 13px 15px; font-size: 16px;
}
.input:focus { border-color: var(--ink); outline: none; }
.label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 5px; }
.error { color: var(--err); font-size: 14px; min-height: 1.2em; }
.muted { color: var(--muted); }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }