*{box-sizing:border-box}
:root{--cyan:#5af7ff;--blue:#357bff;--violet:#a855f7;--ink:#050812}
html,body{margin:0;min-height:100%;background:var(--ink);color:#f3fbff;font-family:Inter,Arial,sans-serif}
body{min-height:100vh;overflow:hidden;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 42%,#101d36 0%,#080d1c 36%,#03050b 76%)}
button,input{font:inherit}button{cursor:pointer}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.045;z-index:5;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}
.scene-glow{position:fixed;width:48vw;height:48vw;border-radius:50%;filter:blur(90px);opacity:.12;pointer-events:none;animation:breathe 7s ease-in-out infinite alternate}.glow-a{background:#006dff;left:-15vw;top:-20vw}.glow-b{background:#9b00ff;right:-18vw;bottom:-24vw;animation-delay:-3s}
.grid-floor{position:fixed;left:-25%;right:-25%;bottom:-30%;height:65%;opacity:.16;transform:perspective(350px) rotateX(63deg);transform-origin:top;background-image:linear-gradient(#2868a5 1px,transparent 1px),linear-gradient(90deg,#2868a5 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(transparent,#000)}
.stage{position:relative;width:min(100vw,900px);height:min(100vh,820px);min-height:650px;display:grid;place-items:center;isolation:isolate}
.login-shell{position:relative;width:510px;height:510px;display:grid;place-items:center;animation:float 6s ease-in-out infinite;filter:drop-shadow(0 0 35px #087dff20)}
.ring{position:absolute;border-radius:50%;pointer-events:none}.ring-back{inset:0;border:1px solid #254f83;box-shadow:inset 0 0 24px #007bff14,0 0 28px #006dff15;animation:rotate 28s linear infinite}.ring-back:before,.ring-back:after{content:"";position:absolute;border-radius:50%;inset:12px;border:1px dashed #2879b8;opacity:.45}.ring-back:after{inset:27px;border:1px solid #173b64;opacity:.7}
.ring-front{inset:7px;border:2px solid transparent;background:conic-gradient(from 0deg,transparent 0 18%,var(--cyan) 22%,#237cff 28%,transparent 35% 58%,#a855f7 66%,transparent 73% 100%) border-box;mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);-webkit-mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;filter:drop-shadow(0 0 8px #35eaff);animation:rotate 8s linear infinite}
.ring-core{position:absolute;inset:30px;border-radius:50%;border:1px solid #2a6a9b;box-shadow:0 0 18px #009dff18,inset 0 0 30px #006dff10}.ring-core:before{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid #41efff30;animation:pulse 3.2s ease-out infinite}
.panel{position:relative;z-index:2;width:340px;padding:34px 30px 23px;background:linear-gradient(145deg,#0b1729ef,#080d19f5 55%,#111025f2);border:1px solid #3bdffb55;border-radius:22px;box-shadow:0 0 0 1px #3978ff17,inset 0 1px 0 #ffffff12,0 0 28px #00cfff18,0 18px 55px #000b;overflow:hidden}.panel:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,#47edff0c,transparent 32%,transparent 72%,#9d4dff0b)}
.top-mark{display:flex;align-items:center;gap:8px;font:500 8px Orbitron,sans-serif;letter-spacing:2px;color:#82dff6;white-space:nowrap}.mark-dot{width:5px;height:5px;background:var(--cyan);border-radius:50%;box-shadow:0 0 9px var(--cyan);animation:blink 1.5s steps(2) infinite}.mark-line{height:1px;flex:1;background:linear-gradient(90deg,#2c9eb8,transparent);margin-left:4px}
.logo-symbol{height:35px;width:35px;margin:22px auto 9px;position:relative;display:flex;justify-content:center;align-items:center;gap:3px;transform:skew(-15deg)}.logo-symbol span{width:5px;border:1px solid var(--cyan);background:#48edff40;box-shadow:0 0 9px #29e9ff;border-radius:2px;animation:equalize 1s ease-in-out infinite alternate}.logo-symbol span:nth-child(1){height:15px}.logo-symbol span:nth-child(2){height:29px;animation-delay:.25s}.logo-symbol span:nth-child(3){height:21px;animation-delay:.5s}
.eyebrow{text-align:center;margin:0 0 8px;font:500 8px Orbitron,sans-serif;letter-spacing:3px;color:#7da8c7}.eyebrow i{display:inline-block;width:4px;height:4px;border-radius:50%;background:#56ffb5;box-shadow:0 0 8px #56ffb5;vertical-align:middle;margin-left:4px}
h1{font:700 27px Orbitron,sans-serif;text-align:center;letter-spacing:2px;margin:0;text-shadow:0 0 18px #5aeaff42}h1 span{color:var(--cyan);text-shadow:0 0 14px #5af7ff}.subtitle{text-align:center;font-size:10px;color:#8ca0ba;margin:9px 0 25px;letter-spacing:.3px}
.field{height:43px;display:flex;align-items:center;position:relative;margin:0 0 14px;border:1px solid #29415e;border-radius:7px;background:#03091488;transition:border-color .25s,box-shadow .25s,transform .25s}.field:focus-within{border-color:#49e9ff;box-shadow:0 0 0 3px #2deaff12,0 0 18px #00d9ff16;transform:translateY(-1px)}.field-icon{width:38px;text-align:center;color:#57d9f6;font-size:16px;text-shadow:0 0 8px #00baff80}.field input{width:100%;height:100%;min-width:0;border:0;outline:0;background:transparent;color:#e9fbff;font-size:11px;padding:0 8px 0 0}.field input::placeholder{color:#60758e;letter-spacing:.3px}.field-underline{position:absolute;bottom:-1px;left:15%;width:0;height:1px;background:var(--cyan);box-shadow:0 0 8px var(--cyan);transition:width .35s}.field:focus-within .field-underline{width:70%}.eye{border:0;background:transparent;color:#668aa8;padding:7px 10px;font-size:13px}
.form-options{display:flex;align-items:center;justify-content:space-between;margin:3px 0 20px;font-size:9px;color:#91a5bb}.remember{display:flex;align-items:center;gap:7px;cursor:pointer}.remember input{position:absolute;opacity:0}.fake-check{width:12px;height:12px;border:1px solid #42607a;border-radius:3px;display:inline-grid;place-items:center;transition:.2s}.remember input:checked+.fake-check{background:var(--cyan);border-color:var(--cyan);box-shadow:0 0 10px #44eaff70}.remember input:checked+.fake-check:after{content:"✓";font-size:9px;color:#04101c;font-weight:800}
.text-link,.switch-copy button{border:0;background:transparent;color:var(--cyan);font-size:9px;padding:0}.text-link:hover,.switch-copy button:hover{color:#fff;text-shadow:0 0 10px var(--cyan)}
.submit-btn{position:relative;isolation:isolate;overflow:hidden;width:100%;height:43px;border:1px solid #6df6ff;background:linear-gradient(100deg,#0878a8,#1453a5 48%,#5425a2);border-radius:6px;color:white;font:700 11px Orbitron,sans-serif;letter-spacing:2px;box-shadow:0 0 15px #00bfff35,inset 0 1px #ffffff40;transition:transform .2s,box-shadow .2s}.submit-btn:hover{transform:translateY(-2px);box-shadow:0 0 26px #00d9ff58,inset 0 1px #ffffff65}.submit-btn:active{transform:translateY(0) scale(.99)}.btn-label{position:relative;z-index:2}.btn-arrow{position:absolute;right:15px;top:12px;z-index:2;font-size:15px;line-height:15px}.btn-sheen{position:absolute;z-index:1;top:-50%;left:-50%;width:35%;height:200%;transform:rotate(24deg);background:linear-gradient(90deg,transparent,#ffffff65,transparent);animation:sheen 3.4s ease-in-out infinite}.submit-btn.loading .btn-label{font-size:0}.submit-btn.loading .btn-label:after{content:"VERIFICANDO ACCESO";font-size:9px}.submit-btn.loading .btn-arrow{display:none}.submit-btn.loading:after{content:"";position:absolute;z-index:3;left:calc(50% - 55px);top:13px;width:14px;height:14px;border:2px solid #ffffff45;border-top-color:#fff;border-radius:50%;animation:rotate .65s linear infinite}
.switch-copy{text-align:center;font-size:9px;color:#6f849e;margin:18px 0 23px}.switch-copy button{font-weight:600;margin-left:4px}.bottom-status{border-top:1px solid #23354a;padding-top:13px;display:flex;align-items:center;gap:7px;font:500 7px Orbitron,sans-serif;letter-spacing:1px;color:#63829b}.status-ring{width:6px;height:6px;border:1px solid #5af7ff;border-radius:50%;box-shadow:0 0 7px #5af7ff}.status-code{margin-left:auto;color:#41637f}
.orbit{position:absolute;border-radius:50%;pointer-events:none;border:1px solid #54b9ff1b}.orbit-one{width:620px;height:620px;border-style:dashed;animation:rotate 65s linear infinite}.orbit-two{width:700px;height:700px;border-color:#b35dff16;animation:rotate-reverse 90s linear infinite}.orbit-three{width:790px;height:790px;border-color:#2e8eff10;box-shadow:0 0 80px #1465ff06 inset;animation:rotate 110s linear infinite}.side-label{position:absolute;top:50%;writing-mode:vertical-rl;transform:translateY(-50%);font:500 8px Orbitron,sans-serif;letter-spacing:3px;color:#4c7899;opacity:.75}.side-label span{color:#5cefff}.side-left{left:30px;transform:translateY(-50%) rotate(180deg)}.side-right{right:30px}.scan-line{position:absolute;left:15%;right:15%;height:1px;top:16%;opacity:0;background:linear-gradient(90deg,transparent,#55f3ff,transparent);box-shadow:0 0 12px #55f3ff;animation:scan 8s ease-in-out infinite;pointer-events:none}
.toast{position:fixed;z-index:20;bottom:28px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;max-width:calc(100vw - 32px);padding:12px 18px;border:1px solid #48eaff65;border-radius:8px;background:#081626f5;box-shadow:0 0 25px #00cfff25;color:#d9faff;font-size:12px;transition:opacity .25s,transform .25s;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
/* Welcome overlay and confetti */
.welcome-screen{position:fixed;inset:0;z-index:15;display:grid;place-items:center;background:radial-gradient(ellipse at center,#0a1a2deF,#03050bf7 75%);backdrop-filter:blur(12px);opacity:0;visibility:hidden;transition:opacity .45s,visibility .45s;overflow:hidden}.welcome-screen.active{opacity:1;visibility:visible}.welcome-screen canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.welcome-card{position:relative;width:min(430px,calc(100vw - 34px));padding:44px 30px 29px;text-align:center;background:linear-gradient(145deg,#0d1b30ed,#080d1af5 65%,#15102cf0);border:1px solid #54efff80;border-radius:24px;box-shadow:0 0 0 1px #7b57ff20,0 0 45px #00cfff25,0 0 100px #4c35ff18,inset 0 1px #ffffff17;transform:translateY(24px) scale(.94);transition:transform .55s cubic-bezier(.2,.8,.2,1);z-index:2;overflow:hidden}.welcome-screen.active .welcome-card{transform:translateY(0) scale(1)}.welcome-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,#43efff0c,transparent 42%,#a855f70c)}.success-icon{width:72px;height:72px;margin:0 auto 20px;border:1px solid #59f7ff;border-radius:50%;display:grid;place-items:center;color:#03121b;font-size:31px;font-weight:700;background:radial-gradient(circle,#7cffff,#13b5d6 65%,#15558a);box-shadow:0 0 0 8px #43eaff0b,0 0 25px #28edff80,inset 0 0 15px #fff8;animation:successPop .7s cubic-bezier(.2,1.6,.4,1) both}.welcome-eyebrow{display:flex;align-items:center;justify-content:center;gap:10px;color:#6fffd1;font:600 9px Orbitron,sans-serif;letter-spacing:2.2px;margin:0 0 23px}.welcome-eyebrow i{width:18px;height:1px;background:linear-gradient(90deg,transparent,#65ffcc)}.welcome-eyebrow i:last-child{transform:rotate(180deg)}.welcome-kicker{font:500 9px Orbitron,sans-serif;letter-spacing:4px;color:#7896b7;margin:0 0 10px}.welcome-card h2{font:700 clamp(22px,5vw,31px) Orbitron,sans-serif;line-height:1.35;margin:0 0 12px;overflow-wrap:anywhere;text-shadow:0 0 22px #55dfff45}.welcome-card h2 span{color:var(--cyan);text-shadow:0 0 18px #4deeff90}.welcome-message{font-size:12px;color:#9aadc3;margin:0 0 28px}.welcome-progress{height:2px;background:#25364d;border-radius:10px;overflow:hidden;margin:0 10px 15px}.welcome-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#36b8ff,#5af7ff,#bb73ff);box-shadow:0 0 10px #5af7ff;animation:progressFill 2.8s ease-out .3s forwards}.welcome-footer{display:flex;justify-content:center;align-items:center;gap:8px;color:#6689a8;font:500 7px Orbitron,sans-serif;letter-spacing:1.5px;margin:0 0 24px}.welcome-footer .status-ring{background:#59ffc5;border-color:#59ffc5;box-shadow:0 0 8px #59ffc5;animation:blink 1s infinite}.continue-btn{width:100%;height:42px;border:1px solid #54e9ff;background:linear-gradient(100deg,#096b93,#174ba0,#4e278b);border-radius:7px;color:white;font:700 10px Orbitron,sans-serif;letter-spacing:2px;box-shadow:0 0 20px #00cfff22;transition:.25s}.continue-btn:hover{box-shadow:0 0 28px #00dfff55;transform:translateY(-2px)}.continue-btn span{margin-left:12px;font-size:15px}
.welcome-orbit{position:absolute;width:min(82vw,650px);aspect-ratio:1;border:1px solid #45dcff20;border-radius:50%;animation:rotate 24s linear infinite}.welcome-orbit:before,.welcome-orbit:after{content:"";position:absolute;inset:18px;border:1px dashed #7d65ff33;border-radius:50%}.welcome-orbit:after{inset:42px;border-style:solid;border-color:#35cfff18}.orbit-inner{width:min(66vw,510px);border-color:#b46bff25;animation:rotate-reverse 30s linear infinite}

/* Fingerprint verification screen */
.verify-screen{position:fixed;inset:0;z-index:14;display:grid;place-items:center;background:radial-gradient(ellipse at center,#0b2034f5,#03050bf9 72%);backdrop-filter:blur(12px);opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s;overflow:hidden}
.verify-screen.active{opacity:1;visibility:visible}
.verify-card{position:relative;width:min(390px,calc(100vw - 34px));padding:30px 28px 27px;text-align:center;background:linear-gradient(145deg,#0c1b2def,#080d19f5 65%,#111027f2);border:1px solid #38dfff65;border-radius:22px;box-shadow:0 0 45px #00cfff19,inset 0 1px #ffffff12;transform:translateY(16px) scale(.97);transition:transform .4s ease;overflow:hidden}
.verify-screen.active .verify-card{transform:translateY(0) scale(1)}
.verify-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,#4af3ff0c,transparent 45%,#a855f70c)}
.fingerprint-wrap{position:relative;width:170px;height:210px;margin:0 auto 15px;display:grid;place-items:center;filter:drop-shadow(0 0 13px #22dcff55)}
.fingerprint-image{display:block;width:100%;height:100%;object-fit:contain;opacity:.92;animation:fingerprintPulse 1.8s ease-in-out infinite;position:relative;z-index:1}
.fingerprint-scan{position:absolute;z-index:2;left:0;right:0;top:8%;height:2px;background:linear-gradient(90deg,transparent,#8affff 18%,#ffffff 50%,#4df7ff 82%,transparent);box-shadow:0 0 9px #4cf6ff,0 0 22px #1ccfff;animation:fingerprintScan 1.65s ease-in-out infinite}
.fingerprint-ripple{position:absolute;inset:7px;border:1px solid #42edff40;border-radius:45%;animation:fingerprintRipple 2s ease-out infinite}
.verify-title{position:relative;margin:5px 0 8px;color:#65f5ff;font:700 12px Orbitron,sans-serif;letter-spacing:2px;text-shadow:0 0 12px #2beaff5c}
.verify-subtitle{position:relative;margin:0 0 23px;color:#92a9c1;font-size:11px}
.verify-progress{position:relative;height:2px;border-radius:10px;background:#20354d;overflow:hidden;margin:0 0 14px}
.verify-progress span{display:block;width:32%;height:100%;background:linear-gradient(90deg,#31baff,#5af7ff,#b45cff);box-shadow:0 0 10px #5af7ff;animation:verifyProgress 1.6s ease-in-out infinite}
.verify-status{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;color:#688ba7;font:500 7px Orbitron,sans-serif;letter-spacing:1.5px}
.verify-status i{width:5px;height:5px;border-radius:50%;background:#5af7ff;box-shadow:0 0 8px #5af7ff;animation:blink .8s steps(2) infinite}
.verify-halo{position:absolute;width:min(80vw,600px);aspect-ratio:1;border:1px solid #38cfff17;border-radius:50%;box-shadow:0 0 70px #0d71ff0b inset;animation:rotate 35s linear infinite}
.verify-halo:before,.verify-halo:after{content:"";position:absolute;inset:24px;border:1px dashed #a855f725;border-radius:50%}.verify-halo:after{inset:55px;border-style:solid;border-color:#4beeff15}
@keyframes fingerprintScan{0%{top:8%;opacity:0}12%{opacity:1}85%{opacity:1}100%{top:91%;opacity:0}}
@keyframes fingerprintPulse{0%,100%{opacity:.75;transform:scale(.98)}50%{opacity:1;transform:scale(1.02)}}
@keyframes fingerprintRipple{0%{transform:scale(.94);opacity:.65}100%{transform:scale(1.08);opacity:0}}
@keyframes verifyProgress{0%{transform:translateX(-120%)}100%{transform:translateX(420%)}}

@keyframes rotate{to{transform:rotate(360deg)}}@keyframes rotate-reverse{to{transform:rotate(-360deg)}}@keyframes pulse{0%{transform:scale(.98);opacity:.8}100%{transform:scale(1.06);opacity:0}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes breathe{from{transform:scale(.9);opacity:.08}to{transform:scale(1.08);opacity:.17}}@keyframes blink{50%{opacity:.25}}@keyframes equalize{to{transform:scaleY(.55);opacity:.65}}@keyframes sheen{0%,15%{left:-50%}55%,100%{left:130%}}@keyframes scan{0%,20%{top:14%;opacity:0}30%{opacity:.65}70%{opacity:.3}90%,100%{top:86%;opacity:0}}@keyframes successPop{0%{transform:scale(.3) rotate(-40deg);opacity:0}70%{transform:scale(1.12) rotate(8deg)}100%{transform:scale(1) rotate(0);opacity:1}}@keyframes progressFill{to{width:100%}}
@media(max-width:620px){.stage{min-height:610px;height:100svh;width:100vw}.login-shell{width:min(92vw,450px);height:min(92vw,450px);min-height:410px}.panel{width:min(78vw,340px);padding:27px 22px 20px}.ring-core{inset:22px}.ring-back:before{inset:9px}.ring-back:after{inset:19px}.ring-front{inset:5px}.orbit-one{width:110vw;height:110vw}.orbit-two{width:125vw;height:125vw}.orbit-three{width:145vw;height:145vw}.side-label{font-size:6px;letter-spacing:2px}.side-left{left:9px}.side-right{right:9px}h1{font-size:24px}.subtitle{margin-bottom:20px}.welcome-card{padding:34px 23px 23px}.success-icon{width:64px;height:64px}}
@media(max-height:700px) and (min-width:621px){.stage{transform:scale(.82)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}


/* Ajuste V4.1: separar la huella del texto de verificación */
.fingerprint-wrap{
  width:150px;
  height:185px;
  margin:0 auto 24px;
  overflow:visible;
}
.fingerprint-image{
  object-fit:contain;
}
.fingerprint-scan{
  left:7%;
  right:7%;
}
.verify-title{
  margin:0 0 10px;
  line-height:1.5;
  position:relative;
  z-index:4;
  padding:2px 0;
  background:linear-gradient(90deg,transparent,#0b1729 12%,#0b1729 88%,transparent);
  text-shadow:0 0 12px #2beaff70;
}
.verify-subtitle{
  position:relative;
  z-index:4;
  margin-bottom:24px;
}
@media(max-width:480px){
  .fingerprint-wrap{width:138px;height:170px;margin-bottom:22px}
  .verify-card{padding:26px 20px 24px}
  .verify-title{font-size:10px;letter-spacing:1.5px}
}

/* V5: español, login únicamente y campos limpios al pegar texto */
.field{overflow:hidden}
.field input{
  color:#eafaff;
  caret-color:#5af7ff;
  font-size:12px;
  line-height:normal;
  padding:0 10px 0 0;
  -webkit-text-fill-color:#eafaff;
  background:transparent;
  appearance:none;
}
.field input:-webkit-autofill,
.field input:-webkit-autofill:hover,
.field input:-webkit-autofill:focus{
  -webkit-text-fill-color:#eafaff;
  caret-color:#5af7ff;
  -webkit-box-shadow:0 0 0 1000px #071323 inset;
  box-shadow:0 0 0 1000px #071323 inset;
  transition:background-color 99999s ease-in-out 0s;
}
.field input::selection{background:#1e7799;color:#fff}
.field input:focus{outline:none}
.form-options{gap:10px}
.text-link{max-width:58%;text-align:right;line-height:1.35}
@media(max-width:390px){.text-link{font-size:8px}.field input{font-size:11px}}

.submit-btn{letter-spacing:1.2px;font-size:10px}


/* V6: diseño móvil centrado, sin desbordamiento */
html,body{width:100%;min-width:0;min-height:100%;overflow-x:hidden}
body{min-height:100svh;overflow-y:auto}
.stage{width:100%;min-height:100svh;height:auto;overflow:hidden;padding:24px 0}
.login-shell{flex-shrink:0}
.welcome-screen,.verify-screen{position:fixed;inset:0;width:100%;height:100%;height:100dvh;overflow:hidden;padding:16px;box-sizing:border-box}
.welcome-screen{align-content:center;justify-items:center}
.verify-screen{align-content:center;justify-items:center}
.welcome-card,.verify-card{max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain}
.welcome-card{margin:auto}
.verify-card{margin:auto}
#confettiCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
@media(max-width:620px){
  body{display:block}
  .stage{min-height:100svh;height:100svh;padding:0;display:grid;place-items:center}
  .login-shell{width:min(94vw,430px);height:min(94vw,430px);min-height:0;max-height:calc(100svh - 24px)}
  .panel{width:min(78vw,340px);max-width:calc(100vw - 82px);padding:24px 18px 19px}
  .top-mark{font-size:7px;letter-spacing:1.5px}
  .field{height:42px}
  .field input{min-width:0;max-width:100%;font-size:12px}
  .form-options{font-size:8px}
  .submit-btn{font-size:9px;letter-spacing:.7px}
  .orbit-one{width:105vw;height:105vw}
  .orbit-two{width:118vw;height:118vw}
  .orbit-three{width:130vw;height:130vw}
  .side-label{display:none}
  .welcome-card{width:min(430px,calc(100vw - 32px));padding:28px 20px 22px}
  .welcome-card h2{font-size:clamp(21px,6vw,29px)}
  .welcome-message{font-size:11px}
  .welcome-footer{font-size:6px;letter-spacing:1px}
  .verify-card{width:min(390px,calc(100vw - 32px));padding:22px 18px}
  .fingerprint-wrap{width:clamp(115px,34vw,145px);height:clamp(145px,43vw,175px);margin-bottom:18px}
  .verify-title{font-size:10px;letter-spacing:1.2px}
  .verify-subtitle{font-size:10px;margin-bottom:18px}
}
@media(max-width:380px){
  .panel{width:calc(100vw - 72px);padding:22px 14px 17px}
  .logo-symbol{margin-top:16px}
  h1{font-size:20px}
  .subtitle{font-size:9px;margin-bottom:17px}
  .field-icon{width:31px}
  .field input{font-size:10px}
  .text-link{font-size:7px}
  .bottom-status{font-size:6px;letter-spacing:.6px}
  .welcome-card{padding:24px 16px 18px}
}