/* =====================================================================
   kfp-motion.css — "Gilded Night" motion layer for the SaaS pages
   (pricing.html · account.html · admin.html) and their pop-ups.
   Same language as theme.css on the main app: aurora background,
   gradient-edge glass, pointer spotlight, staggered reveal, gold shimmer,
   spring pop-ups. Presentation only: no layout or text changes, and every
   effect is off under prefers-reduced-motion.
   Load AFTER the page's own <style>; pair with kfp-motion.js.
   ===================================================================== */
:root{
  --kfm-ease:cubic-bezier(.22,1,.36,1);
  --kfm-spring:cubic-bezier(.34,1.56,.64,1);
  --kfm-fill:linear-gradient(155deg,rgba(30,32,42,.80),rgba(13,14,20,.86));
  --kfm-edge:linear-gradient(140deg,rgba(255,224,138,.55),rgba(255,255,255,.07) 38%,rgba(232,190,70,.22) 100%);
}
@property --sp{syntax:"<number>";inherits:false;initial-value:0}

/* ---------- aurora background (kfp-motion.js inserts .kfm-aurora) ---------- */
body.kfm-on{background:#06070a!important}
.kfm-aurora{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;
  background:radial-gradient(1200px 600px at 50% -10%,rgba(232,190,70,.11),transparent 60%),#06070a}
.kfm-aurora i{position:absolute;border-radius:50%;opacity:.42;will-change:transform;contain:strict}
.kfm-aurora i:nth-child(1){width:46vmax;height:46vmax;left:-14vmax;top:-12vmax;
  background:radial-gradient(circle,rgba(232,190,70,.5),transparent 65%);animation:kfm-drift-a 26s ease-in-out infinite alternate}
.kfm-aurora i:nth-child(2){width:40vmax;height:40vmax;right:-14vmax;top:22vh;
  background:radial-gradient(circle,rgba(61,220,151,.22),transparent 65%);animation:kfm-drift-b 32s ease-in-out infinite alternate}
.kfm-aurora i:nth-child(3){width:38vmax;height:38vmax;left:10vw;bottom:-16vmax;
  background:radial-gradient(circle,rgba(124,92,255,.22),transparent 65%);animation:kfm-drift-c 29s ease-in-out infinite alternate}
.kfm-aurora::after{content:"";position:absolute;inset:0;opacity:.45;
  background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.2px);background-size:26px 26px;
  -webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000,transparent 75%);mask-image:radial-gradient(ellipse at 50% 30%,#000,transparent 75%)}
@keyframes kfm-drift-a{to{transform:translate3d(14vw,10vh,0) scale(1.15)}}
@keyframes kfm-drift-b{to{transform:translate3d(-12vw,-8vh,0) scale(1.1)}}
@keyframes kfm-drift-c{to{transform:translate3d(10vw,-12vh,0) scale(1.2)}}

/* ---------- gold shimmer titles ---------- */
.kfm-on .hero h1,.kfa-brand b{
  background:linear-gradient(100deg,#fff2b8 0%,#e8be46 35%,#fff2b8 55%,#c9962b 100%);background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  animation:kfm-shine 7s linear infinite}
@keyframes kfm-shine{to{background-position:-220% 0}}
.kfm-on .hero{position:relative}
.kfm-on .hero::after{content:"";display:block;width:80px;height:3px;margin:14px auto 0;border-radius:3px;
  background:linear-gradient(90deg,transparent,#e8be46,transparent);animation:kfm-breathe 3.2s ease-in-out infinite}
body.kfm-account .hero::after{margin-left:0}
@keyframes kfm-breathe{50%{width:140px;opacity:.7}}
.eyebrow,.kfa-role:not(.viewer){position:relative;overflow:hidden}
.eyebrow::after,.kfa-role:not(.viewer)::after{content:"";position:absolute;inset:0;transform:translateX(-120%);
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);animation:kfm-sweep 3.6s ease-in-out 1.2s infinite}
@keyframes kfm-sweep{to{transform:translateX(120%)}}

/* ---------- glass surfaces: gradient edge + pointer spotlight ---------- */
.plan,body.kfm-account .card,.kpi,.kfa-gate,.tbl-wrap,.kfm-glass{
  border:1px solid transparent!important;
  background:
    radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(255,214,120,calc(var(--sp) * .13)),transparent 46%) padding-box,
    var(--kfm-fill) padding-box,var(--kfm-edge) border-box!important;
  box-shadow:0 24px 50px -24px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.015),inset 0 1px 0 rgba(255,255,255,.06);
  transition:--sp .45s ease,transform .5s var(--kfm-ease),box-shadow .5s var(--kfm-ease)}
.plan:hover,body.kfm-account .card:hover,.kpi:hover,.tbl-wrap:hover{--sp:1}
body.kfm-account .card{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
@media(hover:hover){
  .plan:hover,.kpi:hover{transform:translateY(-4px);
    box-shadow:0 30px 56px -22px rgba(0,0,0,.9),0 0 36px -8px rgba(232,190,70,.28),inset 0 1px 0 rgba(255,255,255,.09)}
}
/* neon accent + soft orb on tiles (same as the app's result cards) */
.kpi,.plan{overflow:hidden}
.plan{overflow:visible}
.kpi::before{content:"";position:absolute;left:16px;top:0;width:30px;height:3px;border-radius:0 0 4px 4px;
  background:rgb(var(--ac,232,190,70));box-shadow:0 0 12px rgb(var(--ac,232,190,70));animation:kfm-neon 3s ease-in-out infinite}
.kpi.good{--ac:61,220,151}.kpi.warn{--ac:255,181,71}.kpi.bad{--ac:255,107,122}
.kpi:nth-child(3n+2)::before{animation-delay:-1s}.kpi:nth-child(3n)::before{animation-delay:-2s}
.kpi::after{content:"";position:absolute;right:-34px;top:-34px;width:110px;height:110px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(var(--ac,232,190,70),.2),transparent 70%);animation:kfm-orb 7s ease-in-out infinite alternate}
@keyframes kfm-neon{0%,100%{width:30px;opacity:.75}50%{width:56px;opacity:1;box-shadow:0 0 14px rgb(var(--ac,232,190,70)),0 0 26px rgba(var(--ac,232,190,70),.55)}}
@keyframes kfm-orb{to{transform:translate(-10px,12px) scale(1.25);opacity:.7}}

/* highlighted plan: rotating gold halo */
.plan.hl{isolation:isolate}
.plan.hl::before{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--kfm-a,0deg),rgba(232,190,70,.1),#ffe08a,rgba(232,190,70,.1) 30%,rgba(232,190,70,.1) 60%,#e8be46,rgba(232,190,70,.1));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:kfm-spin-a 6s linear infinite}
@property --kfm-a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes kfm-spin-a{to{--kfm-a:360deg}}
.plan.hl{box-shadow:0 30px 70px -30px rgba(232,190,70,.6),0 0 60px -20px rgba(232,190,70,.45)}
.badge{animation:kfm-bob 3.4s ease-in-out infinite}
@keyframes kfm-bob{50%{transform:translate(-50%,-3px)}}
.feats li{transition:transform .3s var(--kfm-spring)}
.plan:hover .feats li.y{transform:translateX(2px)}
.plan:hover .feats li.y:nth-child(2){transition-delay:.03s}.plan:hover .feats li.y:nth-child(3){transition-delay:.06s}
.plan:hover .feats li.y:nth-child(4){transition-delay:.09s}.plan:hover .feats li.y:nth-child(n+5){transition-delay:.12s}
.price b{text-shadow:0 0 26px rgba(232,190,70,.35)}

/* segmented toggles: sliding thumb (kfp-motion.js adds .kfm-thumb) */
.seg .kfm-thumb{position:absolute;z-index:0;top:4px;bottom:4px;left:0;border-radius:12px;pointer-events:none;
  background:linear-gradient(120deg,#ffe08a,#e8be46 62%,#c9962b);box-shadow:0 8px 20px -8px rgba(232,190,70,.8);
  transition:transform .45s var(--kfm-spring),width .45s var(--kfm-spring)}
.seg.kfm-slide button.on{background:transparent!important;box-shadow:none!important}

/* ---------- buttons: gold sweep, spring press, ripple ---------- */
.cta,.btn,.opt,.kfa-tab,.kfp-gc-btn,.kfp-pv-cta,.kfp-pv-ghost{position:relative;overflow:hidden;-webkit-tap-highlight-color:transparent}
.cta:not(.ghost),.btn.gold,.kfp-gc-btn.gold,.kfp-pv-cta{background-size:200% 100%!important;
  background-image:linear-gradient(110deg,#ffe08a 0%,#e8be46 45%,#c9962b 75%,#ffe08a 100%)!important;
  transition:background-position .6s var(--kfm-ease),transform .3s var(--kfm-spring),box-shadow .3s ease!important}
.cta:not(.ghost):hover:not(:disabled),.btn.gold:hover:not(:disabled),.kfp-gc-btn.gold:hover,.kfp-pv-cta:hover{background-position:100% 0!important;
  box-shadow:0 16px 34px -10px rgba(232,190,70,.95),inset 0 1px 0 rgba(255,255,255,.5)!important}
.cta:not(.ghost)::after,.btn.gold::after{content:"";position:absolute;inset:0;pointer-events:none;transform:translateX(-120%);
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%)}
.cta:not(.ghost):hover:not(:disabled)::after,.btn.gold:hover:not(:disabled)::after{animation:kfm-sweep .9s var(--kfm-ease)}
.plan.hl .cta:not(.ghost):not(:disabled){animation:kfm-cta 3.2s ease-in-out infinite}
@keyframes kfm-cta{50%{box-shadow:0 12px 34px -6px rgba(232,190,70,.95),inset 0 1px 0 rgba(255,255,255,.5)}}
.cta,.btn,.opt,.kfp-gc-btn{transition:transform .3s var(--kfm-spring),background .25s,border-color .25s,box-shadow .3s}
.cta:active:not(:disabled),.btn:active:not(:disabled),.opt:active:not(:disabled),.kfp-gc-btn:active{transform:scale(.96)!important}
.kfm-ripple{position:absolute;border-radius:50%;pointer-events:none;background:rgba(255,255,255,.45);transform:scale(0);animation:kfm-ripple .65s ease-out forwards}
.btn:not(.gold) .kfm-ripple,.cta.ghost .kfm-ripple,.opt .kfm-ripple,.kfa-tab .kfm-ripple{background:rgba(232,190,70,.35)}
@keyframes kfm-ripple{to{transform:scale(1);opacity:0}}
.opt:hover:not(:disabled){box-shadow:0 14px 30px -18px rgba(232,190,70,.6)}
.opt .tag.up{animation:kfm-glow 2.8s ease-in-out infinite}
@keyframes kfm-glow{50%{box-shadow:0 0 14px rgba(232,190,70,.75)}}

/* switch + status pills */
.pill.ok::before{animation:kfm-ping 2s ease-out infinite}
@keyframes kfm-ping{0%{box-shadow:0 0 0 0 rgba(61,220,151,.7)}80%,100%{box-shadow:0 0 0 7px rgba(61,220,151,0)}}
.sw.on{box-shadow:0 0 14px -2px rgba(61,220,151,.7)}

/* ---------- staggered reveal (kfp-motion.js tags .kfm-r / .in) ---------- */
.kfm-js .kfm-r:not(.in){opacity:0;transform:translateY(24px) scale(.985)}
.kfm-js .kfm-r.in{animation:kfm-rise .8s var(--kfm-ease) backwards;animation-delay:calc(var(--i,0) * 65ms)}
@keyframes kfm-rise{from{opacity:0;transform:translateY(24px) scale(.985)}}
/* values that change: soft blur-in + glow (same as the app's value flash) */
.kfm-flash{animation:kfm-flash .9s var(--kfm-ease)}
@keyframes kfm-flash{0%{opacity:.25;transform:translateY(6px);filter:blur(3px);text-shadow:0 0 18px rgba(255,224,138,.9)}
  60%{text-shadow:0 0 14px rgba(255,224,138,.5)}100%{opacity:1;transform:none;filter:none}}
/* lists that fill in */
.pays>.pay,.tbl tbody tr,.kfa-sec .bar,.legend>*{animation:kfm-pop .55s var(--kfm-ease) backwards}
.pays>.pay:nth-child(2),.tbl tbody tr:nth-child(2){animation-delay:.05s}
.pays>.pay:nth-child(3),.tbl tbody tr:nth-child(3){animation-delay:.1s}
.pays>.pay:nth-child(4),.tbl tbody tr:nth-child(4){animation-delay:.15s}
.pays>.pay:nth-child(n+5),.tbl tbody tr:nth-child(n+5){animation-delay:.2s}
@keyframes kfm-pop{from{opacity:0;transform:translateY(14px) scale(.97)}}
.opts>.opt{animation:kfm-up .4s var(--kfm-ease) backwards}
.opts>.opt:nth-child(2){animation-delay:.04s}.opts>.opt:nth-child(3){animation-delay:.08s}.opts>.opt:nth-child(n+4){animation-delay:.12s}
.alert,.co-status{animation:kfm-alert .6s var(--kfm-spring) both!important}
@keyframes kfm-alert{from{opacity:0;transform:translateY(-10px) scale(.97)}}
.alert>i{display:inline-block;animation:kfm-wiggle 2.6s ease-in-out 1s 2}
@keyframes kfm-wiggle{0%,100%{transform:none}20%{transform:rotate(-12deg) scale(1.1)}40%{transform:rotate(10deg)}60%{transform:rotate(-6deg)}}

/* skeleton: gold-tinted shimmer */
.sk{background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(255,224,138,.12),rgba(255,255,255,.04))!important;background-size:200% 100%!important}

/* ---------- admin console ---------- */
.kfa-top{background:rgba(6,7,10,.72)!important;-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}
.kfa-top::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(232,190,70,.6),transparent);background-size:200% 100%;animation:kfm-line 6s linear infinite}
@keyframes kfm-line{from{background-position:100% 0}to{background-position:-100% 0}}
.kfa-tabs{position:relative}
.kfa-tab{border-radius:12px 12px 0 0}
.kfa-tab[aria-selected="true"]{text-shadow:0 0 16px rgba(232,190,70,.55)}
.kfa-tabs .kfm-ink{position:absolute;bottom:-1px;left:0;height:2px;border-radius:2px;pointer-events:none;
  background:linear-gradient(90deg,#c9962b,#ffe08a,#c9962b);box-shadow:0 0 12px rgba(232,190,70,.8);
  transition:transform .5s var(--kfm-spring),width .5s var(--kfm-spring)}
.kfa-tabs.kfm-ink-on .kfa-tab[aria-selected="true"]{border-bottom-color:transparent!important}
[role="tabpanel"]:not([hidden]),.kfa-main>section:not([hidden]){animation:kfm-view .5s var(--kfm-ease)}
@keyframes kfm-view{from{opacity:0;transform:translateY(10px)}}
.kfa-gate{animation:kfm-modal .7s var(--kfm-spring) both}
.kfa-gate .ico{display:inline-block;animation:kfm-float 4s ease-in-out infinite;filter:drop-shadow(0 0 18px rgba(232,190,70,.6))}
@keyframes kfm-float{50%{transform:translateY(-6px)}}
.tbl tbody tr.click{transition:background .2s,transform .3s var(--kfm-spring)}
@media(hover:hover){.tbl tbody tr.click:hover{transform:translateX(3px)}}
.actbar span,.bar i{animation:kfm-grow 1.1s var(--kfm-ease) backwards;transform-origin:left}
@keyframes kfm-grow{from{transform:scaleX(0)}}
.toast{animation:kfm-toast .55s var(--kfm-spring)!important}
@keyframes kfm-toast{from{opacity:0;transform:translate(-50%,20px) scale(.92)}}

/* ---------- dialogs (account confirm, admin drawer + confirm) ---------- */
dialog{border:1px solid transparent!important;
  background:linear-gradient(160deg,rgba(32,34,46,.97),rgba(11,12,17,.98)) padding-box,var(--kfm-edge) border-box!important;
  box-shadow:0 40px 90px -20px rgba(0,0,0,.9),0 0 70px -14px rgba(232,190,70,.28),inset 0 1px 0 rgba(255,255,255,.07)!important}
dialog.drawer{border-width:0 0 0 1px!important}
dialog[open]:not(.drawer){animation:kfm-dlg .3s var(--kfm-ease)!important}
@keyframes kfm-dlg{from{opacity:0;transform:translateY(18px) scale(.96)}}
dialog.drawer[open]{animation:kfm-drawer .42s var(--kfm-ease)!important}
dialog::backdrop{background:radial-gradient(700px 460px at 50% 18%,rgba(232,190,70,.12),transparent 60%),rgba(4,5,8,.72);
  -webkit-backdrop-filter:blur(10px) saturate(140%);backdrop-filter:blur(10px) saturate(140%);animation:kfm-fade .35s ease}
dialog.drawer[open] .dr-sec{animation:kfm-up .4s var(--kfm-ease) backwards}
dialog.drawer[open] .dr-sec:nth-child(2){animation-delay:.04s}dialog.drawer[open] .dr-sec:nth-child(n+3){animation-delay:.08s}
@keyframes kfm-up{from{opacity:0;transform:translateY(12px)}}
@keyframes kfm-modal{from{opacity:0;transform:translateY(30px) scale(.94)}}
@keyframes kfm-drawer{from{opacity:0;transform:translateX(60px)}}
@keyframes kfm-fade{from{opacity:0}}

/* ---------- login / account pop-up (same look as the main app) ---------- */
#kfpAuthPanel{background:radial-gradient(700px 460px at 50% 18%,rgba(232,190,70,.14),transparent 60%),rgba(4,5,8,.8)!important;
  -webkit-backdrop-filter:blur(16px) saturate(140%)!important;backdrop-filter:blur(16px) saturate(140%)!important}
#kfpAuthPanel.open{animation:kfm-fade .35s ease both}
#kfpAuthPanel .kfp-auth-modal{position:relative;width:min(440px,100%);padding:32px 24px 24px;border-radius:32px;overflow:auto;
  border:1px solid transparent;
  background:linear-gradient(160deg,rgba(32,34,46,.94),rgba(11,12,17,.97)) padding-box,var(--kfm-edge) border-box;
  box-shadow:0 40px 90px -20px rgba(0,0,0,.9),0 0 70px -10px rgba(232,190,70,.28),inset 0 1px 0 rgba(255,255,255,.07);
  animation:kfm-modal .65s var(--kfm-spring) both}
