/* Islagenda v7.5b · Acceso común (Mi local, Mi isla, panel): login de cristal oscuro + código de verificación claro.
   Fondo blanco con el logotipo oficial (pedido de Lestter 28-10 13:40). Diseño «A · Cristal atlántico» elegido por Lestter el 28-10-2026 (maqueta: claude.ai/artifact/Ae2pZXggqHhU27ba4sCBDr).
   Lo pinta public/assets/js/acceso.v1.js con IG.acceso({...}). Estructura base, por si otra página la monta a mano:
   <body class="ac">
     <div class="ac-caja">
       <div class="ac-cab"><span class="ac-rol">Mi local</span></div> + a.ac-firma (logotipo centrado ENCIMA de la tarjeta desde v3, como pidió Lestter)
       <section class="ac-cristal"><div class="ac-cristal-in"> h1.ac-tit (span.ac-acento) · p.ac-sub · .ac-campo>label+.ac-entrada>(svg.ac-ic + input.ac-in + button.ac-ojo)
         · p.ac-error · button.ac-btn · .ac-fila · p.ac-pie </div><i class="ac-pico ac-pico-a"></i><i class="ac-pico ac-pico-b"></i></section>
     </div>
   Pantalla de código (clara): body.ac.ac-claro > .ac-caja > section.ac-otp > .ac-otp-icono · h1 · p · .ac-cifras>(label.ac-cifra>input+i) · …
   Estados de .ac-otp: .es-verificando · .es-listo · .es-error */
