:root{
  --bg0:#07060F; --bg1:#0C0A1C; --glass:rgba(255,255,255,.045); --glass2:rgba(255,255,255,.07);
  --line:rgba(255,255,255,.10); --text:#EEF0FF; --mut:#8C8FC0; --faint:#5C5E86;
  --violet:#9B5CFF; --magenta:#FF4D9D; --cyan:#22D3EE; --mint:#34E5B0; --amber:#FDB022; --red:#FF6B7A;
  --aurora:linear-gradient(100deg,#FF4D9D,#9B5CFF 45%,#22D3EE);
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg0);color:var(--text);font-family:'Inter',sans-serif;font-size:14px;min-height:100vh}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:'Space Grotesk',sans-serif;letter-spacing:-.02em}
small{color:var(--faint);font-size:12px;display:block;margin-top:2px}
.mut{color:var(--mut)} .mint{color:var(--mint)} .cyan{color:var(--cyan)} .violet{color:var(--violet)} .amber{color:var(--amber)} .red{color:var(--red)}
.ell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* aurora bg */
.aurora{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.aurora span{position:absolute;width:480px;height:480px;border-radius:50%;filter:blur(90px);opacity:.28;animation:drift 24s ease-in-out infinite}
.aurora span:nth-child(1){background:var(--magenta);top:-10%;left:-5%}
.aurora span:nth-child(2){background:var(--violet);top:30%;right:-10%;animation-delay:-6s}
.aurora span:nth-child(3){background:var(--cyan);bottom:-15%;left:20%;animation-delay:-12s}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(40px,-30px) scale(1.15)}66%{transform:translate(-30px,20px) scale(.9)}}
@media (prefers-reduced-motion:reduce){.aurora span{animation:none}}

.glass{background:var(--glass);border:1px solid var(--line);border-radius:18px;backdrop-filter:blur(14px)}
.wrap{position:relative;z-index:1;max-width:1080px;margin:0 auto;padding:24px}

/* topbar */
.topbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 24px;border-bottom:1px solid var(--line);background:rgba(12,10,28,.5);backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:9px;font-family:'Space Grotesk';font-weight:700;font-size:18px}
.brand b{background:var(--aurora);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.logo{width:34px;height:34px;border-radius:10px;background:var(--aurora);display:grid;place-items:center;color:#fff}
.topnav{display:flex;gap:6px}
.topnav a{padding:8px 13px;border-radius:10px;color:var(--mut);font-weight:500}
.topnav a:hover{background:var(--glass2);color:var(--text)}
.userchip{display:flex;align-items:center;gap:10px}
.bal{color:var(--mint);font-weight:600;font-variant-numeric:tabular-nums}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--aurora);display:grid;place-items:center;color:#fff;font-weight:700}
.signout{color:var(--faint);font-size:18px}
@media(max-width:720px){.topnav{display:none}}

/* buttons + inputs */
.cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border:0;border-radius:12px;
  background:var(--aurora);color:#fff;font-weight:600;font-family:inherit;cursor:pointer;box-shadow:0 8px 24px rgba(155,92,255,.28);transition:.16s}
.cta:hover{filter:brightness(1.1);transform:translateY(-1px)}
.cta:disabled{opacity:.5;cursor:not-allowed;transform:none}
.ghost{display:inline-flex;align-items:center;padding:11px 20px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--text);font-weight:600;cursor:pointer}
.ghost:hover{border-color:var(--violet)}
.mini{padding:7px 13px;border:1px solid var(--line);border-radius:9px;background:transparent;color:var(--text);font-weight:600;font-size:13px;cursor:pointer;font-family:inherit}
.mini:hover{border-color:var(--violet)}
label{display:block;margin:0 0 13px;color:var(--mut);font-size:13px}
input,select{width:100%;margin-top:6px;padding:11px 13px;border:1px solid var(--line);border-radius:11px;background:rgba(0,0,0,.25);color:var(--text);font-size:14px;font-family:inherit}
input:focus,select:focus{outline:0;border-color:var(--violet);box-shadow:0 0 0 3px rgba(155,92,255,.18)}

/* hero */
.hero{padding:30px;margin-bottom:20px;overflow:hidden}
.hero-label{color:var(--mut);font-size:12px}
.hero-amt{font-family:'Space Grotesk';font-size:52px;font-weight:700;color:var(--mint);margin:6px 0 18px;font-variant-numeric:tabular-nums}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap}

.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:20px}
.stat{padding:16px}
.stat span{color:var(--mut);font-size:12px}
.stat b{display:block;font-family:'Space Grotesk';font-size:26px;margin-top:4px;font-variant-numeric:tabular-nums}

