*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
html,body{height:100%}
[hidden]{display:none !important}
body{
  background:linear-gradient(180deg,var(--sky1) 0%,var(--sky2) 100%);
  background-attachment:fixed;
  color:var(--ink);
  font-family:var(--ui);
  font-size:var(--fs-base);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
button,input,select{font-family:inherit;font-size:var(--fs-sm);color:inherit}
button{cursor:pointer;border:none;background:none}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
img,svg{max-width:100%}

.anim{opacity:0;animation:fadeUp .55s cubic-bezier(.22,.9,.3,1) forwards}

.stage{display:none;min-height:100%}
.stage.on{display:block;animation:fadeIn .35s ease}

.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand__logo{height:44px;display:block;flex:none}
.brand__txt{min-width:0}
.brand__txt b{display:block;font-size:var(--fs-md);font-weight:800;
  letter-spacing:-.01em;white-space:nowrap}
.brand__txt span{display:block;font-size:var(--fs-xs);color:var(--mute)}

.field{margin-bottom:14px}
.field label{display:block;font-size:var(--fs-sm);font-weight:600;
  color:var(--ink2);margin-bottom:7px}
.field input{width:100%;background:#F8FAFF;border:1.5px solid var(--line);
  border-radius:14px;padding:13px 15px;font-size:var(--fs-base);
  min-height:var(--tap);transition:border-color .18s,box-shadow .18s}
.field input:focus{outline:none;border-color:var(--blue);
  box-shadow:0 0 0 4px rgba(37,99,235,.12)}
.field input::placeholder{color:#93AACF}

.ghost{padding:10px 16px;border-radius:var(--radiusSm);
  border:1.5px solid var(--line);font-size:var(--fs-sm);font-weight:600;
  color:var(--ink2);min-height:var(--tap);
  transition:border-color .18s,color .18s,transform .18s,background .18s}
.ghost:hover{border-color:var(--blue);color:var(--blue);background:var(--blueLite);
  transform:translateY(-1px)}
.ghost:disabled{opacity:.55;cursor:progress}

.msg{margin-top:15px;padding:12px 14px;border-radius:var(--radiusSm);
  font-size:var(--fs-sm);background:#FEF2F2;border:1px solid #FECACA;
  color:#991B1B;white-space:pre-line;display:none;animation:fadeUp .3s ease}
.msg.on{display:block}

.void{padding:52px 16px;text-align:center;color:var(--mute);font-size:var(--fs-sm)}
.void b{display:block;color:var(--ink);font-weight:700;margin-bottom:6px;
  font-size:var(--fs-md)}

.load{position:fixed;inset:0;background:rgba(219,234,254,.9);
  backdrop-filter:blur(5px);z-index:60;display:none;place-items:center;padding:20px}
.load.on{display:grid;animation:fadeIn .25s ease}
.load__box{width:min(400px,100%);background:#fff;border-radius:var(--radius);
  padding:28px 30px;box-shadow:var(--shadowUp);text-align:center;
  animation:pop .4s ease both}
.load__box svg{height:40px;margin-bottom:16px}
.load__box p{font-size:var(--fs-md);font-weight:600;margin-bottom:14px}
.load__box small{display:block;color:var(--mute);font-size:var(--fs-xs);
  margin-top:11px;font-family:var(--data);min-height:16px}
.meter{height:8px;background:#E7EFFC;border-radius:5px;overflow:hidden}
.meter i{display:block;height:100%;width:0;border-radius:5px;
  background:linear-gradient(90deg,#60A5FA,var(--blue));transition:width .3s ease}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .anim,tbody tr{opacity:1!important}
}