#kfpAuthPanel .kfp-auth-modal::before{content:"";position:absolute;left:50%;top:-90px;width:300px;height:190px;transform:translateX(-50%);
  background:radial-gradient(circle,rgba(232,190,70,.42),transparent 70%);filter:blur(14px);pointer-events:none;animation:kfm-breathe2 5s ease-in-out infinite}
@keyframes kfm-breathe2{50%{transform:translateX(-50%) scale(1.12);opacity:.6}}
#kfpAuthPanel .kfp-auth-modal>*{position:relative}
#kfpAuthPanel.open .kfp-auth-modal>*{animation:kfm-pop .6s var(--kfm-ease) backwards}
#kfpAuthPanel.open .kfp-auth-modal>*:nth-child(2){animation-delay:.07s}
#kfpAuthPanel.open .kfp-auth-modal>*:nth-child(3){animation-delay:.14s}
#kfpAuthPanel.open .kfp-auth-modal>*:nth-child(4){animation-delay:.2s}
#kfpAuthPanel.open .kfp-auth-modal>*:nth-child(n+5){animation-delay:.26s}
#kfpAuthPanel .kfp-auth-modal h2{margin:0 0 6px;text-align:center;font-size:25px;font-weight:700;color:#ffe08a;text-shadow:0 0 30px rgba(232,190,70,.5);border:0}
#kfpAuthPanel .kfp-auth-modal p{margin:0 0 20px;text-align:center;color:#a6a296;font-size:14px}
#kfpAuthPanel .kfp-auth-modal label{margin:14px 0 8px;color:#e9cd7a;font-size:13.5px;font-weight:500;letter-spacing:.2px}
#kfpAuthPanel .kfp-auth-modal input{min-height:54px;padding:13px 16px;border-radius:18px;margin:0;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:#fff;font-size:16px;transition:border-color .25s,background .25s,box-shadow .3s}
#kfpAuthPanel .kfp-auth-modal input::placeholder{color:#6f6c63}
#kfpAuthPanel .kfp-auth-modal input:focus{border-color:#e8be46;background:rgba(232,190,70,.07);
  box-shadow:0 0 0 4px rgba(232,190,70,.16),0 10px 28px -12px rgba(232,190,70,.6)}
