
/* Kagenix Phase 2 — Premium UI layer. Visual only; product structure untouched. */
:root{--kgx-bg:#09090c;--kgx-surface:#111116;--kgx-surface-2:#17171d;--kgx-line:rgba(255,255,255,.095);--kgx-line-strong:rgba(255,255,255,.16);--kgx-text:#f7f7fa;--kgx-muted:#a6a6b0;--kgx-accent:#ff3150;--kgx-accent-soft:rgba(255,49,80,.12);--kgx-success:#39c982;--kgx-radius:22px;--kgx-shadow:0 18px 55px rgba(0,0,0,.28)}
#dashboard,#kgx-view{min-width:0}#kgx-view{width:100%;max-width:1120px;margin-inline:auto;box-sizing:border-box}#kgx-view *{box-sizing:border-box}#kgx-view h1{font-size:clamp(28px,3vw,42px);line-height:1.2;letter-spacing:-.035em;margin:0 0 24px;color:var(--kgx-text)}#kgx-view h2{font-size:clamp(19px,2vw,25px);line-height:1.35;margin:30px 0 14px;color:var(--kgx-text)}#kgx-view h3{line-height:1.5}#kgx-view p{line-height:1.9;color:var(--kgx-muted)}#kgx-view input,#kgx-view textarea,#kgx-view select{width:100%;min-height:50px;border:1px solid var(--kgx-line);border-radius:14px;background:#0d0d12;color:var(--kgx-text);padding:12px 14px;outline:none;transition:border-color .18s,box-shadow .18s,background .18s}#kgx-view input:focus,#kgx-view textarea:focus,#kgx-view select:focus{border-color:rgba(255,49,80,.7);box-shadow:0 0 0 4px rgba(255,49,80,.09);background:#101016}#kgx-view button,#kgx-view a{touch-action:manipulation}#kgx-view button{font:inherit}.kgx-primary{min-height:48px;border:0!important;border-radius:14px!important;padding:12px 18px!important;background:var(--kgx-accent)!important;color:#fff!important;font-weight:850!important;cursor:pointer;transition:transform .16s,filter .16s,opacity .16s}.kgx-primary:hover{filter:brightness(1.08)}.kgx-primary:active{transform:scale(.985)}.kgx-primary:disabled{opacity:.5;cursor:not-allowed}.kgx-link{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 18px;border:1px solid var(--kgx-line-strong);border-radius:14px;color:var(--kgx-text);text-decoration:none;background:var(--kgx-surface)}
.kgx2-badge{display:inline-flex!important;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;margin-right:7px;border-radius:999px;background:var(--kgx-accent);color:#fff;font-size:11px;font-weight:900;box-shadow:0 0 0 4px rgba(255,49,80,.09)}
.kgx2-loading,.kgx2-progress{min-height:min(58vh,520px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;padding:30px}.kgx2-loading i,.kgx2-progress i{width:48px;height:48px;border:3px solid rgba(255,255,255,.11);border-top-color:var(--kgx-accent);border-radius:50%;animation:kgx2spin .85s linear infinite;box-shadow:0 0 28px rgba(255,49,80,.09)}@keyframes kgx2spin{to{transform:rotate(360deg)}}
.kgx2-wallet{position:relative;overflow:hidden;padding:clamp(22px,4vw,36px);border:1px solid var(--kgx-line);border-radius:28px;background:radial-gradient(circle at 90% 0,rgba(255,49,80,.16),transparent 36%),linear-gradient(145deg,#17171d,#0d0d11 72%);margin:0 0 28px;box-shadow:var(--kgx-shadow)}.kgx2-wallet:after{content:"";position:absolute;inset:auto -70px -100px auto;width:220px;height:220px;border-radius:50%;background:rgba(255,49,80,.055);filter:blur(4px)}.kgx2-wallet small{display:block;color:var(--kgx-muted);font-size:13px}.kgx2-wallet strong{display:block;font-size:clamp(34px,6vw,52px);line-height:1.2;margin:8px 0 22px;color:#fff;letter-spacing:-.035em}.kgx2-wallet>div{display:flex;gap:10px 20px;flex-wrap:wrap;color:#bdbdc6;font-size:13px}.kgx2-wallet>div span{padding:7px 10px;border-radius:10px;background:rgba(255,255,255,.04)}
.kgx2-charge,.kgx2-vipcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.kgx2-charge button,.kgx2-vipcards button{min-height:94px;border:1px solid var(--kgx-line);background:linear-gradient(180deg,#17171d,#111116);color:#fff;border-radius:18px;padding:18px;text-align:right;cursor:pointer;box-shadow:0 8px 28px rgba(0,0,0,.12);transition:transform .18s,border-color .18s,background .18s}.kgx2-charge button:hover,.kgx2-vipcards button:hover{transform:translateY(-2px);border-color:rgba(255,49,80,.42);background:#19191f}.kgx2-charge button:active,.kgx2-vipcards button:active{transform:translateY(0)}
.kgx2-list{display:grid;gap:9px}.kgx2-list article{display:grid;grid-template-columns:1fr auto;align-items:center;gap:7px 14px;padding:15px 17px;border:1px solid var(--kgx-line);border-radius:15px;background:rgba(255,255,255,.018)}.kgx2-list article>b{font-size:14px}.kgx2-list article>span{font-weight:800}.kgx2-list small{grid-column:1/-1;color:#777;font-size:11px}
.kgx2-notifs{display:grid;gap:12px}.kgx2-notifs article{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:16px;padding:16px;border:1px solid var(--kgx-line);border-radius:20px;background:linear-gradient(145deg,#141419,#101014);transition:border-color .18s,transform .18s}.kgx2-notifs article:hover{transform:translateY(-1px);border-color:var(--kgx-line-strong)}.kgx2-notifs article.new{border-color:rgba(255,49,80,.58);box-shadow:0 0 0 1px rgba(255,49,80,.08),0 12px 36px rgba(0,0,0,.16)}.kgx2-notifs img{width:92px;height:92px;object-fit:cover;border-radius:15px}.kgx2-notifs h3{margin:0 0 5px}.kgx2-notifs p{margin:0 0 10px!important}
.kgx2-ref{padding:24px;border:1px solid var(--kgx-line);border-radius:22px;background:linear-gradient(145deg,#15151b,#101014);box-shadow:0 12px 34px rgba(0,0,0,.14)}.kgx2-ref h2{margin-top:0!important}.kgx2-ref input{margin:10px 0}.kgx-panels{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;margin:18px 0!important}.kgx-panels article{min-width:0!important;padding:20px!important;border:1px solid var(--kgx-line)!important;border-radius:18px!important;background:var(--kgx-surface)!important}.kgx-panels article b{display:block;font-size:30px;margin-bottom:5px}.kgx-panels article h3{font-size:13px;margin:0;color:var(--kgx-muted)}
.kgx2-vipcards{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:18px}.kgx2-vipcards button{min-height:150px}.kgx2-vipcards b,.kgx2-vipcards span,.kgx2-vipcards small{display:block;margin-bottom:8px}.kgx2-vipcards b{font-size:17px}.kgx2-vipcards span{font-size:25px;color:var(--kgx-accent);font-weight:900}.kgx2-vipcards small{color:#999;line-height:1.8}#kgx2-vipform,#kgx2-set{display:grid;gap:12px;max-width:680px;padding:22px;border:1px solid var(--kgx-line);border-radius:22px;background:var(--kgx-surface)}#kgx2-set label{display:flex;align-items:flex-start;gap:10px;line-height:1.8;color:var(--kgx-muted)}#kgx2-set label input[type=checkbox]{width:20px!important;min-height:20px!important;margin-top:4px;accent-color:var(--kgx-accent)}
.kgx2-support{display:flex;gap:12px;flex-wrap:wrap}.kgx2-success,.kgx2-refund{padding:clamp(28px,6vw,52px);border:1px solid var(--kgx-line);border-radius:24px;text-align:center;background:var(--kgx-surface);box-shadow:var(--kgx-shadow)}.kgx2-success{border-color:rgba(57,201,130,.48)}.kgx2-refund{border-color:rgba(255,49,80,.48)}
.kgx2-build-info{margin:0 0 18px;padding:17px;border:1px solid var(--kgx-line);border-radius:18px;background:linear-gradient(145deg,#15151a,#101014)}.kgx2-build-price{font-weight:850;margin-bottom:12px;line-height:1.7}.kgx2-coupon{display:flex;gap:8px}.kgx2-coupon input{flex:1;margin:0!important}.kgx2-coupon button{width:auto!important;min-height:50px;white-space:nowrap;border:1px solid var(--kgx-line-strong);border-radius:14px;background:#242229;color:#fff;padding:0 16px;cursor:pointer}.kgx2-build-info small{display:block;margin-top:9px;color:var(--kgx-muted)}.kgx-result{max-width:850px;margin:auto}.kgx-result-image{display:block;width:min(100%,760px);max-height:760px;object-fit:contain;border-radius:22px;margin:20px auto;box-shadow:var(--kgx-shadow)}.kgx-story{white-space:pre-wrap;line-height:2.15!important;padding:20px 0}.kgx-kicker{display:inline-flex;color:var(--kgx-accent);font-weight:850;margin-bottom:9px}.kgx-message{min-height:22px;line-height:1.8!important}
/* Core dashboard polish without changing markup or behavior */
#dashboard{gap:18px!important}#dashboard aside{border-radius:20px!important;overflow:hidden}#dashboard aside button{min-height:46px!important;border-radius:12px!important;transition:background .16s,color .16s,transform .16s!important}#dashboard aside button:active{transform:scale(.985)}
@media(max-width:900px){#kgx-view{padding-inline:2px}.kgx2-charge{grid-template-columns:repeat(2,minmax(0,1fr))}.kgx-panels{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:680px){#kgx-view{padding:0 2px 28px}#kgx-view h1{margin-bottom:18px}#kgx-view h2{margin-top:24px}.kgx2-wallet{border-radius:22px;padding:22px 18px}.kgx2-wallet strong{font-size:34px}.kgx2-wallet>div{display:grid;grid-template-columns:1fr;gap:7px}.kgx2-charge,.kgx2-vipcards,.kgx-panels{grid-template-columns:1fr!important}.kgx2-charge button{min-height:68px;padding:15px}.kgx2-vipcards button{min-height:124px}.kgx2-notifs article{grid-template-columns:68px minmax(0,1fr);gap:12px;padding:12px;border-radius:17px}.kgx2-notifs img{width:68px;height:68px;border-radius:12px}.kgx2-notifs h3{font-size:15px}.kgx2-notifs p{font-size:13px;line-height:1.75!important}.kgx2-list article{padding:13px}.kgx2-ref,#kgx2-vipform,#kgx2-set{padding:16px;border-radius:18px}.kgx2-coupon{display:grid;grid-template-columns:1fr}.kgx2-coupon button{width:100%!important}.kgx2-support{display:grid}.kgx2-support>*{width:100%}.kgx2-loading,.kgx2-progress{min-height:52vh;padding:20px 12px}.kgx-result-image{border-radius:16px}.kgx-story{font-size:14px;line-height:2.05!important}#dashboard{min-width:0!important}#dashboard aside{max-width:100%!important}#dashboard aside button{min-height:48px!important}#kgx-view button,#kgx-view a.kgx-primary,#kgx-view a.kgx-link{min-height:48px}}
@media(max-width:390px){.kgx2-notifs article{grid-template-columns:56px minmax(0,1fr)}.kgx2-notifs img{width:56px;height:56px}.kgx2-wallet strong{font-size:30px}.kgx2-badge{margin-right:4px}.kgx2-list article{grid-template-columns:1fr}.kgx2-list article>span{text-align:right}.kgx2-list small{grid-column:1}}
@media(prefers-reduced-motion:reduce){#kgx-view *,#dashboard aside button{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* v2.1.0 — My Story + exact wallet shortfall UI */
.kgx2-custom-charge{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin-top:12px;max-width:680px}.kgx2-custom-charge input{margin:0!important}.kgx2-story-hero{display:grid;grid-template-columns:minmax(220px,360px) minmax(0,1fr);gap:24px;align-items:start;padding:20px;border:1px solid var(--kgx-line);border-radius:24px;background:linear-gradient(145deg,#15151b,#0f0f14);box-shadow:var(--kgx-shadow);margin-bottom:20px}.kgx2-story-hero>img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:18px;background:#0b0b0f}.kgx2-story-hero h2{margin:4px 0 6px!important}.kgx2-story-hero>div>small{display:block;color:#888;margin-bottom:14px}.kgx2-story-hero p{white-space:pre-wrap;max-height:240px;overflow:auto;padding-left:4px}.kgx2-story-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.kgx2-story-meta span{padding:7px 10px;border-radius:10px;background:rgba(255,255,255,.045);color:#c8c8d0;font-size:12px}.kgx2-story-buy{padding:20px;border:1px solid var(--kgx-line);border-radius:22px;background:var(--kgx-surface)}.kgx2-story-buy h2{margin-top:0!important}.kgx2-quote-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0}.kgx2-quote-grid article{padding:15px;border:1px solid var(--kgx-line);border-radius:15px;background:#0e0e13}.kgx2-quote-grid article small{display:block;color:#8d8d97;font-size:11px;margin-bottom:7px}.kgx2-quote-grid article b{display:block;font-size:17px}.kgx2-quote-grid article.need{border-color:rgba(245,158,11,.38);background:rgba(245,158,11,.055)}.kgx2-quote-grid article.ok{border-color:rgba(57,201,130,.38);background:rgba(57,201,130,.055)}.kgx2-story-action{width:100%;margin-top:2px}.kgx2-empty{padding:32px;border:1px solid var(--kgx-line);border-radius:22px;background:var(--kgx-surface);text-align:center}.kgx2-empty p{max-width:620px;margin:0 auto 18px!important}
@media(max-width:760px){.kgx2-story-hero{grid-template-columns:1fr}.kgx2-story-hero>img{max-width:520px;margin-inline:auto}.kgx2-quote-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.kgx2-custom-charge{grid-template-columns:1fr}.kgx2-story-hero,.kgx2-story-buy{padding:14px;border-radius:18px}.kgx2-story-hero{gap:14px}.kgx2-story-hero p{max-height:none;overflow:visible}.kgx2-quote-grid{grid-template-columns:1fr 1fr;gap:8px}.kgx2-quote-grid article{padding:12px}.kgx2-quote-grid article b{font-size:15px}}
@media(max-width:390px){.kgx2-quote-grid{grid-template-columns:1fr}.kgx2-story-meta{display:grid;grid-template-columns:1fr}}

.kgx2-character-picker{margin:0 0 18px;padding:16px;border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(255,255,255,.025)}
.kgx2-character-picker h2{margin:4px 0}.kgx2-character-picker p{margin:0 0 12px;opacity:.72}
.kgx2-character-row{display:flex;gap:10px;overflow-x:auto;padding:2px 0 7px}
.kgx2-character-card{min-width:132px;max-width:132px;padding:8px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.035);text-align:right;cursor:pointer}
.kgx2-character-card.active{border-color:#f1b323;box-shadow:0 0 0 2px rgba(241,179,35,.14)}
.kgx2-character-card img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:11px;margin-bottom:7px}
.kgx2-character-card b,.kgx2-character-card small{display:block}.kgx2-character-card small{opacity:.68;margin-top:4px}
@media(max-width:600px){.kgx2-character-card{min-width:112px;max-width:112px}.kgx2-character-picker{padding:13px}}

/* v2.1.2 — Character selector readability fix only */
.kgx2-character-card,
.kgx2-character-card b,
.kgx2-character-card span,
.kgx2-character-card small{
  color:#fff !important;
}
.kgx2-character-card small{
  opacity:.72;
}
.kgx2-character-card.active,
.kgx2-character-card.active b,
.kgx2-character-card.active span,
.kgx2-character-card.active small{
  color:#fff !important;
}

/* v2.1.4 — hide VIP navigation item only; VIP backend/functions untouched */
aside [data-kgx2-view="vip"],
aside [data-view="vip"],
.kgx-bottom-nav [data-kgx2-view="vip"],
.kgx-bottom-nav [data-view="vip"]{
  display:none !important;
}


/* v2.1.10 shared UX polish */
#kgx-view>section,#kgx-view>.kgx2-wallet,#kgx-view>.kgx2-character-picker{scroll-margin-top:24px}
#kgx-view .kgx2-empty{padding:30px;border:1px solid var(--kgx-line);border-radius:22px;background:linear-gradient(145deg,#15151b,#101014)}
@media(max-width:600px){#kgx-view h1{font-size:30px;margin-bottom:18px}#kgx-view h2{margin-top:22px}.kgx2-wallet{border-radius:22px}.kgx2-charge,.kgx2-vipcards{grid-template-columns:1fr}.kgx2-character-picker{border-radius:18px}}

/* v2.1.12 final mobile alignment — mobile only */
@media (max-width:800px){
  #kgx-view .kgx2-character-picker h2,
  #kgx-view .kgx2-character-picker p,
  #kgx-view .kgx2-empty,
  #kgx-view .kgx2-wallet h1,
  #kgx-view .kgx2-wallet h2{
    text-align:center!important;
  }
  #kgx-view .kgx2-charge button,
  #kgx-view .kgx2-vipcards button,
  #kgx-view .kgx2-character-card,
  #kgx-view .kgx2-support .kgx-link,
  #kgx-view .kgx2-support .kgx-primary{
    text-align:center!important;
    justify-content:center!important;
    align-items:center!important;
  }
}
