:root{--bg:#090806;--surface:#11100d;--surface2:#17140f;--line:#2b261e;--bronze:#c48a4a;--bronze2:#8d5e2d;--cream:#f1e6d6;--muted:#81786c;--danger:#d1695f;--green:#79a77b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 80% -10%,#21180e 0,transparent 35%),var(--bg);color:var(--cream);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:14px}button,input{font:inherit}.app-shell{display:grid;grid-template-columns:224px 1fr;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:224px;border-right:1px solid var(--line);background:rgba(10,9,7,.94);padding:30px 18px 22px;display:flex;flex-direction:column;z-index:4}.brand{display:flex;align-items:center;gap:12px;padding:0 10px 34px}.brand b{letter-spacing:.18em;font-family:Georgia,serif;font-size:17px}.brand small{display:block;color:var(--bronze);font-size:9px;letter-spacing:.27em;margin-top:3px}.logo-mark{width:38px;height:38px;border:1px solid var(--bronze);color:var(--bronze);display:grid;place-items:center;font-family:Georgia,serif;font-size:22px;transform:rotate(45deg)}.logo-mark::first-letter{transform:rotate(-45deg)}nav{display:grid;gap:7px}nav a{color:#8e857a;text-decoration:none;padding:12px 13px;border:1px solid transparent;border-radius:3px;display:flex;gap:12px;align-items:center}nav a:hover,nav a.active{color:var(--cream);background:linear-gradient(90deg,rgba(196,138,74,.15),transparent);border-color:#34291c}nav a span{color:var(--bronze);font-size:16px}.sidebar-foot{margin-top:auto;border-top:1px solid var(--line);padding:20px 9px 0;display:flex;gap:10px;align-items:center}.sidebar-foot b{font-size:10px;letter-spacing:.18em}.sidebar-foot small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.status-dot,.live i,.signal i{width:7px;height:7px;border-radius:50%;background:#6ca473;box-shadow:0 0 12px #6ca473}.content{grid-column:2;padding:34px clamp(24px,4vw,64px) 70px;max-width:1700px;width:100%;margin:auto}header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:28px}h1,h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;margin:0}header h1{font-size:40px;letter-spacing:-.02em}h2{font-size:22px}.eyebrow{color:var(--bronze);font-size:10px;letter-spacing:.22em;font-weight:700;margin:0 0 8px}.muted{color:var(--muted)}header .muted{margin:7px 0 0}.header-actions{display:flex;gap:11px;align-items:center}.live,.logout{border:1px solid var(--line);padding:9px 13px;border-radius:2px;color:#92887d;text-decoration:none;font-size:10px;letter-spacing:.12em}.live{display:flex;align-items:center;gap:8px}.filter-bar{display:flex;justify-content:space-between;gap:18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 0;margin-bottom:22px}.presets{display:flex;gap:5px;flex-wrap:wrap}.presets button,.filter-bar form button{border:1px solid transparent;background:transparent;color:var(--muted);padding:8px 12px;cursor:pointer}.presets button:hover,.presets button.active{color:var(--cream);border-color:var(--bronze2);background:#1b150e}.filter-bar form{display:flex;align-items:center;gap:8px}.filter-bar input{color:#b8aa99;background:#100e0b;border:1px solid var(--line);padding:7px;color-scheme:dark}.filter-bar form button{border-color:var(--line);color:var(--cream)}.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}.kpi,.panel,.mini{background:linear-gradient(145deg,rgba(24,21,16,.96),rgba(14,13,10,.98));border:1px solid var(--line);position:relative;overflow:hidden}.kpi{padding:22px;min-height:142px}.kpi.bronze{border-color:#5a3d20;background:linear-gradient(145deg,#21170d,#12100d)}.kpi.bronze:after{content:"";position:absolute;width:110px;height:110px;border:1px solid rgba(196,138,74,.1);transform:rotate(45deg);right:-55px;top:-55px}.kpi-top{display:flex;justify-content:space-between;color:#94897b;font-size:10px;letter-spacing:.14em}.kpi-top b{color:var(--bronze);font-size:17px}.kpi strong{display:block;font-family:Georgia,serif;font-size:30px;font-weight:400;margin:20px 0 7px}.kpi small{color:var(--muted)}.panel-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,.8fr);gap:12px;margin-bottom:12px}.panel{padding:22px}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}.legend{color:var(--muted);font-size:11px;display:flex;align-items:center;gap:6px}.legend span{width:15px;height:2px;margin-left:8px}.legend .rev{background:var(--bronze)}.legend .prof{background:var(--cream)}.chart-wrap{height:280px;position:relative}.chart-wrap canvas{position:absolute;inset:0}.empty{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted)}.footnote{font-size:10px;color:#71685e;margin:7px 0 0}.donut-row{display:flex;align-items:center;gap:26px;margin-top:30px}.donut{--p:0;width:145px;aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--bronze) calc(var(--p)*1%),#29231c 0);position:relative;display:grid;place-content:center;text-align:center;flex:none}.donut:before{content:"";position:absolute;inset:13px;border-radius:50%;background:#13110e}.donut span,.donut small{position:relative}.donut span{font:25px Georgia,serif}.donut small{color:var(--muted);margin-top:3px}.cost-list{display:grid;gap:16px;flex:1}.cost-list div{display:flex;justify-content:space-between;border-bottom:1px solid #29241e;padding-bottom:10px}.cost-list span{color:var(--muted)}.cost-list b{font-weight:500}.mini-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}.mini{padding:18px 20px}.mini>span{color:var(--muted);font-size:11px}.mini strong{display:block;font:26px Georgia,serif;margin:10px 0 3px}.mini small{color:#766c61}.mini.danger{border-color:#4d2925}.lower{grid-template-columns:1fr 1fr}.method-list{display:grid;gap:17px}.method{display:grid;grid-template-columns:1fr auto;gap:7px}.method div:first-child{display:flex;flex-direction:column}.method span{color:var(--muted);font-size:11px;margin-top:3px}.method strong{font-weight:500}.bar{grid-column:1/-1;height:2px;background:#2a251e}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--bronze2),var(--bronze))}.user-stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}.user-stats div{background:#13110e;padding:18px}.user-stats strong{display:block;font:25px Georgia,serif}.user-stats span{color:var(--muted);font-size:11px}.referral-line{display:flex;justify-content:space-between;margin-top:20px;padding-top:16px;border-top:1px solid var(--line);color:var(--muted)}.referral-line b{color:var(--cream)}.table-panel{margin-bottom:12px;padding:0}.table-panel .panel-head{padding:22px 22px 0}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%;min-width:720px}th,td{text-align:left;padding:13px 18px;border-top:1px solid var(--line);white-space:nowrap}th{color:#796f64;font-size:9px;letter-spacing:.15em}td{color:#bdb2a5;font-size:12px}.code{color:var(--bronze);letter-spacing:.08em}.badge{display:inline-block;padding:4px 7px;border:1px solid #38322a;color:#948a7e;font-size:9px;text-transform:uppercase}.badge.paid,.badge.completed,.badge.active{color:#82a884;border-color:#304534}.badge.failed,.badge.cancelled,.badge.inactive{color:#c3746d;border-color:#51302d}.badge.pending,.badge.processing{color:#c89a61;border-color:#5b4125}.empty-row{text-align:center;color:var(--muted);padding:30px}.toast{position:fixed;right:24px;bottom:24px;background:#2b1714;border:1px solid #713b34;color:#e0a199;padding:13px 18px;z-index:10}.loading .content:after{content:"";position:fixed;left:224px;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--bronze),transparent);animation:load 1.1s infinite}@keyframes load{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.login-page{min-height:100vh;display:grid;place-items:center;padding:28px;background:radial-gradient(circle at 17% 35%,#25170a 0,transparent 30%),#090806}.login-shell{width:min(960px,100%);min-height:570px;display:grid;grid-template-columns:1.15fr .85fr;border:1px solid #3b2b1b;background:#0d0b09;box-shadow:0 28px 90px #000}.login-brand{padding:70px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;position:relative;overflow:hidden}.login-brand:after{content:"";position:absolute;width:420px;height:420px;border:1px solid rgba(196,138,74,.11);transform:rotate(45deg);left:-250px;bottom:-250px}.login-brand .logo-mark{margin-bottom:42px}.login-brand h1{font-size:48px;line-height:1.05}.login-brand h1 span{color:var(--bronze)}.login-copy{color:#8e8376;max-width:390px;line-height:1.6}.signal{margin-top:42px;color:#81786d;font-size:11px;display:flex;align-items:center;gap:9px}.login-card{background:#13110e;border-left:1px solid var(--line);padding:70px 50px;display:flex;flex-direction:column;justify-content:center}.login-card h2{font-size:31px}.login-card form{display:grid;gap:20px;margin-top:34px}.login-card label{display:grid;gap:8px;color:#8f8579;font-size:11px;letter-spacing:.08em}.login-card input{background:#0c0b09;border:1px solid #383127;color:var(--cream);padding:14px;outline:none}.login-card input:focus{border-color:var(--bronze)}.login-card button{background:linear-gradient(100deg,#8b592d,#c1884b);border:0;color:#100d09;padding:14px 18px;font-weight:700;cursor:pointer;display:flex;justify-content:space-between}.form-error{color:#d67d72;margin:0}.secure-note{color:#655e55;font-size:10px;text-align:center;margin-top:26px}
@media(max-width:1100px){.kpi-grid{grid-template-columns:1fr 1fr}.panel-grid{grid-template-columns:1fr}.mini-grid{grid-template-columns:1fr 1fr}}@media(max-width:760px){.app-shell{display:block}.sidebar{position:static;width:auto;height:auto;padding:17px}.brand{padding-bottom:14px}.sidebar nav{display:flex;overflow:auto}.sidebar nav a{white-space:nowrap}.sidebar-foot{display:none}.content{padding:24px 14px}.kpi-grid,.mini-grid{grid-template-columns:1fr}.filter-bar{align-items:flex-start;flex-direction:column}.filter-bar form{width:100%;overflow:auto}header h1{font-size:32px}.donut-row{flex-direction:column;align-items:stretch}.donut{align-self:center}.login-shell{grid-template-columns:1fr}.login-brand{display:none}.login-card{border:0;padding:45px 28px;min-height:520px}.loading .content:after{left:0}}


/* STARBOX ADMIN 2.0 */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  --bg:#080e14;
  --surface:#101b25;
  --surface2:#15232f;
  --line:#263743;
  --bronze:#28d7c2;
  --bronze2:#128c89;
  --cream:#edf8fa;
  --muted:#8ba2af;
  --green:#45d6a3;
}

