
/* ==========================================================
   KAGENIX INVESTOR UI v2.0.0 — SHOWCASE MODE
   Neo-Manga / Cyber Japan / Premium Product Presentation
   VISUAL ONLY
   ========================================================== */

:root{
  --kx-bg:#05060a;
  --kx-bg2:#090b12;
  --kx-card:#10131c;
  --kx-card2:#151925;
  --kx-line:rgba(255,255,255,.09);
  --kx-line2:rgba(255,255,255,.17);
  --kx-text:#f7f8fb;
  --kx-muted:#8f96a6;
  --kx-red:#ff2f55;
  --kx-pink:#ff6b86;
  --kx-violet:#8b5cf6;
  --kx-blue:#4cc9ff;
  --kx-gold:#e9be66;
  --kx-shadow:0 28px 100px rgba(0,0,0,.5);
}

html.kgx-investor-mode,body.kgx-investor-mode{
  background:var(--kx-bg)!important;
  color:var(--kx-text)!important;
}
body.kgx-investor-mode{
  overflow-x:hidden!important;
}
#kagenix-app{
  position:relative!important;
  background:
    radial-gradient(900px 540px at 88% -7%,rgba(255,47,85,.15),transparent 57%),
    radial-gradient(760px 520px at 2% 20%,rgba(139,92,246,.08),transparent 56%),
    linear-gradient(180deg,#05060a 0%,#070910 45%,#05060a 100%)!important;
  color:var(--kx-text)!important;
  overflow:hidden!important;
}
#kagenix-app:before{
  content:"";
  position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.16;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 80%);
}
#kagenix-app>*{position:relative;z-index:1}
#kagenix-app *{box-sizing:border-box}

/* ---------- Header ---------- */
#kagenix-app .kgx-header{
  height:82px!important;
  padding:0 clamp(18px,5vw,74px)!important;
  position:sticky!important;top:0!important;z-index:120!important;
  display:flex!important;align-items:center!important;gap:26px!important;
  background:rgba(5,6,10,.72)!important;
  border-bottom:1px solid rgba(255,255,255,.065)!important;
  backdrop-filter:blur(22px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(150%)!important;
}
#kagenix-app .kgx-brand span{
  width:44px!important;height:44px!important;border-radius:15px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.22),transparent 36%),
    linear-gradient(145deg,#ff667f,#ff244e)!important;
  box-shadow:0 12px 34px rgba(255,47,85,.28),inset 0 0 0 1px rgba(255,255,255,.18)!important;
}
#kagenix-app .kgx-brand b{
  font-size:17px!important;letter-spacing:-.03em!important
}
#kagenix-app .kgx-brand small{
  color:#727989!important;letter-spacing:2.8px!important
}
#kagenix-app .kgx-header nav{
  padding:5px!important;border:1px solid rgba(255,255,255,.07)!important;
  background:rgba(255,255,255,.025)!important;border-radius:14px!important;
}
#kagenix-app .kgx-header nav a{
  min-height:36px!important;padding:8px 13px!important;border-radius:10px!important;
  color:#a9afbd!important;text-decoration:none!important;font-size:12px!important;
}
#kagenix-app .kgx-header nav a:hover{
  background:rgba(255,255,255,.06)!important;color:#fff!important
}
#kagenix-app .kgx-ghost{
  border:1px solid rgba(255,255,255,.12)!important;
  background:linear-gradient(145deg,#181b25,#10131a)!important;
  color:#fff!important;border-radius:13px!important;
  box-shadow:0 10px 30px rgba(0,0,0,.22)!important
}

/* ---------- Hero ---------- */
#kagenix-app .kgx-hero{
  position:relative!important;
  min-height:calc(100svh - 82px)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr)!important;
  align-items:center!important;
  gap:clamp(36px,6vw,88px)!important;
  padding:clamp(56px,7vw,110px) clamp(24px,7vw,108px)!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
