:root {
  color-scheme: light;
  --papel: #faf2f0; --papel-2: #f1e3e1; --cartao: #ffffff; --tinta: #100840; --tinta-2: #5a5273; --linha: #e3d0d4;
  --marca: #481870; --marca-2: #341050; --marca-fraco: #efe4f6; --rosa: #c01868; --rosa-fraco: #fbe3ee; --carimbo: #481870; --ok: #1b6b3a; --ok-fraco: #dff1e5;
  --aviso: #8a5a00; --aviso-fraco: #fbefd0; --erro: #a3262b; --erro-fraco: #f9e1e1; --foco: #1a73e8;
  --fonte: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fonte-relogio: "Bahnschrift", "DIN Alternate", "Arial Narrow", "Roboto Condensed", system-ui, sans-serif;
  --r: 10px;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 17px/1.5 var(--fonte); color: var(--tinta); background: var(--papel); }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: 1.5rem; } h2 { font-size: 1.2rem; } h3 { font-size: 1rem; }
p { margin: 0 0 .75em; max-width: 68ch; }
a { color: var(--marca); }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--foco); outline-offset: 2px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5em; min-height: 52px; padding: .55em 1.1em; border-radius: var(--r); border: 1.5px solid var(--marca); background: var(--marca); color: #fff; font-weight: 600; cursor: pointer; text-decoration: none; }
.btn.sec { background: transparent; color: var(--marca); }
.btn.perigo { background: var(--erro); border-color: var(--erro); color: #fff; }
.btn.pq { min-height: 36px; padding: .25em .8em; font-size: .9rem; }
.btn[disabled] { opacity: .55; cursor: not-allowed; }
label { display: block; font-weight: 600; margin: .9em 0 .25em; }
input[type=text], input[type=password], input[type=number], input[type=date], input[type=month], input[type=datetime-local], input[type=email], input[type=search], select, textarea {
  width: 100%; min-height: 44px; padding: .5em .7em; border: 1.5px solid var(--linha); border-radius: var(--r); background: var(--cartao); }
textarea { min-height: 96px; resize: vertical; }
.msg { padding: .7em .9em; border-radius: var(--r); margin: .75em 0; border-left: 4px solid; }
.msg.erro { background: var(--erro-fraco); border-color: var(--erro); }
.msg.ok { background: var(--ok-fraco); border-color: var(--ok); }
.msg.aviso { background: var(--aviso-fraco); border-color: var(--aviso); }
.msg.info { background: var(--marca-fraco); border-color: var(--marca); }
.pilula { display: inline-block; padding: .1em .6em; border-radius: 99px; font-size: .8rem; font-weight: 600; background: var(--papel-2); }
.pilula.ok { background: var(--ok-fraco); color: var(--ok); } .pilula.aviso { background: var(--aviso-fraco); color: var(--aviso); } .pilula.erro { background: var(--erro-fraco); color: var(--erro); }
.mudo { color: var(--tinta-2); }
.oculto { display: none !important; }
.so-leitor { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.carregando::after { content: ""; display: inline-block; width: 1em; height: 1em; margin-left: .5em; vertical-align: -.15em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: gira .8s linear infinite; }
@keyframes gira { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

.btn.rosa { background: var(--rosa); border-color: var(--rosa); }
.btn.bloco { display: flex; width: 100%; margin-top: .6rem; }
input[type=tel] { width: 100%; min-height: 48px; padding: .5em .7em; border: 1.5px solid var(--linha); border-radius: var(--r); background: var(--cartao); }