/* MR Gestão 360º · identidade MR: vinho #650827 e dourado #BA8527 */
:root{
  --vinho:#650827; --vinho-esc:#4a051c; --dourado:#BA8527; --dourado-claro:#E3B866;
  --fundo:#F8F5F3; --sup:#FFFFFF; --sup2:#FBF8F6; --tinta:#1F2937; --suave:#6E6266; --linha:#EADFDF; --linha2:#F2EAEA;
  --ok:#1E7A4C; --ok-bg:#E5F3EB; --alerta:#A35F08; --alerta-bg:#FBEFD9; --erro:#B42318; --erro-bg:#FCE8E6; --info-bg:#F3ECEE;
  --f-titulo:"Cormorant Garamond", Georgia, serif; --f-texto:"Albert Sans","Segoe UI",system-ui,sans-serif;
  --raio:10px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fundo);color:var(--tinta);font:15px/1.55 var(--f-texto)}
a{color:var(--vinho)} a:hover{color:var(--dourado)}
h1,h2,h3{margin:0 0 10px;line-height:1.2;text-wrap:balance}
h1{font-family:var(--f-titulo);font-weight:700;font-size:32px;color:var(--vinho)}
h2{font-family:var(--f-titulo);font-weight:700;font-size:23px;color:var(--vinho)}
h3{font-size:14px;margin-top:18px;color:var(--suave);text-transform:uppercase;letter-spacing:.06em}
p{margin:0 0 10px}
:focus-visible{outline:2px solid var(--dourado);outline-offset:2px}

