/* ══════════════════ SHARED AUTH TOKENS ══════════════════ */
:root {
  --navy:#0B1340; --navy2:#1A2260; --navy3:#252D6B;
  --gold:#B8891A; --gold-d:#9A7015; --gold-l:#C9A96E;
  --gold-bg:#FDF6E7; --gold-b:#F0D080;
  --green:#15803D; --green-bg:#F0FDF4; --green-b:#86EFAC; --green-m:#22C55E;
  --amber:#B45309; --amber-bg:#FFFBEB; --amber-b:#FDE68A; --amber-m:#F59E0B;
  --red:#DC2626; --red-bg:#FEF2F2; --red-b:#FECACA;
  --blue:#1D4ED8; --blue-bg:#EFF6FF; --blue-b:#BFDBFE;
  --purple:#7C3AED; --purple-bg:#F5F3FF; --purple-b:#DDD6FE;
  --white:#FFFFFF; --s2:#F7F9FD; --s3:#EEF2FB;
  --border:#E2E8F7; --border2:#C8D0E8;
  --t1:#0B1340; --t2:#475569; --t3:#94A3B8;
  --sh-sm:0 2px 8px rgba(11,19,64,.07);
  --sh-md:0 8px 28px rgba(11,19,64,.11);
  --sh-lg:0 20px 56px rgba(11,19,64,.18);
  --sh-xl:0 32px 80px rgba(11,19,64,.26);
}
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; -webkit-tap-highlight-color:transparent; }
html { height:100%; -webkit-text-size-adjust:100%; }
body { font-family:'DM Sans',sans-serif; color:var(--t1); min-height:100vh; overflow-x:hidden; line-height:1.5; }
a { color:inherit; text-decoration:none; }
button, input, select, textarea { font-family:'DM Sans',sans-serif; font-size:inherit; }

