html:has(.zp-auth-appearance) { min-height:100%; overflow-x:clip; }
body.zp-auth-appearance { --auth-bg:var(--auth-light-background); --auth-fg:var(--auth-light-foreground); --auth-muted:var(--auth-light-muted); --auth-panel:var(--auth-light-container); --auth-input:var(--auth-light-input); --auth-border:var(--auth-light-border); --auth-placeholder:var(--auth-light-placeholder); --auth-primary:var(--auth-light-primary); --auth-button-fg:var(--auth-light-button-text); --auth-hero:var(--auth-light-hero); --auth-hero-fg:var(--auth-light-hero-text); --auth-font-family:Inter,system-ui,sans-serif; margin:0; min-height:100svh; height:auto; padding:clamp(12px,3vw,48px); display:flex; align-items:center; justify-content:center; color:var(--auth-fg); background:var(--auth-background-image,none) center/cover fixed,var(--auth-bg); font-size:var(--auth-font-size); font-weight:var(--auth-font-weight); font-style:var(--auth-font-style); line-height:1.5; }
body.zp-auth-appearance[data-auth-theme=dark] { color-scheme:dark; --auth-bg:var(--auth-dark-background); --auth-fg:var(--auth-dark-foreground); --auth-muted:var(--auth-dark-muted); --auth-panel:var(--auth-dark-container); --auth-input:var(--auth-dark-input); --auth-border:var(--auth-dark-border); --auth-placeholder:var(--auth-dark-placeholder); --auth-primary:var(--auth-dark-primary); --auth-button-fg:var(--auth-dark-button-text); --auth-hero:var(--auth-dark-hero); --auth-hero-fg:var(--auth-dark-hero-text); }
body.zp-auth-appearance[data-auth-theme=light] { color-scheme:light; }
.zp-auth-appearance,.zp-auth-appearance input,.zp-auth-appearance button,.zp-auth-appearance select { font-family:var(--auth-font-family)!important; }
.zp-auth-appearance[data-auth-font=sora] { --auth-font-family:Sora,system-ui,sans-serif; }
.zp-auth-appearance[data-auth-font=dm-sans] { --auth-font-family:'DM Sans',system-ui,sans-serif; }
.zp-auth-appearance[data-auth-font=plus-jakarta] { --auth-font-family:'Plus Jakarta Sans',system-ui,sans-serif; }
.zp-auth-appearance[data-auth-font=system] { --auth-font-family:system-ui,sans-serif; }
.zp-auth-appearance[data-auth-font=georgia] { --auth-font-family:Georgia,serif; }
.zp-auth-appearance[data-auth-font=arial] { --auth-font-family:Arial,sans-serif; }
.zp-auth-appearance[data-auth-font=verdana] { --auth-font-family:Verdana,sans-serif; }
.zp-auth-appearance * { box-sizing:border-box; }
.zp-auth-appearance :is(.zp-login-theme-shell,.saas-login-shell) { width:min(1200px,100%); min-width:0; height:auto; min-height:min(740px,85svh); margin:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0; background:var(--auth-panel); border:1px solid var(--auth-border); border-radius:var(--auth-container-radius); box-shadow:0 24px 70px #0002; overflow:hidden; }
.zp-auth-appearance :is(.zp-login-theme-hero,.saas-login-visual) { position:relative; min-width:0; display:flex; flex-direction:column; justify-content:space-between; gap:32px; padding:clamp(24px,4vw,56px); color:var(--auth-hero-fg); background:linear-gradient(180deg,transparent,#0004),var(--auth-hero-image,none) center/cover,var(--auth-hero); overflow:hidden; }
.zp-auth-appearance :is(.zp-login-theme-panel,.saas-login-main) { position:relative; min-width:0; padding:clamp(24px,4vw,56px); display:flex; flex-direction:column; justify-content:center; gap:22px; background:transparent; }
.zp-auth-appearance :is(.zp-login-theme-card,.saas-login-card) { width:100%; max-width:460px; min-width:0; margin:auto; padding:0; color:var(--auth-fg); background:transparent; border:0; box-shadow:none; }
.zp-auth-appearance :is(h1,h2,h3) { font-family:inherit; font-weight:var(--auth-heading-weight); color:inherit; overflow-wrap:anywhere; margin:0 0 12px; line-height:1.15; }
.zp-auth-appearance h1 { font-size:clamp(min(24px,var(--auth-h1-size)),4vw,var(--auth-h1-size)); }
.zp-auth-appearance h2 { font-size:clamp(min(20px,var(--auth-h2-size)),3vw,var(--auth-h2-size)); }
.zp-auth-appearance h3 { font-size:var(--auth-h3-size); }
.zp-auth-appearance p { margin:0 0 18px; }
.zp-auth-appearance :is(.zp-login-theme-card>p,.saas-card-title>p,.zp-auth-note,.saas-copyright) { color:var(--auth-muted); }
.zp-login-brandmark { display:inline-flex; gap:12px; align-items:center; text-decoration:none; color:inherit; }
.zp-login-brandmark strong { font-weight:var(--auth-heading-weight); font-size:18px; }
.zp-login-brandmark small { display:block; font-size:12px; opacity:.8; }
.zp-login-brandmark em { font-style:normal; font-size:12px; }
.zp-login-brand-icon { width:42px; height:42px; flex-shrink:0; display:grid; place-items:center; border-radius:12px; background:#fff2; border:1px solid #fff4; }
.zp-login-brand-icon img { max-width:32px; max-height:32px; }
.zp-login-brand-icon [hidden] { display:none!important; }
.zp-auth-centered-brand { display:none; }
.zp-auth-appearance[data-auth-template=centered] .zp-auth-centered-brand { display:inline-flex; margin-bottom:16px; }
.zp-login-eyebrow { opacity:.85; font-size:.8em; }
.zp-login-hero-copy { margin-block:auto; }
.zp-login-hero-copy h1 span { display:block; }
.zp-login-hero-copy>p { opacity:.9; }
.zp-login-platforms { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:28px; }
.zp-login-platforms article { padding:14px 8px; border:1px solid #fff4; border-radius:14px; background:#fff1; display:grid; gap:4px; justify-items:center; text-align:center; }
.zp-login-platforms svg { width:22px; height:22px; fill:currentColor; }
.zp-login-platforms img { width:28px; height:28px; object-fit:contain; }
.zp-login-platforms [hidden] { display:none!important; }
.zp-login-platforms small { overflow-wrap:anywhere; }
.zp-login-platforms small { font-size:11px; opacity:.8; }
.zp-login-language { display:flex; justify-content:flex-end; gap:8px; }
.zp-login-language a { font-size:12px; text-decoration:none; padding:5px 9px; border-radius:8px; color:var(--auth-muted); }
.zp-login-language a.active { color:var(--auth-primary); background:var(--auth-input); }
.zp-login-card-kicker { display:flex; gap:8px; align-items:center; color:var(--auth-primary); margin-bottom:20px; }
.zp-login-card-kicker svg { width:18px; height:18px; fill:currentColor; }
.zp-login-card-kicker h3 { margin:0; }
.zp-auth-appearance :is(.zp-login-theme-form,.saas-auth-form) { display:grid; gap:18px; padding:0; border:0; background:transparent; margin-top:24px; }
.zp-auth-appearance :is(.zp-login-theme-field,.saas-field) { display:grid; min-width:0; gap:7px; font-size:inherit; }
.zp-auth-appearance :is(.zp-login-theme-field,.saas-field)>span { font-size:.85em; font-weight:600; color:var(--auth-fg); }
.zp-auth-appearance :is(input:not([type=checkbox]):not([type=hidden]),select) { width:100%; min-width:0; min-height:48px; padding:12px 14px; font-size:max(16px,1em); font-style:inherit; font-weight:inherit; color:var(--auth-fg); background:var(--auth-input); border:var(--auth-field-border-width,1px) var(--auth-field-border-style,solid) var(--auth-border); border-radius:var(--auth-field-radius,10px); outline-offset:3px; }
.zp-auth-appearance[data-auth-field=underline] :is(input:not([type=checkbox]):not([type=hidden]),select) { border:0; border-bottom:var(--auth-field-border-width,1px) var(--auth-field-border-style,solid) var(--auth-border); border-radius:0; background:transparent; }
.zp-auth-appearance[data-auth-field=filled] :is(input:not([type=checkbox]):not([type=hidden]),select) { border-color:transparent; }
.zp-auth-appearance[data-auth-field=borderless] :is(input:not([type=checkbox]):not([type=hidden]),select) { border-color:transparent; background:transparent; }
.zp-auth-appearance[data-auth-field=glass] :is(input:not([type=checkbox]):not([type=hidden]),select) { background:color-mix(in srgb,var(--auth-input) 35%,transparent); backdrop-filter:blur(12px); box-shadow:inset 0 1px 0 #fff3; }
.zp-auth-appearance[data-auth-field=embossed] :is(input:not([type=checkbox]):not([type=hidden]),select) { box-shadow:4px 4px 10px #0002,-3px -3px 8px #fff2; }
.zp-auth-appearance[data-auth-field=debossed] :is(input:not([type=checkbox]):not([type=hidden]),select) { box-shadow:inset 3px 3px 8px #0003,inset -2px -2px 6px #fff2; }
.zp-auth-appearance input::placeholder { color:var(--auth-placeholder); opacity:1; }
.zp-auth-appearance input:focus,.zp-auth-appearance select:focus { border-color:var(--auth-primary); outline:2px solid var(--auth-primary); }
.zp-auth-appearance[data-auth-field] :is(input:not([type=checkbox]):not([type=hidden]),select):focus { border-color:var(--auth-primary); }
.zp-auth-appearance[data-auth-field=underline] :is(input:not([type=checkbox]):not([type=hidden]),select):focus { outline:0; box-shadow:inset 0 -1px 0 var(--auth-primary); }
.zp-login-password-wrap,.saas-input-wrap { position:relative; }
.zp-login-password-wrap input { padding-right:48px!important; }
.zp-login-password-wrap button { position:absolute; right:4px; top:2px; bottom:2px; width:40px; height:auto; border:0; background:transparent; color:var(--auth-muted); cursor:pointer; }
.zp-login-password-wrap svg { width:20px; height:20px; fill:currentColor; }
.saas-input-wrap>i { display:none; }
.zp-login-formline { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px; font-size:.8em; }
.zp-login-remember { display:flex; align-items:center; gap:5px; }
.zp-login-formline a { color:var(--auth-primary); }
.zp-auth-appearance :is(.zp-login-submit,.saas-submit) { display:flex; align-items:center; justify-content:center; gap:10px; min-height:48px; width:100%; padding:12px; border:1px solid var(--auth-primary); border-radius:var(--auth-button-radius); background:var(--auth-primary)!important; color:var(--auth-button-fg)!important; font-size:inherit; font-weight:600; cursor:pointer; text-decoration:none; }
.zp-auth-appearance :is(.zp-login-submit,.saas-submit):disabled { opacity:.6; cursor:wait; }
.zp-login-submit svg { width:20px; height:20px; fill:currentColor; }
.zp-auth-appearance[data-auth-button=rounded] :is(.zp-login-submit,.saas-submit) { border-radius:999px; }
.zp-auth-appearance[data-auth-button=glass] :is(.zp-login-submit,.saas-submit) { background:color-mix(in srgb,var(--auth-primary) 22%,transparent)!important; color:var(--auth-fg)!important; backdrop-filter:blur(16px); box-shadow:inset 0 1px 0 #fff4; }
.zp-auth-appearance[data-auth-button=outline] :is(.zp-login-submit,.saas-submit) { background:transparent!important; color:var(--auth-primary)!important; }
.zp-auth-appearance[data-auth-button=gradient] :is(.zp-login-submit,.saas-submit) { background:linear-gradient(135deg,var(--auth-primary),color-mix(in srgb,var(--auth-primary) 75%,#000))!important; }
.zp-auth-appearance .saas-button-row>a.saas-submit { background:transparent!important; color:var(--auth-fg)!important; border-color:var(--auth-border); }
.zp-auth-appearance[data-auth-container=glass] :is(.zp-login-theme-shell,.saas-login-shell) { background:color-mix(in srgb,var(--auth-panel) calc(var(--auth-container-opacity)*100%),transparent); backdrop-filter:blur(24px); box-shadow:0 24px 70px #0002,inset 0 1px 0 #fff5; }
.zp-auth-appearance[data-auth-container=embossed] :is(.zp-login-theme-shell,.saas-login-shell) { box-shadow:14px 14px 30px #0003,-10px -10px 25px #fff2; }
.zp-auth-appearance[data-auth-container=debossed] :is(.zp-login-theme-shell,.saas-login-shell) { box-shadow:inset 8px 8px 24px #0003,inset -6px -6px 20px #fff2; }
.zp-auth-appearance[data-auth-template=cinematic] :is(.zp-login-theme-shell,.saas-login-shell) { padding:16px; gap:16px; }
.zp-auth-appearance[data-auth-template=cinematic] :is(.zp-login-theme-hero,.saas-login-visual) { border-radius:max(0px,calc(var(--auth-container-radius) - 8px)); }
.zp-auth-appearance[data-auth-template=cinematic] .zp-login-platforms { display:none; }
.zp-auth-appearance[data-auth-template=cinematic] .zp-login-hero-copy { margin-top:auto; margin-bottom:0; text-align:center; }
.zp-auth-appearance[data-auth-template=wave] :is(.zp-login-theme-hero,.saas-login-visual) { background:linear-gradient(160deg,transparent,#0002),var(--auth-hero-image,none) center/cover,linear-gradient(160deg,var(--auth-hero),color-mix(in srgb,var(--auth-hero) 65%,#00aaff)); text-align:center; align-items:center; }
.zp-auth-appearance[data-auth-template=wave] :is(.zp-login-theme-hero,.saas-login-visual)::after { content:''; position:absolute; right:-18px; top:0; width:36px; height:100%; background:radial-gradient(circle at 100% 18px,var(--auth-panel) 19px,transparent 20px) 0 0/36px 36px; }
.zp-auth-appearance[data-auth-template=centered] :is(.zp-login-theme-shell,.saas-login-shell) { max-width:560px; min-height:0; grid-template-columns:minmax(0,1fr); }
.zp-auth-appearance[data-auth-template=centered] :is(.zp-login-theme-hero,.saas-login-visual) { display:none; }
.zp-auth-note { font-size:.75em; margin:16px 0 0!important; }
.saas-branch-preview { display:flex; align-items:center; gap:14px; padding:16px; background:var(--auth-input); border:1px solid var(--auth-border); border-radius:12px; min-width:0; }
.saas-branch-preview strong,.saas-branch-preview span { display:block; overflow-wrap:anywhere; }
.saas-branch-preview span { color:var(--auth-muted); font-size:.85em; }
.saas-copyright { text-align:center; font-size:12px; margin-top:24px; }
.zp-login-alert,.saas-alert { padding:12px; border:1px solid #f87171; border-radius:10px; background:#ef444418; margin-bottom:14px; overflow-wrap:anywhere; }
.zp-door-glow { display:none; }
@media(min-width:801px) and (prefers-reduced-motion:no-preference) { .zp-auth-appearance.zp-door-splitting :is(.zp-login-theme-hero,.saas-login-visual) { transform:translateX(-120%); transition:transform .7s ease; } .zp-auth-appearance.zp-door-splitting :is(.zp-login-theme-panel,.saas-login-main) { transform:translateX(120%); transition:transform .7s ease; } }
@media(max-width:800px) { body.zp-auth-appearance { padding:16px; align-items:flex-start; } .zp-auth-appearance :is(.zp-login-theme-shell,.saas-login-shell) { max-width:600px; grid-template-columns:minmax(0,1fr); min-height:0; } .zp-auth-appearance :is(.zp-login-theme-hero,.saas-login-visual) { min-height:220px; gap:20px; padding:24px; } .zp-login-platforms { display:none; } .zp-login-hero-copy { margin:0; } .zp-login-hero-copy>p:last-of-type { margin-bottom:0; } .zp-auth-appearance :is(.zp-login-theme-panel,.saas-login-main) { padding:24px; gap:14px; } .zp-auth-appearance[data-auth-template=wave] :is(.zp-login-theme-hero,.saas-login-visual)::after { top:auto; bottom:-18px; right:0; width:100%; height:36px; background:radial-gradient(circle at 18px 100%,var(--auth-panel) 19px,transparent 20px) 0 0/36px 36px; } }
@media(max-width:400px) { body.zp-auth-appearance { padding:8px; } .zp-auth-appearance :is(.zp-login-theme-panel,.saas-login-main) { padding:20px 16px; } .zp-auth-appearance[data-auth-template=cinematic] :is(.zp-login-theme-shell,.saas-login-shell) { padding:8px; gap:8px; } .saas-button-row { grid-template-columns:1fr!important; } }

/* Fit each authentication step to the current viewport. Density changes only
   when the configured content needs more room; the form stays accessible. */
html:has(.zp-auth-appearance) { height:100%; overflow:hidden; }
body.zp-auth-appearance { --auth-page-padding:clamp(8px,2vmin,24px); box-sizing:border-box; height:100dvh; min-height:0; overflow:hidden; padding:var(--auth-page-padding); }
.zp-auth-appearance :is(.zp-login-theme-shell,.saas-login-shell) { height:min(840px,calc(100dvh - 2 * var(--auth-page-padding))); min-height:0; }
.zp-auth-appearance :is(.zp-login-theme-panel,.saas-login-main) { min-height:0; height:100%; padding:clamp(16px,3vh,32px); gap:clamp(8px,1.4vh,16px); }
.zp-auth-appearance :is(.zp-login-theme-card,.saas-login-card) { min-height:0; flex:0 1 auto; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; margin:auto; padding:3px; }
.zp-auth-toolbar { display:flex; justify-content:flex-end; align-items:center; flex:0 0 auto; gap:12px; }
.zp-auth-toolbar .zp-login-language { flex-wrap:wrap; }
.zp-auth-appearance :is(.zp-login-theme-form,.saas-auth-form) { gap:clamp(10px,1.6vh,18px); margin-top:clamp(12px,2vh,20px); }
.zp-auth-appearance[data-auth-density=compact] { font-size:min(var(--auth-font-size),15px); }
.zp-auth-appearance[data-auth-density=compact] :is(.zp-login-theme-panel,.saas-login-main) { padding:16px 20px; gap:8px; }
.zp-auth-appearance[data-auth-density=compact] h2 { font-size:min(var(--auth-h2-size),26px); margin-bottom:8px; }
.zp-auth-appearance[data-auth-density=compact] h3 { font-size:min(var(--auth-h3-size),16px); }
.zp-auth-appearance[data-auth-density=compact] p { margin-bottom:10px; }
.zp-auth-appearance[data-auth-density=compact] .zp-login-card-kicker { margin-bottom:12px; }
.zp-auth-appearance[data-auth-density=compact] :is(.zp-login-theme-form,.saas-auth-form) { gap:10px; margin-top:12px; }
.zp-auth-appearance[data-auth-density=compact] :is(.zp-login-theme-field,.saas-field) { gap:5px; }
.zp-auth-appearance[data-auth-density=compact] :is(input:not([type=checkbox]):not([type=hidden]),select,.zp-login-submit,.saas-submit) { min-height:44px; padding:10px 12px; }
.zp-auth-appearance[data-auth-density=compact] .zp-auth-note { margin-top:8px!important; }
.zp-auth-appearance[data-auth-density=compact] .saas-copyright { margin-top:12px; }
.zp-auth-appearance[data-auth-density=compact] .saas-branch-preview { padding:10px 12px; }
.zp-auth-appearance[data-auth-density=essential] { font-size:min(var(--auth-font-size),14px); }
.zp-auth-appearance[data-auth-density=essential] :is(.zp-login-theme-panel,.saas-login-main) { padding:10px 14px; gap:6px; }
.zp-auth-appearance[data-auth-density=essential] h2 { font-size:min(var(--auth-h2-size),22px); margin-bottom:8px; }
.zp-auth-appearance[data-auth-density=essential] :is(.zp-login-card-kicker,.saas-card-title h3,.zp-auth-note,.saas-copyright,.zp-login-theme-card>p,.saas-card-title>p,.zp-login-platforms) { display:none; }
.zp-auth-appearance[data-auth-density=essential] :is(.zp-login-theme-form,.saas-auth-form) { gap:8px; margin-top:8px; }
.zp-auth-appearance[data-auth-density=essential] :is(.zp-login-theme-field,.saas-field) { gap:4px; }
.zp-auth-appearance[data-auth-density=essential] :is(input:not([type=checkbox]):not([type=hidden]),select,.zp-login-submit,.saas-submit) { min-height:42px; padding:8px 12px; }
.zp-auth-appearance[data-auth-density=essential] .saas-branch-preview { padding:8px; }
.zp-auth-appearance[data-auth-density=essential] .zp-login-language a { padding:3px 6px; }
.zp-auth-appearance[data-auth-density=essential] .zp-auth-centered-brand { margin-bottom:8px; }
.zp-auth-appearance[data-auth-density=essential] .zp-auth-centered-brand .zp-login-brand-icon { width:32px; height:32px; }
.zp-auth-appearance[data-auth-density=essential] .zp-auth-centered-brand img { max-width:26px; max-height:26px; }
@media(max-width:800px) {
    body.zp-auth-appearance { align-items:center; }
    .zp-auth-appearance :is(.zp-login-theme-shell,.saas-login-shell) { grid-template-rows:auto minmax(0,1fr); }
    .zp-auth-appearance :is(.zp-login-theme-hero,.saas-login-visual) { min-height:0; padding:12px 18px; gap:8px; }
    .zp-auth-appearance .zp-login-hero-copy { display:none; }
    .zp-auth-appearance .zp-login-platforms { display:none; }
    .zp-auth-appearance[data-auth-template=centered] :is(.zp-login-theme-shell,.saas-login-shell) { grid-template-rows:minmax(0,1fr); }
    .zp-auth-appearance .saas-button-row { grid-template-columns:1fr 1fr!important; }
}
@media(max-height:480px) {
    .zp-auth-appearance :is(.zp-login-theme-hero,.saas-login-visual) { padding:12px; }
    .zp-auth-appearance .zp-login-hero-copy { display:none; }
    .zp-auth-appearance[data-auth-density=essential] h2 { font-size:min(var(--auth-h2-size),18px); }
    .zp-auth-appearance[data-auth-density=essential] :is(input:not([type=checkbox]):not([type=hidden]),select,.zp-login-submit,.saas-submit) { min-height:36px; padding:6px 10px; }
    .zp-auth-appearance[data-auth-density=essential] :is(.zp-login-theme-form,.saas-auth-form) { gap:6px; }
    .zp-auth-appearance[data-auth-density=essential] .zp-auth-centered-brand { margin-bottom:2px; }
    .zp-auth-appearance[data-auth-density=essential] .zp-auth-centered-brand .zp-login-brand-icon { width:28px; height:28px; }
    .zp-auth-appearance[data-auth-density=essential] .zp-auth-centered-brand img { max-width:22px; max-height:22px; }
}