:root{--bg:#0a0a14;--card:#161625;--card2:#10101c;--line:#26263d;--mag:#ff00f2;--mag2:#b100ad;--txt:#f1f1f8;--mut:#9a9ab5;--ok:#19c37d;--gold:#f5a010;--r:18px}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
body{background:var(--bg);color:var(--txt);font-family:'Mali',system-ui,sans-serif;font-size:15px;line-height:1.4;min-height:100vh}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
.wrap{max-width:900px;margin:0 auto;padding:12px 12px 30px}
.top{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:rgba(20,20,36,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:600;letter-spacing:.5px;text-transform:uppercase}
.brand img,.logo-ph{width:44px;height:44px;border-radius:10px;object-fit:cover;background:#000}
.logo-ph{display:grid;place-items:center;background:linear-gradient(135deg,var(--mag),var(--mag2));font-size:20px}
.top-r{display:flex;align-items:center;gap:10px}
.pill{background:linear-gradient(135deg,#ff00f2,#d800d0);color:#fff;border:0;border-radius:30px;padding:12px 18px;font:inherit;font-size:16px;cursor:pointer;display:flex;gap:8px;align-items:center}
.pill i{font-size:11px;opacity:.7}
.sq{width:46px;height:46px;border-radius:12px;background:var(--mag);color:#fff;display:grid;place-items:center;font-size:18px;border:0;cursor:pointer}
.sq.dark{background:#10101c;border:1px solid var(--line);color:#d7d7ea}
.lang{position:relative}
.menu{display:none;position:absolute;top:calc(100% + 8px);left:0;min-width:170px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:6px;box-shadow:0 12px 30px #000a;z-index:60}
.menu.right{left:auto;right:0}.menu.open{display:block}
.menu a{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:10px;color:#ddd}.menu a:hover{background:#ffffff10}
.alert{background:#2a1030;border:1px solid var(--mag2);color:#ffd5fb;padding:12px 14px;border-radius:12px;margin-bottom:12px}
.slider{position:relative;margin:6px 0 36px}
.slides{display:flex;transition:transform .5s ease;aspect-ratio:16/9;border-radius:6px;overflow:hidden}
.slider{overflow:hidden;padding-bottom:0}
.slide{min-width:100%;height:100%;display:block;flex:none}.slide img{width:100%;height:100%;object-fit:cover}
.nav{position:absolute;top:calc(50% - 20px);width:40px;height:40px;border-radius:50%;border:0;background:#0008;color:#fff;cursor:pointer}
.prev{left:8px}.next{right:8px}
.dots{position:absolute;bottom:-26px;left:0;right:0;display:flex;gap:8px;justify-content:center}
.slider{overflow:visible}
.dots span{width:14px;height:14px;border-radius:50%;background:#2c2c44;cursor:pointer;transition:.3s}
.dots span.on{width:44px;border-radius:10px;background:var(--mag)}
.sec{text-align:center;font-size:30px;font-weight:600;margin-top:34px}
.sec span{color:var(--mag);font-size:24px}.sec.why{font-size:28px;letter-spacing:1px;text-transform:uppercase}.sec.why span{font-size:inherit}
.line{width:130px;height:2px;margin:8px auto 16px;background:linear-gradient(90deg,transparent,var(--mag),transparent)}
.muted{color:var(--mut)}.center{text-align:center}.ok{color:var(--ok)}.red{color:#ff5b6e}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px}
@media(min-width:700px){.grid{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;min-width:0}
.ch{display:flex;gap:10px;align-items:center;padding:12px}
.pi{width:48px;height:48px;border-radius:12px;background:#0d0d18;display:grid;place-items:center;color:var(--mag);font-size:22px;flex:none}
.pt{min-width:0}.pt h3{font-size:17px;font-weight:600;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ver{color:var(--ok);font-size:14px}.ver i{margin-right:2px}
.stars{color:#ffc01a;font-size:13px}.stars .off{color:#444}.stars small{color:var(--mut);font-size:13px;margin-left:4px}
.cimg{display:block;background:var(--card2);padding:12px;border-top:1px solid var(--line);aspect-ratio:16/10}
.cimg img{width:100%;height:100%;object-fit:cover;border-radius:6px}
.ctag{min-height:50px;background:var(--card2);padding:10px 12px;display:flex;align-items:center}
.ctag span{background:#1e1e30;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:13px;color:#cfcfe6}
.cf{margin-top:auto;background:#0f0f1b;border-top:1px solid var(--line);padding:12px}
.price{color:var(--ok);font-size:21px;font-weight:600;margin-bottom:10px}.price i{font-size:16px;margin-right:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(135deg,#ff00f2,#e000d8);color:#fff;border:0;border-radius:12px;padding:13px 18px;font:inherit;font-size:16px;cursor:pointer;width:100%;box-shadow:0 4px 18px #ff00f233}
.btn:active{transform:scale(.98)}.btn.full{width:100%;margin-top:10px}.btn.dis{background:#333;box-shadow:none;cursor:not-allowed;width:auto}
.btn.gold{background:linear-gradient(135deg,#f5a010,#dc7a05);box-shadow:0 4px 18px #f5a01033}
.reseller{margin-top:26px;background:#14120f;border:1px solid #3a2e17;border-radius:var(--r);padding:18px}
.rh{display:flex;gap:14px;align-items:center;margin-bottom:12px}
.crown{width:70px;height:70px;border-radius:18px;background:linear-gradient(135deg,#ffb020,#e08000);display:grid;place-items:center;font-size:30px;flex:none}
.rh h3{color:#f7b92b;font-size:22px;font-weight:600}.rh small{color:#b0b0c8}
.reseller p{color:#d0d0e0;line-height:1.7;font-size:15px}
.rf{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}
.rf div{border-radius:12px;padding:12px 6px;text-align:center;font-size:13px;display:flex;flex-direction:column;gap:6px;align-items:center;border:1px solid}
.rf i{font-size:20px}.rf .o{background:#1f1810;border-color:#3a2e17;color:#e8a62b}.rf .g{background:#0f1c18;border-color:#17382c;color:#cfe}.rf .g i{color:var(--ok)}.rf .p{background:#171428;border-color:#2b2650;color:#cfd}.rf .p i{color:#8b6cf0}
.video{margin-top:16px;border-radius:24px;overflow:hidden;border:1px solid var(--line);aspect-ratio:16/9;background:#000}
.video iframe{width:100%;height:100%;border:0}
.feats{display:grid;gap:14px;margin-top:20px;padding:0 6px}
@media(min-width:700px){.feats{grid-template-columns:repeat(3,1fr)}}
.feat{background:linear-gradient(180deg,#171728,#0e0e1a);border:1px solid #2a1840;border-radius:26px;padding:28px 18px;text-align:center}
.fi{width:76px;height:76px;margin:0 auto 14px;border-radius:20px;background:linear-gradient(135deg,#ff00f2,#b100ad);display:grid;place-items:center;font-size:30px;box-shadow:0 0 28px #ff00f244}
.feat h4{font-size:18px;font-weight:600;margin-bottom:8px;letter-spacing:.5px}.feat p{color:var(--mut);font-size:14px}
.foot{background:#161628;border-top:1px solid var(--line);text-align:center;padding:20px 12px 28px;margin-top:40px}
.fb{font-size:18px;font-weight:600;text-transform:uppercase;margin-bottom:12px}.fb i{color:var(--mag);margin-right:6px}
.fl{display:flex;gap:18px;justify-content:center;color:var(--mut);margin-bottom:14px}
.soc{display:flex;gap:14px;justify-content:center;margin-bottom:14px}
.soc a{width:64px;height:52px;border-radius:14px;background:#0c0c16;display:grid;place-items:center;font-size:24px;color:#9aa5b5}
.copy{color:var(--mut)}.copy .ok{color:var(--ok)}
.fab{position:fixed;right:18px;bottom:22px;width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,#ff00f2,#7a5af8);display:grid;place-items:center;font-size:26px;z-index:70;box-shadow:0 0 0 8px #ff00f21f,0 8px 24px #000a}
.box{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-top:14px}
.box.narrow{max-width:420px;margin:24px auto}
.sub{font-size:20px;font-weight:600;margin-bottom:10px}.sub small{font-size:14px}
label{display:block;margin:12px 0 5px;color:var(--mut);font-size:14px}
input,select,textarea{width:100%;background:#0d0d18;border:1px solid var(--line);color:var(--txt);border-radius:10px;padding:12px;font:inherit;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--mag)}
input[type=checkbox]{width:auto}input[type=file]{padding:8px}
.row{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid #20203a;align-items:center}.row:last-child{border:0}
.or{text-align:center;color:var(--mut);margin:12px 0}
.upi{background:#0d0d18;border:1px dashed var(--mag2);border-radius:12px;padding:12px;margin:10px 0;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.upi div{width:100%;color:var(--mut);font-size:13px}
.copy-btn{background:#26263d;color:#fff;border:0;border-radius:8px;padding:6px 12px;font:inherit;cursor:pointer}
.keybox{display:flex;gap:8px;align-items:center;background:#0d0d18;border:1px solid var(--ok);border-radius:10px;padding:10px;margin-top:8px}
.keybox code{flex:1;word-break:break-all;color:#aef5d4}
.st{padding:3px 10px;border-radius:20px;font-size:12px;text-transform:uppercase}
.st.pending{background:#3a3010;color:#ffd24d}.st.paid{background:#10303a;color:#4dd2ff}.st.completed{background:#103a22;color:#4dff9a}.st.rejected{background:#3a1018;color:#ff4d6a}
.gold-t{color:var(--gold)}
.pd .pdimg{width:100%;border-radius:var(--r);margin-bottom:12px}.pd h1{font-size:24px;text-transform:uppercase}.desc{margin:10px 0}
.plans{display:grid;gap:10px}
.plan{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px}
.plan .pr{color:var(--ok);font-weight:600;font-size:18px;text-align:right}.plan .pr s{color:var(--mut);font-size:13px}.plan .btn{width:auto;padding:10px 16px}.plan.out{opacity:.6}
@media(max-width:420px){.plan{grid-template-columns:1fr auto}.plan .btn{grid-column:1/-1;width:100%}}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.tabs a{background:var(--card);border:1px solid var(--line);padding:9px 14px;border-radius:10px}.tabs a.on{background:var(--mag);border-color:var(--mag)}
.tbl{width:100%;border-collapse:collapse;font-size:14px}.tbl th,.tbl td{padding:8px;border-bottom:1px solid #20203a;text-align:left;vertical-align:top}.tbl th{color:var(--mut);font-weight:400}
.tblw{overflow-x:auto}
.two{display:grid;gap:10px;grid-template-columns:1fr 1fr}
.sm{padding:7px 12px;font-size:13px;width:auto;border-radius:8px;box-shadow:none}.sm.redb{background:#c4263c}.sm.grn{background:#139a62}
.stat{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.stat div{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;text-align:center}.stat b{font-size:26px;display:block;color:var(--mag)}
.inl{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.inl input,.inl select{width:auto;flex:1;min-width:90px;padding:8px}
.thumb{width:90px;border-radius:8px}

/* ===== compact UI (smaller sizes) ===== */
body{font-size:13px}
.wrap{padding:8px 10px 24px}
.top{padding:6px 10px}
.brand{font-size:16px;gap:8px}
.brand img,.logo-ph{width:34px;height:34px;border-radius:8px}.logo-ph{font-size:15px}
.top-r{gap:7px}
.pill{padding:8px 13px;font-size:13px}
.sq{width:36px;height:36px;border-radius:10px;font-size:14px}
.menu{min-width:140px;font-size:13px}.menu a{padding:8px 10px}
.slider{margin:4px 0 30px}
.nav{width:30px;height:30px;font-size:12px;top:calc(50% - 15px)}
.dots{bottom:-22px;gap:6px}.dots span{width:10px;height:10px}.dots span.on{width:30px}
.sec{font-size:22px;margin-top:24px}.sec span{font-size:18px}.sec.why{font-size:20px}
.line{width:100px;margin:6px auto 12px}
.grid{gap:10px}
.card{border-radius:14px}
.ch{padding:9px;gap:8px}
.pi{width:36px;height:36px;border-radius:10px;font-size:17px}
.pt h3{font-size:13px}.ver{font-size:12px}.stars{font-size:11px}.stars small{font-size:11px}
.cimg{padding:8px}
.ctag{min-height:40px;padding:7px 9px}.ctag span{font-size:11px;padding:4px 8px}
.cf{padding:9px}
.price{font-size:16px;margin-bottom:7px}.price i{font-size:13px}
.btn{padding:10px 14px;font-size:14px;border-radius:10px}
.reseller{padding:13px;margin-top:20px;border-radius:14px}
.crown{width:48px;height:48px;font-size:21px;border-radius:13px}
.rh{gap:10px;margin-bottom:8px}.rh h3{font-size:17px}.rh small{font-size:12px}
.reseller p{font-size:12.5px;line-height:1.6}
.rf{gap:7px;margin:12px 0}.rf div{font-size:11px;padding:9px 4px}.rf i{font-size:16px}
.video{margin-top:12px;border-radius:16px}
.feats{gap:10px;margin-top:14px}
.feat{padding:18px 14px;border-radius:20px}
.fi{width:56px;height:56px;font-size:22px;border-radius:16px;margin-bottom:10px}
.feat h4{font-size:15px}.feat p{font-size:12px}
.foot{padding:16px 10px 22px;margin-top:28px}
.fb{font-size:15px;margin-bottom:9px}.fl{font-size:12px;margin-bottom:10px}
.soc a{width:48px;height:40px;font-size:19px;border-radius:11px}.copy{font-size:12px}
.fab{width:52px;height:52px;font-size:20px;right:14px;bottom:16px;box-shadow:0 0 0 6px #ff00f21f,0 6px 18px #000a}
.box{padding:12px;margin-top:10px;border-radius:14px}
.sub{font-size:17px}
label{font-size:12px;margin:9px 0 4px}
input,select,textarea{padding:9px;font-size:13px}
.pd h1{font-size:19px}.plan{padding:9px}.plan .pr{font-size:15px}.plan .btn{padding:8px 13px}
.alert{padding:9px 11px;font-size:12.5px}
.tbl{font-size:12.5px}

/* ===== medium size v6 ===== */
body{font-size:12.5px}
.wrap{max-width:640px;padding:7px 9px 22px}
.top{padding:6px 9px}
.brand{font-size:14.5px;gap:7px}
.brand img,.logo-ph{width:31px;height:31px;border-radius:8px}.logo-ph{font-size:13px}
.top-r{gap:6px}
.pill{padding:7px 11px;font-size:12px}.pill i{font-size:10px}
.sq{width:33px;height:33px;border-radius:9px;font-size:13px}
.menu{min-width:130px;font-size:12px;top:calc(100% + 7px)}.menu a{padding:7px 10px}
.slider{margin:4px 0 27px}.slides{border-radius:5px}
.nav{width:27px;height:27px;font-size:11px;top:calc(50% - 13px)}.prev{left:6px}.next{right:6px}
.dots{bottom:-20px;gap:5px}.dots span{width:9px;height:9px}.dots span.on{width:26px}
.sec{font-size:19.5px;margin-top:21px}.sec span{font-size:16px}.sec.why{font-size:18px}
.line{width:90px;margin:5px auto 10px}
.grid{gap:9px}
@media(min-width:700px){.grid{grid-template-columns:1fr 1fr}}
.card{border-radius:12px}
.ch{padding:8px;gap:7px}
.pi{width:32px;height:32px;border-radius:9px;font-size:15px}
.pt h3{font-size:12px}.ver{font-size:11px}.stars{font-size:10px}.stars small{font-size:10px}
.cimg{padding:7px}.cimg img{border-radius:5px}
.ctag{min-height:35px;padding:6px 8px}.ctag span{font-size:10.5px;padding:3px 7px;border-radius:7px}
.cf{padding:8px}
.price{font-size:14.5px;margin-bottom:6px}.price i{font-size:12px}
.btn{padding:8.5px 12px;font-size:13px;border-radius:9px;gap:6px}
.btn.sm{padding:6px 10px;font-size:12px}
.reseller{padding:11.5px;margin-top:16px;border-radius:12px}
.crown{width:42px;height:42px;font-size:18px;border-radius:11px}
.rh{gap:9px;margin-bottom:7px}.rh h3{font-size:15.5px}.rh small{font-size:11px}
.reseller p{font-size:11.5px;line-height:1.55}
.rf{gap:6px;margin:10px 0}.rf div{font-size:10.5px;padding:8px 3px;border-radius:10px;gap:5px}.rf i{font-size:14.5px}
.video{margin-top:10px;border-radius:14px}
.foot{padding:14px 9px 19px;margin-top:24px}
.fb{font-size:13.5px;margin-bottom:8px}.fl{font-size:11px;gap:14px;margin-bottom:9px}
.soc{gap:10px;margin-bottom:9px}.soc a{width:43px;height:36px;font-size:17px;border-radius:10px}.copy{font-size:11px}
.fab{width:48px;height:48px;font-size:18px;right:12px;bottom:14px;box-shadow:0 0 0 5px #ff00f21f,0 5px 16px #000a}
.box{padding:11px;margin-top:9px;border-radius:12px}.box.narrow{margin:18px auto}
.sub{font-size:15.5px;margin-bottom:8px}
label{font-size:11.5px;margin:8px 0 4px}
input,select,textarea{padding:8px 10px;font-size:12.5px;border-radius:9px}
.row{padding:7px 0}
.pd h1{font-size:17.5px}.plan{padding:8px;gap:9px;border-radius:11px}.plan .pr{font-size:14px}.plan .btn{padding:7px 11px}
.alert{padding:8px 10px;font-size:11.5px;border-radius:10px}
.keybox{padding:8px}.copy-btn{padding:5px 9px;font-size:12px}.st{font-size:10.5px;padding:2px 9px}
.tbl{font-size:11.5px}

/* ===== feature buttons (click = up/down bounce) ===== */
.feats{display:grid;gap:9px;margin-top:11px;padding:0}
.feat{display:flex;align-items:center;gap:12px;text-align:left;cursor:pointer;padding:11px 14px;border-radius:16px;border:1px solid #2a1840;background:linear-gradient(180deg,#171728,#0e0e1a);user-select:none;outline:none;transition:border-color .25s,box-shadow .25s}
.feat .fi{width:42px;height:42px;margin:0;font-size:17px;border-radius:12px;flex:none;box-shadow:0 0 16px #ff00f244}
.feat h4{margin:0;font-size:13.5px;letter-spacing:.6px;font-weight:600}
.feat:hover,.feat:focus-visible{border-color:#ff00f299;box-shadow:0 0 18px #ff00f230}
.feat.bump{animation:updown .55s ease;border-color:var(--mag);box-shadow:0 0 22px #ff00f255}
@keyframes updown{0%{transform:translateY(0)}25%{transform:translateY(-9px)}55%{transform:translateY(4px)}80%{transform:translateY(-2px)}100%{transform:translateY(0)}}
button.feat{font:inherit;color:var(--txt);width:100%}

/* ===== light (brightness) theme ===== */
html{transition:background .3s}
body,.top,.card,.box,.foot,.feat,.reseller,input,select,textarea{transition:background-color .3s,color .3s,border-color .3s}
[data-theme="light"]{--bg:#f4f1fa;--card:#ffffff;--card2:#f7f4fc;--line:#e2dcef;--txt:#1b1530;--mut:#6b6485}
[data-theme="light"] .top{background:rgba(255,255,255,.96)}
[data-theme="light"] .sq.dark{background:#fff;color:#f5a010;border-color:var(--line)}
[data-theme="light"] .pi{background:#f3ecfb}
[data-theme="light"] .ctag span{background:#efe8f8;color:#4a3d66}
[data-theme="light"] .cf{background:#faf7fe}
[data-theme="light"] .cimg{background:var(--card2)}
[data-theme="light"] .menu a{color:var(--txt)}
[data-theme="light"] .menu a:hover{background:#0000000d}
[data-theme="light"] .dots span{background:#d9d0ea}
[data-theme="light"] .dots span.on{background:var(--mag)}
[data-theme="light"] .reseller{background:#fffaf0;border-color:#f1dfb8}
[data-theme="light"] .reseller p{color:#4b4358}
[data-theme="light"] .rf .o{background:#fff3df;border-color:#f1dfb8;color:#b97800}
[data-theme="light"] .rf .g{background:#e8f8f1;border-color:#bfe8d6;color:#14573d}
[data-theme="light"] .rf .p{background:#efeafc;border-color:#d4c9f5;color:#4a3d9a}
[data-theme="light"] .rh small{color:#7a7390}
[data-theme="light"] .feat{background:#fff;border-color:#eadff5}
[data-theme="light"] .foot{background:#fff}
[data-theme="light"] .soc a{background:#f3ecfb;color:#6b6485}
[data-theme="light"] input,[data-theme="light"] select,[data-theme="light"] textarea{background:#fff;color:var(--txt)}
[data-theme="light"] .upi,[data-theme="light"] .keybox{background:#faf7fe}
[data-theme="light"] .keybox code{color:#0d6b43}
[data-theme="light"] .copy-btn{background:#ece5f7;color:#2a2040}
[data-theme="light"] .alert{background:#fde8fb;color:#7a0f72}
[data-theme="light"] .row{border-color:#ece6f6}
[data-theme="light"] .tbl th,[data-theme="light"] .tbl td{border-color:#ece6f6}
[data-theme="light"] .tabs a{color:var(--txt)}[data-theme="light"] .tabs a.on{color:#fff}
[data-theme="light"] .fl,[data-theme="light"] .copy{color:var(--mut)}
[data-theme="light"] .ver,[data-theme="light"] .price,[data-theme="light"] .ok{color:#0f9d63}
[data-theme="light"] .stars .off{color:#d6cfe4}
[data-theme="light"] .st.pending{background:#fff1c9;color:#8a6200}[data-theme="light"] .st.paid{background:#d6f1fb;color:#0a6a8c}
[data-theme="light"] .st.completed{background:#d8f6e5;color:#0c6b3c}[data-theme="light"] .st.rejected{background:#fde0e5;color:#a1182f}

/* ===== Account popup (login / register) ===== */
.amodal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:14px;background:rgba(5,3,12,.72);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.amodal.open{display:flex;animation:afade .2s ease}
@keyframes afade{from{opacity:0}to{opacity:1}}@keyframes apop{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.abox{width:100%;max-width:340px;max-height:92vh;overflow:auto;background:#1b1b2f;border:1px solid #3a1a52;border-radius:18px;box-shadow:0 18px 50px #000c,0 0 30px #ff00f214;animation:apop .25s ease}
.ahead{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #2d1d44;background:#20203a}
.ahead h3{display:flex;align-items:center;gap:9px;font-size:16px;font-weight:600;color:#fff}
.aic{width:20px;height:20px;border-radius:50%;background:var(--mag);color:#1b1b2f;display:grid;place-items:center;font-size:10px}
.ax{background:none;border:0;color:#aab;font-size:16px;cursor:pointer;width:30px;height:30px;border-radius:9px}.ax:hover{background:#ffffff12;color:#fff}
.abody{padding:12px 16px 16px}
.atabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#0f0f1c;border:1px solid #2a1a3e;border-radius:12px;padding:4px}
.atabs button{border:0;background:transparent;color:#aab;font:inherit;font-size:13.5px;padding:9px 6px;border-radius:9px;cursor:pointer;display:flex;gap:6px;align-items:center;justify-content:center;transition:.2s}
.atabs button.on{background:var(--mag);color:#fff;box-shadow:0 3px 12px #ff00f244}
.amsg{display:none;margin-top:10px;padding:8px 11px;border-radius:10px;font-size:12.5px;background:#3a1020;border:1px solid #ff5b6e66;color:#ffc2cb}.amsg.show{display:block}.amsg.good{background:#0f2e22;border-color:#19c37d66;color:#b9f5dc}
.apane{display:none}.apane.on{display:block}
.abox label{display:flex;align-items:center;gap:6px;margin:11px 0 5px;color:#b4b4cc;font-size:12.5px}.abox label i{color:var(--mag);font-size:12px}
.af{position:relative}
.af input{background:#14142a;border:1px solid #321a4a;border-radius:11px;padding:0 42px 0 12px;height:42px;font-size:14px;color:#fff}
.af input:focus{border-color:var(--mag);box-shadow:0 0 0 3px #ff00f21f}
.ap{position:absolute;right:3px;top:3px;width:36px;height:36px;border:0;background:none;color:#8d8da8;font-size:15px;cursor:pointer;border-radius:9px}.ap:hover{color:#fff;background:#ffffff0d}
.abtn{width:100%;margin-top:14px;height:44px;border:0;border-radius:11px;background:#10b981;color:#fff;font:inherit;font-size:15px;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;box-shadow:0 5px 16px #10b98133;transition:.15s}
.abtn:active{transform:scale(.98)}.abtn:disabled{opacity:.65;cursor:wait}
.aor{display:flex;align-items:center;gap:10px;margin:14px 0 12px;color:#8d8da8;font-size:12px}.aor:before,.aor:after{content:"";flex:1;height:1px;background:#3a1a52}
.agoogle{width:100%;height:42px;border:1px solid #e3e3ea;border-radius:11px;background:#fff;color:#1b1530;font:inherit;font-size:14px;display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;transition:.15s}.agoogle svg{width:18px;height:18px}.agoogle:active{transform:scale(.98)}.agoogle:disabled{opacity:.65}
body.alock{overflow:hidden}
[data-theme="light"] .abox{background:#fff;border-color:#e2d4f2}[data-theme="light"] .ahead{background:#faf6ff;border-color:#eadff5}[data-theme="light"] .ahead h3{color:#1b1530}
[data-theme="light"] .atabs{background:#f3ecfb;border-color:#e8dcf5}[data-theme="light"] .atabs button{color:#6b6485}[data-theme="light"] .atabs button.on{color:#fff}
[data-theme="light"] .abox label{color:#4b4358}[data-theme="light"] .af input{background:#faf7fe;color:#1b1530;border-color:#e2d4f2}
[data-theme="light"] .agoogle{border-color:#d9cfe8}

/* ===== Toast (bottom notification) ===== */
#toasts{position:fixed;left:0;right:0;bottom:14px;z-index:300;display:flex;flex-direction:column;align-items:center;gap:8px;padding:0 12px;pointer-events:none}
.toast{position:relative;overflow:hidden;pointer-events:auto;width:100%;max-width:440px;display:flex;align-items:flex-start;gap:12px;padding:14px 14px 15px 16px;background:#18181b;border:1px solid #2c2c33;border-left:4px solid #19c37d;border-radius:14px;box-shadow:0 14px 40px #000b;color:#fff;animation:tin .35s cubic-bezier(.2,.9,.3,1.2)}
.toast.out{animation:tout .3s ease forwards}
@keyframes tin{from{opacity:0;transform:translateY(30px) scale(.96)}to{opacity:1;transform:none}}
@keyframes tout{to{opacity:0;transform:translateY(20px) scale(.96)}}
.toast .ti{font-size:24px;line-height:1;color:#19c37d;margin-top:1px}
.toast.err{border-left-color:#ff5b6e}.toast.err .ti{color:#ff5b6e}
.toast.info{border-left-color:#b86bff}.toast.info .ti{color:#b86bff}
.toast .tb{flex:1;min-width:0}.toast b{display:block;font-size:16px;font-weight:700;line-height:1.25}
.toast p{margin-top:3px;font-size:13px;color:#a1a1ad;line-height:1.35}
.toast .tx{background:none;border:0;color:#8b8b97;font-size:15px;cursor:pointer;width:28px;height:28px;border-radius:8px;flex:none}.toast .tx:hover{background:#ffffff12;color:#fff}
.toast .tbar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:linear-gradient(90deg,#19c37d,#6ee7b7);transform-origin:left;animation:tbar 5s linear forwards}
.toast.err .tbar{background:#ff5b6e}.toast.info .tbar{background:#b86bff}
@keyframes tbar{to{transform:scaleX(0)}}
[data-theme="light"] .toast{background:#fff;border-color:#e6e0f0;color:#1b1530;box-shadow:0 14px 40px #2a1a4a33}[data-theme="light"] .toast p{color:#6b6485}
@media(max-width:420px){.toast{padding:11px 11px 12px 13px;gap:10px;border-radius:12px}.toast b{font-size:14.5px}.toast p{font-size:12px}.toast .ti{font-size:21px}}

/* ===== APP (logged-in dashboard) ===== */
[hidden]{display:none!important}
body.app{--u:calc(min(100vw,480px)/360);--mag:#6c63ff;--mag2:#4f46e5;--bg:#090a0f;--card:#0f1217;--card2:#0b0d11;--line:#22252d;--txt:#f2f3f7;--mut:#8a8d99;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;font-size:calc(var(--u)*13);background:radial-gradient(120% 50% at 50% 0,#12142a 0,#090a0f 55%) fixed;background-color:#090a0f}
.app .wrap{max-width:480px;margin:0 auto;padding:0 calc(var(--u)*11.5) calc(var(--u)*100)}
.ah{position:sticky;top:0;z-index:50;background:rgba(9,10,15,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #181b22}
.ahi{max-width:480px;margin:0 auto;height:calc(var(--u)*44);display:flex;align-items:center;gap:calc(var(--u)*10);padding:0 calc(var(--u)*14)}
.hb,.tb{background:none;border:0;color:#b0b3bf;font-size:calc(var(--u)*17);width:calc(var(--u)*26);height:calc(var(--u)*30);cursor:pointer;display:grid;place-items:center}
.ht{flex:1;min-width:0;font-size:calc(var(--u)*16);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:calc(var(--u)*4)}
.alang{height:calc(var(--u)*22);padding:0 calc(var(--u)*9);border:1px solid #2a2d36;border-radius:calc(var(--u)*8);background:#0e1015;color:#e8e9ef;font:inherit;font-size:calc(var(--u)*11);font-weight:600;display:flex;align-items:center;gap:calc(var(--u)*5);cursor:pointer}
.alang i{font-size:calc(var(--u)*10);color:#9a9dab}
.app .menu{background:#12151b;border-color:#262a33;border-radius:calc(var(--u)*12);min-width:calc(var(--u)*130);top:calc(100% + calc(var(--u)*6))}.app .menu a{font-size:calc(var(--u)*12);padding:calc(var(--u)*9) calc(var(--u)*11);color:#e8e9ef}
.stabs{display:grid;grid-template-columns:1fr 1fr;margin-top:calc(var(--u)*12);height:calc(var(--u)*39);border:1px solid #23262e;border-radius:calc(var(--u)*13);background:#13161c;overflow:hidden}
.stabs button{border:0;background:transparent;color:#e4e6ee;font:inherit;font-size:calc(var(--u)*13);font-weight:600;display:flex;gap:calc(var(--u)*7);align-items:center;justify-content:center;cursor:pointer}
.stabs button.on{background:linear-gradient(135deg,#6c63ff,#8b5cf6)}
.sbox{position:relative;margin-top:calc(var(--u)*14)}.sbox i{position:absolute;left:calc(var(--u)*15);top:50%;transform:translateY(-50%);color:#7b7e8b;font-size:calc(var(--u)*14);pointer-events:none}
.app .sbox input{height:calc(var(--u)*47);border-radius:calc(var(--u)*13);background:#10131a;border:1px solid #23262e;padding:0 calc(var(--u)*14) 0 calc(var(--u)*40);font-size:calc(var(--u)*14);color:#fff}
.app .sbox input:focus{border-color:#6c63ff;box-shadow:0 0 0 3px rgba(108,99,255,.15)}
.chips{display:flex;gap:calc(var(--u)*8);margin-top:calc(var(--u)*16);overflow-x:auto;scrollbar-width:none;padding-bottom:calc(var(--u)*2)}.chips::-webkit-scrollbar{display:none}
.chips button{flex:none;height:calc(var(--u)*31);padding:0 calc(var(--u)*12);border-radius:calc(var(--u)*16);border:1px solid #262a33;background:#12151b;color:#e8e9ef;font:inherit;font-size:calc(var(--u)*12);font-weight:700;text-transform:uppercase;cursor:pointer}
.chips button.on{background:#6366f1;border-color:#6366f1;color:#fff}
.pgrid{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*18) calc(var(--u)*10);margin-top:calc(var(--u)*16)}
.pc{background:#0f1217;border:1px solid #22252d;border-radius:calc(var(--u)*11);padding:0 0 calc(var(--u)*9);display:flex;flex-direction:column;overflow:hidden}
.pc h3{font-size:calc(var(--u)*11.5);font-weight:700;text-transform:uppercase;line-height:1.3;padding:calc(var(--u)*9) calc(var(--u)*9) 0;word-break:break-word}
.ptag{padding:calc(var(--u)*9) calc(var(--u)*9) calc(var(--u)*9);display:flex;gap:calc(var(--u)*5);flex-wrap:wrap}
.ptag span{display:inline-flex;align-items:center;gap:calc(var(--u)*4);height:calc(var(--u)*15);padding:0 calc(var(--u)*7);border-radius:calc(var(--u)*8);border:1px solid #3b3f8f;background:rgba(99,102,241,.1);color:#7f83ff;font-size:calc(var(--u)*8.5);font-weight:700;text-transform:uppercase}
.ptag i{font-size:calc(var(--u)*7.5)}
.pbar{border-top:1px solid #22252d;position:relative}.pbar i{position:absolute;top:-1px;left:0;width:calc(var(--u)*35);height:calc(var(--u)*2);background:#6366f1}
.pimg{display:block;margin:calc(var(--u)*7) calc(var(--u)*9) 0;border-radius:calc(var(--u)*9);overflow:hidden;aspect-ratio:1.43;background:#06070a}.pimg img{width:100%;height:100%;object-fit:cover}
.pmeta{display:flex;justify-content:space-between;align-items:center;gap:calc(var(--u)*4);padding:calc(var(--u)*14) calc(var(--u)*9) 0;margin-top:auto;font-size:calc(var(--u)*8.5);color:#8a8d99}.pmeta b{color:#6c6cff;font-size:calc(var(--u)*9.5)}
.pbuy,.pdl{display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*6);color:#fff;font-weight:600;border-radius:calc(var(--u)*9);margin:calc(var(--u)*14) calc(var(--u)*9) 0}
.pbuy{height:calc(var(--u)*30);font-size:calc(var(--u)*11.5);background:linear-gradient(135deg,#6c63ff,#8b5cf6);box-shadow:0 4px 14px rgba(99,102,241,.3)}
.pbuy+.pdl{margin-top:calc(var(--u)*7.5)}.pdl{height:calc(var(--u)*36);font-size:calc(var(--u)*13);background:#1f9fdc;box-shadow:0 4px 14px rgba(31,159,220,.25)}
.pdl.inl-dl{margin:calc(var(--u)*10) 0 0;height:calc(var(--u)*34);font-size:calc(var(--u)*12.5)}
.bnav{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:480px;z-index:60;display:grid;grid-template-columns:repeat(5,1fr);height:calc(var(--u)*58);padding-bottom:env(safe-area-inset-bottom,0px);box-sizing:content-box;background:rgba(14,16,22,.97);border:1px solid #22252d;border-radius:calc(var(--u)*22) calc(var(--u)*22) 0 0;backdrop-filter:blur(10px)}
.bnav a{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:calc(var(--u)*3);padding-bottom:calc(var(--u)*9);color:#8a8d99;font-size:calc(var(--u)*9);font-weight:600;position:relative}
.bnav a i{font-size:calc(var(--u)*16)}.bnav a.on{color:#6c6cff}
.bnav .mid{color:#6c6cff}.bnav .mid b{width:calc(var(--u)*39);height:calc(var(--u)*39);border-radius:50%;background:linear-gradient(135deg,#6c63ff,#8b5cf6);border:calc(var(--u)*2.5) solid #07080c;display:grid;place-items:center;transform:translateY(calc(var(--u)*-13));margin-bottom:calc(var(--u)*-11);color:#fff;box-shadow:0 0 0 1px #3a3f9f,0 6px 18px rgba(99,102,241,.5)}.bnav .mid b i{font-size:calc(var(--u)*17)}
.drw{position:fixed;inset:0;z-index:120;visibility:hidden;transition:visibility .25s}.drw.open{visibility:visible}
.dbg{position:absolute;inset:0;background:rgba(0,0,0,.62);opacity:0;transition:.25s}.drw.open .dbg{opacity:1}
.dnav{position:absolute;left:0;top:0;bottom:0;width:calc(var(--u)*250);max-width:82vw;background:#0e1015;border-right:1px solid #22252d;transform:translateX(-100%);transition:transform .28s ease;padding:calc(var(--u)*16) calc(var(--u)*10);overflow:auto}.drw.open .dnav{transform:none}
.dh{display:flex;gap:calc(var(--u)*10);align-items:center;padding:calc(var(--u)*6) calc(var(--u)*8) calc(var(--u)*16);border-bottom:1px solid #1b1e25;margin-bottom:calc(var(--u)*8)}.dh b{display:block;font-size:calc(var(--u)*13.5)}.dh small{display:block;color:#8a8d99;font-size:calc(var(--u)*10.5);word-break:break-all}
.dav{width:calc(var(--u)*36);height:calc(var(--u)*36);border-radius:50%;background:linear-gradient(135deg,#6c63ff,#8b5cf6);display:grid;place-items:center;color:#fff;font-size:calc(var(--u)*15);flex:none}.dav.big{width:calc(var(--u)*46);height:calc(var(--u)*46);font-size:calc(var(--u)*19)}
.dnav>a{display:flex;align-items:center;gap:calc(var(--u)*12);padding:calc(var(--u)*12) calc(var(--u)*10);border-radius:calc(var(--u)*10);font-size:calc(var(--u)*13);color:#e8e9ef}.dnav>a i{width:calc(var(--u)*18);text-align:center;color:#7f83ff}.dnav>a:active{background:#ffffff10}.dnav>a.lo,.mlist a.lo{color:#ff6b7d}.dnav>a.lo i,.mlist a.lo i{color:#ff6b7d}
.ah2{font-size:calc(var(--u)*14);font-weight:700;margin:calc(var(--u)*16) 0 calc(var(--u)*2)}
.oc{background:#0f1217;border:1px solid #22252d;border-radius:calc(var(--u)*12);padding:calc(var(--u)*11);margin-top:calc(var(--u)*10)}
.oc .t{display:flex;justify-content:space-between;align-items:flex-start;gap:calc(var(--u)*8);font-size:calc(var(--u)*12);font-weight:700;line-height:1.35}.oc .s{font-size:calc(var(--u)*10.5);color:#8a8d99;margin-top:calc(var(--u)*4)}
.app .st{font-size:calc(var(--u)*9.5);padding:calc(var(--u)*2) calc(var(--u)*8);flex:none}.app .muted.sm,.sm{font-size:calc(var(--u)*11)}.oc .muted.sm{margin-top:calc(var(--u)*6)}
.app .keybox{background:#0b0d11;border-color:#19c37d;margin-top:calc(var(--u)*9);padding:calc(var(--u)*8)}.app .keybox code{font-size:calc(var(--u)*11.5)}.app .copy-btn{font-size:calc(var(--u)*11);padding:calc(var(--u)*5) calc(var(--u)*10);background:#222633;border-radius:calc(var(--u)*8)}
.app .box{background:#0f1217;border:1px solid #22252d;border-radius:calc(var(--u)*14);padding:calc(var(--u)*14);margin-top:calc(var(--u)*12)}
.app .sub{font-size:calc(var(--u)*15)}.app .row{font-size:calc(var(--u)*12.5)}
.app label{font-size:calc(var(--u)*12);margin:calc(var(--u)*11) 0 calc(var(--u)*5);color:#9a9dab}
.app input,.app select,.app textarea{font-size:calc(var(--u)*13.5);padding:calc(var(--u)*11) calc(var(--u)*12);border-radius:calc(var(--u)*11);background:#10131a;border:1px solid #23262e;color:#fff}
.app input:focus,.app select:focus,.app textarea:focus{border-color:#6c63ff}
.app .btn{background:linear-gradient(135deg,#6c63ff,#8b5cf6);border-radius:calc(var(--u)*10);font-size:calc(var(--u)*13);padding:calc(var(--u)*11) calc(var(--u)*14);box-shadow:0 4px 14px rgba(99,102,241,.25)}
.app .btn.gold{background:linear-gradient(135deg,#f5a010,#dc7a05);box-shadow:0 4px 14px #f5a01033}
.app .btn.dis{background:#2a2d36;box-shadow:none}
.app .alert{background:#15183a;border-color:#4f46e5;color:#d9dbff;font-size:calc(var(--u)*12);border-radius:calc(var(--u)*11);margin-top:calc(var(--u)*12);padding:calc(var(--u)*10) calc(var(--u)*12)}
.app .upi{background:#0b0d11;border-color:#4f46e5;border-radius:calc(var(--u)*11);font-size:calc(var(--u)*13)}.app .upi div{font-size:calc(var(--u)*11)}
.app .or{font-size:calc(var(--u)*12)}
.app .pd{padding-top:calc(var(--u)*12)}.app .pd h1{font-size:calc(var(--u)*17)}.app .pd .pdimg{border-radius:calc(var(--u)*14)}
.app .plan{background:#0f1217;border-color:#22252d;border-radius:calc(var(--u)*12);padding:calc(var(--u)*10);gap:calc(var(--u)*10)}.app .plan .pr{font-size:calc(var(--u)*15);color:#19c37d}.app .plan .btn{padding:calc(var(--u)*8) calc(var(--u)*13);font-size:calc(var(--u)*12)}
.app .ctag span{background:rgba(99,102,241,.12);color:#8e92ff}
.app .ver{color:#19c37d}
.wal{display:flex;align-items:center;gap:calc(var(--u)*10);justify-content:space-between}.wal span{color:#9a9dab;font-size:calc(var(--u)*12)}.wal b{font-size:calc(var(--u)*20);color:#fff;flex:1;text-align:right;margin-right:calc(var(--u)*6)}.wal .btn{width:auto;padding:calc(var(--u)*8) calc(var(--u)*12);font-size:calc(var(--u)*12);margin:0}
.pf{display:flex;gap:calc(var(--u)*12);align-items:center}.pf b{display:block;font-size:calc(var(--u)*14.5)}.pf small{display:block;color:#8a8d99;font-size:calc(var(--u)*11);word-break:break-all}
.mlist{padding:calc(var(--u)*4) 0!important}.mlist a{display:flex;align-items:center;gap:calc(var(--u)*12);padding:calc(var(--u)*13) calc(var(--u)*14);border-bottom:1px solid #1b1e25;font-size:calc(var(--u)*13)}.mlist a:last-child{border:0}.mlist a i{width:calc(var(--u)*18);text-align:center;color:#7f83ff}
.app .gold-t{color:var(--gold);font-size:calc(var(--u)*11)}
[data-theme="light"] body.app{--bg:#f4f5fb;--card:#fff;--card2:#f7f7fc;--line:#e4e6f0;--txt:#161826;--mut:#6a6e80;background:radial-gradient(120% 50% at 50% 0,#e8e9ff 0,#f4f5fb 55%) fixed;background-color:#f4f5fb;color:#161826}
[data-theme="light"] .ah{background:rgba(255,255,255,.94);border-color:#e4e6f0}[data-theme="light"] .hb,[data-theme="light"] .tb{color:#4b4f63}
[data-theme="light"] .alang{background:#fff;border-color:#dcdfec;color:#161826}
[data-theme="light"] .app .menu{background:#fff;border-color:#e4e6f0}[data-theme="light"] .app .menu a{color:#161826}
[data-theme="light"] .stabs{background:#fff;border-color:#e0e3f0}[data-theme="light"] .stabs button{color:#2a2d3f}[data-theme="light"] .stabs button.on{color:#fff}
[data-theme="light"] .app .sbox input,[data-theme="light"] .app input,[data-theme="light"] .app select,[data-theme="light"] .app textarea{background:#fff;color:#161826;border-color:#dcdfec}
[data-theme="light"] .chips button{background:#fff;border-color:#dcdfec;color:#2a2d3f}[data-theme="light"] .chips button.on{background:#6366f1;color:#fff;border-color:#6366f1}
[data-theme="light"] .pc,[data-theme="light"] .oc,[data-theme="light"] .app .box,[data-theme="light"] .app .plan{background:#fff;border-color:#e4e6f0}
[data-theme="light"] .pbar{border-color:#e4e6f0}[data-theme="light"] .pc h3{color:#161826}
[data-theme="light"] .bnav,[data-theme="light"] .dnav{background:rgba(255,255,255,.97);border-color:#e4e6f0}[data-theme="light"] .dnav>a,[data-theme="light"] .mlist a{color:#161826}
[data-theme="light"] .wal b{color:#161826}[data-theme="light"] .app .keybox,[data-theme="light"] .app .upi{background:#f7f7fc}
[data-theme="light"] .app .alert{background:#ecebff;color:#2e2a8a}
[data-theme="light"] .mlist a,[data-theme="light"] .dh{border-color:#eceef7}

/* ===== Side menu (drawer) ===== */
.drw .dpn{position:absolute;left:0;top:0;bottom:0;width:calc(var(--u)*223);max-width:86vw;background:linear-gradient(180deg,#0e1020 0,#0a0b15 100%);border-right:1px solid #1d2033;transform:translateX(-100%);transition:transform .28s ease;overflow-y:auto;overflow-x:hidden;padding-bottom:calc(var(--u)*24);box-shadow:8px 0 40px rgba(0,0,0,.5)}
.drw.open .dpn{transform:none}
.dph{height:calc(var(--u)*45);display:flex;align-items:center;gap:calc(var(--u)*10);padding:0 calc(var(--u)*14) 0 calc(var(--u)*15.5);border-bottom:1px solid #1d2033}
.dbr{width:calc(var(--u)*17);height:calc(var(--u)*17);display:grid;place-items:center;color:#fff;font-size:calc(var(--u)*17)}.dbr img{width:calc(var(--u)*20);height:calc(var(--u)*20);border-radius:calc(var(--u)*5);object-fit:cover}
.dph b{flex:1;min-width:0;font-size:calc(var(--u)*14);font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dcl{background:none;border:0;color:#b9b2ff;font-size:calc(var(--u)*17);width:calc(var(--u)*26);height:calc(var(--u)*26);cursor:pointer;display:grid;place-items:center;border-radius:calc(var(--u)*8)}.dcl:active{background:#ffffff12}
.dpf{display:flex;align-items:center;gap:calc(var(--u)*10);margin:calc(var(--u)*11) calc(var(--u)*15.5) 0;padding:calc(var(--u)*10) calc(var(--u)*10.5);height:calc(var(--u)*53.5);background:#161827;border:1px solid #272a3d;border-radius:calc(var(--u)*10)}
.dav2{width:calc(var(--u)*34);height:calc(var(--u)*34);flex:none;border-radius:50%;background:linear-gradient(135deg,#7c4dff,#6c5cff);display:grid;place-items:center;color:#fff;font-size:calc(var(--u)*14)}
.dpf b{display:block;font-size:calc(var(--u)*12.5);font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(var(--u)*130)}
.dpf small{display:block;font-size:calc(var(--u)*10);color:#8a8d99;margin-top:calc(var(--u)*1)}.dpf small.vf{color:#19c37d}.dpf>div{min-width:0}
.dbl{margin:calc(var(--u)*10) calc(var(--u)*15.5) 0;height:calc(var(--u)*113);padding:calc(var(--u)*14) calc(var(--u)*14.5) calc(var(--u)*15);border-radius:calc(var(--u)*12);background:linear-gradient(135deg,#6b5bff,#6152f4);box-shadow:0 10px 30px rgba(108,92,255,.33);display:flex;flex-direction:column;justify-content:space-between;align-items:center;color:#fff}
.dbt{align-self:flex-start;font-size:calc(var(--u)*10.5);font-weight:700;letter-spacing:.06em;display:flex;align-items:center;gap:calc(var(--u)*7)}.dbt i{font-size:calc(var(--u)*11);opacity:.9}
.dbm{font-size:calc(var(--u)*26);font-weight:800;line-height:1;letter-spacing:-.01em}
.dba{display:flex;align-items:center;gap:calc(var(--u)*7);font-size:calc(var(--u)*11.5);font-weight:500;color:#fff;opacity:.95}.dba i{font-size:calc(var(--u)*13)}
.dsl{margin:calc(var(--u)*35) 0 0;padding:0 calc(var(--u)*18.7);font-size:calc(var(--u)*9.5);font-weight:700;letter-spacing:.13em;color:#9c9ad6;line-height:calc(var(--u)*11)}
.dsl.s2{margin-top:calc(var(--u)*23)}.dsl.s3{margin-top:calc(var(--u)*22)}
.dsl+.di{margin-top:calc(var(--u)*7)}
.di{position:relative;display:flex;align-items:center;gap:calc(var(--u)*10);height:calc(var(--u)*28.5);margin:calc(var(--u)*2) calc(var(--u)*10) 0;padding:0 calc(var(--u)*9);border-radius:calc(var(--u)*8);color:#d6d5f2;font-size:calc(var(--u)*12.7);font-weight:500}
.di i{width:calc(var(--u)*15);text-align:center;font-size:calc(var(--u)*14);color:#bdb9ee}
.di:active{background:#ffffff0d}
.di.on{background:#2a236b;color:#efecff}.di.on i{color:#9487ff}
.di.on:before{content:"";position:absolute;left:calc(var(--u)*-10);top:calc(var(--u)*5);bottom:calc(var(--u)*5);width:calc(var(--u)*4);border-radius:0 calc(var(--u)*4) calc(var(--u)*4) 0;background:#6c63ff}
.dlo{display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*9);height:calc(var(--u)*32.5);margin:calc(var(--u)*9) calc(var(--u)*10) 0;border-radius:calc(var(--u)*8);background:#3a1b2b;border:1px solid #5a2a3c;color:#f4d9de;font-size:calc(var(--u)*13);font-weight:500}.dlo i{font-size:calc(var(--u)*14)}
[data-theme="light"] .drw .dpn{background:#fff;border-color:#e4e6f0}
[data-theme="light"] .dph{border-color:#eceef7}[data-theme="light"] .dph b,[data-theme="light"] .dbr,[data-theme="light"] .dpf b{color:#161826}
[data-theme="light"] .dpf{background:#f6f6fc;border-color:#e4e6f0}[data-theme="light"] .di{color:#2a2d3f}[data-theme="light"] .di i{color:#6a6e80}
[data-theme="light"] .di.on{background:#e8e6ff;color:#2e2a8a}[data-theme="light"] .di.on i{color:#6c63ff}[data-theme="light"] .dsl{color:#7a78b8}
[data-theme="light"] .dlo{background:#ffe9ed;border-color:#f6c6d0;color:#a1182f}

/* ===== Transactions page ===== */
.sgrid{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*11);margin-top:calc(var(--u)*12)}
.sc{background:#101218;border:1px solid #22252d;border-radius:calc(var(--u)*14);padding:calc(var(--u)*13) calc(var(--u)*14) calc(var(--u)*15);min-height:calc(var(--u)*112)}
.si{width:calc(var(--u)*34);height:calc(var(--u)*34);border-radius:calc(var(--u)*9);display:grid;place-items:center;font-size:calc(var(--u)*15)}
.si.c1{background:#1d1f4d;color:#6c6cff}.si.c2{color:#fff;font-size:calc(var(--u)*17);justify-content:start;width:auto}.si.c3{background:#10301f;color:#22c55e}.si.c4{background:#12214a;color:#3b82f6}
.sc b{display:block;margin-top:calc(var(--u)*8);font-size:calc(var(--u)*22);font-weight:800;color:#fff;line-height:1.15}
.sc small{display:block;margin-top:calc(var(--u)*6);font-size:calc(var(--u)*9.5);letter-spacing:.07em;color:#8a8d99}
.fcard{display:flex;flex-wrap:wrap;gap:calc(var(--u)*7.5);margin-top:calc(var(--u)*13);background:#101218;border:1px solid #22252d;border-radius:calc(var(--u)*14);padding:calc(var(--u)*13)}
.app .fcard select,.app .fcard input{height:calc(var(--u)*41);border-radius:calc(var(--u)*11);background:#161820;border:1px solid #272a33;color:#fff;font-size:calc(var(--u)*14);padding:0 calc(var(--u)*12);color-scheme:dark}
.app .fcard select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238a8d99'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right calc(var(--u)*14) center;padding-right:calc(var(--u)*32)}
.fcard .f1{flex:1 1 calc(50% - calc(var(--u)*4));min-width:0;width:auto}.fcard .f2{flex:1.45 1 0;min-width:0;width:auto}
.fbtn{flex:none;width:calc(var(--u)*88);height:calc(var(--u)*40);border:0;border-radius:calc(var(--u)*11);background:linear-gradient(135deg,#6c63ff,#8b5cf6);color:#fff;font:inherit;font-size:calc(var(--u)*13.5);font-weight:700;display:flex;gap:calc(var(--u)*7);align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 18px rgba(108,99,255,.4)}
.fclr{flex:none;width:calc(var(--u)*66);height:calc(var(--u)*40);border-radius:calc(var(--u)*11);background:#1b1d26;border:1px solid #2a2d37;color:#fff;font-size:calc(var(--u)*13.5);font-weight:700;display:grid;place-items:center}
.hcard{margin-top:calc(var(--u)*13);background:#101218;border:1px solid #22252d;border-radius:calc(var(--u)*14);overflow:hidden}
.hh{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--u)*8);padding:calc(var(--u)*13) calc(var(--u)*13) calc(var(--u)*12) calc(var(--u)*15)}
.hh h3{font-size:calc(var(--u)*15.5);font-weight:700;color:#fff;display:flex;gap:calc(var(--u)*8);align-items:center}
.exb{flex:none;height:calc(var(--u)*38);padding:0 calc(var(--u)*14);border-radius:calc(var(--u)*9);background:#22c55e;color:#fff;font-size:calc(var(--u)*13);font-weight:700;display:flex;align-items:center;gap:calc(var(--u)*8);box-shadow:0 4px 14px rgba(34,197,94,.25)}
.hbar{border-top:1px solid #22252d;position:relative}.hbar i{position:absolute;top:-1px;left:0;width:calc(var(--u)*35);height:calc(var(--u)*2);background:#6366f1}
.hb2{padding:calc(var(--u)*7) calc(var(--u)*9) calc(var(--u)*9)}
.hempty{background:#1b1d26;border-radius:calc(var(--u)*10);min-height:calc(var(--u)*120);display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*16);color:#e0e0e8;font-size:calc(var(--u)*14);padding:calc(var(--u)*10)}.hempty i{font-size:calc(var(--u)*34);color:#6a6d78}
.tx{display:flex;align-items:center;gap:calc(var(--u)*10);background:#161820;border:1px solid #22252d;border-radius:calc(var(--u)*11);padding:calc(var(--u)*10);margin-bottom:calc(var(--u)*7)}
.tic{width:calc(var(--u)*34);height:calc(var(--u)*34);border-radius:calc(var(--u)*10);display:grid;place-items:center;font-size:calc(var(--u)*14);flex:none}.tic.dep{background:#10301f;color:#22c55e}.tic.buy{background:#12214a;color:#3b82f6}
.tm{flex:1;min-width:0}.tm b{display:block;font-size:calc(var(--u)*12);font-weight:700;color:#fff;line-height:1.3;word-break:break-word}.tm small{display:block;font-size:calc(var(--u)*9.5);color:#8a8d99;margin-top:calc(var(--u)*2)}
.ta{text-align:right;flex:none}.ta b{display:block;font-size:calc(var(--u)*12.5);font-weight:800}.ta b.pos{color:#22c55e}.ta b.neg{color:#f2f3f7}.ta b.mu{color:#8a8d99}.ta .st{display:inline-block;margin-top:calc(var(--u)*4)}
[data-theme="light"] .sc,[data-theme="light"] .fcard,[data-theme="light"] .hcard{background:#fff;border-color:#e4e6f0}
[data-theme="light"] .sc b,[data-theme="light"] .hh h3,[data-theme="light"] .tm b{color:#161826}
[data-theme="light"] .app .fcard select,[data-theme="light"] .app .fcard input{background:#f6f6fc;color:#161826;border-color:#dcdfec;color-scheme:light}
[data-theme="light"] .fclr{background:#f1f1f9;color:#161826;border-color:#dcdfec}
[data-theme="light"] .hempty,[data-theme="light"] .tx{background:#f6f6fc;border-color:#e4e6f0;color:#161826}[data-theme="light"] .ta b.neg{color:#161826}

/* ===== My Keys page ===== */
.fcard .fs{flex:1 1 calc(100% - calc(var(--u)*95.5));min-width:0;width:auto}
.app .fcard input[type=search]::placeholder{color:#6d707c}
.kbtns{display:flex;gap:calc(var(--u)*10);padding:0 calc(var(--u)*15) calc(var(--u)*13);flex-wrap:wrap}
.kbtns .exb{height:calc(var(--u)*39);padding:0 calc(var(--u)*17);font-size:calc(var(--u)*13.5)}
.kbtns .kb2{background:linear-gradient(135deg,#6c63ff,#8b5cf6);box-shadow:0 6px 18px rgba(108,99,255,.4)}
.kempty{min-height:calc(var(--u)*38)!important;padding:calc(var(--u)*10) calc(var(--u)*12)!important;font-size:calc(var(--u)*13.5);text-align:center;border:1px solid #272a33}
.hb2 .oc{margin-top:0;margin-bottom:calc(var(--u)*8);background:#161820}
[data-theme="light"] .hb2 .oc{background:#f6f6fc}

/* ===== Dashboard stats + Top 5 sellers ===== */
.dtitle{font-size:calc(var(--u)*16);font-weight:800;color:#fff;margin:calc(var(--u)*14) calc(var(--u)*2) 0;display:flex;align-items:center;gap:calc(var(--u)*9)}.dtitle i{color:#8b7bff;font-size:calc(var(--u)*15)}
.kgrid{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*12);margin-top:calc(var(--u)*11)}
.kc{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--u)*6);background:#0e1019;border:1px solid #1c2030;border-radius:calc(var(--u)*15);padding:calc(var(--u)*14) calc(var(--u)*13) calc(var(--u)*14) calc(var(--u)*14.5);min-height:calc(var(--u)*70);min-width:0}
.kc>div{min-width:0}.kc small{display:block;font-size:calc(var(--u)*9.5);font-weight:600;letter-spacing:.05em;color:#94a3b8;white-space:nowrap}
.kc b{display:block;margin-top:calc(var(--u)*5);font-size:calc(var(--u)*15);font-weight:700;line-height:1.1;white-space:nowrap;letter-spacing:.01em}
.kc b.g{color:#34d399}.kc b.b{color:#60a5fa}.kc b.p{color:#c084fc}.kc b.y{color:#facc15}
.ki{flex:none;width:calc(var(--u)*36);height:calc(var(--u)*36);border-radius:calc(var(--u)*10);display:grid;place-items:center;font-size:calc(var(--u)*16);border:1px solid}
.ki.g{background:#0e2a28;border-color:#16413a;color:#34d399}.ki.b{background:#10244a;border-color:#1b3567;color:#60a5fa}.ki.p{background:#231a45;border-color:#35285f;color:#c084fc}.ki.y{background:#2a2614;border-color:#403a1c;color:#facc15}
.top5{margin-top:calc(var(--u)*14);background:#0d0e14;border:1px solid #6b5c14;border-radius:calc(var(--u)*17);padding:calc(var(--u)*14) calc(var(--u)*16) calc(var(--u)*16);box-shadow:0 0 0 1px rgba(250,204,21,.18),0 0 calc(var(--u)*26) rgba(234,179,8,.16),inset 0 0 calc(var(--u)*22) rgba(250,204,21,.04)}
.top5 h3{display:flex;align-items:center;gap:calc(var(--u)*9);font-size:calc(var(--u)*13.5);font-weight:600;color:#fff;letter-spacing:.01em;margin:calc(var(--u)*2) 0 calc(var(--u)*14)}.top5 h3 i{color:#f59e0b;font-size:calc(var(--u)*14)}.top5 h3 small{margin-left:auto;font-size:calc(var(--u)*9.5);color:#8a8d99;font-weight:600}
.tsw{overflow-x:auto;padding-bottom:calc(var(--u)*12);scrollbar-width:thin;scrollbar-color:#6c7cff #0f1026}
.tsw::-webkit-scrollbar{height:calc(var(--u)*7)}.tsw::-webkit-scrollbar-track{background:#0f1026;border-radius:calc(var(--u)*6)}.tsw::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#6c7cff,#8b4fd0);border-radius:calc(var(--u)*6)}
.tst{width:100%;min-width:calc(var(--u)*410);border-collapse:collapse;table-layout:fixed}
.tst th{background:#1c1633;color:#bab7d8;font-size:calc(var(--u)*10);font-weight:600;letter-spacing:.09em;text-align:left;padding:0 0 0 calc(var(--u)*18);height:calc(var(--u)*38);white-space:nowrap}
.tst td{height:calc(var(--u)*29);padding:0 0 0 calc(var(--u)*18);border-bottom:1px solid #1f2230;color:#fff;font-weight:700;font-size:calc(var(--u)*12);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tst tr:last-child td{border-bottom:0}
.tst th:nth-child(1),.tst td:nth-child(1){width:calc(var(--u)*70)}.tst th:nth-child(2),.tst td:nth-child(2){width:calc(var(--u)*158)}.tst th:nth-child(3),.tst td:nth-child(3){width:calc(var(--u)*106)}.tst th:nth-child(4),.tst td:nth-child(4){width:calc(var(--u)*76)}
.rl{display:inline-block;padding:calc(var(--u)*5) calc(var(--u)*9);border-radius:calc(var(--u)*7);background:#4a3f45;color:#ecdcd4;font-size:calc(var(--u)*9);font-weight:700;letter-spacing:.03em}.rl.cu{background:#2c3140;color:#c5cadb}
.tst td.tse{text-align:center;color:#8a8d99;font-weight:500;padding:0;height:calc(var(--u)*60);white-space:normal}
[data-theme="light"] .dtitle{color:#161826}
[data-theme="light"] .kc{background:#fff;border-color:#e4e6f0}
[data-theme="light"] .top5{background:#fff}[data-theme="light"] .top5 h3,[data-theme="light"] .tst td{color:#161826}
[data-theme="light"] .tst th{background:#efeaff;color:#5b5890}[data-theme="light"] .tst td{border-color:#eceef7}

/* slider v2: native swipe (scroll-snap) - every banner is always reachable */
.slider{max-width:100%;min-width:0;width:100%}
.slides{overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;transition:none!important;transform:none!important;overscroll-behavior-x:contain}
.slides::-webkit-scrollbar{display:none}
.slide{flex:0 0 100%!important;min-width:100%!important;max-width:100%;scroll-snap-align:start;scroll-snap-stop:always}
.slide img{display:block;-webkit-user-drag:none;user-select:none}

/* ===== TELEGRAM SUPPORT BUTTON (premium) ===== */
@keyframes tgPulse{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.6);opacity:0}}
@keyframes tgFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.fab{
  background:radial-gradient(circle at 30% 25%,#8ad8ff 0%,#2aabee 45%,#1a8fd0 100%);
  color:#fff;border:1px solid rgba(255,255,255,.25);text-decoration:none;
  box-shadow:0 0 0 6px rgba(42,171,238,.16),0 10px 28px rgba(34,158,217,.55),inset 0 1px 0 rgba(255,255,255,.4);
  transition:transform .18s ease,box-shadow .2s ease;
  animation:tgFloat 3.2s ease-in-out infinite;
  bottom:14px;
}
.fab::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(42,171,238,.65);animation:tgPulse 2.2s ease-out infinite;pointer-events:none}
.fab i{position:relative;z-index:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.28));transform:translateX(-1px)}
.fab:hover{transform:translateY(-2px) scale(1.05)}
.fab:active{transform:scale(.92)}
@media (prefers-reduced-motion:reduce){.fab,.fab::before{animation:none}}