#kfpAuthPanel .kfp-auth-modal button{min-height:52px;border-radius:18px;font-size:15px;font-weight:600;color:#1a1300;
  background:linear-gradient(110deg,#ffe08a 0%,#e8be46 45%,#c9962b 75%,#ffe08a 100%);background-size:220% 100%;
  box-shadow:0 12px 26px -10px rgba(232,190,70,.7),inset 0 1px 0 rgba(255,255,255,.5);
  transition:background-position .6s var(--kfm-ease),transform .3s var(--kfm-spring),box-shadow .3s ease}
#kfpAuthPanel .kfp-auth-modal button:hover{background-position:100% 0}
#kfpAuthPanel .kfp-auth-modal button:active{transform:scale(.96)}
#kfpAuthPanel .kfp-auth-row{gap:12px;margin-top:20px}
#kfpAuthPanel .kfp-auth-row button{padding:12px 8px}
#kfpAuthPanel .kfp-auth-modal .kfp-auth-secondary{background:rgba(255,255,255,.05)!important;color:#f5f2ea!important;
  border:1px solid rgba(255,255,255,.14)!important;box-shadow:none!important}
#kfpAuthPanel .kfp-auth-modal .kfp-auth-secondary:hover{background:rgba(255,255,255,.1)!important}
#kfpAuthPanel .kfp-auth-modal .kfp-auth-danger{background:rgba(255,107,122,.1)!important;color:#ff9aa5!important;
  border:1px solid rgba(255,107,122,.5)!important;box-shadow:none!important}
