/* MyLamarin — auth (sign-in + qualification) visual system matched to tilogin/ti-admin */
*,*::before,*::after{box-sizing:border-box}
:root{
  /* tilogin / ti-admin tokens */
  --primary:#A0E0C1;--primary-dark:#3EAF7C;--primary-faint:#E8FAF2;
  --sidebar:#0E2A2F;--sb-text:#A0E0C1;--sb-muted:#5A9090;
  --bg:#DFFFEF;--bg-card:#ffffff;--bg-surface:#F0FBF6;--bg-row:#F6FDF9;
  --text:#0E2A2F;--text-sub:#3A6A60;--text-muted:#6A9A8A;--text-faint:#9ABCB0;
  /* Legacy (existing markup / scripts) */
  --dark:var(--sidebar);--dark-mid:#1d4a52;--dark-deep:#071919;
  --teal:#1a8a7a;--teal-lt:#2db89e;--gold:#8A6000;--gold-lt:#B8860B;  --a07828:#8A6000;
  /* “Who are you?” cards (match premium reference) */
  --wm-who-bg:#F8F9FA;--wm-who-border:#E0E0E0;
  --wm-who-title:#1A3030;--wm-who-body:#4A6B6B;
  --wm-who-seeker-bg:#F9F5EF;--wm-who-seeker-fg:#B38B59;
  --wm-who-emp-bg:#E9F5F3;--wm-who-emp-fg:#3D7A7A;
  --wm-who-illus-bg:#EEF0F2;--wm-who-illus-stroke:#6A7A7A;
  --wm-who-arrow:var(--wm-who-title);
  /* Create account / job seeker form (reference) */
  --ca-text:#0F252A;--ca-text-deep:#0a1a1e;
  --ca-subtext:#8EA7B0;
  --ca-accent:#D9534F;
  --ca-tag-bg:#F5EFE6;--ca-tag-fg:#5C4A2E;
  --ca-border:#D1D5DB;
  --ca-surface:#ffffff;
  --ca-divider:#E8ECED;
  --mint:var(--sb-text);--white:#ffffff;
  --text-main:var(--text);--text-mid:var(--text-sub);--text-soft:var(--text-muted);
  --border:rgba(14,42,47,0.1);--border-mid:rgba(14,42,47,0.16);
  --radius:12px;--radius-lg:16px;--radius-xl:20px;--radius-pill:100px;
  --font:'Sora',system-ui,sans-serif;
  --disp:'DM Serif Display',Georgia,serif;
  --cond:var(--disp);
  --sh-lg:0 8px 40px rgba(14,42,47,0.12);
}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  overflow-x:hidden;
  max-width:100%;
}
body{
  margin:0;
  font-family:var(--font);
  color:var(--text);
  background:var(--bg);
  font-size:14px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  max-width:100%;
  position:relative;
  overscroll-behavior-x:none;
}

/* —— Shell: flex 42% / 58% (tilogin auth) —— */
.auth-shell{
  min-height:100vh;min-height:100dvh;min-height:100svh;
  display:flex;align-items:stretch;flex-direction:row;
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  background:var(--bg);
  isolation:isolate;
}
.auth-shell > *{min-width:0}

/* —— Left: auth-deco —— */
.auth-visual{
  position:relative;
  flex:0 0 42%;
  max-width:min(100%,32rem);
  min-height:0;
  display:flex;flex-direction:column;
  background:var(--sidebar);
  color:var(--sb-text);
  padding:44px 48px 40px;
  overflow:hidden;
}
.auth-visual::before{
  content:'';position:absolute;width:360px;height:360px;border-radius:50%;
  background:rgba(160,224,193,0.1);top:-100px;right:-100px;pointer-events:none;
}
.auth-visual::after{
  content:'';position:absolute;width:200px;height:200px;border-radius:50%;
  border:1px solid rgba(160,224,193,0.12);
  bottom:100px;left:-60px;pointer-events:none;opacity:0.95;
}
.auth-v-inner{
  position:relative;z-index:1;flex:1;min-height:0;
  display:flex;flex-direction:column;gap:20px;
  justify-content:space-between;
}
a.auth-brand{
  display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;align-self:flex-start;
}
.auth-mark{
  width:48px;height:48px;border-radius:12px;overflow:hidden;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;background:transparent;
}
.auth-mark img{width:165%;height:165%;object-fit:cover;object-position:center;border-radius:12px;display:block}
.auth-name{color:#fff;font-weight:700;font-size:13px;letter-spacing:0.02em}
.auth-kicker{margin-top:1px;font-size:10.5px;letter-spacing:0.06em;font-weight:600;text-transform:uppercase;color:var(--sb-muted)}

.auth-v-headline{max-width:100%;flex:0 0 auto;position:relative;z-index:1}
.auth-v-headline h1{
  font-family:var(--disp);font-size:clamp(28px,2.4vw,38px);font-weight:400;
  line-height:1.15;color:#fff;margin:0 0 12px;letter-spacing:-0.02em;
  text-wrap:balance;
}
.auth-v-headline h1 em{font-style:italic;color:var(--primary)}
.auth-v-headline p{
  font-size:14px;font-weight:400;line-height:1.75;
  color:var(--sb-muted);margin:0;max-width:20rem;
}

.ill-center{
  flex:1;min-height:0;display:flex;align-items:center;justify-content:center;
  padding:4px 0 8px;
}
.ill-center svg{
  width:100%;max-width:min(100%,380px);height:auto;max-height:min(45vh,340px);
  filter:drop-shadow(0 24px 48px rgba(0,0,0,0.22));opacity:0.98;
}

.auth-v-badges{display:flex;flex-wrap:wrap;gap:8px;position:relative;z-index:1;flex-shrink:0}
.auth-v-badges span{
  font-size:10px;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;
  padding:5px 10px;border-radius:var(--radius-pill);
  border:1px solid rgba(160,224,193,0.18);color:rgba(160,224,193,0.7);
  background:rgba(0,0,0,0.1);
}

/* —— Form column —— */
.auth-form-col{
  flex:1 1 58%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 32px;
  padding-bottom:calc(32px + env(safe-area-inset-bottom,0px));
  min-height:100vh;min-height:100dvh;min-height:100svh;position:relative;
  background:var(--bg);
  box-sizing:border-box;
  overflow-y:auto;
  overflow-x:hidden;
  max-width:100%;
  -webkit-overflow-scrolling:touch;
}
.auth-form-col .qual-top-bar,
.auth-form-col .si-page-card,
.auth-form-col .auth-card--light{
  width:100%;
  max-width:min(100%,420px);
  box-sizing:border-box;
}
.auth-form-col .qual-top-bar{padding:0;margin:0 0 4px;max-width:min(100%,420px)}
.auth-form-col .auth-skip{right:clamp(12px,3.5vw,32px);left:auto}
.auth-skip{position:absolute;top:22px;right:clamp(16px,2.5vw,32px);z-index:5}
.auth-skip a{
  display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;
  color:var(--text-muted);text-decoration:none;transition:color .2s;
}
.auth-skip a:hover{color:var(--sidebar)}

/* —— Qualification card —— */
.auth-card--light{
  width:100%;max-width:min(100%,420px);margin:0 auto;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  box-shadow:var(--sh-lg);
  position:relative;overflow:hidden;
}
.auth-card--light::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;z-index:2;
  background:linear-gradient(to right,var(--sidebar),var(--primary-dark) 50%,#c9a84c);
}
.auth-qual-pad{padding:0 0 4px 0}
#qualContent{
  max-height:85vh;max-height:min(90dvh,920px);
  overflow-y:auto;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;
  scrollbar-width:thin;box-sizing:border-box;
}
#qualContent::-webkit-scrollbar{width:4px}
#qualContent::-webkit-scrollbar-thumb{background:rgba(14,42,47,0.15);border-radius:4px}
.auth-qual-pad .wm-step{padding:28px 32px 32px}

