/* ═══════════════════════════════════════════════════════════════════════
   O TRAJE DA CORTE — kit de identidade visual do guarda-chuva do Erick
   Origem canônica: Erick-Bot/data/hub/kit-identidade/corte.css (Master of
   Keys, guardião). Adaptações desta cópia do Master of Law, registradas
   com o guardião em 19/08/2026:
   1. url() de fontes e fundo apontam para os estáticos locais (/assets/);
   2. regras de elemento escopadas sob body[data-corte] — a migração é por
      página e o traje não vaza para páginas que ainda não vestiram;
   3. subconjunto de componentes (tokens, chão, títulos, controles); os
      demais entram conforme cada página veste;
   4. seções extras do Law no fim (brasão, peças da fornada).
   Ordem no piloto: incluído DEPOIS do app.css (cascata resolve tipografia);
   volta ao canônico quando a migração por tokens terminar.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── as letras: Cinzel (entalhe) + Alegreya (manuscrito) ─────────────── */
@font-face {
  font-family: "Cinzel";
  font-style: normal; font-weight: 700; font-display: swap;
  src: url("/assets/cinzel-700.woff2") format("woff2");
}
@font-face {
  font-family: "Alegreya";
  font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("/assets/alegreya-400.woff2") format("woff2");
}
@font-face {
  font-family: "Alegreya";
  font-style: italic; font-weight: 400; font-display: swap;
  src: url("/assets/alegreya-400-italico.woff2") format("woff2");
}

/* ── os tokens: a paleta da casa ─────────────────────────────────────── */
:root {
  /* o chão comum — NUNCA muda entre cortes */
  --tinta: #f0e6cc;          /* texto sobre escuro */
  --tinta-fraca: #b8a888;    /* texto secundário, legendas */
  --fundo: #14100c;          /* o breu da sala */
  --painel: rgba(38, 30, 22, 0.88);
  --painel-borda: #4a3c2a;
  --ouro: #d4af37;           /* o metal da casa */
  --ouro-claro: #f0d060;
  --sangue: #c05050;         /* erro, débito */
  --verde: #7aa05a;          /* sucesso, crédito */
  /* o acento — cada corte pinta o seu (padrão: ouro do chaveiro) */
  --acento: var(--ouro);
  --acento-brilho: rgba(212, 175, 55, 0.22);
  /* as famílias */
  --fonte-titulo: "Cinzel", "Iowan Old Style", Georgia, serif;
  --fonte-texto: "Alegreya", "Iowan Old Style", "Palatino Linotype",
    "Book Antiqua", Palatino, Georgia, serif;
}
body[data-corte="keys"]      { --acento: #d4af37; --acento-brilho: rgba(212, 175, 55, 0.25); }
body[data-corte="illusions"] { --acento: #9b6dd6; --acento-brilho: rgba(155, 109, 214, 0.25); }
body[data-corte="law"]       { --acento: #5a8ac0; --acento-brilho: rgba(90, 138, 192, 0.25); }
body[data-corte="coin"]      { --acento: #d4af37; --acento-brilho: rgba(212, 175, 55, 0.25); }
body[data-corte="whispers"]  { --acento: #5aa89a; --acento-brilho: rgba(90, 168, 154, 0.25); }

/* ── o chão ──────────────────────────────────────────────────────────── */
body[data-corte] {
  background:
    url("/assets/ui/backdrops/parchment.webp") center / cover fixed,
    radial-gradient(ellipse 90% 60% at 50% -10%, #3a2c18 0%, transparent 60%),
    linear-gradient(180deg, #1a140e 0%, #14100c 55%, #0f0c08 100%);
  background-blend-mode: overlay, normal, normal;
  color: var(--tinta);
  font-family: var(--fonte-texto);
  /* diretiva do dono 19/08: letras maiores — o tamanho do kit e lei */
  font-size: 17.5px;
  line-height: 1.55;
}
@media (max-width: 48rem) {
  body[data-corte] { background-attachment: scroll; font-size: 16px; }
}

/* ── títulos ─────────────────────────────────────────────────────────── */
body[data-corte] h1, body[data-corte] h2, body[data-corte] h3 {
  font-family: var(--fonte-titulo);
  font-weight: 700;
  letter-spacing: 0.045em;
}
body[data-corte] h1 { color: var(--ouro-claro); text-shadow: 0 0 18px var(--acento-brilho); }
.sussurro { color: var(--tinta-fraca); font-style: italic; }

/* ── controles: foco e brilho no acento da corte ─────────────────────── */
body[data-corte] input:focus,
body[data-corte] select:focus,
body[data-corte] textarea:focus {
  outline: none; border-color: var(--acento);
  box-shadow: 0 0 8px var(--acento-brilho);
}
body[data-corte] .primary-button {
  background: linear-gradient(180deg, var(--ouro-claro), var(--ouro));
  color: #241a06;
}
body[data-corte] .primary-button:hover {
  transform: translateY(-1px); box-shadow: 0 4px 14px var(--acento-brilho);
}
body[data-corte] .eyebrow { color: var(--acento); }
body[data-corte] .form-error { color: var(--sangue); }
body[data-corte] .link-button { color: var(--acento); }

/* ── o brasão da corte na entrada ────────────────────────────────────── */
.brasao-corte {
  width: 92px; height: 92px; border-radius: 50%; object-fit: cover;
  box-shadow: 0 0 0 3px var(--ouro), 0 0 26px var(--acento-brilho);
}

/* ── as peças da fornada (folhas 04/05 da estante do Keys) ───────────── */
/* O fundo do login do Law: a biblioteca sob luz azul, centro calmo. */
.auth-page[data-corte="law"] {
  background:
    linear-gradient(rgba(20, 16, 12, 0.50), rgba(20, 16, 12, 0.78)),
    url("/assets/ui/backdrops/law-entrada.webp") center / cover fixed;
}
@media (max-width: 48rem) {
  .auth-page[data-corte="law"] { background-attachment: scroll; }
}