:root{
  --bg:#070914;--panel:#101425;--panel-2:#151b31;--text:#f7f8ff;--muted:#9aa4c7;
  --accent:#ff2bd6;--accent-2:#7c3cff;--success:#26f7a2;--danger:#ff476f;--warning:#ffd166;
  --border:rgba(255,255,255,.12);--shadow:0 18px 60px rgba(0,0,0,.36);--radius:20px;
}
[data-theme="cyan"]{--accent:#00f5ff;--accent-2:#0877ff;--bg:#020b12;--panel:#071822;--panel-2:#0b2230}
[data-theme="purple"]{--accent:#a855f7;--accent-2:#6d28d9;--bg:#0b0714;--panel:#171024;--panel-2:#211535}
[data-theme="emerald"]{--accent:#27f59a;--accent-2:#00a86b;--bg:#03110d;--panel:#092219;--panel-2:#0d3024}
[data-theme="orange"]{--accent:#ff9f1c;--accent-2:#ff4d00;--bg:#140b03;--panel:#251508;--panel-2:#341d0a}
[data-theme="red"]{--accent:#ff3b5c;--accent-2:#b00035;--bg:#140307;--panel:#260912;--panel-2:#350d19}
[data-theme="blue"]{--accent:#3b82f6;--accent-2:#00c2ff;--bg:#030a17;--panel:#09152a;--panel-2:#0d1e3b}
[data-theme="gold"]{--accent:#ffd166;--accent-2:#d99b00;--bg:#151104;--panel:#251e09;--panel-2:#33290c}
[data-theme="lime"]{--accent:#b7ff2a;--accent-2:#4fd400;--bg:#081104;--panel:#122209;--panel-2:#19300d}
[data-theme="rose"]{--accent:#ff5ca8;--accent-2:#ff1f75;--bg:#140610;--panel:#251020;--panel-2:#35162d}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:radial-gradient(circle at 80% -20%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 42%),var(--bg);color:var(--text)}
a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.muted{color:var(--muted)}
.app-shell{min-height:100vh}.topbar{height:72px;position:fixed;top:0;left:0;right:0;z-index:1030;display:flex;align-items:center;justify-content:space-between;padding:0 22px;background:rgba(7,9,20,.82);backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}
.brand{display:flex;align-items:center;gap:12px;font-weight:900;letter-spacing:.12em}.brand-orb{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 0 24px color-mix(in srgb,var(--accent) 55%,transparent)}
.neon-text{color:var(--text);text-shadow:none}
.top-user{display:flex;align-items:center;gap:10px}.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--panel-2);border:1px solid var(--border);color:var(--accent)}
.drawer-toggle{border:0;background:transparent;color:var(--text);font-size:1.25rem;cursor:pointer;padding:9px;border-radius:12px}.drawer-toggle:hover{background:var(--panel)}
.sidebar{position:fixed;top:72px;bottom:0;left:0;width:270px;z-index:1020;padding:18px 14px;background:rgba(12,16,31,.94);backdrop-filter:blur(20px);border-right:1px solid var(--border);overflow-y:auto;transition:transform .28s ease,width .28s ease}
.sidebar-title{font-size:.72rem;text-transform:uppercase;letter-spacing:.18em;color:var(--muted);padding:10px 14px}.nav-link{display:flex;align-items:center;gap:13px;padding:12px 14px;margin:4px 0;border-radius:14px;color:#dfe5ff;transition:.2s;border:1px solid transparent}.nav-link i{width:22px;text-align:center;color:var(--accent)}.nav-link:hover,.nav-link.active{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 17%,transparent),transparent);border-color:color-mix(in srgb,var(--accent) 35%,transparent);box-shadow:inset 0 0 28px color-mix(in srgb,var(--accent) 7%,transparent)}
.nav-link.reseller{color:var(--warning)}.content{margin-left:270px;padding:100px 26px 42px;min-height:100vh;transition:margin .28s ease}.app-shell.drawer-collapsed .sidebar{transform:translateX(-100%)}.app-shell.drawer-collapsed .content{margin-left:0}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:24px}.page-title{font-size:clamp(1.45rem,3vw,2.25rem);margin:0}.page-subtitle{color:var(--muted);margin:.4rem 0 0}.grid{display:grid;gap:18px}.grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.panel,.stat-card,.product-card{background:linear-gradient(145deg,color-mix(in srgb,var(--panel) 96%,white 4%),var(--panel));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.panel{padding:22px}.stat-card{padding:20px;position:relative;overflow:hidden}.stat-card::after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-45px;top:-55px;background:color-mix(in srgb,var(--accent) 18%,transparent);filter:blur(5px)}.stat-label{color:var(--muted);font-size:.86rem}.stat-value{font-size:1.75rem;font-weight:900;margin-top:6px}.stat-icon{color:var(--accent);font-size:1.2rem}
.balance-strip{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:18px 22px;margin-bottom:22px;border:1px solid color-mix(in srgb,var(--accent) 65%,transparent);border-radius:18px;background:linear-gradient(115deg,color-mix(in srgb,var(--accent) 13%,transparent),var(--panel));box-shadow:0 0 30px color-mix(in srgb,var(--accent) 13%,transparent)}.balance-strip strong{font-size:1.25rem}.balance-meta{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:12px;padding:10px 16px;font-weight:750;cursor:pointer;transition:.2s;min-height:42px}.btn:hover{transform:translateY(-1px)}.btn-primary{color:#070914;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 0 20px color-mix(in srgb,var(--accent) 28%,transparent)}.btn-success{background:var(--success);color:#02130c}.btn-danger{background:var(--danger);color:white}.btn-warning{background:var(--warning);color:#1a1200}.btn-ghost{background:transparent;color:var(--text);border-color:var(--border)}.btn-sm{padding:7px 10px;min-height:34px;font-size:.82rem}.btn-block{width:100%}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.product-card{padding:20px;position:relative;overflow:hidden;min-height:355px;display:flex;flex-direction:column}.product-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 90% 0,color-mix(in srgb,var(--card-accent) 24%,transparent),transparent 42%);pointer-events:none}.product-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:1.55rem;color:var(--card-accent);border:1px solid color-mix(in srgb,var(--card-accent) 60%,transparent);box-shadow:0 0 26px color-mix(in srgb,var(--card-accent) 22%,transparent);overflow:hidden;background:rgba(255,255,255,.03)}.product-icon img{width:100%;height:100%;object-fit:cover}.product-title{font-size:1.15rem;margin:15px 0 8px}.product-desc{color:var(--muted);font-size:.9rem;line-height:1.55;min-height:84px}.product-meta{display:flex;justify-content:space-between;margin:16px 0;padding:12px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.product-meta b{display:block;margin-top:4px}.qty-row{display:grid;grid-template-columns:120px 1fr;gap:10px;margin-top:auto}.qty-control{display:grid;grid-template-columns:34px 1fr 34px;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:rgba(255,255,255,.03)}.qty-control button{border:0;background:transparent;color:var(--text);cursor:pointer}.qty-control input{width:100%;border:0;background:transparent;color:var(--text);text-align:center;outline:0}.subtotal{font-size:.84rem;color:var(--muted);margin:10px 0}
.form-label{display:block;color:#dce2ff;font-size:.88rem;margin:0 0 7px}.form-control,.form-select{width:100%;border:1px solid var(--border);background:rgba(255,255,255,.045);color:var(--text);padding:11px 13px;border-radius:12px;outline:0;transition:.2s}.form-control:focus,.form-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent)}.form-select option{background:#151829;color:white}textarea.form-control{min-height:130px;resize:vertical}.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.form-group{margin-bottom:16px}
.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:16px}.data-table{width:100%;border-collapse:collapse;min-width:760px;background:rgba(255,255,255,.015)}.data-table th,.data-table td{padding:13px 14px;text-align:left;border-bottom:1px solid var(--border);vertical-align:middle}.data-table th{color:#dce2ff;font-size:.78rem;text-transform:uppercase;letter-spacing:.07em;background:rgba(255,255,255,.045);position:sticky;top:0}.data-table td{color:#e9edff;font-size:.9rem}.data-table tr:hover td{background:rgba(255,255,255,.025)}
.badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:.74rem;font-weight:800}.badge-success{color:var(--success);background:color-mix(in srgb,var(--success) 12%,transparent);border:1px solid color-mix(in srgb,var(--success) 35%,transparent)}.badge-danger{color:var(--danger);background:color-mix(in srgb,var(--danger) 12%,transparent);border:1px solid color-mix(in srgb,var(--danger) 35%,transparent)}.badge-warning{color:var(--warning);background:color-mix(in srgb,var(--warning) 12%,transparent);border:1px solid color-mix(in srgb,var(--warning) 35%,transparent)}.badge-info{color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--accent) 35%,transparent)}
.alert{padding:13px 16px;border-radius:13px;margin-bottom:15px;border:1px solid}.alert-success{background:color-mix(in srgb,var(--success) 10%,transparent);border-color:color-mix(in srgb,var(--success) 35%,transparent);color:var(--success)}.alert-danger{background:color-mix(in srgb,var(--danger) 10%,transparent);border-color:color-mix(in srgb,var(--danger) 35%,transparent);color:#ff9aaf}.alert-warning{background:color-mix(in srgb,var(--warning) 10%,transparent);border-color:color-mix(in srgb,var(--warning) 35%,transparent);color:var(--warning)}
.modal-backdrop{display:none;position:fixed;inset:0;z-index:1100;background:rgba(0,0,0,.72);backdrop-filter:blur(8px);padding:20px;align-items:center;justify-content:center}.modal-backdrop.open{display:flex}.modal-card{width:min(560px,100%);max-height:90vh;overflow:auto;background:var(--panel);border:1px solid var(--border);border-radius:22px;box-shadow:0 30px 100px rgba(0,0,0,.65);padding:22px}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.modal-close{border:0;background:transparent;color:var(--text);font-size:1.25rem;cursor:pointer}
.active-card{border-left:3px solid var(--accent);padding:18px}.active-number-line{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.copy-value{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:rgba(255,255,255,.05);border:1px solid var(--border);padding:10px 12px;border-radius:12px;word-break:break-all}.otp-output{margin-top:12px;padding:12px;border-radius:12px;background:rgba(255,255,255,.04);border:1px dashed color-mix(in srgb,var(--accent) 35%,transparent);white-space:pre-wrap;word-break:break-word}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.tab-btn{padding:9px 14px;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--text)}.tab-btn.active{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.theme-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.theme-option{border:1px solid var(--border);border-radius:16px;padding:14px;cursor:pointer;background:var(--panel);text-align:center}.theme-option input{display:none}.theme-option.selected{border-color:var(--accent);box-shadow:0 0 24px color-mix(in srgb,var(--accent) 20%,transparent)}.theme-swatch{height:55px;border-radius:12px;margin-bottom:9px;background:linear-gradient(135deg,var(--swatch),#070914)}
.auth-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 20%,rgba(255,43,214,.24),transparent 35%),radial-gradient(circle at 85% 80%,rgba(124,60,255,.23),transparent 38%),#050610}.auth-card{width:min(430px,100%);padding:30px;background:rgba(15,17,34,.88);border:1px solid rgba(255,255,255,.13);border-radius:26px;box-shadow:0 35px 100px rgba(0,0,0,.6);backdrop-filter:blur(20px)}.auth-logo{width:70px;height:70px;margin:0 auto 14px;border-radius:22px;display:grid;place-items:center;font-size:1.8rem;background:linear-gradient(135deg,#ff2bd6,#7c3cff);box-shadow:0 0 35px rgba(255,43,214,.35)}.auth-title{text-align:center;margin:0}.auth-subtitle{text-align:center;color:#9aa4c7;margin:8px 0 24px}.auth-links{display:flex;justify-content:space-between;gap:10px;margin-top:16px;font-size:.9rem}.auth-links a{color:#ff77e7}
.empty-state{text-align:center;padding:42px 20px;color:var(--muted)}.empty-state i{font-size:2.2rem;color:var(--accent);margin-bottom:12px}.search-bar{display:flex;gap:10px;align-items:center}.actions{display:flex;gap:7px;flex-wrap:wrap}.password-mask{letter-spacing:.15em;color:var(--muted)}
@media(max-width:1500px){.grid-5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1200px){.grid-5,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.theme-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.sidebar{transform:translateX(-100%);width:min(300px,88vw)}.content{margin-left:0;padding:92px 16px 32px}.app-shell.drawer-open .sidebar{transform:translateX(0)}.app-shell.drawer-collapsed .sidebar{transform:translateX(-100%)}.drawer-scrim{display:none;position:fixed;inset:72px 0 0;background:rgba(0,0,0,.55);z-index:1010}.app-shell.drawer-open .drawer-scrim{display:block}.grid-3{grid-template-columns:1fr 1fr}.form-row{grid-template-columns:1fr}}
@media(max-width:640px){.topbar{padding:0 13px}.brand span:last-child{font-size:.82rem}.top-user .user-copy{display:none}.grid-5,.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}.theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.balance-strip{align-items:flex-start;flex-direction:column}.qty-row{grid-template-columns:1fr}.page-head{align-items:flex-start;flex-direction:column}.search-bar{align-items:stretch;flex-direction:column}.panel{padding:16px}.product-card{min-height:unset}.modal-card{padding:17px}}

/* Added account themes */
[data-theme="admin"]{--accent:#a855f7;--accent-2:#6d28d9;--bg:#0b0714;--panel:#171024;--panel-2:#211535}
[data-theme="dark"]{--accent:#8b9cff;--accent-2:#4f64ff;--bg:#050608;--panel:#101116;--panel-2:#181a22;--text:#f5f7ff;--muted:#979dab}
[data-theme="light-dark"]{--accent:#6f86ff;--accent-2:#8d5cff;--bg:#252a34;--panel:#343b48;--panel-2:#414a59;--text:#ffffff;--muted:#c2c9d5;--border:rgba(255,255,255,.16)}
[data-theme="white"]{--accent:#ff2bd6;--accent-2:#7c3cff;--bg:#ffffff;--panel:#ffffff;--panel-2:#f5f3fb;--text:#171421;--muted:#6e677b;--border:rgba(35,24,50,.14);--shadow:0 18px 55px rgba(43,24,60,.12);--success:#008c5a;--danger:#d92d55;--warning:#9a6600}
[data-theme="light-white"]{--accent:#00a7c4;--accent-2:#646cff;--bg:#f4f8fb;--panel:#ffffff;--panel-2:#eaf2f7;--text:#15222c;--muted:#647480;--border:rgba(21,34,44,.13);--shadow:0 18px 55px rgba(26,57,73,.11);--success:#007d52;--danger:#ce3152;--warning:#916100}

.profile-trigger{appearance:none;border:0;background:transparent;color:var(--text);cursor:pointer;border-radius:14px;padding:7px 9px;transition:.2s;text-align:left}.profile-trigger:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}.profile-chevron{font-size:.72rem;color:var(--muted);margin-left:2px}.profile-card{width:min(440px,100%)}.profile-hero{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid var(--border);border-radius:17px;background:color-mix(in srgb,var(--accent) 7%,var(--panel));margin-bottom:15px}.profile-avatar{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;font-size:1.3rem;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;box-shadow:0 0 25px color-mix(in srgb,var(--accent) 30%,transparent)}.profile-details{display:grid;gap:10px;margin:0 0 18px}.profile-details>div{display:flex;justify-content:space-between;gap:18px;padding:11px 0;border-bottom:1px solid var(--border)}.profile-details strong{text-align:right;overflow-wrap:anywhere}
.inline-copy{display:flex;align-items:center;gap:7px;min-width:0}.inline-copy .copy-value{padding:7px 9px;display:inline-block}.api-copy{min-width:250px}.url-ellipsis{max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.otp-message-text{font-weight:650;white-space:pre-wrap;word-break:break-word}.otp-checked-url{font-size:.75rem;color:var(--muted);margin-top:8px;word-break:break-all}.otp-code-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid var(--border)}

[data-theme="white"] .topbar,[data-theme="light-white"] .topbar{background:rgba(255,255,255,.86)}
[data-theme="white"] .sidebar,[data-theme="light-white"] .sidebar{background:rgba(255,255,255,.94)}
[data-theme="white"] .nav-link,[data-theme="light-white"] .nav-link{color:var(--text)}
[data-theme="white"] .form-label,[data-theme="light-white"] .form-label,[data-theme="white"] .data-table th,[data-theme="light-white"] .data-table th,[data-theme="white"] .data-table td,[data-theme="light-white"] .data-table td{color:var(--text)}
[data-theme="white"] .form-control,[data-theme="white"] .form-select,[data-theme="light-white"] .form-control,[data-theme="light-white"] .form-select{background:rgba(15,23,42,.035)}
[data-theme="white"] .form-select option,[data-theme="light-white"] .form-select option{background:#fff;color:#171421}
[data-theme="white"] .copy-value,[data-theme="white"] .otp-output,[data-theme="light-white"] .copy-value,[data-theme="light-white"] .otp-output{background:rgba(15,23,42,.035)}
[data-theme="white"] .data-table,[data-theme="light-white"] .data-table{background:rgba(15,23,42,.012)}
[data-theme="white"] .data-table th,[data-theme="light-white"] .data-table th{background:rgba(15,23,42,.045)}
[data-theme="white"] .data-table tr:hover td,[data-theme="light-white"] .data-table tr:hover td{background:rgba(15,23,42,.025)}
[data-theme="white"] .theme-swatch,[data-theme="light-white"] .theme-swatch{box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}

@media(max-width:640px){.profile-chevron{display:none}.api-copy{min-width:220px}.otp-code-row{align-items:stretch;flex-direction:column}.otp-code-row .btn{width:100%}}