/* —— Sign-in: light card (tilogin .auth-card) —— */
.si-page-card{
  width:100%;max-width:min(100%,420px);margin:0 auto;position:relative;z-index:0;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  padding:44px 40px 36px;
  box-shadow:var(--sh-lg);
  overflow:hidden;
}
.si-page-card::before{content:'';position:absolute;top:0;left:0;right:0;height:0;z-index:1}
.si-page-card[data-role="employer"]{
  background:var(--bg-card);
  box-shadow:var(--sh-lg),0 0 0 1px rgba(26,138,122,0.12) inset;
}
.si-page-card[data-role="employer"]::after{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;z-index:1;
  background:linear-gradient(to right,var(--teal),var(--teal-lt));
}
.si-panel-bg{position:absolute;top:-40px;right:-50px;width:200px;height:200px;pointer-events:none;opacity:0.12;z-index:0}
.si-bg-globe{width:100%;height:100%}

.si-header{position:relative;z-index:1;display:flex;align-items:flex-start;gap:12px;margin-bottom:10px}
.si-logo{
  width:40px;height:40px;border-radius:11px;background:transparent;overflow:hidden;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  border:1px solid var(--border-mid);
}
.si-logo img{
  width:165%;height:165%;object-fit:cover;object-position:center;
  display:block;border-radius:11px;
}
.si-eyebrow{font-size:10px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-sub);margin-bottom:4px}
.si-title{
  font-family:var(--disp);font-size:clamp(22px,3.5vw,28px);
  font-weight:400;color:var(--text);line-height:1.15;letter-spacing:-0.02em;
  margin:0 0 4px;
}
.si-subtitle{font-size:13.5px;font-weight:400;color:var(--text-sub);margin:0 0 24px;max-width:32rem}

.si-tabs{
  position:relative;z-index:1;display:flex;gap:4px;
  background:var(--bg-surface);
  border:1px solid var(--border);
  border-radius:var(--radius);padding:4px;margin-bottom:20px;
}
.si-tab{
  flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:9px 8px;border-radius:8px;border:none;background:transparent;
  font-size:12px;font-weight:600;font-family:var(--font);
  color:var(--text-muted);cursor:pointer;transition:all .2s;
}
.si-tab svg{width:15px;height:15px;flex-shrink:0;opacity:0.7}
.si-tab-active{
  background:var(--bg-card);
  color:var(--text);
  box-shadow:0 1px 3px rgba(14,42,47,0.06),0 2px 8px rgba(14,42,47,0.04);
  border:1px solid var(--border);
}
.si-form{position:relative;z-index:1}
.si-field{margin-bottom:18px}
.si-label,
.si-label-row .si-label{
  display:block;font-size:11.5px;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;
  color:var(--text-sub);margin-bottom:8px;
}
.si-label-row{display:flex;justify-content:space-between;align-items:center}
.si-forgot{font-size:12.5px;color:var(--primary-dark);font-weight:600;text-decoration:none}
.si-forgot:hover{text-decoration:underline}
.si-input-wrap{
  display:flex;align-items:center;gap:10px;border:1.5px solid var(--border-mid);
  border-radius:var(--radius);padding:0 12px;min-height:50px;
  background:var(--bg-surface);transition:border-color .2s;
}
.si-input-wrap:focus-within{border-color:var(--primary-dark)}
.si-input-icon{flex-shrink:0;color:var(--text-faint);display:flex}
.si-input-icon svg{width:16px;height:16px}
.si-input{
  flex:1;min-width:0;border:none;outline:none;background:transparent;
  font-size:14px;font-family:var(--font);color:var(--text);padding:12px 0;
}
.si-input::placeholder{color:var(--text-faint)}
.si-eye{flex-shrink:0;padding:6px;border:none;border-radius:8px;background:transparent;cursor:pointer;color:var(--text-muted)}
.si-eye:hover{color:var(--text)}