.card{padding:20px;margin-bottom:16px}
.card h3{margin:0 0 14px;font-size:15px}
.empty{color:var(--mut);text-align:center;padding:22px 0}

/* rows */
.orow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.otitle{font-weight:600;min-width:0}
.oright{display:flex;align-items:center;gap:10px;color:var(--mint);font-weight:600;font-variant-numeric:tabular-nums}
.badge{font-size:11px;border:1px solid;border-radius:6px;padding:2px 8px;font-weight:600}
.badge.mint{color:var(--mint);border-color:rgba(52,229,176,.35)}
.badge.cyan{color:var(--cyan);border-color:rgba(34,211,238,.35)}
.badge.amber{color:var(--amber);border-color:rgba(253,176,34,.35)}
.badge.red{color:var(--red);border-color:rgba(255,107,122,.35)}

/* services */
.grid2{display:grid;grid-template-columns:1fr 360px;gap:16px;align-items:start}
@media(max-width:900px){.grid2{grid-template-columns:1fr}}
.filterbar{margin-bottom:12px}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.chip{padding:7px 14px;border:1px solid var(--line);border-radius:20px;background:transparent;color:var(--mut);font-size:13px;cursor:pointer;font-family:inherit}
.chip.on{background:var(--aurora);color:#fff;border-color:transparent}
.svchead,.ohead{display:grid;gap:12px;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--faint);padding-bottom:10px;border-bottom:1px solid var(--line)}
.svchead{grid-template-columns:44px 1fr 80px 96px 66px}
.svcrow{display:grid;grid-template-columns:44px 1fr 80px 96px 66px;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line)}
.orderform{position:sticky;top:16px}
.picked{margin-top:6px;padding:11px 13px;border:1px dashed var(--line);border-radius:11px;color:var(--mut)}
.chargebox{display:flex;justify-content:space-between;align-items:center;padding:13px 15px;background:rgba(0,0,0,.25);border:1px solid var(--line);border-radius:12px;margin:4px 0 14px}
.chargebox b{font-size:22px;font-variant-numeric:tabular-nums}
.formnote{color:var(--faint);font-size:12px;margin-top:10px}

/* tabs / orders */
.tabs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.tab{padding:9px 16px;border:1px solid var(--line);border-radius:20px;background:transparent;color:var(--mut);cursor:pointer;font-family:inherit;font-weight:500}
.tab.on{background:var(--aurora);color:#fff;border-color:transparent}
.tabs input{width:auto;flex:1;min-width:160px;margin:0}
.ohead{grid-template-columns:70px 1.4fr 1.6fr .8fr .8fr .9fr}
.ordrow{display:grid;grid-template-columns:70px 1.4fr 1.6fr .8fr .8fr .9fr;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line)}

/* auth + deposits */
.authwrap{min-height:70vh;display:grid;place-items:center;padding:20px}
.authcard{width:100%;max-width:400px;padding:28px;background:var(--glass);border:1px solid var(--line);border-radius:22px;backdrop-filter:blur(20px);box-shadow:0 30px 80px rgba(0,0,0,.5)}
.ac-title{font-size:22px;margin:0} .ac-sub{color:var(--mut);margin:6px 0 20px}
.ac-foot{color:var(--mut);text-align:center;margin-top:16px} .ac-foot a{color:var(--violet)}
.social{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--glass2);font-weight:600;margin-bottom:10px}
.social:hover{border-color:var(--violet)}
.social.phone{color:var(--text)}
.divider{display:flex;align-items:center;gap:12px;color:var(--faint);margin:16px 0}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--line)}
.alert{background:rgba(255,107,122,.12);border:1px solid rgba(255,107,122,.35);color:#ffd9dd;padding:10px 13px;border-radius:10px;margin-bottom:14px;font-size:13px}
.seg{display:flex;gap:6px;background:rgba(0,0,0,.2);border:1px solid var(--line);border-radius:14px;padding:5px;margin-bottom:16px}
.segbtn{flex:1;padding:11px;border:0;border-radius:10px;background:transparent;color:var(--mut);font-weight:600;cursor:pointer;font-family:inherit}
.segbtn.on{background:var(--aurora);color:#fff}
.payresult{margin-top:14px;padding:14px;background:rgba(0,0,0,.25);border:1px solid var(--line);border-radius:12px}
.copyline{display:flex;gap:8px;align-items:center;margin-top:8px}
.copyline code{flex:1;overflow:hidden;text-overflow:ellipsis;font-family:'Chakra Petch',monospace;font-size:13px;color:var(--cyan)}
.warn{color:var(--amber);font-size:12px;margin-top:8px}