/* ══════════════════════════════════════
   AUTH SCREEN — css/auth.css
══════════════════════════════════════ */
#auth-screen {
  position:fixed; inset:0; z-index:900; display:flex;
  align-items:center; justify-content:center;
  background:var(--bg); overflow:hidden;
}
.auth-orb { position:absolute; border-radius:50%; filter:blur(100px); pointer-events:none; }
.auth-orb.o1 { width:580px; height:580px; background:rgba(59,142,255,.09); top:-200px; left:-180px; animation:drift 14s ease-in-out infinite alternate; }
.auth-orb.o2 { width:380px; height:380px; background:rgba(0,229,160,.06); bottom:-100px; right:-100px; animation:drift 10s ease-in-out infinite alternate; animation-delay:-5s; }
.auth-grid {
  position:absolute; inset:0;
  background-image:linear-gradient(rgba(59,142,255,.024) 1px,transparent 1px),linear-gradient(90deg,rgba(59,142,255,.024) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black,transparent);
}
.auth-card {
  position:relative; z-index:2; width:440px;
  background:var(--s1); border:1px solid var(--b2); border-radius:24px;
  padding:40px; animation:popIn .5s cubic-bezier(.16,1,.3,1) forwards;
  max-height:94vh; overflow-y:auto;
}
.auth-card::-webkit-scrollbar { display:none; }
.auth-logo { display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:6px; }
.auth-logo-mark { width:36px; height:36px; border-radius:10px; background:var(--blue); display:flex; align-items:center; justify-content:center; }
.auth-logo-mark svg { width:18px; height:18px; }
.auth-logo-name { font-size:22px; font-weight:900; letter-spacing:-.6px; }
.auth-logo-name span { color:var(--blue); }
.auth-tagline { text-align:center; font-size:12px; color:var(--m2); margin-bottom:28px; line-height:1.5; }
.auth-tabs { display:flex; background:var(--s2); border-radius:11px; padding:4px; margin-bottom:24px; gap:4px; }
.auth-tab { flex:1; padding:9px; border-radius:8px; text-align:center; font-size:13px; font-weight:700; cursor:pointer; color:var(--m2); border:none; background:transparent; transition:all .2s; }
.auth-tab.active { background:var(--blue); color:#fff; }
.auth-error { background:var(--rd); border:1px solid rgba(255,92,106,.25); border-radius:8px; padding:8px 12px; font-size:12px; color:var(--red); margin-bottom:12px; display:none; }
.auth-error.show { display:block; }
/* Form fields */
.field { margin-bottom:14px; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.field-label { font-size:11px; font-weight:700; color:var(--m3); margin-bottom:5px; display:block; letter-spacing:.04em; }
.field-input {
  width:100%; background:var(--s2); border:1px solid var(--b2);
  border-radius:10px; padding:11px 14px; font-size:14px; color:var(--t); outline:none; transition:border-color .2s;
}
.field-input:focus { border-color:rgba(59,142,255,.5); }
.field-input::placeholder { color:var(--m); }
/* Nicho grid */
.nicho-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.nicho-card { background:var(--s2); border:1px solid var(--b); border-radius:10px; padding:12px 8px; text-align:center; cursor:pointer; transition:all .2s; }
.nicho-card.active { border-color:var(--blue); background:var(--bd); }
.nicho-card .nicho-icon { font-size:22px; margin-bottom:5px; }
.nicho-card .nicho-label { font-size:10px; font-weight:700; color:var(--m3); }
.nicho-card.active .nicho-label { color:var(--blue); }
/* Plan grid */
.plan-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.plan-card { background:var(--s2); border:1px solid var(--b); border-radius:10px; padding:12px; cursor:pointer; transition:all .2s; position:relative; }
.plan-card.active { border-color:var(--blue); background:var(--bd); }
.plan-card.featured { border-color:rgba(59,142,255,.35); }
.plan-card .plan-name { font-size:11px; font-weight:800; margin-bottom:3px; }
.plan-card .plan-price { font-size:17px; font-weight:900; font-family:var(--mo); color:var(--blue); }
.plan-card .plan-price span { font-size:10px; font-weight:400; color:var(--m2); }
.plan-card.active::after { content:'✓'; position:absolute; top:6px; right:8px; font-size:10px; font-weight:700; color:var(--blue); }
/* Buttons */
.btn-auth {
  width:100%; padding:13px; background:var(--blue); color:#fff; border:none;
  border-radius:11px; font-size:15px; font-weight:800; cursor:pointer; transition:all .2s;
  margin-top:6px; display:flex; align-items:center; justify-content:center; gap:8px;
}
.btn-auth:hover { background:var(--blue2); transform:translateY(-1px); box-shadow:0 8px 24px rgba(59,142,255,.35); }
.btn-auth:disabled { opacity:.5; pointer-events:none; }
.btn-demo {
  width:100%; padding:10px; background:transparent; color:var(--m3);
  border:1px solid var(--b2); border-radius:11px; font-size:13px; font-weight:600;
  cursor:pointer; transition:all .15s; margin-top:8px; line-height:1.4;
}
.btn-demo:hover { color:var(--t); border-color:var(--b3); }
.auth-sep  { text-align:center; font-size:11px; color:var(--m2); margin:10px 0; }
.auth-note { text-align:center; font-size:11px; color:var(--m2); margin-top:14px; line-height:1.55; }
.auth-note a { color:var(--blue); text-decoration:none; }
.auth-note a:hover { text-decoration:underline; }