.si-remember{
  position:relative;display:flex;align-items:center;gap:10px;cursor:pointer;
  margin:2px 0 18px;font-size:12.5px;color:var(--text-muted);
}
.si-checkbox{
  position:absolute;left:0;top:1px;width:20px;height:20px;opacity:0.01;cursor:pointer;margin:0;z-index:2;
}
.si-checkbox-box{
  width:18px;height:18px;border-radius:5px;border:1.5px solid var(--border-mid);
  background:var(--bg-surface);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  transition:all .2s;pointer-events:none;
}
.si-checkbox:focus + .si-checkbox-box{outline:2px solid var(--primary-dark);outline-offset:1px}
.si-checkbox:checked + .si-checkbox-box{
  background:var(--teal);border-color:var(--teal);
}
.si-checkbox:checked + .si-checkbox-box::after{
  content:'';width:4px;height:8px;border:2px solid #fff;border-left:0;border-top:0;transform:translate(0.5px,0) rotate(45deg);
  display:block;margin:auto;
}
.si-error{
  display:none;border-radius:10px;padding:10px 12px;
  background:var(--danger-bg,#FDDADA);border:1px solid rgba(176,24,24,0.2);
  color:var(--danger-text,#8a1c1c);font-size:12.5px;margin-bottom:12px;line-height:1.4;
}
.si-error.visible{display:block}
.si-submit{
  position:relative;width:100%;display:flex;align-items:center;justify-content:center;gap:8px;
  min-height:52px;border:none;border-radius:var(--radius-pill);
  background:var(--sidebar);
  color:var(--primary);
  font-size:15px;font-weight:700;cursor:pointer;font-family:var(--font);
  transition:background .2s,transform .2s,box-shadow .2s;
  margin-top:4px;
}
.si-submit:hover{background:var(--dark-mid);transform:translateY(-1px)}
.si-submit:disabled{cursor:wait;transform:none}
.si-submit:disabled:not(.loading){opacity:0.65}
.si-submit.loading:disabled{opacity:1}
.si-submit.loading .si-submit-text{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}
.si-dots{
  display:none;align-items:center;justify-content:center;gap:5px;min-height:1.1em;
}
.si-submit.loading .si-dots{display:flex}
.si-dots > span{
  width:7px;height:7px;border-radius:50%;
  background:rgba(160,224,193,0.78);
  animation:wf-dots-pulse 0.8s ease-in-out infinite;
}
.si-dots > span:nth-child(2){animation-delay:0.16s}
.si-dots > span:nth-child(3){animation-delay:0.32s}
#signinModal .si-panel[data-role="employer"] .si-submit .si-dots > span{
  background:rgba(255,255,255,0.9);
}
@keyframes si-spin{to{transform:rotate(360deg)}}
.si-divider{position:relative;z-index:1;margin:22px 0 16px;text-align:center}
.si-divider::before{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:var(--border)}
.si-divider span{
  position:relative;padding:0 12px;font-size:11px;
  color:var(--text-faint);
  background:var(--bg-card);
}
.si-socials{position:relative;z-index:1}
.si-social-btn{
  width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:11px 16px;border-radius:var(--radius);
  background:var(--bg-surface);
  border:1.5px solid var(--border-mid);
  color:var(--text-sub);font-size:13.5px;font-weight:600;cursor:pointer;
  font-family:var(--font);transition:all .2s;
  overflow:visible;min-height:48px;
}
.si-social-btn:hover{background:var(--bg-row);border-color:var(--text-muted)}
.si-social-btn .si-social-google,
.si-social-btn svg{
  display:block;flex-shrink:0;width:20px;min-width:20px;height:20px;min-height:20px;
  overflow:visible;
  align-self:center;
}
.si-foot-note{position:relative;z-index:1;margin-top:20px;font-size:12.5px;color:var(--text-muted);text-align:center}
.si-foot-note a{color:var(--primary-dark);font-weight:600;text-decoration:none}
.si-foot-note a:hover{text-decoration:underline}
.si-to-qual{position:relative;z-index:1}
.si-to-qual a{color:var(--primary-dark);font-weight:600}
.si-fp-hint{
  font-size:12.5px;
  color:var(--wm-who-body);
  line-height:1.5;
  margin:0 0 18px;
  max-width:32rem;
}
.si-success-block{
  display:none;
  border-radius:var(--radius);
  padding:16px 18px;
  font-size:13.5px;
  line-height:1.55;
  color:var(--wm-who-title);
  background:rgba(26,138,122,0.1);
  border:1.5px solid rgba(26,138,122,0.2);
  margin:4px 0 8px;
}
.si-success-block.visible{display:block}
.rp-state{display:none;flex-direction:column;min-height:200px;align-items:center;justify-content:center;text-align:center;gap:12px}
.rp-state.rp-on{display:flex}
.rp-state p{font-size:13.5px;color:var(--wm-who-body);line-height:1.55;max-width:22rem}
.rp-retry a,.rp-state a.rp-a{color:var(--primary-dark);font-weight:600}
.rp-spinner{
  width:32px;height:32px;
  border:2px solid rgba(14,42,47,0.12);
  border-top-color:var(--primary-dark);
  border-radius:50%;
  animation:si-spin 0.75s linear infinite;
  flex-shrink:0;
}

/* —— Sign-in: same palette as “Who are you?” (wm-who) —— */
.page-auth-signin .si-page-card{
  background:var(--wm-who-bg);
  border:1.5px solid var(--wm-who-border);
  box-shadow:0 4px 24px rgba(26,48,48,0.06);
}
.page-auth-signin .si-page-card[data-role="employer"]{
  background:var(--wm-who-bg);
  box-shadow:0 4px 24px rgba(26,48,48,0.06),0 0 0 1px var(--wm-who-border) inset;
}
.page-auth-signin .si-page-card[data-role="employer"]::after{
  background:linear-gradient(90deg,var(--wm-who-emp-fg) 0%,#2a9b8a 100%);
  height:2px;
  left:0;right:0;top:0;
}
.page-auth-signin .si-panel-bg{opacity:0.09}
.page-auth-signin .si-logo{border-color:var(--wm-who-border)}
.page-auth-signin .si-eyebrow{
  color:var(--wm-who-body);
  font-weight:800;
}
.page-auth-signin .si-title{
  font-family:var(--font);
  font-size:clamp(1.1rem,2.8vw,1.4rem);
  font-weight:800;
  line-height:1.2;
  color:var(--wm-who-title);
  margin:0 0 4px;
  letter-spacing:-0.02em;
}
.page-auth-signin .si-subtitle{
  color:var(--wm-who-body);
  font-size:13.5px;
  line-height:1.5;
  margin:0 0 22px;
  max-width:32rem;
}
/* Segmented control: dark track + light mint “slider” for active (see reference) */
.page-auth-signin .si-tabs{
  background:var(--sidebar);
  border:1px solid rgba(160,224,193,0.18);
  border-radius:100px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
  padding:3px;
  gap:0;
  margin-bottom:20px;
}
.page-auth-signin .si-tab{
  flex:1;
  border:none;
  background:transparent;
  border-radius:100px;
  color:rgba(160,224,193,0.5);
  font-size:12.5px;
  font-weight:600;
  padding:10px 8px 9px;
  min-height:40px;
  transition:color 0.2s,background 0.2s,box-shadow 0.2s;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.page-auth-signin .si-tab:hover:not(.si-tab-active){
  color:rgba(160,224,193,0.7);
  background:rgba(0,0,0,0.1);
}
.page-auth-signin .si-tab svg{
  opacity:1;
  color:inherit;
}
.page-auth-signin .si-tab-active{
  background:rgba(222,254,238,0.98);
  color:var(--sidebar);
  font-weight:700;
  box-shadow:0 1px 0 rgba(0,0,0,0.1),0 1px 3px rgba(0,0,0,0.08);
  border:none;
}
.page-auth-signin .si-tab-active:hover{
  color:var(--sidebar);
  background:var(--bg);
}
.page-auth-signin .si-tab:focus-visible{
  outline:2px solid var(--primary);
  outline-offset:2px;
}
.page-auth-signin .si-label,
.page-auth-signin .si-label-row .si-label{
  color:var(--wm-who-title);
  font-size:12px;
  font-weight:700;
  text-transform:none;
  letter-spacing:0.01em;
}
.page-auth-signin .si-forgot{
  color:var(--wm-who-emp-fg);
  font-size:12.5px;
  font-weight:600;
}
.page-auth-signin .si-forgot:hover{color:var(--wm-who-title);text-decoration:none;opacity:0.88}
.page-auth-signin .si-input-wrap{
  background:#fff;
  border:1.5px solid var(--wm-who-border);
  border-radius:10px;
}
.page-auth-signin .si-input-wrap:focus-within{
  border-color:var(--wm-who-title);
  box-shadow:0 0 0 3px rgba(26,48,48,0.06);
}
.page-auth-signin .si-input-icon{color:var(--wm-who-illus-stroke);opacity:0.95}
.page-auth-signin .si-input{
  color:var(--wm-who-title);
  font-size:15px;
}
.page-auth-signin .si-input::placeholder{
  color:var(--wm-who-body);
  opacity:0.9;
}
.page-auth-signin .si-eye{color:var(--wm-who-illus-stroke);opacity:0.95}
.page-auth-signin .si-eye:hover{color:var(--wm-who-title);background:rgba(26,48,48,0.05)}
.page-auth-signin .si-remember{
  color:var(--wm-who-body);
  font-size:12.5px;
}
.page-auth-signin .si-checkbox-box{
  border-color:var(--wm-who-border);
  background:#fff;
}
.page-auth-signin .si-checkbox:focus + .si-checkbox-box{outline:2px solid var(--wm-who-emp-fg);outline-offset:1px}
.page-auth-signin .si-checkbox:checked + .si-checkbox-box{
  background:var(--wm-who-emp-fg);
  border-color:var(--wm-who-emp-fg);
}
.page-auth-signin .si-error{
  position:relative;
  overflow:hidden;
  background:#fef2f2;
  color:#9c2a26;
  border:1px solid rgba(200, 80, 76, 0.3);
}
/* Success / confirmation (e.g. signed in, password updated) — same accent language as CTA + cards */
.page-auth-signin .si-error.si-error--success{
  padding:13px 12px 10px 12px;
  background:linear-gradient(145deg, var(--primary-faint) 0%, var(--bg-surface) 50%, #fff 100%);
  color:var(--wm-who-title);
  border:1px solid rgba(62, 175, 140, 0.28);
  border-left:3px solid var(--primary-dark);
  font-weight:600;
  line-height:1.5;
  box-shadow:0 4px 20px rgba(7, 25, 25, 0.06);
}
.page-auth-signin .si-error.si-error--success::before{
  content:'';
  position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg, var(--sidebar) 0%, var(--primary-dark) 50%, #c9a84c 100%);
  pointer-events:none;
}
.page-auth-signin .si-submit{
  /* Same as theme: dark sidebar + mint (tilogin / wf-submit-gold) */
  background:var(--sidebar);
  color:var(--primary);
  border-radius:var(--radius-pill);
  min-height:52px;
  font-size:16px;
  font-weight:700;
  box-shadow:0 4px 20px rgba(7,25,25,0.12);
}
.page-auth-signin .si-submit:hover{
  background:var(--dark-mid);
  color:var(--primary);
  box-shadow:0 8px 24px rgba(7,25,25,0.12);
  transform:translateY(-1px);
}
.page-auth-signin .si-divider::before{
  background:var(--wm-who-border);
}
.page-auth-signin .si-divider span{
  color:var(--wm-who-body);
  background:var(--wm-who-bg);
  font-size:11.5px;
}
.page-auth-signin .si-social-btn{
  background:#fff;
  border:1.5px solid var(--wm-who-border);
  color:var(--wm-who-title);
  min-height:50px;
  border-radius:10px;
}
.page-auth-signin .si-social-btn:hover{
  background:var(--wm-who-illus-bg);
  border-color:var(--wm-who-title);
  color:var(--wm-who-title);
}
.page-auth-signin .si-foot-note,
.page-auth-signin .si-to-qual,
.page-auth-signin .si-to-qual a,
.page-auth-signin .si-foot-note a{
  color:var(--wm-who-body);
}
.page-auth-signin .si-foot-note a,
.page-auth-signin .si-to-qual a{
  color:var(--wm-who-emp-fg);
  font-weight:600;
}
.page-auth-signin .si-foot-note a:hover,
.page-auth-signin .si-to-qual a:hover{
  color:var(--wm-who-title);
  text-decoration:underline;
  text-decoration-thickness:1.2px;
}

/* —— Qualification flow —— */
.wm-close{position:sticky;float:right;top:16px;right:16px;margin:12px 16px -8px auto;display:flex;width:32px;height:32px;border-radius:50%;border:1px solid var(--border);background:transparent;align-items:center;justify-content:center;cursor:pointer;color:var(--text-muted);z-index:10;flex-shrink:0}
.wm-close svg{width:14px;height:14px}
.wm-close:hover{background:rgba(14,42,47,0.04);color:var(--text)}
.wm-header{display:flex;align-items:flex-start;gap:14px;margin-bottom:20px}
.wm-logo-mark{width:48px;height:48px;border-radius:12px;overflow:hidden;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}
.wm-logo-mark img{width:165%;height:165%;object-fit:cover;object-position:center}
.wm-eyebrow{font-size:10px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-sub);margin-bottom:4px}
.wm-title{font-family:var(--disp);font-size:clamp(20px,2.6vw,24px);font-weight:400;color:var(--text);line-height:1.15;margin:0 0 6px;letter-spacing:-0.02em}
.wm-subtitle{font-size:13.5px;font-weight:400;color:var(--text-sub);line-height:1.5;margin:0}
.wm-step{animation:qp-in .35s ease}
@keyframes qp-in{from{opacity:0;transform:translateX(6px)}to{opacity:1;transform:translateX(0)}}
.wm-hidden{display:none}
.wm-options{display:flex;flex-direction:column;gap:10px;margin-bottom:18px}
.wm-option{
  display:flex;align-items:stretch;cursor:pointer;text-align:left;
  border:1.5px solid var(--border);border-radius:14px;overflow:hidden;
  background:var(--bg-surface);transition:all 0.25s;
}
button.wm-option{-webkit-appearance:none;appearance:none;font:inherit}
.wm-option:hover{transform:translateY(-1px);box-shadow:var(--sh-lg)}
#wmStep0 .wm-option{
  background:var(--wm-who-bg);
  border:1.5px solid var(--wm-who-border);
}
#wmStep0 .wm-seeker:hover{
  border-color:rgba(179,139,89,0.5);
  background:linear-gradient(180deg, #FDFBFA 0%, #F8F8F6 100%);
  box-shadow:0 8px 28px rgba(26,48,48,0.08);
}
#wmStep0 .wm-employer:hover{
  border-color:rgba(61,122,122,0.45);
  background:linear-gradient(180deg, #F0F7F5 0%, #F1F2F2 100%);
  box-shadow:0 8px 28px rgba(26,48,48,0.08);
}
#wmStep0 .wm-seeker .wm-opt-tag{
  color:var(--wm-who-seeker-fg);
  background:var(--wm-who-seeker-bg);
  border:1px solid rgba(179,139,89,0.4);
  letter-spacing:0.14em;
}
#wmStep0 .wm-employer .wm-opt-tag,
#wmStep0 .wm-employer .wm-opt-tag-teal{
  color:var(--wm-who-emp-fg);
  background:var(--wm-who-emp-bg);
  border:1px solid rgba(61,122,122,0.4);
  letter-spacing:0.1em;
}
#wmStep0 .wm-opt-title{
  color:var(--wm-who-title);
  font-weight:800;
  letter-spacing:-0.01em;
}
#wmStep0 .wm-opt-desc{
  color:var(--wm-who-body);
  line-height:1.55;
  font-size:12.5px;
}
#wmStep0 .wm-opt-arrow{
  color:var(--wm-who-arrow);
  padding:0 12px 0 4px;align-self:center;flex-shrink:0;
  opacity:0.95;
}
#wmStep0 .wm-eyebrow{color:var(--wm-who-body)}
#wmStep0 .wm-title{color:var(--wm-who-title)}
#wmStep0 .wm-subtitle{color:var(--wm-who-body);font-size:14px}
#wmStep0 .wm-note{color:var(--wm-who-body)}
#wmStep0 .wm-note a{color:var(--wm-who-emp-fg);font-weight:600}
#wmStep0 .wm-note a:hover{color:var(--wm-who-title);text-decoration-thickness:1.5px}
#wmStep0 .wm-signin-prompt{
  text-align:center;
  font-size:14px;
  line-height:1.5;
  color:var(--wm-who-title);
  font-weight:600;
  margin:6px 0 14px;
  padding:0 4px;
}
#wmStep0 .wm-signin-prompt a{
  color:var(--wm-who-emp-fg);
  font-weight:800;
  text-decoration:underline;
  text-underline-offset:3px;
  white-space:nowrap;
}
#wmStep0 .wm-signin-prompt a:hover{
  color:var(--wm-who-title);
  text-decoration-thickness:1.4px;
}

