/* V167: premium email input + verification (register) */
.ev{display:flex;flex-direction:column;gap:12px;margin:6px 0 4px}
.pe-field{position:relative;display:flex;align-items:center;gap:12px;min-height:60px;padding:8px 12px;
  border-radius:16px;border:1.5px solid var(--ga-line);background:var(--ga-surface);
  transition:border-color .2s,box-shadow .2s,background .2s;cursor:text}
.pe-field:hover{border-color:var(--ga-line-strong)}
.pe-field.focused{border-color:var(--ga-gold);box-shadow:0 0 0 4px var(--ga-gold-soft)}
.pe-field.valid{border-color:var(--ga-green)}
.pe-field.valid.focused{box-shadow:0 0 0 4px color-mix(in srgb,var(--ga-green) 18%,transparent)}
.pe-field.invalid{border-color:var(--ga-red)}
.pe-icon{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
  color:var(--ga-gold-ink);background:var(--ga-gold-soft);transition:color .2s,background .2s}
.pe-field.valid .pe-icon{color:var(--ga-green);background:color-mix(in srgb,var(--ga-green) 14%,transparent)}
.pe-body{position:relative;flex:1;min-width:0;height:42px}
.pe-label{position:absolute;left:0;top:50%;transform:translateY(-50%);margin:0!important;font-size:15px;
  color:var(--ga-muted);pointer-events:none;transition:top .18s,font-size .18s,color .18s,transform .18s}
.pe-field.focused .pe-label,.pe-field.has-value .pe-label{top:4px;transform:none;font-size:11px;font-weight:600;color:var(--ga-gold-ink)}
.pe-field.valid .pe-label{color:var(--ga-green)}
.pe-input{position:absolute;left:0;right:0;bottom:2px;width:100%!important;height:24px!important;padding:0!important;margin:0!important;
  border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:var(--ga-text);font-size:16px}
.pe-clear,.pe-ok{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  transform:scale(.4);opacity:0;transition:transform .2s cubic-bezier(.3,1.6,.5,1),opacity .2s;pointer-events:none}
.pe-clear{border:0;padding:0;font-size:17px;line-height:1;color:var(--ga-muted);background:color-mix(in srgb,var(--ga-muted) 16%,transparent);cursor:pointer}
.pe-ok{position:absolute;right:12px;color:#fff;background:var(--ga-green)}
.pe-field.has-value:not(.valid) .pe-clear{transform:none;opacity:1;pointer-events:auto}
.pe-field.valid .pe-ok{transform:none;opacity:1}
.pe-quick-label{display:block;font-size:12px;font-weight:600;color:var(--ga-muted);margin-bottom:6px}
.pe-chips{display:flex;flex-wrap:wrap;gap:8px}
.pe-chip{border:1px solid var(--ga-line);background:var(--ga-surface);color:var(--ga-text);font-size:13px;
  padding:7px 12px;border-radius:999px;cursor:pointer;transition:border-color .15s,background .15s,transform .1s}
.pe-chip:hover{border-color:var(--ga-gold)}
.pe-chip:active{transform:scale(.96)}
.pe-chip.active{border-color:var(--ga-gold);background:var(--ga-gold-soft);color:var(--ga-gold-ink)}

.ev-code{padding:14px;border-radius:16px;border:1px solid var(--ga-line);background:color-mix(in srgb,var(--ga-surface) 70%,transparent)}
.ev-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.ev-title{font-weight:600;font-size:14px;color:var(--ga-text)}
.ev-send{border:1px solid var(--ga-gold);background:transparent;color:var(--ga-gold-ink);font-weight:600;font-size:13px;
  padding:7px 14px;border-radius:999px;cursor:pointer;white-space:nowrap;transition:background .15s,opacity .15s}
.ev-send:hover:not(:disabled){background:var(--ga-gold-soft)}
.ev-send:disabled{opacity:.55;cursor:default}
.ev-code .otp{max-width:none}
.ev-verify{position:relative;width:100%;margin-top:10px;height:48px;border:0;border-radius:13px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:15px;color:#fff;
  background:linear-gradient(100deg,#13b9a6 0%,#2f80ed 100%);box-shadow:0 8px 20px rgba(47,128,237,.28);
  transition:transform .12s,filter .2s,box-shadow .2s,opacity .2s}
.ev-verify:hover:not(:disabled){filter:brightness(1.07);box-shadow:0 10px 26px rgba(47,128,237,.36)}
.ev-verify:active:not(:disabled){transform:scale(.985)}
.ev-verify:disabled{opacity:.45;cursor:default;box-shadow:none}
.ev-verify .ev-arrow{transition:transform .2s}
.ev-verify:hover:not(:disabled) .ev-arrow{transform:translateX(3px)}
.ev-spin{display:none;width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;animation:evSpin .7s linear infinite}
.ev-verify.loading .ev-arrow{display:none}
.ev-verify.loading .ev-spin{display:block}
.ev-verify.done{background:var(--ga-green);box-shadow:0 8px 20px color-mix(in srgb,var(--ga-green) 35%,transparent);opacity:1}
.ev-verify.done .ev-arrow{display:none}
.ev-msg{margin-top:8px;font-size:12.5px;color:var(--ga-muted);min-height:18px}
.ev-msg.ok{color:var(--ga-green)}
.ev-msg.err{color:var(--ga-red)}
.ev.verified .otp-boxes span{border-color:var(--ga-green);color:var(--ga-green)}
.ev.error .otp-boxes span{border-color:var(--ga-red)}
.ev.shake .otp-boxes{animation:evShake .4s}
@keyframes evSpin{to{transform:rotate(360deg)}}
@keyframes evShake{0%,100%{transform:none}20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
@media (prefers-reduced-motion:reduce){.ev.shake .otp-boxes,.ev-spin{animation:none}}
/* override global input styles inside the premium field */
html .auth-form .pe-field input.pe-input:not([type=checkbox]),html .auth-form .pe-field input.pe-input:focus{
  background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;
  outline:0!important;padding:0!important;color:var(--ga-text)!important}
html .auth-form .pe-field input.pe-input:-webkit-autofill{-webkit-text-fill-color:var(--ga-text);
  -webkit-box-shadow:0 0 0 100px var(--ga-surface) inset!important}
.pe-label{z-index:1}
html .auth-form .pe-field .pe-label{color:var(--ga-muted)}
html .auth-form .pe-field.focused .pe-label,html .auth-form .pe-field.has-value .pe-label{color:var(--ga-gold-ink)}
html .auth-form .pe-field.valid .pe-label{color:var(--ga-green)}
/* V168: generic premium fields (username / password) */
.auth-form .pe-field + .pe-field{margin-top:2px}
.pe-eye{flex:none;width:34px;height:34px;border:0;border-radius:10px;padding:0;display:grid;place-items:center;cursor:pointer;
  color:var(--ga-muted);background:transparent;transition:color .15s,background .15s}
.pe-eye:hover{color:var(--ga-text);background:color-mix(in srgb,var(--ga-muted) 14%,transparent)}
.pe-eye .eye-off{display:none}
.pe-eye.on .eye-on{display:none}
.pe-eye.on .eye-off{display:block}
.pe-field[data-pf].has-value .pe-icon,.pe-field[data-pf].focused .pe-icon{color:var(--ga-gold-ink)}
.pe-field:has(.pe-input:-webkit-autofill) .pe-label{top:4px;transform:none;font-size:11px;font-weight:600}