#kagenix-app .kgx-hero:before{
  content:"";
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(5,6,10,.98) 0%,rgba(5,6,10,.82) 36%,rgba(5,6,10,.24) 70%,rgba(5,6,10,.05) 100%)!important;
}
#kagenix-app .kgx-hero:after{
  content:"影";
  position:absolute;right:-2vw;top:5vh;z-index:0;
  font-size:min(42vw,620px);line-height:.8;font-weight:900;
  color:rgba(255,255,255,.018);
  transform:rotate(-7deg);
}
#kagenix-app .kgx-hero-copy{
  position:relative!important;z-index:5!important;max-width:820px!important
}
#kagenix-app .kgx-kicker{
  display:inline-flex!important;align-items:center!important;
  min-height:34px!important;padding:7px 12px!important;border-radius:999px!important;
  background:linear-gradient(90deg,rgba(255,47,85,.11),rgba(139,92,246,.08))!important;
  border:1px solid rgba(255,79,111,.28)!important;
  color:#ff8ca0!important;font-size:10px!important;font-weight:900!important;
  letter-spacing:.06em!important
}
#kagenix-app .kgx-hero h1{
  max-width:900px!important;
  margin:18px 0 22px!important;
  font-size:clamp(52px,7.4vw,104px)!important;
  line-height:.98!important;
  letter-spacing:-.065em!important;
  text-wrap:balance!important;
  text-shadow:0 12px 50px rgba(0,0,0,.35)!important
}
#kagenix-app .kgx-hero h1 em{
  display:inline-block!important;
  margin-top:8px!important;
  font-style:normal!important;
  color:transparent!important;
  background:linear-gradient(90deg,#ff6b86 0%,#ff3158 38%,#b05cff 100%)!important;
  -webkit-background-clip:text!important;background-clip:text!important
}
#kagenix-app .kgx-hero p{
  max-width:700px!important;margin:0 0 28px!important;
  color:#b8bdc8!important;font-size:clamp(15px,1.45vw,19px)!important;
  line-height:2!important
}
#kagenix-app .kgx-primary{
  min-height:54px!important;padding:13px 22px!important;border:0!important;
  border-radius:15px!important;color:#fff!important;font-weight:950!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.13),transparent 55%),
    linear-gradient(135deg,#ff5f79,#ff2f55 62%,#d91e48)!important;
  box-shadow:0 16px 44px rgba(255,47,85,.26),inset 0 0 0 1px rgba(255,255,255,.12)!important;
  transition:.18s ease!important
}
#kagenix-app .kgx-primary:hover{
  transform:translateY(-2px)!important;filter:brightness(1.07)!important
}
#kagenix-app .kgx-hero-art{
  position:relative!important;z-index:2!important;
  height:min(74vh,760px)!important;min-height:520px!important;
  border-radius:36px!important;overflow:hidden!important;
  border:1px solid rgba(255,255,255,.14)!important;
  box-shadow:
    0 50px 140px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,47,85,.06)!important;
  transform:perspective(1200px) rotateY(-4deg) rotateX(1deg)!important
}
#kagenix-app .kgx-hero-art:before{
  content:"";
  position:absolute;inset:0;z-index:3;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.06),transparent 18%),
    linear-gradient(0deg,rgba(5,6,10,.74),transparent 42%);
}
#kagenix-app .kgx-hero-art:after{
  content:"KAGENIX / 01";
  position:absolute;left:18px;bottom:18px;z-index:4;
  padding:7px 10px;border-radius:999px;
  background:rgba(5,6,10,.58);border:1px solid rgba(255,255,255,.13);
  color:#cbd0db;font-size:9px;letter-spacing:.18em;
  backdrop-filter:blur(12px)
}

/* orbit decoration */
.ki-orbit{position:absolute;inset:0;z-index:0;pointer-events:none}
.ki-orbit i{
  position:absolute;border:1px solid rgba(255,255,255,.035);
  border-radius:50%
}
.ki-orbit i:nth-child(1){width:620px;height:620px;right:-180px;top:-170px}
.ki-orbit i:nth-child(2){width:420px;height:420px;right:-80px;top:-70px;border-color:rgba(255,47,85,.07)}
.ki-orbit i:nth-child(3){width:220px;height:220px;right:20px;top:30px;border-color:rgba(139,92,246,.08)}

.ki-hero-meta{
  position:absolute;z-index:6;left:clamp(24px,7vw,108px);bottom:34px;
  display:flex;gap:8px
}
.ki-hero-meta span{
  min-width:136px;padding:10px 13px;border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(12,14,20,.62);backdrop-filter:blur(14px)
}
.ki-hero-meta b{display:block;font-size:9px;letter-spacing:.11em;color:#fff}
.ki-hero-meta small{display:block;margin-top:3px;color:#777f8e;font-size:8px}

/* ---------- Showcase sections ---------- */
#kagenix-app .kgx-section{
  position:relative!important;
  padding:clamp(80px,9vw,138px) clamp(24px,7vw,108px)!important;
  border-top:1px solid rgba(255,255,255,.035)!important
}
#kagenix-app .kgx-section>h2{
  max-width:860px!important;
  font-size:clamp(38px,5vw,72px)!important;
  line-height:1.1!important;letter-spacing:-.052em!important;
  margin:18px 0 46px!important
}
#kagenix-app .kgx-panels{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important
}
#kagenix-app .kgx-panels article{
  position:relative!important;overflow:hidden!important;
  min-height:280px!important;padding:28px!important;border-radius:25px!important;
  border:1px solid var(--kx-line)!important;
  background:
    radial-gradient(360px 220px at 100% 0,rgba(255,47,85,.09),transparent 58%),
    linear-gradient(145deg,#151925,#0d1017)!important;
  box-shadow:0 18px 58px rgba(0,0,0,.22)!important;
  transition:.2s ease!important
}
#kagenix-app .kgx-panels article:first-child{
  grid-row:auto!important;
  min-height:280px!important;
  background:
    radial-gradient(360px 220px at 100% 0,rgba(139,92,246,.10),transparent 58%),
    radial-gradient(300px 180px at 0 100%,rgba(255,47,85,.07),transparent 62%),
    linear-gradient(145deg,#171b28,#0d1017)!important
}
#kagenix-app .kgx-panels article:hover{
  transform:translateY(-4px)!important;border-color:rgba(255,255,255,.17)!important
}
#kagenix-app .kgx-panels article>b{
  color:#ff7e95!important;font-size:10px!important;letter-spacing:.08em!important
}
#kagenix-app .kgx-panels h3{
  margin:38px 0 10px!important;font-size:clamp(22px,2.2vw,30px)!important
}
#kagenix-app .kgx-panels p{color:#949baa!important;line-height:1.9!important}
#kagenix-app .kgx-steps{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  counter-reset:kgx-step!important;
}
#kagenix-app .kgx-steps:before{
  content:"";
  position:absolute;
  top:37px;
  right:10%;
  left:10%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.18) 18%,rgba(255,47,85,.35) 50%,rgba(255,255,255,.18) 82%,transparent);
  z-index:0;
}
#kagenix-app .kgx-steps div{
  counter-increment:kgx-step!important;
  position:relative!important;
  min-height:190px!important;
  padding:76px 22px 22px!important;
  border:0!important;
  border-radius:22px!important;
  background:
    radial-gradient(240px 140px at 50% 0,rgba(255,47,85,.07),transparent 66%),
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012))!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)!important;
  overflow:visible!important;
  text-align:center!important;
  z-index:1!important;
}
#kagenix-app .kgx-steps div:before{
  content:"0" counter(kgx-step);
  position:absolute;
  top:14px;
  left:50%;
  transform:translateX(-50%);
  width:48px;
  height:48px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:
    linear-gradient(145deg,rgba(255,255,255,.12),transparent 45%),
    linear-gradient(145deg,#1b1f2b,#11141b);
  border:1px solid rgba(255,255,255,.12);
  color:#ff7890;
  font-size:11px;
  font-weight:950;
  letter-spacing:.08em;
  box-shadow:0 10px 26px rgba(0,0,0,.24);
}
#kagenix-app .kgx-steps i{
  display:none!important;
}
#kagenix-app .kgx-steps h3{
  position:static!important;
  margin:0!important;
  font-size:20px!important;
  line-height:1.55!important;
  color:#fff!important;
  letter-spacing:-.025em!important;
}
#kagenix-app details{
  margin:10px 0!important;border-radius:17px!important;
  border:1px solid var(--kx-line)!important;background:#10131b!important;
  overflow:hidden!important
}
#kagenix-app summary{padding:18px 20px!important;font-weight:850!important}

