/* ==========================================================================
   Vanta Family Join v5.0 — recruitment experience
   Deep violet-on-black, layered light, zero legacy pseudo sheens.
   Full replacement. Does not style the .vanta-auth form controls.
   ========================================================================== */

:root{
  --fj-void:#050409;
  --fj-ink:#09060f;
  --fj-panel:#120d1e;
  --fj-panel-2:#181027;
  --fj-well:#0b0814;
  --fj-line:rgba(196,181,253,.12);
  --fj-line-2:rgba(196,181,253,.26);
  --fj-text:#f4f1fb;
  --fj-text-2:rgba(238,232,251,.76);
  --fj-muted:rgba(238,232,251,.60);
  --fj-faint:rgba(238,232,251,.42);
  --fj-violet:#8b5cf6;
  --fj-violet-2:#a78bfa;
  --fj-violet-3:#c4b5fd;
  --fj-green:#5ee2b1;
  --fj-rose:#fb7185;
  --fj-amber:#fbbf24;
  --fj-ease:cubic-bezier(.2,.75,.25,1);
}

html.fj-modal-open,html.fj-modal-open body{overflow:hidden!important}

/* every button effect in this experience is built from backgrounds and
   shadows — legacy pseudo sheens are removed so nothing can misplace. */
.fj-login-cta button::before,.fj-login-cta button::after,
.fj-modal button::before,.fj-modal button::after{
  content:none!important;display:none!important;animation:none!important;background:none!important;box-shadow:none!important;
}

/* ==========================================================================
   Login entry CTA
   ========================================================================== */
.fj-login-cta{position:relative;margin-top:24px;padding-top:24px}
.fj-login-cta::before{
  content:"";position:absolute;top:0;left:6%;right:6%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(196,181,253,.34),transparent);
}
.fj-cta-shell{
  position:relative;isolation:isolate;width:100%;display:grid;
  grid-template-columns:60px minmax(0,1fr) 40px;align-items:center;gap:16px;
  padding:20px 18px;text-align:right;direction:rtl;appearance:none;-webkit-appearance:none;cursor:pointer;overflow:hidden;
  border:1px solid transparent;border-radius:22px;
  background-image:
    linear-gradient(100deg,transparent 36%,rgba(255,255,255,.10) 50%,transparent 64%),
    radial-gradient(320px 180px at 84% -40%,rgba(139,92,246,.30),transparent 72%),
    linear-gradient(150deg,rgba(30,20,52,.96),rgba(13,9,22,.96)),
    linear-gradient(150deg,rgba(196,181,253,.34),rgba(139,92,246,.10) 42%,rgba(196,181,253,.20));
  background-origin:padding-box,padding-box,padding-box,border-box;
  background-clip:padding-box,padding-box,padding-box,border-box;
  background-size:220% 100%,100% 100%,100% 100%,100% 100%;
  background-position:220% 0,0 0,0 0,0 0;
  background-repeat:no-repeat;
  box-shadow:0 26px 60px -28px rgba(76,29,149,.95),inset 0 1px 0 rgba(255,255,255,.08);
  transition:background-position .9s var(--fj-ease),transform .24s var(--fj-ease),box-shadow .28s var(--fj-ease);
}
.fj-cta-shell:hover:not(:disabled){transform:translateY(-3px);background-position:-120% 0,0 0,0 0,0 0;box-shadow:0 36px 74px -28px rgba(109,40,217,1),inset 0 1px 0 rgba(255,255,255,.12)}
.fj-cta-shell:active:not(:disabled){transform:translateY(-1px)}
.fj-cta-shell:focus-visible{outline:3px solid rgba(167,139,250,.36);outline-offset:3px}
.fj-cta-shell:disabled{cursor:not-allowed;opacity:.6}
.fj-cta-shell.is-full{
  background-image:
    linear-gradient(100deg,transparent 36%,rgba(255,255,255,.08) 50%,transparent 64%),
    radial-gradient(320px 180px at 84% -40%,rgba(251,113,133,.22),transparent 72%),
    linear-gradient(150deg,rgba(36,16,26,.96),rgba(14,8,14,.96)),
    linear-gradient(150deg,rgba(251,113,133,.30),rgba(251,113,133,.08) 42%,rgba(251,113,133,.18));
}

