/* Polish layer: depth, motion and product feel on top of main.css */
:root{--violet:#8b5cf6;--cyan:#22d3ee;--ease:cubic-bezier(.2,.7,.2,1)}
@property --a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes spin{to{--a:360deg}}
@keyframes hue{to{background-position:200% 0}}
@keyframes float{50%{transform:translateY(-8px)}}
@keyframes shine{to{transform:translateX(260%) skewX(-20deg)}}
@keyframes grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}

/* surface */
body:before{content:"";position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
h1,h2{color:var(--tx)}
.light h2{color:#0a0a0a}
h1 .acc,h2 .acc{background:linear-gradient(100deg,#8fb0ff,#2e5bff 35%,#8b5cf6 65%,#22d3ee);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:hue 8s linear infinite}
.eyebrow{padding:7px 12px 7px 10px;border:1px solid rgba(123,152,255,.28);border-radius:999px;background:rgba(46,91,255,.08)}
.light .eyebrow{background:rgba(46,91,255,.06)}

/* aurora hero */
.hero:before{width:1400px;height:900px;top:-460px;background:radial-gradient(closest-side at 35% 50%,rgba(46,91,255,.55),transparent 70%),radial-gradient(closest-side at 70% 45%,rgba(139,92,246,.4),transparent 70%),radial-gradient(closest-side at 50% 70%,rgba(34,211,238,.18),transparent 70%);filter:blur(40px)}
.hero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 60% 55% at 50% 0,#000,transparent 80%);-webkit-mask-image:radial-gradient(ellipse 60% 55% at 50% 0,#000,transparent 80%);pointer-events:none}
.dots{opacity:.5}
.badge{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));box-shadow:0 1px 0 rgba(255,255,255,.1) inset,0 10px 30px -10px rgba(46,91,255,.5)}
.hero h1{filter:drop-shadow(0 8px 40px rgba(46,91,255,.25))}

/* buttons */
.btn{position:relative;overflow:hidden;box-shadow:0 1px 0 rgba(255,255,255,.08) inset}
.btn:active{transform:translateY(0) scale(.98)}
.btn-primary{background:linear-gradient(180deg,#5a82ff,#2e5bff 60%,#2448d6)}
.btn-primary:hover{background:linear-gradient(180deg,#6b8dff,#3a65ff 60%,#2a50e0)}
.btn-primary:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg)}
.btn-primary:hover:after{animation:shine .8s var(--ease)}
.btn:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--blue2);outline-offset:3px}

/* animated gradient borders */
.beam{position:relative}
.beam:after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:conic-gradient(from var(--a),transparent 0 62%,#7b98ff 80%,#c4b5fd 90%,#22d3ee 96%,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 7s linear infinite;pointer-events:none;z-index:5}
.plan.featured:after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:conic-gradient(from var(--a),transparent 0 62%,#7b98ff 80%,#c4b5fd 90%,#22d3ee 96%,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 7s linear infinite;pointer-events:none}
.auth-card,.pcard{position:relative}
.auth-card:after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:conic-gradient(from var(--a),transparent 0 70%,#7b98ff 86%,#c4b5fd 94%,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask-composite:exclude;animation:spin 9s linear infinite;pointer-events:none}

/* cards */
.card{box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 30px 60px -40px rgba(0,0,0,.8)}
.card:hover{transform:translateY(-3px);border-color:rgba(123,152,255,.35)}
.ico{background:linear-gradient(180deg,rgba(46,91,255,.28),rgba(46,91,255,.08));box-shadow:0 8px 24px -8px rgba(46,91,255,.6)}
.stats{background:linear-gradient(180deg,#121216,#0c0c0f)}
.stats b{background:linear-gradient(180deg,#fff,#a9b8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.step .n{font-size:15px}
.step:hover{border-color:rgba(123,152,255,.35);transform:translateY(-3px);transition:.3s}
.step{transition:.3s}
.plan .price b{background:linear-gradient(180deg,#fff,#a9b8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.cta{background:radial-gradient(ellipse at 50% 120%,rgba(46,91,255,.35),transparent 60%),#0b0b0f}
.site-header.scrolled{box-shadow:0 10px 40px -20px rgba(0,0,0,.8)}
.menu a{position:relative}
.menu a:hover{background:rgba(255,255,255,.07)}

/* hero product mock */
.stage:before{display:none}
.app{background:linear-gradient(180deg,#15151b,#0c0c10);border:1px solid var(--line2);border-radius:24px;box-shadow:0 80px 140px -40px rgba(46,91,255,.45),0 0 0 1px rgba(0,0,0,.4);animation:float 9s ease-in-out infinite}
.app-body{padding:26px;display:grid;gap:22px;text-align:left}
.app-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.app-kpis>div{padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.025)}
.app-kpis span{display:block;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.app-kpis b{display:block;font-size:clamp(26px,3.4vw,38px);font-weight:800;letter-spacing:-.04em;margin:8px 0 4px;font-variant-numeric:tabular-nums}
.app-kpis em{font:normal 12px var(--mono);color:#35e08a}
.app-main{display:grid;grid-template-columns:1.5fr 1fr;gap:14px}
.app-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.app-list li{display:grid;grid-template-columns:auto 1fr auto auto;gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02);transition:border-color .5s,background .5s}
.app-list li.on{border-color:rgba(53,224,138,.35);background:rgba(53,224,138,.04)}
.ai{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#1b1b22;border:1px solid var(--line2)}
.ai svg{width:18px;height:18px;stroke:var(--blue2);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.app-list h4{font-size:14.5px;letter-spacing:-.01em;margin:0}.app-list p{font-size:12.5px;color:var(--mut);margin-top:2px}
.sv{font:500 12px var(--mono);color:#c9cad3;white-space:nowrap}
.tg{width:38px;height:22px;border-radius:999px;background:#2a2a32;position:relative;transition:background .4s}
.tg:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .4s var(--ease)}
.on .tg{background:#35e08a}.on .tg:after{transform:translateX(16px)}
.app-chart{padding:18px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02);display:flex;flex-direction:column}
.app-chart span{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.spark{flex:1;display:flex;align-items:flex-end;gap:6px;margin-top:14px;min-height:120px}
.spark i{flex:1;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,#7b98ff,#2e5bff);transform-origin:bottom;animation:grow 1s var(--ease) both;opacity:.9}
.spark i:nth-child(1){height:22%;animation-delay:.1s}.spark i:nth-child(2){height:30%;animation-delay:.18s}.spark i:nth-child(3){height:28%;animation-delay:.26s}.spark i:nth-child(4){height:41%;animation-delay:.34s}.spark i:nth-child(5){height:46%;animation-delay:.42s}.spark i:nth-child(6){height:55%;animation-delay:.5s}.spark i:nth-child(7){height:63%;animation-delay:.58s}.spark i:nth-child(8){height:72%;animation-delay:.66s}.spark i:nth-child(9){height:84%;animation-delay:.74s}.spark i:nth-child(10){height:100%;animation-delay:.82s;background:linear-gradient(180deg,#a9b8ff,#8b5cf6);box-shadow:0 0 24px -2px rgba(139,92,246,.8)}
.toast{position:absolute;right:26px;bottom:74px;display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:12px;background:rgba(20,20,26,.92);backdrop-filter:blur(10px);border:1px solid rgba(53,224,138,.4);font-size:13px;font-weight:500;box-shadow:0 20px 50px -10px rgba(0,0,0,.8);opacity:0;pointer-events:none;z-index:6}
.toast.show{animation:pop .5s var(--ease) forwards}
.stage{max-width:1080px}

/* portal */
.stepper{counter-reset:none;align-items:center;gap:0;overflow:visible;margin-bottom:40px}
.stepper li{border:0;padding:0;min-width:0;flex:none;background:none!important}
.stepper li:not(:last-child){flex:1}
.stepper li:not(:last-child):after{content:"";flex:1;height:2px;margin:0 14px;border-radius:2px;background:var(--line2)}
.stepper li.done:not(:last-child):after{background:linear-gradient(90deg,#35e08a,#35e08a)}
.stepper li.now:not(:last-child):after{background:linear-gradient(90deg,var(--blue),var(--line2) 70%)}
.stepper .now i{box-shadow:0 0 0 5px rgba(46,91,255,.25),0 0 24px rgba(46,91,255,.7)}
.stepper li span{white-space:nowrap}
.pcard{box-shadow:0 60px 120px -60px rgba(46,91,255,.35)}
.pcard>.eyebrow{margin-bottom:6px}
.pform input[type=text],.pform input[type=email],.pform input[type=password],.pform select,.pform textarea{box-shadow:0 1px 2px rgba(0,0,0,.4) inset}
.pform input:hover,.pform select:hover,.pform textarea:hover{border-color:rgba(255,255,255,.28)}
.drop.over{border-color:var(--blue);background:rgba(46,91,255,.12);transform:scale(1.01)}
.drop{background:radial-gradient(ellipse at 50% 0,rgba(46,91,255,.1),transparent 70%)}
.picked{margin:0;font:500 13px var(--mono);color:var(--blue2)}
.find{background:rgba(255,255,255,.02)}
.find:has(input:checked){border-color:rgba(123,152,255,.55);background:linear-gradient(100deg,rgba(46,91,255,.14),rgba(255,255,255,.02))}
.find:has(input:not(:checked)){opacity:.55}
.sumbar{position:sticky;bottom:16px;z-index:10;display:flex;align-items:center;gap:26px;flex-wrap:wrap;padding:16px 20px;margin-top:8px;border-radius:20px;border:1px solid var(--line2);background:rgba(16,16,20,.82);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);box-shadow:0 20px 60px -20px rgba(0,0,0,.9)}
.sum b{display:block;font-size:24px;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.sum span{font-size:12px;color:var(--mut)}
.sumbar .btn{margin-left:auto}
.kpis b{font-variant-numeric:tabular-nums;background:linear-gradient(180deg,#fff,#a9b8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.kpis div{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01))}
.live-dot{animation:pulse 2s infinite}
.checks li{transition:.4s}
.checks li.ok{animation:pop .5s var(--ease)}

/* signup niceties */
.pw{position:relative}
.pw button{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:0;border:0;color:var(--mut);font:500 12px var(--mono);cursor:pointer;padding:6px 8px;border-radius:8px}
.pw button:hover{color:var(--tx);background:rgba(255,255,255,.06)}
.meter{display:flex;gap:4px;margin-top:8px}
.meter i{flex:1;height:3px;border-radius:2px;background:#26262d;transition:background .3s}
.meter[data-s="1"] i:nth-child(-n+1){background:#ff5d6c}.meter[data-s="2"] i:nth-child(-n+2){background:#ffb454}.meter[data-s="3"] i:nth-child(-n+3){background:#7bd88f}.meter[data-s="4"] i{background:#35e08a}
.trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;padding-top:18px;border-top:1px solid var(--line);font-size:12.5px;color:var(--mut)}
.trust span:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#35e08a;margin-right:8px;vertical-align:middle}

@media(max-width:960px){.app-kpis,.app-main{grid-template-columns:1fr}.app-list li{grid-template-columns:auto 1fr auto}.sv{display:none}.toast{display:none}.stepper li span{display:none}.stepper li.now span{display:inline}}
@media(prefers-reduced-motion:reduce){.app,.beam:after,.auth-card:after,.plan.featured:after{animation:none}.spark i{animation:none}}

/* automations dashboard */
.sub{font-size:20px;margin:40px 0 14px;display:flex;align-items:center;gap:12px}.sub .mono{font-size:12px;color:var(--mut);font-weight:400}
.count{font:600 12px var(--mono);background:var(--blue);color:#fff;border-radius:999px;padding:3px 9px}
.autos{display:grid;gap:12px}
.auto{padding:20px 22px;border:1px solid var(--line2);border-radius:18px;background:rgba(255,255,255,.02)}
.auto-top{display:flex;align-items:center;gap:14px}.auto-top>div{flex:1}.auto-top h4{margin:0;font-size:17px}.auto-top .mono{font-size:12px;color:var(--mut);margin:2px 0 0}.auto-top form{margin:0}
.auto-msg{margin-top:12px;color:#d6d6de;font-size:14.5px}.auto-meta{margin-top:6px;font-size:12.5px;color:var(--mut)}
.live-dot.warn{background:#ffb454;animation:none}.live-dot.bad{background:#ff5d6c;animation:none}
.drafts{display:grid;gap:10px}
.draft{border:1px solid var(--line2);border-radius:14px;padding:0;background:rgba(255,255,255,.02)}
.draft summary{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:14px 16px;font-size:14px;font-weight:500;letter-spacing:0}
.draft summary:after{display:none}.dsel{display:flex!important;gap:10px;align-items:center;flex-wrap:wrap}.dsel .mono{color:var(--mut);font-size:12px}.draft em{font-style:normal;color:var(--mut);font-size:13px;white-space:nowrap}
.draft pre,.report{margin:0;padding:16px;white-space:pre-wrap;font:13.5px/1.6 var(--mono);color:#c9cad3;border-top:1px solid var(--line)}
.report{border:1px solid var(--line2);border-radius:14px;background:rgba(255,255,255,.02)}
.row{display:flex;gap:10px;flex-wrap:wrap}
.feed{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.feed li{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;padding:12px 16px;border:1px solid var(--line);border-radius:12px;font-size:14px;color:#c9cad3}.feed b{color:var(--tx)}.feed time{margin-left:auto;font-size:12px;color:var(--mut)}
.feed li.error{border-color:rgba(255,93,108,.4)}.feed li.warn{border-color:rgba(255,180,84,.4)}
.acct{margin-top:32px;border:1px solid var(--line);border-radius:20px;padding:20px 24px}
.acct summary{font-size:16px;font-weight:600}.acct summary:after{font-size:22px}
.acct p{margin:14px 0;color:var(--mut);font-size:14px}.acct form{margin:12px 0}
.btn-danger{background:#b3202f;border-color:#b3202f;color:#fff}.btn-danger:hover{background:#d12a3b;border-color:#d12a3b}
.danger{padding-top:18px;border-top:1px solid var(--line)}
.dedit{display:grid;gap:12px;padding:16px;border-top:1px solid var(--line)}
.dedit label{display:grid;gap:6px;font-size:13px;color:#c9cad3}
.dedit input,.dedit textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--line2);background:rgba(10,10,10,.7);color:var(--tx);font:inherit}
.dedit textarea{font:13.5px/1.55 var(--mono);resize:vertical}
.mapper{margin:28px 0;padding:22px;border:1px solid var(--line2);border-radius:20px;background:rgba(255,255,255,.02)}
.mapper-head h3{margin-bottom:6px}.mapper-head p{color:var(--mut);font-size:14px}
.mapgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mapper label{display:grid;gap:6px;font-size:13px;color:#c9cad3}
.mapper select{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--line2);background:rgba(10,10,10,.7);color:var(--tx);font:inherit}
.mapper fieldset{border:0;margin:18px 0;padding:0}.mapper legend{font-weight:600;margin-bottom:10px}
.sent{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sent li{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:12px 16px;border:1px solid var(--line);border-radius:12px}
.sent b{display:block}.sent .mono{color:var(--mut);font-size:12px}.sent time{color:var(--mut);font-size:12px;white-space:nowrap}
.skip{margin-top:14px}.skip .link{font-size:14px}
.actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.ribbon{margin:0 0 22px;padding:12px 16px;border-radius:14px;border:1px solid rgba(255,180,84,.4);background:rgba(255,180,84,.1);color:#ffd08a;font-size:13.5px;font-weight:500}
.notice.dismiss{position:relative;padding-right:44px}
.notice.dismiss .x{position:absolute;right:12px;top:12px;background:0;border:0;color:inherit;font-size:18px;line-height:1;cursor:pointer;opacity:.7}
.notice.dismiss .x:hover{opacity:1}
.btn.busy{pointer-events:none;opacity:.7}
.plan-opt small{display:block}
.plan-pick{margin-bottom:96px}
@media(max-width:860px){
.portal{padding:100px 0 70px}
.portal-head h1{font-size:34px}
.kpis,.mapgrid,.plan-pick,.two{grid-template-columns:1fr}
.find{grid-template-columns:auto 1fr;gap:12px}
.fnum{text-align:left}
.sumbar{flex-direction:column;align-items:stretch;position:sticky;bottom:8px;gap:12px}
.sumbar .btn{margin-left:0;width:100%}
.auto-top,.billbar,.connect-head,.sample{flex-direction:column;align-items:stretch}
.draft summary{flex-direction:column;align-items:flex-start}
.sent li{flex-direction:column}
.stepper{gap:0}
}
.sample{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin:20px 0;padding:18px 22px;border:1px dashed rgba(123,152,255,.45);border-radius:18px;background:rgba(46,91,255,.05)}
.sample b{display:block}.sample span{color:var(--mut);font-size:14px}