/* ---------- Dashboard ---------- */
#kagenix-app .kgx-dashboard{
  background:var(--kx-bg)!important;
  grid-template-columns:270px minmax(0,1fr)!important
}
#kagenix-app .kgx-dashboard aside{
  position:relative!important;
  padding:20px 14px!important;gap:5px!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.025),transparent 15%),
    linear-gradient(180deg,#10131b,#090b10)!important;
  border-left:1px solid rgba(255,255,255,.065)!important;
  overflow-y:auto!important;scrollbar-width:none!important
}
#kagenix-app .kgx-dashboard aside:after{
  content:"";
  position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--kx-red),var(--kx-violet),transparent)
}
#kagenix-app .kgx-dashboard aside::-webkit-scrollbar{display:none!important}
#kagenix-app .kgx-dashboard aside .kgx-brand{
  margin:4px 6px 22px!important;padding-bottom:20px!important;
  border-bottom:1px solid var(--kx-line)!important
}
#kagenix-app .kgx-dashboard aside button,
#kagenix-app .kgx-dashboard aside a{
  display:flex!important;align-items:center!important;
  min-height:46px!important;padding:10px 13px!important;border-radius:13px!important;
  color:#9aa1b0!important;font-size:12px!important;text-align:right!important;
  transition:.16s ease!important
}
#kagenix-app .kgx-dashboard aside button:hover,
#kagenix-app .kgx-dashboard aside a:hover,
#kagenix-app .kgx-dashboard aside .ki-active{
  color:#fff!important;
  background:
    linear-gradient(90deg,rgba(255,47,85,.14),rgba(139,92,246,.05))!important;
  box-shadow:
    inset 3px 0 0 var(--kx-red),
    inset 0 0 0 1px rgba(255,255,255,.03)!important
}
#kagenix-app .kgx-workspace{
  position:relative!important;
  padding:72px clamp(28px,4.8vw,72px) 70px!important;
  background:
    radial-gradient(700px 430px at 88% -3%,rgba(255,47,85,.06),transparent 58%),
    radial-gradient(600px 400px at 8% 100%,rgba(139,92,246,.035),transparent 60%),
    #070910!important
}
.ki-product-badge{
  position:absolute;top:22px;right:clamp(28px,4.8vw,72px);
  display:flex;align-items:center;gap:7px;
  min-height:30px;padding:6px 9px;border-radius:999px;
  border:1px solid rgba(255,255,255,.075);
  background:rgba(15,18,25,.72);backdrop-filter:blur(12px);
  color:#aab0bd;font-size:8px;letter-spacing:.08em
}
.ki-product-badge span{
  width:7px;height:7px;border-radius:50%;background:#42df9a;
  box-shadow:0 0 16px rgba(66,223,154,.7)
}
.ki-product-badge b{color:#fff;font-size:8px}
.ki-product-badge small{color:#69707d;font-size:7px}
#kagenix-app #kgx-view{
  width:100%!important;max-width:1260px!important;margin:0 auto!important
}
#kagenix-app #kgx-view>h1,
#kagenix-app #kgx-view section>h1{
  font-size:clamp(34px,4vw,56px)!important;
  line-height:1.15!important;letter-spacing:-.045em!important
}
#kagenix-app #kgx-view h2{letter-spacing:-.03em!important}

/* cards */
#kagenix-app .kgx-card,
#kagenix-app .kgx-lore-item,
#kagenix-app .kgx-story,
#kagenix-app .kgx2-wallet,
#kagenix-app .kgx2-list article,
#kagenix-app .kgx2-ref,
#kagenix-app .kgx2-story-hero,
#kagenix-app .kgx2-story-buy,
#kagenix-app .kgx4-product,
#kagenix-app .kgx4-order,
#kagenix-app .kgx5-shell,
#kagenix-app .kgx5-form,
#kagenix-app .kgx5-quest,
#kagenix-app .kgx5-story,
#kagenix-app .kgx5-lore{
  border:1px solid rgba(255,255,255,.085)!important;
  border-radius:22px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),transparent 32%),
    linear-gradient(145deg,#141824,#0e1118)!important;
  box-shadow:0 18px 60px rgba(0,0,0,.20)!important
}
#kagenix-app .kgx-card{
  overflow:hidden!important;transition:.18s ease!important
}
#kagenix-app .kgx-card:hover{
  transform:translateY(-3px) scale(1.005)!important;
  border-color:rgba(255,255,255,.16)!important
}
#kagenix-app .kgx-card img,
#kagenix-app .kgx-result-image{
  border-radius:18px!important
}

