.identity-document{
  --identity-accent:#5a53f5;--identity-accent2:#12b8a6;
  --brand:var(--identity-accent);--brandink:var(--identity-accent);
  --brand-t:color-mix(in srgb,var(--identity-accent) 10%,#fff);
  --teal-t:color-mix(in srgb,var(--identity-accent2) 12%,#fff);
  --grad-dark:linear-gradient(135deg,#111827,#172033);
  --bg:#f6f7f9;--card:#ffffff;--ink:#111827;--ink2:#273142;
  --muted:#687386;--line:#dfe4ec;
  margin:0;min-height:100vh;background:#f6f7f9;color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility
}
.identity-document *{box-sizing:border-box}
.identity-document a{color:inherit;text-decoration:none}
.identity-document .identity-stage{min-height:100vh}
.identity-document .identity-login-stage{display:grid;place-items:center;padding:28px}
.identity-document .identity-stage::before,
.identity-document .identity-stage::after{display:none}
.identity-document .btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border:0;border-radius:999px;padding:12px 18px;font-weight:850;
  font-size:1rem;cursor:pointer;text-decoration:none
}
.identity-document .btn.primary{
  color:#fff;background:linear-gradient(135deg,var(--identity-accent),var(--identity-accent2));
}
.identity-document .msg{
  padding:11px 13px;border-radius:12px;margin:12px 0;
  background:#f4f7fb;border:1px solid var(--line);color:var(--ink2);font-weight:750
}
.identity-document .msg.error{background:#fff1f2;border-color:#fecdd3;color:#9f1239}
.identity-document .msg.success{background:#ecfdf5;border-color:#bbf7d0;color:#166534}
.identity-login-stage{display:grid;place-items:center;padding:28px}
.identity-login-shell{
  width:min(100%,1060px);display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:18px;align-items:stretch
}
.identity-storefront-panel{
  position:relative;min-height:620px;overflow:hidden;border-radius:28px;padding:24px;
  color:#fff;background:#111827;box-shadow:0 28px 82px rgba(17,24,39,.18);
  display:flex;flex-direction:column;justify-content:space-between;isolation:isolate
}
.identity-storefront-panel::before{
  content:"";position:absolute;inset:0;z-index:-2;background:
    linear-gradient(115deg,rgba(5,10,18,.82),rgba(5,10,18,.36) 58%,rgba(5,10,18,.82)),
    var(--identity-photo) center/cover no-repeat
}
.identity-storefront-panel::after{
  content:"";position:absolute;inset:0;z-index:-1;background:
    linear-gradient(135deg,color-mix(in srgb,var(--identity-accent) 54%,transparent),transparent 48%),
    linear-gradient(0deg,rgba(0,0,0,.5),transparent 46%)
}
.identity-sitebar{display:flex;align-items:center;justify-content:space-between;gap:14px;position:relative;z-index:1}
.identity-sitebrand,.identity-card-brand{display:flex;align-items:center;gap:11px;min-width:0}
.identity-sitebrand b,.identity-card-brand b{display:block;font-size:1.05rem;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.identity-sitebrand small,.identity-card-brand small{display:block;margin-top:2px;color:rgba(255,255,255,.72);font-size:.84rem;font-weight:700}
.identity-card-brand small{color:var(--muted)}
.identity-sitemark{
  width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto;
  background:linear-gradient(135deg,var(--identity-accent),var(--identity-accent2));
  color:#fff;font-weight:950;font-size:1.12rem;box-shadow:0 14px 34px rgba(0,0,0,.28)
}
.identity-sitemark.small{width:36px;height:36px;border-radius:10px;font-size:1rem;box-shadow:0 10px 24px color-mix(in srgb,var(--identity-accent) 24%,transparent)}
.identity-home-link{
  white-space:nowrap;padding:9px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.12);font-size:.92rem;font-weight:850;backdrop-filter:blur(8px)
}
.identity-showcase{position:relative;z-index:1;max-width:620px;padding:60px 4px 24px}
.identity-pill{
  display:inline-flex;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.22);font-weight:850;font-size:.85rem
}
.identity-showcase h1{
  margin:18px 0 14px;font-size:clamp(2.15rem,5vw,4.4rem);line-height:1.02;letter-spacing:0;
  max-width:11ch;text-wrap:balance
}
.identity-showcase p{max-width:56ch;margin:0;color:rgba(255,255,255,.82);font-size:1.06rem;line-height:1.62}
.identity-storefront-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.identity-storefront-actions a{
  padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.92);color:#111827;
  font-weight:900;font-size:.92rem
}
.identity-storefront-meta{
  position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px
}
.identity-storefront-meta span{
  min-width:0;padding:13px 14px;border-radius:16px;background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(10px)
}
.identity-storefront-meta b,.identity-storefront-meta small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.identity-storefront-meta b{font-size:.92rem}.identity-storefront-meta small{margin-top:3px;color:rgba(255,255,255,.7);font-size:.79rem}
.identity-login-card.identity-card.auth{
  align-self:center;border-radius:24px;padding:30px;box-shadow:0 24px 70px rgba(15,23,42,.13);
  border:1px solid rgba(120,140,180,.2);background:rgba(255,255,255,.96);backdrop-filter:blur(14px)
}
.identity-login-card h2{margin:24px 0 4px;font-size:2rem;line-height:1.08;letter-spacing:0;color:var(--ink)}
.identity-login-card .sub{margin:0 0 20px;color:var(--muted);font-size:1rem}
.identity-login-card form{margin-top:4px}
.identity-card input,.identity-card select{width:100%}
.identity-login-card .identity-action{min-height:48px;margin-top:14px}
.skin-storefront.sf-login-manufacturing .identity-storefront-panel::after,
.skin-storefront.sf-login-wholesale .identity-storefront-panel::after{
  background:linear-gradient(135deg,color-mix(in srgb,var(--identity-accent) 46%,transparent),transparent 52%),
             linear-gradient(0deg,rgba(0,0,0,.58),transparent 44%)
}
.identity-stage{
  position:relative;isolation:isolate;min-height:calc(100vh - 62px);
  display:grid;place-items:center;padding:44px 22px 64px;overflow:hidden
}
.identity-stage::before,.identity-stage::after{
  content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(2px);
  animation:identityFloat 10s ease-in-out infinite alternate
}
.identity-stage::before{
  width:430px;height:430px;left:-150px;top:4%;
  background:radial-gradient(circle,#c9c3ff 0,rgba(201,195,255,.12) 67%,transparent 72%)
}
.identity-stage::after{
  width:390px;height:390px;right:-110px;bottom:-90px;animation-delay:-4s;
  background:radial-gradient(circle,#b9f3e8 0,rgba(185,243,232,.12) 66%,transparent 72%)
}
.identity-layout{
  width:min(100%,1020px);display:grid;grid-template-columns:minmax(260px,.78fr) minmax(390px,1.22fr);
  gap:20px;align-items:stretch
}
.identity-layout.compact{width:min(100%,860px);grid-template-columns:minmax(250px,.8fr) minmax(360px,1.2fr)}
.identity-story{
  position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;
  min-height:480px;padding:34px;border-radius:28px;color:#fff;background:var(--grad-dark);
  box-shadow:0 28px 70px rgba(35,29,97,.24)
}
.identity-story::after{
  content:"";position:absolute;width:240px;height:240px;border:1px solid rgba(255,255,255,.2);
  border-radius:64px;right:-95px;top:-80px;transform:rotate(22deg);
  box-shadow:0 0 0 30px rgba(255,255,255,.04),0 0 0 62px rgba(255,255,255,.025)
}
.identity-story .eyebrow{font-size:.67rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:#bfefe8}
.identity-story h2{max-width:420px;margin:12px 0;font-size:clamp(1.8rem,3vw,2.65rem);line-height:1.02}
.identity-story>div>p{max-width:430px;margin:0;color:rgba(255,255,255,.74);font-size:.78rem}
.identity-signal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:28px}
.identity-signal-grid span{
  padding:12px 10px;border:1px solid rgba(255,255,255,.12);border-radius:14px;
  background:rgba(255,255,255,.08);backdrop-filter:blur(8px)
}
.identity-signal-grid b,.identity-signal-grid small{display:block}
.identity-signal-grid b{font-size:.8rem}.identity-signal-grid small{margin-top:3px;color:rgba(255,255,255,.62);font-size:0.84rem}
.identity-trust{display:flex;align-items:center;gap:8px;margin-top:18px;color:rgba(255,255,255,.7);font-size:0.84rem;font-weight:800}
.identity-trust i{width:9px;height:9px;border-radius:50%;background:#40ddad;box-shadow:0 0 0 6px rgba(64,221,173,.12);animation:identityPulse 2.2s ease-in-out infinite}
.identity-card.auth{
  max-width:none;width:100%;margin:0;padding:30px;border-radius:28px;
  background:rgba(255,255,255,.92);backdrop-filter:blur(18px)
}
.identity-card .brand{margin:0 0 18px}.identity-card .brand .mark{box-shadow:0 8px 20px rgba(90,83,245,.28)}
.identity-card h1{margin:0 0 5px;font-size:1.52rem}.identity-card>.sub{margin:0 0 18px}
.identity-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 10px}
.identity-form-grid .span-2{grid-column:1/-1}.identity-card label{display:block;margin:7px 0 2px;color:var(--ink2);font-size:0.88rem;font-weight:900}
.identity-card input,.identity-card select{
  min-height:44px;margin:4px 0;padding:11px 13px;border:1.5px solid var(--line);
  border-radius:12px;background:#fff;color:var(--ink);transition:border-color .18s,box-shadow .18s,transform .18s
}
.identity-card select{width:100%}
.identity-card input:focus,.identity-card select:focus{
  outline:0;border-color:#9f98ff;box-shadow:0 0 0 4px rgba(90,83,245,.09);transform:translateY(-1px)
}
.identity-card .identity-hint{margin:4px 2px 9px;color:var(--muted);font-size:0.84rem;line-height:1.45}
.identity-card .identity-action{width:100%;min-height:45px;margin-top:11px;box-shadow:0 10px 24px rgba(90,83,245,.22)}
.identity-card .identity-footer{margin:15px 0 0;text-align:center;color:var(--muted);font-size:.67rem}
.identity-card .identity-footer a{color:var(--brandink);font-weight:900}
.identity-card .msg{margin:11px 0;border-radius:12px}
.identity-choice{
  display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:9px 0 13px
}
.identity-choice label{position:relative;margin:0}.identity-choice input{position:absolute;opacity:0;pointer-events:none}
.identity-choice span{
  display:block;height:100%;padding:11px;border:1.5px solid var(--line);border-radius:13px;background:#fff;
  color:var(--ink2);font-size:0.88rem;font-weight:850;cursor:pointer;transition:.18s
}
.identity-choice span small{display:block;margin-top:2px;color:var(--muted);font-size:0.78rem;font-weight:650}
.identity-choice input:checked+span{border-color:#aaa3ff;color:var(--brandink);background:var(--brand-t);box-shadow:0 5px 14px rgba(90,83,245,.1)}
.identity-business{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 10px;padding:9px 11px;margin:5px 0;border:1px solid #dcd8ff;border-radius:14px;background:linear-gradient(120deg,#faf9ff,#f0fbf9)}
.identity-business[hidden]{display:none}
.identity-business .span-2{grid-column:1/-1}
.identity-channel-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:16px}
.identity-channel{
  position:relative;overflow:hidden;padding:17px;border:1px solid var(--line);border-radius:17px;
  background:linear-gradient(145deg,#fff,#faf9ff)
}
.identity-channel::after{content:"";position:absolute;width:70px;height:70px;border-radius:50%;right:-32px;top:-35px;background:var(--brand);opacity:.05}
.identity-channel h3{margin:0 0 4px;font-size:.86rem}.identity-channel .sub{overflow-wrap:anywhere}
.identity-channel-actions{display:grid;gap:7px;margin-top:12px}.identity-channel-actions form{margin:0}
.identity-code-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px}.identity-code-form input{min-width:0;margin:0}
.identity-summary{
  margin:12px 0;padding:14px;border:1px solid #dcd8ff;border-radius:15px;
  background:linear-gradient(120deg,#f4f2ff,#ecfaf7)
}
.identity-summary h3{margin:0 0 5px;font-size:.9rem}.identity-summary p{margin:3px 0;font-size:0.88rem}
.identity-expiry{display:inline-flex;margin-top:5px;padding:5px 8px;border-radius:999px;background:#fff;color:var(--brandink);font-size:0.84rem;font-weight:900}
.identity-lock{
  display:flex;gap:9px;align-items:flex-start;margin:12px 0;padding:11px;border-radius:13px;
  color:#0c766d;background:var(--teal-t);font-size:0.88rem
}
.identity-lock span{font-size:1rem}
.captcha{border:1px solid var(--line);border-radius:14px;background:#fbfcff;padding:11px;margin:12px 0}
.captcha-head{font-weight:900;color:var(--ink);font-size:.82rem;margin-bottom:7px}
.captcha-prompt{font-size:.76rem;color:var(--muted);margin:7px 0}
.captcha-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.captcha-tile{position:relative;display:block;border:2px solid transparent;border-radius:10px;overflow:hidden;cursor:pointer;background:#fff}
.captcha-tile input{position:absolute;opacity:0}
.captcha-tile img{display:block;width:100%;aspect-ratio:1.25/1;object-fit:cover}
.captcha-check{position:absolute;right:5px;top:5px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.9);color:var(--brandink);font-weight:900;opacity:0}
.captcha-tile:has(input:checked){border-color:var(--brandink)}
.captcha-tile:has(input:checked) .captcha-check{opacity:1}
@keyframes identityFloat{to{transform:translate3d(22px,-18px,0) scale(1.04)}}
@keyframes identityPulse{50%{box-shadow:0 0 0 10px rgba(64,221,173,.03)}}
@media(max-width:760px){
  .identity-stage{display:block;min-height:0;padding:18px 13px 36px}
  .identity-layout,.identity-layout.compact{display:flex;width:100%;flex-direction:column;gap:12px}
  .identity-story{min-height:210px;padding:23px;border-radius:22px}
  .identity-story h2{font-size:1.65rem}.identity-story>div>p{font-size:.69rem}
  .identity-signal-grid{margin-top:18px}.identity-trust{margin-top:13px}
  .identity-card.auth{padding:22px 17px;border-radius:22px}
}
@media(max-width:860px){
  .identity-document .identity-login-stage{display:block;padding:14px}
  .identity-login-shell{display:flex;flex-direction:column;width:100%;gap:12px}
  .identity-storefront-panel{min-height:0;border-radius:22px;padding:16px}
  .identity-sitebar{align-items:flex-start}
  .identity-sitebrand b{white-space:normal}
  .identity-home-link{font-size:.86rem;padding:8px 11px}
  .identity-showcase{padding:28px 0 12px}
  .identity-showcase h1{font-size:clamp(1.75rem,8vw,2.35rem);max-width:100%;line-height:1.08;margin:12px 0 8px}
  .identity-showcase p{font-size:.95rem;line-height:1.48}
  .identity-storefront-actions{margin-top:14px}
  .identity-storefront-actions a{padding:8px 11px;font-size:.86rem}
  .identity-storefront-meta{display:none}
  .identity-login-card.identity-card.auth{padding:22px 17px;border-radius:22px}
  .identity-login-card h2{font-size:1.65rem;margin-top:18px}
}
@media(max-width:520px){
  .identity-form-grid,.identity-business,.identity-channel-grid{grid-template-columns:1fr}
  .identity-form-grid .span-2,.identity-business .span-2{grid-column:1}
  .identity-story{min-height:225px}.identity-signal-grid{grid-template-columns:1fr}
  .identity-signal-grid span{padding:8px 10px}.identity-signal-grid small{display:inline;margin-left:4px}
  .identity-choice{grid-template-columns:1fr}.identity-channel-actions .btn{width:100%}
  .captcha-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){
  .identity-stage::before,.identity-stage::after,.identity-trust i{animation:none}
}
