/* Telas de conta do Mapa da Escritura: mesma paleta e tipografia do site público */
:root{
  --marinho:#0d1b34; --marinho-2:#142748; --marinho-3:#1e3560; --noite:#08132a;
  --dourado:#b98a3c; --dourado-claro:#e3c98f; --dourado-escuro:#94702f;
  --marfim:#f6f2ea; --papel:#fffdf9; --linha:#e6dfd1; --tinta:#1b2333; --cinza:#5f6676;
  --verde:#2f7a55; --vermelho:#a63d32; --ambar:#a9701d;
  --titulo:"Outfit","Avenir Next","Segoe UI",system-ui,sans-serif;
  --texto:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--marfim);color:var(--tinta);font-family:var(--texto);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:var(--dourado-escuro)}
h1,h2,h3{font-family:var(--titulo);margin:0;text-wrap:balance;letter-spacing:-.01em;color:var(--marinho)}
.marca{--h:44px;display:inline-flex;align-items:center;gap:calc(var(--h)*.2);text-decoration:none;color:#fff;flex-shrink:0}
.marca img{height:var(--h);width:auto;display:block}
.marca .wm{display:flex;flex-direction:column;font-family:var(--titulo);line-height:1}
.marca .wm small{font-size:calc(var(--h)*.40);font-weight:700;color:var(--dourado-claro);line-height:1;letter-spacing:-.01em;margin-left:.04em}
.marca .wm b{font-size:calc(var(--h)*.62);font-weight:800;color:#fff;line-height:.92;letter-spacing:-.015em;margin-top:calc(var(--h)*-.06)}
.eyebrow{font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--dourado-escuro)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 14px var(--texto);border-radius:999px;padding:13px 24px;text-decoration:none;cursor:pointer;border:1px solid transparent;transition:background .15s,transform .15s}
.btn:hover{transform:translateY(-1px)}
.btn:disabled{opacity:.6;cursor:wait;transform:none}
.btn-ouro{background:var(--dourado);color:var(--noite)}
.btn-ouro:hover{background:var(--dourado-claro)}
.btn-marinho{background:var(--marinho);color:#fff}
.btn-linha{background:var(--papel);border-color:var(--linha);color:var(--marinho)}
.btn-pequeno{padding:8px 14px;font-size:13px}
:focus-visible{outline:2px solid var(--dourado);outline-offset:3px}

/* layout dividido: painel institucional + formulário */
.dividido{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);min-height:100vh}
.lado{background:radial-gradient(900px 420px at 90% -10%,var(--marinho-3),transparent 60%),var(--marinho);color:#fff;padding:40px max(24px,5vw);display:flex;flex-direction:column;gap:40px}
.lado h1{color:#fff;font-size:clamp(30px,3.6vw,44px);font-weight:800;line-height:1.05;max-width:15ch}
.lado h1 em{font-style:normal;color:var(--dourado-claro)}
.lado p{color:#c3cbda;max-width:44ch}
.lado ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px;color:#dfe5ef;font-size:14.5px}
.lado li{display:grid;grid-template-columns:20px 1fr;gap:10px}
.lado li::before{content:"";width:18px;height:18px;margin-top:2px;border-radius:50%;background:rgba(227,201,143,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.3l2.6 2.6L13 6.3' fill='none' stroke='%23e3c98f' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
.lado .rodape{margin-top:auto;font-size:12.5px;color:#8592aa}
.form-area{display:flex;align-items:center;justify-content:center;padding:40px max(16px,4vw)}
.cartao{width:100%;max-width:460px;background:var(--papel);border:1px solid var(--linha);border-radius:18px;padding:34px;box-shadow:0 1px 2px rgba(13,27,52,.06),0 18px 40px rgba(13,27,52,.08)}
.cartao h2{font-size:28px;font-weight:800}
.cartao .sub{color:var(--cinza);margin-top:6px;font-size:14.5px}
form{display:flex;flex-direction:column;gap:14px;margin-top:24px}
.campo{display:flex;flex-direction:column;gap:6px}
.campo label{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--cinza)}
.campo input,.campo select{border:1px solid var(--linha);border-radius:10px;padding:12px 14px;font:500 15px var(--texto);background:#fff;color:var(--tinta);width:100%}
.campo small{color:var(--cinza);font-size:12px}
.dupla{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.check{display:grid;grid-template-columns:18px 1fr;gap:10px;font-size:13px;color:var(--cinza);align-items:start}
.check input{margin-top:3px}
.msg{border-radius:10px;padding:11px 14px;font-size:13.5px}
.msg.erro{background:#f7e4e1;color:var(--vermelho);border:1px solid #ecc6c0}
.msg.ok{background:#e2f0e8;color:var(--verde);border:1px solid #bfdccb}
.troca{margin-top:20px;font-size:14px;color:var(--cinza);text-align:center}
.perfis{display:flex;flex-wrap:wrap;gap:6px}
.perfis label{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--linha);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600;color:var(--marinho);cursor:pointer;text-transform:none;letter-spacing:0;background:#fff}
.perfis input{position:absolute;opacity:0;pointer-events:none}
.perfis label:has(input:checked){background:var(--marinho);color:#fff;border-color:var(--marinho)}
.perfis label:has(input:focus-visible){outline:2px solid var(--dourado);outline-offset:2px}

/* páginas internas (conta e admin) */
.topo{background:var(--marinho);color:#fff;position:sticky;top:0;z-index:20}
.topo .faixa{max-width:1160px;margin:0 auto;padding:12px max(16px,env(safe-area-inset-right,0px)) 12px max(16px,env(safe-area-inset-left,0px));display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.topo nav{margin-left:auto;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.topo nav a{color:#e9edf5;text-decoration:none;font-size:13.5px;font-weight:500}
.topo nav a:hover{color:var(--dourado-claro)}
.topo nav button{background:none;border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:999px;padding:7px 14px;font:600 13px var(--texto);cursor:pointer}
.miolo{max-width:1160px;margin:0 auto;padding:40px max(16px,env(safe-area-inset-right,0px)) 64px max(16px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:24px}
.bloco{background:var(--papel);border:1px solid var(--linha);border-radius:16px;padding:26px;min-width:0}
.bloco h2{font-size:22px;font-weight:700}
.grade2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.situacao{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;background:var(--marinho);color:#fff;border-radius:16px;padding:26px}
.situacao h1{color:#fff;font-size:clamp(24px,3vw,32px)}
.situacao p{color:#c3cbda;margin-top:6px}
.selo{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:4px 10px}
.selo.teste{background:var(--dourado-claro);color:var(--noite)}
.selo.ativo{background:#cfe8da;color:var(--verde)}
.selo.inadimplente{background:#f3dcc0;color:var(--ambar)}
.selo.cancelado{background:#efd9d5;color:var(--vermelho)}
.planos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:18px}
.plano{border:1px solid var(--linha);border-radius:14px;padding:18px;background:#fff;display:flex;flex-direction:column;gap:10px;cursor:pointer;position:relative}
.plano input{position:absolute;opacity:0;pointer-events:none}
.plano:has(input:checked){border-color:var(--marinho);box-shadow:0 0 0 2px var(--marinho)}
.plano:has(input:focus-visible){outline:2px solid var(--dourado);outline-offset:3px}
.plano b{font-family:var(--titulo);font-size:17px;color:var(--marinho)}
.plano .preco{font-family:var(--titulo);font-weight:800;font-size:26px;color:var(--marinho)}
.plano .preco small{font:500 13px var(--texto);color:var(--cinza)}
.plano span{font-size:12.5px;color:var(--cinza)}
.periodo{display:inline-flex;background:var(--marfim);border:1px solid var(--linha);border-radius:999px;padding:4px}
.periodo button{border:0;background:none;border-radius:999px;padding:8px 16px;font:600 13px var(--texto);color:var(--marinho);cursor:pointer;white-space:nowrap}
.periodo button[aria-pressed="true"]{background:var(--marinho);color:#fff}
.kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.kpi{background:var(--papel);border:1px solid var(--linha);border-radius:12px;padding:16px}
.kpi span{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--cinza)}
.kpi b{display:block;font-family:var(--titulo);font-size:26px;color:var(--marinho);margin-top:4px;font-variant-numeric:tabular-nums}
.tabela{overflow-x:auto;border:1px solid var(--linha);border-radius:14px;background:var(--papel)}
table{width:100%;border-collapse:collapse;min-width:900px;font-size:13.5px}
th{text-align:left;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--cinza);padding:12px 14px;border-bottom:1px solid var(--linha);background:#fbf8f2}
td{padding:10px 14px;border-bottom:1px solid #efe9dd;vertical-align:middle}
td select,td input{border:1px solid var(--linha);border-radius:8px;padding:6px 8px;font:500 13px var(--texto);background:#fff;max-width:150px}
.busca-admin{border:1px solid var(--linha);border-radius:999px;padding:10px 16px;font:500 14px var(--texto);width:min(340px,100%);background:#fff}
@media (max-width:900px){
  .dividido{grid-template-columns:1fr}
  .lado{padding-block:28px;gap:22px}
  .lado ul,.lado .rodape{display:none}
  .planos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grade2{grid-template-columns:1fr}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .cartao{padding:24px}
  .dupla,.planos{grid-template-columns:1fr}
}
.btn-google{width:100%;background:#fff;border-color:var(--linha);color:#1f1f1f;margin-top:18px}
.btn-google:hover{background:#f7f7f7}
.btn-google[hidden]{display:none}
.ou{display:flex;align-items:center;gap:12px;color:var(--cinza);font-size:13px;margin:18px 0 4px}
.ou::before,.ou::after{content:"";flex:1;height:1px;background:var(--linha)}
.ou[hidden]{display:none}
.aviso-google{font-size:12px;color:var(--cinza);margin-top:8px;text-align:center}
#btnGoogle[hidden] + .aviso-google{display:none}
[hidden]{display:none!important}
.aceite{font-size:12.5px;color:var(--cinza);line-height:1.5;margin:4px 0 2px}