/* cart, checkout, orders, internal wallet, missions path, campaigns */
.ks-cart{padding-top:28px;padding-bottom:80px}
.ks-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:900px){.ks-grid{grid-template-columns:minmax(0,1fr)}}
.ks-alert{border-radius:12px;padding:11px 14px;font-size:14px;border:1px solid;margin:0 0 14px}
.ks-alert.err{color:#fecdd3;border-color:rgba(251,113,133,.5);background:rgba(251,113,133,.08)}
.ks-item{display:grid;grid-template-columns:56px minmax(0,1fr) auto auto 30px;gap:12px;align-items:center;padding:12px 0;border-bottom:1px dashed var(--line)}
.ks-item img{width:56px;height:56px;border-radius:12px;object-fit:cover;background:var(--panel2)}
.ks-item-t b{display:block}
.ks-item-t small{display:block;font-size:12px}
.ks-item-q input{width:64px;background:var(--bg2);border:1px solid var(--line2);border-radius:10px;color:var(--text);padding:6px 8px;text-align:center}
.ks-item-p{white-space:nowrap}
.ks-x{width:28px;height:28px;border-radius:8px;border:1px solid var(--line2);background:transparent;color:var(--dim);cursor:pointer}
.ks-x:hover{color:var(--rose);border-color:var(--rose)}
@media (max-width:600px){.ks-item{grid-template-columns:48px minmax(0,1fr) auto}.ks-item-q,.ks-item form:last-child{grid-column:2}}
.ks-st{display:inline-block;font-size:12px;padding:2px 10px;border-radius:99px;border:1px solid var(--line2);color:var(--muted)}
.ks-st.ok{color:var(--green);border-color:rgba(52,211,153,.5)}
.ks-st.wait{color:var(--amber);border-color:rgba(251,191,36,.5)}
.ks-st.bad{color:var(--rose);border-color:rgba(251,113,133,.5)}
.ks-pay{display:grid;gap:12px}
.ks-pay h3,.ks-cart h3{margin:0 0 6px;font-size:17px}
.ks-row{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:6px 0;font-size:14px}
.ks-row.rem{border-top:1px solid var(--line2);padding-top:12px;font-size:16px}
.ks-row.rem b{color:var(--cyan)}
.ks-use{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:12px;cursor:pointer}
.ks-use b{grid-column:2;font-size:13.5px}
.ks-use input{width:18px;height:18px;accent-color:#22d3ee}
.ks-methods{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ks-methods label,.kp-modes label{display:flex;gap:6px;align-items:center;padding:8px 12px;border:1px solid var(--line2);border-radius:10px;cursor:pointer;font-size:14px}
.ks-methods label.off,.kp-modes label.off{opacity:.45;filter:grayscale(1);cursor:not-allowed}
.ks-dep{display:grid;gap:10px}
.ks-cards{display:grid;gap:8px}
.ks-cardnum{padding:10px 12px;border-radius:12px;border:1px dashed var(--cyan);background:rgba(34,211,238,.05);font-size:14px}
.ks-cardnum .k-mono{font-size:17px;letter-spacing:1px;cursor:pointer;margin-top:4px}
.ks-qr{width:170px;height:170px;background:#fff;border-radius:12px;padding:6px;margin:6px auto}
.ks-qr svg{width:100%;height:100%}
.ks-addrtxt{word-break:break-all;text-align:center;font-size:13px;cursor:pointer;color:var(--muted)}
.ks-warn{color:var(--amber);font-size:12.5px;margin:4px 0}
.ks-topup .row,.ks-dep .row{display:flex;gap:8px;flex-wrap:wrap}
.ks-topup .row input,.ks-dep .row input{flex:1 1 160px}
.d-block{display:block}

/* missions path */
.km-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:20px;align-items:center;background:radial-gradient(60% 90% at 100% 0%,rgba(139,92,246,.18),transparent 70%),var(--panel)}
.km-score small,.km-tokens small{display:block;color:var(--muted);font-size:12.5px}
.km-score b{font-size:34px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.km-level b{font-size:16px}
.km-bar{height:8px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:8px}
.km-bar i{display:block;height:100%;background:var(--grad);border-radius:99px}
.km-tokens{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.km-tokens small{width:100%}
.km-tokens span{padding:3px 10px;border-radius:99px;border:1px solid rgba(52,211,153,.45);color:var(--green);font-size:13px}
@media (max-width:760px){.km-head{grid-template-columns:minmax(0,1fr)}}
.km-convert{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:14px}
.km-convert input{width:130px;background:var(--bg2);border:1px solid var(--line2);border-radius:10px;color:var(--text);padding:8px 10px}
.km-path{list-style:none;margin:0;padding:0;position:relative}
.km-path:before{content:"";position:absolute;inset-inline-start:22px;top:10px;bottom:10px;width:2px;background:linear-gradient(var(--cyan),var(--violet));opacity:.35}
.km-step{position:relative;display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:14px;align-items:start;padding:12px 0}
.km-dot{position:relative;z-index:1;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--panel2);border:2px solid var(--line2);color:var(--muted)}
.km-dot svg{width:20px;height:20px}
.km-step.done .km-dot{border-color:var(--green);color:var(--green);box-shadow:0 0 18px -4px var(--green)}
.km-step.review .km-dot{border-color:var(--amber);color:var(--amber)}
.km-step.bad .km-dot{border-color:var(--rose);color:var(--rose)}
.km-body b{display:block;font-size:15px}
.km-body small{display:block;font-size:12.5px}
.km-reward{color:var(--cyan)}
.km-act{display:grid;gap:6px;justify-items:end}
.km-state{font-size:12px;color:var(--muted)}
.km-step.done .km-state{color:var(--green)}
.km-form{display:grid;gap:8px;margin-top:8px}
.km-form input,.km-form textarea{background:var(--bg2);border:1px solid var(--line2);border-radius:10px;color:var(--text);padding:8px 10px;font:inherit}
.km-q{display:grid;gap:4px;font-size:14px}
.km-q label{display:flex;gap:6px;align-items:center;cursor:pointer}
@media (max-width:600px){.km-step{grid-template-columns:46px minmax(0,1fr)}.km-act{grid-column:2;justify-items:start}}

/* campaigns */
.kc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.kc-card{display:grid;gap:8px;padding:14px;border-radius:18px;border:1px solid var(--line);background:rgba(13,22,48,.7);transition:.2s}
.kc-card:hover{border-color:var(--cyan);transform:translateY(-2px)}
.kc-card img{width:100%;aspect-ratio:2/1;object-fit:cover;border-radius:12px}
.kc-card b{font-size:16px}
.kc-banner{width:100%;max-height:320px;object-fit:cover;border-radius:18px;margin-bottom:18px}
.km-tokens span.k-muted{border:0;padding:0}
