/* ZEED Music — Auth pages (register / login) */
.auth-wrap{
  min-height:100vh; display:grid; place-items:center; padding:24px;
}
.auth-card{
  width:100%; max-width:420px; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r-lg);
  padding:32px 28px; box-shadow:0 20px 60px -20px rgba(0,0,0,.6);
}
.auth-logo{display:flex; align-items:center; gap:10px; margin-bottom:6px}
.auth-logo .m{width:34px; height:34px; border-radius:9px; background:var(--zeed-grad);
  display:grid; place-items:center; box-shadow:var(--zeed-glow)}
.auth-logo .m svg{width:18px; height:18px}
.auth-logo b{font-size:22px; font-weight:800; letter-spacing:-.5px}
.auth-card h1{font-size:22px; font-weight:800; letter-spacing:-.4px; margin:14px 0 4px}
.auth-card .sub{color:var(--tx-2); font-size:13px; margin-bottom:22px}

.field{margin-bottom:15px}
.field label{display:block; font-size:12.5px; font-weight:600; color:var(--tx-2); margin-bottom:6px}
.field input{
  width:100%; background:var(--ink-2); border:1px solid var(--line-2);
  border-radius:var(--r-sm); padding:12px 13px; color:var(--tx);
  font-family:var(--fs); font-size:14px;
}
.field input:focus{outline:2px solid var(--zeed); outline-offset:1px; border-color:transparent}
.field .err{display:block; color:#ff6b7a; font-size:12px; margin-top:5px}

/* role toggle */
.role-toggle{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:18px}
.role-opt{position:relative}
.role-opt input{position:absolute; opacity:0; inset:0; cursor:pointer}
.role-opt .box{
  border:1.5px solid var(--line-2); border-radius:var(--r-md); padding:14px 12px;
  text-align:center; cursor:pointer; transition:.15s;
}
.role-opt .box .ic{font-size:22px; line-height:1}
.role-opt .box b{display:block; font-size:14px; font-weight:700; margin-top:6px}
.role-opt .box small{display:block; color:var(--tx-3); font-size:11px; margin-top:2px}
.role-opt input:checked + .box{
  border-color:var(--zeed); background:rgba(255,45,66,.08);
  box-shadow:0 0 0 3px rgba(255,45,66,.12);
}
.role-opt input:focus-visible + .box{outline:2px solid var(--zeed); outline-offset:2px}

.btn-primary{
  width:100%; border:0; cursor:pointer; color:#fff; font-family:var(--fs);
  font-weight:700; font-size:15px; padding:13px; border-radius:var(--r-sm);
  background:var(--zeed-grad); box-shadow:var(--zeed-glow); margin-top:4px;
}
.btn-primary:hover{filter:brightness(1.05)}
.auth-alt{text-align:center; color:var(--tx-2); font-size:13px; margin-top:18px}
.auth-alt a{color:var(--zeed); font-weight:600; text-decoration:none}
.flash-ok{background:rgba(46,204,113,.12); border:1px solid rgba(46,204,113,.3);
  color:#7ee2a8; padding:10px 12px; border-radius:var(--r-sm); font-size:13px; margin-bottom:16px}