body {
  background:radial-gradient(ellipse at 75% 0%,#12323b 0%,transparent 42%),var(--bg);
  color:var(--cream);
  font-family:'Manrope',sans-serif;
}

h1,h2,.kpi strong,.mini strong,.user-stats strong,
.donut span,.brand b,.login-brand h1,.login-card h2 {
  font-family:'Manrope',sans-serif;
}

h1,h2 {font-weight:800;letter-spacing:-.045em}
header h1 {font-size:38px}

.sidebar {
  background:#0c1720;
  border-right:1px solid var(--line);
}

.brand b {font-weight:800;letter-spacing:.08em}
.brand small {color:var(--bronze)}

.logo-mark {
  border-radius:12px;
  transform:none;
  background:linear-gradient(145deg,#123d43,#10252e);
  box-shadow:0 0 25px #20d4c21a;
  font-family:'Manrope',sans-serif;
  font-weight:800;
}
.logo-mark::first-letter {transform:none}

nav a {border-radius:11px;transition:.2s}
nav a:hover,nav a.active {
  background:#14313a;
  border-color:#235c63;
  color:#e9ffff;
}

.kpi,.panel,.mini {
  border-radius:17px;
  background:linear-gradient(145deg,#14232e,#0e1923);
  border:1px solid var(--line);
  box-shadow:0 12px 35px #00000020;
}

.kpi {transition:transform .2s,border-color .2s}
.kpi:hover {transform:translateY(-3px);border-color:#287b7d}

.kpi.bronze {
  background:linear-gradient(135deg,#17454a,#10252e);
  border-color:#287d7c;
}

.kpi strong {font-weight:800;font-size:30px}
.kpi-top b {color:var(--bronze)}

.panel {padding:24px}
.panel-head h2 {font-size:20px}

.presets button,.filter-bar form button {
  border-radius:9px;
  transition:.2s;
}
.presets button.active,.presets button:hover {
  background:#143a40;
  border-color:#258e8b;
}

.filter-bar input {
  background:#111e29;
  border-radius:9px;
  border-color:var(--line);
  color:#e7f9fa;
}

.mini strong,.user-stats strong {font-weight:800}

.user-stats div {background:#101f2a}

.donut {
  background:conic-gradient(var(--bronze) calc(var(--p)*1%),#263943 0);
}
.donut:before {background:#12202b}
.donut span {font-weight:800}

.bar {height:6px;border-radius:8px;background:#243541}
.bar i {
  border-radius:8px;
  background:linear-gradient(90deg,#168c91,#35e4c8);
}

th {background:#14232e;color:#8ea8b4}
td {color:#d3e3e8}
tbody tr {transition:background .15s}
tbody tr:hover {background:#19313b}

.badge {border-radius:7px;font-weight:700}
.badge.paid,.badge.completed,.badge.active {
  color:#50e4ac;border-color:#28654d;background:#123629;
}
.badge.failed,.badge.cancelled,.badge.inactive {
  color:#ff928e;border-color:#784044;background:#351d27;
}
.badge.pending,.badge.processing {
  color:#f5c87a;border-color:#755d35;background:#392b1d;
}

.live,.logout {border-radius:9px}
.logout:hover {color:#fff;border-color:var(--bronze)}

.login-page {
  background:radial-gradient(circle at 20% 30%,#12353d,transparent 45%),var(--bg);
}
.login-shell {border-radius:22px;overflow:hidden;border-color:var(--line)}
.login-card {background:#101e29;border-color:var(--line)}
.login-card input {background:#0c1720;border-radius:9px;color:var(--cream)}
.login-card button {
  border-radius:9px;
  background:linear-gradient(100deg,#139d9c,#36dfc7);
}


/* STARBOX CHART 2.0 */
#emptyChart[hidden],
.chart-tooltip[hidden],
.chart-details[hidden] {
  display:none !important;
}

.chart-wrap {
  position:relative;
  height:280px;
}

#salesChart {
  cursor:crosshair;
  touch-action:pan-y;
}

.chart-controls {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:-4px 0 15px;
}

.chart-controls button {
  background:#12232e;
  border:1px solid #29424d;
  color:#8eabb8;
  border-radius:9px;
  padding:8px 12px;
  cursor:pointer;
  font-size:11px;
  transition:.2s;
}

.chart-controls button:hover,
.chart-controls button.active {
  background:#164248;
  border-color:#28cdbb;
  color:#eafffc;
}

.chart-tooltip {
  position:absolute;
  z-index:5;
  width:205px;
  padding:14px;
  border:1px solid #286b70;
  border-radius:12px;
  background:rgba(12,29,39,.97);
  box-shadow:0 12px 35px #0008;
  pointer-events:none;
}

.chart-tooltip>b {
  display:block;
  color:#e8ffff;
  font-size:13px;
  margin-bottom:10px;
}

.chart-tooltip>div {
  display:flex;
  justify-content:space-between;
  gap:8px;
  margin:7px 0;
  font-size:11px;
}

.chart-tooltip span {color:#9cb7c1}
.chart-tooltip strong {color:#e7ffff}
.chart-tooltip small {
  display:block;
  color:#668b96;
  margin-top:10px;
  font-size:10px;
}

.chart-details {
  margin-top:15px;
  padding:17px;
  background:#102a34;
  border:1px solid #28666b;
  border-radius:13px;
}

.chart-details-title {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}

.chart-details-title span {
  color:#86aab7;
  font-size:11px;
}

.chart-details-title strong {
  color:#eaffff;
  font-size:14px;
}

.chart-close {
  margin-left:auto;
  background:transparent;
  color:#9db8c1;
  border:0;
  cursor:pointer;
  font-size:15px;
}

.chart-details-values {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.chart-details-values>div {
  padding:13px;
  background:#0b202a;
  border-radius:10px;
}

.chart-details-values span {
  display:block;
  color:#8aabb7;
  font-size:11px;
  margin-bottom:7px;
}

.chart-details-values strong {
  color:#e9ffff;
  font-size:20px;
  font-weight:800;
}

.chart-details>small {
  display:block;
  color:#7595a1;
  font-size:10px;
  margin-top:12px;
}

@media(max-width:760px) {
  .chart-tooltip {width:185px}
  .chart-details-values strong {font-size:16px}
}