/* DEEC Studio · acceso administrativo: una sola tarjeta centrada sobre un fondo suave. Hoja propia porque es la única pantalla del panel con degradados (las demás hojas del panel no los usan). Todo sale de los tokens del tema, sin colores fijos salvo el círculo blanco del logotipo de Google. */
body:has(#login:not([hidden])){display:block;min-height:0;overflow-x:hidden}
.login{position:relative;isolation:isolate;min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:32px 20px;box-sizing:border-box;overflow:hidden;background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%)}
.login__bg{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(58% 52% at 4% 62%,color-mix(in srgb,var(--acc) 13%,transparent),transparent 72%),radial-gradient(46% 56% at 100% 38%,color-mix(in srgb,var(--acc) 10%,transparent),transparent 72%)}
.login__bg::before,.login__bg::after{content:"";position:absolute;border-radius:50%;background:linear-gradient(145deg,color-mix(in srgb,var(--acc) 11%,transparent),transparent 62%)}
.login__bg::before{width:78vmax;height:78vmax;left:-46vmax;bottom:-52vmax}
.login__bg::after{width:64vmax;height:64vmax;right:-36vmax;top:8vh}
.login__card{width:100%;max-width:440px;box-sizing:border-box;padding:42px 40px 26px;text-align:center;background:var(--card);border:0;border-radius:20px;box-shadow:0 40px 90px -44px color-mix(in srgb,var(--acc) 38%,transparent),0 1px 3px color-mix(in srgb,var(--fg) 6%,transparent)}
.login__logo-a{display:inline-block;line-height:0;border-radius:6px}
.login__logo-a:focus-visible{outline:3px solid color-mix(in srgb,var(--acc) 45%,transparent);outline-offset:6px}
.login__logo{display:block;height:28px;width:auto;object-fit:contain;filter:var(--logo-filter)}
.login__eyebrow{margin:16px 0 34px;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.login h1{margin:0 0 10px;font-size:clamp(22px,3.2vw,28px);font-weight:500;letter-spacing:-.015em;line-height:1.15;color:var(--fg)}
.login__lead{max-width:340px;margin:0 auto 26px;font-size:14.5px;line-height:1.5;color:var(--muted)}
.login__google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:48px;padding:0 18px;border:0;border-radius:11px;background:var(--acc-hover);color:var(--accfg);font:inherit;font-size:15px;font-weight:500;cursor:pointer;box-shadow:0 10px 20px -12px color-mix(in srgb,var(--acc-hover) 80%,transparent);transition:background .2s,transform .2s,box-shadow .2s}
.login__google:hover{background:color-mix(in srgb,var(--acc-hover) 88%,#000);box-shadow:0 18px 32px -14px color-mix(in srgb,var(--acc-hover) 85%,transparent)}
.login__google:active{transform:translateY(1px)}
.login__google:focus-visible{outline:3px solid color-mix(in srgb,var(--acc) 50%,transparent);outline-offset:3px}
.login__google[aria-busy=true]{pointer-events:none;opacity:.85}
.login__g{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:#fff}
.login__g svg{width:17px;height:17px;display:block}
.login__google[aria-busy=true] .login__g svg{display:none}
.login__google[aria-busy=true] .login__g::after{content:"";width:15px;height:15px;border-radius:50%;border:2px solid var(--line-strong);border-top-color:var(--acc-hover);animation:loginspin .8s linear infinite}
@keyframes loginspin{to{transform:rotate(360deg)}}
.login__err{margin:0 0 20px;padding:12px 16px;border-radius:12px;background:var(--bad-l);color:var(--bad);font-size:14.5px;line-height:1.5}
.login__secure{display:grid;justify-items:center;gap:3px;margin:26px auto 0;max-width:320px}
.login__shield{display:grid;place-items:center;width:46px;height:46px;margin-bottom:8px;border-radius:50%;background:var(--acc-l);color:var(--acc-hover)}
.login__shield svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.login__secure b{font-size:14.5px;font-weight:600;color:var(--fg)}
.login__secure span:last-child{font-size:13px;line-height:1.5;color:var(--muted)}
.login .lang-seg{display:inline-flex;align-items:center;gap:0;margin:24px 0 0;padding:0;border:0;border-radius:0;background:none}
.login .lang-seg button{position:relative;display:inline-flex;align-items:center;gap:7px;min-width:0;height:40px;padding:0 12px;border-radius:8px;background:none;color:var(--muted);font-size:13.5px;font-weight:500;letter-spacing:.06em}
.login .lang-seg button+button::before{content:"·";position:absolute;inset-inline-start:-3px;color:var(--muted);opacity:.7}
.login .lang-seg .flag{width:20px;height:14px;border-radius:3px;opacity:.8;box-shadow:0 0 0 1px color-mix(in srgb,var(--fg) 10%,transparent);transition:opacity .2s}
.login .lang-seg button:hover .flag,.login .lang-seg button[aria-pressed=true] .flag{opacity:1}
.login .lang-seg button:hover{color:var(--fg)}
.login .lang-seg button[aria-pressed=true]{background:none;color:var(--acc-hover);font-weight:700}
.login .lang-seg button:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.login__foot{margin:6px 0 0;font-size:12.5px;color:var(--muted)}
@media (max-width:600px){
  .login{padding:20px 16px}
  .login__card{padding:32px 20px 20px;border-radius:18px}
  .login__eyebrow{margin:14px 0 26px;font-size:10.5px;letter-spacing:.18em}
  .login__lead{margin-bottom:22px;font-size:14px}
  .login__google{min-height:46px;font-size:15px}
  .login__secure{margin-top:22px}
}
@media (prefers-reduced-motion:reduce){.login__google{transition:none}.login__google[aria-busy=true] .login__g::after{animation-duration:2s}}
/* Dot grid estratégico: un único acento de puntos en la esquina superior derecha, detrás de la tarjeta, más denso junto a la esquina y desvaneciéndose hacia el centro (mismo criterio que admin-dots.css). Color sólido de los tokens del tema; sin puntos en la tarjeta. */
.login::before{content:"";position:absolute;top:0;right:0;z-index:-1;width:46%;height:min(520px,62%);pointer-events:none;background:radial-gradient(circle,color-mix(in srgb,var(--bg2) 62%,var(--acc)) 1.1px,transparent 1.7px) 0 0/20px 20px;-webkit-mask-image:radial-gradient(ellipse 125% 125% at 100% 0%,#000 0%,rgba(0,0,0,.7) 38%,transparent 100%);mask-image:radial-gradient(ellipse 125% 125% at 100% 0%,#000 0%,rgba(0,0,0,.7) 38%,transparent 100%)}
@media (max-width:600px){.login::before{width:100%;height:min(300px,45%);background-size:16px 16px}}
html[data-pal=contraste] .login::before{display:none}
@media print{.login::before{display:none}}
