/* Tela de login - tema construção */
body.lg{display:block;min-height:100vh;background:var(--bg)}
.lg-wrap{display:grid;grid-template-columns:1.15fr 1fr;min-height:100vh}

/* painel da marca (sempre escuro) */
.lg-hero{position:relative;overflow:hidden;color:#f4f7fd;padding:44px 52px;display:flex;flex-direction:column;
  background:
    radial-gradient(700px 420px at 20% 0%,rgba(59,130,246,.35),transparent 70%),
    radial-gradient(600px 400px at 100% 100%,rgba(245,158,11,.14),transparent 70%),
    linear-gradient(160deg,#0a1530 0%,#081024 55%,#060b1a 100%)}
.lg-hero:before{content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;
  background-image:linear-gradient(rgba(96,165,250,.10) 1px,transparent 1px),linear-gradient(90deg,rgba(96,165,250,.10) 1px,transparent 1px);
  background-size:44px 44px;mask-image:linear-gradient(180deg,#000 0%,transparent 85%);-webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 85%)}
.lg-brand{position:relative;display:flex;align-items:center;gap:11px;font-size:1.44rem;font-weight:700;letter-spacing:.2px}
.lg-logo{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);display:grid;place-items:center;box-shadow:0 8px 22px rgba(59,130,246,.5)}
.lg-hero h2{position:relative;font-size:2.72rem;line-height:1.15;margin:46px 0 12px;font-weight:700;letter-spacing:-.5px;max-width:460px}
.lg-hero h2 span{background:linear-gradient(90deg,#60a5fa,#fbbf24);-webkit-background-clip:text;background-clip:text;color:transparent}
.lg-hero p.lead{position:relative;font-size:1.12rem;color:#e1e9f8;max-width:440px;line-height:1.6}
.lg-feats{position:relative;display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.lg-feats span{display:inline-flex;align-items:center;gap:7px;font-size:0.96rem;color:#ffffff;border:1px solid rgba(96,165,250,.45);background:rgba(59,130,246,.10);padding:5px 12px;border-radius:30px;backdrop-filter:blur(4px)}
.lg-feats i{width:6px;height:6px;border-radius:50%;background:#fbbf24}
.lg-scene{position:absolute;left:0;right:0;bottom:0;width:100%;height:auto;max-height:52%;pointer-events:none}
.lg-copy{position:relative;margin-top:auto;font-size:0.88rem;color:#5f7096;z-index:2}

/* animação do guindaste */
.crane-load{transform-origin:640px 118px;animation:swing 5s ease-in-out infinite}
@keyframes swing{0%,100%{transform:rotate(-2.2deg)}50%{transform:rotate(2.2deg)}}
.win{animation:blink 4s steps(1) infinite}.win.b{animation-delay:1.3s}.win.c{animation-delay:2.6s}
@keyframes blink{0%,62%{opacity:1}63%,100%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.crane-load,.win{animation:none}}

/* painel do formulário */
.lg-form{display:flex;align-items:center;justify-content:center;padding:34px 28px;position:relative}
.lg-card{width:100%;max-width:370px}
.lg-card h1{font-size:1.92rem;margin-bottom:5px;letter-spacing:-.3px}
.lg-card .sub{color:var(--mut);font-size:1.04rem;margin-bottom:24px}
.lg-field{margin-bottom:15px}
.lg-field label{font-size:0.88rem;margin-bottom:6px}
.lg-in{position:relative}
.lg-in > svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--mut);pointer-events:none}
.lg-in input{padding:11px 40px 11px 38px;font-size:1.08rem;border-radius:9px;background:var(--panel);border-color:var(--line2)}
.lg-in input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(59,130,246,.18)}
.lg-eye{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:34px;height:34px;background:none;border:0;color:var(--mut);cursor:pointer;padding:0;border-radius:7px;display:flex;align-items:center;justify-content:center;z-index:2}
.lg-eye:hover{color:var(--tx);background:var(--panel2)}
.lg-eye svg{position:static;display:block;pointer-events:none}
.lg-eye .off{display:none}
.lg-eye.on .on{display:none}.lg-eye.on .off{display:block}.lg-eye.on{color:var(--blue2)}
.lg-btn{width:100%;margin-top:6px;padding:12px;font-size:1.12rem;justify-content:center;border-radius:9px;
  background:linear-gradient(135deg,#3b82f6,#1d4ed8);box-shadow:0 8px 22px rgba(37,99,235,.35);transition:transform .12s,box-shadow .12s}
.lg-btn:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(37,99,235,.45);background:linear-gradient(135deg,#4b8df8,#2563eb)}
.lg-foot{margin-top:22px;text-align:center;font-size:0.88rem;color:var(--mut)}
.lg-theme{position:absolute;top:18px;right:20px;background:var(--panel);border:1px solid var(--line2);color:var(--mut);border-radius:8px;padding:6px 10px;font:inherit;font-size:0.92rem;cursor:pointer}
.lg-theme:hover{color:var(--tx);border-color:var(--blue)}
.lg-card .alert{margin-bottom:16px}
.lg-stripe{height:6px;border-radius:6px;margin-bottom:22px;width:70px;background:repeating-linear-gradient(135deg,#fbbf24 0 8px,#0b1220 8px 16px)}
:root[data-theme="light"] .lg-stripe{background:repeating-linear-gradient(135deg,#f59e0b 0 8px,#1c2740 8px 16px)}

@media(max-width:900px){
  .lg-wrap{grid-template-columns:1fr}
  .lg-hero{display:none}
  .lg-form{min-height:100vh;background:radial-gradient(500px 300px at 50% -10%,rgba(59,130,246,.2),transparent 70%),var(--bg)}
}