/* Login e sessão (v70) */
.app[hidden]{display:none}
.login{position:fixed;inset:0;z-index:150;display:grid;place-items:center;padding:20px;overflow:auto;
  background:radial-gradient(90% 70% at 50% 30%,#0d1830 0%,#070d1c 55%,#04070f 100%);color:#fff;animation:aparece .4s ease-out;transition:opacity .6s ease}
.login.saindo{opacity:0;pointer-events:none}
.app.entrando{animation:aparece .75s ease-out}
.login[hidden]{display:none}
.login-cx{width:min(320px,100%);display:flex;flex-direction:column;gap:6px;padding:8px 4px;animation:cresce .45s var(--ease) both}
.login-logo{width:150px;height:auto;align-self:center;margin-bottom:10px;opacity:.96}
.login-sub{margin:0 0 30px;text-align:center;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:#6f7f9c;font-weight:500}
.login-cx label{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:#7b8aa6;margin-top:12px}
.login-cx input{height:46px;padding:0 14px;border-radius:9px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.035);color:#fff;font:inherit;font-size:16px;outline:none;transition:border-color .18s ease,background .18s ease}
.login-cx input:hover{border-color:rgba(255,255,255,.18)}
.login-cx input:focus{border-color:#4f7df0;background:rgba(255,255,255,.05)}
.login-erro{min-height:18px;margin:8px 0 4px;font-size:12.5px;color:#f0a0a0}
.login-cx .btn{height:46px;justify-content:center;font-size:14px;font-weight:600;letter-spacing:.02em;border-radius:9px;border:0;background:#2f62e6;color:#fff}
.login-cx .btn:hover{background:#3b6ff2}
.login-cx .btn:disabled{opacity:.6}
.sessao{display:inline-flex;align-items:center;gap:10px;font-size:12.5px;color:var(--muted);white-space:nowrap}
.sessao[hidden]{display:none}
.sessao b{color:var(--fg)}
#sair,#sair:hover,#sair:focus-visible{background:#c8323a;border-color:#c8323a;color:#fff}   /* mesmo vermelho nos temas claro e escuro */
#sair:hover{background:#b3272f;border-color:#b3272f}
@media (max-width:759px){.sessao-quem{display:none}}
/* Campos alinhados na mesma linha (v69): rótulo sempre em uma linha, caixas na mesma altura, ajuda embaixo */
.form{align-items:start}
.form .field[hidden]{display:none}
.form .field>label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.4;min-height:1.4em}
.form .field>input,.form .field>select{height:38px;box-sizing:border-box}
@media (pointer:coarse){.form .field>input,.form .field>select{height:44px}}
/* Aberturas mais suaves (v67): formulários e janelas abrem em ~1/3 de segundo, em vez de surgir de uma vez */
@keyframes abre{from{opacity:0;transform:translate3d(0,-12px,0) scale(.985)}to{opacity:1;transform:none}}
section.panel:has(>form){animation:abre .38s var(--ease) both;transform-origin:top center}
section.panel:has(>form) fieldset,section.panel:has(>form) .form-foot{animation:aparece .45s ease-out .08s both}
#mp-form .pop-fundo,#g-pop .pop-fundo{animation:aparece .3s ease-out both}
#mp-form .pop,#g-pop.abrindo .pop{animation:cresce .38s var(--ease) both}
#mp-form .pop .panel{animation:none}
#f-cmarca,#f-cmodelo{animation:abre .34s var(--ease) both;transform-origin:top center}
.page-head{animation:aparece .32s ease-out both}
.rel-card{animation:sobe .36s var(--ease) both}.rel-card:nth-child(2){animation-delay:.05s}.rel-card:nth-child(3){animation-delay:.1s}
/* Relatórios e retomada de gravações (v66) */
.rel-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.rel-card{display:flex;flex-direction:column;gap:12px;margin:0;padding:20px 22px 20px;overflow:hidden}
.rel-card .panel-title{padding:0;margin:0;border:0;font-size:16px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--fg);line-height:1.3}
.rel-card p{margin:0;color:var(--muted);flex:1;font-size:13.5px;line-height:1.55}
.rel-card .rel-n{align-self:flex-start;font-size:12px;font-weight:600;color:var(--accent-text);background:color-mix(in srgb,var(--accent) 12%,transparent);padding:3px 10px;border-radius:999px}
.rel-card .toolbar{margin:4px 0 0;padding:0}
.rel-card .toolbar .btn{width:100%;justify-content:center;text-align:center}
.rel-card .exp-aviso{margin:0;padding:0;font-size:12.5px}
.rel-outras{margin:18px 2px 0;color:var(--muted);font-size:13px;line-height:1.6}
.rel-outras a{color:var(--accent-text);font-weight:600}
.pend-lista{margin:0 0 4px;padding-left:18px;display:grid;gap:4px}
/* Cadastro de pneu dentro do Mapeamento (v65) */
.pop.pop-larga{width:min(780px,100%)}
#mp-form .panel{border:0;padding:0;margin:0;box-shadow:none;background:none}
#mp-form .sub{margin:2px 0 12px;color:var(--muted)}
#mp-form [hidden]{display:none!important}
.est-head{gap:8px}.est-head #e-novo{margin-left:auto;white-space:nowrap}
.espera{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:24px;text-align:center;
  background:radial-gradient(120% 90% at 50% 40%,#12244a 0%,#0a1428 55%,#060c1a 100%);color:#fff;outline:none;cursor:pointer;animation:aparece .5s ease-out both;transition:opacity .2s ease}
.espera[hidden]{display:none}
.espera.saindo{opacity:0}
.espera-logo{width:190px;height:auto;margin-bottom:26px;animation:carga-pulso 4s ease-in-out infinite}
.espera-hora{font-size:64px;font-weight:300;line-height:1;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.espera-data{font-size:14px;color:#b9c7df;margin-top:8px}
.espera-data::first-letter{text-transform:uppercase}
.espera-msg{margin:44px 0 0;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:#7eaeff}
@media (max-width:759px){.espera-hora{font-size:48px}.espera-logo{width:150px}}