/* Hyrer sign-in brand panel (l2). Built from the hyrer.io design: dusk scene, typed wordmark, word-by-word headline and a live product window. */
.z-auth-brand.hxl{padding:12px;background:var(--auth-right,#f1f0fb);color:#fff;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.z-auth-brand.hxl:before,.z-auth-brand.hxl:after{content:none;display:none}
.hxl-scene{position:relative;isolation:isolate;flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden;border-radius:20px;padding:clamp(28px,3vw,44px) clamp(28px,3.2vw,48px) 0;background:#1d1856 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 1000' preserveAspectRatio='xMidYMid slice'%3E%3Cdefs%3E%3ClinearGradient id='s' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%230e0c2c'/%3E%3Cstop offset='0.3' stop-color='%231d1856'/%3E%3Cstop offset='0.52' stop-color='%233b2c96'/%3E%3Cstop offset='0.68' stop-color='%237a57c2'/%3E%3Cstop offset='0.8' stop-color='%23ad7fd3'/%3E%3Cstop offset='0.88' stop-color='%23d9a2dc'/%3E%3Cstop offset='1' stop-color='%23f1d3ee'/%3E%3C/linearGradient%3E%3CradialGradient id='g' cx='1120' cy='900' r='820' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f8dcf2' stop-opacity='0.95'/%3E%3Cstop offset='0.35' stop-color='%23d69ae0' stop-opacity='0.45'/%3E%3Cstop offset='1' stop-color='%23d69ae0' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='v' cx='260' cy='320' r='760' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%236b55ea' stop-opacity='0.5'/%3E%3Cstop offset='1' stop-color='%236b55ea' stop-opacity='0'/%3E%3C/radialGradient%3E%3Cfilter id='c' x='0' y='0' width='100%25' height='100%25' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.0024 0.011' numOctaves='5' seed='11'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 .78  0 0 0 0 .86  2.1 0 0 0 -1.02'/%3E%3C/filter%3E%3ClinearGradient id='cmg' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='0.3' stop-color='%23fff' stop-opacity='0.25'/%3E%3Cstop offset='0.62' stop-color='%23fff' stop-opacity='0.9'/%3E%3Cstop offset='0.8' stop-color='%23fff' stop-opacity='0.5'/%3E%3Cstop offset='0.86' stop-color='%23fff' stop-opacity='0'/%3E%3C/linearGradient%3E%3Cmask id='cm'%3E%3Crect width='1600' height='1000' fill='url(%23cmg)'/%3E%3C/mask%3E%3Cfilter id='b3' x='-5%25' y='-30%25' width='110%25' height='160%25'%3E%3CfeGaussianBlur stdDeviation='3'/%3E%3C/filter%3E%3Cfilter id='b1' x='-5%25' y='-30%25' width='110%25' height='160%25'%3E%3CfeGaussianBlur stdDeviation='1.2'/%3E%3C/filter%3E%3ClinearGradient id='h1' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%234a3494'/%3E%3Cstop offset='1' stop-color='%232d2166'/%3E%3C/linearGradient%3E%3ClinearGradient id='h2' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23241a58'/%3E%3Cstop offset='1' stop-color='%23140f36'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='1600' height='1000' fill='url(%23s)'/%3E%3Crect width='1600' height='1000' fill='url(%23v)'/%3E%3Crect width='1600' height='1000' fill='url(%23g)'/%3E%3Crect width='1600' height='1000' fill='%23fff' filter='url(%23c)' mask='url(%23cm)' opacity='.55'/%3E%3Cpath d='M-80 872 L0 872 C 200 842 380 850 600 866 S 1020 834 1260 852 S 1500 872 1600 862 L1680 862 V1000 H-80Z' fill='url(%23h1)' opacity='.8' filter='url(%23b3)'/%3E%3Cpath d='M-80 934 L0 934 C 280 902 560 922 820 930 S 1320 904 1600 926 L1680 926 V1000 H-80Z' fill='url(%23h2)' filter='url(%23b1)'/%3E%3C/svg%3E") center/cover no-repeat;box-shadow:inset 0 0 0 1px rgb(255 255 255/.06)}
.hxl-scene:after{content:"";position:absolute;inset:0;z-index:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 -.35'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:200px 200px;opacity:.4;mix-blend-mode:soft-light;pointer-events:none}
.hxl-scene>*{position:relative;z-index:1}
.hxl-light{position:absolute!important;z-index:0!important;inset:0;overflow:hidden;pointer-events:none}
.hxl-light i{position:absolute;border-radius:50%;filter:blur(48px);will-change:transform,opacity}
.hxl-light i:nth-child(1){width:58%;aspect-ratio:1;left:-14%;top:-6%;background:radial-gradient(circle,rgb(107 85 234/.55),transparent 66%);animation:hxlDriftA 20s ease-in-out infinite alternate}
.hxl-light i:nth-child(2){width:64%;aspect-ratio:1;right:-20%;bottom:-24%;background:radial-gradient(circle,rgb(214 208 250/.45),transparent 64%);animation:hxlDriftB 24s ease-in-out infinite alternate}

/* Top row: typed wordmark and a glass pill, as on the website. */
.hxl-top{display:flex;align-items:center;justify-content:space-between;gap:16px;opacity:0;animation:hxlIn .9s cubic-bezier(.16,1,.3,1) .05s both}
.hxl-logo{display:inline-flex;align-items:baseline;font-size:30px;font-weight:600;letter-spacing:-.06em;line-height:1;color:#fff}
.hxl-logo i{display:inline-block;width:.2em;height:.2em;margin-left:.05em;border-radius:50%;background:#a99cff}
.hxl-pill{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 13px;border-radius:999px;background:rgb(255 255 255/.1);box-shadow:inset 0 0 0 1px rgb(255 255 255/.14);color:rgb(255 255 255/.86);font-size:13px;font-weight:500;white-space:nowrap;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.hxl-pill b{width:6px;height:6px;border-radius:50%;background:#6450cf;animation:hxlBlink 2.4s ease-in-out infinite}

/* Headline: each word rises out of a mask, like the website hero. */
.hxl-copy{max-width:540px;margin-top:clamp(40px,7vh,84px)}
.hxl-h{margin:0;color:#fff;font-family:inherit!important;font-size:30px;font-weight:500;line-height:1.02;letter-spacing:-.045em}
.hxl-w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .06em .16em;margin:0 -.06em -.16em}
.hxl-w>span{display:inline-block;transform:translate3d(0,110%,0) rotate(3deg);animation:hxlWord 1s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(120ms + var(--i,0) * 55ms)}
.hxl-hdot{display:inline-block;width:.16em;height:.16em;margin-left:.04em;border-radius:50%;background:#fff;transform:scale(0);animation:hxlPop .65s cubic-bezier(.34,1.45,.64,1) .72s both}
.hxl-lead{max-width:440px;margin:20px 0 0;color:rgb(255 255 255/.78);font-size:16px;line-height:1.55;letter-spacing:-.005em;opacity:0;animation:hxlUp 1.1s cubic-bezier(.16,1,.3,1) .42s both}

/* Product: glass tabs and an app window that bleeds off the bottom edge. */
.hxl-product{position:relative;flex:1 1 auto;min-height:300px;margin-top:clamp(28px,4.5vh,48px)}
.hxl-tabs{position:relative;display:inline-flex;padding:4px;border-radius:13px;background:rgb(255 255 255/.1);box-shadow:inset 0 0 0 1px rgb(255 255 255/.14);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);opacity:0;animation:hxlUp 1s cubic-bezier(.16,1,.3,1) .56s both}
.hxl-tabs span{position:relative;z-index:1;width:104px;height:32px;display:grid;place-items:center;border-radius:9px;color:rgb(255 255 255/.76);font-size:13px;font-weight:500;letter-spacing:-.01em;white-space:nowrap}
.hxl-tabs span:nth-child(2){animation:hxlTab1 18s infinite}.hxl-tabs span:nth-child(3){animation:hxlTab2 18s infinite}.hxl-tabs span:nth-child(4){animation:hxlTab3 18s infinite}
.hxl-tabs em{position:absolute;z-index:0;left:4px;top:4px;width:104px;height:32px;border-radius:9px;background:#fff;box-shadow:0 1px 2px rgb(10 6 40/.25);animation:hxlPill 18s cubic-bezier(.65,0,.35,1) infinite}
.hxl-win{position:absolute;left:0;top:56px;width:640px;height:520px;display:flex;overflow:hidden;border-radius:14px;background:#f5f6fa;color:#23243b;font-size:12px;text-align:left;box-shadow:0 0 0 1px rgb(255 255 255/.1),0 60px 120px -40px rgb(6 3 28/.8),0 24px 48px -24px rgb(6 3 28/.55);opacity:0;animation:hxlApp 1.4s cubic-bezier(.16,1,.3,1) .64s both}
.hxl-rail{flex:0 0 54px;display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 0;background:#1f1f36}
.hxl-rail strong{padding:0 0 10px;color:#fff;font-size:24px;font-weight:600;letter-spacing:-.04em;line-height:1}
.hxl-rail strong i{display:inline-block;width:.17em;height:.17em;margin-left:.03em;border-radius:50%;background:#a99cff}
.hxl-rail span{width:34px;height:30px;border-radius:9px;background:rgb(255 255 255/.06)}
.hxl-rail span:nth-of-type(1){background:#6450cf}
.hxl-main{position:relative;flex:1;min-width:0}
.hxl-bar{display:flex;align-items:center;gap:10px;height:46px;padding:0 16px;border-bottom:1px solid #e8e8f0;background:#fff}
.hxl-search{flex:1;height:28px;display:flex;align-items:center;padding:0 10px;border:1px solid #e3e3ec;border-radius:8px;color:#9092a6;font-size:12px}
.hxl-create{height:28px;padding:0 11px;display:grid;place-items:center;border-radius:8px;background:#6450cf;color:#fff;font-size:12px;font-weight:600}
.hxl-av{width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:#ecebfb;color:#5243c9;font-size:12px;font-weight:600}
.hxl-screen{position:absolute;left:0;right:0;top:46px;bottom:0;padding:18px 18px 0;opacity:0}
.hxl-screen.is-1{animation:hxlS1 18s infinite}.hxl-screen.is-2{animation:hxlS2 18s infinite}.hxl-screen.is-2 .hxl-col{overflow:visible}.hxl-screen.is-3{animation:hxlS3 18s infinite}
.hxl-t{margin:0;color:#1f1f36;font-size:20px;font-weight:600;letter-spacing:-.03em}
.hxl-t i{display:inline-block;width:.18em;height:.18em;margin-left:.04em;border-radius:50%;background:#6450cf}
.hxl-s{margin:3px 0 0;color:#6b6d84;font-size:12px}
.hxl-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.hxl-kpi{padding:11px 12px;border:1px solid #ebebf2;border-radius:11px;background:#fff}
.hxl-kpi small{display:block;color:#6b6d84;font-size:12px}
.hxl-kpi b{display:block;margin-top:4px;color:#1f1f36;font-size:20px;font-weight:600;letter-spacing:-.02em}
.hxl-kpi u{display:block;height:4px;margin-top:8px;border-radius:2px;background:#efeef8;overflow:hidden;text-decoration:none}
.hxl-kpi u:after{content:"";display:block;height:100%;width:var(--w,60%);border-radius:inherit;background:linear-gradient(90deg,#6450cf,#a99cff);transform-origin:left;animation:hxlGrow 18s cubic-bezier(.16,1,.3,1) infinite}
.hxl-card{margin-top:12px;border:1px solid #ebebf2;border-radius:11px;background:#fff}
.hxl-card-h{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid #f0f0f5;color:#1f1f36;font-size:12px;font-weight:600}
.hxl-card-h small{color:#6450cf;font-size:12px;font-weight:500}
.hxl-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid #f3f3f7;color:#2c2d45;font-size:12px}
.hxl-row:last-child{border-bottom:0}
.hxl-row em{flex:none;width:7px;height:7px;border-radius:50%;background:var(--c,#6450cf)}
.hxl-row span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hxl-row small{flex:none;padding:2px 7px;border-radius:6px;background:#f2f1fb;color:#5243c9;font-size:12px;font-weight:500}
.hxl-screen.is-1 .hxl-row{animation:hxlRow 18s cubic-bezier(.16,1,.3,1) infinite}
.hxl-screen.is-1 .hxl-row:nth-child(3){animation-delay:.12s}.hxl-screen.is-1 .hxl-row:nth-child(4){animation-delay:.24s}
.hxl-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.hxl-col{min-height:260px;padding:9px;border-radius:11px;background:#ecebf4}
.hxl-col>small{display:flex;justify-content:space-between;margin-bottom:8px;color:#4a4c66;font-size:12px;font-weight:600}
.hxl-col>small i{font-style:normal;color:#8a8ca2;font-weight:500}
.hxl-cand{display:flex;align-items:center;gap:8px;margin-bottom:7px;padding:8px 9px;border-radius:9px;background:#fff;box-shadow:0 1px 2px rgb(31 31 54/.06)}
.hxl-cand b{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;background:var(--c,#ecebfb);color:#3d2fb0;font-size:12px;font-weight:600}
.hxl-cand span{min-width:0;font-size:12px;font-weight:500;color:#1f1f36;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hxl-cand span small{display:block;color:#8a8ca2;font-size:12px;font-weight:400}
.hxl-mover{position:relative;z-index:2;box-shadow:0 12px 26px -8px rgb(31 31 54/.28),0 0 0 1.5px #6450cf;animation:hxlMove 18s cubic-bezier(.65,0,.35,1) infinite}
.hxl-lead-row{display:flex;align-items:center;gap:12px;padding:11px 12px;border-bottom:1px solid #f3f3f7}
.hxl-lead-row:last-child{border-bottom:0}
.hxl-lead-row>b{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:9px;background:var(--c,#ecebfb);color:#3d2fb0;font-size:12px;font-weight:600}
.hxl-lead-row>b+span{flex:1;min-width:0;color:#1f1f36;font-size:12px;font-weight:600}
.hxl-lead-row>b+span small{display:block;margin-top:1px;color:#8a8ca2;font-size:12px;font-weight:400}
.hxl-match{flex:0 0 110px;display:flex;align-items:center;gap:8px;color:#1f1f36;font-size:12px;font-weight:600}
.hxl-match u{flex:1;height:5px;border-radius:3px;background:#efeef8;overflow:hidden;text-decoration:none}
.hxl-match u:after{content:"";display:block;height:100%;width:var(--w,70%);border-radius:inherit;background:linear-gradient(90deg,#5a46c8,#a99cf0);transform-origin:left;animation:hxlGrow3 18s cubic-bezier(.16,1,.3,1) infinite}
.hxl-new{flex:none;padding:2px 7px;border-radius:6px;background:#efecfc;color:#5a46c8;font-size:12px;font-weight:600;animation:hxlBlink 2.4s ease-in-out infinite}

/* Notice that pops over the window, in step with the screens. */
.hxl-toasts{position:absolute;left:420px;top:108px;width:260px;height:64px;z-index:3}
.hxl-toast{position:absolute;inset:0 0 auto 0;display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:14px;background:rgb(255 255 255/.92);color:#1f1f36;box-shadow:0 0 0 1px rgb(255 255 255/.6),0 24px 48px -18px rgb(6 3 28/.55);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0}
.hxl-toast:nth-child(1){animation:hxlT1 18s cubic-bezier(.16,1,.3,1) infinite}.hxl-toast:nth-child(2){animation:hxlT2 18s cubic-bezier(.16,1,.3,1) infinite}.hxl-toast:nth-child(3){animation:hxlT3 18s cubic-bezier(.16,1,.3,1) infinite}
.hxl-toast>i{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:10px;background:#efecfd;color:#6a52e0}
.hxl-toast>i svg{width:16px;height:16px}
.hxl-toast b{display:block;font-size:13px;font-weight:600;letter-spacing:-.01em}
.hxl-toast small{display:block;margin-top:1px;color:#6b6d84;font-size:12px}

@keyframes hxlIn{from{opacity:0;transform:translate3d(0,-10px,0)}to{opacity:1;transform:none}}
@keyframes hxlUp{from{opacity:0;transform:translate3d(0,18px,0)}to{opacity:1;transform:none}}
@keyframes hxlWord{from{transform:translate3d(0,110%,0) rotate(3deg)}to{transform:translate3d(0,0,0) rotate(0)}}
@keyframes hxlPop{from{transform:scale(0)}to{transform:scale(1)}}
@keyframes hxlApp{from{opacity:0;transform:translate3d(0,48px,0) scale(.985)}to{opacity:1;transform:none}}
@keyframes hxlBlink{50%{opacity:.3}}
@keyframes hxlDriftA{from{transform:translate(0,0) scale(1)}to{transform:translate(10%,8%) scale(1.1)}}
@keyframes hxlDriftB{from{transform:translate(0,0) scale(1)}to{transform:translate(-8%,-6%) scale(1.08)}}
@keyframes hxlPill{0%,30%{transform:translateX(0)}33.3%,63%{transform:translateX(104px)}66.6%,96%{transform:translateX(208px)}100%{transform:translateX(0)}}
@keyframes hxlTab1{0%,30%,100%{color:#1f1f36}33.3%,96%{color:rgb(255 255 255/.76)}}
@keyframes hxlTab2{0%,30%,66.6%,100%{color:rgb(255 255 255/.76)}33.3%,63%{color:#1f1f36}}
@keyframes hxlTab3{0%,63%,100%{color:rgb(255 255 255/.76)}66.6%,96%{color:#1f1f36}}
@keyframes hxlS1{0%,30%{opacity:1;transform:none}33.3%,96%{opacity:0;transform:translate3d(0,8px,0)}100%{opacity:1;transform:none}}
@keyframes hxlS2{0%,30%{opacity:0;transform:translate3d(0,8px,0)}33.3%,63%{opacity:1;transform:none}66.6%,100%{opacity:0;transform:translate3d(0,8px,0)}}
@keyframes hxlS3{0%,63%{opacity:0;transform:translate3d(0,8px,0)}66.6%,96%{opacity:1;transform:none}100%{opacity:0;transform:translate3d(0,8px,0)}}
@keyframes hxlGrow{0%{transform:scaleX(0)}8%,100%{transform:scaleX(1)}}
@keyframes hxlGrow3{0%,66.6%{transform:scaleX(0)}74%,100%{transform:scaleX(1)}}
@keyframes hxlRow{0%{opacity:0;transform:translate3d(0,10px,0)}5%,100%{opacity:1;transform:none}}
@keyframes hxlMove{0%,42%{transform:translate(0,0) rotate(0)}46%{transform:translate(calc(50% + 14px),20px) rotate(2deg)}50%,100%{transform:translate(calc(100% + 28px),47px) rotate(0)}}
@keyframes hxlT1{0%,4%{opacity:0;transform:translate3d(0,12px,0) scale(.98)}8%,27%{opacity:1;transform:none}31%,100%{opacity:0;transform:translate3d(0,-8px,0) scale(.98)}}
@keyframes hxlT2{0%,44%{opacity:0;transform:translate3d(0,12px,0) scale(.98)}49%,61%{opacity:1;transform:none}64%,100%{opacity:0;transform:translate3d(0,-8px,0) scale(.98)}}
@keyframes hxlT3{0%,72%{opacity:0;transform:translate3d(0,12px,0) scale(.98)}77%,93%{opacity:1;transform:none}96%,100%{opacity:0;transform:translate3d(0,-8px,0) scale(.98)}}

@media(max-width:1350px){.hxl-toasts{left:auto;right:18px}}
@media(max-height:820px) and (min-width:761px){.hxl-copy{margin-top:30px}.hxl-lead{margin-top:14px}.hxl-product{margin-top:24px}}
@media(max-height:700px) and (min-width:761px){.hxl-product{display:none}.hxl-copy{margin:auto 0 48px}}
@media(prefers-reduced-motion:reduce){.hxl *,.hxl *:after{animation:none!important}.hxl-top,.hxl-lead,.hxl-tabs,.hxl-win,.hxl-screen.is-1,.hxl-toast:nth-child(1){opacity:1}.hxl-w>span{transform:none}.hxl-hdot{transform:none}.hxl-tabs span:nth-child(2){color:#1f1f36}}
