/* Painel da Ana Paula Souza · cores e fontes do site · versão 1.2 · 2026-10-14 */
:root { --bg: #F7F8FA; --ink: #0C1D33; --muted: #4D5D73; --line: #D3DBE8; --line-soft: #E6EBF3; --gold: #C9AE86;
  --display: 'Cormorant Garamond', Georgia, serif; --sans: 'Plus Jakarta Sans', system-ui, sans-serif; --hard: 3px 3px 0 #C9AE86; }
/* antes do login, o app ainda usa as cores padrão: forçamos as do site */
:root, :root:not([data-theme="light"]), :root[data-theme="dark"] { --accent: #1F447F; --on-accent: #FFFFFF; --side-bg: #0C1D33; --side-ink: #F6F1E7; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --accent: #6F9BE0; --on-accent: #0C1D33; } }
h1, h2, h3, .auth-card h1 { font-weight: 600; }
.brand em, .auth-art .brand em { color: #C9AE86; }

/* tela de entrada: calma, como o site da Ana */
.auth { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.auth-art { justify-content: flex-start; gap: 0; padding: clamp(28px, 5vw, 64px); }
.auth-art .brand { font: 600 28px/1 var(--display); letter-spacing: 0; }
.auth-art h2 { font: 600 clamp(42px, 5.2vw, 78px)/1.02 var(--display); letter-spacing: 0; max-width: 11ch; margin: auto 0 0; }
.auth-art h2 em { font-style: italic; color: #C9AE86; }
.auth-art .lede { margin: 22px 0 0; max-width: 36ch; font-size: 16px; line-height: 1.65; color: color-mix(in srgb, var(--side-ink) 78%, transparent); }
.auth-art .foot { margin-top: auto; padding-top: 48px; font-size: 11.5px; line-height: 1.9; letter-spacing: .16em; text-transform: uppercase; color: #C9AE86; }
.auth-card { width: min(420px, calc(100vw - 40px)); background: var(--paper); border: 1px solid var(--line); box-shadow: 5px 5px 0 #C9AE86; padding: clamp(22px, 4vw, 34px); gap: 16px; }
.auth-card h1 { font: 600 36px/1 var(--display); }
@media (max-width: 820px) {
  .auth { grid-template-columns: 1fr; }
  .auth-art { padding: 24px 20px 30px; }
  .auth-art h2 { font-size: 40px; margin-top: 36px; max-width: none; }
  .auth-art .lede { margin-top: 14px; font-size: 15px; }
  .auth-art .foot { display: none; }
  .auth-card { margin: 8px auto 36px; width: calc(100vw - 40px); }
}
