/* Tela de login do ROTA (index.php, só quando ninguém está logado). Autossuficiente: não carrega o style.css do sistema, nenhuma fonte nem imagem de outros sites.
   Fonte do texto = a padrão do computador (system-ui); a Cinzel (cópia local, 15 KB) é usada só na palavra ROTA da marca. Cores: azul-marinho #18273D, dourado-areia #F0DE85 e bronze #A78443 só como acento fino. */
@font-face{font-family:'Cinzel Local';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/cinzel-latin-600.woff2') format('woff2');}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body.lg-body{margin:0;min-height:100vh;min-height:100dvh;background:#0E1826;color:#FFFFFF;font-family:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;font-size:16px;line-height:1.5;}
.lg-stage{min-height:100vh;min-height:100dvh;padding:clamp(8px,1.6vw,26px);display:flex;background:
  radial-gradient(900px 600px at 12% 88%,rgba(37,120,128,.38),transparent 62%),
  radial-gradient(760px 520px at 92% 8%,rgba(52,98,160,.34),transparent 60%),
  radial-gradient(700px 500px at 82% 96%,rgba(30,110,120,.26),transparent 60%),
  linear-gradient(135deg,#0B1420 0%,#18273D 48%,#1B3454 100%);}
.lg-frame{position:relative;flex:1;display:flex;flex-direction:column;min-width:0;border:1px solid rgba(138,176,214,.38);border-radius:26px;background:linear-gradient(160deg,rgba(34,64,98,.42),rgba(14,26,43,.55));box-shadow:inset 0 0 80px rgba(8,16,28,.45);}
.lg-deco{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none;}
.lg-circuit{position:absolute;inset:0;width:100%;height:100%;}
.lg-circuit .t{fill:none;stroke:#6F9CCB;stroke-opacity:.34;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round;}
.lg-circuit .g{fill:none;stroke:#F0DE85;stroke-opacity:.85;stroke-width:2;stroke-linecap:round;}
.lg-circuit .b{fill:none;stroke:#A78443;stroke-opacity:.9;stroke-width:2;stroke-linecap:round;}
.lg-circuit .n{fill:#14233A;stroke:#8FB6DB;stroke-opacity:.6;stroke-width:1.4;}
.lg-circuit .ng{fill:#14233A;stroke:#F0DE85;stroke-width:1.6;}
.lg-node{animation:lg-pulse 5s ease-in-out infinite;}
.lg-node:nth-of-type(2n){animation-delay:-1.7s;animation-duration:6.5s;}
.lg-node:nth-of-type(3n){animation-delay:-3.1s;animation-duration:4.2s;}
@keyframes lg-pulse{0%,100%{opacity:.35;}50%{opacity:1;}}

/* topo: marca (logotipo + ROTA) e subtítulo */
.lg-top{position:relative;z-index:2;display:flex;align-items:center;gap:14px;padding:22px 28px 0;}
.lg-brand{display:flex;align-items:center;white-space:nowrap;text-decoration:none;color:#FFFFFF;}
.lg-brand-logo{display:block;height:34px;width:auto;}
.lg-brand-sep{display:block;width:1px;height:26px;background:#C6A15B;margin:0 12px;}
.lg-brand-rota{font-family:'Cinzel Local',Georgia,serif;font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:21px;line-height:1;color:#FFFFFF;}
.lg-brand-sub{margin:0;font-size:12px;line-height:1.3;color:#C9D6E6;}
.lg-top-text{display:flex;flex-direction:column;gap:2px;}

/* miolo: ilustração | cartão | destaques */
.lg-main{position:relative;z-index:2;flex:1;display:grid;grid-template-columns:minmax(0,1fr) 400px minmax(0,1fr);align-items:center;gap:clamp(24px,3.6vw,56px);width:100%;max-width:1440px;margin:0 auto;padding:24px clamp(20px,3.6vw,56px) 28px;}
.lg-side{min-width:0;}
.lg-left{justify-self:end;max-width:400px;}
.lg-right{justify-self:start;max-width:300px;}
.lg-route{display:block;width:100%;height:clamp(150px,27vh,268px);max-width:310px;margin:0 0 20px;overflow:visible;}
.lg-route .r{fill:none;stroke:#8FB6DB;stroke-opacity:.8;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.lg-route .rd{fill:none;stroke:#F0DE85;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:1 9;}
.lg-route .ring{fill:#14233A;stroke:#F0DE85;stroke-width:2.2;}
.lg-route .dot{fill:#F0DE85;}
.lg-route .pin{fill:#14233A;stroke:#A78443;stroke-width:2.4;stroke-linejoin:round;}
.lg-route .flag{fill:#F0DE85;}
.lg-route .gl{fill:none;stroke:#8FB6DB;stroke-opacity:.35;stroke-width:1.2;}
.lg-h2{margin:0 0 12px;font-size:clamp(22px,2.35vw,40px);line-height:1.2;font-weight:700;color:#FFFFFF;}
.lg-lead{margin:0;font-size:clamp(16px,1.2vw,18px);line-height:1.5;font-weight:400;color:#D3DEEB;}
.lg-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px;}
.lg-points li{display:flex;align-items:center;gap:14px;font-size:16px;font-weight:500;line-height:1.4;color:#F3F7FB;}
.lg-ico{flex:none;display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:13px;border:1px solid rgba(143,182,219,.55);background:rgba(58,102,156,.34);}
.lg-ico svg{width:26px;height:26px;fill:none;stroke:#F0DE85;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
/* satélite (desenho original, decorativo) */
.lg-sat{display:block;width:100%;max-width:230px;height:auto;margin:0 0 28px;overflow:visible;}
.lg-sat .s-link{fill:none;stroke:#8FB6DB;stroke-opacity:.75;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:1 6;}
.lg-sat .s-end{fill:#14233A;stroke:#F0DE85;stroke-width:1.6;}
.lg-sat .s-pan{fill:#6FA4DA;stroke:#F0DE85;stroke-width:1.4;}
.lg-sat .s-grid{fill:none;stroke:#E3EFFB;stroke-opacity:.8;stroke-width:.9;}
.lg-sat .s-arm{fill:none;stroke:#C9D6E6;stroke-width:2.4;stroke-linecap:round;}
.lg-sat .s-body{fill:#EAF2FB;stroke:#8FB6DB;stroke-width:1.4;}
.lg-sat .s-band{fill:#2D5A92;}
.lg-sat .s-gold{fill:none;stroke:#F0DE85;stroke-width:1.5;stroke-linecap:round;}
.lg-sat .s-win{fill:#1B3454;stroke:#F0DE85;stroke-width:1.5;}
.lg-sat .s-dot{fill:#F0DE85;}
.lg-sat .s-sig{fill:none;stroke:#F0DE85;stroke-width:2;stroke-linecap:round;}
.lg-fly{animation:lg-float 7s ease-in-out infinite;}
.lg-sig{animation:lg-blink 2.4s ease-in-out infinite;}
.lg-sig:nth-of-type(2){animation-delay:.4s;}
.lg-sig:nth-of-type(3){animation-delay:.8s;}
@keyframes lg-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-5px);}}
@keyframes lg-blink{0%,100%{opacity:.3;}50%{opacity:1;}}

/* cartão */
.lg-card{position:relative;width:100%;max-width:400px;margin:0 auto;padding:30px 32px 28px;background:#FFFFFF;color:#18273D;border-radius:16px;box-shadow:0 24px 60px rgba(4,10,20,.5),0 2px 8px rgba(4,10,20,.3);color-scheme:light;}
.lg-card-logo{display:block;height:46px;width:auto;margin:0 auto 14px;}
.lg-title{margin:0 0 4px;text-align:center;font-size:25px;line-height:1.2;font-weight:700;color:#18273D;}
.lg-sub{margin:0 0 22px;text-align:center;font-size:14px;line-height:1.45;color:#4B5563;}
.lg-field{margin:0 0 16px;}
.lg-label{display:block;margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#374151;}
.lg-input{display:block;width:100%;height:48px;padding:0 14px;border:1.5px solid #7B8798;border-radius:10px;background:#FFFFFF;color:#18273D;font:inherit;font-size:16px;}
.lg-input::placeholder{color:#6B7280;opacity:1;}
.lg-input:hover{border-color:#4B5563;}
.lg-input:focus{outline:3px solid #A78443;outline-offset:1px;border-color:#18273D;}
.lg-pw{position:relative;}
.lg-pw .lg-input{padding-right:52px;}
.lg-eye{position:absolute;top:2px;right:2px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:8px;background:transparent;color:#4B5563;cursor:pointer;}
.lg-eye:hover{background:#EEF1F5;color:#18273D;}
.lg-eye:focus-visible{outline:3px solid #A78443;outline-offset:0;}
.lg-eye svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.lg-eye .off{display:none;}
.lg-eye[aria-pressed="true"] .on{display:none;}
.lg-eye[aria-pressed="true"] .off{display:block;}
.lg-btn{display:block;width:100%;height:48px;margin:20px 0 0;border:0;border-radius:10px;background:#18273D;color:#FFFFFF;font:inherit;font-size:16px;font-weight:700;cursor:pointer;}
.lg-btn:hover{background:#243B5A;}
.lg-btn:focus-visible{outline:3px solid #A78443;outline-offset:2px;}
.lg-error{display:flex;align-items:flex-start;gap:10px;margin:0 0 16px;padding:11px 13px;border:1.5px solid #B3261E;border-radius:10px;background:#FDECEA;color:#7A1710;font-size:14px;line-height:1.4;font-weight:600;}
.lg-error svg{flex:none;width:20px;height:20px;margin-top:1px;fill:none;stroke:#B3261E;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}

/* rodapé */
.lg-foot{position:relative;z-index:2;margin:0;padding:0 16px 18px;text-align:center;font-size:12px;line-height:1.4;color:#C9D6E6;}

/* tablet e celular: só o cartão, com a marca acima */
@media (max-width:1023px){
  .lg-circuit,.lg-left,.lg-right{display:none;}
  .lg-stage{padding:0;}
  .lg-frame{border-radius:0;border-width:0;}
  .lg-top{justify-content:center;padding:26px 16px 0;}
  .lg-top-text{display:none;}
  .lg-brand-logo{height:38px;}
  .lg-brand-rota{font-size:23px;}
  .lg-main{display:block;padding:22px 16px 26px;}
  .lg-card{padding:26px 24px 24px;}
}
@media (max-width:420px){
  .lg-card{padding:24px 18px 22px;}
  .lg-title{font-size:23px;}
}
@media (max-width:320px){.lg-brand-sep{display:none;}}
@media (max-height:520px) and (orientation:landscape){.lg-top{padding-top:12px;}.lg-main{padding-top:12px;}}
@media (min-width:1024px) and (max-width:1120px){
  .lg-main{gap:20px;padding-left:16px;padding-right:16px;}
  .lg-points li{gap:12px;}
  .lg-ico{width:42px;height:42px;}
}
/* movimento reduzido: tudo parado (vem por último para valer sobre as regras acima) */
@media (prefers-reduced-motion:reduce){.lg-node{animation:none;opacity:.8;}.lg-fly{animation:none;transform:none;}.lg-sig{animation:none;opacity:1;}}