/* wallet */
#kagenix-app .kgx2-wallet{
  position:relative!important;overflow:hidden!important;
  padding:34px!important;
  background:
    radial-gradient(520px 280px at 95% 0,rgba(255,47,85,.17),transparent 55%),
    radial-gradient(380px 220px at 10% 100%,rgba(139,92,246,.08),transparent 58%),
    linear-gradient(145deg,#171b28,#0d1017)!important
}
#kagenix-app .kgx2-wallet:after{
  content:"WALLET";position:absolute;left:20px;bottom:-12px;
  font-size:72px;font-weight:950;letter-spacing:-.05em;color:rgba(255,255,255,.025)
}
#kagenix-app .kgx2-wallet strong{
  font-size:clamp(40px,5.5vw,64px)!important;letter-spacing:-.05em!important
}

/* shahnameh */
#kagenix-app .kgx5-main-menu:before{
  content:"✦";color:var(--kx-gold)!important;margin-left:8px!important
}
#kagenix-app .kgx5-shell,
#kagenix-app .kgx5-form,
#kagenix-app .kgx5-quest{
  border-color:rgba(233,190,102,.20)!important;
  background:
    radial-gradient(420px 250px at 100% 0,rgba(233,190,102,.08),transparent 60%),
    linear-gradient(145deg,#17150f,#0f1117)!important
}
#kagenix-app .kgx5-charpick{
  border:1px solid var(--kx-line)!important;
  border-radius:16px!important;background:#12151d!important
}
#kagenix-app .kgx5-charpick.active{
  border-color:rgba(233,190,102,.52)!important;
  box-shadow:0 0 0 3px rgba(233,190,102,.07)!important
}

/* forms */
#kagenix-app input,
#kagenix-app select,
#kagenix-app textarea{
  min-height:48px!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:13px!important;
  background:#0a0d13!important;
  color:#fff!important;
  padding:11px 13px!important;
  outline:none!important
}
#kagenix-app input:focus,
#kagenix-app select:focus,
#kagenix-app textarea:focus{
  border-color:rgba(255,47,85,.52)!important;
  box-shadow:0 0 0 4px rgba(255,47,85,.07)!important
}

/* modal */
#kagenix-app .kgx-modal{
  background:rgba(3,4,7,.80)!important;
  backdrop-filter:blur(14px)!important
}
#kagenix-app .kgx-auth{
  width:min(94vw,480px)!important;padding:34px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:28px!important;
  background:
    radial-gradient(380px 220px at 100% 0,rgba(255,47,85,.10),transparent 58%),
    linear-gradient(145deg,#171b26,#0c0f15)!important;
  box-shadow:0 40px 120px rgba(0,0,0,.55)!important
}

/* footer */
#kagenix-app footer{
  padding:54px clamp(24px,7vw,108px)!important;
  border-top:1px solid rgba(255,255,255,.06)!important;
  background:#05060a!important
}

/* ---------- Mobile ---------- */
@media(max-width:800px){
  #kagenix-app .kgx-header{
    height:64px!important;padding:0 12px!important
  }
  #kagenix-app .kgx-header nav{display:none!important}

  #kagenix-app .kgx-hero{
    min-height:calc(100svh - 64px)!important;
    display:flex!important;align-items:flex-end!important;
    padding:20px 14px 28px!important
  }
  #kagenix-app .kgx-hero:before{
    background:
      linear-gradient(180deg,rgba(5,6,10,.10) 0%,rgba(5,6,10,.28) 42%,rgba(5,6,10,.98) 75%)!important
  }
  #kagenix-app .kgx-hero-art{
    position:absolute!important;inset:0!important;
    height:auto!important;min-height:0!important;
    border:0!important;border-radius:0!important;
    transform:none!important;box-shadow:none!important
  }
  #kagenix-app .kgx-hero-copy{
    width:100%!important;padding-top:50svh!important
  }
  #kagenix-app .kgx-hero h1{
    font-size:clamp(38px,11.5vw,54px)!important;
    line-height:1.02!important;margin:12px 0 14px!important
  }
  #kagenix-app .kgx-hero p{font-size:13px!important;line-height:1.85!important}
  #kagenix-app .kgx-primary{width:100%!important}
  .ki-hero-meta{display:none!important}
  .ki-orbit{display:none!important}

  #kagenix-app .kgx-section{padding:64px 14px!important}
  #kagenix-app .kgx-section>h2{
    font-size:34px!important;line-height:1.18!important;margin-bottom:26px!important
  }
  #kagenix-app .kgx-panels{
    grid-template-columns:1fr!important
  }
  #kagenix-app .kgx-panels article,
  #kagenix-app .kgx-panels article:first-child{
    grid-row:auto!important;min-height:220px!important
  }
  #kagenix-app .kgx-steps{
    grid-template-columns:1fr!important
  }
  #kagenix-app .kgx-steps div{min-height:180px!important}

  /* mobile dashboard = app presentation */
  #kagenix-app .kgx-dashboard{
    display:block!important;min-height:100svh!important
  }
  #kagenix-app .kgx-dashboard[hidden]{display:none!important}
  #kagenix-app .kgx-workspace{
    height:100svh!important;
    padding:52px 11px 104px!important;
    overflow-y:auto!important;overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    background:
      radial-gradient(420px 240px at 88% 0,rgba(255,47,85,.06),transparent 58%),
      #070910!important
  }
  .ki-product-badge{
    top:12px!important;right:12px!important
  }
  #kagenix-app .kgx-dashboard aside{
    position:fixed!important;
    inset:auto 8px calc(7px + env(safe-area-inset-bottom)) 8px!important;
    width:auto!important;height:72px!important;
    display:flex!important;flex-direction:row!important;align-items:center!important;
    padding:7px!important;gap:5px!important;
    overflow-x:auto!important;overflow-y:hidden!important;
    border:1px solid rgba(255,255,255,.11)!important;
    border-radius:22px!important;
    background:rgba(12,14,20,.95)!important;
    backdrop-filter:blur(20px) saturate(140%)!important;
    box-shadow:0 18px 56px rgba(0,0,0,.46)!important;
    z-index:1000!important;scrollbar-width:none!important
  }
  #kagenix-app .kgx-dashboard aside::-webkit-scrollbar{display:none!important}
  #kagenix-app .kgx-dashboard aside .kgx-brand{display:none!important}
  #kagenix-app .kgx-dashboard aside button,
  #kagenix-app .kgx-dashboard aside a{
    flex:0 0 auto!important;
    min-width:82px!important;max-width:100px!important;
    height:56px!important;min-height:56px!important;
    padding:6px 8px!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
    text-align:center!important;white-space:normal!important;
    font-size:9.5px!important;line-height:1.25!important;
    border-radius:14px!important;
    box-shadow:none!important
  }
  #kagenix-app .kgx-dashboard aside .ki-active{
    background:linear-gradient(145deg,rgba(255,47,85,.14),rgba(139,92,246,.06))!important;
    box-shadow:inset 0 0 0 1px rgba(255,47,85,.18)!important
  }
  #kagenix-app #kgx-view{padding:0!important;max-width:none!important}
  #kagenix-app #kgx-view h1{
    font-size:29px!important;line-height:1.22!important;padding-left:40px!important
  }
  #kagenix-app .kgx-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  #kagenix-app .kgx-card{border-radius:16px!important}
  #kagenix-app .kgx5-actions,
  #kagenix-app .kgx2-vipcards,
  #kagenix-app .kgx4-products{
    grid-template-columns:1fr!important
  }
}

