/* Generated by site/build.py from extra/kxp.css: same layout and motion, light theme, silver body. */
/* ===== kxp: 3D phone lead flow ===== */
.kxh-cw.kxp-wrap{max-width:560px;animation:kxpIn 1s cubic-bezier(.16,1,.3,1) .15s both}
.kxh-cw.kxp-wrap::before{display:none}
.kxp{--g:#315bff;--c:#4f74ff;position:relative;display:flex;flex-direction:column;align-items:center;container-type:inline-size;color:#151c28;font-family:Inter,sans-serif;text-align:left}
.kxp *{box-sizing:border-box;margin:0;letter-spacing:normal}
.kxp i,.kxp em{font-style:normal}
.kxp svg{display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.kxp.paused *,.kxp.paused *::before,.kxp.paused *::after{animation-play-state:paused!important}
.kxp-stage{position:relative;display:grid;place-items:center;width:100%;height:490px;perspective:1400px;perspective-origin:50% 38%}
.kxp-halo{position:absolute;left:50%;top:48%;width:440px;height:440px;margin:-220px 0 0 -220px;border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,rgba(49,91,255,0.16),rgba(143,182,255,0.05) 55%,transparent 72%)}
.kxp-shadow{position:absolute;left:50%;bottom:10px;width:240px;height:30px;margin-left:-120px;border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,rgba(255,255,255,0.85),transparent);filter:blur(6px)}
.kxp-sc,.kxp-float,.kxp-dev{position:relative;transform-style:preserve-3d}
.kxp-sc{transform:scale(var(--ps,1))}
.kxp-float{animation:kxpSway 9s ease-in-out infinite alternate}
.kxp-dev{width:216px;height:440px;transform:rotateX(7deg) rotateY(-20deg) rotateZ(1deg)}
.kxp-l{position:absolute;inset:0;border-radius:44px;background:linear-gradient(90deg,#e5e8ed 0%,#edeff3 30%,#e2e5eb 70%,#b8bfce 95%,#e0e3e9 100%)}
.kxp-back{position:absolute;inset:0;border-radius:44px;transform:translateZ(-5.6px) rotateY(180deg);backface-visibility:hidden;background:linear-gradient(135deg,#e0e4ea,#f0f1f4)}
.kxp-key{position:absolute;width:10px;border-radius:2px;background:linear-gradient(180deg,#adb5c6,#d2d6e0)}
.kxp-key--p{right:-1px;top:128px;height:64px;transform:translateX(4px) rotateY(90deg)}
.kxp-key--v1{left:-1px;top:104px;height:40px;transform:translateX(-4px) rotateY(90deg)}
.kxp-key--v2{left:-1px;top:152px;height:40px;transform:translateX(-4px) rotateY(90deg)}
.kxp-front{position:absolute;inset:0;padding:8px;border-radius:44px;transform:translateZ(5.6px);backface-visibility:hidden;background:#fdfdfd;
 box-shadow:inset 0 0 0 1.5px rgba(11,14,20,0.17),inset 0 0 0 4px rgba(16,24,40,0.35)}
.kxp-island{position:absolute;left:50%;top:15px;z-index:6;width:66px;height:19px;margin-left:-33px;border-radius:12px;background:#ffffff;box-shadow:inset 0 0 0 1px rgba(11,14,20,0.05)}
.kxp-screen{position:relative;height:100%;overflow:hidden;border-radius:36px;background:#f6f7f9}
.kxp-sbar{position:absolute;left:0;right:0;top:0;z-index:5;display:flex;align-items:center;height:38px;padding:4px 22px 0 26px}
.kxp-sbar b{font:600 11.5px/1 Inter,sans-serif;color:#0b0e14;margin-right:auto}
.kxp-sig{display:flex;align-items:flex-end;gap:1.5px;height:9px;margin-right:6px}.kxp-sig i{width:2.5px;border-radius:1px;background:#0b0e14}
.kxp-sig i:nth-child(1){height:3px}.kxp-sig i:nth-child(2){height:5px}.kxp-sig i:nth-child(3){height:7px}.kxp-sig i:nth-child(4){height:9px}
.kxp-bat{position:relative;width:20px;height:10px;padding:1.5px;border-radius:3px;border:1px solid rgba(11,14,20,0.6)}.kxp-bat i{display:block;width:70%;height:100%;border-radius:1px;background:#0b0e14}
.kxp-glare{position:absolute;inset:8px;z-index:7;border-radius:36px;pointer-events:none;background:linear-gradient(118deg,rgba(11,14,20,0) 34%,rgba(11,14,20,0.08) 45%,rgba(11,14,20,0) 56%);background-size:260% 100%;animation:kxpGlare 9s ease-in-out infinite alternate}
.kxp-scr{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility 0s linear .35s}
.kxp-scr.on{opacity:1;visibility:visible;transition:opacity .35s ease}
.kxp-pop{position:absolute;z-index:8;opacity:0;pointer-events:none}
/* caption + rail */
.kxp-cap{display:flex;flex-direction:column;align-items:center;gap:6px;max-width:420px;min-height:92px;margin-top:6px;text-align:center}
.kxp-cn{font:600 10.5px/1 Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#2449e0}
.kxp-cap b{font:600 19px/1.2 "Space Grotesk",Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.kxp-cap p{font-size:13.5px;line-height:1.5;color:rgba(21,28,40,0.6)}
.kxp-cap.sw>*{animation:kxpIn .5s cubic-bezier(.16,1,.3,1) both}.kxp-cap.sw>b{animation-delay:.05s}.kxp-cap.sw>p{animation-delay:.1s}
.kxp-rail{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;width:min(100%,470px);margin:16px 0 0;padding:4px;list-style:none;border-radius:16px;background:rgba(11,14,20,0.03);border:1px solid rgba(11,14,20,0.07)}
.kxp-rail button{all:unset;box-sizing:border-box;position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;padding:9px 2px 11px;overflow:hidden;border-radius:12px;cursor:pointer;
 font:500 10.5px/1 Inter,sans-serif;color:rgba(21,28,40,0.5);transition:color .35s,background .35s}
.kxp-rail button:focus-visible{outline:2px solid var(--g);outline-offset:-2px}
.kxp-rail button.on{color:#0b0e14;background:rgba(49,91,255,0.09)}
.kxp-rail button.done{color:rgba(36,73,224,0.8)}
.kxp-rail button.soon{opacity:.35;cursor:default}
.kxp-ri{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:rgba(11,14,20,0.04);border:1px solid rgba(11,14,20,0.08);transition:all .35s}
.kxp-ri svg{width:13px;height:13px}
.kxp-rail .on .kxp-ri{color:#ffffff;background:linear-gradient(180deg,#4f74ff,#2449e0);border-color:var(--g)}
.kxp-rl{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.kxp-rb{position:absolute;left:10px;right:10px;bottom:4px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--g),var(--c));transform:scaleX(0);transform-origin:left}
.kxp.run .kxp-rail .on .kxp-rb{animation:kxpFill var(--d,6s) linear both}
.kxp-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* ---------- step 1: visit screen ---------- */
.kxv-g,.kxv-site{position:absolute;inset:0;padding:46px 14px 14px}
.kxv-g{opacity:0;transform:translateX(-30%)}
.kxv-bar{display:flex;align-items:center;gap:8px;height:38px;padding:0 14px;border-radius:19px;background:#eceef1;border:1px solid rgba(11,14,20,0.09);font-size:12.5px;color:#0b0e14}
.kxv-bar svg{flex:none;width:14px;height:14px;color:rgba(21,28,40,0.55)}
.kxv-q{position:relative;white-space:nowrap}
.kxv-q::after{content:"";position:absolute;top:-3px;bottom:-3px;left:-1px;right:-3px;background:#eceef1;transform:scaleX(0);transform-origin:right}
.kxv-tabs{display:flex;gap:14px;margin:12px 6px 10px;font-size:10.5px;color:rgba(21,28,40,0.5)}
.kxv-tabs .on{position:relative;color:#0b0e14}.kxv-tabs .on::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:#0b0e14}
.kxv-ad{position:relative;padding:11px 12px 12px;border-radius:14px;background:rgba(11,14,20,0.04);border:1px solid rgba(11,14,20,0.08)}
.kxv-sp b{font:700 9.5px/1 Inter,sans-serif;color:#0b0e14}
.kxv-dom{display:flex;align-items:center;gap:6px;margin:6px 0 5px;font-size:10px;color:rgba(21,28,40,0.7)}
.kxv-dom i{width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#dce5ff,#8fb6ff)}
.kxv-at{font:500 13.5px/1.3 Inter,sans-serif;color:#0d5ddd}
.kxv-ad p{margin-top:4px;font-size:10.5px;line-height:1.4;color:rgba(21,28,40,0.62)}
.kxv-sl{display:flex;gap:5px;margin-top:8px}
.kxv-sl span{padding:5px 9px;border-radius:999px;font-size:9.5px;color:#0d5ddd;border:1px solid rgba(138,180,248,0.3)}
.kxv-org{display:flex;flex-direction:column;gap:5px;margin-top:12px;padding:0 4px}
.kxv-org i{display:block;height:6px;width:92%;border-radius:3px;background:rgba(11,14,20,0.08)}
.kxv-org i.d{width:40%;height:5px}.kxv-org i.t{width:78%;height:9px;background:rgba(138,180,248,0.28)}.kxv-org i.s{width:60%}
.kxv-tap{position:absolute;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:rgba(11,14,20,0.55);box-shadow:0 0 0 6px rgba(11,14,20,0.15);opacity:0;pointer-events:none}
.kxv-tap1{left:40%;top:56%}
.kxv-url{display:flex;align-items:center;justify-content:center;gap:5px;height:28px;margin:0 22px 12px;border-radius:14px;background:#eceef1;font-size:10.5px;color:rgba(21,28,40,0.78)}
.kxv-url svg{width:10px;height:10px;color:var(--g);stroke-width:2.6}
.kxv-pg{transform:translateY(-62px)}
.kxv-hero{display:flex;flex-direction:column;justify-content:flex-end;height:158px;padding:14px;border-radius:18px;
 background:radial-gradient(80% 70% at 28% 25%,rgba(49,91,255,0.45),transparent 60%),radial-gradient(70% 70% at 88% 80%,rgba(143,182,255,0.4),transparent 60%),linear-gradient(160deg,#e7e9ee,#f3f5f7)}
.kxv-hero small{font:600 8px/1 Inter,sans-serif;letter-spacing:.16em;color:rgba(11,14,20,0.7)}
.kxv-hero b{margin-top:6px;font:600 19px/1.08 "Space Grotesk",Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.kxv-price{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 2px 6px;font-size:11px;color:rgba(21,28,40,0.75)}
.kxv-price b{font:600 16px/1 "Space Grotesk",Inter,sans-serif;color:var(--g)}
.kxv-price em{padding:4px 8px;border-radius:999px;font-size:9px;font-weight:600;color:#2449e0;background:rgba(49,91,255,0.1);border:1px solid rgba(49,91,255,0.3)}
.kxv-rate{margin:0 2px 12px;font-size:10px;color:rgba(21,28,40,0.6)}.kxv-rate em{margin-right:4px;letter-spacing:1px;color:#dfa60c}
.kxv-ctaw{position:relative}
.kxv-cta{position:relative;display:block;height:42px;border-radius:13px;text-align:center;font:600 13px/42px Inter,sans-serif;color:#ffffff;background:var(--g);box-shadow:0 12px 24px -12px rgba(49,91,255,0.9)}
.kxv-cta::after{content:"";position:absolute;inset:-3px;border-radius:15px;border:2px solid rgba(49,91,255,0.85);opacity:0}
.kxv-tap2{left:62%;top:50%}
.kxv-feat{display:flex;flex-direction:column;gap:9px;margin:14px 2px 0}
.kxv-feat div{display:flex;align-items:center;gap:8px;font-size:11px;color:rgba(21,28,40,0.8)}
.kxv-feat svg{flex:none;width:14px;height:14px;padding:2px;border-radius:50%;color:#ffffff;background:var(--g);stroke-width:3.4}
/* pops (overlay layer, always in front of the phone) */
.kxp-sc{z-index:2}
.kxp-pops{position:absolute;inset:0;z-index:6;pointer-events:none}
.kxp-pop{position:absolute;opacity:0;pointer-events:none}
.kxp-pop--v0{right:calc(50% + 96px);top:24%;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 11px;border-radius:14px;
 transform:perspective(700px) rotateY(14deg);background:rgba(242,243,246,0.96);border:1px solid rgba(138,180,248,0.45);box-shadow:0 24px 40px -18px rgba(16,24,40,0.332),0 0 0 5px rgba(138,180,248,0.05)}
.kxp-pop--v0::before{content:"";position:absolute;left:100%;top:50%;width:30px;height:1px;background:linear-gradient(90deg,rgba(138,180,248,0.7),rgba(138,180,248,0.15))}
.kxp-gdot{display:grid;grid-template-columns:1fr 1fr;gap:2px;flex:none;width:18px;height:18px}.kxp-gdot i{border-radius:50%}
.kxp-gdot i:nth-child(1){background:#4285f4}.kxp-gdot i:nth-child(2){background:#ea4335}.kxp-gdot i:nth-child(3){background:#fbbc05}.kxp-gdot i:nth-child(4){background:#34a853}
.kxp-pop--v0 b{display:block;white-space:nowrap;font-size:11.5px;color:#0b0e14}.kxp-pop--v0 small{display:block;margin-top:2px;white-space:nowrap;font-size:9.5px;color:rgba(21,28,40,0.6)}
.kxp-pop--v1{left:calc(50% + 84px);top:27%;width:196px;padding:12px 14px 9px;border-radius:15px;transform:perspective(800px) rotateY(-14deg);
 background:rgba(245,246,248,0.97);border:1px solid rgba(49,91,255,0.5);box-shadow:0 28px 44px -18px rgba(16,24,40,0.332),0 0 0 5px rgba(49,91,255,0.06)}
.kxp-pop--v1::before{content:"";position:absolute;right:100%;top:22px;width:42px;height:1px;background:linear-gradient(270deg,rgba(49,91,255,0.8),rgba(49,91,255,0.15));transform-origin:right}
.kxp-pop--v1::after{content:"";position:absolute;right:calc(100% + 38px);top:19px;width:7px;height:7px;border-radius:50%;background:#315bff;box-shadow:0 0 10px #315bff}
.kxp[data-cur="0"] .kxp-pop--v1{opacity:1}
.kxp-pt{display:flex;align-items:center;gap:6px;margin-bottom:8px;font:600 11px/1 Inter,sans-serif;color:#2449e0}
.kxp-pt svg{width:12px;height:12px;color:var(--g);stroke-width:3.2}
.kxp-kv{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:5px 0;border-top:1px solid rgba(11,14,20,0.06)}
.kxp-kv em{flex:none;font-size:7.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(21,28,40,0.42)}
.kxp-kv b{white-space:nowrap;font:500 10px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#0b0e14}
.kxp-kv b.blue{color:#0072eb}
@keyframes kxpFlash2{0%{opacity:0;transform:perspective(700px) rotateY(14deg) translateX(-16px) scale(.94)}16%{opacity:1;transform:perspective(700px) rotateY(14deg)}84%{opacity:1;transform:perspective(700px) rotateY(14deg)}100%{opacity:0;transform:perspective(700px) rotateY(14deg) translateX(24px) scale(.94)}}
@keyframes kxpPop2{from{opacity:0;transform:perspective(800px) rotateY(-14deg) translateX(-18px) scale(.94)}}
@keyframes kxpTether{from{transform:scaleX(0)}}
@keyframes kxpDot{from{opacity:0;transform:scale(.3)}}
@container (max-width:520px){.kxp-stage{height:430px}.kxp-sc{--ps:.84}.kxp-pop--v1{left:calc(50% + 46px);width:176px}.kxp-pop--v0{right:calc(50% + 60px)}}
@container (max-width:400px){.kxp-stage{height:400px}.kxp-sc{--ps:.76}.kxp-pop--v1{left:auto;right:0;top:auto;bottom:46px;width:170px}.kxp-pop--v1::before,.kxp-pop--v1::after{display:none}
 .kxp-pop--v0{right:auto;left:0;top:14%}.kxp-pop--v0::before{display:none}.kxp-rl{font-size:9.5px}}
/* visit timeline (7.4s) */
.kxp.run .kxp-scr[data-step="0"].on .kxv-g{animation:kxpOutL .5s cubic-bezier(.4,0,.2,1) 2.95s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-bar{animation:kxpIn .4s ease .2s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-q::after{animation:kxpType .9s steps(15) .5s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-tabs{animation:kxpIn .35s ease 1.45s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-ad{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 1.55s both,kxpPress .35s ease 2.65s}
.kxp.run .kxp-scr[data-step="0"].on .kxv-org{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 1.7s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-org+.kxv-org{animation-delay:1.85s}
.kxp.run .kxp-scr[data-step="0"].on .kxv-tap1{animation:kxpTap .9s cubic-bezier(.3,.7,.3,1) 2.2s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-site{animation:kxpInR .6s cubic-bezier(.16,1,.3,1) 2.95s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-url{animation:kxpIn .35s ease 3.2s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-hero{animation:kxpUp .55s cubic-bezier(.16,1,.3,1) 3.3s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-price{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 3.45s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-rate{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 3.55s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-cta{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 3.65s both,kxpPress .4s ease 6.05s}
.kxp.run .kxp-scr[data-step="0"].on .kxv-feat{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 3.75s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-pg{animation:kxpScroll 1s cubic-bezier(.65,0,.35,1) 4.7s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-tap2{animation:kxpTap .95s cubic-bezier(.3,.7,.3,1) 5.6s both}
.kxp.run .kxp-scr[data-step="0"].on .kxv-cta::after{animation:kxpRing .7s ease-out 6.05s both}
.kxp.run[data-cur="0"] .kxp-pop--v0{animation:kxpFlash2 1.6s ease 1.55s both}
.kxp.run[data-cur="0"] .kxp-pop--v1{animation:kxpPop2 .75s cubic-bezier(.2,.9,.3,1.15) 3.75s both}
.kxp.run[data-cur="0"] .kxp-pop--v1::before{animation:kxpTether .45s cubic-bezier(.65,0,.35,1) 4.2s both}
.kxp.run[data-cur="0"] .kxp-pop--v1::after{animation:kxpDot .35s ease 4.55s both}
.kxp.run[data-cur="0"] .kxp-pop--v1 .kxp-kv{animation:kxpSlide .35s cubic-bezier(.2,.8,.2,1) 4s both}
.kxp.run[data-cur="0"] .kxp-pop--v1 .kxp-kv:nth-of-type(2){animation-delay:4.15s}.kxp.run[data-cur="0"] .kxp-pop--v1 .kxp-kv:nth-of-type(3){animation-delay:4.3s}
.kxp.run[data-cur="0"] .kxp-pop--v1 .kxp-kv:nth-of-type(4){animation-delay:4.45s}.kxp.run[data-cur="0"] .kxp-pop--v1 .kxp-kv:nth-of-type(5){animation-delay:4.6s}
/* keyframes */
@keyframes kxpSway{from{transform:rotateY(-7deg) rotateX(1deg) translateY(3px)}to{transform:rotateY(6deg) rotateX(-1.5deg) translateY(-4px)}}
@keyframes kxpGlare{from{background-position:100% 0}to{background-position:0 0}}
@keyframes kxpIn{from{opacity:0;transform:translateY(8px)}}
@keyframes kxpUp{from{opacity:0;transform:translateY(14px)}}
@keyframes kxpSlide{from{opacity:0;transform:translateX(10px)}}
@keyframes kxpType{from{transform:scaleX(1)}}
@keyframes kxpPress{45%{transform:scale(.95)}}
@keyframes kxpTap{0%{opacity:0;transform:translate(40px,40px) scale(1.3)}35%{opacity:1;transform:none}50%{transform:scale(.75)}65%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.6)}}
@keyframes kxpOutL{from{opacity:1;transform:none}}
@keyframes kxpInR{from{opacity:.6;transform:translateX(100%)}}
@keyframes kxpScroll{from{transform:none}}
@keyframes kxpRing{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.18)}}
@keyframes kxpFlash{0%{opacity:0;transform:translateZ(10px) scale(.9)}18%{opacity:1;transform:translateZ(60px)}82%{opacity:1;transform:translateZ(60px)}100%{opacity:0;transform:translateZ(90px) translateX(40px) scale(.9)}}
@keyframes kxpPop{from{opacity:0;transform:translateZ(0) scale(.88)}}
@keyframes kxpFill{to{transform:none}}
/* responsive */
@media (prefers-reduced-motion:reduce){.kxp *,.kxp *::before,.kxp *::after{animation:none!important}.kxp[data-cur="0"] .kxp-pop--v1{opacity:1}}

/* ===== v2: bigger phone + form ===== */
.kxp-stage{height:590px}
.kxp-halo{width:520px;height:520px;margin:-260px 0 0 -260px}
.kxp-shadow{width:280px;height:34px;margin-left:-140px;bottom:14px}
.kxp-dev{width:250px;height:510px}
.kxp-l,.kxp-back{border-radius:50px}
.kxp-front{padding:9px;border-radius:50px}
.kxp-screen{border-radius:42px}
.kxp-glare{inset:9px;border-radius:42px}
.kxp-island{top:17px;width:74px;height:21px;margin-left:-37px}
.kxp-sbar{height:44px;padding:6px 26px 0 30px}
.kxp-key--p{top:150px;height:74px}.kxp-key--v1{top:120px;height:46px}.kxp-key--v2{top:176px;height:46px}
.kxv-g,.kxv-site{padding-top:52px}
.kxp-pop{transition:opacity .35s ease}
.kxp-pop--v1{left:calc(50% + 104px)}.kxp-pop--v0{right:calc(50% + 116px)}
/* form screen */
.kxf-bg{position:absolute;inset:0;padding:52px 16px 16px;display:flex;flex-direction:column;gap:10px}
.kxf-bg i{display:block;border-radius:10px;background:rgba(11,14,20,0.07)}
.kxf-bg .u{height:28px;margin:0 26px;border-radius:14px}.kxf-bg .h{height:170px;border-radius:18px;background:linear-gradient(160deg,#e7e9ee,#f3f5f7)}
.kxf-bg .l{height:9px;width:80%}.kxf-bg .l.s{width:55%}.kxf-bg .b{height:44px;border-radius:13px;background:rgba(49,91,255,0.5)}
.kxf-dim{position:absolute;inset:0;background:rgba(255,255,255,0.55)}
.kxf-sheet{position:absolute;left:0;right:0;top:78px;bottom:0;padding:10px 16px 18px;border-radius:26px 26px 0 0;background:#f1f2f5;border-top:1px solid rgba(11,14,20,0.1);box-shadow:0 -24px 40px -20px rgba(16,24,40,0.35)}
.kxf-grab{width:38px;height:4px;margin:0 auto 14px;border-radius:2px;background:rgba(11,14,20,0.25)}
.kxf-body,.kxf-done{position:absolute;left:16px;right:16px;top:28px;bottom:18px}
.kxf-body{display:flex;flex-direction:column;opacity:0}
.kxf-h b{display:block;font:600 18px/1.15 "Space Grotesk",Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.kxf-h small{display:block;margin-top:4px;font-size:11px;color:rgba(21,28,40,0.5)}
.kxf-form{display:flex;flex-direction:column;gap:11px;margin-top:16px}
.kxf-f>span{display:block;margin:0 0 5px 2px;font-size:10.5px;color:rgba(21,28,40,0.55)}
.kxf-in{position:relative;display:flex;align-items:center;height:40px;padding:0 13px;border-radius:12px;background:#f7f8f9;border:1px solid rgba(11,14,20,0.1);font-size:13px;color:#0b0e14}
.kxf-v,.kxf-s{position:relative;white-space:nowrap;font-weight:500}
.kxf-v i{font-style:normal}
.kxf-v::after{content:"";position:absolute;top:-4px;bottom:-4px;left:-1px;right:-3px;background:#f7f8f9;transform:scaleX(0);transform-origin:right}
.kxf-ok,.kxf-chev{flex:none;margin-left:auto;width:16px;height:16px}
.kxf-ok{padding:2px;border-radius:50%;color:#ffffff;background:var(--g);stroke-width:3.4}
.kxf-chev{color:rgba(21,28,40,0.5)}
.kxf-seg{position:relative;display:grid;grid-template-columns:repeat(3,1fr);height:36px;padding:3px;border-radius:11px;background:#f7f8f9;border:1px solid rgba(11,14,20,0.1)}
.kxf-th{position:absolute;left:3px;top:3px;bottom:3px;width:calc((100% - 6px) / 3);border-radius:8px;background:var(--g);box-shadow:0 6px 14px -6px rgba(49,91,255,0.8);transform:translateX(100%)}
.kxf-seg em{position:relative;z-index:1;display:grid;place-items:center;font-size:11.5px;font-weight:600;color:rgba(21,28,40,0.6)}
.kxf-seg .kxf-son{color:#ffffff}
.kxf-sendw{position:relative;margin-top:auto}
.kxf-send{display:grid;height:46px;border-radius:14px;background:var(--g);box-shadow:0 14px 26px -12px rgba(49,91,255,0.9)}
.kxf-send>span{grid-area:1/1;display:grid;place-items:center}
.kxf-sl{font:600 14px/1 Inter,sans-serif;color:#ffffff}
.kxf-sp{opacity:0}
.kxf-sp::before{content:"";width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,0.25);border-top-color:#ffffff;animation:kxfSpin .7s linear infinite}
.kxf-tap{left:55%;top:50%}
.kxf-done{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.kxf-mark{width:72px;height:72px;margin-bottom:16px;overflow:visible}
.kxf-mark circle{fill:rgba(49,91,255,0.1);stroke:var(--g);stroke-width:3;stroke-dasharray:176;stroke-dashoffset:0;transform:rotate(-90deg);transform-origin:center}
.kxf-mark path{stroke:var(--g);stroke-width:4.5;stroke-dasharray:40;stroke-dashoffset:0}
.kxf-done b{font:600 20px/1.15 "Space Grotesk",Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.kxf-done small{margin-top:6px;font-size:12px;color:rgba(21,28,40,0.6)}
.kxf-sum{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:18px}
.kxf-sum span{padding:6px 10px;border-radius:999px;font-size:10.5px;font-weight:600;color:#2449e0;background:rgba(49,91,255,0.1);border:1px solid rgba(49,91,255,0.3)}
.kxp-pop--f1{left:calc(50% + 110px);top:40%;display:flex;align-items:center;gap:10px;padding:11px 15px 11px 11px;border-radius:15px;transform:perspective(800px) rotateY(-14deg);
 background:rgba(245,246,248,0.97);border:1px solid rgba(49,91,255,0.5);box-shadow:0 26px 42px -18px rgba(16,24,40,0.332),0 0 0 5px rgba(49,91,255,0.06)}
.kxf-pi{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:9px;background:var(--g)}
.kxf-pi svg{width:15px;height:15px;color:#ffffff;stroke-width:3.2}
.kxp-pop--f1 b{display:block;white-space:nowrap;font-size:12px;color:#0b0e14}.kxp-pop--f1 small{display:block;margin-top:3px;white-space:nowrap;font-size:10px;color:rgba(21,28,40,0.6)}
.kxp[data-cur="1"] .kxp-pop--f1{opacity:1}
/* form timeline (7.8s) */
.kxp.run .kxp-scr[data-step="1"].on .kxf-dim{animation:kxfFade .4s ease both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-sheet{animation:kxfSheet .65s cubic-bezier(.16,1,.3,1) .1s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-body{animation:kxfBodyOut .35s ease 4.55s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-f1 .kxf-in{animation:kxfFocus .9s ease .7s}
.kxp.run .kxp-scr[data-step="1"].on .kxf-f1 .kxf-v::after{animation:kxpType .6s steps(9) .8s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-f2 .kxf-in{animation:kxfFocus 1s ease 1.5s}
.kxp.run .kxp-scr[data-step="1"].on .kxf-f2 .kxf-v::after{animation:kxpType .8s steps(13) 1.6s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-ok{animation:kxfPop .35s cubic-bezier(.2,.9,.3,1.4) 2.45s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-f3 .kxf-in{animation:kxfFocus .6s ease 2.6s}
.kxp.run .kxp-scr[data-step="1"].on .kxf-s{animation:kxpIn .3s ease 2.75s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-th{animation:kxfThumb .4s cubic-bezier(.2,.9,.3,1.2) 3.1s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-son{animation:kxfSon .3s ease 3.15s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-tap{animation:kxpTap .95s cubic-bezier(.3,.7,.3,1) 3.4s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-send{animation:kxpPress .4s ease 3.85s}
.kxp.run .kxp-scr[data-step="1"].on .kxf-sl{animation:kxfOut .2s ease 3.95s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-sp{animation:kxfFade .2s ease 4s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-done{animation:kxfFade .4s ease 4.75s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-mark circle{animation:kxfDraw .6s cubic-bezier(.65,0,.35,1) 4.8s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-mark path{animation:kxfCheck .35s cubic-bezier(.65,0,.35,1) 5.3s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-done b{animation:kxpUp .45s cubic-bezier(.16,1,.3,1) 5.35s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-done small{animation:kxpUp .45s cubic-bezier(.16,1,.3,1) 5.45s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-sum span{animation:kxfPop .35s cubic-bezier(.2,.9,.3,1.3) 5.6s both}
.kxp.run .kxp-scr[data-step="1"].on .kxf-sum span:nth-child(2){animation-delay:5.7s}.kxp.run .kxp-scr[data-step="1"].on .kxf-sum span:nth-child(3){animation-delay:5.8s}
.kxp.run[data-cur="1"] .kxp-pop--f1{animation:kxpPop2 .7s cubic-bezier(.2,.9,.3,1.15) 6s both}
@keyframes kxfFade{from{opacity:0}}
@keyframes kxfSheet{from{transform:translateY(100%)}}
@keyframes kxfBodyOut{from{opacity:1}to{opacity:0;transform:translateY(-8px)}}
@keyframes kxfFocus{0%,100%{border-color:rgba(11,14,20,0.1);box-shadow:none}12%,88%{border-color:rgba(49,91,255,0.75);box-shadow:0 0 0 3px rgba(49,91,255,0.15)}}
@keyframes kxfPop{from{opacity:0;transform:scale(.4)}}
@keyframes kxfThumb{from{opacity:0;transform:translateX(100%) scale(.7)}}
@keyframes kxfSon{from{color:rgba(21,28,40,0.6)}}
@keyframes kxfOut{from{opacity:1}to{opacity:0}}
@keyframes kxfSpin{to{transform:rotate(360deg)}}
@keyframes kxfDraw{from{stroke-dashoffset:176}}
@keyframes kxfCheck{from{stroke-dashoffset:40}}
@container (max-width:520px){.kxp-stage{height:510px}.kxp-sc{--ps:.84}.kxp-pop--v1{left:calc(50% + 60px);width:176px}.kxp-pop--v0{right:calc(50% + 70px)}.kxp-pop--f1{left:calc(50% + 64px)}}
@container (max-width:400px){.kxp-stage{height:460px}.kxp-sc{--ps:.74}.kxp-pop--v1{left:auto;right:0;top:auto;bottom:40px;width:170px}.kxp-pop--v1::before,.kxp-pop--v1::after{display:none}
 .kxp-pop--v0{right:auto;left:0;top:12%}.kxp-pop--v0::before{display:none}.kxp-pop--f1{left:auto;right:0;top:auto;bottom:40px}}
@media (prefers-reduced-motion:reduce){.kxp[data-cur="1"] .kxp-pop--f1{opacity:1}}

/* ===== v4: big phone, caption + rail aligned to the bottom ===== */
.kxp .kxp-scr:not(.on){display:none!important}
.kxh-cw.kxp-wrap{max-width:600px;align-self:stretch;display:flex}
.kxp{width:100%;min-height:100%}
.kxp-stage{flex:1 0 auto;height:auto;min-height:800px}
.kxp-sc{--ps:1.475}
.kxp-halo{width:720px;height:720px;margin:-360px 0 0 -360px}
.kxp-shadow{width:390px;height:44px;margin-left:-195px;bottom:10px}
.kxp-pop--v1{left:calc(50% + 120px);top:24%}
.kxp-pop--v0{right:calc(50% + 132px);top:20%}
.kxp-cap{margin-top:4px}
.kxp-rail{margin-top:14px}
@container (max-width:560px){.kxp-stage{min-height:700px}.kxp-sc{--ps:1.26}.kxp-pop--v1{left:calc(50% + 90px);width:180px}.kxp-pop--v0{right:calc(50% + 100px)}}
@container (max-width:460px){.kxp-stage{min-height:600px}.kxp-sc{--ps:1.06}.kxp-pop--v1{left:auto;right:0;top:auto;bottom:44px;width:176px}.kxp-pop--v1::before,.kxp-pop--v1::after{display:none}
 .kxp-pop--v0{right:auto;left:0;top:10%}.kxp-pop--v0::before{display:none}}
@container (max-width:380px){.kxp-stage{min-height:520px}.kxp-sc{--ps:.9}}

/* ===== v5: visit frame ===== */
/* layout: phone + card as one centered group, nothing overlaps */
.kxp-stage{display:flex!important;align-items:center;justify-content:center;gap:6px;min-height:0!important;padding:26px 0 30px;perspective:1500px;perspective-origin:36% 45%}
.kxp-sc{flex:none;margin:calc((var(--ps,1) - 1) * 240px) calc((var(--ps,1) - 1) * 116px)}
.kxp-halo{left:calc(50% - 94px)}
.kxp-shadow{left:calc(50% - 94px);bottom:30px}
.kxp-pops{position:relative!important;inset:auto!important;flex:none;width:184px;margin-top:-170px;z-index:6;pointer-events:none}
.kvc{position:relative;width:100%;padding:13px 14px 9px;border-radius:16px;transform:perspective(800px) rotateY(-12deg);transform-origin:left center;
 background:rgba(245,246,248,0.97);border:1px solid rgba(49,91,255,0.45);box-shadow:0 30px 50px -22px rgba(16,24,40,0.35),0 0 0 5px rgba(49,91,255,0.05)}
.kvc::before{content:"";position:absolute;right:100%;top:56px;width:22px;height:1px;background:linear-gradient(270deg,rgba(49,91,255,0.85),rgba(49,91,255,0));transform-origin:right}
.kvc-hd{display:flex;align-items:center;gap:7px;margin-bottom:11px;font:600 10.5px/1 Inter,sans-serif;letter-spacing:.02em;color:#2449e0}
.kvc-hd i{width:7px;height:7px;border-radius:50%;background:var(--g);box-shadow:0 0 8px var(--g)}
.kvc-src{display:flex;align-items:center;gap:10px;padding-bottom:10px;margin-bottom:3px;border-bottom:1px solid rgba(11,14,20,0.07)}
.kvc-g{display:grid;grid-template-columns:1fr 1fr;gap:2.5px;flex:none;width:22px;height:22px;padding:3px;border-radius:7px;background:#0b0e14}
.kvc-g i{border-radius:50%}.kvc-g i:nth-child(1){background:#4285f4}.kvc-g i:nth-child(2){background:#ea4335}.kvc-g i:nth-child(3){background:#fbbc05}.kvc-g i:nth-child(4){background:#34a853}
.kvc-src b{display:block;font:600 13px/1.2 Inter,sans-serif;color:#0b0e14}.kvc-src small{display:block;margin-top:2px;font-size:10px;color:rgba(21,28,40,0.55)}
.kvc-kv{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid rgba(11,14,20,0.05)}
.kvc-kv:last-child{border-bottom:0}
.kvc-kv em{flex:none;font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:rgba(21,28,40,0.42)}
.kvc-kv b{white-space:nowrap;font:500 10.5px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#0b0e14}
/* screen A: search */
.kv2-a,.kv2-b{position:absolute;inset:0}
.kv2-a{padding:52px 12px 0;opacity:0;transform:translateX(-30%)}
.kv2-q{display:flex;align-items:center;gap:9px;height:40px;margin:0 2px;padding:0 14px;border-radius:20px;background:#eceef1;border:1px solid rgba(11,14,20,0.09);font-size:13px;color:#0b0e14}
.kv2-q svg{flex:none;width:15px;height:15px;color:rgba(21,28,40,0.55)}
.kv2-q span{position:relative;white-space:nowrap}
.kv2-q span::after{content:"";position:absolute;top:-4px;bottom:-4px;left:-1px;right:-3px;background:#eceef1;transform:scaleX(0);transform-origin:right}
.kv2-q .kv2-mic{margin-left:auto}
.kv2-tabs{display:flex;gap:16px;margin:14px 10px 12px;font-size:11px;color:rgba(21,28,40,0.5)}
.kv2-tabs .on{position:relative;color:#0b0e14}.kv2-tabs .on::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:#0b0e14}
.kv2-ad{position:relative;padding:12px 13px 13px;border-radius:15px;background:rgba(11,14,20,0.045);border:1px solid rgba(11,14,20,0.08)}
.kv2-spn{font:700 10px/1 Inter,sans-serif;color:#0b0e14}
.kv2-dom{display:flex;align-items:center;gap:7px;margin:7px 0 6px;font-size:10.5px;color:rgba(21,28,40,0.72)}
.kv2-dom i{flex:none;width:16px;height:16px;border-radius:50%;background:linear-gradient(135deg,#dce5ff,#8fb6ff)}
.kv2-at{font:500 14.5px/1.3 Inter,sans-serif;color:#0d5ddd}
.kv2-ad p{margin-top:5px;font-size:11px;line-height:1.45;color:rgba(21,28,40,0.62)}
.kv2-sl{display:flex;gap:6px;margin-top:9px}
.kv2-sl span{padding:5px 10px;border-radius:999px;font-size:10px;color:#0d5ddd;border:1px solid rgba(138,180,248,0.3)}
.kv2-org{display:flex;flex-direction:column;gap:6px;margin:16px 6px 0}
.kv2-org i{display:block;width:92%;height:6px;border-radius:3px;background:rgba(11,14,20,0.08)}
.kv2-org i.d{width:40%;height:5px}.kv2-org i.t{width:80%;height:10px;background:rgba(138,180,248,0.28)}.kv2-org i.s{width:62%}
.kv2-tap{position:absolute;z-index:3;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:rgba(11,14,20,0.55);box-shadow:0 0 0 6px rgba(11,14,20,0.15);opacity:0;pointer-events:none}
.kv2-tap1{left:42%;top:52%}
/* screen B: site */
.kv2-chrome{position:absolute;left:0;right:0;top:0;z-index:2;height:90px;padding:50px 32px 0;background:#f6f7f9;border-bottom:1px solid rgba(11,14,20,0.06)}
.kv2-url{display:flex;align-items:center;justify-content:center;gap:6px;height:30px;border-radius:15px;background:#eceef1;font-size:11px;color:rgba(21,28,40,0.8)}
.kv2-url svg{width:11px;height:11px;color:var(--g);stroke-width:2.6}
.kv2-vp{position:absolute;left:0;right:0;top:90px;bottom:0;overflow:hidden}
.kv2-pg{padding:12px 14px 30px;transform:translateY(-64px)}
.kv2-hero{display:flex;flex-direction:column;justify-content:flex-end;height:172px;padding:15px;border-radius:18px;
 background:radial-gradient(80% 70% at 28% 25%,rgba(49,91,255,0.45),transparent 60%),radial-gradient(70% 70% at 88% 80%,rgba(143,182,255,0.4),transparent 60%),linear-gradient(160deg,#e7e9ee,#f3f5f7)}
.kv2-hero small{font:600 8.5px/1 Inter,sans-serif;letter-spacing:.16em;color:rgba(11,14,20,0.72)}
.kv2-hero b{margin-top:7px;font:600 21px/1.08 "Space Grotesk",Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.kv2-price{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:13px 2px 7px;font-size:11.5px;color:rgba(21,28,40,0.75)}
.kv2-price b{font:600 17px/1 "Space Grotesk",Inter,sans-serif;color:var(--g)}
.kv2-price em{padding:4px 9px;border-radius:999px;font-size:9.5px;font-weight:600;color:#2449e0;background:rgba(49,91,255,0.1);border:1px solid rgba(49,91,255,0.3)}
.kv2-rate{margin:0 2px 13px;font-size:10.5px;color:rgba(21,28,40,0.6)}.kv2-rate em{margin-right:4px;letter-spacing:1px;color:#dfa60c}
.kv2-ctaw{position:relative}
.kv2-cta{position:relative;display:block;height:44px;border-radius:13px;text-align:center;font:600 13.5px/44px Inter,sans-serif;color:#ffffff;background:var(--g);box-shadow:0 12px 24px -12px rgba(49,91,255,0.9)}
.kv2-cta::after{content:"";position:absolute;inset:-3px;border-radius:15px;border:2px solid rgba(49,91,255,0.85);opacity:0}
.kv2-tap2{left:62%;top:50%}
.kv2-feat{display:flex;flex-direction:column;gap:10px;margin:16px 2px 0}
.kv2-feat div{display:flex;align-items:center;gap:9px;font-size:11.5px;color:rgba(21,28,40,0.82)}
.kv2-feat svg{flex:none;width:16px;height:16px;padding:2.5px;border-radius:50%;color:#ffffff;background:var(--g);stroke-width:3.4}
.kv2-home{position:absolute;left:50%;bottom:8px;z-index:4;width:92px;height:4px;margin-left:-46px;border-radius:2px;background:rgba(11,14,20,0.55)}
/* timeline (8.8s) */
.kxp.run .kxp-scr[data-step="0"].on .kv2-a{animation:kxpOutL .5s cubic-bezier(.4,0,.2,1) 3s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-q{animation:kxpIn .4s ease .15s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-q span::after{animation:kxpType .9s steps(15) .45s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-tabs{animation:kxpIn .35s ease 1.45s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-ad{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 1.55s both,kxpPress .35s ease 2.7s}
.kxp.run .kxp-scr[data-step="0"].on .kv2-org{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 1.7s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-org+.kv2-org{animation-delay:1.85s}
.kxp.run .kxp-scr[data-step="0"].on .kv2-tap1{animation:kxpTap .9s cubic-bezier(.3,.7,.3,1) 2.25s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-b{animation:kxpInR .6s cubic-bezier(.16,1,.3,1) 3s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-url{animation:kxpIn .35s ease 3.3s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-hero{animation:kxpUp .55s cubic-bezier(.16,1,.3,1) 3.4s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-price{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 3.55s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-rate{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 3.65s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-cta{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 3.75s both,kxpPress .4s ease 6.8s}
.kxp.run .kxp-scr[data-step="0"].on .kv2-feat{animation:kxpUp .5s cubic-bezier(.16,1,.3,1) 3.85s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-pg{animation:kxpScroll .95s cubic-bezier(.65,0,.35,1) 5.3s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-tap2{animation:kxpTap .95s cubic-bezier(.3,.7,.3,1) 6.35s both}
.kxp.run .kxp-scr[data-step="0"].on .kv2-cta::after{animation:kxpRing .7s ease-out 6.8s both}
.kxp.run[data-cur="0"] .kvc{animation:kvcIn .7s cubic-bezier(.2,.9,.3,1.15) 4.05s both}
.kxp.run[data-cur="0"] .kvc::before{animation:kxpTether .4s cubic-bezier(.65,0,.35,1) 4.5s both}
.kxp.run[data-cur="0"] .kvc-src{animation:kxpSlide .35s cubic-bezier(.2,.8,.2,1) 4.3s both}
.kxp.run[data-cur="0"] .kvc-kv{animation:kxpSlide .35s cubic-bezier(.2,.8,.2,1) 4.5s both}
.kxp.run[data-cur="0"] .kvc-kv:nth-of-type(2){animation-delay:4.65s}.kxp.run[data-cur="0"] .kvc-kv:nth-of-type(3){animation-delay:4.8s}.kxp.run[data-cur="0"] .kvc-kv:nth-of-type(4){animation-delay:4.95s}
.kxp.run[data-cur="0"] .kvc-hd i{animation:kvcBlink 1.4s ease-in-out 4.5s infinite}
@keyframes kvcIn{from{opacity:0;transform:perspective(800px) rotateY(-12deg) translateX(-18px) scale(.96)}}
@keyframes kvcBlink{50%{opacity:.35}}
/* narrow: no room beside the phone -> card hidden, phone centered */
@container (max-width:580px){.kxp-pops{display:none}.kxp-halo,.kxp-shadow{left:50%}.kxp-stage{perspective-origin:50% 45%}.kxp-sc{--ps:1.25}}
@container (max-width:460px){.kxp-sc{--ps:1.05}}
@container (max-width:380px){.kxp-sc{--ps:.9}}
@media (prefers-reduced-motion:reduce){.kv2-a{display:none}.kv2-pg{transform:none}}

/* ===== v5b: centered phone, card on the side ===== */
.kxp-stage{justify-content:center!important;perspective-origin:50% 45%!important}
.kxp-halo,.kxp-shadow{left:50%!important}
.kxp-pops{position:absolute!important;inset:auto!important;left:var(--cx,62%)!important;top:22%!important;width:var(--cw,184px)!important;margin:0!important;display:block!important;z-index:6}
.kxp.nocard .kxp-pops{display:block!important}
.kv2-vp::after{content:"";position:absolute;left:0;right:0;bottom:0;height:46px;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(246,247,249,0),#f6f7f9 85%)}
@container (max-width:420px){.kvc{padding:11px 12px 8px}.kvc-src b{font-size:12px}.kvc-kv b{font-size:9.5px}}

/* ===== v6: card entrance ===== */
.kvc{overflow:hidden}
.kvc::before{display:none!important}
.kvc-wire{position:absolute;right:100%;top:62px;width:46px;height:1.5px;border-radius:2px;background:linear-gradient(90deg,rgba(49,91,255,0),rgba(49,91,255,0.9));transform-origin:left}
.kvc-spark{position:absolute;left:-52px;top:62px;z-index:7;width:10px;height:10px;margin-top:-4.25px;border-radius:50%;background:#f1f5ff;box-shadow:0 0 0 3px rgba(49,91,255,0.35),0 0 18px 5px rgba(49,91,255,0.85);opacity:0}
.kvc-sweep{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(105deg,transparent 34%,rgba(220,229,255,0.22) 46%,rgba(11,14,20,0.38) 50%,rgba(220,229,255,0.22) 54%,transparent 66%);transform:translateX(-115%)}
.kvc-kv b{position:relative}
.kvc-kv b::after{content:"";position:absolute;top:-2px;bottom:-2px;left:-3px;right:-3px;border-radius:3px;background:linear-gradient(90deg,#315bff,#dce5ff);transform:scaleX(0);transform-origin:right}
.kxp.run[data-cur="0"] .kvc-wire{animation:kvcWire .35s cubic-bezier(.65,0,.35,1) 3.95s both}
.kxp.run[data-cur="0"] .kvc-spark{animation:kvcSpark .45s cubic-bezier(.4,0,.2,1) 4s both}
.kxp.run[data-cur="0"] .kvc{animation:kvcReveal .75s cubic-bezier(.16,1,.3,1) 4.3s both,kvcFlash 1s ease 5.55s}
.kxp.run[data-cur="0"] .kvc-sweep{animation:kvcSweep .95s cubic-bezier(.4,0,.2,1) 4.5s both}
.kxp.run[data-cur="0"] .kvc-hd{animation:kxpIn .4s ease 4.6s both}
.kxp.run[data-cur="0"] .kvc-hd i{animation:kvcDot .45s cubic-bezier(.2,.9,.3,1.6) 4.6s both,kvcBlink 1.4s ease-in-out 5.2s infinite}
.kxp.run[data-cur="0"] .kvc-src{animation:kxpSlide .4s cubic-bezier(.2,.8,.2,1) 4.75s both}
.kxp.run[data-cur="0"] .kvc-kv{animation:kxpSlide .35s cubic-bezier(.2,.8,.2,1) 4.9s both}
.kxp.run[data-cur="0"] .kvc-kv:nth-child(5){animation-delay:5.05s}.kxp.run[data-cur="0"] .kvc-kv:nth-child(6){animation-delay:5.2s}.kxp.run[data-cur="0"] .kvc-kv:nth-child(7){animation-delay:5.35s}
.kxp.run[data-cur="0"] .kvc-kv b::after{animation:kvcWrite .45s cubic-bezier(.65,0,.35,1) 5s both}
.kxp.run[data-cur="0"] .kvc-kv:nth-child(5) b::after{animation-delay:5.15s}.kxp.run[data-cur="0"] .kvc-kv:nth-child(6) b::after{animation-delay:5.3s}.kxp.run[data-cur="0"] .kvc-kv:nth-child(7) b::after{animation-delay:5.45s}
.kxp.run[data-cur="0"] .kxp-pops{animation:kvcFloat 4.5s ease-in-out 5.6s infinite alternate}
@keyframes kvcWire{from{transform:scaleX(0)}}
@keyframes kvcSpark{0%{opacity:0;transform:translateX(0) scale(.5)}20%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translateX(54px) scale(1.25)}}
@keyframes kvcReveal{from{opacity:.35;clip-path:inset(0 100% 0 0 round 16px);transform:perspective(800px) rotateY(-24deg) translateX(-14px) scale(.97)}to{opacity:1;clip-path:inset(0 0 0 0 round 16px)}}
@keyframes kvcSweep{from{transform:translateX(-115%)}to{transform:translateX(115%)}}
@keyframes kvcDot{from{transform:scale(0)}}
@keyframes kvcWrite{from{transform:scaleX(1)}}
@keyframes kvcFlash{0%,100%{box-shadow:0 30px 50px -22px rgba(16,24,40,0.35),0 0 0 5px rgba(49,91,255,0.05)}35%{box-shadow:0 30px 50px -22px rgba(16,24,40,0.35),0 0 0 6px rgba(49,91,255,0.22),0 0 40px rgba(49,91,255,0.45)}}
@keyframes kvcFloat{from{transform:translateY(0)}to{transform:translateY(-6px)}}
@media (prefers-reduced-motion:reduce){.kvc-spark{display:none}.kvc-sweep{display:none}}

/* ===== v7: form frame ===== */
.kxp-pops .kvc{display:none}
.kxp[data-cur="0"] .kxp-pops .kvc:not(.kfc){display:block}
.kxp[data-cur="1"] .kxp-pops .kfc{display:block}
/* screen */
.kf2-bg{position:absolute;inset:0}
.kf2-ghost{position:absolute;left:0;right:0;top:90px;bottom:0;padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.kf2-ghost i{display:block;border-radius:8px;background:rgba(11,14,20,0.07)}
.kf2-ghost .h{height:172px;border-radius:18px;background:linear-gradient(160deg,#e7e9ee,#f3f5f7)}
.kf2-ghost .l{width:80%;height:10px}.kf2-ghost .l.s{width:55%}.kf2-ghost .b{height:44px;border-radius:13px;background:rgba(49,91,255,0.55)}
.kf2-dim{position:absolute;inset:0;background:rgba(255,255,255,0.58)}
.kf2-sheet{position:absolute;left:0;right:0;top:76px;bottom:0;border-radius:26px 26px 0 0;background:#f1f2f5;border-top:1px solid rgba(11,14,20,0.1);box-shadow:0 -24px 44px -20px rgba(16,24,40,0.35)}
.kf2-grab{width:38px;height:4px;margin:9px auto 0;border-radius:2px;background:rgba(11,14,20,0.25)}
.kf2-body,.kf2-done{position:absolute;left:16px;right:16px;top:24px;bottom:24px}
.kf2-body{display:flex;flex-direction:column;opacity:0}
.kf2-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:14px}
.kf2-hd b{display:block;font:600 18px/1.15 "Space Grotesk",Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.kf2-hd small{display:block;margin-top:4px;font-size:10.5px;color:rgba(21,28,40,0.5)}
.kf2-x{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;background:rgba(11,14,20,0.07)}
.kf2-x svg{width:12px;height:12px;color:rgba(21,28,40,0.7)}
.kf2-f{margin-bottom:10px}
.kf2-f>span{display:block;margin:0 0 5px 2px;font-size:10.5px;color:rgba(21,28,40,0.55)}
.kf2-in{position:relative;display:flex;align-items:center;height:40px;padding:0 13px;border-radius:12px;background:#f7f8f9;border:1px solid rgba(11,14,20,0.1);font-size:13px;color:#0b0e14}
.kf2-v,.kf2-s{position:relative;white-space:nowrap;font-weight:500}
.kf2-v i{font-style:normal}
.kf2-v::after{content:"";position:absolute;top:-4px;bottom:-4px;left:-1px;right:-3px;background:#f7f8f9;transform:scaleX(0);transform-origin:right}
.kf2-ok,.kf2-chev{flex:none;margin-left:auto;width:16px;height:16px}
.kf2-ok{padding:2px;border-radius:50%;color:#ffffff;background:var(--g);stroke-width:3.4}
.kf2-chev{color:rgba(21,28,40,0.5)}
.kf2-seg{position:relative;display:grid;grid-template-columns:repeat(3,1fr);height:36px;padding:3px;border-radius:11px;background:#f7f8f9;border:1px solid rgba(11,14,20,0.1)}
.kf2-th{position:absolute;left:3px;top:3px;bottom:3px;width:calc((100% - 6px) / 3);border-radius:8px;background:var(--g);box-shadow:0 6px 14px -6px rgba(49,91,255,0.8);transform:translateX(100%)}
.kf2-seg em{position:relative;z-index:1;display:grid;place-items:center;font-size:11.5px;font-weight:600;color:rgba(21,28,40,0.6)}
.kf2-seg .kf2-on{color:#ffffff}
.kf2-sendw{position:relative;margin-top:auto}
.kf2-send{display:grid;height:46px;border-radius:14px;background:var(--g);box-shadow:0 14px 26px -12px rgba(49,91,255,0.9)}
.kf2-send>span{grid-area:1/1;display:grid;place-items:center}
.kf2-sl{font:600 14px/1 Inter,sans-serif;color:#ffffff}
.kf2-sp{opacity:0}
.kf2-sp::before{content:"";width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,0.25);border-top-color:#ffffff;animation:kf2Spin .7s linear infinite}
.kf2-tap{left:55%;top:50%}
.kf2-done{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.kf2-mark{width:76px;height:76px;margin-bottom:16px;overflow:visible}
.kf2-mark circle{fill:rgba(49,91,255,0.1);stroke:var(--g);stroke-width:3;stroke-dasharray:176;transform:rotate(-90deg);transform-origin:center}
.kf2-mark path{fill:none;stroke:var(--g);stroke-width:4.5;stroke-dasharray:40}
.kf2-done b{font:600 21px/1.15 "Space Grotesk",Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.kf2-done small{margin-top:6px;font-size:12px;color:rgba(21,28,40,0.6)}
.kf2-sum{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:18px}
.kf2-sum span{padding:6px 10px;border-radius:999px;font-size:10.5px;font-weight:600;color:#2449e0;background:rgba(49,91,255,0.1);border:1px solid rgba(49,91,255,0.3)}
/* side card */
.kfc-who{display:flex;align-items:center;gap:10px;padding-bottom:10px;margin-bottom:4px;border-bottom:1px solid rgba(11,14,20,0.07)}
.kfc-av{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;font:700 10px/1 Inter,sans-serif;color:#ffffff;background:linear-gradient(135deg,#dce5ff,#8fb6ff)}
.kfc-who div{flex:1;min-width:0}.kfc-who b{display:block;font:600 13px/1.2 Inter,sans-serif;color:#0b0e14}.kfc-who small{display:block;margin-top:2px;font-size:10px;color:rgba(21,28,40,0.55)}
.kfc-who em{font-style:normal;font:600 11px/1 "Space Grotesk",Inter,sans-serif;color:#2449e0}
.kfc-ck{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:11px;color:#0b0e14}
.kfc-c{position:relative;display:grid;place-items:center;flex:none;width:17px;height:17px;border-radius:50%;background:var(--g)}
.kfc-c svg{width:10px;height:10px;color:#ffffff;stroke-width:3.4}
.kfc-c::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(49,91,255,0.25);border-top-color:var(--g);opacity:0}
.kfc-go{display:flex;align-items:center;gap:7px;margin-top:6px;padding-top:9px;border-top:1px solid rgba(11,14,20,0.07);font:600 11px/1 Inter,sans-serif;color:#2449e0}
.kfc-go svg{width:13px;height:13px;color:var(--g)}

/* form timeline v2 (8.2s): base = start state, animations only move forward */
.kf2-site .kv2-pg{transform:translateY(-64px)}
.kf2-dim{opacity:0}
.kf2-sheet{transform:translateY(100%)}
.kf2-body{opacity:1}
.kf2-v::after{transform:scaleX(1)}
.kf2-ok{opacity:0;transform:scale(.4)}
.kf2-s{opacity:0}
.kf2-th{opacity:0;transform:translateX(100%) scale(.7)}
.kf2-seg .kf2-on{color:rgba(21,28,40,0.6)}
.kf2-sl{opacity:1}.kf2-sp{opacity:0}
.kf2-done{opacity:0}
.kf2-mark circle{stroke-dashoffset:176}.kf2-mark path{stroke-dashoffset:40}
.kf2-done b,.kf2-done small,.kf2-sum span{opacity:0}
.kxp.run .kxp-scr[data-step="1"].on .kf2-dim{animation:k7To1 .4s ease forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-sheet{animation:k7Sheet .7s cubic-bezier(.16,1,.3,1) .05s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-f1 .kf2-in{animation:kf2Focus .95s ease .75s}
.kxp.run .kxp-scr[data-step="1"].on .kf2-f1 .kf2-v::after{animation:k7Type .6s steps(9) .85s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-f2 .kf2-in{animation:kf2Focus 1.05s ease 1.55s}
.kxp.run .kxp-scr[data-step="1"].on .kf2-f2 .kf2-v::after{animation:k7Type .8s steps(13) 1.65s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-ok{animation:k7Pop .35s cubic-bezier(.2,.9,.3,1.4) 2.5s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-f3 .kf2-in{animation:kf2Focus .6s ease 2.65s}
.kxp.run .kxp-scr[data-step="1"].on .kf2-s{animation:k7To1 .3s ease 2.8s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-th{animation:k7Thumb .45s cubic-bezier(.2,.9,.3,1.2) 3.15s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-seg .kf2-on{animation:k7Dark .3s ease 3.2s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-tap{animation:kxpTap .95s cubic-bezier(.3,.7,.3,1) 3.5s both}
.kxp.run .kxp-scr[data-step="1"].on .kf2-send{animation:kxpPress .4s ease 3.95s}
.kxp.run .kxp-scr[data-step="1"].on .kf2-sl{animation:k7To0 .2s ease 4.05s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-sp{animation:k7To1 .2s ease 4.1s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-body{animation:k7BodyOut .35s ease 4.65s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-done{animation:k7To1 .4s ease 4.8s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-mark circle{animation:k7Dash .6s cubic-bezier(.65,0,.35,1) 4.85s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-mark path{animation:k7Dash .35s cubic-bezier(.65,0,.35,1) 5.35s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-done b{animation:k7Up .45s cubic-bezier(.16,1,.3,1) 5.4s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-done small{animation:k7Up .45s cubic-bezier(.16,1,.3,1) 5.5s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-sum span{animation:k7Pop .35s cubic-bezier(.2,.9,.3,1.3) 5.65s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-sum span:nth-child(2){animation-delay:5.75s}.kxp.run .kxp-scr[data-step="1"].on .kf2-sum span:nth-child(3){animation-delay:5.85s}
@keyframes k7To1{to{opacity:1}}
@keyframes k7To0{to{opacity:0}}
@keyframes k7Sheet{to{transform:none}}
@keyframes k7Type{to{transform:scaleX(0)}}
@keyframes k7Pop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
@keyframes k7Thumb{to{opacity:1;transform:translateX(100%)}}
@keyframes k7Dark{to{color:#ffffff}}
@keyframes k7BodyOut{to{opacity:0;transform:translateY(-8px)}}
@keyframes k7Dash{to{stroke-dashoffset:0}}
@keyframes k7Up{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.kf2-dim,.kf2-done,.kf2-done b,.kf2-done small,.kf2-sum span{opacity:1!important}.kf2-sheet{transform:none!important}.kf2-body{display:none}.kf2-mark circle,.kf2-mark path{stroke-dashoffset:0!important}}
/* side card timeline */
.kxp.run[data-cur="1"] .kvc-wire{animation:kvcWire .35s cubic-bezier(.65,0,.35,1) 4.85s both}
.kxp.run[data-cur="1"] .kvc-spark{animation:kvcSpark .45s cubic-bezier(.4,0,.2,1) 4.9s both}
.kxp.run[data-cur="1"] .kfc{animation:kvcReveal .75s cubic-bezier(.16,1,.3,1) 5.2s both,kvcFlash 1s ease 7s}
.kxp.run[data-cur="1"] .kfc .kvc-sweep{animation:kvcSweep .95s cubic-bezier(.4,0,.2,1) 5.4s both}
.kxp.run[data-cur="1"] .kfc .kvc-hd{animation:kxpIn .4s ease 5.5s both}
.kxp.run[data-cur="1"] .kfc .kvc-hd i{animation:kvcDot .45s cubic-bezier(.2,.9,.3,1.6) 5.5s both,kvcBlink 1.4s ease-in-out 6s infinite}
.kxp.run[data-cur="1"] .kfc-who{animation:kxpSlide .4s cubic-bezier(.2,.8,.2,1) 5.65s both}
.kxp.run[data-cur="1"] .kfc-ck{animation:kxpSlide .35s cubic-bezier(.2,.8,.2,1) 5.85s both}
.kxp.run[data-cur="1"] .kfc-ck:nth-child(5){animation-delay:6.15s}.kxp.run[data-cur="1"] .kfc-ck:nth-child(6){animation-delay:6.45s}
.kxp.run[data-cur="1"] .kfc-ck .kfc-c{animation:kf2Fill .25s ease 6.15s both}
.kxp.run[data-cur="1"] .kfc-ck .kfc-c::before{animation:kf2Spin2 .35s linear 5.85s both}
.kxp.run[data-cur="1"] .kfc-ck .kfc-c svg{animation:kf2Pop .3s ease 6.15s both}
.kxp.run[data-cur="1"] .kfc-ck:nth-child(5) .kfc-c,.kxp.run[data-cur="1"] .kfc-ck:nth-child(5) .kfc-c svg{animation-delay:6.45s}.kxp.run[data-cur="1"] .kfc-ck:nth-child(5) .kfc-c::before{animation-delay:6.15s}
.kxp.run[data-cur="1"] .kfc-ck:nth-child(6) .kfc-c,.kxp.run[data-cur="1"] .kfc-ck:nth-child(6) .kfc-c svg{animation-delay:6.75s}.kxp.run[data-cur="1"] .kfc-ck:nth-child(6) .kfc-c::before{animation-delay:6.45s}
.kxp.run[data-cur="1"] .kfc-go{animation:kxpSlide .4s cubic-bezier(.2,.8,.2,1) 6.95s both}
.kxp.run[data-cur="1"] .kxp-pops{animation:kvcFloat 4.5s ease-in-out 6.9s infinite alternate}
@keyframes kf2Fade{from{opacity:0}}
@keyframes kf2Sheet{from{transform:translateY(100%)}}
@keyframes kf2Out{from{opacity:1}to{opacity:0;transform:translateY(-8px)}}
@keyframes kf2Focus{0%,100%{border-color:rgba(11,14,20,0.1);box-shadow:none}12%,88%{border-color:rgba(49,91,255,0.75);box-shadow:0 0 0 3px rgba(49,91,255,0.15)}}
@keyframes kf2Pop{from{opacity:0;transform:scale(.4)}}
@keyframes kf2Thumb{from{opacity:0;transform:translateX(100%) scale(.7)}}
@keyframes kf2Son{from{color:rgba(21,28,40,0.6)}}
@keyframes kf2Hide{from{opacity:1}to{opacity:0}}
@keyframes kf2Spin{to{transform:rotate(360deg)}}
@keyframes kf2Spin2{0%{opacity:1;transform:rotate(0)}90%{opacity:1;transform:rotate(320deg)}100%{opacity:0;transform:rotate(360deg)}}
@keyframes kf2Fill{from{background:transparent}}
@keyframes kf2Draw{from{stroke-dashoffset:176}}
@keyframes kf2Check{from{stroke-dashoffset:40}}
@media (prefers-reduced-motion:reduce){.kf2-body{display:none}}

/* ===== v8: crm frame ===== */
.kxp:not([data-cur="2"]) .kxp-pops .kcc{display:none!important}
.kxp[data-cur="2"] .kxp-pops .kcc{display:block!important}
.kxp[data-cur="2"] .kxp-pops .kvc:not(.kcc){display:none!important}
.kc2-app{position:absolute;inset:0;padding:50px 14px 0}
.kc2-top{display:flex;align-items:center;justify-content:space-between;height:30px;margin:0 2px 10px}
.kc2-top b{font:600 20px/1 "Space Grotesk",Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.kc2-me{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font:700 10px/1 Inter,sans-serif;color:#ffffff;background:linear-gradient(135deg,#dce5ff,#8fb6ff)}
.kc2-tabs{display:flex;gap:6px;margin-bottom:12px}
.kc2-tabs span{display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 10px;border-radius:10px;white-space:nowrap;font:600 10.5px/1 Inter,sans-serif;color:rgba(21,28,40,0.6);background:rgba(11,14,20,0.04);border:1px solid rgba(11,14,20,0.07)}
.kc2-tabs span.on{color:#0b0e14;background:rgba(49,91,255,0.1);border-color:rgba(49,91,255,0.38)}
.kc2-tabs em{display:grid;min-width:16px;height:16px;padding:0 4px;overflow:hidden;border-radius:5px;font-style:normal;font-size:9.5px;line-height:16px;text-align:center;color:rgba(21,28,40,0.7);background:rgba(11,14,20,0.07)}
.kc2-tabs .on em{color:#ffffff;background:var(--g)}
.kc2-cnt i{grid-area:1/1;font-style:normal}.kc2-cnt i:first-child{opacity:0}
.kc2-list{display:flex;flex-direction:column;gap:8px}
.kc2-card{position:relative;height:74px;padding:10px 11px;border-radius:14px;background:#f0f2f5;border:1px solid rgba(11,14,20,0.07)}
.kc2-new{border-color:rgba(49,91,255,0.5);background:linear-gradient(180deg,rgba(49,91,255,0.08),rgba(49,91,255,0.02)),#f0f2f5}
.kc2-r1{display:flex;align-items:center;gap:9px}
.kc2-av{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;font:700 9px/1 Inter,sans-serif;color:#0b0e14;background:rgba(11,14,20,0.12)}
.kc2-new .kc2-av{color:#ffffff;background:var(--g)}
.kc2-r1 div{flex:1;min-width:0}.kc2-r1 b{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px;color:#0b0e14}
.kc2-r1 small{display:block;margin-top:2px;font-size:10px;color:rgba(21,28,40,0.55)}
.kc2-t{flex:none;font-style:normal;font-size:9.5px;color:rgba(21,28,40,0.45)}
.kc2-new .kc2-t{font-weight:600;color:#2449e0}
.kc2-r2{display:flex;align-items:center;justify-content:space-between;margin-top:9px;padding-left:35px}
.kc2-src{padding:3px 7px;border-radius:5px;font-size:9px;font-weight:600}
.kc2-src--g{color:#0072eb;background:rgba(66,133,244,0.15)}.kc2-src--m{color:#2449e0;background:rgba(52,168,83,0.15)}.kc2-src--r{color:#da8f10;background:rgba(245,180,84,0.13)}.kc2-src--w{color:#29344b;background:rgba(11,14,20,0.07)}
.kc2-own{display:inline-flex;align-items:center;gap:5px;font-size:9.5px;color:rgba(21,28,40,0.65)}
.kc2-own i{display:grid;place-items:center;width:16px;height:16px;border-radius:50%;font:700 6.5px/1 Inter,sans-serif;font-style:normal;color:#ffffff;background:#dce5ff}
.kc2-tap{left:45%;top:45%}
.kc2-sheet{position:absolute;left:0;right:0;top:172px;bottom:0;padding:0 16px 20px;border-radius:24px 24px 0 0;background:#f1f2f5;border-top:1px solid rgba(11,14,20,0.1);box-shadow:0 -24px 44px -20px rgba(16,24,40,0.35)}
.kc2-grab{width:38px;height:4px;margin:9px auto 12px;border-radius:2px;background:rgba(11,14,20,0.25)}
.kc2-dh{display:flex;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid rgba(11,14,20,0.07)}
.kc2-av--lg{width:36px;height:36px;font-size:11px;color:#ffffff;background:linear-gradient(135deg,#dce5ff,#8fb6ff)}
.kc2-dh div{flex:1;min-width:0}.kc2-dh b{display:block;font:600 16px/1.15 "Space Grotesk",Inter,sans-serif;color:#0b0e14}.kc2-dh small{display:block;margin-top:3px;font-size:10px;color:rgba(21,28,40,0.5)}
.kc2-pill{padding:5px 10px;border-radius:999px;font-style:normal;font-size:10px;font-weight:700;color:#ffffff;background:var(--g)}
.kc2-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 10px;padding:13px 0;border-bottom:1px solid rgba(11,14,20,0.07)}
.kc2-grid div{min-width:0}.kc2-grid em{display:block;font-style:normal;font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(21,28,40,0.42)}
.kc2-grid b{display:block;margin-top:4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11.5px;font-weight:600;color:#0b0e14}.kc2-grid b.blue{color:#0072eb}
.kc2-tl{display:flex;flex-direction:column;gap:9px;padding-top:12px}
.kc2-tl div{display:flex;align-items:center;gap:8px;font-size:11px;color:rgba(21,28,40,0.8)}
.kc2-tl i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--g);box-shadow:0 0 0 3px rgba(49,91,255,0.15)}
.kc2-tl span{margin-left:auto;font:600 10.5px/1 "Space Grotesk",Inter,sans-serif;color:#2449e0}
.kcc-st{padding:2px 7px!important;border-radius:5px;font-family:Inter,sans-serif!important;font-weight:700!important;color:#ffffff!important;background:var(--g)}
.kvc-kv b.blue{color:#0072eb}
/* crm timeline (8s) */
.kxp.run .kxp-scr[data-step="2"].on .kc2-top{animation:kxpIn .4s ease .1s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-tabs{animation:kxpIn .4s ease .2s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-old{animation:kc2Old 1.55s cubic-bezier(.2,.8,.2,1) .3s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-old:nth-child(3){animation-delay:.38s}.kxp.run .kxp-scr[data-step="2"].on .kc2-old:nth-child(4){animation-delay:.46s}
.kxp.run .kxp-scr[data-step="2"].on .kc2-new{animation:kc2Drop .6s cubic-bezier(.2,.9,.3,1.15) 1.35s both,kc2Glow 1.3s ease 1.5s,kxpPress .35s ease 3.15s}
.kxp.run .kxp-scr[data-step="2"].on .kc2-cnt i:first-child{animation:kc2CntOut .35s ease 1.55s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-cnt i:last-child{animation:kc2CntIn .35s ease 1.55s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-new .kc2-src{animation:kf2Pop .35s cubic-bezier(.2,.9,.3,1.4) 1.8s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-new .kc2-own{animation:kxpSlide .35s ease 2.05s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-new .kc2-t{animation:kvcBlink 1s ease-in-out 1.9s 3}
.kxp.run .kxp-scr[data-step="2"].on .kc2-tap{animation:kxpTap .95s cubic-bezier(.3,.7,.3,1) 2.7s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-sheet{animation:kf2Sheet .65s cubic-bezier(.16,1,.3,1) 3.3s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-dh{animation:kxpIn .4s ease 3.7s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-grid div{animation:kxpUp .4s cubic-bezier(.16,1,.3,1) 3.85s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-grid div:nth-child(2){animation-delay:3.93s}.kxp.run .kxp-scr[data-step="2"].on .kc2-grid div:nth-child(3){animation-delay:4.01s}
.kxp.run .kxp-scr[data-step="2"].on .kc2-grid div:nth-child(4){animation-delay:4.09s}.kxp.run .kxp-scr[data-step="2"].on .kc2-grid div:nth-child(5){animation-delay:4.17s}.kxp.run .kxp-scr[data-step="2"].on .kc2-grid div:nth-child(6){animation-delay:4.25s}
.kxp.run .kxp-scr[data-step="2"].on .kc2-tl div{animation:kxpSlide .4s cubic-bezier(.2,.8,.2,1) 4.45s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-tl div+div{animation-delay:4.65s}
/* side card */
.kxp.run[data-cur="2"] .kvc-wire{animation:kvcWire .35s cubic-bezier(.65,0,.35,1) 1.95s both}
.kxp.run[data-cur="2"] .kvc-spark{animation:kvcSpark .45s cubic-bezier(.4,0,.2,1) 2s both}
.kxp.run[data-cur="2"] .kcc{animation:kvcReveal .75s cubic-bezier(.16,1,.3,1) 2.3s both,kvcFlash 1s ease 4.2s}
.kxp.run[data-cur="2"] .kcc .kvc-sweep{animation:kvcSweep .95s cubic-bezier(.4,0,.2,1) 2.5s both}
.kxp.run[data-cur="2"] .kcc .kvc-hd{animation:kxpIn .4s ease 2.6s both}
.kxp.run[data-cur="2"] .kcc .kvc-hd i{animation:kvcDot .45s cubic-bezier(.2,.9,.3,1.6) 2.6s both,kvcBlink 1.4s ease-in-out 3.1s infinite}
.kxp.run[data-cur="2"] .kcc .kvc-kv{animation:kxpSlide .35s cubic-bezier(.2,.8,.2,1) 2.75s both}
.kxp.run[data-cur="2"] .kcc .kvc-kv:nth-child(4){animation-delay:2.9s}.kxp.run[data-cur="2"] .kcc .kvc-kv:nth-child(5){animation-delay:3.05s}.kxp.run[data-cur="2"] .kcc .kvc-kv:nth-child(6){animation-delay:3.2s}
.kxp.run[data-cur="2"] .kcc .kvc-kv b::after{animation:kvcWrite .45s cubic-bezier(.65,0,.35,1) 2.85s both}
.kxp.run[data-cur="2"] .kcc .kvc-kv:nth-child(4) b::after{animation-delay:3s}.kxp.run[data-cur="2"] .kcc .kvc-kv:nth-child(5) b::after{animation-delay:3.15s}.kxp.run[data-cur="2"] .kcc .kvc-kv:nth-child(6) b::after{animation-delay:3.3s}
.kxp.run[data-cur="2"] .kcc .kfc-go{animation:kxpSlide .4s cubic-bezier(.2,.8,.2,1) 3.55s both}
.kxp.run[data-cur="2"] .kxp-pops{animation:kvcFloat 4.5s ease-in-out 4.3s infinite alternate}
@keyframes kc2Old{0%{opacity:0;transform:translateY(-70px)}25%{opacity:1;transform:translateY(-82px)}68%{transform:translateY(-82px)}100%{transform:none}}
@keyframes kc2Drop{from{opacity:0;transform:translateY(-26px) scale(.95)}}
@keyframes kc2Glow{0%,100%{box-shadow:none}35%{box-shadow:0 0 0 4px rgba(49,91,255,0.18),0 12px 30px -10px rgba(49,91,255,0.7)}}
@keyframes kc2CntOut{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-100%)}}
@keyframes kc2CntIn{from{opacity:0;transform:translateY(100%)}}

/* ===== v9: seamless switches ===== */
.kxp-scr,.kxp-scr.on{transition:none!important}
.kxp-scr.on{opacity:1!important;visibility:visible!important}
.kxp.run[data-cur="0"] .kxp-pops .kvc:not(.kfc):not(.kcc){animation:kvcReveal .75s cubic-bezier(.16,1,.3,1) 4.3s both,kvcFlash 1s ease 5.55s,kvcHide .35s ease 7.1s forwards}
.kxp.run[data-cur="1"] .kxp-pops .kfc{animation:kvcReveal .75s cubic-bezier(.16,1,.3,1) 5.2s both,kvcFlash 1s ease 7s,kvcHide .35s ease 7.8s forwards}
.kxp.run[data-cur="2"] .kxp-pops .kcc{animation:kvcReveal .75s cubic-bezier(.16,1,.3,1) 2.3s both,kvcFlash 1s ease 4.2s,kvcHide .35s ease 7.6s forwards}
.kxp.run[data-cur="0"] .kvc-wire{animation:kvcWire .35s cubic-bezier(.65,0,.35,1) 3.95s both,kvcWireOut .3s ease 7.1s forwards}
.kxp.run[data-cur="1"] .kvc-wire{animation:kvcWire .35s cubic-bezier(.65,0,.35,1) 4.85s both,kvcWireOut .3s ease 7.8s forwards}
.kxp.run[data-cur="2"] .kvc-wire{animation:kvcWire .35s cubic-bezier(.65,0,.35,1) 1.95s both,kvcWireOut .3s ease 7.6s forwards}
@keyframes kvcHide{to{opacity:0;transform:perspective(800px) rotateY(-12deg) translateX(12px) scale(.97)}}
@keyframes kvcWireOut{to{opacity:0}}

/* ===== v10: phase switches (JS adds .go at data-at seconds) ===== */
.kf2-body.go{display:none!important}
.kf2-done{display:none!important}
.kf2-done.go{display:flex!important}
.kxp.run .kxp-scr[data-step="1"].on .kf2-done.go{animation:k7To1 .35s ease forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-done.go .kf2-mark circle{animation:k7Dash .6s cubic-bezier(.65,0,.35,1) .05s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-done.go .kf2-mark path{animation:k7Dash .35s cubic-bezier(.65,0,.35,1) .55s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-done.go b{animation:k7Up .45s cubic-bezier(.16,1,.3,1) .6s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-done.go small{animation:k7Up .45s cubic-bezier(.16,1,.3,1) .7s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-done.go .kf2-sum span{animation:k7Pop .35s cubic-bezier(.2,.9,.3,1.3) .85s forwards}
.kxp.run .kxp-scr[data-step="1"].on .kf2-done.go .kf2-sum span:nth-child(2){animation-delay:.95s}.kxp.run .kxp-scr[data-step="1"].on .kf2-done.go .kf2-sum span:nth-child(3){animation-delay:1.05s}

/* ===== v11: crm fixes + compact side card ===== */
.kc2-ic{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(11,14,20,0.07);border:1px solid rgba(11,14,20,0.08)}
.kc2-ic svg{width:14px;height:14px;color:rgba(21,28,40,0.75)}
.kc2-tabs{gap:5px;flex-wrap:nowrap}
.kc2-tabs span{height:28px;padding:0 8px;gap:4px;font-size:10px}
.kc2-r2{padding-left:35px}
.kxp.nocard .kxp-pops{display:none!important}
.kxp-pops{width:var(--cw,156px)!important}
.kvc{padding:12px 12px 9px!important}
.kvc-hd{margin-bottom:9px!important;font-size:10px!important}
.kvc-src,.kfc-who{gap:8px!important;padding-bottom:9px!important}
.kvc-src b,.kfc-who b{font-size:12px!important}
.kvc-kv{flex-direction:column;align-items:flex-start!important;gap:3px!important;padding:6px 0!important}
.kvc-kv b{max-width:100%;overflow:hidden;text-overflow:ellipsis;font-size:10px!important}
.kfc-ck{align-items:flex-start!important;font-size:10.5px!important;line-height:1.3}
.kfc-ck .kfc-c{margin-top:0}
.kfc-go{font-size:10.5px!important}

/* ===== v12: crm card grid (source aligned right under time) ===== */
.kc2-card{display:grid!important;grid-template-columns:28px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:10px;row-gap:5px;align-items:center;height:auto!important;min-height:62px;padding:11px 12px!important}
.kc2-r1,.kc2-r1>div,.kc2-r2{display:contents!important}
.kc2-card .kc2-av{grid-column:1;grid-row:1 / span 2;align-self:center;width:28px;height:28px}
.kc2-card .kc2-r1 b{grid-column:2;grid-row:1;align-self:end}
.kc2-card .kc2-r1 small{grid-column:2;grid-row:2;align-self:start;margin-top:0!important;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.kc2-card .kc2-t{grid-column:3;grid-row:1;justify-self:end;align-self:end}
.kc2-card .kc2-src{grid-column:3;grid-row:2;justify-self:end;align-self:start}
.kc2-list{gap:8px}
.kxp.run .kxp-scr[data-step="2"].on .kc2-old{animation:kc2Old2 1.55s cubic-bezier(.2,.8,.2,1) .3s both}
.kxp.run .kxp-scr[data-step="2"].on .kc2-old:nth-child(3){animation-delay:.38s}.kxp.run .kxp-scr[data-step="2"].on .kc2-old:nth-child(4){animation-delay:.46s}
@keyframes kc2Old2{0%{opacity:0;transform:translateY(-58px)}25%{opacity:1;transform:translateY(-70px)}68%{transform:translateY(-70px)}100%{transform:none}}

/* ===== v16: alert (isolated) ===== */
.kal-reset,.kal-reset *,.kal-reset *::before,.kal-reset *::after{transition:none!important}
.kal-fx{opacity:0}
.kal-fx.kal-on{opacity:1;transform:none!important;transition:opacity .45s ease,transform .6s cubic-bezier(.2,.9,.3,1.12)}
.kal-drop{transform:translateY(-22px) scale(.95)}.kal-up{transform:translateY(10px)}.kal-pop{transform:scale(.6)}.kal-slide{transform:translateX(10px)}
/* layers, bottom -> top: wall, lock+clock, stack|exp, foot, wake, home */
.kal-wall{position:absolute;inset:0;z-index:0;background:radial-gradient(90% 60% at 20% 15%,rgba(49,91,255,0.34),transparent 60%),radial-gradient(90% 70% at 90% 85%,rgba(143,182,255,0.28),transparent 60%),linear-gradient(180deg,#eff1f4,#f6f7f9 60%,#f9fafb)}
.kal-lock{position:absolute;z-index:1;left:50%;top:50px;width:16px;height:16px;margin-left:-8px}
.kal-lock svg{width:16px;height:16px;color:rgba(11,14,20,0.85)}
.kal-clock{position:absolute;z-index:1;left:0;right:0;top:72px;text-align:center}
.kal-clock small{display:block;font:600 12px/1 Inter,sans-serif;color:rgba(11,14,20,0.82)}
.kal-clock b{display:block;margin-top:4px;font:600 66px/1 "Space Grotesk",Inter,sans-serif;letter-spacing:-.04em;color:rgba(11,14,20,0.96)}
.kal-stack,.kal-exp{position:absolute;z-index:2;left:11px;right:11px;top:170px}
.kal-stack{display:flex;flex-direction:column;gap:8px}
.kal-stack.kal-on{display:none!important}
.kal-exp{display:none}
.kal-exp.kal-on{display:block;animation:kalOpen .5s cubic-bezier(.16,1,.3,1)}
.kal-n{position:relative;padding:11px 13px 12px;border-radius:20px;background:rgba(231,233,238,0.8);border:1px solid rgba(11,14,20,0.11);box-shadow:0 16px 30px -18px rgba(16,24,40,0.332),inset 0 1px 0 rgba(11,14,20,0.07)}
.kal-first,.kal-open{border-color:rgba(49,91,255,0.38)}
.kal-h{display:flex;align-items:center;gap:7px;margin-bottom:6px;font-size:10.5px;color:rgba(21,28,40,0.62)}
.kal-h span{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:500}
.kal-h em{font-style:normal;font-size:10px;color:rgba(21,28,40,0.45)}
.kal-ic{display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:6px;color:#ffffff;box-shadow:inset 0 1px 0 rgba(11,14,20,0.3)}
.kal-ic svg{width:12px;height:12px;stroke-width:2.5}.kal-ic img{display:block;width:14px;height:14px}
.kal-ic--w{background:#0b0e14}.kal-ic--g{background:var(--g)}.kal-ic--c{background:var(--c)}
.kal-ic--msg{color:#0b0e14;background:linear-gradient(180deg,#4f74ff,#315bff)}.kal-ic--msg svg{fill:#0b0e14;stroke:none}
.kal-n>b{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:600 13px/1.25 Inter,sans-serif;color:#0b0e14}
.kal-n>p{margin-top:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11.5px;color:rgba(21,28,40,0.72)}
.kal-first.kal-on .kal-ic{animation:kaRing .7s ease .25s}
.kal-tap{position:absolute;z-index:3;left:44%;top:40px;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:rgba(11,14,20,0.55);box-shadow:0 0 0 6px rgba(11,14,20,0.15);opacity:0;pointer-events:none}
.kal-tap.kal-on{animation:kxpTap .9s cubic-bezier(.3,.7,.3,1)}
.kal-rows{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:11px;padding-top:11px;border-top:1px solid rgba(11,14,20,0.09)}
.kal-rows div{min-width:0}.kal-rows em{display:block;font-style:normal;font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(21,28,40,0.45)}
.kal-rows b{display:block;margin-top:3px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11.5px;color:#0b0e14}.kal-rows b.blue{color:#0072eb}
.kal-act{display:grid;grid-template-columns:1fr 1.4fr;gap:7px;margin-top:12px}
.kal-act span{display:flex;align-items:center;justify-content:center;gap:6px;height:36px;border-radius:12px;font:600 12px/1 Inter,sans-serif;color:#0b0e14;background:rgba(11,14,20,0.1)}
.kal-act .kal-call{color:#ffffff;background:var(--g)}.kal-act svg{width:13px;height:13px;stroke-width:2.2}
.kal-call.kal-on{animation:kaPulse 1.4s ease-out .6s 2}
.kal-foot{position:absolute;z-index:3;left:26px;right:26px;bottom:26px;display:flex;justify-content:space-between}
.kal-foot span{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:rgba(11,14,20,0.1)}
.kal-foot svg{width:17px;height:17px;color:rgba(11,14,20,0.85)}
.kal-wake{position:absolute;inset:0;z-index:6;background:#ffffff;opacity:0;pointer-events:none}
.kxp.run .kxp-scr[data-step="3"].on .kal-wake{animation:kaWake4 .6s ease}
.kxp.run[data-cur="3"] .kxp-sc{animation:kaBuzz .35s ease .7s,kaBuzz .35s ease 1.45s,kaBuzz .35s ease 2.2s}
/* side card (only in the Alert frame) */
.kxp:not([data-cur="3"]) .kxp-pops .kal-card{display:none!important}
.kxp[data-cur="3"] .kxp-pops .kal-card{display:block!important}
.kxp[data-cur="3"] .kxp-pops .kvc:not(.kal-card){display:none!important}
.kxp-pops .kal-card{opacity:0;animation:none!important}
.kxp-pops .kal-card.kal-on{opacity:1;animation:kvcReveal .75s cubic-bezier(.16,1,.3,1)!important}
.kxp-pops .kal-card.kal-on .kvc-sweep{animation:kvcSweep .95s cubic-bezier(.4,0,.2,1) .2s both}
.kxp-pops .kal-card.kal-out{opacity:0!important;transition:opacity .35s ease}
.kal-card .kvc-hd i{animation:none}
.kal-card .kvc-hd.kal-on i{animation:kvcBlink 1.4s ease-in-out .5s infinite}
.kal-ck{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:10.5px;line-height:1.3;color:#0b0e14}
.kal-c{position:relative;display:grid;place-items:center;flex:none;width:17px;height:17px;border-radius:50%;background:transparent}
.kal-c svg{width:10px;height:10px;color:#ffffff;stroke-width:3.4;opacity:0}
.kal-c::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(49,91,255,0.25);border-top-color:var(--g);opacity:0}
.kal-ck.kal-on .kal-c{background:var(--g);transition:background .25s ease .35s}
.kal-ck.kal-on .kal-c svg{opacity:1;transition:opacity .25s ease .35s}
.kal-ck.kal-on .kal-c::before{animation:kf2Spin2 .4s linear}
.kxp[data-cur="3"] .kvc-wire{transform:scaleX(0);animation:none!important}
.kxp[data-cur="3"] .kvc-wire.kal-on{transform:none;transition:transform .35s cubic-bezier(.65,0,.35,1)}
.kxp[data-cur="3"] .kvc-wire.kal-out{opacity:0;transition:opacity .3s ease}
.kxp[data-cur="3"] .kvc-spark{animation:none!important;opacity:0}
.kxp[data-cur="3"] .kvc-spark.kal-on{animation:kvcSpark .45s cubic-bezier(.4,0,.2,1)!important}
.kxp.run[data-cur="3"] .kxp-pops{animation:kvcFloat 4.5s ease-in-out 3.4s infinite alternate}
@keyframes kalOpen{from{opacity:0;transform:translateY(-6px) scale(.97)}}
@keyframes kaWake4{from{opacity:1}to{opacity:0}}
@keyframes kaRing{25%{transform:rotate(14deg)}50%{transform:rotate(-12deg)}75%{transform:rotate(6deg)}}
@keyframes kaPulse{0%{box-shadow:0 0 0 0 rgba(49,91,255,0.6)}100%{box-shadow:0 0 0 10px rgba(49,91,255,0)}}
@keyframes kaBuzz{20%{transform:scale(var(--ps,1)) translateX(-2px)}40%{transform:scale(var(--ps,1)) translateX(2px)}60%{transform:scale(var(--ps,1)) translateX(-1.5px)}80%{transform:scale(var(--ps,1)) translateX(1px)}}
@media (prefers-reduced-motion:reduce){.kal-fx{opacity:1;transform:none}}

/* ===== v17: form treatment timed ===== */
.kv2-price{justify-content:flex-start}
.kf2-f3 .kf2-in{position:relative}
.kf2-ph{font-weight:500;color:rgba(21,28,40,0.38)}
.kf2-ph.go{display:none}
.kf2-s{position:absolute;left:13px;top:50%;margin-top:-8px;line-height:16px;opacity:0!important;transition:none}
.kf2-s.go{opacity:1!important;transition:opacity .3s ease}
.kxp.run .kxp-scr[data-step="1"].on .kf2-s{animation:none!important}

/* ===== v18: alert ordered stack ===== */
.kal-stack{top:162px!important;gap:7px!important}
.kal-stack .kal-n{padding:10px 12px 11px;opacity:0;transform:translateY(-22px) scale(.95)}
.kal-stack .kal-n>b{font-size:12.5px}.kal-stack .kal-n>p{font-size:11px}
.kal-stack .kal-h{margin-bottom:5px}
.kal-stack.s1 .kal-n:nth-child(1),.kal-stack.s2 .kal-n:nth-child(2),.kal-stack.s3 .kal-n:nth-child(3){opacity:1;transform:none;transition:opacity .45s ease,transform .6s cubic-bezier(.2,.9,.3,1.12)}
.kal-stack.s1 .kal-first .kal-ic{animation:kaRing .7s ease .25s}
.kal-first.kal-on .kal-ic{animation:none}
.kal-foot{bottom:22px!important}

/* ===== v19: alert per-slot visibility (highest priority) ===== */
.kxp .kal-stack .kal-n{opacity:0!important;transform:translateY(-22px) scale(.95)!important;transition:none}
.kxp .kal-stack.s1 .kal-n1,.kxp .kal-stack.s2 .kal-n2,.kxp .kal-stack.s3 .kal-n3{opacity:1!important;transform:none!important;transition:opacity .45s ease,transform .6s cubic-bezier(.2,.9,.3,1.12)}
.kxp .kal-reset .kal-stack .kal-n{transition:none!important}

/* ===== v20: crisp phone (zoom instead of scale) ===== */
.kxp{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
@supports (zoom:1){
 .kxp .kxp-sc{zoom:var(--ps,1);transform:none!important;margin:0!important}
 .kxp.run[data-cur="3"] .kxp-sc{animation:kaBuzzZ .35s ease .7s,kaBuzzZ .35s ease 1.45s,kaBuzzZ .35s ease 2.2s}
}
@keyframes kaBuzzZ{20%{transform:translateX(-2px)}40%{transform:translateX(2px)}60%{transform:translateX(-1.5px)}80%{transform:translateX(1px)}}

/* ===== v21: side cards in Anatomy style ===== */
.kxp-pops .kvc{padding:14px 14px 18px!important;border-radius:16px!important;
 background:linear-gradient(180deg,rgba(240,242,245,0.95),rgba(247,247,249,0.95))!important;border:1px solid rgba(11,14,20,0.08)!important;
 box-shadow:0 30px 60px -28px rgba(16,24,40,0.332),inset 0 1px 0 rgba(11,14,20,0.05)!important}
.kxp-pops .kvc-hd{display:flex;align-items:center;gap:8px;margin-bottom:12px!important;font:600 9.5px/1 Inter,sans-serif!important;letter-spacing:.15em!important;text-transform:uppercase;color:rgba(21,28,40,0.55)!important}
.kxp-pops .kvc-hd i{flex:none;width:6px!important;height:6px!important;border-radius:50%;background:#315bff!important;box-shadow:0 0 0 3px rgba(49,91,255,0.14),0 0 10px #315bff!important}
.kxp-pops .kvc-src{padding-bottom:12px!important;margin-bottom:4px!important;border-bottom:1px solid rgba(11,14,20,0.07)!important}
.kxp-pops .kvc-src b{font:600 17px/1.1 "Space Grotesk",Inter,sans-serif!important;letter-spacing:-.02em;color:#0b0e14!important}
.kxp-pops .kvc-src small,.kxp-pops .kfc-who small{margin-top:4px!important;font-size:10.5px!important;color:rgba(21,28,40,0.5)!important}
.kxp-pops .kfc-who{padding-bottom:12px!important;margin-bottom:4px!important;border-bottom:1px solid rgba(11,14,20,0.07)!important}
.kxp-pops .kfc-av{display:none!important}
.kxp-pops .kfc-who b{font:600 16px/1.1 "Space Grotesk",Inter,sans-serif!important;letter-spacing:-.02em;color:#0b0e14!important}
.kxp-pops .kfc-who em{font:600 20px/1 "Space Grotesk",Inter,sans-serif!important;letter-spacing:-.02em;color:#2449e0!important;font-variant-numeric:tabular-nums}
.kxp-pops .kvc-kv{padding:8px 0!important;border-bottom:1px solid rgba(11,14,20,0.05)!important}
.kxp-pops .kvc-kv:last-of-type{border-bottom:0!important}
.kxp-pops .kvc-kv em{font:600 8.5px/1 Inter,sans-serif!important;letter-spacing:.14em!important;text-transform:uppercase;color:rgba(21,28,40,0.42)!important}
.kxp-pops .kvc-kv b{font:600 12.5px/1.25 Inter,sans-serif!important;color:#0b0e14!important}
.kxp-pops .kvc-kv b.blue{color:#0072eb!important}
.kxp-pops .kcc-st{padding:3px 8px!important;border-radius:6px;font-size:11px!important;color:#ffffff!important;background:#315bff!important}
.kxp-pops .kfc-ck,.kxp-pops .kal-ck{padding:7px 0!important;font-size:12px!important;line-height:1.3;color:rgba(21,28,40,0.88)!important}
.kxp-pops .kfc-go{margin-top:8px!important;padding-top:11px!important;border-top:1px solid rgba(11,14,20,0.07)!important;
 font:600 9.5px/1 Inter,sans-serif!important;letter-spacing:.14em!important;text-transform:uppercase;color:#2449e0!important}
.kxp-pops .kfc-go svg{width:12px!important;height:12px!important;color:#315bff!important}
.kxp-pops .kvc::after{content:"";position:absolute;left:14px;right:14px;bottom:8px;height:3px;border-radius:99px;
 background:linear-gradient(90deg,#2449e0,#d3deff);box-shadow:0 0 12px rgba(49,91,255,0.6);transform-origin:left;animation:kvBar 1.8s cubic-bezier(.2,.8,.2,1) .9s both}
@keyframes kvBar{from{transform:scaleX(0)}}
@media (prefers-reduced-motion:reduce){.kxp-pops .kvc::after{animation:none}}

/* ===== v23: reply frame ===== */
.krp-reset,.krp-reset *,.krp-reset *::before,.krp-reset *::after{transition:none!important}
.krp-fx{opacity:0}
.krp-fx.krp-on{opacity:1;transform:none!important;transition:opacity .45s ease,transform .6s cubic-bezier(.2,.9,.3,1.12)}
.krp-up{transform:translateY(10px)}.krp-pop{transform:scale(.6)}.krp-slide{transform:translateX(10px)}
/* part L: same lock screen as the end of Alert */
.krp-l,.krp-b{position:absolute;inset:0;overflow:hidden}
.krp-l.krp-on{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .5s ease}
.krp-lock{position:absolute;z-index:1;left:50%;top:50px;width:16px;height:16px;margin-left:-8px}
.krp-lock svg{width:16px;height:16px;color:rgba(11,14,20,0.85)}
.krp-clock{position:absolute;z-index:1;left:0;right:0;top:72px;text-align:center}
.krp-clock small{display:block;font:600 12px/1 Inter,sans-serif;color:rgba(11,14,20,0.82)}
.krp-clock b{display:block;margin-top:4px;font:600 66px/1 "Space Grotesk",Inter,sans-serif;letter-spacing:-.04em;color:rgba(11,14,20,0.96)}
.krp-ghost,.krp-mn{position:absolute;z-index:2;left:11px;right:11px;top:170px}
.krp-ghost .kal-n{border-color:rgba(49,91,255,0.4)}
.krp-ghost .kal-rows div,.krp-ghost .kal-act span{opacity:1!important;transform:none!important}
.krp-ghost.krp-on{opacity:0;transform:translateY(-40px) scale(.96);transition:opacity .4s ease,transform .5s cubic-bezier(.4,0,.2,1)}
.krp-mn{opacity:0;transform:translateY(-22px) scale(.95)}
.krp-mn.krp-on{opacity:1;transform:none;transition:opacity .45s ease,transform .6s cubic-bezier(.2,.9,.3,1.12)}
.krp-mailic{color:#0b0e14!important;background:linear-gradient(180deg,#4ea1ff,#1a6dff)!important}
.krp-mailic svg{width:12px;height:12px;stroke-width:2.2}
.krp-tap{position:absolute;z-index:4;left:46%;top:206px;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:rgba(11,14,20,0.55);box-shadow:0 0 0 6px rgba(11,14,20,0.15);opacity:0;pointer-events:none}
.krp-tap.krp-on{animation:kxpTap .9s cubic-bezier(.3,.7,.3,1)}
/* part B: email */
.krp-b{opacity:0;transform:scale(.94) translateY(-14px);background:#f6f7f9}
.krp-b.krp-on{opacity:1;transform:none;transition:opacity .4s ease,transform .55s cubic-bezier(.16,1,.3,1)}
.krp-nav{position:absolute;left:0;right:0;top:0;z-index:2;display:flex;align-items:flex-end;justify-content:space-between;height:78px;padding:0 14px 9px;background:#f6f7f9;border-bottom:1px solid rgba(11,14,20,0.07);font-size:12px;color:#006eeb}
.krp-bk{display:inline-flex;align-items:center;gap:2px}.krp-bk svg{width:15px;height:15px;stroke-width:2.4}
.krp-ico{display:flex;gap:14px}.krp-ico svg{width:17px;height:17px;stroke-width:2}
.krp-body{position:absolute;left:0;right:0;top:78px;bottom:22px;padding:13px 15px 0;overflow:hidden}
.krp-subj{font:600 17px/1.2 "Space Grotesk",Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.krp-from{display:flex;align-items:center;gap:9px;margin:11px 0;padding-bottom:11px;border-bottom:1px solid rgba(11,14,20,0.07)}
.krp-av{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;font:700 10px/1 Inter,sans-serif;color:#ffffff;background:linear-gradient(135deg,#dce5ff,#8fb6ff)}
.krp-from div{min-width:0}.krp-from b{display:block;font:600 12px/1.2 Inter,sans-serif;color:#0b0e14}.krp-from small{display:block;margin-top:2px;font-size:10px;color:rgba(21,28,40,0.5)}
.krp-p{margin:0 0 7px;font-size:11.5px;line-height:1.45;color:rgba(21,28,40,0.86)}
.krp-cal{margin-top:9px;padding:10px 10px 9px;border-radius:14px;background:rgba(11,14,20,0.035);border:1px solid rgba(11,14,20,0.09)}
.krp-ch{display:flex;align-items:center;justify-content:space-between;margin:0 2px 8px}
.krp-ch b{font:600 12px/1 Inter,sans-serif;color:#0b0e14}
.krp-ch span{display:flex;gap:8px}.krp-ch svg{width:13px;height:13px;color:#006eeb;stroke-width:2.4}
.krp-days{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.krp-days span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:42px;border-radius:10px;background:rgba(11,14,20,0.04)}
.krp-days em{font-style:normal;font-size:8.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(21,28,40,0.5)}
.krp-days b{font:600 14px/1 "Space Grotesk",Inter,sans-serif;color:#0b0e14}
.krp-days .krp-sel{background:#315bff;box-shadow:0 8px 18px -8px rgba(49,91,255,0.9)}
.krp-days .krp-sel em{color:rgba(255,255,255,0.7)}.krp-days .krp-sel b{color:#ffffff}
.krp-times{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-top:7px}
.krp-times span{display:grid;place-items:center;height:30px;border-radius:9px;font:600 11.5px/1 Inter,sans-serif;color:#2449e0;background:rgba(49,91,255,0.08);border:1px solid rgba(49,91,255,0.3)}
.krp-times .krp-hot{color:#ffffff;background:#315bff;border-color:#315bff}
.krp-hot.krp-on{animation:krpPulse 1.5s ease-out 1.2s 2}
.krp-note{margin-top:8px;text-align:center;font-size:9.5px;color:rgba(21,28,40,0.5)}
.krp-sig{margin-top:10px;font-size:10.5px;color:rgba(21,28,40,0.55)}
/* side card (Reply only) */
.kxp:not([data-cur="4"]) .kxp-pops .krp-card{display:none!important}
.kxp[data-cur="4"] .kxp-pops .krp-card{display:block!important}
.kxp[data-cur="4"] .kxp-pops .kvc:not(.krp-card){display:none!important}
.kxp-pops .krp-card{opacity:0;animation:none!important}
.kxp-pops .krp-card.krp-on{opacity:1;animation:kvcReveal .75s cubic-bezier(.16,1,.3,1)!important}
.kxp-pops .krp-card.krp-on .kvc-sweep{animation:kvcSweep .95s cubic-bezier(.4,0,.2,1) .2s both}
.kxp-pops .krp-card.krp-out{opacity:0!important;transition:opacity .35s ease}
.kxp-pops .krp-card::after{animation:none!important;transform:scaleX(0)}
.kxp-pops .krp-card.krp-on::after{transform:none;transition:transform 1.8s cubic-bezier(.2,.8,.2,1) .8s}
.krp-card .kvc-hd i{animation:none}
.krp-card .kvc-hd.krp-on i{animation:kvcBlink 1.4s ease-in-out .5s infinite}
.krp-hero{padding:2px 0 12px;margin-bottom:4px;border-bottom:1px solid rgba(11,14,20,0.07)}
.krp-hero b{display:block;font:600 30px/1 "Space Grotesk",Inter,sans-serif;letter-spacing:-.03em;color:#2449e0;font-variant-numeric:tabular-nums}
.krp-hero small{display:block;margin-top:6px;font:600 8.5px/1 Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(21,28,40,0.45)}
.krp-st{position:relative;display:block;width:100%;height:20px}
.krp-st i{position:absolute;left:0;top:0;display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:6px;font-style:normal;font:600 10.5px/1 Inter,sans-serif;white-space:nowrap}
.krp-s1{color:rgba(21,28,40,0.8);background:rgba(11,14,20,0.08)}
.krp-s1.krp-on{opacity:0;transition:opacity .25s ease}
.krp-s2{opacity:0;color:#ffffff;background:#315bff}
.krp-s2.krp-on{opacity:1;transition:opacity .35s ease .15s}
.kxp[data-cur="4"] .kvc-wire{transform:scaleX(0);animation:none!important}
.kxp[data-cur="4"] .kvc-wire.krp-on{transform:none;transition:transform .35s cubic-bezier(.65,0,.35,1)}
.kxp[data-cur="4"] .kvc-wire.krp-out{opacity:0;transition:opacity .3s ease}
.kxp[data-cur="4"] .kvc-spark{animation:none!important;opacity:0}
.kxp[data-cur="4"] .kvc-spark.krp-on{animation:kvcSpark .45s cubic-bezier(.4,0,.2,1)!important}
.kxp.run[data-cur="4"] .kxp-pops{animation:kvcFloat 4.5s ease-in-out 3.6s infinite alternate}
@keyframes krpPulse{0%{box-shadow:0 0 0 0 rgba(49,91,255,0.65)}100%{box-shadow:0 0 0 10px rgba(49,91,255,0)}}
@media (prefers-reduced-motion:reduce){.krp-fx{opacity:1;transform:none}.krp-l{display:none}.krp-b{opacity:1;transform:none}}

/* ===== v24: follow-up frame ===== */
.kfu-fx{opacity:0}
.kfu-fx.kfu-on{opacity:1;transform:none!important;transition:opacity .45s ease,transform .6s cubic-bezier(.2,.9,.3,1.12)}
.kfu-up{transform:translateY(10px)}.kfu-pop{transform:scale(.85)}.kfu-slide{transform:translateX(10px)}
/* ghost: the exact last view of Reply */
.kfu-ghost{position:absolute;inset:0;z-index:3;background:#f6f7f9}
.kfu-ghost .krp-b{opacity:1!important;transform:none!important}
.kfu-ghost.kfu-on{transform:translateX(100%);transition:transform .5s cubic-bezier(.4,0,.2,1)}
.kfu-tap{position:absolute;z-index:6;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:rgba(11,14,20,0.55);box-shadow:0 0 0 6px rgba(11,14,20,0.15);opacity:0;pointer-events:none}
.kfu-tap.kfu-on{animation:kxpTap .9s cubic-bezier(.3,.7,.3,1)}
.kfu-tap1{left:34px;top:62px}.kfu-tap2{left:48%;top:150px}.kfu-tap3{left:50%;top:268px}
/* inbox */
.kfu-in{position:absolute;inset:0;z-index:2;padding:48px 14px 0;overflow:hidden;background:#f6f7f9;opacity:0;transform:translateX(-30%)}
.kfu-in.kfu-on{opacity:1;transform:none;transition:opacity .45s ease,transform .5s cubic-bezier(.16,1,.3,1)}
.kfu-in.kfu-on.kfu-out{opacity:0;transform:translateX(-30%);transition:opacity .45s ease,transform .5s cubic-bezier(.4,0,.2,1)}
.kfu-top{display:flex;align-items:center;justify-content:space-between;height:24px;font-size:12px;color:#006eeb}
.kfu-bk{display:inline-flex;align-items:center;gap:2px}.kfu-bk svg{width:15px;height:15px;stroke-width:2.4}
.kfu-title{margin:6px 2px 12px;font:700 26px/1 Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.kfu-list{position:relative}
.kfu-row{position:relative;height:66px;margin:0 -14px;padding:9px 14px 9px 28px;border-bottom:1px solid rgba(11,14,20,0.07);background:#f6f7f9;transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .45s ease}
.kfu-dot{position:absolute;left:11px;top:14px;width:8px;height:8px;border-radius:50%;background:#0a84ff}
.kfu-rt{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.kfu-rt b{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:700 12.5px/1.2 Inter,sans-serif;color:#0b0e14}
.kfu-rt em{flex:none;font-style:normal;font-size:10px;color:rgba(21,28,40,0.45)}
.kfu-rs{margin-top:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11.5px;color:#0b0e14}
.kfu-rp{margin-top:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px;color:rgba(21,28,40,0.5)}
.kfu-r0 .kfu-rt b,.kfu-o .kfu-rt b{font-weight:600}.kfu-r0 .kfu-rs,.kfu-o .kfu-rs{color:rgba(21,28,40,0.78)}
/* start: no follow-ups yet; older mails sit two slots higher */
.kfu-list .kfu-n2{opacity:0;transform:translateY(-20px) scale(.97)}
.kfu-list .kfu-n1{opacity:0;transform:translateY(-86px) scale(.97)}
.kfu-list .kfu-r0,.kfu-list .kfu-o{transform:translateY(-132px)}
.kfu-list.s1 .kfu-n1{opacity:1;transform:translateY(-66px)}
.kfu-list.s1 .kfu-r0,.kfu-list.s1 .kfu-o{transform:translateY(-66px)}
.kfu-list.s2 .kfu-n2{opacity:1;transform:none}
.kfu-list.s2 .kfu-n1,.kfu-list.s2 .kfu-r0,.kfu-list.s2 .kfu-o{transform:none}
.kfu-list.s2 .kfu-n2,.kfu-list.s1 .kfu-n1{background:rgba(10,132,255,0.06)}
/* time chip */
.kfu-chip{position:absolute;z-index:5;left:50%;bottom:34px;display:flex;align-items:center;gap:7px;height:32px;padding:0 14px 0 11px;border-radius:999px;white-space:nowrap;
 background:rgba(242,243,246,0.96);border:1px solid rgba(49,91,255,0.4);box-shadow:0 14px 28px -12px rgba(16,24,40,0.35);opacity:0;transform:translate(-50%,12px)}
.kfu-chip svg{flex:none;width:14px;height:14px;color:#315bff}
.kfu-chip.kfu-on{opacity:1;transform:translate(-50%,0);transition:opacity .45s ease,transform .55s cubic-bezier(.2,.9,.3,1.12)}
.kfu-chip.kfu-on.kfu-out{opacity:0;transform:translate(-50%,10px);transition:opacity .35s ease,transform .35s ease}
.kfu-cw{display:inline-grid}.kfu-cw b{grid-area:1/1;font:600 11.5px/1 Inter,sans-serif;color:#0b0e14}
.kfu-c1.kfu-on{opacity:0;transform:translateY(-6px);transition:opacity .3s ease,transform .3s ease}
.kfu-c2{opacity:0;transform:translateY(6px)}
.kfu-c2.kfu-on{opacity:1;transform:none;transition:opacity .35s ease .12s,transform .4s ease .12s}
/* second email */
.kfu-mail{position:absolute;inset:0;z-index:3;background:#f6f7f9;transform:translateX(100%)}
.kfu-mail.kfu-on{transform:none;transition:transform .55s cubic-bezier(.16,1,.3,1)}
.kfu-slots{display:flex;flex-direction:column;gap:7px;margin:4px 0 10px}
.kfu-s{display:flex;align-items:center;gap:9px;height:42px;padding:0 13px;border-radius:12px;background:rgba(49,91,255,0.07);border:1px solid rgba(49,91,255,0.32)}
.kfu-s svg{flex:none;width:15px;height:15px;color:#315bff}
.kfu-s b{font:600 12.5px/1 Inter,sans-serif;color:#0b0e14}.kfu-s em{margin-left:auto;font-style:normal;font:600 12.5px/1 "Space Grotesk",Inter,sans-serif;color:#2449e0}
.kfu-pick.kfu-on{background:#315bff;border-color:#315bff;box-shadow:0 10px 22px -10px rgba(49,91,255,0.9);transition:background .3s ease,box-shadow .3s ease}
.kfu-pick.kfu-on svg,.kfu-pick.kfu-on b,.kfu-pick.kfu-on em{color:#ffffff}
.kfu-small{font-size:10.5px!important;color:rgba(21,28,40,0.55)!important}
/* confirmation sheet */
.kfu-ok{position:absolute;left:0;right:0;bottom:0;z-index:4;height:318px;padding:0 18px 24px;display:flex;flex-direction:column;align-items:center;text-align:center;
 border-radius:26px 26px 0 0;background:#f1f2f5;border-top:1px solid rgba(11,14,20,0.1);box-shadow:0 -24px 44px -20px rgba(16,24,40,0.35);transform:translateY(105%)}
.kfu-ok.kfu-on{transform:none;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.kfu-grab{width:38px;height:4px;margin:9px 0 14px;border-radius:2px;background:rgba(11,14,20,0.25)}
.kfu-mark{width:62px;height:62px;overflow:visible}
.kfu-mark circle{fill:rgba(49,91,255,0.1);stroke:#315bff;stroke-width:3;stroke-dasharray:176;stroke-dashoffset:176;transform:rotate(-90deg);transform-origin:center}
.kfu-mark path{fill:none;stroke:#315bff;stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40}
.kfu-ok.kfu-on .kfu-mark circle{stroke-dashoffset:0;transition:stroke-dashoffset .6s cubic-bezier(.65,0,.35,1) .3s}
.kfu-ok.kfu-on .kfu-mark path{stroke-dashoffset:0;transition:stroke-dashoffset .35s cubic-bezier(.65,0,.35,1) .85s}
.kfu-okt{margin-top:12px;font:600 20px/1.15 "Space Grotesk",Inter,sans-serif;letter-spacing:-.02em;color:#0b0e14}
.kfu-oks{margin-top:5px;font-size:11.5px;color:rgba(21,28,40,0.6)}
.kfu-det{display:flex;flex-direction:column;gap:7px;width:100%;margin:14px 0 14px;padding:11px 12px;border-radius:13px;background:rgba(11,14,20,0.04);border:1px solid rgba(11,14,20,0.08);text-align:left}
.kfu-det div{display:flex;align-items:center;gap:8px;font-size:11.5px;color:rgba(21,28,40,0.88)}
.kfu-det svg{flex:none;width:14px;height:14px;color:#315bff}
.kfu-add{display:grid;place-items:center;width:100%;height:40px;border-radius:12px;font:600 13px/1 Inter,sans-serif;color:#ffffff;background:#315bff;box-shadow:0 12px 24px -12px rgba(49,91,255,0.9)}
.kfu-resch{margin-top:9px;font-size:11.5px;font-weight:600;color:#006eeb}
/* side card (Follow-up only) */
.kxp:not([data-cur="5"]) .kxp-pops .kfu-card{display:none!important}
.kxp[data-cur="5"] .kxp-pops .kfu-card{display:block!important}
.kxp[data-cur="5"] .kxp-pops .kvc:not(.kfu-card){display:none!important}
.kxp-pops .kfu-card{opacity:0;animation:none!important}
.kxp-pops .kfu-card.kfu-on{opacity:1;animation:kvcReveal .75s cubic-bezier(.16,1,.3,1)!important}
.kxp-pops .kfu-card.kfu-on .kvc-sweep{animation:kvcSweep .95s cubic-bezier(.4,0,.2,1) .2s both}
.kxp-pops .kfu-card.kfu-out{opacity:0!important;transition:opacity .35s ease}
.kxp-pops .kfu-card::after{animation:none!important;transform:scaleX(0)}
.kxp-pops .kfu-card.kfu-on::after{transform:none;transition:transform 6s linear .5s}
.kfu-card .kvc-hd i{animation:none}
.kfu-card .kvc-hd.kfu-on i{animation:kvcBlink 1.4s ease-in-out .5s infinite}
.kfu-tl{position:relative;margin:0 0 2px}
.kfu-tl::before{content:"";position:absolute;left:4px;top:10px;bottom:16px;width:2px;border-radius:2px;background:linear-gradient(180deg,rgba(49,91,255,0.55),rgba(11,14,20,0.08))}
.kfu-t{position:relative;display:grid;grid-template-columns:10px minmax(0,1fr);column-gap:9px;padding:6px 0}
.kfu-d{position:relative;z-index:1;grid-row:1 / 3;align-self:start;margin-top:2px;width:10px;height:10px;border-radius:50%;background:#f3f5f7;border:2px solid #315bff}
.kfu-l1{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0}
.kfu-l1 b{font:600 12px/1 "Space Grotesk",Inter,sans-serif;color:#0b0e14;white-space:nowrap}
.kfu-t small{grid-column:2;margin-top:3px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:10px;color:rgba(21,28,40,0.55)}
.kfu-tag{display:inline-grid;align-items:center;height:18px;padding:0 6px;border-radius:5px;white-space:nowrap;font-style:normal;font:600 9px/18px Inter,sans-serif;color:rgba(21,28,40,0.75);background:rgba(11,14,20,0.07)}
.kfu-tag svg{width:10px;height:10px;margin:4px 0;stroke-width:3.2}
.kfu-g{color:#ffffff;background:#315bff}
.kfu-x{color:rgba(21,28,40,0.5);background:transparent;border:1px dashed rgba(11,14,20,0.2)}
.kfu-sw span{grid-area:1/1}
.kfu-s1.kfu-on{opacity:0;transition:opacity .25s ease}
.kfu-s2{opacity:0;color:#2449e0}
.kfu-s2.kfu-on{opacity:1;transition:opacity .35s ease .15s}
.kfu-win{margin:2px -6px;padding:6px;border-radius:9px;background:rgba(49,91,255,0.09);box-shadow:inset 0 0 0 1px rgba(49,91,255,0.32)}
.kfu-win .kfu-d{background:#315bff;box-shadow:0 0 8px #315bff}
.kfu-win small{color:#2449e0;font-weight:600}
.kfu-off.kfu-on{opacity:.5}
.kfu-off .kfu-d{border-color:rgba(11,14,20,0.25)}
.kxp[data-cur="5"] .kvc-wire{transform:scaleX(0);animation:none!important}
.kxp[data-cur="5"] .kvc-wire.kfu-on{transform:none;transition:transform .35s cubic-bezier(.65,0,.35,1)}
.kxp[data-cur="5"] .kvc-wire.kfu-out{opacity:0;transition:opacity .3s ease}
.kxp[data-cur="5"] .kvc-spark{animation:none!important;opacity:0}
.kxp[data-cur="5"] .kvc-spark.kfu-on{animation:kvcSpark .45s cubic-bezier(.4,0,.2,1)!important}
.kxp.run[data-cur="5"] .kxp-pops{animation:kvcFloat 4.5s ease-in-out 2.5s infinite alternate}
@media (prefers-reduced-motion:reduce){.kfu-fx{opacity:1;transform:none}.kfu-ghost,.kfu-in,.kfu-chip{display:none}.kfu-mail{transform:none}.kfu-ok{transform:none}.kfu-mark circle,.kfu-mark path{stroke-dashoffset:0}}

/* ===== v25: crm pill + follow-up buttons ===== */
.kxp-pops .kvc-kv b.kcc-st{color:#ffffff!important;background:#315bff!important}
.kfu-ok{height:334px!important}
.kfu-det{margin:12px 0 12px!important}
.kfu-btns{display:flex;flex-direction:column;gap:8px;width:100%}
.kfu-add,.kfu-resch{position:relative;display:flex!important;align-items:center;justify-content:center;gap:8px;width:100%;overflow:hidden;border-radius:13px;white-space:nowrap;font:600 12.5px/1 Inter,sans-serif}
.kfu-add svg,.kfu-resch svg{flex:none;width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.kfu-add{height:42px;margin:0;color:#ffffff;background:linear-gradient(180deg,#4f74ff 0%,#2449e0 100%);border:1px solid #315bff;
 box-shadow:0 14px 28px -14px rgba(49,91,255,0.95),inset 0 1px 0 rgba(11,14,20,0.45)}
.kfu-add::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:35%;background:linear-gradient(100deg,transparent,rgba(11,14,20,0.55),transparent);transform:skewX(-18deg);opacity:0}
.kfu-ok.kfu-on .kfu-add::after{animation:kfuShine .9s ease 1.3s}
.kfu-resch{height:38px;margin:0;color:rgba(21,28,40,0.9);background:rgba(11,14,20,0.05);border:1px solid rgba(11,14,20,0.12);box-shadow:inset 0 1px 0 rgba(11,14,20,0.06)}
.kfu-resch svg{color:#2449e0}
@keyframes kfuShine{0%{opacity:0;left:-40%}20%{opacity:1}100%{opacity:0;left:120%}}

/* ===== v26: reply card timing ===== */
.kxp-pops .krp-card.krp-on{animation:kvcReveal0 .75s cubic-bezier(.16,1,.3,1)!important}
.kxp-pops .krp-card.krp-on::after{transition:transform 2s cubic-bezier(.2,.8,.2,1) .95s!important}
@keyframes kvcReveal0{from{opacity:0;clip-path:inset(0 100% 0 0 round 16px);transform:perspective(800px) rotateY(-24deg) translateX(-14px) scale(.97)}
 to{opacity:1;clip-path:inset(0 0 0 0 round 16px)}}

/* ===== v27: reply card clean (same rhythm as the other cards) ===== */
.kxp-pops .krp-card:not(.krp-out){transition:none!important}
.kxp-pops .krp-card.krp-on{animation:kvcReveal .75s cubic-bezier(.16,1,.3,1)!important}

/* ===== v28: reply card reveal (starts invisible, no clip-path dependency) ===== */
.kxp-pops .krp-card.krp-on{animation:kvcIn2 .6s cubic-bezier(.16,1,.3,1)!important}
.kxp-pops .krp-card.krp-on .kvc-sweep{animation:kvcSweep .95s cubic-bezier(.4,0,.2,1) .35s both}
.kxp-pops .krp-card.krp-on::after{transition:transform 2s cubic-bezier(.2,.8,.2,1) .5s!important}
@keyframes kvcIn2{from{opacity:0;transform:perspective(800px) rotateY(-24deg) translateX(-18px) scale(.94)}}

/* ===== v29: reply card via Web Animations (CSS only sets the resting look) ===== */
.kxp-pops .krp-card,.kxp-pops .krp-card.krp-on{animation:none!important;transition:none!important}
.kxp-pops .krp-card .kvc-sweep{animation:none!important;transform:translateX(-115%)}
.kxp-pops .krp-card .krp-fx{transition:none!important}
.kxp-pops .krp-card::after{animation:none!important;transform:scaleX(0);transition:none!important}
.kxp-pops .krp-card.krp-bar::after{transform:none;transition:transform 2s cubic-bezier(.2,.8,.2,1) .5s!important}
.kxp-pops .krp-card .krp-s1,.kxp-pops .krp-card .krp-s2{transition:none!important}

/* from extra/kxopt.css: screen glare via transform */
.kxp-glare{background:none!important;animation:none!important;overflow:hidden}
.kxp-glare::before{content:"";position:absolute;top:0;left:0;width:260%;height:100%;pointer-events:none;background:linear-gradient(118deg,rgba(255,255,255,0) 34%,rgba(255,255,255,.35) 45%,rgba(255,255,255,0) 56%);transform:translate3d(-61.5385%,0,0);will-change:transform;animation:kxGlareT 9s ease-in-out infinite alternate}
@keyframes kxGlareT{from{transform:translate3d(-61.5385%,0,0)}to{transform:translate3d(0,0,0)}}
@media (prefers-reduced-motion:reduce){.kxp-glare::before{animation:none!important}}

/* silver body (like a silver iPhone): brushed aluminium edge, black bezel, light screen */
.kxp-l{background:linear-gradient(90deg,#b7bcc4 0%,#e9ecf0 22%,#cfd3d9 48%,#f8f9fb 78%,#a9aeb6 100%)!important}
.kxp-back{background:linear-gradient(135deg,#f1f3f6 0%,#d5d9df 55%,#bfc4cb 100%)!important}
.kxp-key{background:linear-gradient(180deg,#f2f4f7,#aeb3bb)!important}
.kxp-front{background:#0b0c0f!important;box-shadow:inset 0 0 0 1px #8f959e,inset 0 0 0 2.5px #f4f6f8,inset 0 0 0 3.5px #c4c9d0,inset 0 0 0 4.5px #9aa0a9,inset 0 0 0 5.5px #16181c!important}
.kxp-island{background:#050608!important;box-shadow:none!important}
.kxp-screen{background:#ffffff!important}
.kvc-g,.kal-ic--w{background:#ffffff!important;box-shadow:inset 0 0 0 .5px rgba(16,24,40,.16),0 1px 2px rgba(16,24,40,.08)!important}
.kvc-g{display:grid!important;grid-template-columns:1fr!important;place-items:center;padding:0!important}.kvc-g img{display:block;width:16px;height:16px}
.kal-ic--w img{width:14px;height:14px}
.kal-ic--app{overflow:hidden;background:none!important;box-shadow:0 1px 2px rgba(16,24,40,.12)!important}.kal-ic--app img{display:block;width:22px!important;height:22px!important}