.wm-opt-illus{
  width:100px;min-height:92px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;padding:8px;
  background:var(--bg);
  border-right:1px solid var(--border);
}
#wmStep0 .wm-opt-illus{
  background:var(--wm-who-illus-bg);
  border-right:1px solid var(--wm-who-border);
}
.wm-seeker:hover{border-color:rgba(160,120,40,0.4);background:#fffdf8}
.wm-employer:hover{border-color:rgba(26,138,122,0.35);background:var(--primary-faint)}

.wm-opt-illus svg{width:100%;height:auto;max-width:100px}
.wm-opt-body{flex:1;padding:12px 14px}
.wm-opt-tag{
  display:inline-block;font-size:8.5px;font-weight:800;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--gold);
  background:rgba(160,120,40,0.08);
  border:1px solid rgba(160,120,40,0.2);
  border-radius:100px;
  padding:4px 9px 3px;
  margin-bottom:6px;
  line-height:1.2;
}
.wm-opt-tag-teal{color:var(--teal);background:rgba(26,138,122,0.08);border-color:rgba(26,138,122,0.2)}
.wm-opt-title{font-family:var(--font);font-size:16px;font-weight:700;margin-bottom:4px;color:var(--text)}
.wm-opt-desc{font-size:12px;font-weight:400;color:var(--text-muted);line-height:1.5}
.wm-opt-arrow{
  display:flex;align-items:center;justify-content:center;
  color:var(--text);
  padding:0 10px;
}
.wm-note{font-size:11.5px;color:var(--text-muted);text-align:center;line-height:1.5;margin-top:8px}
.wm-note a{color:var(--sidebar);font-weight:600;text-decoration:underline}
.wm-form-header{margin-bottom:12px}
.wm-back{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13px;font-weight:500;color:var(--text-muted);
  background:transparent;
  border:0;appearance:none;-webkit-appearance:none;
  box-shadow:none;
  cursor:pointer;padding:4px 6px 10px 4px;margin:0 0 0 -4px;
  border-radius:8px;
  -webkit-tap-highlight-color:transparent;
}
.wm-back:hover{color:var(--text)}
.wm-back:focus{outline:none}
/* Replace default square focus ring with a soft, rounded focus */
.wm-back:focus-visible{outline:none;box-shadow:0 0 0 2px rgba(15,37,42,0.25)}
.wm-back:active{opacity:0.92}
.wm-step-badge{display:inline-block;font-size:9px;font-weight:700;letter-spacing:0.1em;padding:4px 10px;border-radius:100px;margin-bottom:8px}
.wm-step-badge-gold{background:rgba(160,120,40,0.08);color:var(--gold);border:1px solid rgba(160,120,40,0.22)}
.wm-step-badge-teal{background:rgba(26,138,122,0.1);color:var(--teal);border:1px solid rgba(26,138,122,0.2)}
.wm-progress{height:3px;background:var(--border);border-radius:2px;margin:12px 0 20px;overflow:hidden}
.wm-progress-fill{height:100%;background:linear-gradient(90deg,var(--sidebar),#c9a84c);transition:width 0.4s}
.wm-progress-fill.wm-progress-teal{background:linear-gradient(90deg,var(--teal),var(--teal-lt))}
.wm-form{display:flex;flex-direction:column;gap:12px}
.wf-row{display:grid;gap:10px}
.wf-row-2{grid-template-columns:1fr 1fr}
.wf-field{display:flex;flex-direction:column;gap:4px}
.wf-label{font-size:12px;font-weight:500;color:var(--text-mid)}
.wf-req{color:#c01c1c}
.wf-input{
  width:100%;font-family:var(--font);font-size:15px;
  color:var(--text);background:var(--bg);border:1.5px solid var(--border-mid);
  border-radius:10px;padding:10px 12px;transition:border-color .2s,box-shadow 0.2s;outline:none;
}
.wf-input:focus{border-color:var(--sidebar);box-shadow:0 0 0 3px rgba(14,42,47,0.06)}
.wf-hint{font-size:11px;color:var(--text-muted)}
.wf-input-icon-wrap{position:relative}
.wf-input-padded{padding-left:38px;padding-right:38px}
.wf-input-padded.wf-input-pr{padding-right:46px}
.wf-input-icon-left{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--text-faint)}
.wf-input-icon-left svg{width:15px;height:15px}
.wf-eye-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:var(--text-faint)}
.wf-match-msg{font-size:11px;min-height:16px}
.wf-match-ok{color:var(--teal);font-weight:500}
.wf-match-err{color:#c01c1c}
.wf-error{display:none;border-radius:9px;padding:9px 12px;font-size:12px;background:#fef2f2;border:1px solid rgba(176,24,24,0.15);color:#8a1c1c;margin-top:4px}
.wf-error.visible{display:block}
.wf-submit{
  display:flex;align-items:center;justify-content:center;width:100%;
  margin-top:6px;padding:14px 20px;border-radius:var(--radius-pill);border:none;
  font-family:var(--font);font-size:15px;font-weight:700;cursor:pointer;
  transition:transform 0.2s,box-shadow 0.2s,background 0.2s;
}
.wf-submit-gold{background:var(--sidebar);color:var(--primary)}
.wf-submit-gold:hover{background:var(--dark-mid);transform:translateY(-1px);box-shadow:0 8px 24px rgba(7,25,25,0.12)}
.wf-submit-teal{background:var(--teal);color:var(--white)}
.wf-submit-teal:hover{background:var(--teal-lt);transform:translateY(-1px)}

/* Tilogin-style: create-account in-flight (pulsing mint dots on CTA) */
.wf-submit:disabled{cursor:wait;opacity:1}
.wf-submit.wf-submit--loading{
  pointer-events:none;cursor:wait;transform:none;box-shadow:none;
}
.wf-submit.wf-submit--loading.wf-submit-gold:hover{transform:none;box-shadow:none}
.wf-submit.wf-submit--loading.wf-submit-teal:hover{transform:none}
.wf-submit .wf-dots{
  display:flex;align-items:center;justify-content:center;gap:5px;min-height:1.1em;
}
.wf-submit .wf-dots > span{
  width:7px;height:7px;border-radius:50%;
  background:rgba(160, 224, 193, 0.78);
  animation:wf-dots-pulse 0.8s ease-in-out infinite;
}
.wf-submit .wf-dots > span:nth-child(2){animation-delay:0.16s}
.wf-submit .wf-dots > span:nth-child(3){animation-delay:0.32s}
@keyframes wf-dots-pulse{
  0%, 100%{opacity:0.35;transform:scale(0.75)}
  50%{opacity:1;transform:scale(1)}
}

/* —— Create account: job seeker + employer (shared --ca-* palette) —— */
:is(#wmStepSeeker, #wmStepEmployer) .wm-form-header{
  margin-bottom:0;
  padding-bottom:18px;
  border-bottom:1px solid var(--ca-divider);
  margin-bottom:20px;
}
:is(#wmStepSeeker, #wmStepEmployer) .wm-back{
  color:var(--ca-text);
  font-weight:600;
}
:is(#wmStepSeeker, #wmStepEmployer) .wm-back:focus-visible{
  box-shadow:0 0 0 2px rgba(15,37,42,0.2);
}
:is(#wmStepSeeker, #wmStepEmployer) .wm-back:hover{color:var(--ca-text-deep);opacity:0.85}
:is(#wmStepSeeker, #wmStepEmployer) .wm-form-title-wrap .wm-title{
  font-family:var(--font);
  font-weight:800;
  font-size:clamp(1.15rem,1.1rem + 1.2vw,1.4rem);
  line-height:1.25;
  color:var(--ca-text);
  margin:0 0 6px;
  letter-spacing:-0.02em;
}
:is(#wmStepSeeker, #wmStepEmployer) .wm-form-title-wrap .wm-subtitle{
  color:var(--ca-subtext);
  font-size:14px;
  line-height:1.5;
  font-weight:400;
  margin:0;
  max-width:32rem;
}
:is(#wmStepSeeker, #wmStepEmployer) .wm-step-badge.wm-step-badge-gold{
  background:var(--ca-tag-bg);
  color:var(--ca-tag-fg);
  border:1px solid rgba(92,74,46,0.18);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:0.12em;
  font-size:9px;
  padding:6px 12px 5px;
}
:is(#wmStepSeeker, #wmStepEmployer) .wm-progress{
  background:rgba(15,37,42,0.1);
  height:3px;
  border-radius:3px;
  margin:0 0 20px;
}
:is(#wmStepSeeker, #wmStepEmployer) .wm-progress-fill{
  background:linear-gradient(90deg, var(--ca-text) 0%, #1a3d45 100%);
  border-radius:3px;
}
:is(#wmStepSeeker, #wmStepEmployer) .wm-form{gap:16px}
:is(#wmStepSeeker, #wmStepEmployer) .wf-field{gap:6px}
:is(#wmStepSeeker, #wmStepEmployer) .wf-label{
  color:var(--ca-text);
  font-weight:700;
  font-size:12.5px;
  letter-spacing:0.01em;
}
:is(#wmStepSeeker, #wmStepEmployer) .wf-req{color:var(--ca-accent)}
:is(#wmStepSeeker, #wmStepEmployer) .wf-optional{
  color:var(--ca-accent);
  font-size:12px;
  font-weight:500;
  text-transform:lowercase;
  letter-spacing:0;
  margin-left:2px;
}
:is(#wmStepSeeker, #wmStepEmployer) .wf-input{
  color:var(--ca-text);
  background:var(--ca-surface);
  border:1.5px solid var(--ca-border);
  border-radius:10px;
  padding:12px 14px;
  min-height:48px;
  font-size:15px;
}
:is(#wmStepSeeker, #wmStepEmployer) .wf-input::placeholder{
  color:var(--ca-subtext);
  opacity:1;
}
:is(#wmStepSeeker, #wmStepEmployer) .wf-input:hover{border-color:#b8bfc2}
:is(#wmStepSeeker, #wmStepEmployer) .wf-input:focus{
  border-color:var(--ca-text);
  box-shadow:0 0 0 3px rgba(15, 37, 42, 0.08);
  outline:none;
}
:is(#wmStepSeeker, #wmStepEmployer) .wf-hint{
  color:var(--ca-subtext);
  font-size:12px;
  margin-top:2px;
}
:is(#wmStepSeeker, #wmStepEmployer) .wf-input-icon-left{color:var(--ca-subtext)}
:is(#wmStepSeeker, #wmStepEmployer) .wf-eye-btn{color:var(--ca-subtext);padding:8px;opacity:0.95}
:is(#wmStepSeeker, #wmStepEmployer) .wf-eye-btn:hover{color:var(--ca-text);background:rgba(15,37,42,0.04);border-radius:8px}
:is(#wmStepSeeker, #wmStepEmployer) .wf-input-padded{padding-left:40px}
:is(#wmStepSeeker, #wmStepEmployer) .wf-input-pr.wf-input-padded{padding-right:48px}
:is(#wmStepSeeker, #wmStepEmployer) .wf-input-icon-left{left:14px}
:is(#wmStepSeeker, #wmStepEmployer) .wf-input-icon-left svg{width:16px;height:16px;opacity:0.95}
:is(#wmStepSeeker, #wmStepEmployer) .wf-error{
  background:#fef6f5;
  border:1px solid rgba(217, 83, 79, 0.35);
  color:#9c2b28;
}
:is(#wmStepSeeker, #wmStepEmployer) .wf-match-ok{color:#2d6A4F}
:is(#wmStepSeeker, #wmStepEmployer) .wf-match-err{color:var(--ca-accent);font-weight:500}
:is(#wmStepSeeker, #wmStepEmployer) .wf-submit.wf-submit-gold{
  /* Create account: theme (sidebar + mint) — see .wf-submit-gold */
  background:var(--sidebar);
  color:var(--primary);
  min-height:52px;
  font-size:16px;
  font-weight:700;
  border-radius:var(--radius-pill);
  box-shadow:0 4px 20px rgba(7, 25, 25, 0.12);
  margin-top:8px;
  padding:15px 22px;
}
:is(#wmStepSeeker, #wmStepEmployer) .wf-submit.wf-submit-gold:hover{
  background:var(--dark-mid);
  color:var(--primary);
  box-shadow:0 8px 24px rgba(7, 25, 25, 0.14);
  transform:translateY(-1px);
}

.wf-optional{
  display:inline;
  color:var(--text-muted);
  font-size:0.9em;
  font-weight:500;
}

.wm-success{padding:8px 8px 20px;text-align:center}
.wm-success-icon{
  width:64px;height:64px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(26,138,122,0.1);color:var(--teal);
  border:1.5px solid rgba(26,138,122,0.2);
  margin:0 auto 20px;
}
.wm-success-icon svg{width:34px;height:34px}
.wm-success-title{font-family:var(--disp);font-size:24px;font-weight:400;margin:0 0 8px}
.wm-success-desc{color:var(--text-sub);font-size:14px;line-height:1.6;max-width:380px;margin:0 auto 20px}
.wm-success-close{
  padding:12px 32px;border-radius:var(--radius-pill);
  background:var(--sidebar);color:var(--primary);font-weight:600;border:none;cursor:pointer;font-size:14px;
}
.wm-success-close:hover{background:var(--dark-mid)}

.qual-top-bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:8px;padding:12px 0 0}
.qual-top-bar--end{justify-content:flex-end}

/* —— Tablet / small desktop: same row until 700px (tilogin) —— */
@media(max-width:800px) and (min-width:701px){
  .auth-visual{padding:36px 28px 32px;flex-basis:44%}
  .auth-form-col{padding:32px 24px}
}

/* —— Mobile: full-viewport hero + form sheet over illustration (tilogin) —— */
@media(max-width:700px){
  html:has(.auth-shell),body:has(.auth-shell){min-height:100%;}
  body.page-auth-signin,body.page-auth-qualify{
    min-height:100dvh;min-height:100svh;min-height:-webkit-fill-available;
    overflow:hidden;
  }
  .auth-shell{
    flex-direction:column;
    background:var(--sidebar);
    position:relative;
    height:100dvh;max-height:100dvh;
    min-height:100dvh;min-height:100svh;min-height:-webkit-fill-available;
    overflow:hidden;
  }
  /* Full-screen art layer (no document scroll: form stacks on top) */
  .auth-visual{
    position:absolute;inset:0;z-index:0;
    flex:none;max-width:100%;width:100%;height:100%;
    min-width:0;min-height:0;justify-content:flex-start;
    padding:max(18px, calc(10px + env(safe-area-inset-top,0px))) 22px max(20px, env(safe-area-inset-bottom, 0px));
    overflow:hidden;
  }
  .auth-visual::before{
    width:min(100vw,320px);height:min(100vw,320px);
    top:-70px;right:-60px;opacity:1;
  }
  .auth-visual::after{opacity:0.6;bottom:20%}
  .auth-v-inner{
    min-height:100%;
    max-height:100%;
    height:100%;
    gap:12px;
    box-sizing:border-box;
    justify-content:flex-start;
  }
  .auth-v-headline h1{
    font-size:clamp(24px,5.8vw,30px);
    line-height:1.12;
    margin-bottom:6px;
  }
  .auth-v-headline p{
    font-size:12.5px;
    line-height:1.55;
    max-width:100%;
    color:rgba(160,224,193,0.8);
  }
  .ill-center{
    padding:0 0 4px;
    flex:1 1 auto;
    min-height:0;
    align-items:center;
    max-height:min(38dvh, 240px);
  }
  .ill-center svg{
    max-width:min(100%,280px);
    max-height:min(32dvh, 200px, 32vw);
  }
  .auth-v-badges{display:none}

  /* Fills shell; sheet pinned to bottom; top stays clear for brand (tilogin) */
  .auth-form-col{
    position:relative;z-index:2;
    flex:1 1 0;
    width:100%;
    min-height:0;
    height:100%;
    align-items:stretch;
    justify-content:flex-end;
    padding:0;
    background:linear-gradient(180deg, rgba(0,0,0,0) 0, rgba(0,0,0,0) 32%, rgba(7, 25, 25, 0.38) 68%, var(--bg) 100%);
    overflow:visible;
    pointer-events:none;
  }
  .page-auth-signin .auth-form-col{
    /* Softer fill behind short sheet: keep upper half clean for MyLamarin + headline */
    background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 42%, rgba(7, 25, 25, 0.28) 70%, var(--bg) 100%);
  }
  .auth-form-col .auth-skip,
  .auth-form-col .qual-top-bar,
  .auth-form-col .auth-card--light,
  .auth-form-col .si-page-card{
    pointer-events:auto;
  }
  /* Sign-up / qualification: taller sheet; sign-in: short bottom sheet (tilogin) so hero/brand stay visible */
  .auth-form-col .auth-card--light{
    max-width:100% !important;
    width:100%;
    margin:0;
    max-height:min(92dvh, 92svh);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    border-radius:20px 20px 0 0;
    padding:22px 20px max(20px, calc(12px + env(safe-area-inset-bottom,0px)));
    box-shadow:0 -20px 56px rgba(0,0,0,0.28);
    border:1px solid rgba(255, 255, 255, 0.14);
    border-bottom:none;
  }
  .auth-form-col .si-page-card{
    max-width:100% !important;
    width:100%;
    margin:0;
    /* ~35–40% of viewport = hero+brand; sheet scrolls if needed */
    max-height:min(64dvh, 68svh, 500px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    border-radius:20px 20px 0 0;
    padding:18px 18px max(16px, calc(10px + env(safe-area-inset-bottom,0px)));
    box-shadow:0 -20px 56px rgba(0,0,0,0.28);
    border:1px solid rgba(255, 255, 255, 0.14);
    border-bottom:none;
  }
  .auth-qual-pad .wm-step{padding:20px 18px 22px}
  .page-auth-qualify .auth-form-col{padding:0;justify-content:flex-end}
  .page-auth-qualify #qualContent{max-width:100%}
  .page-auth-qualify .auth-card--light{margin-top:0 !important}
  #qualContent{max-height:min(60dvh, 62svh)}

  .page-auth-qualify .auth-skip{display:none}
  .auth-skip{
    top:max(8px, calc(6px + env(safe-area-inset-top,0px)));
    right:16px;left:auto;
  }
  .auth-skip a{color:rgba(255, 255, 255, 0.9);font-weight:500}
  .auth-skip a:hover{color:var(--primary)}

  .auth-form-col .qual-top-bar{
    position:absolute;left:0;right:0;z-index:4;max-width:100% !important;
    justify-content:flex-end;
  }
  .page-auth-qualify .qual-top-bar{
    top:max(6px, calc(2px + env(safe-area-inset-top,0px)));
    padding:4px 16px 0;left:0;right:0;z-index:4;margin:0;max-width:100% !important;
  }
  .page-auth-qualify .qual-top-bar a[href$="sign-in"]{color:var(--primary) !important}

  .page-auth-signin .auth-form-col{justify-content:flex-end;padding:0}
  /* Tighter sign-in: smaller duplicate header + fields so 64vh sheet often fits with less scroll */
  .page-auth-signin .auth-form-col .si-header{margin-bottom:10px;align-items:center}
  .page-auth-signin .auth-form-col .si-logo{width:40px;height:40px}
  .page-auth-signin .auth-form-col .si-logo img{border-radius:10px}
  .page-auth-signin .auth-form-col .si-eyebrow{margin-bottom:2px;font-size:9px}
  .page-auth-signin .auth-form-col .si-title{
    font-size:clamp(1.05rem,4.2vw,1.2rem);
    line-height:1.15;
    margin:0 0 2px;
  }
  .page-auth-signin .auth-form-col .si-subtitle{margin:0 0 14px;font-size:12.5px;line-height:1.45;max-width:none}
  .page-auth-signin .auth-form-col .si-tabs{margin-bottom:12px}
  .page-auth-signin .auth-form-col .si-tab{min-height:36px;padding:7px 6px 6px;font-size:12px}
  .page-auth-signin .auth-form-col .si-page-card .si-field{margin-bottom:12px}
  .page-auth-signin .auth-form-col .si-remember{margin-top:2px;margin-bottom:0}
  .page-auth-signin .auth-form-col .si-page-card .si-error{margin-top:0}
  .page-auth-signin .auth-form-col .si-page-card .si-divider{margin:12px 0 10px}
  .page-auth-signin .auth-form-col .si-page-card .si-foot-note{margin-top:10px}
  .page-auth-signin .ill-center{
    max-height:min(20dvh, 120px);
  }
  .page-auth-signin .ill-center svg{max-height:min(18dvh, 110px);}

  .si-input{ font-size:16px }
  .si-input-wrap{min-height:50px}
  .si-submit{min-height:50px;font-size:16px}
}
@media(max-width:400px){
  .auth-visual{padding:max(14px, calc(8px + env(safe-area-inset-top,0px))) 16px 16px}
  .auth-qual-pad .wm-step,.page-auth-qualify .auth-qual-pad .wm-step{padding:16px 14px 20px}
  .page-auth-qualify .auth-card--light,.page-auth-signin .auth-form-col .si-page-card{padding:20px 16px}
  #wmStep0 .wm-signin-prompt{font-size:13px;margin:4px 0 12px}
}
@media(max-width:600px){
  .wf-row-2{grid-template-columns:1fr}
  .wm-opt-illus{max-width:88px}
}
@media(max-width:400px){
  .wm-opt-illus{display:none}
  .wm-opt-body{padding:14px}
}

.qual-top-bar a{font-size:13px;color:var(--text-muted);text-decoration:none}
.qual-top-bar a:hover{color:var(--text)}

.spinner {
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255,255,255,0.3);
  border-top: 2px solid #fff;
  border-radius: 50%;
  display: inline-block;
  animation: spin 0.6s linear infinite;
  margin-right: 6px;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.wf-submit.loading {
  opacity: 0.7;
  pointer-events: none;
}