@media(max-width:430px){
  #kagenix-app .kgx-grid{grid-template-columns:1fr!important}
  #kagenix-app .kgx-hero h1{font-size:38px!important}
}

@media(prefers-reduced-motion:reduce){
  #kagenix-app *,#kagenix-app *::before,#kagenix-app *::after{
    animation:none!important;transition:none!important
  }
}

/* v2.1.3 launch additions */
#kagenix-app .kgx-example-showcase .kgx-panels{grid-template-columns:1fr!important}
#kagenix-app .kgx-example-showcase .kgx-panels article{min-height:160px!important}
#kagenix-app .kgx-price-card .kgx-primary{width:100%!important}
@media(max-width:800px){#kagenix-app .kgx-dashboard aside:before{content:'منوها';position:sticky;right:0;z-index:4;flex:0 0 auto;align-self:center;padding:7px 8px;border-radius:10px;background:#ff3150;color:#fff;font-size:9px;font-weight:900;box-shadow:8px 0 16px #0c0e14}#kagenix-app .kgx-dashboard aside button,#kagenix-app .kgx-dashboard aside a{font-size:11px!important;color:#d8dbe4!important;border:1px solid rgba(255,255,255,.08)!important;background:rgba(255,255,255,.035)!important;scroll-snap-align:start!important}#kagenix-app .kgx-dashboard aside{scroll-snap-type:x proximity!important}#kagenix-app .kgx-dashboard aside .ki-active{color:#fff!important;border-color:rgba(255,47,85,.55)!important;background:linear-gradient(145deg,rgba(255,47,85,.28),rgba(139,92,246,.12))!important}}

/* v2.1.0 FAQ — full width, clean editorial accordion */
#kagenix-app #faq{
  width:100%!important;
  max-width:none!important;
}
#kagenix-app #faq>h2{
  max-width:none!important;
  width:100%!important;
  text-align:right!important;
  margin-bottom:30px!important;
}
#kagenix-app #faq details{
  width:100%!important;
  max-width:none!important;
  margin:0 0 10px!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:16px!important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.025),transparent 65%),
    #0f1219!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
#kagenix-app #faq summary{
  position:relative!important;
  width:100%!important;
  padding:20px 22px!important;
  text-align:right!important;
  font-size:15px!important;
  font-weight:850!important;
  color:#f4f5f8!important;
  cursor:pointer!important;
  list-style:none!important;
}
#kagenix-app #faq summary::-webkit-details-marker{display:none!important}
#kagenix-app #faq summary:after{
  content:"+";
  position:absolute;
  left:20px;
  top:50%;
  transform:translateY(-50%);
  width:28px;height:28px;
  display:grid;place-items:center;
  border-radius:9px;
  background:#171b24;
  border:1px solid rgba(255,255,255,.08);
  color:#ff6d84;
  font-size:17px;
}
#kagenix-app #faq details[open] summary:after{content:"−"}
#kagenix-app #faq details p{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0 22px 20px!important;
  text-align:right!important;
  color:#9aa1af!important;
  line-height:2!important;
  font-size:13px!important;
}

/* Equal showcase cards */
#kagenix-app .kgx-panels article,
#kagenix-app .kgx-panels article:first-child{
  min-height:280px!important;
  grid-row:auto!important;
}

