/* Moneta 1.0 | Fundação e login
   Segue o protótipo aprovado (moneta-prototipo-referencia.html) e a paleta do documento mestre. */

:root{
  color-scheme: dark;
  /* Base, preto */
  --obsidiana:#05070B; --grafite:#0B0F16; --aco:#121823; --aco-2:#1A2230; --linha:#232D3D;
  /* Ouro */
  --ouro:#C9A24B; --ouro-claro:#EBD08A; --ouro-escuro:#9C7944;
  /* Azul */
  --safira:#2F6BFF; --azul-real:#1D44B8; --azul-noite:#0A1B45;
  /* Texto */
  --marfim:#EEE9DC; --nevoa:#8C97AB;
  /* Semânticos */
  --positivo:#3CC59A; --negativo:#E4596E;
  --display:"Cormorant Garamond","Palatino Linotype",Palatino,Georgia,serif;
  --texto:"Manrope","Segoe UI",system-ui,sans-serif;
  --marca:"Montserrat","Segoe UI",system-ui,sans-serif;
  --brushed:repeating-linear-gradient(90deg,rgba(255,255,255,.028) 0 1px,transparent 1px 3px);
  --acento:#C9A24B; --acento-claro:#EBD08A; --acento-escuro:#9C7944;
  --acento-glow:rgba(201,162,75,.22); --acento-glow2:rgba(201,162,75,.32);
  --glow:rgba(201,162,75,.12); --glow2:rgba(201,162,75,.18);
  --quente:#1a1405; --raio:rgba(235,208,138,.07);
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{height:100%}
body{
  min-height:100%;
  background:
    radial-gradient(1200px 600px at 20% -10%,#0d1a3a 0%,transparent 60%),
    radial-gradient(900px 500px at 100% 110%,var(--quente) 0%,transparent 60%),
    var(--obsidiana);
  color:var(--marfim);font-family:var(--texto);font-size:14px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
button,input{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--ouro-claro);outline-offset:2px}
.tela{min-height:100vh}

/* ===== Carregando ===== */
.carregando{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--nevoa);font-weight:600;letter-spacing:.02em;z-index:10}
.carregando-ponto{width:9px;height:9px;border-radius:50%;background:var(--ouro);box-shadow:0 0 14px var(--ouro);animation:pulsa 1.2s ease-in-out infinite}
@keyframes pulsa{0%,100%{opacity:.35}50%{opacity:1}}

/* ===== LOGIN ===== */
.login{display:grid;grid-template-columns:1.1fr 1fr;min-height:100vh}
.marca{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:56px;text-align:center;
  background:var(--brushed),radial-gradient(520px 420px at 50% 42%,#10265e 0%,#08122c 45%,#05070B 100%);
  border-right:1px solid var(--linha);overflow:hidden;
}
.marca::before{content:"";position:absolute;inset:0;background:conic-gradient(from 210deg at 50% 42%,transparent 0 60%,var(--raio) 70%,transparent 80%);pointer-events:none}
.logo-completo{position:relative;width:min(100%,560px);height:auto;display:block;filter:drop-shadow(0 18px 36px rgba(0,0,0,.65)) drop-shadow(0 0 46px rgba(47,107,255,.22))}
.nome{
  position:relative;font-family:var(--marca);font-weight:800;font-size:60px;line-height:1;letter-spacing:.07em;
  background:linear-gradient(180deg,var(--ouro-claro) 0%,var(--ouro) 55%,var(--ouro-escuro) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.versao{position:absolute;bottom:22px;left:0;right:0;color:var(--nevoa);font-size:12px}

.acesso{
  --marfim:#0E1A2E;--nevoa:#5A6578;--linha:#D3DAE6;--obsidiana:#FFFFFF;
  display:flex;align-items:center;justify-content:center;padding:48px;color:var(--marfim);
  background:radial-gradient(700px 360px at 85% -8%,rgba(47,107,255,.10),transparent 70%),linear-gradient(180deg,#F4F6FA,#E9EDF4);
  color-scheme:light;
}
.cartao{width:100%;max-width:400px}
.cartao h1{font-family:var(--marca);font-weight:600;font-size:28px;line-height:1.15;margin-bottom:6px}
.cartao p.sub{color:var(--nevoa);margin-bottom:26px}
.passo{display:block}

.campo{margin-bottom:18px}
.campo label{display:block;font-size:12.5px;color:var(--nevoa);margin-bottom:7px;font-weight:600}
.entrada{position:relative}
.entrada input{width:100%;height:48px;background:var(--obsidiana);border:1px solid var(--linha);border-radius:8px;padding:0 44px 0 14px;transition:.2s}
.entrada input::placeholder{color:#8C97AB}
.entrada input:hover{border-color:#B8C2D3}
.entrada input:focus{outline:none;border-color:var(--ouro);box-shadow:0 0 0 3px var(--glow2)}
.entrada input.codigo{padding:0 14px;font-family:var(--marca);font-weight:600;font-size:22px;letter-spacing:.35em;text-align:center}
.olho{position:absolute;right:6px;top:6px;width:36px;height:36px;border:0;background:none;color:var(--nevoa);cursor:pointer;border-radius:6px}
.olho:hover{color:#7A5A2A}
.linha-opc{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:4px 0 26px;font-size:13px;color:var(--nevoa)}
.linha-opc label{display:flex;align-items:center;gap:8px;cursor:pointer}
.linha-opc input{accent-color:var(--ouro)}
.linha-opc a{color:#1D44B8;text-decoration:none}
.linha-opc a:hover{text-decoration:underline}

.btn-ouro{
  width:100%;height:50px;border:0;border-radius:8px;cursor:pointer;font-weight:700;font-size:15px;color:#1a1305;letter-spacing:.02em;
  background:linear-gradient(180deg,var(--acento-claro) 0%,var(--acento) 60%,var(--acento-escuro) 100%);
  box-shadow:0 10px 26px var(--acento-glow),inset 0 1px 0 rgba(255,255,255,.45);transition:.2s;
}
.btn-ouro:hover{transform:translateY(-1px);box-shadow:0 14px 32px var(--acento-glow2),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-ouro[disabled]{opacity:.65;cursor:progress;transform:none}
.btn-link{display:block;width:100%;margin-top:14px;padding:8px;border:0;background:none;cursor:pointer;color:#1D44B8;font-weight:600;font-size:13.5px;text-align:center}
.btn-link:hover{text-decoration:underline}

.selos{margin-top:34px;padding-top:20px;border-top:1px solid var(--linha);display:grid;gap:10px;font-size:12.5px;color:var(--nevoa)}
.selos div{display:flex;gap:10px;align-items:center}
.selos i{width:7px;height:7px;border-radius:50%;background:var(--safira);box-shadow:0 0 10px var(--safira);flex:none}
.selos i.o{background:var(--ouro);box-shadow:0 0 10px var(--ouro)}

.erro{margin-bottom:18px;padding:11px 14px;border-radius:8px;border:1px solid rgba(194,54,80,.35);background:rgba(194,54,80,.08);color:#9B2238;font-size:13.5px;font-weight:600}
.aviso-topo{margin-bottom:20px;padding:11px 14px;border-radius:8px;border:1px solid rgba(18,135,95,.35);background:rgba(18,135,95,.08);color:#0D6B4B;font-size:13.5px;font-weight:600}
.aviso-topo.atencao{border-color:rgba(156,121,68,.45);background:rgba(201,162,75,.12);color:#7A5A2A}

.etapas{margin:0 0 20px 18px;color:var(--nevoa);font-size:13.5px;display:grid;gap:6px}
.qr-area{display:flex;gap:18px;align-items:center;margin-bottom:20px;flex-wrap:wrap}
.qr-area img{background:#fff;border:1px solid var(--linha);border-radius:10px;padding:8px}
.chave{flex:1;min-width:160px;font-size:12px;color:var(--nevoa)}
.chave span{display:block;margin-bottom:6px;font-weight:600}
.chave code{display:block;word-break:break-all;padding:10px 12px;border:1px solid var(--linha);border-radius:8px;background:#fff;color:#0E1A2E;font-size:13px;letter-spacing:.06em}

.regras{list-style:none;margin:0 0 22px;display:grid;gap:4px;font-size:12.5px;color:var(--nevoa)}
.regras li::before{content:"";display:inline-block;width:8px;height:8px;margin-right:9px;border-radius:50%;border:1.5px solid #B8C2D3;vertical-align:0}
.regras li.ok{color:#12875F}
.regras li.ok::before{background:#12875F;border-color:#12875F}

/* ===== SISTEMA ===== */
.app{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;min-height:100vh}
.lateral{background:var(--brushed),linear-gradient(180deg,#0c1119,#06080d);border-bottom:1px solid var(--linha);display:flex;flex-direction:row;align-items:center;gap:14px;padding:0 20px;height:66px}
.logo-l{display:flex;align-items:center;gap:12px;padding:0 14px 0 0;border-right:1px solid var(--linha);height:40px;flex:none}
.simb-l{width:46px;height:auto;flex:none}
.logo-l b{display:block;font-family:var(--marca);font-size:20px;letter-spacing:.06em;line-height:1.1;font-weight:800;background:linear-gradient(180deg,var(--ouro-claro),var(--ouro-escuro));-webkit-background-clip:text;background-clip:text;color:transparent}
.logo-l small{color:var(--nevoa);font-size:11.5px}
.menu{display:flex;align-items:stretch;gap:2px;height:100%;min-width:0}
.menu a{display:flex;align-items:center;gap:8px;padding:0 12px;color:var(--nevoa);text-decoration:none;font-weight:600;position:relative;transition:.15s;cursor:pointer;white-space:nowrap;font-size:13.5px}
.menu a svg{width:18px;height:18px;flex:none}
.menu a:hover{background:var(--aco);color:var(--marfim)}
.menu a.atual{background:linear-gradient(180deg,rgba(47,107,255,.02),rgba(47,107,255,.22));color:var(--marfim)}
.menu a.atual::before{content:"";position:absolute;left:12px;right:12px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--ouro)}
.menu a.atual svg{color:var(--ouro-claro)}
.menu .sep{width:1px;background:var(--linha);margin:20px 4px}
.rodape-l{margin:0 0 0 auto;display:flex;align-items:center;gap:12px;flex:none}
.sync{background:var(--aco);border:1px solid var(--linha);border-radius:999px;padding:6px 12px;font-size:12px;color:var(--nevoa)}
.sync b{display:flex;align-items:center;gap:8px;color:var(--marfim);font-size:12.5px;font-weight:600}
.sync b i{width:7px;height:7px;border-radius:50%;background:var(--nevoa)}
.usuario{display:flex;align-items:center;gap:11px}
.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:17px;color:#1a1305;background:linear-gradient(180deg,var(--ouro-claro),var(--ouro-escuro))}
.usuario span{font-weight:600;display:block;line-height:1.2}
.usuario small{color:var(--nevoa);font-size:11.5px}
.btn-sair{height:34px;padding:0 14px;border-radius:8px;border:1px solid var(--linha);background:transparent;color:var(--marfim);font-weight:600;cursor:pointer;transition:.2s}
.btn-sair:hover{border-color:var(--ouro-escuro);color:var(--ouro-claro)}

/* Área de conteúdo clara */
.principal{
  --marfim:#0E1A2E;--nevoa:#5A6578;--linha:#DCE2EC;--aco:#FFFFFF;--obsidiana:#F3F5F9;
  --positivo:#12875F;--negativo:#C23650;
  padding:26px 30px 34px;min-width:0;color:var(--marfim);color-scheme:light;
  background:radial-gradient(900px 360px at 85% -8%,rgba(47,107,255,.10),transparent 70%),linear-gradient(180deg,#F4F6FA,#E9EDF4);
}
.principal:focus{outline:none}
.topo{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:24px;flex-wrap:wrap}
.topo h2{font-family:var(--marca);font-weight:600;font-size:28px;line-height:1.1;color:#0E1A2E}
.topo p{color:var(--nevoa);margin-top:4px}
.grade{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.cx{background:#FFFFFF;border:1px solid #DCE2EC;border-radius:12px;padding:20px 22px;min-width:0;box-shadow:0 1px 2px rgba(14,26,46,.05),0 10px 26px rgba(14,26,46,.06)}
.cx h3{font-size:13px;font-weight:700;color:#5A6578;margin-bottom:12px}
.cx.largo{grid-column:1/-1}
.cx .texto{max-width:70ch;color:#2B3A55}
.roteiro{margin:14px 0 0 20px;display:grid;gap:6px;color:#2B3A55}
.cx.vazio .btn-sec{display:inline-flex;align-items:center;margin-top:16px}
.btn-sec{height:42px;padding:0 18px;border-radius:8px;border:1px solid #9C7944;background:transparent;color:#7A5A2A;font-weight:700;cursor:pointer;text-decoration:none;transition:.2s}
.btn-sec:hover{background:rgba(201,162,75,.14)}
.rodape-p{margin-top:26px;text-align:center;color:#8791A3;font-size:11.5px}

/* ===== Telas menores ===== */
@media (max-width:1400px){
  .usuario small{display:none}
  .menu a svg{display:none}
}
@media (max-width:1100px){
  .login{grid-template-columns:1fr}
  .marca{min-height:340px;padding:40px 24px}
  .acesso{padding:36px 22px 48px}
  .lateral{flex-wrap:wrap;height:auto;padding:10px 14px;gap:10px}
  .logo-l{border:0;padding:0}
  .menu{order:3;width:100%;overflow-x:auto;height:auto}
  .menu a{height:44px}
  .menu .sep{margin:10px}
  .menu a.atual::before{display:none}
  .rodape-l{margin-left:auto}
  .sync{display:none}
  .principal{padding:20px 16px 28px}
}
@media (max-width:560px){
  .usuario span{display:none}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}