.ac{--ac-azul:#0B3C5D;--ac-azul2:#08314D;--ac-turq:#17B3A6;--ac-turq2:#3FCBBE;--ac-turq-tinta:#107D74;--ac-coral:#E8573A;--ac-ok:#0E7A5F;--ac-error:#B42318;--ac-gris:#9EC3D6;--ac-gris2:#6F8C9F;--ac-curva:cubic-bezier(.23,1,.32,1);
  margin:0;min-height:100dvh;background:#fff;color:#1D2329;font-family:Inter,system-ui,sans-serif;-webkit-tap-highlight-color:transparent}
/* v7.5b · En el panel, el lienzo gris del panel no pisa el fondo blanco del acceso */
body.pn.ac{background:#fff;color:#1D2329}
.ac *{box-sizing:border-box}
.ac-caja{position:relative;z-index:1;width:100%;max-width:440px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;gap:22px;padding:max(28px,env(safe-area-inset-top)) 16px max(22px,env(safe-area-inset-bottom))}
.ac-cab{display:flex;align-items:center;justify-content:flex-end;min-height:36px}
.ac-rol{font:500 12px Inter,sans-serif;color:#55606B;border:1px solid #E1D6C4;border-radius:999px;padding:6px 12px}
.ac-cristal{position:relative;margin-top:clamp(6px,2.5vh,28px);color:#fff;filter:drop-shadow(0 28px 40px rgba(8,49,77,.35))}
.ac-cristal::before{content:"";position:absolute;inset:0;clip-path:polygon(34px 0,100% 0,100% calc(100% - 34px),calc(100% - 34px) 100%,0 100%,0 34px);background:linear-gradient(150deg,rgba(160,215,235,.55),rgba(160,215,235,.08) 30%,rgba(160,215,235,.05) 70%,rgba(63,203,190,.6))}
.ac-cristal-in{position:relative;margin:1px;clip-path:polygon(33px 0,100% 0,100% calc(100% - 33px),calc(100% - 33px) 100%,0 100%,0 33px);background:linear-gradient(160deg,rgba(23,62,88,.8),rgba(6,26,42,.9));-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);padding:28px 20px 18px;display:flex;flex-direction:column;gap:14px}
.ac-pico{position:absolute;width:26px;height:26px;pointer-events:none}
.ac-pico-a{left:-8px;top:-8px;clip-path:polygon(0 100%,100% 0,0 0);background:linear-gradient(135deg,rgba(160,215,235,.5),rgba(160,215,235,.1))}
.ac-pico-b{right:-8px;bottom:-8px;clip-path:polygon(100% 0,100% 100%,0 100%);background:linear-gradient(315deg,rgba(63,203,190,.6),rgba(63,203,190,.1))}
.ac-tit{margin:0;color:#fff;font:700 26px/1.15 Poppins,sans-serif;letter-spacing:-.01em}
.ac-acento{color:var(--ac-turq2)}
.ac-sub{margin:6px 0 0;color:var(--ac-gris);font-size:14px;line-height:1.45}
.ac-campo{display:flex;flex-direction:column;gap:6px}
.ac-campo label{font-size:13px;font-weight:500;color:#DCE9F0}
.ac-entrada{position:relative;display:flex;align-items:center}
.ac-ic{position:absolute;left:13px;width:16px;height:16px;fill:none;stroke:var(--ac-gris2);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.ac .ac-entrada .ac-in{width:100%;height:48px;border-radius:10px;border:1px solid rgba(160,205,225,.16);background:rgba(4,22,36,.5);color:#fff;padding:0 44px 0 40px;font:500 16px Inter,sans-serif;outline:none;transition:border-color .2s,box-shadow .2s}
.ac .ac-entrada .ac-in::placeholder{color:var(--ac-gris2)}
.ac .ac-entrada .ac-in:focus{border-color:var(--ac-turq2);box-shadow:0 0 0 3px rgba(63,203,190,.2)}
.ac .ac-entrada .ac-in[aria-invalid=true]{border-color:#FF8A70}
.ac-ojo{position:absolute;right:2px;width:44px;height:44px;border:0;background:none;color:var(--ac-gris2);cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:10px}
.ac-ojo svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ac-ojo[aria-pressed=true]{color:var(--ac-turq2)}
.ac-fila{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.ac-enl{background:none;border:0;padding:12px 0;min-height:44px;color:var(--ac-gris);font:500 13px Inter,sans-serif;cursor:pointer;text-decoration:none}
.ac-enl:hover,.ac-enl:focus-visible{color:#fff}
.ac-btn{height:50px;width:100%;border:0;border-radius:10px;background:linear-gradient(180deg,var(--ac-turq2),var(--ac-turq));color:#05283A;font:600 16px Poppins,sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 10px 26px -10px rgba(63,203,190,.95),inset 0 1px 0 rgba(255,255,255,.45);transition:transform .16s var(--ac-curva),opacity .2s}
.ac-btn:active{transform:scale(.97)}
.ac-btn[disabled]{opacity:.75;cursor:progress}
.ac-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ac-giro{width:16px;height:16px;border-radius:50%;border:2px solid rgba(5,40,58,.3);border-top-color:#05283A;animation:ac-gira .8s linear infinite}
.ac-error{margin:0;min-height:1.2em;color:#FFB4A3;font-size:14px;font-weight:500}
.ac-error:empty{display:none}
.ac-nota{margin:0;padding:12px 14px;border-radius:10px;background:rgba(63,203,190,.1);border:1px solid rgba(63,203,190,.3);color:#DCE9F0;font-size:14px;line-height:1.45}
.ac-pie{margin:2px 0 0;text-align:center;font-size:13px;color:var(--ac-gris)}
.ac-pie a{color:var(--ac-turq2);font-weight:600;text-decoration:none}
.ac-seguro{margin:auto 0 0;display:flex;gap:6px;justify-content:center;align-items:center;color:#55606B;font-size:12px}
.ac-seguro svg{width:14px;height:14px;fill:none;stroke:var(--ac-turq-tinta);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ── Código de verificación (claro, como el vídeo de OTP) ── */
.ac.ac-claro{background:linear-gradient(160deg,#FBF7F0 0%,#F1F7FA 45%,#FDF0EB 100%);color:#1D2329}
.ac.ac-claro .ac-rol{color:#55606B;border-color:#E1D6C4}
.ac-otp{margin-top:clamp(6px,2.5vh,28px);background:rgba(255,255,255,.9);border:1px solid #EFE6D8;border-radius:26px;padding:30px 18px 24px;box-shadow:0 1px 2px rgba(8,49,77,.05),0 24px 50px -24px rgba(8,49,77,.25);display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px;animation:ac-entra .4s var(--ac-curva) both}
.ac-otp-icono{position:relative;width:76px;height:76px}
.ac-otp-icono>span{position:absolute;inset:8px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#fff,#EEF5F8);box-shadow:0 0 0 1px #E3EDF2,0 12px 22px -12px rgba(11,60,93,.45);color:var(--ac-azul);transition:background .3s,box-shadow .3s}
.ac-otp-icono svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ac-otp-icono::after{content:"";position:absolute;inset:0;border-radius:50%;border:2.5px solid transparent;border-top-color:var(--ac-turq);opacity:0;transition:opacity .2s}
.ac-otp.es-verificando .ac-otp-icono::after{opacity:1;animation:ac-gira 1s linear infinite}
.ac-otp.es-listo .ac-otp-icono>span{background:var(--ac-ok);color:#fff;box-shadow:0 0 0 8px #DDF3EC}
.ac-otp.es-error .ac-otp-icono>span{background:#FFF1EC;color:var(--ac-error);box-shadow:0 0 0 1px #F8C9BC,0 10px 20px -10px rgba(180,35,24,.5)}
.ac-otp h1{margin:0;font:700 25px/1.2 Poppins,sans-serif;color:var(--ac-azul);letter-spacing:-.01em}
.ac-otp p.ac-otp-txt{margin:8px 0 0;color:#55606B;font-size:15px;line-height:1.45}
.ac-otp p.ac-otp-txt b{display:block;color:#1D2329;word-break:break-all}
.ac-cifras{display:flex;gap:7px;justify-content:center}
.ac-cifra{position:relative;width:46px;height:58px;border-radius:14px;padding:1.5px;background:linear-gradient(160deg,var(--ac-azul),var(--ac-turq));transition:transform .2s var(--ac-curva),box-shadow .2s}
.ac .ac-cifras .ac-cifra input{width:100%;height:100%;border:0;border-radius:12.5px;background:#fff;text-align:center;font:600 24px Poppins,sans-serif;color:var(--ac-azul);padding:0 0 8px;outline:none;caret-color:var(--ac-turq)}
.ac-cifra i{position:absolute;left:50%;bottom:11px;width:14px;height:2.5px;margin-left:-7px;border-radius:2px;background:var(--ac-turq);pointer-events:none}
.ac-cifra:focus-within{transform:translateY(-3px);box-shadow:0 10px 20px -8px rgba(11,60,93,.45),0 0 0 4px rgba(23,179,166,.16)}
.ac-otp.es-listo .ac-cifra{background:var(--ac-ok)}
.ac-otp.es-listo .ac-cifra input{background:var(--ac-ok);color:#fff}
.ac-otp.es-listo .ac-cifra i{background:rgba(255,255,255,.7)}
.ac-otp.es-error .ac-cifra{background:linear-gradient(180deg,var(--ac-coral),var(--ac-error));animation:ac-tiembla .35s var(--ac-curva)}
.ac-otp.es-error .ac-cifra input{background:#FFF5F2;color:var(--ac-error)}
.ac-otp.es-error .ac-cifra i{background:var(--ac-coral)}
.ac-otp .ac-campo{width:100%;text-align:left}
.ac-otp .ac-campo label{color:#1D2329;font-weight:600}
.ac .ac-otp .ac-entrada .ac-in{background:#FBF7F0;border-color:#E1D6C4;color:#1D2329;padding:0 44px 0 14px}
.ac .ac-otp .ac-entrada .ac-in:focus{border-color:var(--ac-azul);box-shadow:0 0 0 3px rgba(11,60,93,.12);background:#fff}
.ac-otp .ac-ojo{color:#55606B}
.ac-otp .ac-error{color:var(--ac-error);font-weight:600}
.ac-otp .ac-btn{background:linear-gradient(90deg,var(--ac-azul),var(--ac-turq-tinta));color:#fff;border-radius:14px;box-shadow:0 12px 24px -12px rgba(11,60,93,.8)}
.ac-otp .ac-btn .ac-giro{border-color:rgba(255,255,255,.35);border-top-color:#fff}
.ac-otp.es-listo .ac-btn{background:var(--ac-ok);box-shadow:0 12px 24px -12px rgba(14,122,95,.9)}
.ac-otp .ac-enl{color:var(--ac-turq-tinta);font-weight:600}
.ac-otp .ac-reenviar{margin:0;color:#55606B;font-size:14px;display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
.ac-otp .ac-reenviar b{color:var(--ac-azul)}
.ac-giro2{width:14px;height:14px;border-radius:50%;border:2px solid #D6E4EC;border-top-color:var(--ac-azul);animation:ac-gira 1s linear infinite}
@keyframes ac-gira{to{transform:rotate(360deg)}}
@keyframes ac-entra{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes ac-tiembla{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media (max-width:360px){.ac-cifra{width:40px;height:52px}.ac-cifras{gap:5px}}
@media (prefers-reduced-motion:reduce){.ac-otp,.ac-otp.es-error .ac-cifra{animation:none}.ac-giro,.ac-giro2,.ac-otp.es-verificando .ac-otp-icono::after{animation-duration:3s}}
.ac #app,.ac .panel{background:transparent}

/* v7.5b · Firma: el logotipo sale de arriba a la izquierda y va centrado bajo la tarjeta (pedido de Lestter 28-10 17:14) */
.ac-firma{order:0;align-self:center;display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:clamp(4px,3vh,32px);padding:10px 18px;text-decoration:none;border-radius:20px;animation:ac-firma .7s var(--ac-curva) .15s both}
.ac-firma:focus-visible{outline:2px solid var(--ac-turq);outline-offset:4px}
.ac-firma-logo{position:relative;display:block;width:220px;max-width:62vw;aspect-ratio:373.14/94.75}
.ac-firma-logo img{display:block;width:100%;height:100%;filter:drop-shadow(0 10px 18px rgba(11,60,93,.16))}
.ac-firma-logo::after{content:"";position:absolute;inset:0;pointer-events:none;-webkit-mask:url(/assets/marca/logo-color.v1.svg) center/contain no-repeat;mask:url(/assets/marca/logo-color.v1.svg) center/contain no-repeat;background:linear-gradient(105deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.85) 50%,rgba(255,255,255,0) 62%) 160% 0/260% 100% no-repeat;animation:ac-brillo 5.5s var(--ac-curva) 1s infinite}
.ac-firma-lema{display:flex;align-items:center;gap:10px;font:600 11px Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#55606B;white-space:nowrap}
.ac-firma-lema::before,.ac-firma-lema::after{content:"";width:26px;height:1px;background:linear-gradient(90deg,rgba(23,179,166,0),var(--ac-turq))}
.ac-firma-lema::after{background:linear-gradient(90deg,var(--ac-coral),rgba(232,87,58,0))}
.ac-seguro{order:2}
@media (max-width:400px){.ac-firma{max-width:100%;padding:10px 8px}.ac-firma-lema{letter-spacing:.08em;white-space:normal;text-align:center}.ac-firma-lema::before,.ac-firma-lema::after{display:none}}
@keyframes ac-firma{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
@keyframes ac-brillo{0%,70%{background-position:160% 0}100%{background-position:-60% 0}}
@media (prefers-reduced-motion:reduce){.ac-firma{animation:none}.ac-firma-logo::after{animation:none;opacity:0}}
.ac-otp.es-listo .ac-btn[disabled]{opacity:1}