/* Campaign portal entrance. Illustrative graphics use SVG attributes and external CSS for CSP. */
html[data-cp-scheme] body.cp-client .nl-login{
 --nl-accent:var(--cp-purple);--nl-soft:var(--cp-accent-soft);
 display:grid;grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr);align-items:stretch;
 width:100%;min-height:650px;margin:10px auto 0;border:1px solid var(--cp-line);border-radius:24px;
 background:var(--cp-card);box-shadow:var(--cp-login-shadow);overflow:hidden;isolation:isolate;
}
.nl-login :is(h1,h2,h3,p){margin:0}
.nl-login :is(button,input){font-family:inherit}
.nl-login :is(button,input):focus-visible{outline:3px solid var(--cp-focus);outline-offset:3px}
.nl-login [hidden],.nl-login svg [visibility="hidden"]{display:none!important}
.nl-login .nl-story{
 position:relative;min-width:0;padding:clamp(26px,2.6vw,36px);overflow:hidden;
 background:radial-gradient(ellipse at 94% 4%,color-mix(in srgb,var(--cp-purple) 8%,transparent),transparent 57%),var(--cp-card-2);
}
.nl-login .nl-story::before{
 content:"";position:absolute;inset:0;pointer-events:none;opacity:.32;
 background-image:radial-gradient(var(--cp-line) .8px,transparent .8px);background-size:18px 18px;
 mask-image:linear-gradient(155deg,#000,transparent 62%);
}
.nl-login .nl-story>*{position:relative}
.nl-login .nl-kicker{
 display:flex;align-items:center;gap:8px;margin-bottom:10px;color:var(--cp-purple);
 font-size:10px;font-weight:800;letter-spacing:.08em!important;line-height:1.6;text-transform:uppercase;
}
.nl-login .nl-kicker::before{content:"";width:18px;height:2px;border-radius:2px;background:currentColor}
.nl-login h1.nl-heading{font-size:clamp(31px,3.2vw,43px);font-weight:900;line-height:1.45;color:var(--cp-ink);letter-spacing:-.02em!important}
.nl-login .nl-heading em{color:var(--cp-purple);font-style:normal}
.nl-login .nl-kicker-mark{display:none}
.nl-login .nl-lead{max-width:550px;margin-top:6px;color:var(--cp-muted);font-size:14px;line-height:1.9}
.nl-login .nl-visual{--nl-channel:var(--cp-google-ink);--nl-channel-soft:var(--cp-google-bg);margin-top:23px;min-width:0}
.nl-login .nl-visual[data-nl-channel="meta"]{--nl-channel:var(--cp-meta-ink);--nl-channel-soft:var(--cp-meta-bg)}
.nl-login .nl-visual[data-nl-channel="tiktok"]{--nl-channel:var(--cp-cyan);--nl-channel-soft:var(--cp-cyan-soft)}
.nl-login .nl-visual[data-nl-channel="snap"]{--nl-channel:var(--cp-amber);--nl-channel-soft:var(--cp-snap-bg)}
.nl-login .nl-channel-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:12px;direction:ltr}
html[data-cp-scheme] body.cp-client .nl-login .nl-channel-tab{
 position:relative;display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;min-height:39px;
 padding:8px 7px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--cp-muted);
 font-size:12px;line-height:1.5;font-weight:700;transition:background .18s,border-color .18s,color .18s;
}
html[data-cp-scheme] body.cp-client .nl-login .nl-channel-tab:hover{background:var(--cp-card);color:var(--cp-ink);filter:none}
html[data-cp-scheme] body.cp-client .nl-login .nl-channel-tab.is-active{background:var(--cp-card);border-color:var(--cp-line);color:var(--cp-ink);box-shadow:0 3px 8px #17213608}
.nl-login .nl-channel-tab.is-active::after{content:"";position:absolute;inset:auto 30% -1px;height:2px;border-radius:3px;background:var(--nl-channel)}
.nl-login .nl-channel-tab>.fa-brands{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;font-size:18px;flex:0 0 20px;line-height:1}
.nl-login .nl-channel-tab[data-nl-channel="google"]>.fa-google{color:var(--cp-google-ink)}
.nl-login .nl-channel-tab[data-nl-channel="meta"]>.fa-meta{color:var(--cp-meta-ink)}
.nl-login .nl-channel-tab[data-nl-channel="tiktok"]>.fa-tiktok{color:var(--cp-ink);text-shadow:-1px 0 #25c3ce,1px 0 #ed4268}
.nl-login .nl-channel-tab[data-nl-channel="snap"]>.fa-snapchat{color:#121820;background:#ffeb00;border-radius:5px;font-size:16px}
.nl-login .nl-chart-card{padding:20px 21px 15px;border:1px solid var(--cp-line);border-radius:17px;background:var(--cp-card);box-shadow:0 10px 32px #18224706}
.nl-login .nl-chart-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}
.nl-login .nl-chart-heading>div{min-width:0}
.nl-login .nl-chart-kicker{display:block;margin-bottom:3px;color:var(--cp-muted);font-size:10px;font-weight:700}
.nl-login .nl-chart-heading h3{color:var(--cp-ink);font-size:19px;font-weight:800;line-height:1.6}
.nl-login .nl-chart-heading p{margin-top:3px;color:var(--cp-muted);font-size:12px;line-height:1.8}
html[data-cp-scheme] body.cp-client .nl-login .nl-motion-button{
 display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:0 0 auto;min-height:30px;
 padding:6px 7px;border:0;border-radius:6px;background:var(--cp-card-2);color:var(--cp-muted);font-size:9px;line-height:1.5;
}
.nl-login .nl-motion-button .fa-solid{font-size:10px;width:10px;height:10px;flex:0 0 10px;min-width:10px}
html[data-cp-scheme] body.cp-client .nl-login .nl-motion-button:hover{color:var(--cp-ink);background:var(--cp-accent-soft);filter:none}
.nl-login .nl-chart-stage-tabs{display:inline-flex;gap:3px;margin-top:12px;padding:3px;border:1px solid var(--cp-line);border-radius:8px;background:var(--cp-card-2)}
html[data-cp-scheme] body.cp-client .nl-login .nl-stage-tab{
 min-height:32px;padding:5px 14px;border:0;border-radius:5px;background:transparent;color:var(--cp-muted);font-size:12px;font-weight:700;transition:background .18s,color .18s;
}
html[data-cp-scheme] body.cp-client .nl-login .nl-stage-tab.is-active{background:var(--cp-card);color:var(--nl-channel);box-shadow:0 1px 4px #0000000a}
html[data-cp-scheme] body.cp-client .nl-login .nl-stage-tab:hover{color:var(--nl-channel);filter:none}
.nl-login .nl-chart-surface{position:relative;width:100%;margin-top:12px;overflow:hidden;border-radius:8px;background:linear-gradient(180deg,color-mix(in srgb,var(--nl-channel) 4%,transparent),transparent 85%)}
.nl-login svg.nl-chart{display:block;width:100%;height:auto;max-height:160px;overflow:visible;direction:ltr}
.nl-login .nl-chart-grid{stroke:var(--cp-line);stroke-width:.8;stroke-dasharray:2 6;opacity:.78}
.nl-login .nl-chart-baseline{stroke:var(--cp-line);stroke-width:1}
.nl-login .nl-chart-line{stroke:var(--nl-channel);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:0;vector-effect:non-scaling-stroke;transition:stroke .3s}
.nl-login .nl-chart-line.is-active{animation:nl-path-draw 1.5s cubic-bezier(.2,.65,.25,1) both}
.nl-login .nl-chart-point{fill:var(--cp-card);stroke:var(--nl-channel);stroke-width:2.5;vector-effect:non-scaling-stroke;transition:stroke .3s,fill .3s}
.nl-login .nl-chart-point-end{fill:var(--nl-channel);stroke:var(--cp-card);stroke-width:3;filter:drop-shadow(0 0 4px color-mix(in srgb,var(--nl-channel) 25%,transparent))}
.nl-login .nl-chart-point-end.is-active{animation:nl-point-breathe 3s ease-in-out 1.5s infinite;transform-origin:center;transform-box:fill-box}
.nl-login .nl-chart-legend{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:1px;color:var(--cp-muted);font-size:10px;line-height:1.6}
.nl-login .nl-legend-key{display:flex;align-items:center;gap:7px;color:var(--cp-ink);font-weight:700}
.nl-login .nl-legend-dot{width:7px;height:7px;border-radius:50%;background:var(--nl-channel);box-shadow:0 0 0 3px var(--nl-channel-soft);flex:0 0 7px}
.nl-login .nl-chart-caption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.nl-login .nl-flow{display:grid;grid-template-columns:minmax(0,1fr) 19px minmax(0,1fr) 19px minmax(0,1fr);align-items:center;gap:6px;margin-top:14px;padding:13px 11px;border:1px solid var(--cp-line);border-radius:12px;background:var(--cp-card)}
.nl-login .nl-flow-node{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;color:var(--cp-ink);font-size:12px;font-weight:700;line-height:1.7}
.nl-login .nl-flow-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 29px;width:29px;height:29px;border-radius:8px;background:var(--cp-accent-soft);color:var(--cp-purple)}
.nl-login .nl-flow-icon :is(.fa-solid,.fa-brands){font-size:13px;line-height:1;width:15px;height:15px;flex:0 0 15px;min-width:15px}
.nl-login .nl-flow-platform .nl-flow-icon{background:var(--nl-channel-soft);color:var(--nl-channel)}
.nl-login .nl-flow-connector{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;color:var(--cp-muted);opacity:.7}
.nl-login .nl-flow-connector::after{content:"";position:absolute;inset:auto 0 auto auto;width:4px;height:4px;border-radius:50%;background:var(--nl-channel);opacity:0;animation:nl-flow-signal 3.6s ease-in-out infinite}
.nl-login .nl-flow-connector:nth-of-type(2)::after{animation-delay:1.8s}
.nl-login .nl-flow-connector .fa-solid{font-size:11px}
.nl-login .nl-channel-detail{margin-top:9px;text-align:center;color:var(--cp-muted);font-size:11px;line-height:1.8}
.nl-login .nl-demo-note{display:flex;align-items:flex-start;justify-content:center;gap:6px;margin-top:12px;color:var(--cp-muted);font-size:11px;line-height:1.8}
.nl-login .nl-demo-note .fa-solid{font-size:10px;margin-top:4px}
.nl-login .nl-state-announcement{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.nl-login .nl-form-panel{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:clamp(26px,3.5vw,48px);border-inline-start:1px solid var(--cp-line);background:var(--cp-card)}
.nl-login .nl-form-intro{margin-bottom:25px}
.nl-login .nl-form-symbol{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;margin-bottom:18px;border:1px solid color-mix(in srgb,var(--cp-purple) 20%,var(--cp-line));border-radius:11px;background:var(--cp-accent-soft);color:var(--cp-purple)}
.nl-login .nl-form-symbol .fa-solid{font-size:17px;width:17px;height:17px}
.nl-login .nl-form-intro .nl-kicker{font-size:9px;margin-bottom:13px}
.nl-login .nl-form-intro h2{color:var(--cp-ink);font-size:26px;font-weight:800;line-height:1.5}
.nl-login .nl-form-intro p{margin-top:7px;max-width:280px;color:var(--cp-muted);font-size:12px;line-height:1.9}
.nl-login form.nl-form{display:grid;gap:18px;margin:0;padding:0;background:transparent;border:0;box-shadow:none}
.nl-login .nl-field{display:grid;gap:7px;min-width:0}
.nl-login .nl-field label{display:block;margin:0;color:var(--cp-ink);font-size:13px;font-weight:700;line-height:1.8}
.nl-login .nl-input-wrap{position:relative;display:flex;align-items:center;min-width:0;border-radius:10px}
.nl-login .nl-input-wrap>:is(.fa-solid,.fa-regular){position:absolute;z-index:1;inset-inline-start:14px;color:var(--cp-muted);font-size:14px;width:14px;height:14px;pointer-events:none}
html[data-cp-scheme] body.cp-client .nl-login .nl-input-wrap input{
 display:block;width:100%;min-width:0;min-height:49px;margin:0;padding:12px 40px;border:1px solid var(--cp-field-border);
 border-radius:10px;background:var(--cp-card-2);color:var(--cp-ink);font-size:13px;line-height:1.6;
 box-shadow:0 1px 0 #00000003;transition:border-color .18s,box-shadow .18s,background .18s;
}
html[data-cp-scheme] body.cp-client .nl-login .nl-input-wrap input:focus{border-color:var(--cp-focus);background:var(--cp-card);box-shadow:0 0 0 3px color-mix(in srgb,var(--cp-focus) 11%,transparent);outline:none}
html[data-cp-scheme] body.cp-client .nl-login .nl-input-wrap input::placeholder{color:var(--cp-muted);opacity:.85;font-size:13px}
html[data-cp-scheme] body.cp-client .nl-login .nl-password-toggle{position:absolute;inset-inline-end:5px;display:inline-grid;place-items:center;width:36px;height:36px;min-height:36px;padding:0;border:0;border-radius:7px;background:transparent;color:var(--cp-muted)}
html[data-cp-scheme] body.cp-client .nl-login .nl-password-toggle:hover{background:var(--cp-accent-soft);color:var(--cp-purple);filter:none}
.nl-login .nl-password-toggle :is(.fa-solid,.fa-regular){font-size:14px;width:14px;height:14px}
html[data-cp-scheme] body.cp-client .nl-login .nl-submit{
 display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:48px;margin-top:5px;padding:11px 17px;
 border:1px solid var(--cp-action);border-radius:10px;background:var(--cp-action);color:#fff;font-size:13px;font-weight:800;
 box-shadow:0 5px 12px color-mix(in srgb,var(--cp-action) 12%,transparent);transition:background .18s,box-shadow .18s;
}
html[data-cp-scheme] body.cp-client .nl-login .nl-submit:hover{background:var(--cp-action-hover);border-color:var(--cp-action-hover);color:#fff;filter:none;box-shadow:0 7px 17px color-mix(in srgb,var(--cp-action) 20%,transparent)}
.nl-login .nl-submit .fa-solid{font-size:13px;transition:transform .18s}
.nl-login .nl-submit:hover .fa-arrow-left{transform:translateX(-3px)}
html[data-cp-scheme] body.cp-client .nl-login .nl-submit:disabled{background:var(--cp-card-2);color:var(--cp-muted);border-color:var(--cp-line);box-shadow:none;cursor:wait}
.nl-login .cp-error{margin:0;padding:11px 12px;border-radius:9px;font-size:11px;line-height:1.9}
.nl-login .cp-error:empty{display:none}
.nl-login .nl-trust-note{display:flex;align-items:flex-start;gap:7px;margin-top:8px;padding-top:14px;border-top:1px solid var(--cp-line);color:var(--cp-muted);font-size:11px;line-height:1.9}
.nl-login .nl-trust-note .fa-solid{flex:0 0 13px;font-size:13px;margin-top:3px;color:var(--cp-purple)}
.nl-login .nl-form-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:34px;color:var(--cp-muted);font-size:9px;line-height:1.8}
.nl-login .nl-form-footer>span:first-child{font-size:8px;font-weight:800;letter-spacing:.1em!important}
.nl-login .nl-form-panel{animation:nl-panel-enter .45s ease-out both}
.nl-login .nl-visual[data-nl-motion="off"] *,
.nl-login .nl-visual[data-nl-motion="off"] *::before,
.nl-login .nl-visual[data-nl-motion="off"] *::after{animation:none!important}
@keyframes nl-path-draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes nl-point-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}
@keyframes nl-flow-signal{0%,10%{opacity:0;transform:translateX(2px)}25%{opacity:1}75%{opacity:1}90%,100%{opacity:0;transform:translateX(-20px)}}
@keyframes nl-panel-enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(min-width:1550px){.nl-login .nl-story{padding:32px 42px}.nl-login .nl-chart-surface{margin-top:13px}.nl-login svg.nl-chart{max-height:170px}}
@media(max-width:1100px){
 html[data-cp-scheme] body.cp-client .nl-login{grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);min-height:620px}
 .nl-login .nl-story{padding:27px}.nl-login .nl-form-panel{padding:30px}.nl-login .nl-chart-card{padding:17px 16px 13px}
 .nl-login .nl-chart-heading h3{font-size:17px}.nl-login .nl-chart-heading p{font-size:10px;min-height:36px}.nl-login .nl-motion-button span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
 html[data-cp-scheme] body.cp-client .nl-login .nl-motion-button{width:30px;padding:0;min-height:30px;flex-basis:30px}
 .nl-login .nl-flow-node{flex-direction:column;gap:5px;text-align:center;font-size:11px}.nl-login .nl-flow{padding:10px 8px}
}
@media(max-width:850px){
 html[data-cp-scheme] body.cp-client .nl-login{grid-template-columns:1fr;min-height:0;max-width:660px;margin-top:4px;border-radius:19px}
 .nl-login .nl-form-panel{order:-1;padding:29px 34px;border-inline-start:0;border-bottom:1px solid var(--cp-line)}
 .nl-login .nl-form-intro{margin-bottom:21px}.nl-login .nl-form-intro .nl-kicker{margin-bottom:9px}.nl-login .nl-form-intro h2{font-size:24px}
 .nl-login .nl-form-intro p{max-width:none}.nl-login form.nl-form{grid-template-columns:1fr 1fr;gap:16px 14px}.nl-login .nl-submit,.nl-login .cp-error,.nl-login .nl-trust-note{grid-column:1/-1}
 .nl-login .nl-trust-note{margin-top:1px;padding-top:14px}.nl-login .nl-form-symbol{margin-bottom:13px}.nl-login .nl-form-footer{margin-top:21px}.nl-login .nl-story{padding:29px 34px}.nl-login h1.nl-heading{font-size:30px}
 .nl-login .nl-lead{font-size:12px}.nl-login .nl-visual{margin-top:19px}.nl-login .nl-chart-heading h3{font-size:18px}.nl-login .nl-chart-heading p{min-height:0;font-size:11px}
 .nl-login .nl-flow-node{flex-direction:row;font-size:10px}.nl-login .nl-chart-surface{margin-top:11px}.nl-login svg.nl-chart{max-height:185px}
}
@media(max-width:520px){
 html[data-cp-scheme] body.cp-client .nl-login{border-radius:16px;margin-top:0}
 .nl-login .nl-form-panel{padding:27px 22px}.nl-login form.nl-form{grid-template-columns:1fr;gap:15px}.nl-login .nl-form-intro{margin-bottom:20px}
 .nl-login .nl-form-intro h2{font-size:24px}.nl-login .nl-form-intro p{font-size:11px}.nl-login .nl-input-wrap input{min-height:48px}
 html[data-cp-scheme] body.cp-client .nl-login .nl-password-toggle{min-width:40px;min-height:40px;inset-inline-end:4px}
 .nl-login .nl-trust-note{font-size:11px}.nl-login .nl-story{padding:25px 17px}.nl-login .nl-kicker{font-size:9px}.nl-login h1.nl-heading{font-size:28px}
 .nl-login .nl-lead{font-size:13px;line-height:1.9}.nl-login .nl-visual{margin-top:18px}.nl-login .nl-channel-tabs{gap:3px;margin-bottom:9px}
 html[data-cp-scheme] body.cp-client .nl-login .nl-channel-tab{flex-direction:column;gap:5px;min-height:53px;padding:7px 3px;font-size:9px}
 .nl-login .nl-channel-tab>.fa-brands{font-size:18px}.nl-login .nl-chart-card{padding:16px 13px 12px;border-radius:12px}
 .nl-login .nl-chart-heading h3{font-size:16px}.nl-login .nl-chart-kicker{font-size:9px}.nl-login .nl-chart-heading p{font-size:10px;min-height:36px;line-height:1.8}
 html[data-cp-scheme] body.cp-client .nl-login .nl-motion-button{width:36px;min-height:36px;flex-basis:36px}
 .nl-login .nl-chart-heading{gap:7px}.nl-login .nl-chart-stage-tabs{display:flex;gap:3px;margin-top:10px;padding:3px}
 html[data-cp-scheme] body.cp-client .nl-login .nl-stage-tab{flex:1;min-height:38px;padding:8px 5px;font-size:10px}
 .nl-login .nl-chart-surface{margin-top:12px}.nl-login .nl-chart-legend{font-size:9px;gap:7px}.nl-login .nl-chart-caption{font-size:8px;line-height:1.9}
 .nl-login .nl-flow{grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr) 12px minmax(0,1fr);gap:3px;padding:11px 7px;border-radius:10px}
 .nl-login .nl-flow-node{flex-direction:column;gap:5px;font-size:11px}.nl-login .nl-flow-icon{width:28px;height:28px;flex-basis:28px}.nl-login .nl-flow-connector .fa-solid{font-size:9px}
 .nl-login .nl-channel-detail{font-size:11px}.nl-login .nl-demo-note{font-size:10px;margin-top:10px}
 html[data-cp-scheme] body.cp-client .nl-login .nl-input-wrap input{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.nl-login *,.nl-login *::before,.nl-login *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