.fj-cta-topline{
  grid-column:2;grid-row:1;justify-self:end;
  display:inline-flex;align-items:center;gap:8px;
  color:rgba(213,199,248,.62);
  font:800 10.5px/1 Inter,system-ui,sans-serif;letter-spacing:.24em;direction:ltr;
}
.fj-cta-orb{
  grid-column:1;grid-row:1/span 3;
  position:relative;width:60px;height:60px;display:grid;place-items:center;border-radius:20px;
  background:
    linear-gradient(160deg,rgba(255,255,255,.28),rgba(255,255,255,0) 46%),
    linear-gradient(150deg,#4c1d95,#7c3aed 54%,#a78bfa);
  border:1px solid rgba(216,204,255,.32);
  box-shadow:0 20px 40px -14px rgba(109,40,217,.95),inset 0 1px 0 rgba(255,255,255,.34),inset 0 -12px 20px rgba(23,8,48,.42);
}
.fj-cta-orb span{font:900 24px/1 Inter,system-ui,sans-serif;color:#fff;text-shadow:0 2px 14px rgba(23,8,48,.6)}
.fj-cta-orb i{
  position:absolute;right:-4px;bottom:-4px;width:16px;height:16px;
  border:3px solid #0d0918;border-radius:50%;background:var(--fj-green);
  box-shadow:0 0 14px rgba(94,226,177,.8);
}
.fj-cta-shell.is-full .fj-cta-orb{background:linear-gradient(160deg,rgba(255,255,255,.24),rgba(255,255,255,0) 46%),linear-gradient(150deg,#7f1d3a,#be3455 54%,#fb7185)}
.fj-cta-shell.is-full .fj-cta-orb i{background:var(--fj-rose);box-shadow:0 0 14px rgba(251,113,133,.8)}

.fj-cta-copy{grid-column:2;grid-row:2;display:block;margin-top:6px}
.fj-cta-copy strong{
  display:block;font-size:19px;line-height:1.45;font-weight:900;letter-spacing:-.3px;
  background:linear-gradient(180deg,#ffffff,#efe7ff 58%,#c9b6ff);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
}

.fj-cta-meter{grid-column:2;grid-row:3;display:flex;align-items:center;gap:12px;margin-top:13px;direction:rtl}
.fj-cta-meter-track{
  position:relative;flex:1;height:9px;border-radius:999px;
  background:rgba(2,1,6,.62);border:1px solid rgba(196,181,253,.12);
  box-shadow:inset 0 1px 4px rgba(0,0,0,.6);overflow:hidden;
}
.fj-cta-meter-track i{
  position:absolute;inset:1px auto 1px 1px;border-radius:999px;
  background:linear-gradient(90deg,#5b21b6,#8b5cf6 60%,#c4b5fd);
  box-shadow:0 0 16px rgba(139,92,246,.85);
  transition:width .8s var(--fj-ease);
}
.fj-cta-shell.is-full .fj-cta-meter-track i{background:linear-gradient(90deg,#9f1239,#fb7185);box-shadow:0 0 16px rgba(251,113,133,.7)}
.fj-cta-meter-legend{flex:0 0 auto;display:inline-flex;align-items:baseline;gap:6px;white-space:nowrap}
.fj-cta-meter-legend b{color:#fff;font-size:14px;font-weight:900;text-shadow:0 0 16px rgba(167,139,250,.6)}
.fj-cta-meter-legend small{color:var(--fj-faint);font-size:11.5px;font-weight:600}

.fj-cta-status{
  grid-column:2;grid-row:3;justify-self:start;
  display:inline-flex;align-items:center;gap:9px;min-height:32px;margin-top:13px;padding:0 14px;
  border-radius:999px;border:1px solid rgba(94,226,177,.24);
  background:linear-gradient(180deg,rgba(94,226,177,.14),rgba(94,226,177,.05));
  color:#a7f3d0;white-space:nowrap;
}
.fj-cta-status i{width:7px;height:7px;border-radius:50%;background:var(--fj-green);box-shadow:0 0 12px rgba(94,226,177,.9);animation:fjBeat 3s ease-in-out infinite}
.fj-cta-status b{font-size:12px;font-weight:800}
.fj-cta-status.is-full{color:#fecdd3;border-color:rgba(251,113,133,.26);background:linear-gradient(180deg,rgba(251,113,133,.14),rgba(251,113,133,.05))}
.fj-cta-status.is-full i{background:var(--fj-rose);box-shadow:0 0 12px rgba(251,113,133,.9)}
@keyframes fjBeat{0%,100%{opacity:.62;transform:scale(.92)}50%{opacity:1;transform:scale(1.08)}}

.fj-cta-arrow{
  grid-column:3;grid-row:1/span 3;align-self:center;
  width:40px;height:40px;display:grid;place-items:center;border-radius:14px;
  border:1px solid rgba(196,181,253,.18);
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.03));
  color:#efe7ff;font-size:17px;line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
  transition:transform .26s var(--fj-ease),background .26s var(--fj-ease),box-shadow .26s var(--fj-ease);
}
.fj-cta-shell:hover:not(:disabled) .fj-cta-arrow{transform:translateX(-5px);background:linear-gradient(180deg,rgba(139,92,246,.42),rgba(91,33,182,.34));box-shadow:0 12px 26px -12px rgba(139,92,246,.9),inset 0 1px 0 rgba(255,255,255,.2)}
.fj-cta-shell:disabled .fj-cta-arrow{opacity:.5}
.fj-cta-error{margin-top:12px;padding:12px 14px;border:1px solid rgba(251,113,133,.24);border-radius:14px;background:linear-gradient(180deg,rgba(88,20,36,.30),rgba(52,12,24,.18));color:#fecdd3;font-size:12px;line-height:1.7}

.fj-primary,.fj-secondary,.fj-chip,.fj-option,.fj-playtime-card,.fj-shift-card,.fj-personality-card,
.fj-counter-control button,.fj-nav-context button{appearance:none;-webkit-appearance:none;font:inherit;cursor:pointer;text-decoration:none;filter:none}

/* ==========================================================================
   Modal shell
   ========================================================================== */
.fj-modal-backdrop{
  position:fixed;inset:0;z-index:2147481400;display:none;align-items:center;justify-content:center;
  padding:clamp(12px,2.4vw,30px);
  background:radial-gradient(1200px 700px at 50% 0%,rgba(46,16,101,.62),transparent 66%),rgba(3,2,6,.86);
  backdrop-filter:blur(18px) saturate(1.1);
  animation:fjFade .3s var(--fj-ease) both;
}
@keyframes fjFade{from{opacity:0}to{opacity:1}}
.fj-modal{
  --fj-accent:139,92,246;position:relative;isolation:isolate;
  width:min(1140px,calc(100vw - 32px));max-height:min(92svh,920px);
  display:grid;grid-template-rows:minmax(0,1fr);overflow:hidden;
  border:1px solid transparent;border-radius:30px;
  background:
    linear-gradient(180deg,rgba(20,14,33,.985),rgba(8,6,13,.995)) padding-box,
    linear-gradient(150deg,rgba(196,181,253,.34),rgba(139,92,246,.10) 38%,rgba(255,255,255,.03) 62%,rgba(196,181,253,.20)) border-box;
  box-shadow:0 60px 140px -30px rgba(46,16,101,.95),0 30px 70px -40px rgba(0,0,0,1),inset 0 1px 0 rgba(255,255,255,.06);
  color:var(--fj-text);outline:0;
  animation:fjModalIn .42s var(--fj-ease) both;
}
@keyframes fjModalIn{from{opacity:0;transform:translateY(20px) scale(.985)}to{opacity:1;transform:none}}
.fj-modal::before{
  content:"";position:absolute;z-index:-3;inset:0;pointer-events:none;
  background:
    radial-gradient(820px 440px at 82% -10%,rgba(var(--fj-accent),.20),transparent 66%),
    radial-gradient(620px 340px at 0% 104%,rgba(91,33,182,.18),transparent 70%);
  transition:background .6s var(--fj-ease);
}
.fj-modal::after{
  content:"";position:absolute;z-index:-2;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(196,181,253,.030) 1px,transparent 1px),linear-gradient(90deg,rgba(196,181,253,.030) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.6),transparent 72%);
}
.fj-ambient{position:absolute;z-index:-1;inset:0;overflow:hidden;pointer-events:none}
.fj-ambient i{position:absolute;border-radius:50%;filter:blur(46px);opacity:.42;animation:fjDrift 24s ease-in-out infinite alternate}
.fj-ambient i:nth-child(1){width:260px;height:260px;top:-120px;right:18%;background:rgba(var(--fj-accent),.42)}
.fj-ambient i:nth-child(2){width:190px;height:190px;bottom:-80px;left:10%;background:rgba(91,33,182,.40);animation-delay:-8s}
.fj-ambient i:nth-child(3){width:150px;height:150px;top:44%;right:-90px;background:rgba(196,181,253,.22);animation-delay:-16s}
@keyframes fjDrift{from{transform:translate3d(-8px,-6px,0) scale(.96)}to{transform:translate3d(10px,8px,0) scale(1.08)}}

.fj-close{
  position:absolute;z-index:20;top:18px;left:18px;width:44px;height:44px;display:grid;place-items:center;
  border:1px solid rgba(196,181,253,.16);border-radius:15px;
  background:linear-gradient(180deg,rgba(30,21,48,.86),rgba(12,9,20,.86));
  color:rgba(240,234,252,.74);font:400 25px/1 Arial,sans-serif;cursor:pointer;backdrop-filter:blur(14px);
  box-shadow:0 14px 30px -18px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.08);
  transition:color .22s var(--fj-ease),border-color .22s var(--fj-ease),background .22s var(--fj-ease),box-shadow .22s var(--fj-ease);
}
.fj-close:hover{color:#fff;border-color:rgba(196,181,253,.42);background:linear-gradient(180deg,rgba(60,32,104,.92),rgba(24,14,42,.92));box-shadow:0 16px 34px -16px rgba(139,92,246,.9)}
.fj-close:focus-visible{outline:3px solid rgba(167,139,250,.34);outline-offset:2px}
.fj-modal-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(var(--fj-accent),.55) transparent}
.fj-modal-scroll::-webkit-scrollbar{width:10px}
.fj-modal-scroll::-webkit-scrollbar-track{background:transparent}
.fj-modal-scroll::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(var(--fj-accent),.75),rgba(var(--fj-accent),.35));border:3px solid transparent;background-clip:content-box;border-radius:999px}

.fj-wizard-stage{animation:fjStageIn .38s var(--fj-ease) both}
.fj-enter-back{animation-name:fjStageBack}
@keyframes fjStageIn{from{opacity:0;transform:translateX(-16px) scale(.995)}to{opacity:1;transform:none}}
@keyframes fjStageBack{from{opacity:0;transform:translateX(16px) scale(.995)}to{opacity:1;transform:none}}

/* ==========================================================================
   Hero
   ========================================================================== */
.fj-hero{
  direction:ltr;display:grid;grid-template-columns:minmax(0,1fr) minmax(400px,1fr);
  min-height:320px;margin:24px 26px 0;overflow:hidden;
  border:1px solid transparent;border-radius:26px;
  background:
    linear-gradient(150deg,rgba(32,22,54,.94),rgba(13,9,22,.97)) padding-box,
    linear-gradient(150deg,rgba(196,181,253,.26),rgba(139,92,246,.08) 44%,rgba(196,181,253,.14)) border-box;
  box-shadow:0 30px 70px -34px rgba(46,16,101,.9),inset 0 1px 0 rgba(255,255,255,.05);
}
.fj-hero-copy{
  grid-column:1;grid-row:1;direction:rtl;position:relative;
  padding:44px 44px 40px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:right;
  background:radial-gradient(420px 280px at 74% 44%,rgba(var(--fj-accent),.14),transparent 72%);
}
.fj-hero-media-wrap{grid-column:2;grid-row:1;position:relative;min-height:320px;overflow:hidden;background:#08060e;isolation:isolate}
.fj-hero--alt .fj-hero-copy{grid-column:2}
.fj-hero--alt .fj-hero-media-wrap{grid-column:1}
.fj-hero-media-wrap::before{content:"";position:absolute;inset:-26px;z-index:-2;background-image:var(--fj-step-image);background-position:center;background-size:cover;filter:blur(32px) brightness(.42) saturate(1.1);transform:scale(1.14);opacity:.7}
.fj-hero-media-wrap::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:
    linear-gradient(180deg,transparent 48%,rgba(9,6,16,.52)),
    linear-gradient(90deg,rgba(10,7,18,.44),transparent 34%,transparent 72%,rgba(10,7,18,.24)),
    radial-gradient(520px 300px at 60% 30%,rgba(var(--fj-accent),.16),transparent 74%);
}
.fj-media-glow{position:absolute;z-index:1;width:230px;height:230px;right:12%;top:6%;border-radius:50%;background:radial-gradient(circle,rgba(var(--fj-accent),.30),transparent 70%);filter:blur(18px);pointer-events:none}
.fj-hero-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;display:block;filter:saturate(1.08) contrast(1.04);animation:fjKen 20s ease-in-out infinite alternate}
@keyframes fjKen{from{transform:scale(1.03)}to{transform:scale(1.10)}}
.fj-media-index{
  position:absolute;z-index:3;right:20px;bottom:16px;
  font:900 52px/1 Inter,system-ui,sans-serif;letter-spacing:-.05em;
  background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,.06));
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
}

.fj-eyebrow{
  display:inline-flex;align-items:center;min-height:30px;margin-bottom:16px;padding:0 14px;
  border:1px solid rgba(var(--fj-accent),.34);border-radius:999px;
  background:linear-gradient(180deg,rgba(var(--fj-accent),.24),rgba(var(--fj-accent),.07));
  color:#eee6ff;font:800 10.5px/1 Inter,system-ui,sans-serif;letter-spacing:.18em;
  box-shadow:0 10px 26px -14px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.10);
}
.fj-step-kicker{display:flex;align-items:center;gap:13px;margin-bottom:18px}
.fj-step-kicker>span{
  width:50px;height:50px;display:grid;place-items:center;border-radius:17px;
  background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,0) 48%),linear-gradient(150deg,rgba(var(--fj-accent),.55),rgba(var(--fj-accent),.18));
  border:1px solid rgba(var(--fj-accent),.42);color:#fff;font:900 15px/1 Inter,system-ui,sans-serif;
  box-shadow:0 14px 30px -14px rgba(var(--fj-accent),.95),inset 0 1px 0 rgba(255,255,255,.24);
}
.fj-step-kicker small{display:block;color:var(--fj-faint);font-size:11.5px;line-height:1.3;font-weight:600}
.fj-step-kicker b{display:block;margin-top:5px;color:#fff;font-size:14px;line-height:1.35;font-weight:850}
.fj-hero-copy h2{
  position:relative;display:block;max-width:520px;margin:0;padding-bottom:20px;color:#fff;
  font-size:clamp(26px,2.2vw,35px);line-height:1.52;font-weight:900;letter-spacing:-.5px;text-wrap:balance;
  text-shadow:0 16px 44px rgba(0,0,0,.5),0 0 30px rgba(var(--fj-accent),.18);
}
.fj-hero-copy h2::after{content:"";position:absolute;right:0;bottom:0;width:88px;height:3px;border-radius:999px;background:linear-gradient(90deg,rgba(var(--fj-accent),0),rgb(var(--fj-accent)) 46%,#f0e7ff);box-shadow:0 0 20px rgba(var(--fj-accent),.7)}
.fj-hero-copy>p{max-width:480px;margin:16px 0 0;color:var(--fj-text-2);font-size:14px;line-height:2;font-weight:500}
.fj-progress{width:min(370px,100%);display:flex;align-items:center;gap:13px;margin-top:26px}
.fj-progress-dots{flex:1;display:grid;grid-template-columns:repeat(8,1fr);gap:6px;direction:ltr}
.fj-progress-dots i{height:5px;border-radius:99px;background:rgba(255,255,255,.08);box-shadow:inset 0 1px 2px rgba(0,0,0,.5);transition:background .34s var(--fj-ease),box-shadow .34s var(--fj-ease)}
.fj-progress-dots i.is-done{background:rgba(var(--fj-accent),.55)}
.fj-progress-dots i.is-current{background:linear-gradient(90deg,rgb(var(--fj-accent)),#e9d5ff);box-shadow:0 0 14px rgba(var(--fj-accent),.85)}
.fj-progress>b{color:#e5dbff;font:800 12px/1 Inter,system-ui,sans-serif;direction:ltr;text-shadow:0 0 14px rgba(var(--fj-accent),.6)}

/* ==========================================================================
   Step body
   ========================================================================== */
.fj-step-body{position:relative;padding:34px 34px 38px;min-height:300px;direction:rtl;text-align:right}
.fj-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 2px 26px}
.fj-section-head>div{min-width:0}
.fj-section-kicker{display:block;margin-bottom:8px;color:rgb(var(--fj-accent));font-size:11.5px;line-height:1.3;font-weight:850;letter-spacing:.05em;text-shadow:0 0 18px rgba(var(--fj-accent),.5)}
.fj-section-head strong{position:relative;display:block;padding-bottom:13px;color:#fff;font-size:21px;line-height:1.55;font-weight:900;letter-spacing:-.3px}
.fj-section-head strong::after{content:"";position:absolute;right:0;bottom:0;width:52px;height:2px;border-radius:999px;background:linear-gradient(90deg,rgba(var(--fj-accent),0),rgb(var(--fj-accent)) 52%,#efe7ff);box-shadow:0 0 14px rgba(var(--fj-accent),.6)}
.fj-section-head p{margin:9px 0 0;color:var(--fj-muted);font-size:13px;line-height:1.9;font-weight:500}
.fj-eligibility{
  flex:0 0 auto;min-height:36px;display:inline-flex;align-items:center;padding:0 14px;border-radius:999px;
  font-size:12px;font-weight:800;
}
.fj-eligibility.is-ok{color:#a7f3d0;border:1px solid rgba(94,226,177,.26);background:linear-gradient(180deg,rgba(94,226,177,.14),rgba(94,226,177,.04));box-shadow:0 12px 26px -18px rgba(94,226,177,.9)}
.fj-eligibility.is-no{color:#fecdd3;border:1px solid rgba(251,113,133,.26);background:linear-gradient(180deg,rgba(251,113,133,.14),rgba(251,113,133,.04))}

/* shared glass card surface */
.fj-feature-card,.fj-eco-card,.fj-counter-card,.fj-playtime-card,.fj-shift-card,
.fj-activity-card,.fj-personality-card,.fj-contact-visual,.fj-contact-fields,.fj-track-card{
  border:1px solid transparent;
  background:
    linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.012)) padding-box,
    linear-gradient(160deg,rgba(196,181,253,.24),rgba(255,255,255,.03) 54%,rgba(139,92,246,.12)) border-box;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}

/* Step 1 — benefits */
.fj-feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.fj-feature-card{
  position:relative;display:grid;grid-template-columns:52px minmax(0,1fr);gap:17px;align-items:start;
  min-height:126px;padding:22px;border-radius:22px;overflow:hidden;
  transition:transform .26s var(--fj-ease),box-shadow .26s var(--fj-ease),background .26s var(--fj-ease);
}
.fj-feature-card:hover{
  transform:translateY(-3px);
  background:
    linear-gradient(160deg,rgba(var(--fj-accent),.14),rgba(255,255,255,.02)) padding-box,
    linear-gradient(160deg,rgba(var(--fj-accent),.55),rgba(255,255,255,.05) 56%,rgba(var(--fj-accent),.24)) border-box;
  box-shadow:0 28px 56px -30px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.10);
}
.fj-feature-icon{
  width:52px;height:52px;display:grid;place-items:center;border-radius:17px;
  background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,0) 48%),linear-gradient(150deg,rgba(var(--fj-accent),.48),rgba(var(--fj-accent),.16));
  border:1px solid rgba(var(--fj-accent),.38);color:#fff;font-size:20px;font-weight:800;
  box-shadow:0 14px 28px -14px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.22);
}
.fj-feature-card strong{display:block;color:#fff;font-size:15.5px;line-height:1.5;font-weight:850}
.fj-feature-card p{margin:8px 0 0;color:var(--fj-muted);font-size:12.5px;line-height:1.85;font-weight:500}
.fj-feature-card small{
  display:inline-block;margin-top:12px;padding:5px 11px;border-radius:999px;
  border:1px solid rgba(var(--fj-accent),.24);background:rgba(var(--fj-accent),.10);
  color:#ddd0ff;font-size:11px;font-weight:700;
}

/* Step 2 — ecosystem */
.fj-ecosystem{position:relative;min-height:262px;display:grid;grid-template-columns:1fr 176px 1fr;grid-template-rows:1fr 1fr;gap:16px 24px;align-items:stretch}
.fj-ecosystem::before,.fj-ecosystem::after{content:"";position:absolute;z-index:0;background:linear-gradient(90deg,transparent,rgba(var(--fj-accent),.42),transparent);box-shadow:0 0 14px rgba(var(--fj-accent),.35)}
.fj-ecosystem::before{height:1px;left:13%;right:13%;top:50%}
.fj-ecosystem::after{width:1px;top:16%;bottom:16%;left:50%;background:linear-gradient(180deg,transparent,rgba(var(--fj-accent),.42),transparent)}
.fj-eco-hub{
  grid-column:2;grid-row:1/3;z-index:2;align-self:center;justify-self:center;
  width:150px;height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  border-radius:46px;border:1px solid rgba(var(--fj-accent),.42);
  background:
    radial-gradient(circle at 34% 22%,rgba(255,255,255,.20),transparent 46%),
    radial-gradient(circle at 50% 50%,rgba(var(--fj-accent),.42),rgba(76,29,149,.30) 52%,rgba(14,10,24,.96) 78%);
  box-shadow:0 30px 66px -26px rgba(var(--fj-accent),1),inset 0 1px 0 rgba(255,255,255,.20);
}
.fj-eco-hub span{font:900 32px/1 Inter,system-ui,sans-serif;color:#fff;text-shadow:0 4px 20px rgba(23,8,48,.8)}
.fj-eco-hub strong{margin-top:10px;color:#e6dbff;font:800 12px/1 Inter,system-ui,sans-serif;letter-spacing:.14em}
.fj-eco-hub small{margin-top:7px;color:rgba(230,219,255,.52);font:600 9px/1 Inter,system-ui,sans-serif;letter-spacing:.10em}
.fj-eco-card{z-index:1;display:flex;flex-direction:column;justify-content:center;padding:22px;border-radius:20px;transition:transform .26s var(--fj-ease),box-shadow .26s var(--fj-ease)}
.fj-eco-card:hover{transform:translateY(-2px);box-shadow:0 24px 48px -30px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.10)}
.fj-eco-card b{color:#fff;font-size:14.5px;line-height:1.5;font-weight:850}
.fj-eco-card span{margin-top:7px;color:var(--fj-muted);font-size:12.5px;line-height:1.8}
.eco-1,.eco-3{text-align:left;direction:rtl}.eco-2,.eco-4{text-align:right;direction:rtl}
.fj-story-note{
  display:flex;align-items:center;gap:14px;margin-top:18px;padding:18px 20px;border-radius:18px;
  border:1px solid rgba(var(--fj-accent),.24);
  background:linear-gradient(120deg,rgba(var(--fj-accent),.14),rgba(var(--fj-accent),.03));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.fj-story-dot{width:11px;height:11px;flex:0 0 11px;border-radius:50%;background:rgb(var(--fj-accent));box-shadow:0 0 0 6px rgba(var(--fj-accent),.14),0 0 18px rgba(var(--fj-accent),.9)}
.fj-story-note b{display:block;color:#fff;font-size:14px;line-height:1.55;font-weight:850}
.fj-story-note div>span{display:block;margin-top:5px;color:var(--fj-muted);font-size:12.5px;line-height:1.75}

/* Step 3 — steppers */
.fj-counter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.fj-counter-card{position:relative;padding:24px;border-radius:24px;overflow:hidden}
.fj-counter-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.fj-counter-top span{color:var(--fj-faint);font:800 10.5px/1 Inter,system-ui,sans-serif;letter-spacing:.12em}
.fj-counter-top b{color:#fff;font-size:15px;font-weight:850}
.fj-counter-control{position:relative;z-index:1;direction:ltr;display:grid;grid-template-columns:58px minmax(90px,1fr) 58px;gap:13px;align-items:center;margin-top:20px}
.fj-counter-control button{
  width:58px;height:58px;border:1px solid rgba(var(--fj-accent),.34);border-radius:19px;
  color:#fff;font:300 30px/1 Arial,sans-serif;
  background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,0) 50%),linear-gradient(150deg,rgba(var(--fj-accent),.34),rgba(var(--fj-accent),.10));
  box-shadow:0 14px 28px -16px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.18);
  transition:transform .18s var(--fj-ease),box-shadow .22s var(--fj-ease),background .22s var(--fj-ease);
}
.fj-counter-control button:hover{background:linear-gradient(160deg,rgba(255,255,255,.18),rgba(255,255,255,0) 50%),linear-gradient(150deg,rgba(var(--fj-accent),.55),rgba(var(--fj-accent),.20));box-shadow:0 18px 36px -14px rgba(var(--fj-accent),1),inset 0 1px 0 rgba(255,255,255,.24)}
.fj-counter-control button:active{transform:scale(.93)}
.fj-counter-control strong{
  min-height:72px;display:grid;place-items:center;border-radius:20px;
  border:1px solid rgba(196,181,253,.16);
  background:linear-gradient(180deg,rgba(6,4,12,.86),rgba(14,10,24,.78));
  box-shadow:inset 0 2px 12px rgba(2,1,6,.8);
  color:#fff;font:900 32px/1 Inter,system-ui,sans-serif;text-shadow:0 0 24px rgba(var(--fj-accent),.6);
}
.fj-counter-scale{display:flex;align-items:center;gap:11px;margin-top:18px}
.fj-counter-scale i{height:4px;flex:1;border-radius:99px;background:linear-gradient(90deg,rgba(var(--fj-accent),.14),rgba(var(--fj-accent),.75),rgba(var(--fj-accent),.14));box-shadow:0 0 12px rgba(var(--fj-accent),.4)}
.fj-counter-scale span{color:var(--fj-faint);font-size:11.5px;white-space:nowrap}
.fj-helper{
  display:flex;align-items:center;gap:14px;margin-top:18px;padding:18px 20px;border-radius:18px;
  border:1px solid rgba(var(--fj-accent),.22);background:linear-gradient(120deg,rgba(var(--fj-accent),.12),rgba(var(--fj-accent),.03));
}
.fj-helper>span{width:40px;height:40px;display:grid;place-items:center;flex:0 0 40px;border-radius:13px;background:rgba(var(--fj-accent),.20);border:1px solid rgba(var(--fj-accent),.30);color:#fff}
.fj-helper b{display:block;color:#fff;font-size:13.5px;font-weight:850}
.fj-helper p{margin:5px 0 0;color:var(--fj-muted);font-size:12.5px;line-height:1.75}

/* Step 4 — playtime */
.fj-playtime-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.fj-playtime-card{
  position:relative;min-height:158px;padding:22px 22px 38px;text-align:right;color:#fff;border-radius:22px;
  transition:transform .26s var(--fj-ease),box-shadow .26s var(--fj-ease),background .26s var(--fj-ease);
}
.fj-playtime-card:hover{transform:translateY(-3px);box-shadow:0 26px 52px -30px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.10)}
.fj-playtime-card.is-active{
  background:
    linear-gradient(160deg,rgba(var(--fj-accent),.22),rgba(var(--fj-accent),.05)) padding-box,
    linear-gradient(160deg,rgba(var(--fj-accent),.85),rgba(var(--fj-accent),.30) 60%,rgba(255,255,255,.10)) border-box;
  box-shadow:0 28px 58px -28px rgba(var(--fj-accent),1),inset 0 1px 0 rgba(255,255,255,.14);
}
.fj-playtime-tag{
  display:inline-flex;min-height:28px;align-items:center;padding:0 12px;border-radius:999px;
  border:1px solid rgba(var(--fj-accent),.34);background:linear-gradient(180deg,rgba(var(--fj-accent),.24),rgba(var(--fj-accent),.06));
  color:#eee6ff;font-size:11.5px;font-weight:800;
}
.fj-playtime-card strong{display:block;margin-top:16px;font-size:16px;line-height:1.5;font-weight:850}
.fj-playtime-card p{margin:7px 0 0;color:var(--fj-muted);font-size:12.5px;line-height:1.8}
.fj-playtime-meter{position:absolute;left:22px;right:22px;bottom:20px;height:7px;overflow:hidden;border-radius:99px;background:rgba(2,1,6,.62);border:1px solid rgba(196,181,253,.10);box-shadow:inset 0 1px 4px rgba(0,0,0,.6)}
.fj-playtime-meter i{position:absolute;inset:0 auto 0 0;border-radius:inherit;background:linear-gradient(90deg,rgba(var(--fj-accent),.45),rgb(var(--fj-accent)));box-shadow:0 0 14px rgba(var(--fj-accent),.7)}
.fj-playtime-meter em{display:none}

/* Step 5 — shifts */
.fj-shift-timeline{display:flex;align-items:center;gap:10px;margin:2px 4px 20px;color:var(--fj-faint);font-size:11px}
.fj-shift-timeline span{white-space:nowrap}
.fj-shift-timeline i{height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(var(--fj-accent),.45),transparent)}
.fj-shift-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px}
.fj-shift-card{
  position:relative;min-height:140px;padding:20px 12px;text-align:center;color:#fff;overflow:hidden;border-radius:20px;
  transition:transform .26s var(--fj-ease),box-shadow .26s var(--fj-ease),background .26s var(--fj-ease);
}
.fj-shift-card:hover{transform:translateY(-3px);box-shadow:0 24px 48px -28px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.10)}
.fj-shift-card.is-active{
  background:
    linear-gradient(180deg,rgba(var(--fj-accent),.24),rgba(var(--fj-accent),.05)) padding-box,
    linear-gradient(160deg,rgba(var(--fj-accent),.85),rgba(var(--fj-accent),.28) 62%,rgba(255,255,255,.08)) border-box;
  box-shadow:0 26px 54px -26px rgba(var(--fj-accent),1),inset 0 1px 0 rgba(255,255,255,.14);
}
.fj-shift-card>i{position:absolute;left:22%;right:22%;bottom:0;height:3px;border-radius:99px 99px 0 0;background:transparent;transition:background .24s var(--fj-ease),box-shadow .24s var(--fj-ease)}
.fj-shift-card.is-active>i{background:linear-gradient(90deg,rgba(var(--fj-accent),.4),#efe7ff,rgba(var(--fj-accent),.4));box-shadow:0 0 16px rgba(var(--fj-accent),.9)}
.fj-shift-icon{
  width:46px;height:46px;display:grid;place-items:center;margin:0 auto 13px;border-radius:16px;
  border:1px solid rgba(var(--fj-accent),.34);color:#fff;font-size:19px;
  background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,0) 50%),linear-gradient(150deg,rgba(var(--fj-accent),.38),rgba(var(--fj-accent),.12));
  box-shadow:0 12px 26px -14px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.2);
}
.fj-shift-card strong{display:block;font-size:14px;font-weight:850}
.fj-shift-card small{display:block;margin-top:8px;color:var(--fj-faint);font:600 11px/1.4 Inter,system-ui,sans-serif;direction:ltr}
.fj-selected-shift{
  display:flex;align-items:center;gap:14px;margin-top:18px;padding:18px 20px;border-radius:18px;
  border:1px solid rgba(var(--fj-accent),.28);background:linear-gradient(120deg,rgba(var(--fj-accent),.14),rgba(var(--fj-accent),.03));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.fj-selected-shift>span{width:40px;height:40px;display:grid;place-items:center;border-radius:13px;background:rgba(var(--fj-accent),.24);border:1px solid rgba(var(--fj-accent),.32);color:#fff}
.fj-selected-shift>div{flex:1}
.fj-selected-shift small{display:block;color:var(--fj-faint);font-size:11.5px}
.fj-selected-shift strong{display:block;margin-top:5px;color:#fff;font-size:14px;font-weight:850}
.fj-selected-shift>b{color:var(--fj-green);font-size:17px;text-shadow:0 0 16px rgba(94,226,177,.7)}
.fj-selected-shift.is-empty{border-color:rgba(196,181,253,.12);background:rgba(255,255,255,.022)}
.fj-selected-shift.is-empty>span{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.08);color:var(--fj-faint)}

/* Step 6 — activities */
.fj-activity-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.fj-activity-card{padding:22px;border-radius:22px;transition:box-shadow .26s var(--fj-ease),transform .26s var(--fj-ease)}
.fj-activity-card:hover,.fj-activity-card:focus-within{transform:translateY(-2px);box-shadow:0 26px 52px -32px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.10)}
.fj-activity-top{display:flex;align-items:center;justify-content:space-between;gap:14px}
.fj-activity-title{display:flex;align-items:center;gap:14px;min-width:0}
.fj-activity-title>span{
  width:46px;height:46px;display:grid;place-items:center;flex:0 0 46px;border-radius:16px;
  border:1px solid rgba(var(--fj-accent),.34);color:#fff;font-size:18px;
  background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,0) 50%),linear-gradient(150deg,rgba(var(--fj-accent),.40),rgba(var(--fj-accent),.12));
  box-shadow:0 12px 26px -14px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.2);
}
.fj-activity-title strong{display:block;color:#fff;font-size:15px;line-height:1.45;font-weight:850}
.fj-activity-title small{display:block;margin-top:6px;color:var(--fj-muted);font-size:11.5px;line-height:1.6}
.fj-score-ring{
  --score:0;position:relative;width:60px;height:60px;display:grid;place-items:center;flex:0 0 60px;border-radius:50%;
  background:conic-gradient(rgb(var(--fj-accent)) calc(var(--score)*1%),rgba(255,255,255,.07) 0);
  box-shadow:0 0 22px -6px rgba(var(--fj-accent),.8);
}
.fj-score-ring::after{content:"";position:absolute;inset:5px;border-radius:50%;background:linear-gradient(180deg,#171026,#0e0a1a)}
.fj-score-ring b{position:relative;z-index:1;color:#fff;font:900 12.5px/1 Inter,system-ui,sans-serif;direction:ltr}
.fj-range-wrap{margin:20px 0 16px;direction:ltr!important}
.fj-range-wrap input[type=range]{direction:ltr!important;width:100%;height:32px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer}
.fj-range-wrap input[type=range]::-webkit-slider-runnable-track{height:12px;border-radius:999px;background:linear-gradient(90deg,#5b21b6 0,rgb(var(--fj-accent)) var(--fj-range,0%),rgba(255,255,255,.08) var(--fj-range,0%) 100%);box-shadow:inset 0 1px 4px rgba(0,0,0,.6)}
.fj-range-wrap input[type=range]::-moz-range-track{height:12px;border-radius:999px;background:rgba(255,255,255,.08)}
.fj-range-wrap input[type=range]::-moz-range-progress{height:12px;border-radius:999px;background:rgb(var(--fj-accent))}
.fj-range-wrap input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:26px;height:26px;margin-top:-7px;border-radius:50%;background:linear-gradient(180deg,#fff,#e6dcff);border:6px solid rgb(var(--fj-accent));box-shadow:0 4px 16px rgba(0,0,0,.5),0 0 18px rgba(var(--fj-accent),.8)}
.fj-range-wrap input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:6px solid rgb(var(--fj-accent));box-shadow:0 4px 16px rgba(0,0,0,.5)}
.fj-skill-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:16px;border-top:1px solid rgba(196,181,253,.10)}
.fj-skill-row>span{color:var(--fj-faint);font-size:12px}
.fj-activity-skill{display:flex;gap:9px}
.fj-chip{
  min-height:40px;padding:0 18px;border:1px solid rgba(196,181,253,.14);border-radius:13px;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));
  color:var(--fj-muted);font-size:12.5px;font-weight:800;
  transition:color .2s var(--fj-ease),background .2s var(--fj-ease),border-color .2s var(--fj-ease),box-shadow .2s var(--fj-ease);
}
.fj-chip:hover{color:#fff;border-color:rgba(var(--fj-accent),.40)}
.fj-chip.is-active{
  color:#fff;border-color:rgba(var(--fj-accent),.70);
  background:linear-gradient(180deg,rgba(var(--fj-accent),.42),rgba(var(--fj-accent),.16));
  box-shadow:0 14px 28px -16px rgba(var(--fj-accent),1),inset 0 1px 0 rgba(255,255,255,.20);
}

/* Step 7 — personality */
.fj-personality-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.fj-personality-card{
  position:relative;min-height:132px;display:grid;grid-template-columns:48px minmax(0,1fr) 32px;align-items:center;gap:16px;
  padding:22px;text-align:right;color:#fff;border-radius:22px;
  transition:transform .26s var(--fj-ease),box-shadow .26s var(--fj-ease),background .26s var(--fj-ease);
}
.fj-personality-card:hover{transform:translateY(-3px);box-shadow:0 26px 52px -30px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.10)}
.fj-personality-card.is-active{
  background:
    linear-gradient(160deg,rgba(var(--fj-accent),.20),rgba(var(--fj-accent),.04)) padding-box,
    linear-gradient(160deg,rgba(var(--fj-accent),.85),rgba(var(--fj-accent),.26) 62%,rgba(255,255,255,.08)) border-box;
  box-shadow:0 28px 56px -28px rgba(var(--fj-accent),1),inset 0 1px 0 rgba(255,255,255,.14);
}
.fj-personality-index{
  width:48px;height:48px;display:grid;place-items:center;border-radius:16px;
  border:1px solid rgba(var(--fj-accent),.34);color:#fff;font:900 13px/1 Inter,system-ui,sans-serif;
  background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,0) 50%),linear-gradient(150deg,rgba(var(--fj-accent),.36),rgba(var(--fj-accent),.10));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}
.fj-personality-card small{display:block;color:#cfbcff;font-size:11.5px;font-weight:800}
.fj-personality-card strong{display:block;margin-top:6px;font-size:15px;line-height:1.5;font-weight:850}
.fj-personality-card p{margin:8px 0 0;color:var(--fj-muted);font-size:12.5px;line-height:1.8}
.fj-personality-card>i{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(196,181,253,.14);color:var(--fj-green);font-style:normal;font-size:15px}
.fj-personality-card.is-active>i{border-color:rgba(94,226,177,.40);background:rgba(94,226,177,.12);box-shadow:0 0 20px -6px rgba(94,226,177,.9)}

/* Step 8 — contact */
.fj-contact-panel{display:grid;grid-template-columns:.9fr 1.1fr;gap:18px}
.fj-contact-visual,.fj-contact-fields{min-height:250px;border-radius:24px}
.fj-contact-visual{position:relative;overflow:hidden;padding:28px;display:flex;flex-direction:column;justify-content:center}
.fj-contact-visual>span{
  width:56px;height:56px;display:grid;place-items:center;margin-bottom:18px;border-radius:19px;
  border:1px solid rgba(var(--fj-accent),.42);color:#fff;font:900 20px/1 Inter,system-ui,sans-serif;
  background:linear-gradient(160deg,rgba(255,255,255,.22),rgba(255,255,255,0) 48%),linear-gradient(150deg,rgba(var(--fj-accent),.62),rgba(var(--fj-accent),.20));
  box-shadow:0 18px 36px -14px rgba(var(--fj-accent),1),inset 0 1px 0 rgba(255,255,255,.26);
}
.fj-contact-visual strong{font-size:19px;line-height:1.5;font-weight:900}
.fj-contact-visual p{margin:9px 0 0;color:var(--fj-muted);font-size:12.5px;line-height:1.85}
.fj-contact-flow{display:flex;align-items:center;gap:0;margin-top:24px;direction:ltr}
.fj-contact-flow i{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,.10);border:1px solid rgba(196,181,253,.14)}
.fj-contact-flow i.is-active{background:rgb(var(--fj-accent));border-color:transparent;box-shadow:0 0 0 5px rgba(var(--fj-accent),.14),0 0 16px rgba(var(--fj-accent),.9)}
.fj-contact-flow span{height:1px;flex:1;background:rgba(196,181,253,.14)}
.fj-contact-visual>small{margin-top:12px;color:var(--fj-faint);font-size:11.5px;line-height:1.6}
.fj-contact-fields{padding:26px;display:flex;flex-direction:column;justify-content:center}
.fj-field{display:block}
.fj-field+.fj-field{margin-top:18px}
.fj-field>span{display:block;margin:0 3px 10px;color:rgba(240,234,252,.82);font-size:12.5px;font-weight:800}
.fj-field input{
  width:100%;height:60px;padding:0 18px;box-sizing:border-box;outline:0;
  border:1px solid rgba(196,181,253,.16);border-radius:18px;
  background:linear-gradient(180deg,rgba(6,4,12,.86),rgba(14,10,24,.78));
  box-shadow:inset 0 2px 10px rgba(2,1,6,.7);
  color:#fff;font-family:inherit;font-size:14.5px;line-height:1;font-weight:700;direction:ltr;text-align:left;
  transition:border-color .22s var(--fj-ease),box-shadow .22s var(--fj-ease);
}
.fj-field input:focus{border-color:rgba(var(--fj-accent),.68);box-shadow:0 0 0 4px rgba(var(--fj-accent),.16),inset 0 2px 10px rgba(2,1,6,.6)}
.fj-field input::placeholder{color:rgba(238,232,251,.22);font-weight:500}
.fj-field>span em{margin-inline-start:7px;color:rgba(184,145,244,.66);font-size:9.5px;font-style:normal;font-weight:800}
.fj-field-hint{display:block;margin:7px 3px 0;color:rgba(240,234,252,.46);font-size:10px;line-height:1.55;font-weight:650;letter-spacing:.01em}
.fj-field input[dir="ltr"]{text-align:left;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.02em}
.fj-privacy-note{
  display:flex;align-items:center;gap:11px;margin-top:18px;padding:14px 16px;border-radius:15px;
  border:1px solid rgba(var(--fj-accent),.18);background:linear-gradient(120deg,rgba(var(--fj-accent),.10),rgba(var(--fj-accent),.02));
}
.fj-privacy-note span{color:#cfbcff}
.fj-privacy-note p{margin:0;color:var(--fj-muted);font-size:12px;line-height:1.75}

/* ==========================================================================
   Footer navigation
   ========================================================================== */
.fj-modal-actions{
  position:sticky;bottom:0;z-index:10;min-height:88px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;
  padding:18px 26px;border-top:1px solid rgba(196,181,253,.12);
  background:linear-gradient(180deg,rgba(14,10,24,.88),rgba(8,6,14,.96));
  backdrop-filter:blur(20px);
  box-shadow:0 -20px 46px -30px rgba(0,0,0,1);
}
.fj-nav-side{display:flex}.fj-nav-side--next{justify-content:flex-start}.fj-nav-side--back{justify-content:flex-end}
.fj-primary,.fj-secondary{min-height:56px;display:inline-flex;align-items:center;justify-content:center;gap:13px;border-radius:18px;font-weight:850;transition:background-position .9s var(--fj-ease),transform .22s var(--fj-ease),box-shadow .26s var(--fj-ease),border-color .22s var(--fj-ease),background .22s var(--fj-ease)}
.fj-primary{
  min-width:214px;padding:6px 8px 6px 20px;color:#fff;
  border:1px solid rgba(216,204,255,.32);
  background-image:
    linear-gradient(100deg,transparent 36%,rgba(255,255,255,.24) 50%,transparent 64%),
    linear-gradient(180deg,rgba(255,255,255,.24),rgba(255,255,255,0) 46%),
    linear-gradient(135deg,#4c1d95 0%,#6d28d9 46%,#8b5cf6 100%);
  background-size:220% 100%,100% 100%,100% 100%;
  background-position:220% 0,0 0,0 0;
  background-repeat:no-repeat;
  box-shadow:0 24px 50px -18px rgba(109,40,217,.95),inset 0 1px 0 rgba(255,255,255,.30),inset 0 -12px 22px rgba(23,8,48,.38);
}
.fj-primary span{font-size:14px}
.fj-primary i{
  width:44px;height:44px;display:grid;place-items:center;border-radius:15px;font-style:normal;font-size:17px;
  background:linear-gradient(180deg,rgba(255,255,255,.24),rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.24);
  transition:transform .22s var(--fj-ease);
}
.fj-primary:hover:not(:disabled){transform:translateY(-2px);background-position:-120% 0,0 0,0 0;box-shadow:0 32px 62px -18px rgba(124,58,237,1),inset 0 1px 0 rgba(255,255,255,.36)}
.fj-primary:hover:not(:disabled) i{transform:translateX(-4px)}
.fj-primary:active:not(:disabled){transform:translateY(0) scale(.995)}
.fj-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}
.fj-secondary{padding:0 22px;border:1px solid rgba(196,181,253,.16);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.015));color:var(--fj-text-2);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.fj-secondary span{font-size:13.5px}.fj-secondary i{font-style:normal}
.fj-secondary:hover{color:#fff;border-color:rgba(var(--fj-accent),.44);background:linear-gradient(180deg,rgba(var(--fj-accent),.20),rgba(var(--fj-accent),.06));box-shadow:0 16px 32px -20px rgba(var(--fj-accent),.9)}
.fj-nav-context{min-width:190px;text-align:center}
.fj-nav-context>div{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;direction:ltr}
.fj-nav-context i,.fj-nav-context button{height:18px;padding:0;border:0;background:transparent;position:relative;display:block}
body.is-login .fj-nav-context i::after,body.is-login .fj-nav-context button::after,
.fj-modal .fj-nav-context i::after,.fj-modal .fj-nav-context button::after{content:""!important;display:block!important;position:absolute;left:0;right:0;top:7px;height:4px;border-radius:99px;background:rgba(255,255,255,.08)!important;transition:background .26s var(--fj-ease),box-shadow .26s var(--fj-ease)}
.fj-modal .fj-nav-context .is-done::after{background:rgba(var(--fj-accent),.55)!important}
.fj-modal .fj-nav-context .is-current::after{background:linear-gradient(90deg,rgb(var(--fj-accent)),#e9d5ff)!important;box-shadow:0 0 12px rgba(var(--fj-accent),.85)!important}
.fj-nav-context button{cursor:pointer}
.fj-modal .fj-nav-context button:hover::after{background:#efe7ff!important}
.fj-nav-context small{display:block;margin-top:9px;color:var(--fj-faint);font-size:11.5px;line-height:1.2}
.fj-primary:focus-visible,.fj-secondary:focus-visible,.fj-playtime-card:focus-visible,.fj-shift-card:focus-visible,.fj-personality-card:focus-visible,.fj-chip:focus-visible,.fj-counter-control button:focus-visible,.fj-nav-context button:focus-visible,.fj-field input:focus-visible{outline:3px solid rgba(var(--fj-accent),.36);outline-offset:2px}

/* ==========================================================================
   Tracking / success
   ========================================================================== */
.fj-standalone{min-height:580px;padding:74px 42px 50px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;direction:rtl}
.fj-status-mark{
  width:92px;height:92px;display:grid;place-items:center;margin-bottom:22px;border-radius:30px;
  border:1px solid rgba(var(--fj-accent),.42);color:#fff;font-size:32px;font-weight:900;
  background:radial-gradient(circle at 32% 22%,rgba(255,255,255,.22),transparent 48%),linear-gradient(150deg,rgba(var(--fj-accent),.52),rgba(var(--fj-accent),.14));
  box-shadow:0 30px 62px -22px rgba(var(--fj-accent),1),inset 0 1px 0 rgba(255,255,255,.24);
}
.fj-standalone-kicker{color:rgba(216,204,255,.60);font:800 11px/1 Inter,system-ui,sans-serif;letter-spacing:.18em}
.fj-standalone h2{margin:14px 0 0;color:#fff;font-size:28px;line-height:1.55;font-weight:900}
.fj-standalone>p{max-width:600px;margin:12px auto 0;color:var(--fj-text-2);font-size:13.5px;line-height:1.95}
.fj-track-card{width:min(700px,100%);margin-top:28px;padding:24px;border-radius:24px;text-align:right}
.fj-track-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-bottom:20px;border-bottom:1px solid rgba(196,181,253,.12)}
.fj-track-code small{display:block;color:var(--fj-faint);font-size:11.5px}
.fj-track-code strong{display:block;margin-top:7px;color:#fff;font:900 19px/1.4 Inter,system-ui,sans-serif;direction:ltr;letter-spacing:.06em;text-shadow:0 0 22px rgba(var(--fj-accent),.6)}
.fj-status-pill{
  min-height:36px;display:inline-flex;align-items:center;padding:0 15px;border-radius:999px;
  color:#e2d8ff;border:1px solid rgba(var(--fj-accent),.34);background:linear-gradient(180deg,rgba(var(--fj-accent),.22),rgba(var(--fj-accent),.06));
  font-size:12.5px;font-weight:800;
}
.fj-status-pill.is-approved{color:#a7f3d0;border-color:rgba(94,226,177,.30);background:linear-gradient(180deg,rgba(94,226,177,.16),rgba(94,226,177,.04))}
.fj-status-pill.is-rejected{color:#fecdd3;border-color:rgba(251,113,133,.30);background:linear-gradient(180deg,rgba(251,113,133,.16),rgba(251,113,133,.04))}
.fj-status-pill.is-reviewing{color:#fde68a;border-color:rgba(251,191,36,.30);background:linear-gradient(180deg,rgba(251,191,36,.16),rgba(251,191,36,.04))}
.fj-track-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:20px}
.fj-track-grid>div{padding:17px;border:1px solid rgba(196,181,253,.10);border-radius:17px;background:rgba(255,255,255,.026)}
.fj-track-grid small{display:block;color:var(--fj-faint);font-size:11.5px}
.fj-track-grid strong{display:block;margin-top:7px;color:#fff;font-size:13.5px;line-height:1.5;font-weight:800}
.fj-track-message{margin:20px 0 0;color:var(--fj-text-2);font-size:13px;line-height:1.9}
.fj-standalone-actions{display:flex;align-items:center;justify-content:center;gap:13px;margin-top:28px;flex-wrap:wrap}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media(max-width:1060px){
  .fj-modal{width:min(960px,calc(100vw - 24px));max-height:94svh}
  .fj-hero{grid-template-columns:minmax(0,1fr) minmax(340px,1fr);margin:20px 20px 0}
  .fj-hero-copy{padding:36px 32px 32px}
  .fj-step-body{padding:28px 26px 32px}
  .fj-shift-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fj-ecosystem{grid-template-columns:1fr 150px 1fr}
}
@media(max-width:820px){
  .fj-modal-backdrop{padding:10px}
  .fj-modal{width:100%;max-height:96svh;border-radius:26px}
  .fj-hero,.fj-hero.fj-hero--alt{grid-template-columns:1fr;grid-template-rows:auto auto;margin:16px 16px 0}
  .fj-hero .fj-hero-media-wrap,.fj-hero.fj-hero--alt .fj-hero-media-wrap{grid-column:1;grid-row:1;min-height:0;aspect-ratio:16/9}
  .fj-hero .fj-hero-copy,.fj-hero.fj-hero--alt .fj-hero-copy{grid-column:1;grid-row:2;padding:28px 22px 26px}
  .fj-media-index{font-size:40px}
  .fj-step-body{padding:24px 18px 28px;min-height:0}
  .fj-feature-grid,.fj-counter-grid,.fj-playtime-grid,.fj-activity-list,.fj-personality-grid,.fj-contact-panel,.fj-track-grid{grid-template-columns:1fr}
  .fj-ecosystem{grid-template-columns:1fr;grid-template-rows:auto}
  .fj-ecosystem::before,.fj-ecosystem::after{display:none}
  .fj-eco-hub{grid-column:1;grid-row:auto;width:100%;height:96px;border-radius:26px;flex-direction:row;gap:13px}
  .fj-eco-hub small{margin:0}
  .fj-eco-card{text-align:right!important}
  .fj-shift-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fj-shift-timeline{display:none}
  .fj-contact-visual,.fj-contact-fields{min-height:0}
  .fj-modal-actions{grid-template-columns:1fr 1fr;padding:14px 14px}
  .fj-nav-context{display:none}
  .fj-nav-side{width:100%}.fj-nav-side--next,.fj-nav-side--back{justify-content:stretch}
  .fj-primary,.fj-secondary{width:100%;min-width:0}
  .fj-standalone{min-height:0;padding:60px 20px 32px}
}
@media(max-width:560px){
  .fj-modal-backdrop{padding:0;align-items:stretch}
  .fj-modal{height:100svh;max-height:100svh;border:0;border-radius:0;background:linear-gradient(180deg,rgba(18,13,30,.99),rgba(7,5,12,1)) padding-box}
  .fj-close{top:12px;left:12px;width:40px;height:40px}
  .fj-hero,.fj-hero.fj-hero--alt{margin:0;border-radius:0;border:0;box-shadow:none}
  .fj-hero .fj-hero-copy,.fj-hero.fj-hero--alt .fj-hero-copy{padding:24px 18px 24px}
  .fj-hero-copy h2{font-size:23px}
  .fj-step-kicker>span{width:44px;height:44px;border-radius:15px}
  .fj-step-body{padding:20px 14px 26px}
  .fj-section-head{align-items:flex-start;flex-direction:column;gap:12px}
  .fj-section-head strong{font-size:18px}
  .fj-eligibility{align-self:flex-start}
  .fj-shift-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fj-counter-control{grid-template-columns:52px minmax(80px,1fr) 52px;gap:10px}
  .fj-counter-control button{width:52px;height:52px;border-radius:17px}
  .fj-counter-control strong{min-height:64px;font-size:28px}
  .fj-modal-actions{min-height:78px;gap:10px;padding:12px}
  .fj-primary,.fj-secondary{min-height:52px}
  .fj-cta-shell{grid-template-columns:52px minmax(0,1fr) 34px;gap:13px;padding:16px 14px;border-radius:20px}
  .fj-cta-orb{width:52px;height:52px;border-radius:17px}
  .fj-cta-orb span{font-size:21px}
  .fj-cta-copy strong{font-size:17px}
  .fj-cta-arrow{width:34px;height:34px}
}
@media(max-width:390px){
  .fj-shift-grid{grid-template-columns:1fr}
  .fj-personality-card{grid-template-columns:42px minmax(0,1fr) 28px;padding:18px}
  .fj-hero-copy h2{font-size:21px}
}
@media(prefers-reduced-motion:reduce){
  .fj-modal,.fj-modal *,.fj-login-cta *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* ==========================================================================
   Vanta Family Join v5.1 — Final UX / Visual Polish
   Keeps the interface quiet, but adds depth, hierarchy and viewport-fit.
   ========================================================================== */

/* --- Login CTA: centered copy, stronger capacity readout, animated V core --- */
.fj-login-cta{margin-top:18px;padding-top:18px}
.fj-cta-shell{
  grid-template-columns:58px minmax(0,1fr) 34px;
  grid-template-rows:auto auto auto;
  gap:8px 14px;
  padding:14px 14px;
  border-radius:21px;
  background-image:
    radial-gradient(240px 120px at 18% 50%,rgba(119,72,211,.12),transparent 74%),
    radial-gradient(300px 140px at 88% -35%,rgba(167,139,250,.18),transparent 70%),
    linear-gradient(150deg,rgba(24,16,41,.88),rgba(9,7,15,.94)),
    linear-gradient(145deg,rgba(196,181,253,.30),rgba(139,92,246,.08) 46%,rgba(255,255,255,.035) 62%,rgba(139,92,246,.20));
  background-origin:padding-box,padding-box,padding-box,border-box;
  background-clip:padding-box,padding-box,padding-box,border-box;
  background-size:100% 100%;
  box-shadow:0 22px 54px -30px rgba(91,33,182,.95),inset 0 1px 0 rgba(255,255,255,.08),inset 0 -18px 30px rgba(11,6,20,.24);
}
.fj-cta-shell:hover:not(:disabled){
  transform:translateY(-2px) scale(1.004);
  box-shadow:0 30px 64px -28px rgba(109,40,217,1),0 0 0 1px rgba(167,139,250,.07),inset 0 1px 0 rgba(255,255,255,.12),inset 0 -18px 30px rgba(11,6,20,.18);
}
.fj-cta-topline{
  grid-column:2;grid-row:1;justify-self:center;
  margin:0;text-align:center;
  color:rgba(218,204,250,.66);font-size:9.5px;letter-spacing:.22em;
}
.fj-cta-copy{grid-column:2;grid-row:2;margin:0;text-align:center;justify-self:stretch}
.fj-cta-copy strong{
  position:relative;display:inline-block;padding:0 12px 9px;
  font-size:18.5px;line-height:1.35;font-weight:950;letter-spacing:-.38px;
  background:linear-gradient(180deg,#fff,#f3ebff 58%,#c9b5ff);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  text-shadow:0 0 26px rgba(139,92,246,.16);
}
.fj-cta-copy strong::after{
  content:"";position:absolute;left:18%;right:18%;bottom:0;height:2px;border-radius:99px;
  background:linear-gradient(90deg,transparent,#7c3aed 30%,#d8c7ff 50%,#7c3aed 70%,transparent);
  box-shadow:0 0 12px rgba(139,92,246,.50);
}
.fj-cta-orb{
  grid-column:1;grid-row:1/4;width:54px;height:54px;border-radius:18px;overflow:visible;
  background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.18),transparent 28%),linear-gradient(145deg,#29104e,#4c1d95 52%,#6d28d9);
  border-color:rgba(196,181,253,.26);
  box-shadow:0 18px 36px -16px rgba(91,33,182,.95),0 0 0 1px rgba(139,92,246,.10),inset 0 1px 0 rgba(255,255,255,.20),inset 0 -12px 18px rgba(12,4,27,.45);
}
.fj-cta-orb::before{
  content:"";position:absolute;inset:-6px;border-radius:22px;pointer-events:none;
  background:conic-gradient(from 0deg,transparent 0 18%,rgba(196,181,253,.70) 24%,transparent 31% 63%,rgba(124,58,237,.72) 70%,transparent 78%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;padding:1px;
  animation:fjOrbOrbit 8s linear infinite;
}
.fj-cta-orb::after{
  content:"";position:absolute;inset:8px;border-radius:12px;pointer-events:none;
  border:1px solid rgba(216,204,255,.10);box-shadow:inset 0 0 16px rgba(167,139,250,.05);
}
.fj-cta-orb>span{position:relative;z-index:2;font-size:21px;font-weight:950;text-shadow:0 2px 12px rgba(0,0,0,.55),0 0 18px rgba(196,181,253,.34)}
.fj-cta-orb>em{position:absolute;z-index:1;inset:13px;border-radius:50%;border:1px dashed rgba(216,204,255,.18);animation:fjOrbOrbit 11s linear infinite reverse}
.fj-cta-orb>i{z-index:3;right:-2px;bottom:-2px;width:13px;height:13px;border-width:3px}
@keyframes fjOrbOrbit{to{transform:rotate(360deg)}}
.fj-cta-shell:hover:not(:disabled) .fj-cta-orb{transform:translateY(-1px) rotate(-2deg);box-shadow:0 22px 42px -14px rgba(109,40,217,1),0 0 24px -8px rgba(167,139,250,.56),inset 0 1px 0 rgba(255,255,255,.22),inset 0 -12px 18px rgba(12,4,27,.38)}
.fj-cta-meter{grid-column:2;grid-row:3;display:grid;grid-template-columns:auto minmax(82px,1fr);align-items:center;justify-content:center;gap:10px;width:min(270px,100%);margin:4px auto 0;direction:rtl}
.fj-cta-meter-legend{
  display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;border-radius:999px;
  border:1px solid rgba(94,226,177,.20);background:linear-gradient(180deg,rgba(94,226,177,.10),rgba(94,226,177,.035));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);white-space:nowrap;
}
.fj-cta-meter-legend b{font-size:14px;color:#b7f7dc;text-shadow:0 0 16px rgba(94,226,177,.35)}
.fj-cta-meter-legend small{font-size:10.5px;color:rgba(215,244,233,.62);font-weight:700}
.fj-capacity-signal{display:flex;align-items:flex-end;gap:2px;height:12px;direction:ltr}
.fj-capacity-signal i{display:block;width:3px;border-radius:99px;background:#5ee2b1;box-shadow:0 0 6px rgba(94,226,177,.54)}
.fj-capacity-signal i:nth-child(1){height:5px;opacity:.55}.fj-capacity-signal i:nth-child(2){height:8px;opacity:.75}.fj-capacity-signal i:nth-child(3){height:11px}
.fj-cta-meter-track{height:6px;border-color:rgba(94,226,177,.10);background:rgba(2,1,6,.56)}
.fj-cta-meter-track i{background:linear-gradient(90deg,#285f54,#5ee2b1 58%,#c4b5fd);box-shadow:0 0 12px rgba(94,226,177,.46)}
.fj-cta-arrow{grid-column:3;grid-row:1/4;width:31px;height:31px;border-radius:11px;font-size:14px;background:rgba(255,255,255,.035);border-color:rgba(196,181,253,.12);opacity:.72}
.fj-cta-shell:hover:not(:disabled) .fj-cta-arrow{transform:translateX(-3px);opacity:1}
.fj-cta-status{grid-column:2;grid-row:3;justify-self:center;margin-top:4px;min-height:30px}

/* --- Modal shell: complete close control and smarter viewport fitting --- */
.fj-close{top:14px!important;left:14px!important;right:auto!important;width:40px;height:40px;border-radius:14px;padding:0;overflow:visible;background:linear-gradient(180deg,rgba(27,19,44,.90),rgba(10,8,17,.94));border-color:rgba(196,181,253,.18);box-shadow:0 12px 28px -18px rgba(0,0,0,.92),inset 0 1px 0 rgba(255,255,255,.08),0 0 0 4px rgba(139,92,246,.025)}
.fj-close span{display:grid;place-items:center;width:100%;height:100%;font:400 22px/1 Arial,sans-serif;transition:transform .24s var(--fj-ease),color .24s var(--fj-ease)}
.fj-close:hover span{transform:rotate(90deg) scale(1.05)}
.fj-close:hover{border-color:rgba(196,181,253,.38);background:linear-gradient(180deg,rgba(53,31,88,.94),rgba(17,11,28,.95));box-shadow:0 18px 36px -18px rgba(109,40,217,.85),inset 0 1px 0 rgba(255,255,255,.12),0 0 0 4px rgba(139,92,246,.05)}

/* Vanta gets a visual identity inside titles without adding clutter. */
.fj-vanta-word{display:inline-block;color:#bba3ff;background:linear-gradient(180deg,#e6dcff 0%,#b792ff 50%,#8b5cf6 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 12px rgba(139,92,246,.24))}
.fj-hero-copy h2{font-weight:950;letter-spacing:-.62px}
.fj-section-head strong{font-weight:930;letter-spacing:-.34px}

/* Card families: slightly different light signatures, same calm system. */
.fj-feature-card,.fj-playtime-card,.fj-activity-card,.fj-personality-card,.fj-counter-card,.fj-shift-card{position:relative;isolation:isolate}
.fj-feature-card::before,.fj-counter-card::before,.fj-activity-card::before,.fj-personality-card::before{
  content:"";position:absolute;z-index:-1;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(180px 90px at 92% 0%,rgba(var(--fj-accent),.09),transparent 72%);
}
.fj-feature-card:nth-child(2n)::before,.fj-personality-card:nth-child(2n)::before{background:radial-gradient(180px 90px at 8% 0%,rgba(var(--fj-accent),.08),transparent 72%)}
.fj-feature-card:nth-child(3)::before{background:radial-gradient(190px 100px at 50% 100%,rgba(var(--fj-accent),.08),transparent 72%)}
.fj-feature-icon{transform:translateZ(0);transition:transform .26s var(--fj-ease),box-shadow .26s var(--fj-ease)}
.fj-feature-card:hover .fj-feature-icon{transform:translateY(-2px) rotate(-2deg);box-shadow:0 18px 34px -14px rgba(var(--fj-accent),.95),inset 0 1px 0 rgba(255,255,255,.24)}

/* Step 3 counters: Latin numerals + holographic numeric wells. */
.fj-counter-card{background:linear-gradient(155deg,rgba(255,255,255,.065),rgba(255,255,255,.012)) padding-box,linear-gradient(160deg,rgba(196,181,253,.28),rgba(255,255,255,.035) 54%,rgba(var(--fj-accent),.20)) border-box}
.fj-counter-control strong{font-family:Inter,system-ui,sans-serif!important;font-variant-numeric:tabular-nums;direction:ltr;letter-spacing:.025em;background:radial-gradient(160px 70px at 50% 0%,rgba(var(--fj-accent),.12),transparent 70%),linear-gradient(180deg,rgba(6,4,12,.92),rgba(13,9,22,.84));border-color:rgba(var(--fj-accent),.24);box-shadow:inset 0 2px 14px rgba(2,1,6,.82),0 16px 32px -28px rgba(var(--fj-accent),.9)}
.fj-counter-control button{font-weight:300;box-shadow:0 12px 28px -18px rgba(var(--fj-accent),.86),inset 0 1px 0 rgba(255,255,255,.18),0 0 0 3px rgba(var(--fj-accent),.025)}
.fj-counter-scale span{font-size:10.5px;letter-spacing:.02em}

/* Step 4 playtime: stronger visual cadence without extra copy. */
.fj-playtime-card{overflow:hidden;padding-top:20px}
.fj-playtime-index{position:absolute;left:18px;top:17px;color:rgba(232,221,255,.22);font:900 22px/1 Inter,system-ui,sans-serif;letter-spacing:-.05em;transition:color .24s var(--fj-ease),transform .24s var(--fj-ease)}
.fj-playtime-pulse{position:absolute;left:20px;bottom:38px;display:flex;align-items:center;gap:4px;direction:ltr}
.fj-playtime-pulse i{width:4px;height:4px;border-radius:50%;background:rgba(var(--fj-accent),.34);box-shadow:0 0 8px rgba(var(--fj-accent),.24)}
.fj-playtime-card.is-active .fj-playtime-index{color:rgba(238,230,255,.62);transform:translateY(-1px)}
.fj-playtime-card.is-active .fj-playtime-pulse i{background:rgb(var(--fj-accent));box-shadow:0 0 10px rgba(var(--fj-accent),.65)}
.fj-playtime-card.is-active .fj-playtime-pulse i:nth-child(2){animation:fjPulseDot 1.7s ease-in-out infinite}.fj-playtime-card.is-active .fj-playtime-pulse i:nth-child(3){animation:fjPulseDot 1.7s .25s ease-in-out infinite}
@keyframes fjPulseDot{50%{opacity:.35;transform:scale(.72)}}

/* Step 6: skill selection is visibly required, and missing cards explain themselves. */
.fj-skill-prompt{display:flex!important;align-items:center;gap:8px;color:var(--fj-faint)!important}
.fj-skill-prompt>i{width:24px;height:24px;display:grid;place-items:center;border-radius:8px;font-style:normal;font-size:12px;font-weight:900;color:#e8dcff;border:1px solid rgba(var(--fj-accent),.28);background:rgba(var(--fj-accent),.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.fj-skill-prompt>span{display:block}.fj-skill-prompt b{display:block;color:rgba(246,241,255,.80);font-size:11.5px;line-height:1.2}.fj-skill-prompt small{display:block;margin-top:3px;color:rgba(238,232,251,.42);font-size:9.5px;line-height:1.2}
.fj-skill-prompt.is-set>i{color:#9ff0cf;border-color:rgba(94,226,177,.28);background:rgba(94,226,177,.08);box-shadow:0 0 14px -5px rgba(94,226,177,.70)}
.fj-skill-prompt.is-set small{color:rgba(159,240,207,.62)}
.fj-activity-card.is-missing-skill{background:linear-gradient(160deg,rgba(251,191,36,.055),rgba(255,255,255,.012)) padding-box,linear-gradient(160deg,rgba(251,191,36,.46),rgba(255,255,255,.035) 56%,rgba(251,191,36,.14)) border-box;box-shadow:0 0 0 3px rgba(251,191,36,.045),inset 0 1px 0 rgba(255,255,255,.08)}
.fj-activity-card.is-missing-skill .fj-skill-prompt>i{color:#fde68a;border-color:rgba(251,191,36,.36);background:rgba(251,191,36,.10);animation:fjQuestionPulse 1.6s ease-in-out infinite}
@keyframes fjQuestionPulse{50%{box-shadow:0 0 0 5px rgba(251,191,36,.07),0 0 14px rgba(251,191,36,.28)}}

/* Navigation: glass controls, corrected arrow directions and in-context validation. */
.fj-modal-actions{position:sticky;isolation:isolate}
.fj-modal-actions::before{content:"";position:absolute;z-index:-1;left:18%;right:18%;top:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(var(--fj-accent),.45),transparent);box-shadow:0 0 14px rgba(var(--fj-accent),.22)}
.fj-primary,.fj-secondary{position:relative;overflow:hidden;border-radius:17px}
.fj-primary{
  background-image:radial-gradient(150px 56px at 82% -20%,rgba(255,255,255,.18),transparent 72%),linear-gradient(135deg,rgba(76,29,149,.98),rgba(109,40,217,.92) 48%,rgba(139,92,246,.90));
  background-size:100% 100%,100% 100%;background-position:0 0,0 0;
  border-color:rgba(216,204,255,.30);box-shadow:0 20px 44px -20px rgba(109,40,217,.96),inset 0 1px 0 rgba(255,255,255,.24),inset 0 -12px 20px rgba(23,8,48,.30);
}
.fj-modal .fj-primary::before{content:""!important;display:block!important;position:absolute;inset:1px;border-radius:15px;pointer-events:none;background:linear-gradient(110deg,rgba(255,255,255,.08),transparent 26% 72%,rgba(255,255,255,.05));box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)!important}
.fj-modal .fj-primary::after{content:""!important;display:block!important;position:absolute;width:110px;height:110px;right:-60px;top:-70px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(216,204,255,.20),transparent 68%);filter:blur(1px);transition:transform .35s var(--fj-ease)!important}
.fj-primary:hover:not(:disabled){background-position:0 0,0 0;box-shadow:0 28px 54px -20px rgba(124,58,237,1),0 0 0 1px rgba(167,139,250,.10),inset 0 1px 0 rgba(255,255,255,.30),inset 0 -12px 20px rgba(23,8,48,.26)}
.fj-modal .fj-primary:hover:not(:disabled)::after{transform:translate(-28px,28px) scale(1.2)}
.fj-primary:hover:not(:disabled) i{transform:translateX(4px)}
.fj-secondary{background:radial-gradient(120px 50px at 85% -20%,rgba(var(--fj-accent),.08),transparent 72%),linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.012));box-shadow:inset 0 1px 0 rgba(255,255,255,.055)}
.fj-secondary i{transition:transform .22s var(--fj-ease)}
.fj-secondary:hover i{transform:translateX(-3px)}
.fj-step-alert{position:absolute;z-index:48;left:50%;top:13px;transform:translate(-50%,-8px);max-width:min(720px,calc(100% - 150px));min-height:38px;display:flex;align-items:center;justify-content:center;padding:8px 16px;border-radius:13px;opacity:0;pointer-events:none;color:#fff0b8;border:1px solid rgba(251,191,36,.24);background:linear-gradient(180deg,rgba(46,32,12,.965),rgba(22,15,7,.965));backdrop-filter:blur(18px) saturate(1.08);box-shadow:0 18px 42px -20px rgba(251,191,36,.58),0 10px 28px -24px rgba(0,0,0,.96),inset 0 1px 0 rgba(255,255,255,.055);font-size:12px;font-weight:820;line-height:1.65;text-align:center;transition:opacity .22s var(--fj-ease),transform .22s var(--fj-ease)}
.fj-step-alert.is-visible{opacity:1;transform:translate(-50%,0)}

/* --- Desktop viewport-fit: one complete slide, no vertical hunting. --- */
@media(min-width:821px){
  .fj-modal-backdrop{padding:14px 18px}
  .fj-modal{width:min(1120px,calc(100vw - 36px));height:min(850px,calc(100svh - 28px));max-height:none}
  .fj-modal-scroll{height:100%;display:grid;grid-template-rows:minmax(0,1fr) auto;overflow:hidden}
  .fj-wizard-stage{min-height:0;display:grid;grid-template-rows:250px minmax(0,1fr);overflow:hidden}
  .fj-hero{height:auto;min-height:0;margin:16px 20px 0;border-radius:24px}
  .fj-hero-media-wrap{min-height:0}
  .fj-hero-copy{padding:24px 30px 22px}
  .fj-eyebrow{min-height:25px;margin-bottom:9px;padding:0 11px;font-size:9px}
  .fj-step-kicker{margin-bottom:10px;gap:10px}.fj-step-kicker>span{width:40px;height:40px;border-radius:13px;font-size:12px}.fj-step-kicker small{font-size:9.5px}.fj-step-kicker b{font-size:11.5px;margin-top:3px}
  .fj-hero-copy h2{font-size:clamp(24px,2vw,30px);line-height:1.45;padding-bottom:13px}.fj-hero-copy h2::after{height:2px;width:72px}.fj-hero-copy>p{margin-top:9px;font-size:12.5px;line-height:1.75}
  .fj-progress{margin-top:14px;width:min(330px,100%)}.fj-progress-dots i{height:4px}.fj-progress>b{font-size:10px}
  .fj-media-index{right:16px;bottom:12px;font-size:42px}
  .fj-step-body{min-height:0;padding:18px 28px 20px;overflow:hidden}
  .fj-section-head{margin-bottom:14px;gap:14px;align-items:center}.fj-section-kicker{margin-bottom:4px;font-size:9.8px}.fj-section-head strong{font-size:17.5px;line-height:1.45;padding-bottom:8px}.fj-section-head strong::after{width:42px}.fj-section-head p{margin-top:5px;font-size:11.2px;line-height:1.55}
  .fj-feature-grid{gap:11px}.fj-feature-card{min-height:106px;padding:15px 16px;grid-template-columns:42px minmax(0,1fr);gap:12px;border-radius:18px}.fj-feature-icon{width:42px;height:42px;border-radius:14px;font-size:16px}.fj-feature-card strong{font-size:13.5px}.fj-feature-card p{margin-top:4px;font-size:10.8px;line-height:1.55}.fj-feature-card small{margin-top:7px;padding:4px 8px;font-size:9.3px}
  .fj-ecosystem{min-height:208px;grid-template-columns:1fr 138px 1fr;gap:10px 16px}.fj-eco-hub{width:116px;height:116px;border-radius:34px}.fj-eco-hub span{font-size:26px}.fj-eco-card{padding:15px 17px;border-radius:17px}.fj-eco-card b{font-size:12.7px}.fj-eco-card span{margin-top:4px;font-size:10.7px;line-height:1.55}.fj-story-note{margin-top:10px;padding:10px 14px;border-radius:15px}.fj-story-note b{font-size:12px}.fj-story-note div>span{margin-top:2px;font-size:10.5px}
  .fj-counter-grid{gap:12px}.fj-counter-card{padding:17px 18px;border-radius:19px}.fj-counter-top b{font-size:13px}.fj-counter-top span{font-size:9px}.fj-counter-control{grid-template-columns:48px minmax(90px,1fr) 48px;gap:10px;margin-top:12px}.fj-counter-control button{width:48px;height:48px;border-radius:15px;font-size:26px}.fj-counter-control strong{min-height:58px;border-radius:16px;font-size:26px}.fj-counter-scale{margin-top:10px}.fj-counter-scale span{font-size:9.5px}.fj-helper{margin-top:11px;padding:10px 14px;border-radius:15px}.fj-helper>span{width:32px;height:32px;flex-basis:32px;border-radius:10px}.fj-helper b{font-size:11.5px}.fj-helper p{margin-top:2px;font-size:10.5px;line-height:1.5}.fj-eligibility{min-height:30px;font-size:10.5px;padding:0 11px}
  .fj-playtime-grid{gap:11px}.fj-playtime-card{min-height:112px;padding:15px 17px 30px;border-radius:18px}.fj-playtime-tag{min-height:23px;padding:0 9px;font-size:9.8px}.fj-playtime-card strong{margin-top:9px;font-size:13.5px}.fj-playtime-card p{margin-top:3px;font-size:10.5px;line-height:1.5}.fj-playtime-meter{left:17px;right:17px;bottom:13px;height:5px}.fj-playtime-index{top:14px;left:15px;font-size:18px}.fj-playtime-pulse{display:none}
  .fj-shift-timeline{margin:0 3px 10px;font-size:9.5px}.fj-shift-grid{gap:9px}.fj-shift-card{min-height:104px;padding:13px 8px;border-radius:17px}.fj-shift-icon{width:36px;height:36px;margin-bottom:8px;border-radius:12px;font-size:15px}.fj-shift-card strong{font-size:11.8px}.fj-shift-card small{margin-top:5px;font-size:9px}.fj-selected-shift{margin-top:10px;padding:9px 13px;border-radius:14px}.fj-selected-shift>span{width:32px;height:32px;border-radius:10px}.fj-selected-shift small{font-size:9.5px}.fj-selected-shift strong{margin-top:2px;font-size:11.5px}
  .fj-activity-list{gap:10px}.fj-activity-card{padding:13px 15px;border-radius:18px}.fj-activity-title{gap:10px}.fj-activity-title>span{width:36px;height:36px;flex-basis:36px;border-radius:12px;font-size:14px}.fj-activity-title strong{font-size:12.5px}.fj-activity-title small{margin-top:3px;font-size:9.7px;line-height:1.35}.fj-score-ring{width:44px;height:44px;flex-basis:44px}.fj-score-ring::after{inset:4px}.fj-score-ring b{font-size:10px}.fj-range-wrap{margin:9px 0 7px}.fj-range-wrap input[type=range]{height:24px}.fj-range-wrap input[type=range]::-webkit-slider-runnable-track{height:8px}.fj-range-wrap input[type=range]::-webkit-slider-thumb{width:20px;height:20px;margin-top:-6px;border-width:5px}.fj-skill-row{padding-top:8px}.fj-skill-prompt>i{width:21px;height:21px}.fj-skill-prompt b{font-size:10.5px}.fj-skill-prompt small{font-size:8.5px}.fj-chip{min-height:32px;padding:0 13px;border-radius:10px;font-size:10.7px}
  .fj-personality-grid{gap:11px}.fj-personality-card{min-height:104px;grid-template-columns:38px minmax(0,1fr) 27px;gap:11px;padding:14px 15px;border-radius:18px}.fj-personality-index{width:38px;height:38px;border-radius:13px;font-size:11px}.fj-personality-card small{font-size:9.8px}.fj-personality-card strong{margin-top:3px;font-size:12.8px}.fj-personality-card p{margin-top:4px;font-size:10.4px;line-height:1.5}.fj-personality-card>i{width:27px;height:27px;font-size:12px}
  .fj-contact-panel{gap:12px}.fj-contact-visual,.fj-contact-fields{min-height:198px;border-radius:19px}.fj-contact-visual{padding:20px}.fj-contact-visual>span{width:44px;height:44px;margin-bottom:10px;border-radius:14px;font-size:17px}.fj-contact-visual strong{font-size:15px}.fj-contact-visual p{margin-top:4px;font-size:10.5px;line-height:1.55}.fj-contact-flow{margin-top:14px}.fj-contact-visual>small{margin-top:7px;font-size:9.6px}.fj-contact-fields{padding:18px}.fj-field+.fj-field{margin-top:10px}.fj-field>span{margin-bottom:6px;font-size:10.5px}.fj-field input{height:48px;border-radius:14px;font-size:12.5px}.fj-field-hint{margin-top:5px;font-size:9.3px}.fj-privacy-note{margin-top:10px;padding:9px 11px}.fj-privacy-note p{font-size:10px}
  .fj-modal-actions{position:relative;min-height:68px;padding:9px 18px;gap:12px}.fj-primary,.fj-secondary{min-height:48px;border-radius:15px}.fj-primary{min-width:188px;padding:5px 7px 5px 17px}.fj-primary span{font-size:12.5px}.fj-primary i{width:36px;height:36px;border-radius:12px;font-size:15px}.fj-secondary{padding:0 16px}.fj-secondary span{font-size:12px}.fj-nav-context{min-width:170px}.fj-nav-context small{margin-top:5px;font-size:9.5px}
}

@media(min-width:821px) and (max-height:780px){
  .fj-modal{height:calc(100svh - 18px)}
  .fj-wizard-stage{grid-template-rows:210px minmax(0,1fr)}
  .fj-hero{margin-top:10px}.fj-hero-copy{padding:18px 25px 16px}.fj-eyebrow{display:none}.fj-step-kicker{margin-bottom:7px}.fj-hero-copy h2{font-size:24px;padding-bottom:10px}.fj-hero-copy>p{font-size:11.5px;margin-top:7px}.fj-progress{margin-top:9px}.fj-step-body{padding-top:13px;padding-bottom:13px}.fj-modal-actions{min-height:60px;padding-top:6px;padding-bottom:6px}.fj-primary,.fj-secondary{min-height:44px}
}

@media(max-width:820px){
  .fj-cta-topline,.fj-cta-copy{text-align:center;justify-self:center}.fj-cta-meter{width:min(250px,100%)}
  .fj-step-alert{position:absolute;top:10px;bottom:auto;left:50%;max-width:calc(100% - 86px);z-index:48}
}

@media(prefers-reduced-motion:reduce){.fj-cta-orb::before,.fj-cta-orb>em,.fj-playtime-card.is-active .fj-playtime-pulse i,.fj-activity-card.is-missing-skill .fj-skill-prompt>i{animation:none!important}}

/* ========================================================================== 
   Vanta Family Join v5.3 — Final Experience Polish
   Readability, viewport usage, human copy hierarchy, compact login CTA.
   ========================================================================== */

/* Login CTA — compact, centered and impossible to miss without stealing space. */
.fj-login-cta{margin-top:10px!important;padding-top:10px!important}
.fj-login-cta::before{left:12%!important;right:12%!important;opacity:.72}
.fj-cta-shell{
  min-height:96px!important;
  grid-template-columns:50px minmax(0,1fr) 30px!important;
  grid-template-rows:16px auto 30px!important;
  gap:4px 12px!important;
  padding:11px 12px!important;
  border-radius:19px!important;
  background-image:
    radial-gradient(220px 96px at 12% 50%,rgba(115,72,207,.11),transparent 74%),
    radial-gradient(300px 128px at 88% -28%,rgba(167,139,250,.17),transparent 72%),
    linear-gradient(150deg,rgba(23,15,39,.92),rgba(9,7,15,.97)),
    linear-gradient(145deg,rgba(216,204,255,.31),rgba(139,92,246,.09) 44%,rgba(255,255,255,.035) 64%,rgba(139,92,246,.20))!important;
  box-shadow:0 20px 46px -28px rgba(91,33,182,.96),inset 0 1px 0 rgba(255,255,255,.09),inset 0 -14px 26px rgba(8,4,16,.24)!important;
}
.fj-cta-shell:hover:not(:disabled){transform:translateY(-2px) scale(1.003)!important;box-shadow:0 28px 58px -28px rgba(109,40,217,1),0 0 0 1px rgba(167,139,250,.075),inset 0 1px 0 rgba(255,255,255,.14)!important}
.fj-cta-topline{font-size:8.8px!important;letter-spacing:.20em!important;color:rgba(224,212,252,.62)!important}
.fj-cta-copy{align-self:center!important}
.fj-cta-copy strong{
  padding:0 12px 7px!important;font-size:19px!important;line-height:1.25!important;font-weight:950!important;letter-spacing:-.48px!important;
  filter:drop-shadow(0 0 10px rgba(139,92,246,.16));
}
.fj-cta-copy strong::after{left:24%!important;right:24%!important;height:2px!important;bottom:0!important;background:linear-gradient(90deg,transparent,#7c3aed 28%,#eadfff 50%,#7c3aed 72%,transparent)!important;box-shadow:0 0 12px rgba(139,92,246,.48)!important}
.fj-cta-orb{width:48px!important;height:48px!important;border-radius:16px!important;box-shadow:0 16px 30px -16px rgba(91,33,182,.92),0 0 0 1px rgba(139,92,246,.08),inset 0 1px 0 rgba(255,255,255,.19),inset 0 -10px 16px rgba(10,3,24,.48)!important}
.fj-cta-orb span{font-size:20px!important}
.fj-cta-orb::before{inset:-5px!important;border-radius:20px!important}
.fj-cta-orb>em{inset:6px!important}
.fj-cta-orb i{width:12px!important;height:12px!important;border-width:2px!important;right:-2px!important;bottom:-2px!important}
.fj-cta-meter{grid-template-columns:auto!important;width:auto!important;margin:1px auto 0!important;justify-content:center!important}
.fj-cta-meter-track{display:none!important}
.fj-cta-meter-legend{
  min-height:28px!important;padding:0 11px!important;gap:7px!important;border-radius:999px!important;
  border:1px solid rgba(94,226,177,.22)!important;
  background:linear-gradient(180deg,rgba(94,226,177,.105),rgba(94,226,177,.035))!important;
  box-shadow:0 10px 24px -18px rgba(94,226,177,.72),inset 0 1px 0 rgba(255,255,255,.05)!important;
}
.fj-cta-meter-legend b{font-size:11.8px!important;font-weight:900!important;color:#b7f5dc!important;text-shadow:none!important}
.fj-capacity-signal{height:11px!important;gap:2px!important}
.fj-capacity-signal i{width:3px!important;border-radius:2px!important;background:linear-gradient(180deg,#b7f5dc,#55d6a7)!important;box-shadow:0 0 8px rgba(94,226,177,.48)!important}
.fj-cta-arrow{width:29px!important;height:29px!important;border-radius:10px!important;font-size:13px!important;opacity:.66!important}
.fj-cta-status{min-height:28px!important;margin-top:1px!important;padding:0 11px!important}
.fj-cta-status b{font-size:11px!important}

/* Modal shell — content starts from the top; no dead zone above the wizard. */
.fj-modal{border-radius:27px!important}
.fj-close{
  top:13px!important;right:13px!important;left:auto!important;width:38px!important;height:38px!important;border-radius:13px!important;
  color:rgba(244,238,255,.72)!important;background:linear-gradient(180deg,rgba(28,20,46,.94),rgba(10,8,17,.96))!important;
  box-shadow:0 12px 28px -18px rgba(0,0,0,.96),inset 0 1px 0 rgba(255,255,255,.08),0 0 0 4px rgba(139,92,246,.025)!important;
}
.fj-close span{font-size:20px!important;font-weight:400!important;transform-origin:center!important}
.fj-modal-scroll{align-content:stretch!important;justify-content:stretch!important}
.fj-modal-scroll>.fj-wizard-stage{align-self:stretch!important;justify-self:stretch!important;align-content:start!important;justify-content:stretch!important;margin:0!important;padding:0!important;transform-origin:center top!important}

/* Stronger hierarchy without turning the UI into a billboard. */
.fj-hero{box-shadow:0 26px 60px -34px rgba(46,16,101,.96),inset 0 1px 0 rgba(255,255,255,.055)!important}
.fj-hero-copy{background:radial-gradient(420px 250px at 74% 40%,rgba(var(--fj-accent),.15),transparent 72%),linear-gradient(180deg,rgba(255,255,255,.012),transparent)!important}
.fj-eyebrow{font-weight:900!important;color:#f0e8ff!important}
.fj-step-kicker>span{display:grid!important;place-items:center!important;line-height:1!important;font-variant-numeric:tabular-nums!important}
.fj-step-kicker small{font-weight:650!important;color:rgba(239,233,252,.56)!important}
.fj-step-kicker b{font-weight:900!important}
.fj-hero-copy h2{font-weight:950!important;letter-spacing:-.66px!important;text-wrap:balance!important;text-shadow:0 14px 38px rgba(0,0,0,.48),0 0 26px rgba(var(--fj-accent),.20)!important}
.fj-hero-copy>p{font-weight:620!important;color:rgba(242,236,252,.76)!important}
.fj-section-kicker{font-weight:900!important;letter-spacing:.025em!important}
.fj-section-head strong{font-weight:950!important;letter-spacing:-.42px!important;text-wrap:balance!important}
.fj-section-head p{font-weight:580!important;color:rgba(239,232,250,.63)!important}

/* Every icon is optically centered; cards get just enough depth to feel intentional. */
.fj-feature-icon,.fj-shift-icon,.fj-activity-title>span,.fj-helper>span,.fj-selected-shift>span,.fj-contact-visual>span,.fj-personality-index,.fj-personality-card>i,.fj-skill-prompt>i{
  display:grid!important;place-items:center!important;line-height:1!important;text-align:center!important;
}
.fj-feature-card,.fj-eco-card,.fj-counter-card,.fj-playtime-card,.fj-shift-card,.fj-activity-card,.fj-personality-card,.fj-contact-visual,.fj-contact-fields{
  background:
    radial-gradient(180px 88px at 88% -8%,rgba(var(--fj-accent),.08),transparent 72%) padding-box,
    linear-gradient(160deg,rgba(255,255,255,.058),rgba(255,255,255,.012)) padding-box,
    linear-gradient(160deg,rgba(216,204,255,.25),rgba(255,255,255,.035) 55%,rgba(var(--fj-accent),.15)) border-box!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 18px 38px -36px rgba(var(--fj-accent),.72)!important;
}
.fj-feature-card:hover,.fj-playtime-card:hover,.fj-shift-card:hover,.fj-personality-card:hover{transform:translateY(-2px)!important}
.fj-feature-card strong,.fj-eco-card b,.fj-playtime-card strong,.fj-shift-card strong,.fj-activity-title strong,.fj-personality-card strong,.fj-contact-visual strong,.fj-counter-top b{font-weight:920!important;color:#fff!important}
.fj-feature-card p,.fj-eco-card span,.fj-playtime-card p,.fj-activity-title small,.fj-personality-card p,.fj-contact-visual p{color:rgba(238,232,251,.64)!important;font-weight:560!important}

/* Level + age — cleaner HUD, friendly eligibility. */
.fj-eligibility{font-weight:900!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important}
.fj-counter-control strong{font-weight:950!important;color:#fff!important;text-shadow:0 0 20px rgba(var(--fj-accent),.32)!important}
.fj-counter-control button{display:grid!important;place-items:center!important;line-height:1!important;color:#f4efff!important}
.fj-helper{box-shadow:inset 0 1px 0 rgba(255,255,255,.055)!important}
.fj-helper b{font-weight:900!important}

/* Playtime / schedule — active state is obvious, not loud. */
.fj-playtime-card.is-active,.fj-shift-card.is-active,.fj-personality-card.is-active{
  background:
    radial-gradient(220px 100px at 88% -10%,rgba(var(--fj-accent),.20),transparent 70%) padding-box,
    linear-gradient(160deg,rgba(var(--fj-accent),.18),rgba(255,255,255,.018)) padding-box,
    linear-gradient(160deg,rgba(var(--fj-accent),.82),rgba(216,204,255,.20) 60%,rgba(var(--fj-accent),.28)) border-box!important;
  box-shadow:0 20px 44px -30px rgba(var(--fj-accent),.96),inset 0 1px 0 rgba(255,255,255,.12)!important;
}
.fj-shift-card{overflow:hidden!important}
.fj-shift-card strong,.fj-shift-card small{text-align:center!important}
.fj-selected-shift strong{font-weight:900!important}

/* Skills — required choice is visible before an error happens. */
.fj-skill-prompt{min-width:112px!important}
.fj-skill-prompt>i{flex:0 0 auto!important;font-weight:950!important}
.fj-skill-prompt b{font-weight:900!important;color:#f7f2ff!important}
.fj-skill-prompt small{font-weight:600!important}
.fj-chip{font-weight:900!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important}
.fj-chip.is-active{color:#fff!important;background:linear-gradient(180deg,rgba(var(--fj-accent),.36),rgba(var(--fj-accent),.12))!important;border-color:rgba(var(--fj-accent),.56)!important;box-shadow:0 12px 24px -16px rgba(var(--fj-accent),.92),inset 0 1px 0 rgba(255,255,255,.12)!important}

/* Contact step — inputs are the focus, helper text remains readable. */
.fj-field>span{font-weight:900!important;color:#f7f2ff!important}
.fj-field>span em{font-style:normal!important;color:#bda7fb!important;font-weight:800!important}
.fj-field input{font-weight:760!important;color:#fff!important;box-shadow:inset 0 2px 12px rgba(1,0,4,.66)!important}
.fj-field-hint{color:rgba(238,232,251,.58)!important;font-weight:600!important;line-height:1.55!important}
.fj-privacy-note p{font-weight:580!important}

/* Footer — compact progress, correct RTL arrows, glass controls. */
.fj-modal-actions{direction:rtl!important;background:linear-gradient(180deg,rgba(9,6,15,.74),rgba(6,4,10,.96))!important;backdrop-filter:blur(18px) saturate(1.08)!important}
.fj-nav-context{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important}
.fj-nav-context>div{display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;direction:ltr!important}
.fj-nav-context i,.fj-nav-context button{width:22px!important;height:6px!important;min-width:22px!important;min-height:6px!important;border:0!important;border-radius:999px!important;background:rgba(255,255,255,.075)!important;padding:0!important;box-shadow:inset 0 1px 2px rgba(0,0,0,.48)!important}
.fj-modal .fj-nav-context i::after,.fj-modal .fj-nav-context button::after{content:none!important;display:none!important}
.fj-nav-context .is-done{background:rgba(var(--fj-accent),.48)!important}
.fj-nav-context .is-current{width:29px!important;background:linear-gradient(90deg,rgb(var(--fj-accent)),#eadfff)!important;box-shadow:0 0 12px rgba(var(--fj-accent),.72)!important}
.fj-nav-context small{font-weight:700!important;color:rgba(238,232,251,.48)!important}
.fj-primary,.fj-secondary{font-weight:900!important}
.fj-primary span,.fj-secondary span{position:relative;z-index:1;font-weight:900!important}
.fj-primary i,.fj-secondary i{position:relative;z-index:1;display:grid!important;place-items:center!important;line-height:1!important}
.fj-primary:hover:not(:disabled) i{transform:translateX(-3px)!important}
.fj-secondary:hover i{transform:translateX(3px)!important}
.fj-step-alert{font-weight:800!important;font-size:12px!important;box-shadow:0 18px 40px -20px rgba(251,191,36,.60),inset 0 1px 0 rgba(255,255,255,.04)!important}

/* Desktop: use the full modal from the first pixel, then spend the reclaimed room on text. */
@media(min-width:821px){
  .fj-modal-backdrop{padding:12px 16px!important}
  .fj-modal{width:min(1160px,calc(100vw - 32px))!important;height:min(780px,calc(100svh - 24px))!important;max-height:none!important}
  .fj-modal-scroll{height:100%!important;display:grid!important;grid-template-rows:minmax(0,1fr) 68px!important;overflow:hidden!important}
  .fj-modal-scroll>.fj-wizard-stage{grid-row:1!important;width:100%!important;height:100%!important;min-height:0!important;display:grid!important;grid-template-rows:222px minmax(0,1fr)!important;overflow:hidden!important}
  .fj-modal-scroll>.fj-modal-actions{grid-row:2!important;min-height:68px!important;height:68px!important}
  .fj-hero{height:auto!important;min-height:0!important;margin:13px 18px 0!important;border-radius:22px!important}
  .fj-hero-media-wrap{min-height:0!important}
  .fj-hero-copy{padding:21px 28px 19px!important}
  .fj-eyebrow{min-height:25px!important;margin-bottom:8px!important;padding:0 10px!important;font-size:9px!important}
  .fj-step-kicker{margin-bottom:8px!important;gap:9px!important}
  .fj-step-kicker>span{width:39px!important;height:39px!important;border-radius:12px!important;font-size:11.5px!important}
  .fj-step-kicker small{font-size:9.8px!important}.fj-step-kicker b{margin-top:3px!important;font-size:12px!important}
  .fj-hero-copy h2{font-size:clamp(27px,2.15vw,32px)!important;line-height:1.42!important;padding-bottom:12px!important}
  .fj-hero-copy h2::after{width:68px!important;height:2px!important}
  .fj-hero-copy>p{margin-top:8px!important;font-size:13px!important;line-height:1.72!important}
  .fj-progress{margin-top:11px!important;width:min(326px,100%)!important}.fj-progress>b{font-size:10.5px!important}.fj-progress-dots i{height:4px!important}
  .fj-media-index{right:15px!important;bottom:10px!important;font-size:40px!important}

  .fj-step-body{min-height:0!important;padding:14px 25px 15px!important;overflow:hidden!important}
  .fj-section-head{margin:0 1px 12px!important;gap:14px!important;align-items:center!important}
  .fj-section-kicker{margin-bottom:4px!important;font-size:10.4px!important}
  .fj-section-head strong{font-size:19px!important;line-height:1.42!important;padding-bottom:8px!important}
  .fj-section-head strong::after{width:44px!important}
  .fj-section-head p{margin-top:5px!important;font-size:12px!important;line-height:1.55!important}
  .fj-eligibility{min-height:32px!important;padding:0 12px!important;font-size:11.2px!important}

  .fj-feature-grid{gap:10px!important}.fj-feature-card{min-height:112px!important;padding:15px 16px!important;grid-template-columns:42px minmax(0,1fr)!important;gap:12px!important;border-radius:17px!important}.fj-feature-icon{width:42px!important;height:42px!important;border-radius:13px!important;font-size:16px!important}.fj-feature-card strong{font-size:14.2px!important;line-height:1.45!important}.fj-feature-card p{margin-top:4px!important;font-size:11.2px!important;line-height:1.55!important}.fj-feature-card small{margin-top:7px!important;padding:4px 8px!important;font-size:9.5px!important}
  .fj-ecosystem{min-height:218px!important;grid-template-columns:1fr 132px 1fr!important;gap:10px 15px!important}.fj-eco-hub{width:112px!important;height:112px!important;border-radius:32px!important}.fj-eco-hub span{font-size:27px!important}.fj-eco-hub strong{font-size:11px!important}.fj-eco-hub small{font-size:8px!important}.fj-eco-card{padding:15px 17px!important;border-radius:17px!important}.fj-eco-card b{font-size:13.6px!important}.fj-eco-card span{margin-top:5px!important;font-size:11.2px!important;line-height:1.5!important}.fj-story-note{margin-top:9px!important;padding:10px 14px!important;border-radius:14px!important}.fj-story-note b{font-size:12.5px!important}.fj-story-note div>span{margin-top:2px!important;font-size:10.7px!important}
  .fj-counter-grid{gap:11px!important}.fj-counter-card{padding:16px 18px!important;border-radius:18px!important}.fj-counter-top b{font-size:13.8px!important}.fj-counter-top span{font-size:9.4px!important}.fj-counter-control{grid-template-columns:46px minmax(90px,1fr) 46px!important;gap:10px!important;margin-top:11px!important}.fj-counter-control button{width:46px!important;height:46px!important;border-radius:14px!important;font-size:25px!important}.fj-counter-control strong{min-height:56px!important;border-radius:15px!important;font-size:27px!important}.fj-counter-scale{margin-top:9px!important}.fj-counter-scale span{font-size:9.8px!important}.fj-helper{margin-top:10px!important;padding:10px 13px!important;border-radius:14px!important}.fj-helper>span{width:32px!important;height:32px!important;flex-basis:32px!important;border-radius:10px!important}.fj-helper b{font-size:12px!important}.fj-helper p{margin-top:2px!important;font-size:10.7px!important;line-height:1.45!important}
  .fj-playtime-grid{gap:10px!important}.fj-playtime-card{min-height:116px!important;padding:15px 17px 30px!important;border-radius:17px!important}.fj-playtime-tag{min-height:24px!important;padding:0 9px!important;font-size:10px!important}.fj-playtime-card strong{margin-top:9px!important;font-size:14.5px!important}.fj-playtime-card p{margin-top:4px!important;font-size:11px!important;line-height:1.48!important}.fj-playtime-index{top:13px!important;left:14px!important;font-size:18px!important}.fj-playtime-meter{left:16px!important;right:16px!important;bottom:12px!important;height:5px!important}
  .fj-shift-timeline{margin:0 3px 9px!important;font-size:9.8px!important}.fj-shift-grid{gap:9px!important}.fj-shift-card{min-height:108px!important;padding:13px 8px!important;border-radius:16px!important}.fj-shift-icon{width:37px!important;height:37px!important;margin-bottom:8px!important;border-radius:11px!important;font-size:15px!important}.fj-shift-card strong{font-size:12.4px!important}.fj-shift-card small{margin-top:4px!important;font-size:9.4px!important}.fj-selected-shift{margin-top:9px!important;padding:9px 12px!important;border-radius:13px!important}.fj-selected-shift>span{width:31px!important;height:31px!important;border-radius:9px!important}.fj-selected-shift small{font-size:9.6px!important}.fj-selected-shift strong{margin-top:2px!important;font-size:11.7px!important}
  .fj-activity-list{gap:9px!important}.fj-activity-card{padding:12px 14px!important;border-radius:17px!important}.fj-activity-title{gap:10px!important}.fj-activity-title>span{width:36px!important;height:36px!important;flex-basis:36px!important;border-radius:11px!important;font-size:14px!important}.fj-activity-title strong{font-size:13px!important}.fj-activity-title small{margin-top:3px!important;font-size:10.2px!important;line-height:1.35!important}.fj-score-ring{width:43px!important;height:43px!important;flex-basis:43px!important}.fj-score-ring b{font-size:10.2px!important}.fj-range-wrap{margin:8px 0 6px!important}.fj-range-wrap input[type=range]{height:23px!important}.fj-skill-row{padding-top:7px!important}.fj-skill-prompt b{font-size:10.8px!important}.fj-skill-prompt small{font-size:8.8px!important}.fj-chip{min-height:31px!important;padding:0 13px!important;border-radius:10px!important;font-size:10.8px!important}
  .fj-personality-grid{gap:10px!important}.fj-personality-card{min-height:108px!important;grid-template-columns:38px minmax(0,1fr) 27px!important;gap:11px!important;padding:14px 15px!important;border-radius:17px!important}.fj-personality-index{width:38px!important;height:38px!important;border-radius:12px!important;font-size:11px!important}.fj-personality-card small{font-size:10px!important}.fj-personality-card strong{margin-top:3px!important;font-size:13.5px!important}.fj-personality-card p{margin-top:4px!important;font-size:10.8px!important;line-height:1.48!important}.fj-personality-card>i{width:27px!important;height:27px!important;font-size:12px!important}
  .fj-contact-panel{gap:11px!important}.fj-contact-visual,.fj-contact-fields{min-height:208px!important;border-radius:18px!important}.fj-contact-visual{padding:18px!important}.fj-contact-visual>span{width:43px!important;height:43px!important;margin-bottom:9px!important;border-radius:13px!important;font-size:17px!important}.fj-contact-visual strong{font-size:15.5px!important}.fj-contact-visual p{margin-top:4px!important;font-size:10.8px!important;line-height:1.5!important}.fj-contact-flow{margin-top:13px!important}.fj-contact-visual>small{margin-top:7px!important;font-size:9.7px!important}.fj-contact-fields{padding:17px!important}.fj-field+.fj-field{margin-top:9px!important}.fj-field>span{margin-bottom:5px!important;font-size:10.8px!important}.fj-field input{height:47px!important;border-radius:13px!important;font-size:12.8px!important}.fj-field-hint{margin-top:5px!important;font-size:9.5px!important}.fj-privacy-note{margin-top:9px!important;padding:8px 10px!important}.fj-privacy-note p{font-size:10.2px!important}

  .fj-modal-actions{padding:8px 18px!important;gap:12px!important}.fj-primary,.fj-secondary{min-height:48px!important;border-radius:15px!important}.fj-primary{min-width:190px!important;padding:5px 7px 5px 16px!important}.fj-primary span{font-size:12.8px!important}.fj-primary i{width:36px!important;height:36px!important;border-radius:11px!important;font-size:15px!important}.fj-secondary{padding:0 16px!important}.fj-secondary span{font-size:12.2px!important}.fj-nav-context{min-width:180px!important}.fj-nav-context small{margin-top:6px!important;font-size:9.7px!important}
}

/* Short desktop heights still fit, but we never shrink copy to unreadable sizes. */
@media(min-width:821px) and (max-height:780px){
  .fj-modal{height:calc(100svh - 18px)!important}
  .fj-modal-scroll>.fj-wizard-stage{grid-template-rows:190px minmax(0,1fr)!important}
  .fj-hero{margin-top:9px!important}.fj-hero-copy{padding:16px 24px 14px!important}.fj-eyebrow{display:none!important}.fj-step-kicker{margin-bottom:6px!important}.fj-hero-copy h2{font-size:25px!important;padding-bottom:9px!important}.fj-hero-copy>p{font-size:11.8px!important;margin-top:6px!important}.fj-progress{margin-top:7px!important}.fj-step-body{padding-top:11px!important;padding-bottom:11px!important}.fj-section-head{margin-bottom:9px!important}.fj-section-head strong{font-size:17.6px!important}.fj-section-head p{font-size:10.8px!important}.fj-modal-actions{height:60px!important;min-height:60px!important;padding-top:6px!important;padding-bottom:6px!important}.fj-primary,.fj-secondary{min-height:44px!important}
}

/* Tablet/mobile remains scrollable by design, with larger touch targets and no clipping. */
@media(max-width:820px){
  .fj-modal{max-height:96svh!important}
  .fj-modal-scroll{display:block!important;overflow:auto!important}
  .fj-wizard-stage{display:block!important;height:auto!important;overflow:visible!important}
  .fj-close{top:10px!important;right:10px!important;left:auto!important}
  .fj-hero-copy h2{font-weight:950!important}
  .fj-section-head strong{font-weight:950!important}
  .fj-feature-card strong,.fj-playtime-card strong,.fj-personality-card strong{font-size:14px!important}
  .fj-cta-shell{min-height:94px!important}
}

@media(max-width:560px){
  .fj-cta-shell{grid-template-columns:46px minmax(0,1fr) 28px!important;min-height:90px!important;padding:10px!important}
  .fj-cta-orb{width:44px!important;height:44px!important;border-radius:14px!important}.fj-cta-copy strong{font-size:17.5px!important}.fj-cta-meter-legend b{font-size:11px!important}
  .fj-modal{height:100svh!important;max-height:100svh!important;border-radius:0!important}
}

/* =========================================================
   Vanta Family Join v5.4 — Visual Card Artwork + Readability
   ========================================================= */
.fj-modal-content,.fj-wizard-stage,.fj-step-body{font-weight:600}
.fj-hero-copy h2,.fj-section-head strong,.fj-feature-card strong,.fj-eco-card b,
.fj-playtime-card strong,.fj-shift-card strong,.fj-activity-title strong,
.fj-personality-card strong,.fj-contact-fields label>span,.fj-contact-visual strong{
  font-weight:950!important;
  color:#fff!important;
  text-shadow:0 2px 18px rgba(0,0,0,.5),0 0 20px rgba(var(--fj-accent),.14)
}
.fj-feature-card p,.fj-eco-card span,.fj-section-head p,.fj-hero-copy>p,
.fj-playtime-card p,.fj-personality-card p,.fj-activity-title small{
  font-weight:650!important;
  color:rgba(247,242,255,.78)!important
}
/* remove the redundant clipped subtitle in the hero on the steps that had visible overflow */
.fj-hero[data-step="1"] .fj-hero-copy>p,
.fj-hero[data-step="2"] .fj-hero-copy>p,
.fj-hero[data-step="5"] .fj-hero-copy>p,
.fj-hero[data-step="7"] .fj-hero-copy>p{display:none!important}
.fj-hero-copy{overflow:hidden!important}

.fj-card-visual{position:relative!important;overflow:hidden!important;isolation:isolate!important;text-align:center!important;align-items:center!important;justify-content:center!important}
.fj-card-backdrop{position:absolute;inset:-18px;z-index:-2;background:var(--fj-card-image) center/cover no-repeat;filter:blur(7px) saturate(1.18) brightness(.42);transform:scale(1.08);opacity:.52;transition:transform .42s ease,filter .42s ease,opacity .42s ease}
.fj-card-visual::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,7,20,.20),rgba(10,6,18,.74)),radial-gradient(circle at 50% 10%,rgba(166,90,255,.15),transparent 52%);pointer-events:none}
.fj-card-visual:hover .fj-card-backdrop{transform:scale(1.14);filter:blur(5px) saturate(1.28) brightness(.48);opacity:.63}
.fj-card-visual[data-theme="income"]{--fj-card-image:url('family-join-card-assets/income.webp')}
.fj-card-visual[data-theme="freedom"]{--fj-card-image:url('family-join-card-assets/freedom.webp')}
.fj-card-visual[data-theme="notax"]{--fj-card-image:url('family-join-card-assets/notax.webp')}
.fj-card-visual[data-theme="gear"]{--fj-card-image:url('family-join-card-assets/gear.webp')}
.fj-card-visual[data-theme="locker"]{--fj-card-image:url('family-join-card-assets/locker.webp')}
.fj-card-visual[data-theme="panel"]{--fj-card-image:url('family-join-card-assets/panel.webp')}
.fj-card-visual[data-theme="mission"]{--fj-card-image:url('family-join-card-assets/mission.webp')}
.fj-card-visual[data-theme="rank"]{--fj-card-image:url('family-join-card-assets/rank.webp')}
.fj-feature-card{grid-template-columns:1fr!important;gap:8px!important;padding:18px 20px!important;min-height:132px!important}
.fj-feature-card .fj-feature-icon{margin:0 auto!important;width:46px!important;height:46px!important;display:grid!important;place-items:center!important;border-radius:15px!important;background:linear-gradient(145deg,rgba(185,114,255,.32),rgba(79,32,140,.18))!important;border:1px solid rgba(205,159,255,.34)!important;box-shadow:0 12px 35px -14px rgba(163,83,255,.9),inset 0 1px 0 rgba(255,255,255,.26)!important;font-size:19px!important;font-weight:950!important}
.fj-card-copy{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.fj-feature-card strong{font-size:16px!important;line-height:1.45!important}
.fj-feature-card p{font-size:12.2px!important;line-height:1.75!important;max-width:330px;margin:5px auto 0!important}
.fj-feature-card small{margin:8px auto 0!important;font-weight:800!important}

.fj-eco-card{min-height:116px!important;align-items:center!important;text-align:center!important;padding:17px 16px!important}
.fj-eco-icon{width:38px;height:38px;display:grid;place-items:center;margin:0 auto 8px;border-radius:13px;background:rgba(126,61,205,.27);border:1px solid rgba(197,145,255,.28);box-shadow:0 10px 26px -13px rgba(166,86,255,.95);font-style:normal;font-size:16px;font-weight:950;color:#fff}
.fj-eco-card b{font-size:14px!important}.fj-eco-card span{font-size:11.4px!important;line-height:1.7!important;max-width:250px;text-align:center!important}

.fj-primary i,.fj-secondary i{font-family:Arial,sans-serif!important;font-weight:900!important;direction:ltr!important}

@media (max-width:760px){
 .fj-feature-card{min-height:118px!important;padding:15px!important}.fj-card-backdrop{filter:blur(6px) saturate(1.12) brightness(.38);opacity:.48}
 .fj-feature-card strong{font-size:14.5px!important}.fj-feature-card p{font-size:11.4px!important}
}


/* ========================================================================== 
   Vanta Family Join v5.5 — Hero hierarchy + step identity polish
   ========================================================================== */
.fj-hero-copy{
  align-content:center!important;
  overflow:hidden!important;
}
.fj-eyebrow{
  min-height:27px!important;
  margin-bottom:10px!important;
  padding-inline:11px!important;
  font-size:9.6px!important;
  opacity:.78;
}
.fj-step-kicker{
  display:grid!important;
  grid-template-columns:62px minmax(0,1fr)!important;
  align-items:center!important;
  gap:13px!important;
  margin:0 0 12px!important;
}
.fj-step-kicker>.fj-step-num{
  position:relative!important;
  width:62px!important;
  height:62px!important;
  border-radius:19px!important;
  display:grid!important;
  place-items:center!important;
  padding-top:2px!important;
  color:#fff!important;
  font:950 20px/1 Inter,system-ui,sans-serif!important;
  letter-spacing:-.04em!important;
  background:
    radial-gradient(circle at 32% 20%,rgba(255,255,255,.26),transparent 28%),
    linear-gradient(145deg,rgba(var(--fj-accent),.72),rgba(33,17,66,.82) 72%)!important;
  border:1px solid rgba(206,180,255,.36)!important;
  box-shadow:0 0 0 5px rgba(var(--fj-accent),.07),0 17px 34px -15px rgba(var(--fj-accent),.95),inset 0 1px 0 rgba(255,255,255,.24)!important;
  text-shadow:0 0 16px rgba(255,255,255,.35)!important;
  isolation:isolate;
}
.fj-step-kicker>.fj-step-num::after{
  content:"/08";
  position:absolute;
  left:7px;
  bottom:6px;
  color:rgba(238,227,255,.58);
  font:800 7px/1 Inter,system-ui,sans-serif;
  letter-spacing:.02em;
}
.fj-step-kicker>.fj-step-num::before{
  content:"";
  position:absolute;
  inset:6px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.055);
  pointer-events:none;
}
.fj-step-meta{min-width:0!important}
.fj-step-meta small{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  color:rgba(236,227,252,.70)!important;
  font-size:12.5px!important;
  line-height:1.35!important;
  font-weight:800!important;
}
.fj-step-meta small i{
  width:7px;height:7px;border-radius:99px;display:block;flex:0 0 auto;
  background:rgb(var(--fj-accent));
  box-shadow:0 0 13px rgba(var(--fj-accent),.95),0 0 0 4px rgba(var(--fj-accent),.10);
}
.fj-step-meta b{
  display:block!important;
  margin-top:5px!important;
  color:#fff!important;
  font-size:17px!important;
  line-height:1.35!important;
  font-weight:950!important;
  letter-spacing:-.18px!important;
  text-shadow:0 6px 22px rgba(0,0,0,.38),0 0 16px rgba(var(--fj-accent),.18)!important;
}
.fj-hero-copy h2{
  max-width:500px!important;
  margin:0!important;
  padding-bottom:13px!important;
  color:rgba(255,255,255,.97)!important;
  font-size:clamp(24px,1.78vw,29px)!important;
  line-height:1.48!important;
  font-weight:900!important;
  letter-spacing:-.42px!important;
  text-shadow:0 13px 36px rgba(0,0,0,.46),0 0 22px rgba(var(--fj-accent),.15)!important;
}
.fj-hero-copy h2::after{
  width:58px!important;
  height:2px!important;
  opacity:.88!important;
}
.fj-hero-copy>p{
  margin-top:7px!important;
  font-size:12.8px!important;
  line-height:1.75!important;
  font-weight:700!important;
}
.fj-progress{
  margin-top:12px!important;
  width:min(315px,100%)!important;
}
.fj-progress>b{font-size:10.5px!important;font-weight:900!important}
.fj-progress-dots i{height:4px!important}

/* The replacement first-slide artwork is intentionally framed around its holographic core. */
.fj-hero[data-step="1"] .fj-hero-media{object-position:center 48%!important;filter:saturate(1.10) contrast(1.06) brightness(.88)!important}
.fj-hero[data-step="1"] .fj-hero-media-wrap::after{
  background:linear-gradient(90deg,rgba(7,5,13,.14),transparent 48%),linear-gradient(180deg,rgba(0,0,0,.02),rgba(8,5,15,.18))!important;
}

/* Readability bump throughout hero / section labels without creating visual bulk. */
.fj-section-kicker{font-weight:900!important}
.fj-section-head strong{font-weight:950!important;letter-spacing:-.22px!important}
.fj-feature-card strong,.fj-eco-card b{font-weight:950!important}

@media (max-height:980px) and (min-width:901px){
  .fj-step-kicker{grid-template-columns:54px minmax(0,1fr)!important;gap:11px!important;margin-bottom:8px!important}
  .fj-step-kicker>.fj-step-num{width:54px!important;height:54px!important;border-radius:17px!important;font-size:18px!important}
  .fj-step-meta small{font-size:11.5px!important}.fj-step-meta b{font-size:15.5px!important;margin-top:3px!important}
  .fj-hero-copy h2{font-size:clamp(22px,1.65vw,26px)!important;line-height:1.42!important;padding-bottom:10px!important}
  .fj-progress{margin-top:8px!important}
}
@media (max-width:900px){
  .fj-step-kicker{grid-template-columns:52px minmax(0,1fr)!important;gap:11px!important}
  .fj-step-kicker>.fj-step-num{width:52px!important;height:52px!important;border-radius:16px!important;font-size:18px!important}
  .fj-step-meta small{font-size:11.5px!important}.fj-step-meta b{font-size:15.5px!important}
  .fj-hero-copy h2{font-size:clamp(22px,5.9vw,27px)!important;line-height:1.45!important}
}

/* ========================================================================== 
   Vanta Family Join v5.6 — FINAL interaction / hierarchy / accessibility pass
   Goals: true optical centering, obvious selectable cards, stronger typography,
   artistic skills + team-fit steps, centered step titles, corrected RTL arrows.
   ========================================================================== */

/* ---------- Global title hierarchy: every slide reads from the center ---------- */
.fj-wizard-stage .fj-hero-copy{
  align-items:center!important;
  text-align:center!important;
}
.fj-wizard-stage .fj-eyebrow{align-self:center!important}
.fj-wizard-stage .fj-step-kicker{
  width:max-content!important;
  max-width:100%!important;
  margin-inline:auto!important;
}
.fj-wizard-stage .fj-step-meta{text-align:center!important}
.fj-wizard-stage .fj-step-meta small{justify-content:center!important}
.fj-wizard-stage .fj-hero-copy h2{
  margin-inline:auto!important;
  text-align:center!important;
  max-width:460px!important;
}
.fj-wizard-stage .fj-hero-copy h2::after{
  right:50%!important;
  left:auto!important;
  transform:translateX(50%)!important;
}
.fj-wizard-stage .fj-hero-copy>p{
  margin-inline:auto!important;
  text-align:center!important;
}
.fj-wizard-stage .fj-progress{margin-inline:auto!important}
.fj-wizard-stage .fj-section-head{
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  gap:10px!important;
}
.fj-wizard-stage .fj-section-head>div{width:100%!important;text-align:center!important}
.fj-wizard-stage .fj-section-kicker{text-align:center!important}
.fj-wizard-stage .fj-section-head strong{
  width:100%!important;
  max-width:760px!important;
  margin-inline:auto!important;
  text-align:center!important;
  font-weight:950!important;
  line-height:1.45!important;
  text-shadow:0 8px 30px rgba(0,0,0,.44),0 0 20px rgba(var(--fj-accent),.16)!important;
}
.fj-wizard-stage .fj-section-head strong::after{
  right:50%!important;
  transform:translateX(50%)!important;
}
.fj-wizard-stage .fj-section-head p{
  max-width:720px!important;
  margin-inline:auto!important;
  text-align:center!important;
  font-weight:650!important;
  color:rgba(244,238,255,.72)!important;
}
.fj-wizard-stage .fj-eligibility{align-self:center!important}

/* ---------- Step 3: perfect + / − optical centering ---------- */
.fj-counter-card{text-align:center!important}
.fj-counter-top{justify-content:center!important;gap:9px!important;flex-wrap:wrap!important}
.fj-counter-top span,.fj-counter-top b{text-align:center!important}
.fj-counter-control{
  justify-content:center!important;
  justify-items:center!important;
  align-items:center!important;
}
.fj-counter-control button{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  overflow:hidden!important;
  line-height:1!important;
}
.fj-counter-glyph{
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  line-height:1!important;
  font-family:Inter,Arial,sans-serif!important;
  font-size:28px!important;
  font-weight:650!important;
  transform:translateY(-1px)!important;
  text-align:center!important;
}
.fj-counter-control button:last-child .fj-counter-glyph{transform:translateY(-2px)!important}
.fj-counter-scale{justify-content:center!important}
.fj-helper{text-align:center!important;justify-content:center!important}
.fj-helper>div{text-align:center!important}

/* ---------- Step 4: selectable playtime cards now look interactive ---------- */
.fj-playtime-grid{align-items:stretch!important}
.fj-playtime-card{
  cursor:pointer!important;
  text-align:center!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:22px 54px 46px!important;
  isolation:isolate!important;
  overflow:hidden!important;
  border-color:transparent!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 18px 42px -34px rgba(var(--fj-accent),.58)!important;
}
.fj-playtime-card::before{
  content:""!important;
  position:absolute!important;
  inset:7px!important;
  border-radius:17px!important;
  border:1px dashed rgba(var(--fj-accent),.12)!important;
  background:
    radial-gradient(130px 70px at 50% 0%,rgba(var(--fj-accent),.11),transparent 72%),
    repeating-linear-gradient(90deg,transparent 0 24px,rgba(255,255,255,.012) 25px 26px)!important;
  pointer-events:none!important;
  opacity:.7!important;
}
.fj-playtime-card:hover::before{border-color:rgba(var(--fj-accent),.26)!important;opacity:1!important}
.fj-playtime-card.is-active::before{border-style:solid!important;border-color:rgba(var(--fj-accent),.42)!important;box-shadow:inset 0 0 30px rgba(var(--fj-accent),.045)!important}
.fj-playtime-index{
  top:15px!important;left:17px!important;
  font-size:18px!important;font-weight:950!important;
  color:rgba(226,215,249,.34)!important;
}
.fj-choice-indicator{
  position:absolute!important;
  top:14px!important;right:16px!important;
  width:30px!important;height:30px!important;
  display:grid!important;place-items:center!important;
  border-radius:10px!important;
  border:1px solid rgba(var(--fj-accent),.25)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(var(--fj-accent),.055))!important;
  color:rgba(237,229,255,.52)!important;
  font:900 14px/1 Inter,system-ui,sans-serif!important;
  transition:.22s var(--fj-ease)!important;
}
.fj-playtime-card.is-active .fj-choice-indicator{
  color:#fff!important;
  border-color:rgba(var(--fj-accent),.62)!important;
  background:linear-gradient(145deg,rgba(var(--fj-accent),.74),rgba(66,31,116,.72))!important;
  box-shadow:0 0 0 4px rgba(var(--fj-accent),.08),0 0 22px rgba(var(--fj-accent),.46)!important;
}
.fj-playtime-tag{margin-inline:auto!important;font-weight:900!important}
.fj-playtime-card strong{
  margin-top:10px!important;
  font-size:16px!important;
  font-weight:950!important;
  text-align:center!important;
}
.fj-playtime-card p{
  max-width:300px!important;
  margin:5px auto 0!important;
  font-weight:650!important;
  text-align:center!important;
}
.fj-playtime-hint{
  position:absolute!important;
  left:50%!important;bottom:24px!important;
  transform:translateX(-50%)!important;
  color:rgba(235,226,253,.44)!important;
  font-size:9.5px!important;font-weight:800!important;
  white-space:nowrap!important;
  transition:.22s var(--fj-ease)!important;
}
.fj-playtime-card.is-active .fj-playtime-hint{color:#d9c9ff!important;text-shadow:0 0 12px rgba(var(--fj-accent),.46)!important}
.fj-playtime-meter{left:18%!important;right:18%!important;bottom:12px!important;height:5px!important}

/* ---------- Step 5: selected time cards remain centered and obvious ---------- */
.fj-shift-timeline{justify-content:center!important}
.fj-shift-card{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;cursor:pointer!important}
.fj-shift-card strong,.fj-shift-card small{text-align:center!important;font-weight:900!important}
.fj-selected-shift{justify-content:center!important;text-align:center!important}
.fj-selected-shift>div{flex:0 1 auto!important;text-align:center!important}

/* ---------- Step 6: skills becomes a polished mini HUD instead of plain cards ---------- */
.fj-step-body[data-step="6"]{
  background:
    radial-gradient(520px 220px at 50% 0%,rgba(var(--fj-accent),.055),transparent 76%),
    linear-gradient(180deg,rgba(255,255,255,.008),transparent)!important;
}
.fj-step-body[data-step="6"]::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.24;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:26px 26px;
  mask-image:linear-gradient(to bottom,black,transparent 84%);
}
.fj-activity-list{position:relative;z-index:1!important;gap:12px!important}
.fj-activity-card{
  position:relative!important;
  overflow:hidden!important;
  padding:15px 16px 14px!important;
  border-radius:20px!important;
  background:
    radial-gradient(210px 90px at 18% 0%,rgba(var(--fj-accent),.11),transparent 72%) padding-box,
    linear-gradient(160deg,rgba(255,255,255,.062),rgba(255,255,255,.015)) padding-box,
    linear-gradient(145deg,rgba(211,190,255,.30),rgba(var(--fj-accent),.09) 58%,rgba(255,255,255,.025)) border-box!important;
}
.fj-activity-card::after{
  content:"";position:absolute;left:-20%;right:-20%;bottom:-56px;height:95px;border-radius:50%;
  background:radial-gradient(circle,rgba(var(--fj-accent),.17),transparent 68%);filter:blur(18px);pointer-events:none;
}
.fj-activity-top{direction:rtl!important;align-items:center!important}
.fj-activity-title{flex:1!important;justify-content:flex-start!important;text-align:right!important}
.fj-activity-icon{
  width:44px!important;height:44px!important;flex:0 0 44px!important;
  display:grid!important;place-items:center!important;
  border-radius:14px!important;
  background:radial-gradient(circle at 35% 22%,rgba(255,255,255,.22),transparent 28%),linear-gradient(145deg,rgba(var(--fj-accent),.44),rgba(54,27,94,.42))!important;
  border:1px solid rgba(208,183,255,.30)!important;
  box-shadow:0 12px 28px -16px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.16)!important;
}
.fj-activity-icon svg{width:23px;height:23px;fill:none;stroke:#f5efff;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 7px rgba(var(--fj-accent),.64))}
.fj-activity-title strong{font-size:14px!important;font-weight:950!important}
.fj-activity-title small{font-size:10.4px!important;font-weight:650!important;color:rgba(242,235,255,.62)!important}
.fj-score-ring{box-shadow:0 0 0 4px rgba(var(--fj-accent),.035),0 0 22px -7px rgba(var(--fj-accent),.82)!important}
.fj-score-ring b{font-weight:950!important}
.fj-range-wrap{margin:9px 0 7px!important}
.fj-range-wrap input[type=range]{height:24px!important}
.fj-range-wrap input[type=range]::-webkit-slider-runnable-track{height:8px!important}
.fj-range-wrap input[type=range]::-webkit-slider-thumb{width:22px!important;height:22px!important;margin-top:-7px!important;border-width:5px!important}
.fj-skill-row{padding-top:7px!important;gap:9px!important}
.fj-skill-prompt{
  display:flex!important;align-items:center!important;gap:8px!important;
  min-width:126px!important;padding:5px 8px!important;border-radius:12px!important;
  background:rgba(255,255,255,.022)!important;border:1px solid rgba(196,181,253,.09)!important;
}
.fj-skill-prompt>i{
  width:28px!important;height:28px!important;border-radius:9px!important;
  border:1px solid rgba(var(--fj-accent),.28)!important;
  background:rgba(var(--fj-accent),.08)!important;
  color:#d7c4ff!important;
  font-size:13px!important;
}
.fj-skill-prompt:not(.is-set)>i{animation:fjV56Question 1.7s ease-in-out infinite!important}
@keyframes fjV56Question{50%{box-shadow:0 0 0 5px rgba(var(--fj-accent),.07),0 0 16px rgba(var(--fj-accent),.38);transform:translateY(-1px)}}
.fj-skill-prompt b{font-size:11px!important;font-weight:950!important}
.fj-skill-prompt small{font-size:9px!important;font-weight:700!important;color:rgba(236,228,251,.52)!important}
.fj-chip{
  min-width:62px!important;min-height:34px!important;
  border-radius:11px!important;font-size:11.5px!important;font-weight:950!important;
}
.fj-activity-card.is-missing-skill{animation:fjV56Missing .42s ease!important}
@keyframes fjV56Missing{0%,100%{transform:none}35%{transform:translateX(4px)}70%{transform:translateX(-4px)}}

/* ---------- Step 7: personality as four unmistakable choice cards ---------- */
.fj-personality-grid{gap:12px!important}
.fj-personality-card{
  cursor:pointer!important;
  min-height:126px!important;
  grid-template-columns:38px 52px minmax(0,1fr) 32px!important;
  gap:11px!important;
  align-items:center!important;
  padding:16px!important;
  text-align:center!important;
  overflow:hidden!important;
}
.fj-personality-card::before{
  content:"";position:absolute;inset:7px;border-radius:15px;border:1px dashed rgba(var(--fj-accent),.10);pointer-events:none;transition:.22s var(--fj-ease);
}
.fj-personality-card:hover::before{border-color:rgba(var(--fj-accent),.24)}
.fj-personality-card.is-active::before{border-style:solid;border-color:rgba(var(--fj-accent),.36);box-shadow:inset 0 0 28px rgba(var(--fj-accent),.04)}
.fj-personality-index{
  width:38px!important;height:38px!important;border-radius:12px!important;
  font-size:11px!important;color:rgba(230,219,255,.56)!important;
}
.fj-personality-icon{
  width:48px;height:48px;display:grid;place-items:center;border-radius:16px;
  border:1px solid rgba(var(--fj-accent),.30);
  background:radial-gradient(circle at 34% 20%,rgba(255,255,255,.18),transparent 28%),linear-gradient(145deg,rgba(var(--fj-accent),.33),rgba(43,22,75,.32));
  box-shadow:0 12px 24px -17px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.12);
  color:#f0e8ff;font:900 18px/1 Inter,system-ui,sans-serif;text-shadow:0 0 14px rgba(var(--fj-accent),.62)
}
.fj-personality-card>div{text-align:center!important}
.fj-personality-card small{font-size:10.2px!important;font-weight:900!important;color:#cfbcff!important}
.fj-personality-card strong{font-size:14.5px!important;font-weight:950!important;text-align:center!important}
.fj-personality-card p{font-size:10.8px!important;line-height:1.55!important;font-weight:650!important;text-align:center!important;max-width:340px!important;margin-inline:auto!important}
.fj-personality-card>i{font-weight:950!important}
.fj-personality-card.is-active .fj-personality-icon{border-color:rgba(var(--fj-accent),.58);box-shadow:0 0 0 4px rgba(var(--fj-accent),.07),0 0 26px rgba(var(--fj-accent),.36),inset 0 1px 0 rgba(255,255,255,.18)}

/* ---------- Step 8: centered, bolder, calmer final step ---------- */
.fj-step-body[data-step="8"] .fj-section-head{margin-bottom:14px!important}
.fj-contact-panel{align-items:stretch!important}
.fj-contact-visual{
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
.fj-contact-visual>span{margin:0 auto 13px!important}
.fj-contact-visual strong{font-size:18px!important;font-weight:950!important;text-align:center!important}
.fj-contact-visual p{max-width:360px!important;margin:7px auto 0!important;text-align:center!important;font-weight:650!important}
.fj-contact-flow{width:min(390px,100%)!important;margin:20px auto 0!important}
.fj-contact-visual>small{text-align:center!important;font-weight:700!important}
.fj-contact-fields{text-align:center!important}
.fj-field>span{text-align:center!important;font-size:13px!important;font-weight:950!important}
.fj-field-hint{text-align:center!important;font-weight:700!important}
.fj-privacy-note{justify-content:center!important;text-align:center!important}
.fj-privacy-note p{text-align:center!important;font-weight:650!important}

/* ---------- Validation: reason is prominent, friendly and never hidden ---------- */
.fj-step-alert{
  font-weight:850!important;
  text-align:center!important;
  border-radius:13px!important;
}
.fj-step-alert.is-visible{
  border:1px solid rgba(251,191,36,.25)!important;
  background:linear-gradient(180deg,rgba(251,191,36,.105),rgba(251,191,36,.035))!important;
  color:#fff0b8!important;
  box-shadow:0 10px 30px -24px rgba(251,191,36,.8),inset 0 1px 0 rgba(255,255,255,.055)!important;
}

/* ---------- RTL footer arrows: next points left; previous points right ---------- */
.fj-primary i,.fj-secondary i{font-family:Inter,Arial,sans-serif!important;line-height:1!important}
.fj-primary:hover:not(:disabled) i{transform:translateX(-3px)!important}
.fj-secondary:hover i{transform:translateX(3px)!important}

/* ---------- Desktop fit: no needless internal scrolling ---------- */
@media(min-width:901px){
  .fj-modal-scroll>.fj-wizard-stage{min-height:0!important}
  .fj-step-body{overflow:hidden!important}
  .fj-step-body[data-step="4"] .fj-playtime-card{min-height:112px!important}
  .fj-step-body[data-step="6"] .fj-activity-card{min-height:0!important}
  .fj-step-body[data-step="7"] .fj-personality-card{min-height:104px!important}
  .fj-step-body[data-step="8"] .fj-contact-visual,.fj-step-body[data-step="8"] .fj-contact-fields{min-height:218px!important}
}

/* ---------- Compact desktop / laptop ---------- */
@media(min-width:821px) and (max-height:820px){
  .fj-playtime-card{padding:15px 48px 38px!important}
  .fj-playtime-card strong{font-size:14px!important}.fj-playtime-card p{font-size:10.8px!important}
  .fj-choice-indicator{top:10px!important;right:12px!important;width:26px!important;height:26px!important}
  .fj-personality-card{min-height:98px!important;padding:12px 13px!important;grid-template-columns:32px 40px minmax(0,1fr) 28px!important}
  .fj-personality-icon{width:40px;height:40px;border-radius:13px;font-size:15px}
  .fj-personality-card p{font-size:9.8px!important;line-height:1.42!important}
  .fj-activity-card{padding:10px 12px!important}.fj-activity-icon{width:36px!important;height:36px!important;flex-basis:36px!important}.fj-activity-icon svg{width:19px;height:19px}
  .fj-skill-prompt{min-width:112px!important}.fj-chip{min-width:54px!important;min-height:30px!important}
}

/* ---------- Mobile: preserve hierarchy without forcing wide layouts ---------- */
@media(max-width:820px){
  .fj-wizard-stage .fj-step-kicker{grid-template-columns:48px minmax(0,1fr)!important;width:min(330px,100%)!important}
  .fj-wizard-stage .fj-step-meta{text-align:right!important}.fj-wizard-stage .fj-step-meta small{justify-content:flex-start!important}
  .fj-playtime-card{padding:18px 46px 42px!important}
  .fj-personality-card{grid-template-columns:34px 44px minmax(0,1fr) 28px!important;padding:14px!important}
  .fj-personality-icon{width:42px;height:42px;border-radius:14px;font-size:16px}
  .fj-contact-panel{grid-template-columns:1fr!important}
}
@media(max-width:560px){
  .fj-counter-control{grid-template-columns:50px minmax(90px,1fr) 50px!important}
  .fj-counter-glyph{font-size:25px!important}
  .fj-personality-card{grid-template-columns:30px 40px minmax(0,1fr) 26px!important;gap:8px!important}
  .fj-personality-icon{width:38px;height:38px;border-radius:12px;font-size:14px}
  .fj-playtime-card{min-height:130px!important}
}

/* ========================================================================== 
   Vanta Family Join v5.7 — FINAL ART INTEGRATION / UX LOCK
   Generated artwork is used as low-contrast visual context, never as text.
   ========================================================================== */
:root{--fj-v57-asset:'family-join-v57-assets/'}

/* --- Join CTA: compact interactive glass tile --- */
.fj-login-cta{margin-top:12px!important;padding-top:12px!important}
.fj-cta-shell{
  min-height:104px!important;padding:14px 62px 14px 18px!important;grid-template-columns:1fr!important;grid-template-rows:auto auto auto!important;
  border-radius:20px!important;text-align:center!important;overflow:hidden!important;
  background:
    radial-gradient(230px 130px at 82% 20%,rgba(139,92,246,.20),transparent 68%),
    linear-gradient(145deg,rgba(35,24,56,.78),rgba(12,8,21,.86)) padding-box,
    linear-gradient(145deg,rgba(213,196,255,.36),rgba(124,58,237,.14) 48%,rgba(255,255,255,.05)) border-box!important;
  backdrop-filter:blur(18px) saturate(1.12)!important;
  box-shadow:0 22px 46px -32px rgba(109,40,217,.92),inset 0 1px 0 rgba(255,255,255,.10)!important;
}
.fj-cta-shell::before{
  content:""!important;position:absolute!important;inset:-45% -15%!important;pointer-events:none!important;
  background:url('family-join-v57-assets/vanta-emblem.webp') 94% 50%/150px no-repeat!important;
  opacity:.055!important;filter:saturate(.8)!important;transform:rotate(-7deg)!important;
}
.fj-cta-topline{grid-column:1!important;grid-row:1!important;justify-self:center!important;margin:0!important;font-size:9px!important;letter-spacing:.19em!important;font-weight:950!important}
.fj-cta-copy{grid-column:1!important;grid-row:2!important;justify-self:stretch!important;margin:1px 0 0!important;text-align:center!important}
.fj-cta-copy strong{display:inline-block!important;font-size:17px!important;font-weight:1000!important;line-height:1.35!important;padding:0 18px 8px!important;letter-spacing:-.3px!important;text-shadow:0 4px 24px rgba(154,96,255,.28)!important}
.fj-cta-copy strong::before,.fj-cta-copy strong::after{content:"";display:inline-block;width:18px;height:1px;margin:0 9px 4px;background:linear-gradient(90deg,transparent,#a78bfa);box-shadow:0 0 9px rgba(167,139,250,.6)}
.fj-cta-copy strong::after{transform:scaleX(-1)}
.fj-cta-copy strong::before{transform:none}
.fj-cta-copy strong::after{position:static!important}
.fj-cta-meter,.fj-cta-status{grid-column:1!important;grid-row:3!important;justify-self:center!important;margin:2px auto 0!important}
.fj-cta-meter-legend{min-height:27px!important;padding:4px 12px!important;border-radius:999px!important;border:1px solid rgba(94,226,177,.17)!important;background:rgba(21,64,52,.15)!important}
.fj-cta-meter-legend b{font-family:Inter,system-ui,sans-serif!important;font-size:12px!important;font-weight:900!important;color:#b7f7dc!important}
.fj-cta-orb{
  position:absolute!important;right:10px!important;top:50%!important;transform:translateY(-50%)!important;
  width:48px!important;height:48px!important;border-radius:16px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;
}
.fj-cta-orb img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 0 12px rgba(139,92,246,.55));animation:fjV57Orb 5.4s ease-in-out infinite}
.fj-cta-orb::before{content:""!important;inset:-7px!important;border-radius:21px!important;background:url('family-join-v57-assets/holo-ring.webp') center/contain no-repeat!important;opacity:.30!important;border:0!important;animation:fjV57Ring 16s linear infinite!important}
.fj-cta-orb>em{display:none!important}.fj-cta-orb>i{right:-1px!important;bottom:-1px!important}
.fj-cta-arrow{left:10px!important;right:auto!important;top:50%!important;position:absolute!important;transform:translateY(-50%)!important;width:34px!important;height:34px!important;border:0!important;background:url('family-join-v57-assets/nav-left.webp') center/contain no-repeat!important;color:transparent!important;opacity:.72!important;box-shadow:none!important}
.fj-cta-shell:hover:not(:disabled) .fj-cta-arrow{transform:translate(-3px,-50%) scale(1.05)!important;background:url('family-join-v57-assets/nav-left.webp') center/contain no-repeat!important;opacity:1!important;box-shadow:none!important}
@keyframes fjV57Orb{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.035)}}
@keyframes fjV57Ring{to{transform:rotate(360deg)}}

/* --- Modal shell: artwork + better viewport fit --- */
.fj-modal{height:min(850px,calc(100dvh - 40px))!important;max-height:calc(100dvh - 40px)!important;border-radius:26px!important}
.fj-modal::before{
  background:
    linear-gradient(180deg,rgba(13,8,24,.90),rgba(8,5,14,.96)),
    url('family-join-v57-assets/ambient-dashboard.webp') center/cover no-repeat!important;
  opacity:.96!important;
}
.fj-modal::after{opacity:.45!important}
.fj-close{width:39px!important;height:39px!important;border:0!important;background:url('family-join-v57-assets/modal-close.webp') center/contain no-repeat!important;color:transparent!important;box-shadow:0 10px 26px -12px rgba(0,0,0,.9)!important;opacity:.72!important}
.fj-close span{opacity:0!important}
.fj-close:hover{opacity:1!important;transform:rotate(5deg) scale(1.05)!important;background:url('family-join-v57-assets/modal-close.webp') center/contain no-repeat!important;box-shadow:0 0 22px rgba(139,92,246,.28)!important}
.fj-modal-scroll{overflow-x:hidden!important}

/* --- Hero: right aligned hierarchy, smaller title, stronger stage marker --- */
.fj-wizard-stage .fj-hero-copy{align-items:flex-start!important;text-align:right!important;padding:34px 38px 30px!important}
.fj-wizard-stage .fj-eyebrow{align-self:flex-start!important;font-weight:950!important}
.fj-wizard-stage .fj-step-kicker{width:100%!important;max-width:100%!important;margin:0 0 9px!important;direction:rtl!important;grid-template-columns:56px minmax(0,1fr)!important;gap:12px!important}
.fj-wizard-stage .fj-step-kicker>.fj-step-num{width:56px!important;height:56px!important;border-radius:16px!important;font-size:19px!important;font-weight:1000!important;background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.20),transparent 34%),linear-gradient(145deg,rgba(var(--fj-accent),.46),rgba(36,18,64,.62))!important;box-shadow:0 12px 28px -16px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.18)!important}
.fj-wizard-stage .fj-step-meta{text-align:right!important;align-items:flex-start!important}.fj-wizard-stage .fj-step-meta small{justify-content:flex-start!important;font-size:11.5px!important;font-weight:850!important}.fj-wizard-stage .fj-step-meta b{font-size:15px!important;font-weight:950!important}
.fj-wizard-stage .fj-hero-copy h2{margin:0!important;max-width:500px!important;text-align:right!important;font-size:clamp(23px,1.8vw,30px)!important;line-height:1.48!important;font-weight:1000!important;letter-spacing:-.55px!important}
.fj-wizard-stage .fj-hero-copy h2::after{right:0!important;left:auto!important;transform:none!important;width:64px!important}
.fj-wizard-stage .fj-hero-copy>p{margin:8px 0 0!important;text-align:right!important;font-size:12.5px!important;line-height:1.8!important;font-weight:700!important}
.fj-wizard-stage .fj-progress{margin:10px 0 0!important;width:min(330px,100%)!important}

/* --- Section headings: right aligned + fine visual anchor --- */
.fj-wizard-stage .fj-section-head{flex-direction:row!important;align-items:flex-end!important;justify-content:space-between!important;text-align:right!important;gap:16px!important;margin-bottom:16px!important}
.fj-wizard-stage .fj-section-head>div{width:auto!important;max-width:760px!important;text-align:right!important}
.fj-wizard-stage .fj-section-kicker{display:inline-flex!important;align-items:center!important;gap:7px!important;text-align:right!important;font-size:10.5px!important;font-weight:950!important;color:#b89cff!important}
.fj-wizard-stage .fj-section-kicker::before{content:"";width:18px;height:2px;border-radius:99px;background:linear-gradient(90deg,#8b5cf6,#d8c7ff);box-shadow:0 0 9px rgba(139,92,246,.55)}
.fj-wizard-stage .fj-section-head strong{width:auto!important;max-width:760px!important;margin:4px 0 0!important;text-align:right!important;font-size:20px!important;line-height:1.5!important;font-weight:1000!important}
.fj-wizard-stage .fj-section-head strong::after{right:0!important;transform:none!important}
.fj-wizard-stage .fj-section-head p{max-width:690px!important;margin:6px 0 0!important;text-align:right!important;font-size:11.7px!important;line-height:1.75!important;font-weight:700!important}
.fj-wizard-stage .fj-eligibility{align-self:flex-end!important;font-weight:900!important}

/* --- Artwork utility for cards --- */
.fj-playtime-card,.fj-shift-card,.fj-counter-card,.fj-activity-card,.fj-personality-card{position:relative!important;isolation:isolate!important;overflow:hidden!important}
.fj-playtime-card::after,.fj-shift-card::after,.fj-counter-card::after,.fj-activity-card::before,.fj-personality-card::after{
  content:""!important;position:absolute!important;z-index:-2!important;inset:0!important;pointer-events:none!important;
  background-image:linear-gradient(180deg,rgba(15,9,25,.36),rgba(8,5,14,.88)),var(--fj-card-art)!important;background-size:cover!important;background-position:center!important;
  opacity:.42!important;filter:saturate(.9) contrast(1.04)!important;transition:opacity .28s ease,transform .55s cubic-bezier(.2,.7,.2,1),filter .28s ease!important;
}
.fj-playtime-card:hover::after,.fj-shift-card:hover::after,.fj-counter-card:hover::after,.fj-personality-card:hover::after{opacity:.59!important;transform:scale(1.035)!important;filter:saturate(1.1) contrast(1.06)!important}
.fj-playtime-card.is-active::after,.fj-shift-card.is-active::after,.fj-personality-card.is-active::after{opacity:.68!important}

/* Step 3: image-backed counters, numeric value without a pill */
.fj-counter-card.is-level{--fj-card-art:url('family-join-v57-assets/level-city.webp')}
.fj-counter-card.is-age{--fj-card-art:url('family-join-v57-assets/age-real.webp')}
.fj-counter-card{min-height:142px!important;padding:18px 20px!important}
.fj-counter-top{position:relative;z-index:2!important;justify-content:center!important}.fj-counter-top b{font-size:14px!important;font-weight:1000!important}.fj-counter-top span{font-size:10px!important;font-weight:850!important}
.fj-counter-control{position:relative;z-index:2!important;grid-template-columns:50px minmax(90px,1fr) 50px!important;gap:10px!important;margin-top:9px!important}
.fj-counter-control>strong{border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;font:1000 25px/1 Inter,system-ui,sans-serif!important;color:#fff!important;text-shadow:0 0 22px rgba(var(--fj-accent),.45)!important;min-height:50px!important;display:grid!important;place-items:center!important}
.fj-counter-control button{width:48px!important;height:48px!important;margin:auto!important;border-radius:15px!important;background:linear-gradient(145deg,rgba(var(--fj-accent),.31),rgba(17,10,30,.62))!important;border:1px solid rgba(207,190,255,.24)!important;box-shadow:0 12px 24px -16px rgba(var(--fj-accent),.9),inset 0 1px 0 rgba(255,255,255,.14)!important}
.fj-counter-glyph{font-size:26px!important;font-weight:850!important;transform:none!important}.fj-counter-control button:last-child .fj-counter-glyph{transform:none!important}
.fj-counter-scale{position:relative;z-index:2!important}

/* Step 4: playtime cards clearly selectable */
.fj-playtime-card{min-height:132px!important;padding:18px 46px 42px!important;border:1px solid rgba(207,190,255,.10)!important;background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.012))!important}
.fj-playtime-card strong{font-size:15.5px!important;font-weight:1000!important}.fj-playtime-card p{font-size:11px!important;font-weight:700!important;color:rgba(244,238,255,.74)!important}.fj-playtime-tag{font-weight:950!important}
.fj-playtime-card:hover{border-color:rgba(var(--fj-accent),.32)!important;box-shadow:0 24px 48px -30px rgba(var(--fj-accent),.8),inset 0 1px 0 rgba(255,255,255,.11)!important}.fj-playtime-card.is-active{border-color:rgba(var(--fj-accent),.65)!important;box-shadow:0 0 0 3px rgba(var(--fj-accent),.07),0 26px 56px -30px rgba(var(--fj-accent),.95)!important}

/* Step 5: five time cards with their own scene */
.fj-shift-card{min-height:108px!important;padding:14px 10px!important;border-color:rgba(207,190,255,.12)!important;background:rgba(12,8,20,.72)!important}.fj-shift-icon{font-size:17px!important}.fj-shift-card strong{font-size:13.5px!important;font-weight:1000!important}.fj-shift-card small{font-size:10px!important;font-weight:800!important;color:rgba(243,237,255,.72)!important}.fj-shift-card.is-active{border-color:rgba(var(--fj-accent),.62)!important;box-shadow:0 0 0 3px rgba(var(--fj-accent),.07),0 22px 42px -25px rgba(var(--fj-accent),.95)!important}

/* Step 6: art-driven skill HUD; paired artwork cross-fades for combo activities */
.fj-step-body[data-step="6"]::before{background:linear-gradient(180deg,rgba(10,6,17,.84),rgba(10,6,17,.95)),url('family-join-v57-assets/skills-dashboard.webp') center/cover no-repeat!important;opacity:.34!important}
.fj-activity-card{background:linear-gradient(155deg,rgba(255,255,255,.06),rgba(255,255,255,.012))!important;border-color:rgba(203,185,255,.12)!important}
.fj-activity-card::before{background-image:linear-gradient(180deg,rgba(13,8,22,.35),rgba(8,5,14,.90)),var(--fj-card-art)!important;opacity:.42!important}
.fj-activity-card::after{content:""!important;position:absolute!important;z-index:-3!important;inset:0!important;height:auto!important;left:0!important;right:0!important;bottom:0!important;border-radius:inherit!important;background-image:linear-gradient(180deg,rgba(13,8,22,.38),rgba(8,5,14,.92)),var(--fj-card-art-alt)!important;background-size:cover!important;background-position:center!important;filter:none!important;opacity:0!important;transition:opacity .5s ease!important}
.fj-activity-card[data-activity="fight_road"]:hover::after,.fj-activity-card[data-activity="capture_island"]:hover::after{opacity:.50!important}
.fj-activity-title strong{font-size:14.5px!important;font-weight:1000!important}.fj-activity-title small{font-size:10.5px!important;font-weight:750!important}.fj-skill-prompt b{font-weight:1000!important}.fj-chip{font-weight:1000!important}

/* Step 7: team-fit cards + generated personality scenes */
.fj-step-body[data-step="7"]::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(10,6,17,.90),rgba(10,6,17,.96)),url('family-join-v57-assets/team-network.webp') center/cover no-repeat;opacity:.32;border-radius:22px}
.fj-personality-card{grid-template-columns:34px 42px minmax(0,1fr) 30px!important;min-height:112px!important;padding:14px 15px!important;background:linear-gradient(155deg,rgba(255,255,255,.052),rgba(255,255,255,.012))!important;border-color:rgba(203,185,255,.11)!important}
.fj-personality-card>div{text-align:right!important}.fj-personality-card strong{text-align:right!important;font-size:14px!important;font-weight:1000!important}.fj-personality-card p{text-align:right!important;font-size:10.4px!important;font-weight:700!important;margin:5px 0 0!important}.fj-personality-card small{text-align:right!important;font-weight:950!important}
.fj-personality-card.is-active{border-color:rgba(var(--fj-accent),.64)!important;box-shadow:0 0 0 3px rgba(var(--fj-accent),.07),0 24px 50px -30px rgba(var(--fj-accent),.9)!important}

/* Step 8 contact art */
.fj-contact-visual{position:relative!important;overflow:hidden!important;isolation:isolate!important;text-align:right!important;align-items:flex-start!important}
.fj-contact-art{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;opacity:.45;filter:saturate(.9) brightness(.72)}
.fj-contact-visual::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(12,7,21,.96),rgba(12,7,21,.62) 52%,rgba(12,7,21,.78))}
.fj-contact-visual>span{margin:0 0 13px auto!important;background:url('family-join-v57-assets/vanta-emblem.webp') center/contain no-repeat!important;color:transparent!important;border:0!important;box-shadow:none!important}
.fj-contact-visual strong,.fj-contact-visual p,.fj-contact-visual>small{text-align:right!important;margin-right:0!important;margin-left:auto!important}.fj-contact-fields{text-align:right!important}.fj-field>span,.fj-field-hint{text-align:right!important}.fj-privacy-note{justify-content:flex-start!important;text-align:right!important}.fj-privacy-note p{text-align:right!important}

/* Ecosystem hub gets the generated V emblem without replacing readable text */
.fj-eco-hub img{position:absolute;inset:9px;width:calc(100% - 18px);height:calc(100% - 18px);object-fit:contain;opacity:.28;filter:drop-shadow(0 0 10px rgba(139,92,246,.45));pointer-events:none}.fj-eco-hub span,.fj-eco-hub strong,.fj-eco-hub small{position:relative;z-index:2}

/* Navigation: generated glass arrows, correct RTL direction */
.fj-primary,.fj-secondary{border-radius:16px!important;backdrop-filter:blur(14px) saturate(1.12)!important}
.fj-primary{min-height:52px!important;background:linear-gradient(145deg,rgba(108,43,219,.84),rgba(139,92,246,.62))!important;box-shadow:0 20px 42px -20px rgba(var(--fj-accent),.92),inset 0 1px 0 rgba(255,255,255,.20)!important}
.fj-secondary{min-height:48px!important;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015))!important}
.fj-primary i,.fj-secondary i{color:transparent!important;background-color:transparent!important;border:0!important;box-shadow:none!important;background-repeat:no-repeat!important;background-position:center!important;background-size:contain!important}
.fj-primary i{width:38px!important;height:38px!important;background-image:url('family-join-v57-assets/nav-left.webp')!important}
.fj-secondary i{width:31px!important;height:31px!important;background-image:url('family-join-v57-assets/nav-right.webp')!important}
.fj-primary:hover:not(:disabled) i{transform:translateX(-3px) scale(1.06)!important}.fj-secondary:hover i{transform:translateX(3px) scale(1.05)!important}

/* Fine typography / spacing */
.fj-feature-card strong,.fj-eco-card b,.fj-counter-top b,.fj-playtime-card strong,.fj-shift-card strong,.fj-activity-title strong,.fj-personality-card strong,.fj-contact-visual strong,.fj-field>span{font-weight:1000!important}
.fj-feature-card p,.fj-eco-card span,.fj-playtime-card p,.fj-activity-title small,.fj-personality-card p,.fj-contact-visual p,.fj-field-hint{font-weight:700!important}

/* Reduce needless scrolling on laptop / desktop. Content may scroll only when genuinely necessary. */
@media(min-width:901px){
  .fj-modal-scroll{display:flex!important;flex-direction:column!important;overflow:hidden!important}
  .fj-modal-scroll>.fj-wizard-stage{flex:1 1 auto!important;min-height:0!important;overflow:hidden!important;display:grid!important;grid-template-rows:auto minmax(0,1fr)!important}
  .fj-hero{min-height:245px!important;height:245px!important;margin:18px 24px 0!important}.fj-hero-media-wrap{min-height:245px!important}.fj-step-body{padding:22px 28px 20px!important;min-height:0!important;overflow:auto!important;scrollbar-width:thin!important}.fj-modal-actions{min-height:74px!important;padding:11px 24px!important}
  .fj-step-body[data-step="3"],.fj-step-body[data-step="4"],.fj-step-body[data-step="5"],.fj-step-body[data-step="6"],.fj-step-body[data-step="7"],.fj-step-body[data-step="8"]{overflow:hidden!important}
}
@media(min-width:901px) and (max-height:820px){
  .fj-modal{height:calc(100dvh - 20px)!important;max-height:calc(100dvh - 20px)!important}.fj-hero{height:205px!important;min-height:205px!important}.fj-hero-media-wrap{min-height:205px!important}.fj-wizard-stage .fj-hero-copy{padding:24px 32px 20px!important}.fj-wizard-stage .fj-hero-copy h2{font-size:22px!important}.fj-step-body{padding:16px 24px 14px!important}.fj-modal-actions{min-height:64px!important;padding:8px 20px!important}.fj-primary{min-height:46px!important}.fj-secondary{min-height:44px!important}
}

/* Mobile keeps the art but prioritizes legibility and natural page scrolling */
@media(max-width:900px){
  .fj-modal{height:min(94dvh,900px)!important;max-height:94dvh!important}.fj-modal-scroll{overflow:auto!important}.fj-hero{height:auto!important;min-height:0!important}.fj-wizard-stage .fj-hero-copy{align-items:flex-start!important;text-align:right!important;padding:24px 22px!important}.fj-wizard-stage .fj-step-kicker{grid-template-columns:50px minmax(0,1fr)!important}.fj-wizard-stage .fj-hero-copy h2,.fj-wizard-stage .fj-hero-copy>p{text-align:right!important}.fj-wizard-stage .fj-section-head{align-items:flex-start!important}.fj-wizard-stage .fj-section-head>div,.fj-wizard-stage .fj-section-head strong,.fj-wizard-stage .fj-section-head p{text-align:right!important}.fj-cta-shell{padding-right:58px!important}
}
@media(max-width:560px){
  .fj-cta-copy strong{font-size:15px!important}.fj-cta-copy strong::before,.fj-cta-copy strong::after{width:10px!important;margin-inline:5px!important}.fj-cta-orb{right:7px!important;width:43px!important;height:43px!important}.fj-cta-arrow{left:7px!important;width:30px!important;height:30px!important}.fj-wizard-stage .fj-hero-copy h2{font-size:22px!important}.fj-wizard-stage .fj-section-head strong{font-size:18px!important}.fj-counter-control{grid-template-columns:46px minmax(76px,1fr) 46px!important}.fj-counter-control button{width:44px!important;height:44px!important}
}


/* ========================================================================== 
   Vanta Family Join v5.7.2 — coded CTA icon + centered login + Latin hours
   ========================================================================== */

/* Join CTA: symmetric inner spacing so the title stays dead-center. */
.fj-cta-shell{
  padding:14px 68px!important;
}

/* Remove the old image-based V orb completely. */
.fj-cta-orb{display:none!important}

/* Custom animated Vanta sigil: vector-only, no image asset dependency. */
.fj-cta-sigil{
  position:absolute!important;right:12px!important;top:50%!important;
  width:52px!important;height:52px!important;transform:translateY(-50%)!important;
  display:grid!important;place-items:center!important;isolation:isolate!important;pointer-events:none!important;
  filter:drop-shadow(0 0 13px rgba(139,92,246,.28))!important;
  transition:transform .28s cubic-bezier(.2,.8,.2,1),filter .28s ease!important;
}
.fj-cta-sigil svg{position:relative;z-index:4;width:44px;height:44px;overflow:visible}
.fj-cta-sigil-halo{
  position:absolute;z-index:1;inset:0;border-radius:50%;
  background:conic-gradient(from 15deg,transparent 0 14%,rgba(185,150,255,.82) 20%,transparent 28% 54%,rgba(94,226,177,.64) 61%,transparent 69% 100%);
  -webkit-mask:radial-gradient(circle,transparent 57%,#000 59% 66%,transparent 68%);mask:radial-gradient(circle,transparent 57%,#000 59% 66%,transparent 68%);
  opacity:.68;animation:fjSigilOrbit 6.8s linear infinite;
}
.fj-cta-sigil::before{
  content:"";position:absolute;z-index:2;inset:5px;border-radius:17px;clip-path:polygon(50% 0,88% 18%,100% 56%,76% 92%,36% 100%,5% 76%,0 36%,24% 8%);
  background:radial-gradient(circle at 34% 20%,rgba(255,255,255,.20),transparent 28%),linear-gradient(145deg,rgba(93,52,164,.56),rgba(19,10,36,.90) 62%,rgba(8,5,16,.96));
  border:1px solid rgba(209,190,255,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.13),inset 0 -12px 22px rgba(5,2,14,.34),0 15px 28px -18px rgba(124,58,237,.9);
}
.fj-cta-sigil-frame{fill:none;stroke:rgba(218,202,255,.38);stroke-width:1.25;stroke-linejoin:round;stroke-dasharray:2.2 4.2}
.fj-cta-sigil-v{fill:rgba(245,239,255,.96);stroke:rgba(218,193,255,.85);stroke-width:.7;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(176,129,255,.9)) drop-shadow(0 0 11px rgba(124,58,237,.56))}
.fj-cta-sigil-cut{fill:none;stroke:rgba(22,9,46,.88);stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.fj-cta-sigil-node{fill:#d9c3ff;filter:drop-shadow(0 0 4px #a66cff);animation:fjSigilNode 2.6s ease-in-out infinite}
.fj-cta-sigil-node--b{fill:#8af0cc;filter:drop-shadow(0 0 4px rgba(94,226,177,.95));animation-delay:-1.3s}
.fj-cta-sigil>i,.fj-cta-sigil>b{position:absolute;z-index:5;width:4px;height:4px;border-radius:50%;pointer-events:none}
.fj-cta-sigil>i{right:3px;top:12px;background:#d7bfff;box-shadow:0 0 7px #a66cff,0 0 13px rgba(139,92,246,.8);animation:fjSigilSpark 2.2s ease-in-out infinite}
.fj-cta-sigil>b{left:4px;bottom:10px;background:#7ce7c0;box-shadow:0 0 7px rgba(94,226,177,.95),0 0 13px rgba(94,226,177,.66);animation:fjSigilSpark 2.2s ease-in-out -1.1s infinite}
.fj-cta-shell:hover:not(:disabled) .fj-cta-sigil{transform:translateY(-50%) scale(1.075) rotate(-1.5deg)!important;filter:drop-shadow(0 0 18px rgba(139,92,246,.46))!important}
.fj-cta-shell:hover:not(:disabled) .fj-cta-sigil-v{filter:drop-shadow(0 0 6px rgba(204,177,255,1)) drop-shadow(0 0 15px rgba(124,58,237,.72))}
@keyframes fjSigilOrbit{to{transform:rotate(360deg)}}
@keyframes fjSigilNode{0%,100%{opacity:.35;transform:scale(.76)}50%{opacity:1;transform:scale(1.35)}}
@keyframes fjSigilSpark{0%,100%{opacity:.18;transform:scale(.65)}50%{opacity:1;transform:scale(1.45)}}

/* Step 4: western/Latin hour digits are isolated from the Persian text font. */
.fj-step-body[data-step="4"] .fj-latin-hour,
.fj-step-body[data-step="4"] .fj-playtime-index{
  display:inline-block!important;direction:ltr!important;unicode-bidi:isolate!important;
  font-family:Arial,Helvetica,sans-serif!important;font-variant-numeric:lining-nums tabular-nums!important;
  font-feature-settings:"lnum" 1,"tnum" 1!important;letter-spacing:.01em!important;
}
.fj-step-body[data-step="4"] .fj-latin-hour{font-weight:900!important}

@media(max-width:560px){
  .fj-cta-shell{padding-inline:58px!important}
  .fj-cta-sigil{right:8px!important;width:46px!important;height:46px!important}
  .fj-cta-sigil svg{width:39px;height:39px}
  .fj-cta-arrow{left:7px!important;width:31px!important;height:31px!important}
}

@media(prefers-reduced-motion:reduce){
  .fj-cta-sigil-halo,.fj-cta-sigil-node,.fj-cta-sigil>i,.fj-cta-sigil>b{animation:none!important}
}


/* Final recruitment interaction refinements */

/* Modal close: real transparent X icon, no image-backed empty tile. */
.fj-close{
  width:38px!important;height:38px!important;
  display:grid!important;place-items:center!important;
  padding:0!important;border:0!important;border-radius:12px!important;
  background:transparent!important;color:#f5efff!important;
  box-shadow:none!important;opacity:.76!important;
  transition:opacity .2s var(--fj-ease),transform .2s var(--fj-ease),background-color .2s var(--fj-ease),filter .2s var(--fj-ease)!important;
}
.fj-close span{display:grid!important;place-items:center!important;width:100%!important;height:100%!important;opacity:1!important}
.fj-close svg{width:24px!important;height:24px!important;display:block!important;stroke:currentColor!important;stroke-width:2!important;stroke-linecap:round!important;filter:drop-shadow(0 0 7px rgba(167,139,250,.24))}
.fj-close:hover{background:rgba(139,92,246,.09)!important;color:#fff!important;opacity:1!important;transform:scale(1.06)!important;box-shadow:none!important;filter:drop-shadow(0 0 10px rgba(139,92,246,.24))!important}
.fj-close:focus-visible{outline:2px solid rgba(196,181,253,.58)!important;outline-offset:2px!important}

/* Step 6: clearer two-part interaction (interest first, skill second). */
.fj-step-body[data-step="6"]{padding-top:16px!important}
.fj-step-body[data-step="6"] .fj-section-head{margin-bottom:9px!important}
.fj-step-body[data-step="6"] .fj-section-head p{max-width:700px!important;color:rgba(243,237,255,.72)!important}
.fj-skill-guide{
  position:relative;z-index:2;
  width:min(620px,100%);min-height:42px;margin:0 0 10px auto;
  display:flex;align-items:center;justify-content:flex-start;gap:10px;
  padding:6px 8px;border:1px solid rgba(196,181,253,.10);border-radius:14px;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.fj-skill-guide>span{display:grid;grid-template-columns:30px auto;grid-template-rows:auto auto;column-gap:8px;align-items:center;min-width:0}
.fj-skill-guide>span>i{grid-row:1/3;width:30px;height:30px;display:grid;place-items:center;border-radius:10px;border:1px solid rgba(var(--fj-accent),.28);background:rgba(var(--fj-accent),.09);color:#d9c7ff;font:900 9px/1 Inter,system-ui,sans-serif;direction:ltr}
.fj-skill-guide>span>b{color:#fff;font-size:10.8px;font-weight:1000;line-height:1.2}
.fj-skill-guide>span>small{margin-top:2px;color:rgba(239,232,251,.53);font-size:8.8px;font-weight:750;line-height:1.2;white-space:nowrap}
.fj-skill-guide>em{width:28px;height:1px;background:linear-gradient(90deg,rgba(167,139,250,.12),rgba(167,139,250,.54),rgba(167,139,250,.12));box-shadow:0 0 9px rgba(139,92,246,.18)}
.fj-step-body[data-step="6"] .fj-activity-list{gap:10px!important}
.fj-step-body[data-step="6"] .fj-activity-card{
  min-height:158px!important;padding:12px 14px 11px!important;border-radius:18px!important;
  border:1px solid rgba(205,187,255,.13)!important;
  background:linear-gradient(155deg,rgba(255,255,255,.065),rgba(255,255,255,.014))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 20px 42px -38px rgba(var(--fj-accent),.72)!important;
}
.fj-step-body[data-step="6"] .fj-activity-card:hover,.fj-step-body[data-step="6"] .fj-activity-card:focus-within{
  transform:translateY(-2px)!important;border-color:rgba(var(--fj-accent),.34)!important;
  box-shadow:0 24px 48px -32px rgba(var(--fj-accent),.76),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.fj-step-body[data-step="6"] .fj-activity-card::before{opacity:.31!important;filter:saturate(.82) contrast(.95)!important}
.fj-step-body[data-step="6"] .fj-activity-title{gap:10px!important}
.fj-step-body[data-step="6"] .fj-activity-title strong{font-size:14.5px!important;line-height:1.35!important}
.fj-step-body[data-step="6"] .fj-activity-title small{margin-top:3px!important;font-size:9.8px!important;line-height:1.35!important;color:rgba(244,238,255,.66)!important}
.fj-step-body[data-step="6"] .fj-activity-icon{width:40px!important;height:40px!important;flex-basis:40px!important;border-radius:13px!important}
.fj-step-body[data-step="6"] .fj-activity-icon svg{width:21px!important;height:21px!important}
.fj-step-body[data-step="6"] .fj-score-ring{width:50px!important;height:50px!important;flex-basis:50px!important;grid-template-rows:auto auto;align-content:center;gap:1px!important}
.fj-step-body[data-step="6"] .fj-score-ring::after{inset:5px!important;background:linear-gradient(180deg,rgba(21,14,36,.98),rgba(10,7,18,.98))!important}
.fj-step-body[data-step="6"] .fj-score-ring span,.fj-step-body[data-step="6"] .fj-score-ring b{position:relative;z-index:2;display:block;text-align:center}
.fj-step-body[data-step="6"] .fj-score-ring span{color:rgba(238,231,252,.49);font-size:7.5px;font-weight:850;line-height:1.05}
.fj-step-body[data-step="6"] .fj-score-ring b{font-size:10.5px!important;line-height:1.15!important}
.fj-interest-control{margin-top:7px;padding:7px 9px 5px;border-radius:12px;border:1px solid rgba(196,181,253,.075);background:rgba(4,3,9,.22)}
.fj-interest-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:1px;color:rgba(241,234,253,.62);font-size:9px;font-weight:800}
.fj-interest-head>b{color:#d9c8ff;font-size:9px;font-weight:950}
.fj-interest-control .fj-range-wrap{margin:0!important}
.fj-interest-control .fj-range-wrap input[type=range]{height:21px!important}
.fj-interest-control .fj-range-wrap input[type=range]::-webkit-slider-runnable-track{height:7px!important}
.fj-interest-control .fj-range-wrap input[type=range]::-webkit-slider-thumb{width:19px!important;height:19px!important;margin-top:-6px!important;border-width:4px!important}
.fj-interest-scale{display:flex;align-items:center;justify-content:space-between;margin-top:-1px;color:rgba(239,231,252,.33);font-size:7.7px;font-weight:750}
.fj-step-body[data-step="6"] .fj-skill-row{margin-top:7px!important;padding-top:8px!important;gap:9px!important}
.fj-step-body[data-step="6"] .fj-skill-prompt{min-width:132px!important;padding:5px 7px!important;border-radius:11px!important;background:rgba(7,5,13,.42)!important}
.fj-step-body[data-step="6"] .fj-skill-prompt>i{width:27px!important;height:27px!important;border-radius:9px!important}
.fj-step-body[data-step="6"] .fj-skill-prompt b{font-size:10.4px!important}
.fj-step-body[data-step="6"] .fj-skill-prompt small{font-size:8.3px!important;white-space:nowrap!important}
.fj-step-body[data-step="6"] .fj-activity-skill{gap:7px!important;flex:1;justify-content:flex-end}
.fj-step-body[data-step="6"] .fj-chip{
  min-width:72px!important;min-height:32px!important;padding:0 10px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;
  border-radius:10px!important;font-size:10.8px!important;
  background:rgba(7,5,14,.54)!important;
}
.fj-step-body[data-step="6"] .fj-chip>span{font-weight:1000}
.fj-step-body[data-step="6"] .fj-chip>i{width:15px;height:15px;display:grid;place-items:center;border-radius:5px;color:#fff;font-size:9px;font-weight:1000;background:transparent}
.fj-step-body[data-step="6"] .fj-chip.is-active{background:linear-gradient(180deg,rgba(var(--fj-accent),.48),rgba(var(--fj-accent),.18))!important;border-color:rgba(var(--fj-accent),.70)!important}
.fj-step-body[data-step="6"] .fj-chip.is-active>i{background:rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}

/* Step 8: center the final confirmation message and make it confidently readable. */
.fj-step-body[data-step="8"] .fj-contact-visual{
  position:relative!important;align-items:center!important;justify-content:center!important;text-align:center!important;
  padding:24px 24px 20px!important;
}
.fj-step-body[data-step="8"] .fj-contact-visual::before{
  background:linear-gradient(180deg,rgba(12,7,21,.76),rgba(12,7,21,.88))!important;
}
.fj-step-body[data-step="8"] .fj-contact-corner-logo{
  position:absolute;z-index:2;top:14px;right:14px;width:38px;height:38px;object-fit:contain;
  opacity:.92;filter:drop-shadow(0 0 12px rgba(139,92,246,.46));pointer-events:none;
}
.fj-step-body[data-step="8"] .fj-contact-visual>span{
  width:52px!important;height:52px!important;margin:0 auto 12px!important;align-self:center!important;
  background:url('family-join-v57-assets/vanta-emblem.webp') center/contain no-repeat!important;
}
.fj-step-body[data-step="8"] .fj-contact-visual strong{
  width:100%!important;margin:0 auto!important;text-align:center!important;
  font-size:21px!important;line-height:1.5!important;font-weight:1000!important;letter-spacing:-.35px!important;
  color:#fff!important;text-shadow:0 10px 28px rgba(0,0,0,.48),0 0 20px rgba(var(--fj-accent),.20)!important;
}
.fj-step-body[data-step="8"] .fj-contact-visual p{
  max-width:410px!important;margin:8px auto 0!important;text-align:center!important;
  color:rgba(249,246,255,.88)!important;font-size:12.4px!important;line-height:1.9!important;font-weight:850!important;
}
.fj-step-body[data-step="8"] .fj-contact-flow{width:min(360px,88%)!important;margin:16px auto 0!important}
.fj-step-body[data-step="8"] .fj-contact-visual>small{
  width:100%!important;margin:8px auto 0!important;text-align:center!important;color:rgba(241,234,252,.64)!important;font-weight:800!important;
}

@media(min-width:901px) and (max-height:820px){
  .fj-skill-guide{min-height:36px;margin-bottom:7px;padding-block:4px}
  .fj-skill-guide>span>i{width:27px;height:27px}.fj-skill-guide>span{grid-template-columns:27px auto}.fj-skill-guide>span>b{font-size:10px}.fj-skill-guide>span>small{font-size:8.1px}
  .fj-step-body[data-step="6"] .fj-activity-card{min-height:138px!important;padding:9px 11px 8px!important}
  .fj-step-body[data-step="6"] .fj-interest-control{margin-top:5px;padding:5px 8px 3px}
  .fj-step-body[data-step="6"] .fj-skill-row{margin-top:5px!important;padding-top:6px!important}
  .fj-step-body[data-step="6"] .fj-skill-prompt{min-width:118px!important}
  .fj-step-body[data-step="6"] .fj-chip{min-width:62px!important;min-height:29px!important}
  .fj-step-body[data-step="8"] .fj-contact-visual strong{font-size:19px!important}
  .fj-step-body[data-step="8"] .fj-contact-visual p{font-size:11.2px!important}
}
@media(max-width:820px){
  .fj-skill-guide{width:100%;margin:0 auto 12px;justify-content:center}
  .fj-step-body[data-step="6"] .fj-activity-card{min-height:0!important}
  .fj-step-body[data-step="6"] .fj-skill-row{align-items:stretch!important;flex-direction:column!important}
  .fj-step-body[data-step="6"] .fj-skill-prompt{width:100%!important;min-width:0!important}
  .fj-step-body[data-step="6"] .fj-activity-skill{width:100%;justify-content:stretch!important}
  .fj-step-body[data-step="6"] .fj-chip{flex:1!important;min-height:40px!important}
  .fj-step-body[data-step="8"] .fj-contact-corner-logo{top:12px;right:12px;width:34px;height:34px}
  .fj-step-body[data-step="8"] .fj-contact-visual{padding:24px 18px 20px!important}
}
@media(max-width:520px){
  .fj-skill-guide>span{grid-template-columns:26px auto}.fj-skill-guide>span>i{width:26px;height:26px}.fj-skill-guide>span>small{display:none}.fj-skill-guide>em{width:16px}
  .fj-step-body[data-step="8"] .fj-contact-visual strong{font-size:19px!important}
  .fj-step-body[data-step="8"] .fj-contact-visual p{font-size:11.6px!important}
}


/* ==========================================================================
   Vanta Family Join v5.9.1 — final cleanup for step 6 + stable nav arrows
   ========================================================================== */

.fj-step-body[data-step="6"] .fj-skill-guide{display:none!important}
.fj-step-body[data-step="6"] .fj-section-head{margin-bottom:10px!important}
.fj-step-body[data-step="6"] .fj-section-head p{max-width:760px!important}
.fj-step-body[data-step="6"]{padding-top:14px!important;padding-bottom:18px!important}
.fj-step-body[data-step="6"] .fj-activity-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;align-items:start!important}
.fj-step-body[data-step="6"] .fj-activity-card{min-height:0!important;height:auto!important}
@media(min-width:901px){
  .fj-step-body[data-step="6"]{overflow:auto!important;padding-inline-end:22px!important;scrollbar-width:thin!important;scrollbar-color:rgba(var(--fj-accent),.52) transparent!important}
}
@media(min-width:901px) and (max-height:860px){
  .fj-step-body[data-step="6"] .fj-activity-card{padding:10px 12px 9px!important}
  .fj-step-body[data-step="6"] .fj-activity-title strong{font-size:13.5px!important}
  .fj-step-body[data-step="6"] .fj-activity-title small{font-size:9.3px!important}
  .fj-step-body[data-step="6"] .fj-score-ring{width:46px!important;height:46px!important;flex-basis:46px!important}
}
@media(max-width:820px){
  .fj-step-body[data-step="6"] .fj-activity-list{grid-template-columns:1fr!important}
}

/* Restore the premium glass navigation from the previous build; only the directions are corrected. */
.fj-primary,.fj-secondary{border-radius:16px!important;backdrop-filter:blur(14px) saturate(1.12)!important}
.fj-primary{min-height:52px!important;background:linear-gradient(145deg,rgba(108,43,219,.84),rgba(139,92,246,.62))!important;box-shadow:0 20px 42px -20px rgba(var(--fj-accent),.92),inset 0 1px 0 rgba(255,255,255,.20)!important}
.fj-secondary{min-height:48px!important;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015))!important}
.fj-primary i,.fj-secondary i{color:transparent!important;background-color:transparent!important;border:0!important;box-shadow:none!important;background-repeat:no-repeat!important;background-position:center!important;background-size:contain!important;font-size:0!important;text-shadow:none!important}
.fj-primary i{width:38px!important;height:38px!important;background-image:url('family-join-v57-assets/nav-right.webp')!important}
.fj-secondary i{width:31px!important;height:31px!important;background-image:url('family-join-v57-assets/nav-left.webp')!important}
.fj-primary:hover:not(:disabled) i{transform:translateX(3px) scale(1.06)!important}
.fj-secondary:hover i{transform:translateX(-3px) scale(1.05)!important}


/* ==========================================================================
   Vanta Family Join v5.9.3 — step 6 single-slider premium experience
   ========================================================================== */

.fj-step-body[data-step="6"] .fj-skill-guide,
.fj-step-body[data-step="6"] .fj-skill-row{display:none!important}
.fj-step-body[data-step="6"] .fj-section-head strong{font-size:31px!important}
.fj-step-body[data-step="6"] .fj-section-head p{max-width:780px!important;color:rgba(247,241,255,.78)!important}
.fj-step-body[data-step="6"] .fj-activity-list{gap:12px!important}
.fj-step-body[data-step="6"] .fj-activity-card--slider{padding:16px 16px 14px!important;border-radius:20px!important}
.fj-step-body[data-step="6"] .fj-activity-card--slider .fj-score-ring{width:56px!important;height:56px!important;flex-basis:56px!important}
.fj-step-body[data-step="6"] .fj-activity-card--slider .fj-score-ring span{font-size:8px!important}
.fj-step-body[data-step="6"] .fj-activity-card--slider .fj-score-ring b{font-size:12px!important}
.fj-step-body[data-step="6"] .fj-interest-control--premium{
  margin-top:11px!important;
  padding:12px 13px 10px!important;
  border-radius:16px!important;
  border:1px solid rgba(221,209,255,.10)!important;
  background:linear-gradient(180deg,rgba(9,6,16,.56),rgba(19,12,31,.78))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 30px -28px rgba(109,40,217,.58)!important;
}
.fj-step-body[data-step="6"] .fj-interest-control--premium .fj-interest-head{margin-bottom:8px!important;font-size:11px!important;color:rgba(238,231,252,.72)!important}
.fj-step-body[data-step="6"] .fj-interest-control--premium .fj-interest-head b{font-size:11px!important;color:#f4eeff!important;padding:4px 10px;border-radius:999px;background:rgba(139,92,246,.14);border:1px solid rgba(196,181,253,.18)}
.fj-step-body[data-step="6"] .fj-range-wrap--premium{position:relative!important;margin:0!important;padding:6px 0!important}
.fj-step-body[data-step="6"] .fj-range-wrap--premium::before{content:"";position:absolute;inset:50% 0 auto;transform:translateY(-50%);height:10px;border-radius:999px;background:linear-gradient(90deg,rgba(255,255,255,.05),rgba(255,255,255,.02));box-shadow:inset 0 1px 2px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.03)}
.fj-step-body[data-step="6"] .fj-range-wrap--premium input[type=range]{position:relative;z-index:1;height:34px!important}
.fj-step-body[data-step="6"] .fj-range-wrap--premium input[type=range]::-webkit-slider-runnable-track{height:10px!important;border-radius:999px!important;background:linear-gradient(90deg,rgba(139,92,246,.96) 0%,rgba(167,139,250,.96) var(--fj-range),rgba(255,255,255,.07) var(--fj-range),rgba(255,255,255,.04) 100%)!important;box-shadow:inset 0 1px 2px rgba(0,0,0,.28),0 0 20px rgba(139,92,246,.10)}
.fj-step-body[data-step="6"] .fj-range-wrap--premium input[type=range]::-webkit-slider-thumb{width:24px!important;height:24px!important;margin-top:-7px!important;border:6px solid rgba(248,243,255,.96)!important;border-radius:50%!important;background:radial-gradient(circle at 35% 35%,#ffffff,#d7c4ff 58%,#8b5cf6)!important;box-shadow:0 0 0 5px rgba(139,92,246,.12),0 10px 20px -10px rgba(139,92,246,.95)!important}
.fj-step-body[data-step="6"] .fj-range-wrap--premium input[type=range]::-moz-range-track{height:10px!important;border:none!important;border-radius:999px!important;background:rgba(255,255,255,.06)!important}
.fj-step-body[data-step="6"] .fj-range-wrap--premium input[type=range]::-moz-range-progress{height:10px!important;border-radius:999px!important;background:linear-gradient(90deg,rgba(139,92,246,.96),rgba(167,139,250,.96))!important}
.fj-step-body[data-step="6"] .fj-range-wrap--premium input[type=range]::-moz-range-thumb{width:24px!important;height:24px!important;border:6px solid rgba(248,243,255,.96)!important;border-radius:50%!important;background:#b48aff!important;box-shadow:0 0 0 5px rgba(139,92,246,.12),0 10px 20px -10px rgba(139,92,246,.95)!important}
.fj-step-body[data-step="6"] .fj-interest-scale{margin-top:5px!important;font-size:8.6px!important;color:rgba(239,231,252,.42)!important}
@media(min-width:901px) and (max-height:860px){
  .fj-step-body[data-step="6"] .fj-activity-card--slider{padding:14px 14px 12px!important}
  .fj-step-body[data-step="6"] .fj-activity-card--slider .fj-score-ring{width:52px!important;height:52px!important;flex-basis:52px!important}
}


/* ==========================================================================
   Vanta Family Join v5.9.4 — minimal premium polish for slides 3, 4, 5, 7
   ========================================================================== */

/* Shared heading polish for the requested slides */
.fj-step-body[data-step="3"] .fj-section-head strong,
.fj-step-body[data-step="4"] .fj-section-head strong,
.fj-step-body[data-step="5"] .fj-section-head strong,
.fj-step-body[data-step="7"] .fj-section-head strong{
  font-size:clamp(24px,2vw,29px)!important;
  letter-spacing:-.45px!important;
}
.fj-step-body[data-step="3"] .fj-section-head p,
.fj-step-body[data-step="4"] .fj-section-head p,
.fj-step-body[data-step="5"] .fj-section-head p,
.fj-step-body[data-step="7"] .fj-section-head p{
  max-width:760px!important;
  color:rgba(244,239,255,.76)!important;
}

/* Slide 3: level + age — cleaner premium counters */
.fj-step-body[data-step="3"] .fj-counter-grid{gap:14px!important}
.fj-step-body[data-step="3"] .fj-counter-card{
  min-height:154px!important;
  padding:20px 20px 18px!important;
  border-radius:22px!important;
  border:1px solid rgba(214,201,255,.13)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.014))!important;
  box-shadow:0 18px 36px -28px rgba(var(--fj-accent),.55), inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.fj-step-body[data-step="3"] .fj-counter-top{gap:8px!important}
.fj-step-body[data-step="3"] .fj-counter-top span{font-size:11px!important;color:rgba(225,214,251,.62)!important;font-weight:850!important;letter-spacing:.03em!important}
.fj-step-body[data-step="3"] .fj-counter-top b{font-size:17px!important;font-weight:1000!important;color:#f6f2ff!important}
.fj-step-body[data-step="3"] .fj-counter-control{
  margin-top:18px!important;
  grid-template-columns:48px minmax(92px,1fr) 48px!important;
  align-items:center!important;
}
.fj-step-body[data-step="3"] .fj-counter-control button{
  width:46px!important;height:46px!important;border-radius:15px!important;
  border:1px solid rgba(214,201,255,.16)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.03))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 22px -18px rgba(var(--fj-accent),.55)!important;
}
.fj-step-body[data-step="3"] .fj-counter-control button:hover{transform:translateY(-1px)!important;border-color:rgba(var(--fj-accent),.34)!important}
.fj-step-body[data-step="3"] .fj-counter-glyph{font-size:22px!important;font-weight:1000!important}
.fj-step-body[data-step="3"] .fj-counter-control strong{font-size:34px!important;line-height:1!important;color:#fff!important;text-shadow:0 0 16px rgba(var(--fj-accent),.16)!important}
.fj-step-body[data-step="3"] .fj-counter-scale{margin-top:14px!important;justify-content:center!important;opacity:.84!important}
.fj-step-body[data-step="3"] .fj-helper{margin-top:14px!important;border-radius:18px!important;background:rgba(12,8,20,.66)!important;border:1px solid rgba(214,201,255,.10)!important}
.fj-step-body[data-step="3"] .fj-eligibility{border-radius:999px!important;padding:0 14px!important;min-height:38px!important;font-weight:950!important}

/* Slide 4: playtime buckets — more minimal and easier to scan */
.fj-step-body[data-step="4"] .fj-playtime-grid{gap:12px!important}
.fj-step-body[data-step="4"] .fj-playtime-card{
  min-height:138px!important;
  padding:18px 22px 22px!important;
  border-radius:22px!important;
  border:1px solid rgba(212,199,255,.11)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.048),rgba(255,255,255,.012))!important;
  box-shadow:0 18px 36px -28px rgba(var(--fj-accent),.52), inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.fj-step-body[data-step="4"] .fj-playtime-card:hover{transform:translateY(-2px)!important}
.fj-step-body[data-step="4"] .fj-playtime-card.is-active{border-color:rgba(var(--fj-accent),.54)!important;box-shadow:0 0 0 3px rgba(var(--fj-accent),.06),0 24px 48px -30px rgba(var(--fj-accent),.84)!important}
.fj-step-body[data-step="4"] .fj-playtime-index{top:14px!important;right:14px!important;width:34px!important;height:34px!important;border-radius:12px!important;font-size:10px!important;color:rgba(241,233,255,.55)!important;background:rgba(255,255,255,.03)!important;border:1px solid rgba(214,201,255,.08)!important}
.fj-step-body[data-step="4"] .fj-choice-indicator{left:14px!important;top:14px!important;width:34px!important;height:34px!important;border-radius:12px!important}
.fj-step-body[data-step="4"] .fj-playtime-tag{display:inline-flex!important;align-items:center!important;min-height:30px!important;padding:0 10px!important;border-radius:999px!important;background:rgba(var(--fj-accent),.11)!important;border:1px solid rgba(var(--fj-accent),.18)!important;font-size:10.5px!important;font-weight:950!important}
.fj-step-body[data-step="4"] .fj-playtime-card strong{margin-top:14px!important;font-size:15.5px!important;font-weight:1000!important}
.fj-step-body[data-step="4"] .fj-playtime-card p{margin-top:6px!important;font-size:11.1px!important;line-height:1.72!important;color:rgba(244,238,255,.72)!important}
.fj-step-body[data-step="4"] .fj-playtime-meter{margin-top:12px!important;height:8px!important;border-radius:999px!important;background:rgba(255,255,255,.05)!important;overflow:hidden!important}
.fj-step-body[data-step="4"] .fj-playtime-meter i{height:100%!important;border-radius:999px!important;box-shadow:0 0 14px rgba(var(--fj-accent),.22)!important}
.fj-step-body[data-step="4"] .fj-playtime-hint{margin-top:10px!important;font-size:10.5px!important;font-weight:850!important}
.fj-step-body[data-step="4"] .fj-playtime-pulse{display:none!important}

/* Slide 5: schedule / shift choice — calm, centered, premium */
.fj-step-body[data-step="5"] .fj-shift-grid{gap:12px!important}
.fj-step-body[data-step="5"] .fj-shift-card{
  min-height:116px!important;
  padding:16px 12px!important;
  border-radius:20px!important;
  border:1px solid rgba(214,201,255,.10)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012))!important;
  box-shadow:0 16px 32px -28px rgba(var(--fj-accent),.5), inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.fj-step-body[data-step="5"] .fj-shift-card:hover{transform:translateY(-2px)!important}
.fj-step-body[data-step="5"] .fj-shift-card.is-active{border-color:rgba(var(--fj-accent),.56)!important;box-shadow:0 0 0 3px rgba(var(--fj-accent),.06),0 22px 42px -28px rgba(var(--fj-accent),.88)!important}
.fj-step-body[data-step="5"] .fj-shift-icon{
  width:46px!important;height:46px!important;display:grid!important;place-items:center!important;margin:0 auto 10px!important;
  border-radius:14px!important;background:rgba(var(--fj-accent),.10)!important;border:1px solid rgba(var(--fj-accent),.14)!important;
  font-size:18px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important
}
.fj-step-body[data-step="5"] .fj-shift-card strong{font-size:14.5px!important;font-weight:1000!important;color:#faf7ff!important}
.fj-step-body[data-step="5"] .fj-shift-card small{margin-top:7px!important;font-size:10.5px!important;color:rgba(239,231,252,.72)!important}
.fj-step-body[data-step="5"] .fj-shift-card>i{left:18%!important;right:18%!important;height:2px!important;opacity:.92!important}
.fj-step-body[data-step="5"] .fj-selected-shift{margin-top:14px!important;border-radius:18px!important;padding:14px 15px!important;background:rgba(12,8,20,.68)!important;border:1px solid rgba(214,201,255,.11)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important}
.fj-step-body[data-step="5"] .fj-selected-shift strong{font-size:13px!important;font-weight:950!important}
.fj-step-body[data-step="5"] .fj-selected-shift small{font-size:10.5px!important}

/* Slide 7: personality — minimal list cards with stronger clarity */
.fj-step-body[data-step="7"] .fj-personality-grid{gap:12px!important}
.fj-step-body[data-step="7"] .fj-personality-card{
  min-height:118px!important;
  padding:16px 16px!important;
  border-radius:22px!important;
  grid-template-columns:36px 46px minmax(0,1fr) 30px!important;
  gap:12px!important;
  border:1px solid rgba(214,201,255,.11)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.048),rgba(255,255,255,.012))!important;
  box-shadow:0 18px 34px -28px rgba(var(--fj-accent),.5), inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.fj-step-body[data-step="7"] .fj-personality-card:hover{transform:translateY(-2px)!important}
.fj-step-body[data-step="7"] .fj-personality-card.is-active{border-color:rgba(var(--fj-accent),.56)!important;box-shadow:0 0 0 3px rgba(var(--fj-accent),.06),0 24px 48px -28px rgba(var(--fj-accent),.88)!important}
.fj-step-body[data-step="7"] .fj-personality-index{width:36px!important;height:36px!important;border-radius:12px!important;font-size:10px!important;background:rgba(255,255,255,.03)!important;border:1px solid rgba(214,201,255,.08)!important;color:rgba(242,235,255,.56)!important}
.fj-step-body[data-step="7"] .fj-personality-icon{width:46px!important;height:46px!important;border-radius:15px!important;background:rgba(var(--fj-accent),.10)!important;border:1px solid rgba(var(--fj-accent),.16)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important}
.fj-step-body[data-step="7"] .fj-personality-card small{font-size:10.4px!important;color:#d7c7ff!important;font-weight:950!important}
.fj-step-body[data-step="7"] .fj-personality-card strong{margin-top:3px!important;font-size:14.7px!important;font-weight:1000!important}
.fj-step-body[data-step="7"] .fj-personality-card p{margin-top:5px!important;font-size:10.8px!important;line-height:1.62!important;color:rgba(243,237,255,.72)!important}
.fj-step-body[data-step="7"] .fj-personality-card>i{width:30px!important;height:30px!important;border-radius:11px!important;border:1px solid rgba(214,201,255,.14)!important;background:rgba(255,255,255,.03)!important}
.fj-step-body[data-step="7"] .fj-personality-card.is-active>i{background:rgba(var(--fj-accent),.16)!important;border-color:rgba(var(--fj-accent),.30)!important;box-shadow:0 0 18px -8px rgba(var(--fj-accent),.70)!important}

@media(max-width:820px){
  .fj-step-body[data-step="3"] .fj-counter-control strong{font-size:30px!important}
  .fj-step-body[data-step="4"] .fj-playtime-card,
  .fj-step-body[data-step="5"] .fj-shift-card,
  .fj-step-body[data-step="7"] .fj-personality-card{border-radius:19px!important}
}


/* ==========================================================================
   Vanta Family Join v5.9.5 — slide 8 premium minimal contact polish
   ========================================================================== */
.fj-step-body[data-step="8"] .fj-section-head strong{font-size:clamp(24px,2vw,29px)!important;letter-spacing:-.45px!important}
.fj-step-body[data-step="8"] .fj-section-head p{max-width:760px!important;color:rgba(244,239,255,.76)!important}
.fj-step-body[data-step="8"] .fj-contact-panel{gap:14px!important;align-items:stretch!important}
.fj-step-body[data-step="8"] .fj-contact-visual,
.fj-step-body[data-step="8"] .fj-contact-fields{border-radius:22px!important;border:1px solid rgba(214,201,255,.12)!important;box-shadow:0 18px 36px -28px rgba(var(--fj-accent),.52), inset 0 1px 0 rgba(255,255,255,.07)!important}
.fj-step-body[data-step="8"] .fj-contact-visual{padding:28px 24px 22px!important;justify-content:center!important;align-items:center!important;text-align:center!important;background:linear-gradient(180deg,rgba(17,11,29,.78),rgba(8,5,14,.92))!important}
.fj-step-body[data-step="8"] .fj-contact-visual::before{background:linear-gradient(180deg,rgba(7,5,13,.50),rgba(7,5,13,.78)),radial-gradient(420px 220px at 50% 0%,rgba(var(--fj-accent),.15),transparent 70%)!important}
.fj-step-body[data-step="8"] .fj-contact-art{opacity:.34!important;filter:saturate(.85) brightness(.72)!important}
.fj-step-body[data-step="8"] .fj-contact-corner-logo{top:16px!important;right:16px!important;width:38px!important;height:38px!important;opacity:.92!important;filter:drop-shadow(0 8px 14px rgba(109,40,217,.18))!important}
.fj-step-body[data-step="8"] .fj-contact-visual>span{margin:0 auto 12px!important;width:54px!important;height:54px!important;border-radius:16px!important;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.03))!important;border:1px solid rgba(214,201,255,.18)!important;box-shadow:0 14px 28px -18px rgba(var(--fj-accent),.70), inset 0 1px 0 rgba(255,255,255,.12)!important;color:#f6f2ff!important;display:grid!important;place-items:center!important;font:1000 22px/1 Inter,system-ui,sans-serif!important;text-shadow:0 0 12px rgba(var(--fj-accent),.18)!important}
.fj-step-body[data-step="8"] .fj-contact-visual strong{font-size:22px!important;font-weight:1000!important;text-align:center!important;letter-spacing:-.35px!important}
.fj-step-body[data-step="8"] .fj-contact-visual p{max-width:400px!important;margin:8px auto 0!important;font-size:11.4px!important;line-height:1.8!important;text-align:center!important;color:rgba(244,238,255,.78)!important}
.fj-step-body[data-step="8"] .fj-contact-flow{width:min(330px,84%)!important;margin:18px auto 0!important}
.fj-step-body[data-step="8"] .fj-contact-flow i{width:12px!important;height:12px!important;border-color:rgba(214,201,255,.16)!important}
.fj-step-body[data-step="8"] .fj-contact-flow span{height:2px!important;background:linear-gradient(90deg,rgba(214,201,255,.10),rgba(214,201,255,.18),rgba(214,201,255,.10))!important}
.fj-step-body[data-step="8"] .fj-contact-visual>small{margin-top:12px!important;font-size:10.5px!important;font-weight:850!important;text-align:center!important;color:rgba(235,226,252,.72)!important}
.fj-step-body[data-step="8"] .fj-contact-fields{padding:22px!important;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012))!important;text-align:right!important;justify-content:center!important}
.fj-step-body[data-step="8"] .fj-field>span{margin-bottom:7px!important;font-size:12px!important;font-weight:950!important;color:#f4eeff!important}
.fj-step-body[data-step="8"] .fj-field>span em{font-style:normal!important;color:rgba(220,207,249,.58)!important;font-size:10px!important;font-weight:850!important;margin-inline-start:4px!important}
.fj-step-body[data-step="8"] .fj-field input{height:52px!important;border-radius:16px!important;border:1px solid rgba(214,201,255,.12)!important;background:linear-gradient(180deg,rgba(10,7,17,.88),rgba(15,10,24,.98))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 22px -18px rgba(var(--fj-accent),.32)!important;font-size:13.5px!important;font-weight:750!important}
.fj-step-body[data-step="8"] .fj-field input:focus{border-color:rgba(var(--fj-accent),.34)!important;box-shadow:0 0 0 4px rgba(var(--fj-accent),.07), inset 0 1px 0 rgba(255,255,255,.06)!important}
.fj-step-body[data-step="8"] .fj-field-hint{margin-top:6px!important;font-size:10.2px!important;color:rgba(226,216,248,.62)!important}
.fj-step-body[data-step="8"] .fj-privacy-note{margin-top:12px!important;padding:11px 12px!important;border-radius:16px!important;border:1px solid rgba(214,201,255,.10)!important;background:rgba(11,8,18,.54)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important}
.fj-step-body[data-step="8"] .fj-privacy-note span{width:28px!important;height:28px!important;border-radius:10px!important;background:rgba(var(--fj-accent),.10)!important;border:1px solid rgba(var(--fj-accent),.14)!important;display:grid!important;place-items:center!important}
.fj-step-body[data-step="8"] .fj-privacy-note p{font-size:10.6px!important;line-height:1.75!important;color:rgba(241,235,252,.74)!important}
@media(max-width:820px){
  .fj-step-body[data-step="8"] .fj-contact-panel{grid-template-columns:1fr!important;gap:12px!important}
  .fj-step-body[data-step="8"] .fj-contact-visual{padding:24px 18px 20px!important}
  .fj-step-body[data-step="8"] .fj-contact-visual strong{font-size:19px!important}
}


/* ==========================================================================
   Vanta Family Join v5.9.6 — slide 4 selected text overlap fix
   ========================================================================== */
.fj-step-body[data-step="4"] .fj-playtime-card{justify-content:flex-start!important}
.fj-step-body[data-step="4"] .fj-playtime-hint{
  position:static!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  transform:none!important;
  display:block!important;
  margin-top:10px!important;
  text-align:center!important;
  white-space:normal!important;
}
.fj-step-body[data-step="4"] .fj-playtime-card p{margin-bottom:2px!important}
.fj-step-body[data-step="4"] .fj-playtime-meter{margin-top:12px!important;margin-bottom:0!important}


/* ========================================================================== 
   Vanta Family Join v5.9.7 — click-to-copy tracking code
   ========================================================================== */
.fj-track-code--copy{
  appearance:none!important;-webkit-appearance:none!important;
  min-width:190px!important;margin:0!important;padding:10px 12px!important;
  border:1px solid transparent!important;border-radius:14px!important;
  background:transparent!important;color:inherit!important;text-align:right!important;
  cursor:pointer!important;position:relative!important;overflow:hidden!important;
  transition:background .2s var(--fj-ease),border-color .2s var(--fj-ease),transform .2s var(--fj-ease),box-shadow .2s var(--fj-ease)!important;
}
.fj-track-code--copy:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(var(--fj-accent),.20)!important;
  background:rgba(var(--fj-accent),.055)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 12px 24px -20px rgba(var(--fj-accent),.65)!important;
}
.fj-track-code--copy:focus-visible{outline:3px solid rgba(var(--fj-accent),.20)!important;outline-offset:2px!important}
.fj-track-code--copy .fj-track-code-label{display:block;color:var(--fj-faint);font-size:11.5px;font-weight:750!important}
.fj-track-code--copy strong{pointer-events:none!important}
.fj-track-copy-hint{
  display:inline-flex!important;align-items:center!important;gap:6px!important;margin-top:7px!important;
  color:rgba(230,220,251,.48)!important;font-size:9.5px!important;line-height:1!important;font-weight:800!important;
  direction:rtl!important;transition:color .2s ease!important;
}
.fj-track-copy-hint i{font-style:normal!important;font:900 12px/1 Inter,Arial,sans-serif!important;direction:ltr!important}
.fj-track-copy-hint b{font-weight:850!important}
.fj-track-code--copy.is-copied{
  border-color:rgba(94,226,177,.28)!important;
  background:rgba(94,226,177,.07)!important;
  box-shadow:0 0 0 3px rgba(94,226,177,.045),inset 0 1px 0 rgba(255,255,255,.05)!important;
}
.fj-track-code--copy.is-copied .fj-track-copy-hint{color:#a7f3d0!important}
@media(max-width:520px){.fj-track-code--copy{min-width:0!important;width:100%!important;text-align:center!important}.fj-track-copy-hint{justify-content:center!important}}


/* ========================================================================== 
   Family Join v5.9.8 — rejected request reapply cooldown
   ========================================================================== */
.fj-cta-status.is-reapply{color:#c9f5df!important}
.fj-cta-status.is-reapply i{background:#56d69a!important;box-shadow:0 0 0 4px rgba(86,214,154,.10),0 0 12px rgba(86,214,154,.40)!important}
.fj-reapply-card{margin-top:16px;padding:14px 15px;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;border:1px solid rgba(196,181,253,.10);border-radius:16px;background:rgba(255,255,255,.026)}
.fj-reapply-card>span{width:40px;height:40px;display:grid;place-items:center;border-radius:13px;border:1px solid rgba(196,181,253,.12);background:rgba(139,92,246,.08);color:#d9c7ff;font-size:18px}
.fj-reapply-card small{display:block;color:var(--fj-faint);font-size:10.5px;font-weight:750}
.fj-reapply-card strong{display:block;margin-top:4px;color:#f7f2ff;font-size:12.5px;font-weight:900;line-height:1.55}
.fj-reapply-card em{display:block;margin-top:4px;color:rgba(235,226,252,.58);font:650 10.5px/1.5 Inter,system-ui,sans-serif;font-style:normal;direction:ltr;text-align:right}
.fj-reapply-card button{min-height:40px;padding:0 14px;border:1px solid rgba(86,214,154,.20);border-radius:12px;background:rgba(86,214,154,.10);color:#d6fae7;font:900 11px/1 inherit;cursor:pointer;box-shadow:none}
.fj-reapply-card button:hover{background:rgba(86,214,154,.15);border-color:rgba(86,214,154,.30)}
.fj-reapply-card.is-ready{border-color:rgba(86,214,154,.16);background:rgba(86,214,154,.045)}
@media(max-width:620px){.fj-reapply-card{grid-template-columns:40px minmax(0,1fr)}.fj-reapply-card button{grid-column:1/-1;width:100%}}