/* Rilayer — vista di accesso (J2). Identità BlackHole: pannello tecnico, angoli tagliati. */
#auth-modal { padding: 0; border: 0; background: transparent; width: min(440px, calc(100vw - 24px)); max-width: none; overflow: visible; color: #e5e7eb; }
#auth-modal::backdrop { background: rgba(5,5,5,.78); backdrop-filter: blur(6px); }
#auth-modal .h5-auth-card {
  position: relative; box-sizing: border-box; width: 100%; max-height: calc(100dvh - 24px); overflow-y: auto; overflow-x: hidden;
  padding: 32px 28px 28px; background: rgba(13,13,19,.94); border: 1px solid rgba(255,255,255,.1);
  clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px));
  display: flex; flex-direction: column; gap: 20px; font-family: 'Rajdhani', sans-serif;
}
#auth-modal .h5-auth-close {
  position: absolute; top: 10px; right: 26px; width: 44px; height: 44px; padding: 0; margin: 0; display: grid; place-items: center;
  background: transparent; border: 0; border-radius: 0; box-shadow: none; color: #9ca3af; font: 400 26px/1 'Rajdhani', sans-serif; cursor: pointer;
}
#auth-modal .h5-auth-close:hover { color: #e5e7eb; background: transparent; }
#auth-modal .h5-auth-header { display: flex; flex-direction: column; gap: 6px; padding-right: 40px; }
#auth-modal .h5-auth-title {
  margin: 0; font: 800 20px/1.2 'Orbitron', sans-serif; letter-spacing: .14em; text-transform: uppercase;
  background: linear-gradient(90deg, #8a2387, #e94057, #f27121); -webkit-background-clip: text; background-clip: text; color: transparent;
}
#auth-modal .h5-auth-desc { margin: 0; color: #9ca3af; font-size: 16px; line-height: 1.4; }

/* Schede */
#auth-modal .h5-auth-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-bottom: 1px solid rgba(255,255,255,.1); margin: 0; }
#auth-modal .h5-auth-tab {
  min-height: 44px; margin: 0 0 -1px; padding: 0 8px; background: transparent !important; border: 0; border-bottom: 2px solid transparent; border-radius: 0; box-shadow: none; clip-path: none;
  font: 700 12px/1 'Orbitron', sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #9ca3af !important; cursor: pointer;
}
#auth-modal .h5-auth-tab[aria-selected="true"] { color: #f27121 !important; border-bottom-color: #f27121; }
#auth-modal .h5-auth-tab:hover { color: #e5e7eb !important; }

/* Form */
#auth-modal .h5-auth-form { display: flex; flex-direction: column; gap: 16px; margin: 0; padding: 4px 0 0; border: 0; }
#auth-modal .h5-auth-form[hidden] { display: none; }
#auth-modal .h5-auth-form label { display: flex; flex-direction: column; gap: 6px; margin: 0; }
#auth-modal .au-label { font: 700 11px/1 'Orbitron', sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #9ca3af; }
#auth-modal .h5-auth-form input {
  box-sizing: border-box; width: 100%; min-height: 46px; margin: 0; padding: 0 14px; background: rgba(255,255,255,.04); color: #e5e7eb;
  border: 1px solid rgba(255,255,255,.14); border-radius: 0; font: 500 17px/1 'Rajdhani', sans-serif;
}
#auth-modal .h5-auth-form input::placeholder { color: #6b7280; }
#auth-modal .h5-auth-form input:hover { border-color: rgba(255,255,255,.28); }
#auth-modal .h5-auth-form input[aria-invalid="true"] { border-color: #e94057; }
#auth-modal .au-err { min-height: 0; font-size: 15px; line-height: 1.3; font-weight: 600; color: #e94057; }
#auth-modal .au-err:empty { display: none; }
#auth-modal .h5-auth-msg { margin: 0; font-size: 15px; line-height: 1.4; font-weight: 600; color: #9ca3af; }
#auth-modal .h5-auth-msg[hidden] { display: none; }
#auth-modal .h5-auth-msg.au-msg-err { color: #e94057 !important; }
#auth-modal .h5-auth-form .h5-auth-msg { margin-top: -6px; }

/* Pulsanti */
#auth-modal .h5-auth-submit {
  position: relative; width: 100%; min-height: 48px; margin: 4px 0 0; padding: 0 18px; border: 0; border-radius: 0; cursor: pointer;
  background: linear-gradient(90deg, #8a2387, #e94057, #f27121); color: #fff; font: 800 13px/1 'Orbitron', sans-serif; letter-spacing: .18em; text-transform: uppercase;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px)); box-shadow: none;
  transition: filter .16s ease-out, transform .16s ease-out;
}
#auth-modal .h5-auth-submit:hover:not(:disabled) { filter: brightness(1.12); }
#auth-modal .h5-auth-submit:active:not(:disabled) { transform: translateY(1px); }
#auth-modal .h5-auth-submit:disabled { cursor: progress; filter: saturate(.7) brightness(.85); }
#auth-modal .h5-auth-submit.au-busy::after {
  content: ''; display: inline-block; width: 12px; height: 12px; margin-left: 10px; vertical-align: -2px;
  border: 2px solid rgba(255,255,255,.35); border-top-color: #fff; border-radius: 50%; animation: au-spin .7s linear infinite;
}
@keyframes au-spin { to { transform: rotate(360deg); } }

#auth-modal .h5-auth-sep { display: flex; align-items: center; gap: 12px; margin: 0; }
#auth-modal .h5-auth-sep-line { flex: 1; height: 1px; background: rgba(255,255,255,.1); }
#auth-modal .h5-auth-sep-text { font: 700 11px/1 'Orbitron', sans-serif; letter-spacing: .2em; text-transform: uppercase; color: #9ca3af; }
#auth-modal .h5-google-btn {
  display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 48px; margin: 0; padding: 0 18px; cursor: pointer;
  background: rgba(255,255,255,.04) !important; color: #e5e7eb !important; border: 1px solid rgba(255,255,255,.18); border-radius: 0; box-shadow: none;
  font: 700 16px/1 'Rajdhani', sans-serif; letter-spacing: .04em; transition: border-color .16s ease-out, background .16s ease-out;
}
#auth-modal .h5-google-btn:hover { border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.08) !important; }

/* Focus visibile sempre */
#auth-modal :is(button, input):focus-visible { outline: 2px solid #f27121; outline-offset: 2px; }
#auth-modal .h5-auth-form input:focus { border-color: #f27121; outline: 2px solid rgba(242,113,33,.35); outline-offset: 0; }

@media (max-width: 420px) {
  #auth-modal .h5-auth-card { padding: 28px 18px 22px; }
  #auth-modal .h5-auth-close { right: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  #auth-modal .h5-auth-submit.au-busy::after { animation-duration: 2s; }
  #auth-modal * { transition: none !important; }
}