:root {
  --fundo: #faf6f4;
  --cartao: #ffffff;
  --texto: #2d2326;
  --suave: #7a6a6f;
  --borda: #eadfe1;
  --destaque: #a8586f;
  --destaque-texto: #ffffff;
  --destaque-claro: #f6e6eb;
  --pendente: #fff3d6;
  --pendente-borda: #c98a00;
  --cinza: #eeeeee;
  --perigo: #b3261e;
  --ok: #2e7d4f;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --fundo: #1c1719;
    --cartao: #272023;
    --texto: #f3eaec;
    --suave: #b8a7ac;
    --borda: #3d3337;
    --destaque: #d98aa1;
    --destaque-texto: #1c1719;
    --destaque-claro: #3e2a31;
    --pendente: #3d3220;
    --pendente-borda: #e0a92e;
    --cinza: #332b2e;
    --perigo: #ff8a80;
    --ok: #7fd1a0;
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 16px;
  background: var(--fundo);
  color: var(--texto);
  line-height: 1.4;
}

h1 { margin: 0; font-size: 1.2rem; color: var(--destaque); }
h2 { margin: 0 0 12px; font-size: 1.05rem; }
a { color: var(--destaque); }

button, .botao {
  font: inherit;
  padding: 10px 14px;
  border: 1px solid var(--borda);
  border-radius: 10px;
  background: var(--cartao);
  color: var(--texto);
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  text-align: center;
}

button:disabled { opacity: 0.5; cursor: default; }

.primario, button[type="submit"] {
  background: var(--destaque);
  border-color: var(--destaque);
  color: var(--destaque-texto);
}

.perigo { color: var(--perigo); border-color: var(--perigo); }

/* 16px evita o zoom automático do iPhone ao tocar nos campos */
input, select, textarea {
  font: inherit;
  font-size: 16px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--borda);
  border-radius: 10px;
  background: var(--cartao);
  color: var(--texto);
  margin: 4px 0 10px;
}

textarea { min-height: 70px; resize: vertical; }

label { display: block; font-size: 0.9rem; color: var(--suave); }
label.linha { display: flex; align-items: center; gap: 8px; color: var(--texto); }
label.linha input { width: auto; margin: 0; }

.cartao {
  background: var(--cartao);
  border: 1px solid var(--borda);
  border-radius: 14px;
  padding: 16px;
  margin-bottom: 16px;
}

.erro { color: var(--perigo); min-height: 1.2em; margin: 0 0 8px; }
.suave { color: var(--suave); }
.vazio { color: var(--suave); text-align: center; padding: 24px; }
[hidden] { display: none !important; }

.toast {
  position: fixed;
  left: 50%;
  bottom: calc(24px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  background: var(--texto);
  color: var(--fundo);
  padding: 10px 16px;
  border-radius: 10px;
  max-width: calc(100% - 32px);
  z-index: 10;
}