/* ══ KEYFRAMES ══ */
@keyframes fadeUp     { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:none} }
@keyframes fadeIn     { from{opacity:0} to{opacity:1} }
@keyframes slideLeft  { from{opacity:0;transform:translateX(40px)} to{opacity:1;transform:none} }
@keyframes slideRight { from{opacity:0;transform:translateX(-40px)} to{opacity:1;transform:none} }
@keyframes slideDown  { from{opacity:0;transform:translateY(-20px)} to{opacity:1;transform:none} }
@keyframes popIn      { 0%{transform:scale(.85);opacity:0} 70%{transform:scale(1.05)} 100%{transform:scale(1);opacity:1} }
@keyframes checkPop   { 0%{transform:scale(0) rotate(-15deg)} 70%{transform:scale(1.2) rotate(3deg)} 100%{transform:scale(1) rotate(0)} }
@keyframes shake      { 0%,100%{transform:translateX(0)} 20%{transform:translateX(-8px)} 60%{transform:translateX(8px)} }
@keyframes blink      { 0%,100%{opacity:1} 50%{opacity:.3} }
@keyframes floatY     { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
@keyframes floatY2    { 0%,100%{transform:translateY(-8px)} 50%{transform:translateY(6px)} }
@keyframes gradShift  { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }
@keyframes spin       { to{transform:rotate(360deg)} }
@keyframes countUp    { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }
@keyframes pulseGlow  { 0%,100%{box-shadow:0 0 0 0 rgba(184,137,26,.4)} 70%{box-shadow:0 0 0 12px rgba(184,137,26,0)} }

/* ══ AUTH LAYOUT ══ */
.auth-wrap { display:flex; min-height:100vh; }

/* LEFT PANEL */
.auth-left {
  width:44%; flex-shrink:0;
  background:linear-gradient(145deg, var(--navy) 0%, #0E174A 40%, #0A1030 100%);
  background-size:200% 200%;
  animation:gradShift 12s ease infinite;
  display:flex; flex-direction:column;
  padding:2.5rem 2.5rem 2rem;
  position:relative; overflow:hidden;
}
.auth-left::before {
  content:''; position:absolute; top:0; left:0; right:0; bottom:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23FFFFFF' fill-opacity='0.025'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events:none;
}
.al-glow1 { position:absolute; top:-80px; right:-60px; width:300px; height:300px; border-radius:50%; background:radial-gradient(circle,rgba(201,169,110,.18),transparent 70%); pointer-events:none; }
.al-glow2 { position:absolute; bottom:-60px; left:-40px; width:240px; height:240px; border-radius:50%; background:radial-gradient(circle,rgba(29,78,216,.2),transparent 70%); pointer-events:none; }

.al-logo { display:flex; align-items:center; margin-bottom:auto; }
.al-logo img { height:30px; width:auto; }
.al-logo-badge { margin-left:.75rem; font-size:.64rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.45); border:1px solid rgba(255,255,255,.15); border-radius:100px; padding:.2rem .6rem; }

.al-body { flex:1; display:flex; flex-direction:column; justify-content:center; padding:2rem 0; }
.al-eyebrow { font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-l); margin-bottom:1rem; display:flex; align-items:center; gap:.5rem; animation:slideDown .6s ease .2s both; }
.al-eyebrow::before { content:''; width:20px; height:1.5px; background:var(--gold-l); }
.al-headline { font-family:'Fraunces',serif; font-size:2.2rem; font-weight:700; color:#FFF; line-height:1.22; letter-spacing:-.01em; margin-bottom:1.25rem; animation:fadeUp .7s ease .35s both; }
.al-headline em { color:var(--gold-l); font-style:normal; }
.al-sub { font-size:.9rem; color:rgba(255,255,255,.55); line-height:1.7; margin-bottom:2rem; animation:fadeUp .7s ease .5s both; }

/* floating stat cards */
.al-stats { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-bottom:2rem; animation:fadeUp .7s ease .6s both; }
.al-stat { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); border-radius:14px; padding:.875rem 1rem; }
.al-stat-val { font-family:'Fraunces',serif; font-size:1.5rem; font-weight:700; color:#FFF; }
.al-stat-key { font-size:.7rem; color:rgba(255,255,255,.4); margin-top:.2rem; }

/* testimonial card */
.al-testimonial { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:16px; padding:1.25rem; animation:fadeUp .7s ease .7s both; }
.alt-stars { color:var(--gold-l); font-size:.9rem; margin-bottom:.625rem; letter-spacing:-.1em; }
.alt-text { font-size:.84rem; color:rgba(255,255,255,.7); line-height:1.65; font-style:italic; margin-bottom:.875rem; }
.alt-author { display:flex; align-items:center; gap:.625rem; }
.alt-av { width:32px; height:32px; border-radius:50%; background:linear-gradient(135deg,var(--gold-l),var(--gold)); display:flex; align-items:center; justify-content:center; font-size:.7rem; font-weight:700; color:#FFF; flex-shrink:0; }
.alt-name { font-size:.8rem; font-weight:700; color:#FFF; }
.alt-role { font-size:.7rem; color:rgba(255,255,255,.4); }

/* floating badges */
.al-badge { display:inline-flex; align-items:center; gap:.5rem; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:100px; padding:.375rem .875rem; font-size:.74rem; color:rgba(255,255,255,.7); font-weight:500; }

/* ══ RIGHT PANEL ══ */
.auth-right {
  flex:1; background:var(--white);
  display:flex; flex-direction:column;
  overflow-y:auto; min-height:100vh;
}
.ar-inner { max-width:480px; margin:0 auto; padding:2.5rem 2rem 3rem; width:100%; flex:1; display:flex; flex-direction:column; }

/* role switcher */
.role-switcher { display:flex; background:var(--s2); border-radius:13px; padding:4px; margin-bottom:2rem; border:1px solid var(--border); animation:slideDown .5s ease .1s both; }
.rs-btn { flex:1; height:40px; border-radius:10px; border:none; font-size:.8rem; font-weight:700; cursor:pointer; transition:all .2s; color:var(--t3); background:transparent; display:flex; align-items:center; justify-content:center; gap:.375rem; }
.rs-btn:hover:not(.active) { color:var(--t2); background:rgba(255,255,255,.6); }
.rs-btn.active { background:var(--white); color:var(--t1); box-shadow:var(--sh-sm); }
.rs-btn.active.customer { color:var(--blue); }
.rs-btn.active.staff { color:var(--green); }
.rs-btn.active.admin { color:var(--purple); }

/* progress bar */
.progress-wrap { margin-bottom:1.75rem; animation:fadeIn .5s ease .2s both; }
.progress-steps { display:flex; align-items:center; gap:0; margin-bottom:.625rem; }
.ps-dot { width:28px; height:28px; border-radius:50%; border:2px solid var(--border); background:var(--white); display:flex; align-items:center; justify-content:center; font-size:.72rem; font-weight:700; color:var(--t3); flex-shrink:0; transition:all .35s; position:relative; z-index:1; }
.ps-dot.done { background:var(--green-m); border-color:var(--green-m); color:#FFF; }
.ps-dot.active { background:var(--navy); border-color:var(--navy); color:#FFF; }
.ps-dot.active.customer { background:var(--blue); border-color:var(--blue); }
.ps-dot.active.staff { background:var(--green); border-color:var(--green); }
.ps-dot.active.admin { background:var(--purple); border-color:var(--purple); }
.ps-line { flex:1; height:2px; background:var(--border); position:relative; }
.ps-line-fill { position:absolute; top:0; left:0; bottom:0; background:var(--green-m); transition:width .5s ease; border-radius:1px; }
.progress-label { font-size:.74rem; color:var(--t3); }
.progress-label strong { color:var(--t1); }

/* form step wrapper */
.form-step { display:none; }
.form-step.active { display:block; animation:slideLeft .4s cubic-bezier(.22,1,.36,1); }
.form-step.out { display:block; animation:slideRight .35s ease forwards; }

/* step header */
.step-hdr { margin-bottom:1.75rem; }
.step-icon { width:52px; height:52px; border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin-bottom:1rem; }
.step-icon.navy { background:linear-gradient(135deg,var(--navy),var(--navy2)); }
.step-icon.customer { background:linear-gradient(135deg,var(--blue-bg),#DBEAFE); }
.step-icon.staff { background:linear-gradient(135deg,var(--green-bg),#DCFCE7); }
.step-icon.admin { background:linear-gradient(135deg,var(--purple-bg),#EDE9FE); }
.step-title { font-family:'Fraunces',serif; font-size:1.5rem; font-weight:600; color:var(--t1); margin-bottom:.375rem; }
.step-sub { font-size:.85rem; color:var(--t2); line-height:1.6; }

/* fields */
.field-grid { display:grid; gap:.875rem; margin-bottom:1.25rem; }
.field-grid.two { grid-template-columns:1fr 1fr; }
@media(max-width:500px) { .field-grid.two { grid-template-columns:1fr; } }
.field { display:flex; flex-direction:column; gap:.375rem; }
.field.span2 { grid-column:1/3; }
@media(max-width:500px) { .field.span2 { grid-column:1/2; } }
.field-label { font-size:.7rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--t2); display:flex; align-items:center; justify-content:space-between; }
.field-label .opt { font-weight:400; color:var(--t3); text-transform:none; font-size:.68rem; }
.field-label .req { color:var(--red); margin-left:2px; }
.field-input {
  background:var(--s2); border:1.5px solid var(--border2); border-radius:11px;
  padding:.75rem 1rem; font-size:.9rem; color:var(--t1); outline:none;
  transition:all .2s; width:100%;
}
.field-input:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(184,137,26,.1); background:var(--white); }
.field-input::placeholder { color:var(--t3); }
.field-input.error { border-color:var(--red); background:var(--red-bg); animation:shake .35s ease; }
.field-input.success { border-color:var(--green-m); }
.field-hint { font-size:.72rem; color:var(--t3); margin-top:.1rem; }
.field-hint.err { color:var(--red); }
.field-select { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .875rem center; padding-right:2.5rem; }
.field-textarea { resize:vertical; min-height:80px; }

/* phone input with flag */
.phone-wrap { position:relative; }
.phone-prefix { position:absolute; left:0; top:0; bottom:0; display:flex; align-items:center; padding:0 .875rem; font-size:.88rem; color:var(--t2); border-right:1.5px solid var(--border2); pointer-events:none; }
.phone-wrap .field-input { padding-left:3.5rem; }

/* password strength */
.pw-strength { margin-top:.375rem; }
.pw-bars { display:flex; gap:3px; height:4px; margin-bottom:.3rem; }
.pw-bar { flex:1; border-radius:2px; background:var(--border); transition:background .3s; }
.pw-bar.weak   { background:var(--red); }
.pw-bar.fair   { background:var(--amber-m); }
.pw-bar.good   { background:var(--blue); }
.pw-bar.strong { background:var(--green-m); }
.pw-label { font-size:.7rem; color:var(--t3); }

/* eye toggle */
.pw-wrap { position:relative; }
.pw-toggle { position:absolute; right:.875rem; top:50%; transform:translateY(-50%); cursor:pointer; color:var(--t3); font-size:.9rem; transition:color .15s; background:none; border:none; padding:.25rem; }
.pw-toggle:hover { color:var(--t2); }
.pw-wrap .field-input { padding-right:2.75rem; }

/* multi-select chips */
.chip-group { display:flex; flex-wrap:wrap; gap:.5rem; }
.chip { display:inline-flex; align-items:center; gap:.4rem; padding:.4rem .875rem; border-radius:100px; font-size:.78rem; font-weight:600; cursor:pointer; border:1.5px solid var(--border2); background:var(--white); color:var(--t2); transition:all .17s; }
.chip:hover { border-color:var(--border); background:var(--s2); }
.chip.selected { background:var(--gold-bg); border-color:var(--gold-b); color:var(--gold-d); }
.chip.selected.staff-role { background:var(--green-bg); border-color:var(--green-b); color:var(--green); }
.chip.selected.admin-role { background:var(--purple-bg); border-color:var(--purple-b); color:var(--purple); }
.chip-check { display:none; }
.chip.selected .chip-check { display:inline; }

/* day picker */
.day-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:.375rem; }
.day-btn { height:40px; border-radius:9px; border:1.5px solid var(--border2); background:var(--white); font-size:.74rem; font-weight:700; cursor:pointer; transition:all .17s; color:var(--t2); }
.day-btn:hover { background:var(--s2); }
.day-btn.sel { background:var(--green-bg); border-color:var(--green-b); color:var(--green); }

/* divider */
.or-divider { display:flex; align-items:center; gap:.875rem; margin:1.25rem 0; }
.or-divider::before, .or-divider::after { content:''; flex:1; height:1px; background:var(--border); }
.or-divider span { font-size:.76rem; color:var(--t3); flex-shrink:0; }

/* social buttons */
.social-btns { display:grid; grid-template-columns:1fr 1fr; gap:.625rem; }
.social-btn { height:46px; border-radius:11px; border:1.5px solid var(--border2); background:var(--white); font-size:.82rem; font-weight:600; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:.5rem; transition:all .18s; color:var(--t2); }
.social-btn:hover { border-color:var(--border); background:var(--s2); }
.social-btn img { width:18px; height:18px; }

/* nav buttons */
.step-btns { display:flex; gap:.625rem; margin-top:1.5rem; }
.btn-back { flex-shrink:0; height:50px; padding:0 1.25rem; border-radius:12px; border:1.5px solid var(--border2); background:var(--white); font-size:.88rem; font-weight:600; color:var(--t2); cursor:pointer; transition:all .17s; display:flex; align-items:center; gap:.375rem; }
.btn-back:hover { background:var(--s2); }
.btn-next { flex:1; height:50px; border-radius:12px; border:none; font-size:.92rem; font-weight:700; cursor:pointer; transition:all .18s; color:#FFF; display:flex; align-items:center; justify-content:center; gap:.5rem; }
.btn-next:active { transform:scale(.98); }
.btn-next.navy   { background:var(--navy); }
.btn-next.navy:hover { background:var(--navy2); }
.btn-next.customer { background:var(--blue); }
.btn-next.customer:hover { background:#1E40AF; }
.btn-next.staff  { background:var(--green); }
.btn-next.staff:hover  { background:#166534; }
.btn-next.admin  { background:var(--purple); }
.btn-next.admin:hover  { background:#6D28D9; }
.btn-next.gold   { background:var(--gold); box-shadow:0 4px 16px rgba(184,137,26,.28); }
.btn-next.gold:hover { background:var(--gold-d); }
.btn-next:disabled { background:var(--border2); cursor:not-allowed; box-shadow:none; }

/* role identity pill (shown inside form) */
.role-identity { display:inline-flex; align-items:center; gap:.5rem; border-radius:100px; padding:.35rem .875rem; font-size:.76rem; font-weight:700; margin-bottom:1.375rem; animation:slideDown .4s ease; }
.ri-customer { background:var(--blue-bg); color:var(--blue); border:1px solid var(--blue-b); }
.ri-staff    { background:var(--green-bg); color:var(--green); border:1px solid var(--green-b); }
.ri-admin    { background:var(--purple-bg); color:var(--purple); border:1px solid var(--purple-b); }
.ri-dot { width:7px; height:7px; border-radius:50%; animation:blink 2s infinite; }
.ri-customer .ri-dot { background:var(--blue); }
.ri-staff .ri-dot    { background:var(--green-m); }
.ri-admin .ri-dot    { background:var(--purple); }

/* bottom link */
.auth-footer { margin-top:auto; padding-top:2rem; text-align:center; font-size:.82rem; color:var(--t2); }
.auth-footer a { color:var(--gold); font-weight:600; }
.auth-footer a:hover { color:var(--gold-d); }

/* ══ MOBILE ══ */
@media(max-width:820px) {
  .auth-left { display:none; }
  .auth-right { width:100%; }
  .ar-inner { padding:1.5rem 1.25rem 2.5rem; }
  .mobile-logo { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.75rem; }
  .mobile-logo img { height:24px; }
  .mobile-logo .ml-back { font-size:.8rem; color:var(--t2); display:flex; align-items:center; gap:.375rem; }
}
@media(min-width:821px) { .mobile-logo { display:none; } }
@media(prefers-reduced-motion:reduce) { *,::after,::before { animation-duration:.01ms!important; transition-duration:.01ms!important; } }

.otp-row { display:flex; gap:.5rem; justify-content:center; margin-bottom:1rem; }
.otp-box { width:52px; height:60px; border:1.5px solid var(--border2); border-radius:12px; text-align:center; font-size:1.4rem; font-weight:700; color:var(--t1); background:var(--s2); outline:none; transition:all .2s; }
.otp-box:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(184,137,26,.12); background:var(--white); }
.otp-resend { text-align:center; font-size:.8rem; color:var(--t2); }
.otp-resend button { background:none; border:none; color:var(--gold); font-weight:600; cursor:pointer; padding:0; }
.resend-cd { color:var(--t3); }
.upload-zone { border:2px dashed var(--border2); border-radius:12px; padding:1.5rem; text-align:center; cursor:pointer; transition:all .2s; background:var(--s2); }
.upload-zone:hover { border-color:var(--gold-b); background:var(--gold-s); }
.upload-icon { font-size:2rem; margin-bottom:.5rem; }
.upload-title { font-size:.85rem; font-weight:700; color:var(--t1); margin-bottom:.25rem; }
.upload-sub { font-size:.74rem; color:var(--t3); }
.al-left-steps { display:flex; flex-direction:column; gap:.75rem; margin-bottom:1.5rem; animation:fadeUp .6s ease .7s both; }
.als-item { display:flex; align-items:center; gap:.75rem; }
.als-num { width:28px; height:28px; border-radius:50%; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.15); display:flex; align-items:center; justify-content:center; font-size:.72rem; font-weight:700; color:rgba(255,255,255,.8); flex-shrink:0; font-family:"Fraunces",serif; }
.als-text { font-size:.82rem; color:rgba(255,255,255,.65); }
.als-text strong { color:rgba(255,255,255,.9); }


/* StaffSwift PHP integration aliases — preserve attached v5 appearance */
.auth-shell{display:flex;min-height:100vh;width:100%;overflow:hidden}.auth-side{width:42%;max-width:560px;min-height:100vh;background:linear-gradient(145deg,var(--navy),var(--navy2));position:relative;overflow:hidden;padding:2.25rem 2.5rem;display:flex;flex-direction:column;justify-content:space-between;color:#fff}.auth-side:before,.auth-side:after{content:"";position:absolute;border-radius:50%;pointer-events:none}.auth-side:before{width:420px;height:420px;right:-180px;top:-160px;background:rgba(184,137,26,.12)}.auth-side:after{width:340px;height:340px;left:-180px;bottom:-140px;background:rgba(255,255,255,.04)}.auth-side>div{position:relative;z-index:1}.auth-side .logo{width:168px;height:auto;margin-bottom:3.5rem}.side-chip,.auth-kicker{display:inline-flex;align-items:center;border-radius:100px;padding:.38rem .82rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-l);margin-bottom:1rem}.side-title{font-family:'Fraunces',serif;font-size:2.2rem;line-height:1.22;color:#fff;margin:0 0 1rem}.side-copy{font-size:.9rem;line-height:1.7;color:rgba(255,255,255,.58);margin-bottom:1.75rem}.side-list{display:grid;gap:.75rem}.side-item{display:flex;gap:.75rem;align-items:flex-start;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1);padding:.9rem;border-radius:14px}.side-ico{width:30px;height:30px;flex:0 0 30px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--gold);color:#fff;font-size:.72rem;font-weight:800}.side-item strong{display:block;color:#fff;font-size:.82rem;margin-bottom:.18rem}.side-item span{display:block;color:rgba(255,255,255,.48);font-size:.72rem;line-height:1.45}.side-links{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}.side-links a{color:rgba(255,255,255,.55);font-size:.75rem;text-decoration:none}.side-links a:hover{color:#fff}.auth-main{flex:1;background:var(--white);min-height:100vh;overflow-y:auto}.auth-card{max-width:600px;width:100%;margin:0 auto;padding:2.25rem 2rem 3rem}.auth-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem}.brand-mini{display:none}.auth-badge,.account-type-banner{border-radius:12px}.auth-badge{font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:.45rem .75rem;background:var(--gold-bg);color:var(--gold-d);border:1px solid var(--gold-b)}.account-type-banner{display:flex;align-items:center;gap:.75rem;padding:.85rem 1rem;background:var(--s2);border:1px solid var(--border);margin-bottom:1.25rem}.type-icon{width:38px;height:38px;border-radius:11px;background:#fff;border:1px solid var(--border);display:flex;align-items:center;justify-content:center}.account-type-banner strong{display:block;font-size:.78rem;color:var(--t1)}.account-type-banner em{display:block;font-size:.72rem;color:var(--t3);font-style:normal;margin-top:.15rem}.auth-head{margin-bottom:1.25rem}.auth-head .auth-kicker{background:var(--gold-bg);border-color:var(--gold-b);color:var(--gold-d);margin-bottom:.65rem}.auth-title{font-family:'Fraunces',serif;font-size:1.8rem;color:var(--t1);margin:0 0 .35rem}.auth-sub{font-size:.84rem;color:var(--t2);line-height:1.6}.portal-switch,.tabs{display:flex;background:var(--s2);border:1px solid var(--border);border-radius:13px;padding:4px;gap:3px;margin-bottom:1.5rem}.portal-switch a,.tab{flex:1;min-height:40px;border:0;border-radius:10px;display:flex;align-items:center;justify-content:center;text-decoration:none;background:transparent;color:var(--t3);font-size:.8rem;font-weight:700}.portal-switch a.active,.tab.active{background:#fff;color:var(--t1);box-shadow:var(--sh-sm)}.stepper{display:flex;align-items:center;gap:5px;margin:0 0 1.5rem;overflow-x:auto;padding-bottom:3px}.step-indicator{flex:1;min-width:90px;border:0;border-bottom:3px solid var(--border);background:none;padding:.65rem .3rem;color:var(--t3);font-size:.7rem;font-weight:700;white-space:nowrap}.step-indicator.active{color:var(--navy);border-color:var(--navy)}.step-indicator.done{color:var(--green);border-color:var(--green-m)}.form-step{display:none}.form-step.active{display:block;animation:slideLeft .4s cubic-bezier(.22,1,.36,1)}.step-title{font-family:'Fraunces',serif;font-size:1.45rem;color:var(--t1);margin:0 0 .35rem}.step-copy{font-size:.82rem;color:var(--t2);margin-bottom:1.25rem}.form-grid{display:grid;gap:.875rem}.form-grid.two{grid-template-columns:1fr 1fr}.field{display:flex;flex-direction:column;gap:.375rem}.field label{font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--t2)}.input{background:var(--s2);border:1.5px solid var(--border2);border-radius:11px;padding:.75rem 1rem;font-size:.9rem;color:var(--t1);outline:none;width:100%;transition:.2s}.input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(184,137,26,.1);background:#fff}.field-error{display:none;font-size:.7rem;color:var(--red)}.field.invalid .field-error{display:block}.field.invalid .input{border-color:var(--red);background:var(--red-bg)}.phone-control{display:flex;gap:.5rem}.country-code-box{display:flex;align-items:center;position:relative;min-width:106px}.country-flag{position:absolute;left:.72rem;z-index:2;font-size:1rem;pointer-events:none}.country-select{padding-left:2.35rem!important;padding-right:.5rem!important}.phone-local{flex:1}.phone-status{font-size:.7rem;color:var(--t3)}.phone-status.good{color:var(--green)}.phone-status.bad{color:var(--red)}.divider{display:flex;align-items:center;gap:.75rem;margin:1.2rem 0}.divider:before,.divider:after{content:"";height:1px;background:var(--border);flex:1}.divider span{font-size:.7rem;color:var(--t3);text-transform:uppercase;letter-spacing:.06em}.actions,.step-actions{display:flex;gap:.65rem;margin-top:1.5rem}.btn{min-height:46px;border:0;border-radius:11px;padding:.75rem 1rem;font-size:.84rem;font-weight:800;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.btn-primary{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;flex:1}.btn-secondary{background:var(--s2);color:var(--t2);border:1px solid var(--border)}.alert{padding:.8rem 1rem;border-radius:11px;margin-bottom:1rem;font-size:.8rem}.alert.error{background:var(--red-bg);color:var(--red);border:1px solid #FECACA}.alert.success{background:var(--green-bg);color:var(--green);border:1px solid var(--green-b)}.social-grid{display:grid;grid-template-columns:1fr 1fr;gap:.625rem}.social-btn{min-height:44px}.hidden{display:none!important}.field-append,.pw-wrap{position:relative}.field-append .input{padding-right:3rem}.eye{position:absolute;right:.7rem;top:50%;transform:translateY(-50%);border:0;background:none;cursor:pointer}.row-between{display:flex;align-items:center;justify-content:space-between}.row-between a,.auth-foot a,.auth-links a{color:var(--gold-d);text-decoration:none;font-weight:700}.check-row{display:flex;align-items:center;gap:.55rem;font-size:.78rem;color:var(--t2)}.auth-foot{text-align:center;margin-top:1.25rem;font-size:.8rem;color:var(--t2)}.auth-links{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-top:1rem;font-size:.72rem}.auth-links a{color:var(--t3)}
@media(max-width:900px){.auth-shell{display:block}.auth-side{display:none}.auth-main{min-height:100vh}.auth-card{max-width:640px;padding:1.5rem 1rem 2.5rem}.auth-top{display:flex}.brand-mini{display:flex;align-items:center;gap:.5rem;font-weight:800}.brand-mini img{width:32px;height:32px;border-radius:8px}.form-grid.two{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.form-grid.two{grid-template-columns:1fr}.phone-control{flex-direction:column}.country-code-box{width:100%}.stepper{margin-left:-.25rem;margin-right:-.25rem}.step-indicator{min-width:105px}.social-grid{grid-template-columns:1fr}.auth-card{padding:1rem .85rem 2rem}.auth-title{font-size:1.55rem}}