#kfpAuthPanel .kfp-auth-account{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 6px;padding:16px;border-radius:22px;
  font-size:16px;background:linear-gradient(135deg,rgba(232,190,70,.16),rgba(255,255,255,.03));border:1px solid rgba(232,190,70,.4);
  box-shadow:0 0 30px -10px rgba(232,190,70,.5)}
#kfpAuthPanel .kfp-auth-account b{color:#fff;font-size:18px}
#kfpAuthPanel .kfp-cloud-upload{margin-top:20px;padding:16px;border-radius:22px;border:1px dashed rgba(232,190,70,.45);background:rgba(232,190,70,.06)}
#kfpAuthPanel .kfp-small{text-align:left;font-size:12px;color:#8d897e!important;margin:12px 0 0!important}
#kfpAuthPanel .kfp-auth-status:not(:empty){margin-top:16px;padding:11px 14px;border-radius:14px;font-size:13.5px;text-align:center;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);animation:kfm-alert .5s var(--kfm-spring)}
#kfpAuthPanel .kfp-auth-status.ok{background:rgba(61,220,151,.1);border-color:rgba(61,220,151,.35);color:#3ddc97}
#kfpAuthPanel .kfp-auth-status.error{background:rgba(255,107,122,.1);border-color:rgba(255,107,122,.4);color:#ff6b7a}

/* ---------- reduced motion: everything still, nothing hidden ---------- */
@media(prefers-reduced-motion:reduce){
  .kfm-aurora i,.kfm-on .hero h1,.kfa-brand b,.kfm-on .hero::after,.eyebrow::after,.kfa-role::after,.kpi::before,.kpi::after,.plan.hl::before,.badge,
  .plan.hl .cta,.opt .tag.up,.pill.ok::before,.kfa-top::after,.kfa-gate .ico,.alert>i,.kfm-ripple{animation:none!important}
  .kfm-js .kfm-r:not(.in){opacity:1;transform:none}
  .kfm-r.in,.kfm-flash,.opts>.opt,.pays>.pay,.tbl tbody tr,.kfa-sec .bar,.legend>*,.alert,.co-status,[role="tabpanel"],.kfa-main>section,.kfa-gate,
  .actbar span,.bar i,.toast,dialog,dialog::backdrop,dialog *,#kfpAuthPanel,#kfpAuthPanel *{animation:none!important}
  .plan:hover,.kpi:hover,.tbl tbody tr.click:hover{transform:none}
  .seg .kfm-thumb,.kfa-tabs .kfm-ink{transition:none}
}