/* Topo */
.topo{background:var(--vinho);color:#F1DFC0}
.topo-in{max-width:1180px;margin:0 auto;padding:8px 16px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;color:#F6E3B8}
.marca img{height:42px;width:auto;display:block}
.marca span{font-family:var(--f-titulo);font-size:21px;font-weight:700;color:var(--dourado-claro);white-space:nowrap}
.menu{display:flex;gap:4px;flex-wrap:wrap;flex:1}
.menu a{color:#F1DFC0;text-decoration:none;padding:7px 11px;border-radius:7px;font-weight:500}
.menu a:hover{background:rgba(255,255,255,.08);color:#fff}
.menu a.ativo{background:rgba(186,133,39,.22);color:#F6E3B8}
.sair{display:flex;align-items:center;gap:10px;margin:0}
.quem{color:#E6CBD2;font-size:13px}
.topo .btn-link{color:#F6E3B8}

.conteudo{max-width:1180px;margin:0 auto;padding:24px 16px 48px}
.rodape{max-width:1180px;margin:0 auto;padding:0 16px 30px;color:var(--suave);font-size:12px}
.sub-titulo{color:var(--suave);margin-top:-4px}
.trilha{font-size:13px;color:var(--suave);margin-bottom:6px}
.titulo-linha{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.titulo-linha h1,.titulo-linha h2{margin:0}

/* Cartões e grade */
.cartao{background:var(--sup);border:1px solid var(--linha);border-radius:var(--raio);padding:18px;margin-bottom:16px}
.cartao.destaque{border-color:var(--dourado);background:var(--sup2)}
.grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:16px}
.grade .cartao{margin-bottom:0}
.grade + .cartao,.grade + section{margin-top:16px}

/* Formulários */
.form{display:flex;flex-direction:column;gap:12px;max-width:560px}
.form label,.filtros label{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:13px;color:var(--tinta)}
label.inline{flex-direction:row !important;align-items:center;gap:8px !important}
input,select{font:inherit;font-weight:400;color:var(--tinta);background:#fff;border:1px solid #D9CBCD;border-radius:8px;padding:9px 11px;min-height:42px;width:100%}
label.inline input,label.inline select{width:auto}
input:focus,select:focus{outline:2px solid var(--dourado);outline-offset:0;border-color:var(--dourado)}
input[readonly]{background:var(--sup2)}
.somente-leitura{position:absolute;left:-9999px;width:1px;height:1px}
.codigo{font-size:24px;letter-spacing:.3em;text-align:center;font-variant-numeric:tabular-nums}
.duas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:12px}
.form-linha{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px}
.form-linha select{width:auto;max-width:100%}
.filtros{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.filtros input[type=search]{flex:1;min-width:200px}
.filtros select{width:auto;max-width:100%}
.dicas{margin:0;padding-left:18px;color:var(--suave);font-size:13px}
.medidor{font-size:13px;min-height:18px;color:var(--suave)}
.medidor.fraca{color:var(--erro)} .medidor.boa{color:var(--ok)}

/* Botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--vinho);color:#F6E3B8;border:1px solid var(--vinho);border-radius:8px;padding:10px 16px;font:600 14px var(--f-texto);cursor:pointer;text-decoration:none;min-height:42px}
.btn:hover{background:var(--vinho-esc);color:#fff}
.btn-sec{background:#fff;color:var(--vinho);border-color:#D9CBCD}
.btn-sec:hover{background:var(--sup2);color:var(--vinho);border-color:var(--dourado)}
.btn-perigo{background:#fff;color:var(--erro);border-color:#F0C4BF}
.btn-perigo:hover{background:var(--erro-bg);color:var(--erro)}
.btn-whats{background:#1E7A4C;border-color:#1E7A4C;color:#fff}
.btn-whats:hover{background:#165c39;color:#fff}
.btn-link{background:none;border:0;padding:0;font:inherit;color:var(--vinho);text-decoration:underline;cursor:pointer}
.acoes{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}

/* Avisos e selos */
.aviso{border-radius:8px;padding:10px 14px;margin:0 0 14px;font-size:14px;border:1px solid transparent}
.aviso-ok{background:var(--ok-bg);color:var(--ok);border-color:#BFE2CD}
.aviso-erro{background:var(--erro-bg);color:var(--erro);border-color:#F3C3BE}
.aviso-info{background:var(--info-bg);color:var(--vinho);border-color:var(--linha)}
.selo{display:inline-block;font-size:11.5px;font-weight:700;padding:2px 9px;border-radius:99px;white-space:nowrap}
.selo-ativo{background:var(--ok-bg);color:var(--ok)}
.selo-convite_pendente{background:var(--alerta-bg);color:var(--alerta)}
.selo-desligado{background:#EFEAEA;color:var(--suave)}
.selo-bloqueado{background:var(--erro-bg);color:var(--erro)}
.nota{color:var(--suave);font-size:13px}
.sub{display:block;color:var(--suave);font-size:12.5px;font-weight:400}

/* Tabelas */
.tabela{overflow-x:auto;background:var(--sup);border:1px solid var(--linha);border-radius:var(--raio)}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--suave);font-weight:700;padding:10px 12px;border-bottom:1px solid var(--linha);background:var(--sup2);white-space:nowrap}
td{padding:10px 12px;border-bottom:1px solid var(--linha2);vertical-align:top}
tr:last-child td{border-bottom:0}
td a{text-decoration:none} td a b{color:var(--vinho)}
.nowrap{white-space:nowrap}
.vazio{text-align:center;color:var(--suave);padding:24px}
td.det{font-size:12.5px;color:var(--suave);max-width:420px;word-break:break-word}
.matriz{margin-bottom:10px}
.matriz th[scope=row]{text-transform:none;letter-spacing:0;font-size:13.5px;color:var(--tinta);font-weight:600;background:#fff;border-bottom:1px solid var(--linha2)}
.matriz td{text-align:center;vertical-align:middle}
.matriz td.ajustada{background:var(--alerta-bg)}
.matriz input{width:20px;height:20px;min-height:0;accent-color:var(--vinho);cursor:pointer}
.matriz input:disabled{cursor:not-allowed;opacity:.55}
.paginas{display:flex;gap:16px;align-items:center;justify-content:center;margin-top:14px;font-size:14px}

/* Listas e dados */
.lista{list-style:none;margin:0 0 12px;padding:0}
.lista li{padding:8px 0;border-bottom:1px solid var(--linha2);font-size:14px}
.lista li:last-child{border-bottom:0}
.dados{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;margin:14px 0 0;font-size:14px}
.dados dt{color:var(--suave)} .dados dd{margin:0;word-break:break-word}
.link{font-family:ui-monospace,Menlo,monospace;font-size:13px}

/* Início */
.indicadores{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:18px 0 26px}
.indicador{background:var(--sup);border:1px solid var(--linha);border-radius:var(--raio);padding:14px 16px;text-decoration:none;color:var(--tinta)}
.indicador:hover{border-color:var(--dourado);color:var(--tinta)}
.indicador b{display:block;font-family:var(--f-titulo);font-size:34px;color:var(--vinho);line-height:1}
.indicador span{font-size:13px;color:var(--suave)}
.modulos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.modulo{background:var(--sup);border:1px solid var(--linha);border-radius:var(--raio);padding:16px;text-decoration:none;color:var(--tinta);position:relative}
a.modulo:hover{border-color:var(--dourado);color:var(--tinta)}
.modulo b{display:block;color:var(--vinho);margin-bottom:3px}
.modulo span{font-size:13px;color:var(--suave)}
.modulo.em-breve{opacity:.75;background:var(--sup2)}
.modulo em{position:absolute;top:12px;right:12px;font-style:normal;font-size:11px;font-weight:700;color:var(--alerta);background:var(--alerta-bg);padding:1px 8px;border-radius:99px}

/* Telas de acesso */
body.acesso{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 16px;background:linear-gradient(160deg,#650827 0%,#4a051c 60%,#2d0311 100%)}
.acesso-caixa{width:100%;max-width:430px;background:var(--sup);border-radius:14px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.acesso-marca{background:var(--vinho);text-align:center;padding:20px 16px 12px;border-bottom:2px solid var(--dourado)}
.acesso-marca img{width:180px;max-width:70%;height:auto}
.acesso-marca p{margin:4px 0 0;font-family:var(--f-titulo);font-size:22px;font-weight:700;color:var(--dourado-claro)}
.acesso-corpo{padding:22px}
.acesso-corpo h1{font-size:28px}
.acesso-corpo .form{max-width:none}
.acesso-corpo .btn{width:100%}
.acesso-corpo .nota{text-align:center;margin-top:14px}
.acesso-rodape{color:#E6CBD2;font-size:12px;margin-top:16px;text-align:center}
.passos{padding-left:20px;margin:0 0 14px} .passos li{margin:4px 0}
.qr{display:flex;justify-content:center;margin:8px 0 12px}
.qr img{border:1px solid var(--linha);border-radius:8px;padding:6px;background:#fff}
.chave{margin-bottom:14px;font-size:14px}
.chave summary{cursor:pointer;color:var(--vinho);font-weight:600}
.chave code{display:block;font-size:16px;letter-spacing:.06em;background:var(--sup2);border:1px solid var(--linha);border-radius:8px;padding:10px;text-align:center;word-break:break-all}

@media (max-width:640px){
  h1{font-size:27px}
  .topo-in{gap:8px}
  .marca img{height:34px}
  .menu{order:3;flex-basis:100%;overflow-x:auto;flex-wrap:nowrap}
  .menu a{white-space:nowrap}
  .sair{margin-left:auto}
  .conteudo{padding-top:16px}
}
@media print{.topo,.rodape,.btn,form{display:none}}