body{
  background:
    radial-gradient(circle at 20% 10%, rgba(64,156,255,.22), transparent 30%),
    radial-gradient(circle at 90% 80%, rgba(108,60,255,.18), transparent 35%),
    #050b16 !important;
  color:#f4f7ff;
}

.pf-card,
.pf-sidebar,
.pf-topbar,
.pf-login-card,
section,
main .pf-card{
  background:rgba(26,38,68,.62) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  box-shadow:0 18px 45px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter:blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(140%) !important;
  border-radius:18px !important;
}

input, button{
  border-radius:10px;
}

input{
  background:rgba(255,255,255,.14) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  color:#fff !important;
}

select{
  color-scheme:dark;
  background-color:#18263e !important;
  border:1px solid rgba(148,190,235,.22) !important;
  color:#eef6ff !important;
}

select option,
select optgroup{
  background:#18263e !important;
  color:#eef6ff !important;
}

button{
  min-height:34px;
  padding:7px 12px;
  background:linear-gradient(135deg,rgba(33,119,190,.2),rgba(52,98,190,.16)) !important;
  border:1px solid rgba(89,181,255,.26) !important;
  color:#e8f3ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 5px 14px rgba(20,92,175,.12) !important;
  backdrop-filter:blur(12px) saturate(125%);
  -webkit-backdrop-filter:blur(12px) saturate(125%);
}

button:hover:not(:disabled){
  background:linear-gradient(135deg,rgba(36,156,224,.3),rgba(52,111,221,.25)) !important;
  border-color:rgba(82,202,255,.48) !important;
  color:#fff !important;
  filter:none !important;
}

button:focus-visible{
  outline:2px solid rgba(56,189,248,.72);
  outline-offset:2px;
}

button:disabled{
  opacity:.52;
  box-shadow:none !important;
  cursor:not-allowed;
}

button.primary,
button.pf-primary,
button[data-variant="primary"],
.pf-login-card button{
  background:linear-gradient(135deg,rgba(56,199,255,.88),rgba(41,135,255,.88)) !important;
  border-color:rgba(125,211,252,.4) !important;
  box-shadow:0 7px 18px rgba(41,135,255,.2) !important;
}

button.danger,
button.cancel,
button[data-variant="danger"]{
  background:rgba(239,68,68,.13) !important;
  border-color:rgba(251,113,133,.28) !important;
  color:#fda4af !important;
}

button.danger:hover:not(:disabled),
button.cancel:hover:not(:disabled),
button[data-variant="danger"]:hover:not(:disabled){
  background:rgba(239,68,68,.2) !important;
  border-color:rgba(251,113,133,.42) !important;
  color:#fecdd3 !important;
}

.pf-login-body{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}

.pf-login-card{
  width:100%;
  max-width:420px;
  padding:28px;
}

.pf-login-card input,
.pf-login-card button{
  display:block;
  width:100%;
  padding:14px;
  margin-top:14px;
}

.pf-login-error{
  padding:12px;
  border-radius:10px;
  background:rgba(255,60,60,.18);
  margin:14px 0;
}