/* mobile refinements */
@media(max-width:800px){
  #kagenix-app .kgx-steps{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  #kagenix-app .kgx-steps:before{
    top:18px!important;
    bottom:18px!important;
    right:37px!important;
    left:auto!important;
    width:1px!important;
    height:auto!important;
    background:linear-gradient(180deg,transparent,rgba(255,47,85,.34),transparent)!important;
  }
  #kagenix-app .kgx-steps div{
    min-height:92px!important;
    padding:20px 74px 20px 18px!important;
    text-align:right!important;
    display:flex!important;
    align-items:center!important;
  }
  #kagenix-app .kgx-steps div:before{
    top:50%!important;
    right:16px!important;
    left:auto!important;
    transform:translateY(-50%)!important;
  }
  #kagenix-app .kgx-steps h3{
    font-size:16px!important;
    text-align:right!important;
  }

  #kagenix-app #faq{
    padding-left:14px!important;
    padding-right:14px!important;
  }
  #kagenix-app #faq summary{
    padding:17px 18px 17px 54px!important;
    font-size:13px!important;
  }
  #kagenix-app #faq summary:after{
    left:14px!important;
  }
  #kagenix-app #faq details p{
    padding:0 18px 17px!important;
    font-size:12px!important;
  }
}

#kagenix-app .ki-hero-meta{display:none!important;visibility:hidden!important;opacity:0!important;height:0!important;overflow:hidden!important;margin:0!important;padding:0!important}
/* v2.1.4 mobile menu label removal and Phase 4 visibility */
@media(max-width:800px){#kagenix-app .kgx-dashboard aside:before{content:none!important;display:none!important}#kagenix-app .kgx-dashboard aside [data-kgx4-view="studio"]{display:flex!important;visibility:visible!important;opacity:1!important;flex:0 0 82px!important;order:0!important}#kagenix-app .kgx-dashboard aside [data-kgx-logout]{order:99!important}}

/* v2.1.6 full-bleed responsive hero */
#kagenix-app .kgx-hero{min-height:100svh!important;display:flex!important;align-items:center!important;padding:clamp(112px,14vh,170px) clamp(24px,7vw,108px) clamp(54px,8vh,92px)!important}
#kagenix-app .kgx-hero-art{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;transform:none!important;background-size:cover!important;background-position:center center!important;background-repeat:no-repeat!important;filter:saturate(.94) contrast(1.03)!important;opacity:1!important;z-index:0!important}
#kagenix-app .kgx-hero-copy{width:min(690px,52vw)!important;max-width:690px!important;margin-right:0!important;margin-left:auto!important;padding:clamp(22px,3vw,38px)!important;border:1px solid rgba(255,255,255,.10)!important;border-radius:26px!important;background:linear-gradient(135deg,rgba(5,6,10,.76),rgba(5,6,10,.28))!important;box-shadow:0 24px 80px rgba(0,0,0,.32)!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important}
#kagenix-app .kgx-hero:before{z-index:1!important;background:linear-gradient(90deg,rgba(5,6,10,.86) 0%,rgba(5,6,10,.52) 34%,rgba(5,6,10,.08) 62%,rgba(5,6,10,.18) 100%)!important}
@media(max-width:800px){#kagenix-app .kgx-hero{min-height:100svh!important;align-items:flex-end!important;padding:90px 14px 22px!important}#kagenix-app .kgx-hero-art{background-position:64% center!important}#kagenix-app .kgx-hero:before{background:linear-gradient(180deg,rgba(5,6,10,.05) 0%,rgba(5,6,10,.12) 38%,rgba(5,6,10,.92) 70%,#05060a 100%)!important}#kagenix-app .kgx-hero-copy{width:100%!important;max-width:none!important;margin:0!important;padding:18px!important;border-radius:22px!important;background:linear-gradient(180deg,rgba(5,6,10,.20),rgba(5,6,10,.76))!important;backdrop-filter:blur(5px)!important;-webkit-backdrop-filter:blur(5px)!important}#kagenix-app .kgx-hero h1{font-size:clamp(34px,10.5vw,48px)!important;line-height:1.05!important}#kagenix-app .kgx-hero p{display:-webkit-box!important;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden!important;margin-bottom:16px!important}#kagenix-app .kgx-primary{width:100%!important}}
@media(max-width:430px) and (max-height:740px){#kagenix-app .kgx-hero{padding-bottom:12px!important}#kagenix-app .kgx-hero-copy{padding:14px!important}#kagenix-app .kgx-hero h1{font-size:32px!important;margin:9px 0!important}#kagenix-app .kgx-kicker{min-height:28px!important;padding:5px 9px!important}#kagenix-app .kgx-hero p{font-size:12px!important;line-height:1.65!important;margin-bottom:11px!important}#kagenix-app .kgx-primary{min-height:48px!important}}

/* v2.1.7 unobstructed hero composition */
#kagenix-app>.kgx-header{position:absolute!important;top:0!important;right:0!important;left:0!important;background:linear-gradient(180deg,rgba(5,6,10,.72),transparent)!important;box-shadow:none!important;border-bottom:0!important}
#kagenix-app .kgx-hero{padding-top:clamp(108px,14vh,150px)!important}
#kagenix-app .kgx-hero-copy{width:min(520px,34vw)!important;max-width:520px!important;margin-right:auto!important;margin-left:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#kagenix-app .kgx-hero h1{font-size:clamp(42px,4.25vw,68px)!important;line-height:1.04!important;letter-spacing:-.045em!important;margin:16px 0 18px!important}
#kagenix-app .kgx-hero p{max-width:520px!important;font-size:clamp(14px,1.05vw,17px)!important;line-height:1.9!important;margin-bottom:22px!important}
#kagenix-app .kgx-hero:before{background:linear-gradient(90deg,rgba(5,6,10,.92) 0%,rgba(5,6,10,.70) 24%,rgba(5,6,10,.18) 48%,rgba(5,6,10,.04) 72%)!important}
@media(max-width:1100px) and (min-width:801px){#kagenix-app .kgx-hero-copy{width:min(500px,46vw)!important}#kagenix-app .kgx-hero h1{font-size:clamp(40px,5vw,56px)!important}}
@media(max-width:800px){#kagenix-app>.kgx-header{background:linear-gradient(180deg,rgba(5,6,10,.82),rgba(5,6,10,.08))!important}#kagenix-app .kgx-hero{padding:86px 16px 20px!important}#kagenix-app .kgx-hero-copy{width:100%!important;max-width:540px!important;margin:0 auto!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}#kagenix-app .kgx-hero h1{font-size:clamp(32px,9.5vw,44px)!important;margin:10px 0 12px!important}#kagenix-app .kgx-hero p{font-size:13px!important;line-height:1.75!important;margin-bottom:14px!important}#kagenix-app .kgx-hero-art{background-position:67% center!important}#kagenix-app .kgx-hero:before{background:linear-gradient(180deg,rgba(5,6,10,.03) 0%,rgba(5,6,10,.08) 42%,rgba(5,6,10,.78) 70%,#05060a 100%)!important}}

/* v2.1.8 true edge-to-edge hero */
#kagenix-app{position:relative!important}
#kagenix-app>.kgx-header{position:relative!important;z-index:70!important;height:76px!important;background:linear-gradient(180deg,rgba(5,6,10,.82),rgba(5,6,10,.22),transparent)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#kagenix-app>main{position:relative!important;margin-top:-76px!important;padding-top:0!important}
#kagenix-app .kgx-hero{margin:0!important;min-height:100svh!important;padding-top:clamp(116px,15vh,160px)!important}
@media(max-width:800px){#kagenix-app>.kgx-header{height:66px!important}#kagenix-app>main{margin-top:-66px!important}#kagenix-app .kgx-hero{min-height:100svh!important;padding-top:94px!important}}

/* v2.1.9 header and stepper hard fix */
#kagenix-app>main{margin-top:0!important;padding-top:0!important}
#kagenix-app .kgx-hero{position:relative!important;top:0!important;margin:0!important;min-height:100svh!important}
#kagenix-app .kgx-steps{background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important}

/* v2.1.10 transparent header hard override */
#kagenix-app>.kgx-header{position:absolute!important;top:0!important;right:0!important;left:0!important;background:transparent!important;box-shadow:none!important;border:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* v2.1.11 final hero and Shahnameh alignment */
#kagenix-app #home.kgx-hero{transform:translateY(-76px)!important;margin-bottom:-76px!important;min-height:calc(100svh + 76px)!important;padding-top:calc(clamp(116px,15vh,160px) + 76px)!important}
#kagenix-app #dashboard aside .kgx5-main-menu{width:100%!important;min-width:0!important;justify-content:flex-start!important;text-align:right!important;padding:13px 15px!important;margin:0!important}
#kagenix-app .kgx5-shell{padding:clamp(24px,3vw,38px)!important}
#kagenix-app .kgx5-form{padding:clamp(20px,2.4vw,30px)!important;margin-inline:auto!important}
@media(max-width:800px){#kagenix-app #home.kgx-hero{transform:translateY(-66px)!important;margin-bottom:-66px!important;min-height:calc(100svh + 66px)!important;padding-top:160px!important}#kagenix-app #dashboard aside .kgx5-main-menu{width:auto!important;min-width:82px!important;justify-content:center!important;text-align:center!important;padding:6px 8px!important}#kagenix-app .kgx5-shell{padding:20px 16px 110px!important}#kagenix-app .kgx5-form{padding:18px!important}}

/* v2.1.12 readable overlay header and stable hero origin */
#kagenix-app>.kgx-header{position:absolute!important;top:0!important;right:0!important;left:0!important;z-index:120!important;background:linear-gradient(180deg,rgba(4,6,11,.94),rgba(4,6,11,.72) 64%,rgba(4,6,11,.08))!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important}
#kagenix-app>.kgx-header nav a,#kagenix-app>.kgx-header .kgx-brand,#kagenix-app>.kgx-header .kgx-brand b{color:#fff!important;opacity:1!important;text-shadow:0 2px 12px rgba(0,0,0,.9)!important}
#kagenix-app>.kgx-header nav a:hover{color:#ff7288!important}
#kagenix-app #home.kgx-hero{transform:none!important;margin-top:0!important;margin-bottom:0!important;min-height:100svh!important;padding-top:clamp(116px,15vh,160px)!important}
html.kgx-dashboard-open .kgx-apk-launcher,html.kgx-dashboard-open .kgx-apk-mobile-inline{display:none!important}
@media(min-width:801px){#kagenix-app #dashboard aside{padding-bottom:24px!important}#kagenix-app #dashboard aside [data-kgx-logout]{position:relative!important;inset:auto!important;z-index:2!important;width:100%!important;margin:14px 0 0!important;flex:0 0 auto!important}}
@media(max-width:800px){#kagenix-app>.kgx-header{background:linear-gradient(180deg,rgba(4,6,11,.96),rgba(4,6,11,.48),transparent)!important}#kagenix-app #home.kgx-hero{transform:none!important;margin-bottom:0!important;min-height:100svh!important;padding-top:94px!important}}

/* v2.1.13 structural UI fix */
#kagenix-app>.kgx-header{position:relative!important;inset:auto!important;height:76px!important;z-index:120!important;background:#07090e!important;border-bottom:1px solid rgba(255,255,255,.10)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#kagenix-app>main{margin-top:0!important;padding-top:0!important}
#kagenix-app #home.kgx-hero{position:relative!important;top:auto!important;transform:none!important;margin:0!important;min-height:calc(100svh - 76px)!important;padding-top:clamp(52px,8vh,90px)!important}
@media(min-width:801px){#kagenix-app #dashboard aside [data-kgx-logout]{order:-1!important;position:relative!important;inset:auto!important;width:100%!important;min-height:50px!important;margin:0 0 16px!important;flex:0 0 auto!important;background:#19191f!important;border:1px solid rgba(255,255,255,.14)!important}#kagenix-app #dashboard aside .kgx-brand{order:-2!important;margin-bottom:12px!important}}
html.kgx-dashboard-open .kgx-apk-launcher,html.kgx-dashboard-open .kgx-apk-mobile-inline{display:none!important}
@media(max-width:800px){#kagenix-app>.kgx-header{height:66px!important;background:#07090e!important}#kagenix-app #home.kgx-hero{min-height:calc(100svh - 66px)!important;padding-top:28px!important}#kagenix-app #dashboard aside [data-kgx-logout]{display:none!important}}

/* v2.1.14 typography, header action and responsive polish */
#kagenix-app,
#kagenix-app button,
#kagenix-app input,
#kagenix-app select,
#kagenix-app textarea{
  font-family:Modam,Tahoma,Arial,sans-serif!important;
}
#kagenix-app>.kgx-header .kgx-ghost{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:86px!important;
  min-height:46px!important;
  padding:10px 20px!important;
  border:1px solid rgba(255,255,255,.15)!important;
  border-radius:14px!important;
  background:linear-gradient(145deg,rgba(27,31,42,.96),rgba(14,17,24,.96))!important;
  color:#fff!important;
  font-size:clamp(13px,1vw,15px)!important;
  font-weight:850!important;
  line-height:1!important;
  box-shadow:0 12px 32px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.05)!important;
  transition:transform .18s ease,border-color .18s ease,background .18s ease!important;
}
#kagenix-app>.kgx-header .kgx-ghost:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(255,96,124,.48)!important;
  background:linear-gradient(145deg,rgba(255,64,96,.18),rgba(18,20,29,.98))!important;
}
#kagenix-app>.kgx-header nav a{font-size:clamp(12px,.92vw,14px)!important}
#kagenix-app .kgx-section:not(.kgx-hero){padding-block:clamp(66px,7vw,108px)!important}
#kagenix-app .kgx-section>h2{
  width:min(100%,980px)!important;
  font-size:clamp(34px,4.5vw,64px)!important;
  line-height:1.16!important;
  letter-spacing:-.035em!important;
  text-wrap:balance!important;
}
#kagenix-app .kgx-panels h3,#kagenix-app .kgx-steps h3{font-size:clamp(18px,1.8vw,26px)!important}
#kagenix-app .kgx-panels p,#kagenix-app .kgx-price-card p,#kagenix-app .kgx-legal-grid p{font-size:clamp(13px,1.05vw,16px)!important}
#kagenix-app .kgx-auth h2{font-size:clamp(27px,3.2vw,38px)!important;line-height:1.35!important;text-align:center!important}
body:has(#kagenix-app #auth:not([hidden])) .kgx-vpn-notice{opacity:0!important;visibility:hidden!important;pointer-events:none!important}

@media(max-width:1100px) and (min-width:801px){
  #kagenix-app .kgx-section:not(.kgx-hero){padding-inline:clamp(24px,4vw,52px)!important}
  #kagenix-app .kgx-section>h2{font-size:clamp(38px,5.2vw,56px)!important}
}
@media(max-width:800px){
  #kagenix-app>.kgx-header .kgx-ghost{min-width:70px!important;min-height:40px!important;padding:8px 14px!important;border-radius:12px!important;font-size:12px!important}
  #kagenix-app .kgx-section:not(.kgx-hero){padding:clamp(54px,15vw,76px) 16px!important}
  #kagenix-app .kgx-section>h2{font-size:clamp(29px,8.6vw,42px)!important;line-height:1.24!important;margin-bottom:clamp(24px,7vw,36px)!important}
  #kagenix-app .kgx-hero h1{font-size:clamp(31px,9.2vw,44px)!important;line-height:1.15!important;letter-spacing:-.035em!important}
  #kagenix-app .kgx-hero p{font-size:clamp(12px,3.5vw,14px)!important}
  #kagenix-app .kgx-panels h3,#kagenix-app .kgx-steps h3{font-size:clamp(17px,5vw,21px)!important}
  #kagenix-app .kgx-auth{width:min(440px,100%)!important;padding:32px 18px 24px!important;border-radius:24px!important}
}
@media(max-width:380px){
  #kagenix-app>.kgx-header{padding-inline:10px!important;gap:8px!important}
  #kagenix-app>.kgx-header .kgx-brand{gap:6px!important}
  #kagenix-app>.kgx-header .kgx-brand b{font-size:14px!important}
  #kagenix-app>.kgx-header .kgx-ghost{min-width:62px!important;padding-inline:10px!important}
  #kagenix-app .kgx-hero h1{font-size:clamp(29px,9.6vw,36px)!important}
}

/* v2.1.15 auth modal must always cover the footer */
body:has(#kagenix-app #auth:not([hidden])){overflow:hidden!important}
body:has(#kagenix-app #auth:not([hidden])) #kagenix-app>footer{display:none!important}
#kagenix-app #auth.kgx-modal:not([hidden]){
  position:fixed!important;
  inset:0!important;
  z-index:2147483000!important;
  width:100vw!important;
  height:100dvh!important;
  min-height:100dvh!important;
  overflow-y:auto!important;
}
