:root{--bg:#060a12;--panel:#0d1422;--panel2:#111b2d;--line:#26344b;--text:#f6f8fc;--muted:#91a0b5;--gold:#f6c84c;--gold2:#ffdc70;--blue:#7da7ff;--danger:#ff6b6b;--ok:#6fe3a1;--shadow:0 22px 70px rgba(0,0,0,.34)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(900px 500px at 80% -10%,rgba(48,84,145,.25),transparent 65%),var(--bg);color:var(--text);line-height:1.55}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.018),transparent 30%,rgba(255,255,255,.012));z-index:-1}
a{color:#c9d8f2;text-decoration:none;transition:.2s ease}a:hover{color:var(--gold2)}button,input,select,textarea{font:inherit}
.nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:26px;padding:15px max(22px,5vw);border-bottom:1px solid rgba(255,255,255,.07);background:rgba(6,10,18,.84);backdrop-filter:blur(18px)}.logo{font-size:20px;font-weight:950;letter-spacing:.04em;white-space:nowrap}.logo span{color:var(--gold)}.nav nav{display:flex;align-items:center;gap:5px;flex:1}.nav nav a{padding:9px 12px;border-radius:10px;color:#aebbd0;font-size:14px;font-weight:700}.nav nav a:hover{background:#111b2c;color:#fff}.nav>.btn{margin-left:auto}
.hero{max-width:1400px;margin:auto;padding:78px max(22px,7vw) 54px;display:grid;grid-template-columns:1.35fr .65fr;gap:28px;align-items:center}.eyebrow{margin:0 0 10px;letter-spacing:.18em;color:var(--gold);font-weight:900;font-size:11px}.hero h1,h1{font-size:clamp(38px,6vw,72px);line-height:1.02;letter-spacing:-.045em;margin:8px 0 18px}.hero h1 span,h1 span{color:var(--gold)}h2{font-size:clamp(27px,4vw,40px);line-height:1.1;letter-spacing:-.03em;margin:8px 0 12px}h3{margin:8px 0;font-size:19px}.muted{color:var(--muted)}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.hero-card,.product,.install-box,.stat-card,.feature-card,.admin-card{background:linear-gradient(145deg,rgba(20,31,49,.96),rgba(10,17,29,.96));border:1px solid rgba(126,151,190,.19);border-radius:22px;box-shadow:var(--shadow)}.hero-card{padding:30px;min-height:230px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.hero-card:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-70px;top:-70px;background:rgba(246,200,76,.12);filter:blur(2px)}.hero-card b{color:var(--gold);font-size:12px;letter-spacing:.12em}.hero-card strong{font-size:30px;line-height:1.12;margin:10px 0}.hero-card small{color:var(--muted)}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:46px;padding:12px 19px;border:1px solid transparent;border-radius:13px;background:linear-gradient(180deg,var(--gold2),var(--gold));color:#101319;font-weight:900;cursor:pointer;box-shadow:0 8px 24px rgba(246,200,76,.15);transition:transform .18s,box-shadow .18s}.btn:hover{color:#101319;transform:translateY(-1px);box-shadow:0 12px 30px rgba(246,200,76,.23)}.btn.ghost{background:rgba(255,255,255,.02);color:#e8eef8;border-color:#3a4b64;box-shadow:none}.btn.ghost:hover{background:#141f31}.btn.small{min-height:38px;padding:8px 13px;border-radius:10px;font-size:13px}.btn.wide{width:100%}
.stats{max-width:1400px;margin:auto;padding:10px max(22px,7vw) 46px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stats div{padding:21px 22px;border:1px solid rgba(126,151,190,.15);border-radius:17px;background:#0b121f}.stats b{display:block;color:var(--gold);font-size:25px}.stats small{display:block;color:var(--muted);margin-top:2px}
.section{width:min(1400px,100%);padding:52px max(22px,7vw);margin:auto}.section.dark{width:100%;max-width:none;background:linear-gradient(135deg,#0c1626,#080d17);border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05)}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.text-link{font-weight:800;color:var(--gold)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}.product{padding:16px;overflow:hidden}.thumb{height:150px;border-radius:16px;display:grid;place-items:center;font-weight:950;font-size:18px;color:#fff;background:radial-gradient(circle at 75% 20%,rgba(246,200,76,.25),transparent 35%),linear-gradient(145deg,#16263e,#0b1525);border:1px solid #263954}.price{font-size:23px;font-weight:950;color:var(--gold);margin:12px 0}.big{font-size:36px;font-weight:950;color:var(--gold);margin:8px 0}.install-box{width:min(640px,100%);padding:30px;margin-top:24px}input,select,textarea{width:100%;padding:14px 15px;margin:6px 0;background:#08111f;color:#f4f7fb;border:1px solid #2b3b53;border-radius:12px;outline:none}input::placeholder,textarea::placeholder{color:#718096}input:focus,select:focus,textarea:focus{border-color:rgba(246,200,76,.75);box-shadow:0 0 0 3px rgba(246,200,76,.08)}textarea{min-height:140px;resize:vertical}hr{border:0;border-top:1px solid #26344b;margin:18px 0}details{margin-top:14px;padding-top:12px;border-top:1px solid #26344b}summary{cursor:pointer;font-weight:800;color:var(--gold)}footer{padding:42px max(22px,7vw);color:#65748a;border-top:1px solid rgba(255,255,255,.06)}footer a{color:var(--gold);font-weight:800;text-decoration:none}footer a:hover{text-decoration:underline}
/* Auth */.auth-page{min-height:100vh;display:grid;place-items:center;padding:34px 18px;background:radial-gradient(600px 420px at 50% 20%,rgba(35,70,120,.25),transparent 70%)}.auth-shell{width:min(520px,100%)}.auth-brand{text-align:center;margin-bottom:22px}.auth-brand .mark{width:64px;height:64px;margin:0 auto 14px;border-radius:20px;display:grid;place-items:center;border:1px solid rgba(246,200,76,.5);background:linear-gradient(145deg,#182944,#0c1422);color:var(--gold);font-size:28px;box-shadow:0 15px 40px rgba(0,0,0,.35)}.auth-card{padding:32px;border-radius:24px}.auth-card h1{font-size:40px;text-align:center;letter-spacing:-.035em}.auth-card .sub{text-align:center;color:var(--muted);margin-top:-8px;margin-bottom:22px}.auth-card .btn{width:100%;margin-top:12px}.auth-links{display:flex;justify-content:center;gap:5px;margin-top:20px;color:var(--muted)}.auth-links a{color:var(--gold);font-weight:800}.auth-help{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.auth-help div{padding:13px 8px;text-align:center;color:var(--muted);font-size:12px}.auth-help b{display:block;color:#e8edf5;font-size:13px;margin-bottom:2px}
/* Admin */.admin-wrap{width:min(1400px,100%);margin:auto;padding:44px max(22px,5vw)}.admin-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}.admin-title h1{font-size:clamp(38px,6vw,62px);margin:0}.admin-user{padding:10px 14px;border:1px solid #26344b;border-radius:14px;background:#0d1422;color:var(--muted)}.admin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:28px}.admin-card{padding:22px;min-height:145px}.admin-card .label{color:#dbe4f1;font-weight:800}.admin-card .value{font-size:38px;font-weight:950;color:var(--gold);margin-top:20px}.quick-title{font-size:18px;font-weight:900;margin:22px 0 12px}.quick-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.quick{padding:18px;border:1px solid #2b3b53;border-radius:16px;background:#0c1421;display:block}.quick b{display:block;color:#fff}.quick small{color:var(--muted)}.admin-footer{display:flex;justify-content:space-between;gap:15px;margin-top:30px;padding-top:20px;border-top:1px solid #26344b}
@media(max-width:900px){.nav{gap:12px}.nav nav{display:none}.hero{grid-template-columns:1fr;padding-top:52px}.stats{grid-template-columns:repeat(2,1fr)}.admin-grid{grid-template-columns:repeat(2,1fr)}.quick-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.nav{padding:13px 16px}.logo{font-size:17px}.hero,.section,.admin-wrap{padding-left:16px;padding-right:16px}.hero{padding-top:42px}.hero h1,h1{font-size:42px}.hero-card{min-height:190px}.stats{padding-left:16px;padding-right:16px;grid-template-columns:repeat(2,1fr);gap:10px}.stats div{padding:16px}.grid{grid-template-columns:1fr}.section-head{align-items:start;flex-direction:column}.auth-card{padding:24px 18px}.auth-card h1{font-size:34px}.auth-help{grid-template-columns:1fr 1fr 1fr}.admin-top{align-items:flex-start;flex-direction:column}.admin-grid{grid-template-columns:1fr 1fr}.admin-card{min-height:125px;padding:17px}.admin-card .value{font-size:30px}.quick-grid{grid-template-columns:1fr 1fr}.admin-footer{align-items:flex-start;flex-direction:column}}
/* v2.1 polished responsive layer */
.gold-text{color:var(--gold)!important}.account-wrap{width:min(1180px,100%);margin:auto;padding:46px max(18px,5vw) 110px}.account-hero{display:grid;grid-template-columns:1fr 310px;gap:22px;align-items:stretch;margin-bottom:20px}.account-hero h1{font-size:clamp(38px,5vw,60px);margin:4px 0 12px}.account-hero h1 span{color:var(--gold)}.balance-card{padding:26px;border:1px solid rgba(246,200,76,.25);border-radius:22px;background:linear-gradient(145deg,#151f31,#0b1422);display:flex;flex-direction:column;justify-content:center}.balance-card small{letter-spacing:.14em;color:var(--muted);font-weight:900}.balance-card strong{font-size:36px;color:var(--gold);margin:7px 0}.balance-card a{font-weight:900;color:var(--gold)}.account-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:34px}.action{padding:18px;border:1px solid #2b3b53;border-radius:16px;background:#0c1523}.action b,.action small{display:block}.action b{font-size:17px;color:#fff}.action small{margin-top:3px;color:var(--muted)}.action.primary{border-color:rgba(246,200,76,.45);background:linear-gradient(145deg,rgba(246,200,76,.17),#0c1523)}.section-block{padding:32px 0;border-top:1px solid rgba(255,255,255,.07)}.card-top{display:flex;justify-content:space-between;gap:10px;align-items:center}.status-pill{font-size:11px;padding:5px 8px;border-radius:999px;background:#14233a;color:#a8b9d2;border:1px solid #2b3b53}.secret-box{margin-top:12px;padding:12px;border-radius:12px;background:#07101c;border:1px solid #26344b}.secret-box p{margin:7px 0}.secret-box code{display:inline-block;margin-top:3px;padding:7px 9px;border-radius:8px;background:#111d2d;color:#ffd86b;word-break:break-all}.schedule-row{display:grid;grid-template-columns:auto auto 1fr;gap:10px;padding:10px 0;border-top:1px solid #26344b;align-items:center}.schedule-row span:nth-child(2){color:var(--gold);font-weight:900}.schedule-row small{text-align:right;color:var(--muted)}.empty-card{padding:28px;border:1px dashed #33445d;border-radius:18px;background:rgba(13,20,34,.65);grid-column:1/-1}.empty-card b{font-size:18px}.mini-card strong{display:block;color:var(--gold);font-size:22px;margin:7px 0}.mini-card small{display:block;color:var(--muted)}.notice-list{display:grid;gap:10px}.notice-list article{padding:16px 18px;border:1px solid #26344b;border-radius:14px;background:#0c1523}.notice-list article p{margin:4px 0 0;color:#aebbd0}.bottom-nav{display:none}.admin-nav{position:sticky;top:0;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:14px max(18px,5vw);background:rgba(6,10,18,.9);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px)}.admin-brand{display:flex;gap:12px;align-items:center}.admin-brand b{display:block;color:var(--gold);letter-spacing:.08em}.admin-brand small{color:var(--muted)}.admin-menu{font-size:23px}.admin-status{font-size:13px;color:var(--ok)}.admin-heading{display:flex;justify-content:space-between;gap:15px;align-items:flex-end;margin-bottom:28px}.admin-heading h1{margin:0;font-size:clamp(40px,6vw,64px)}.admin-card{position:relative}.admin-icon{position:absolute;right:18px;top:17px;font-size:23px}.admin-card small{color:var(--muted)}.quick{transition:.18s}.quick:hover{transform:translateY(-2px);border-color:rgba(246,200,76,.55)}.quick span{display:block;font-size:24px;margin-bottom:8px}.logout-link{color:#ff8585;font-weight:900}
@media(max-width:760px){.account-hero{grid-template-columns:1fr}.account-actions{grid-template-columns:1fr}.bottom-nav{display:flex;position:fixed;z-index:40;bottom:0;left:0;right:0;height:68px;padding:7px 8px;background:rgba(8,14,24,.96);border-top:1px solid #26344b;backdrop-filter:blur(18px);justify-content:space-around}.bottom-nav a{flex:1;text-align:center;color:#9aa9bd;font-size:21px;border-radius:12px;padding:4px}.bottom-nav a small{display:block;font-size:10px;font-weight:800}.bottom-nav a.active,.bottom-nav a:hover{color:var(--gold);background:rgba(246,200,76,.08)}.admin-nav{padding:12px 14px}.admin-heading{align-items:flex-start;flex-direction:column}.admin-heading .btn{width:100%}.admin-wrap{padding-top:28px}.admin-grid{gap:10px}.admin-card{padding:16px}.admin-card .value{font-size:28px;margin-top:24px}.quick-grid{gap:10px}.quick{padding:15px}.schedule-row{grid-template-columns:1fr auto}.schedule-row small{grid-column:1/-1;text-align:left}.compact-grid{grid-template-columns:1fr!important}}
@media(max-width:430px){.account-wrap{padding-left:14px;padding-right:14px}.account-hero h1{font-size:36px}.admin-grid{grid-template-columns:1fr 1fr}.admin-card{min-height:130px}.admin-icon{right:12px}.quick-grid{grid-template-columns:1fr 1fr}.quick b{font-size:14px}.quick small{font-size:11px}.auth-card{border-radius:20px}.auth-brand .mark{width:58px;height:58px}}
.admin-nav{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:18px;padding:12px max(16px,4vw);background:rgba(5,11,19,.94);border-bottom:1px solid #1d2b40;backdrop-filter:blur(16px)}.admin-nav>div{min-width:max-content}.admin-nav small{color:var(--muted)}.admin-links{display:flex;gap:4px;flex:1;overflow:auto}.admin-links a{padding:9px 10px;border-radius:9px;font-size:12px;font-weight:800;white-space:nowrap}.admin-links a:hover{background:#122039}.toolbar{display:flex;gap:10px;margin:18px 0}.toolbar input{margin:0}.table-wrap{overflow:auto;border:1px solid #25344b;border-radius:18px;background:#0b1320}.table-wrap table{width:100%;border-collapse:collapse;min-width:760px}.table-wrap th,.table-wrap td{padding:13px 14px;border-bottom:1px solid #1d2b40;text-align:left;vertical-align:middle}.table-wrap th{color:#91a0b5;font-size:12px;text-transform:uppercase;letter-spacing:.08em}.table-wrap td{font-size:13px}.table-wrap tr:last-child td{border-bottom:0}.table-wrap select{width:auto;min-width:120px;margin:0;padding:8px}.table-wrap form{display:flex;gap:6px;align-items:center}.notice-list{display:grid;gap:12px}.notice-list article{padding:17px;border:1px solid #25344b;border-radius:15px;background:#0b1422}.secret-box{margin-top:12px;padding:14px;border:1px dashed #3b4d68;border-radius:13px;background:#07101d}.secret-box code{color:var(--gold2);word-break:break-all}.bottom-nav{position:fixed;z-index:25;left:10px;right:10px;bottom:10px;display:none;grid-template-columns:repeat(5,1fr);padding:7px;border:1px solid #22334a;border-radius:18px;background:rgba(7,14,24,.94);backdrop-filter:blur(18px)}.bottom-nav a{text-align:center;padding:7px 3px;border-radius:12px;color:#8e9db2;font-size:18px}.bottom-nav a.active,.bottom-nav a:hover{color:var(--gold);background:#101d2e}.bottom-nav small{display:block;font-size:9px;font-weight:800}.empty-card{padding:26px;border:1px dashed #30425d;border-radius:18px;background:#0b1320}.mini-card strong{display:block;color:var(--gold);font-size:21px;margin:8px 0}.schedule-row{display:grid;grid-template-columns:1fr auto;gap:3px;padding:10px 0;border-top:1px solid #26344b}.schedule-row small{grid-column:1/-1;color:var(--muted)}
@media(max-width:760px){.admin-nav{align-items:flex-start;flex-wrap:wrap}.admin-links{order:3;flex-basis:100%;padding-bottom:2px}.admin-wrap{padding-bottom:90px}.bottom-nav{display:grid}.account-wrap{padding-bottom:100px}.account-hero{grid-template-columns:1fr}.account-actions{grid-template-columns:1fr}.table-wrap table{min-width:700px}.toolbar{flex-direction:column}}

/* Smart Control Center v6.0 */
.cc-actions{display:flex;align-items:center;gap:12px}.cc-live{font-size:12px;font-weight:900;letter-spacing:.08em;color:var(--ok)}.cc-live.offline{color:#ff8585}.admin-top .btn{cursor:pointer}.admin-nav{overflow-x:auto}.admin-nav .admin-links{overflow-x:auto;white-space:nowrap;scrollbar-width:thin}.admin-nav .admin-links a{display:inline-block}@media(max-width:760px){.cc-actions{width:100%;justify-content:space-between}.cc-actions .btn{flex:1}.cc-live{padding:10px 4px}.admin-nav{gap:10px}.admin-nav>div:first-child{min-width:max-content}.admin-nav>.btn{flex:0 0 auto}.admin-links{max-width:52vw}}

/* Inventory image upload */
.inventory-create{gap:14px}.image-upload-box{padding:16px;border:1px dashed #3a4d68;border-radius:16px;background:#081321}.image-upload-label{display:block;font-weight:900;color:#fff;margin-bottom:8px}.image-upload-input{margin:0}.image-upload-box small{display:block;color:#91a0b5;margin-top:7px;line-height:1.5}.image-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}.image-preview-item{padding:8px;border:1px solid #263a55;border-radius:12px;background:#0b1523;overflow:hidden}.image-preview-item img{width:100%;height:105px;object-fit:cover;border-radius:8px;display:block}.image-preview-item small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inventory-thumbs{display:flex;gap:5px}.inventory-thumbs img{width:42px;height:42px;object-fit:cover;border-radius:7px;border:1px solid #2c3e58}
@media(max-width:560px){.image-preview{grid-template-columns:repeat(2,1fr)}.image-preview-item img{height:115px}}

.account-main-image{display:block;width:100%;max-height:620px;object-fit:contain;background:#07101c;border-radius:14px}.account-gallery-list{display:flex;gap:8px;overflow:auto;margin-top:10px}.account-gallery-list img{width:76px;height:76px;object-fit:cover;border-radius:9px;border:1px solid #2b3d57;cursor:pointer}

/* ===== UI UPGRADE 2026 · CUSTOMER + ADMIN ===== */
:root{
  --ui-accent:#4f8cff;--ui-accent2:#78a9ff;--ui-surface:rgba(15,25,42,.92);
  --ui-border:rgba(125,155,205,.18);--ui-radius:18px;
}
body{letter-spacing:.005em}
.nav{gap:18px;box-shadow:0 8px 35px rgba(0,0,0,.16)}
.nav nav{scrollbar-width:none}.nav nav::-webkit-scrollbar,.admin-links::-webkit-scrollbar{display:none}
.nav nav a{transition:background .18s,transform .18s,color .18s}
.nav nav a:hover{transform:translateY(-1px)}
.product,.feature-card,.install-box,.stat-card{transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.product:hover,.feature-card:hover,.stat-card:hover{transform:translateY(-3px);border-color:rgba(120,169,255,.35);box-shadow:0 18px 55px rgba(0,0,0,.25)}
.hero-card{border-color:rgba(246,200,76,.25)}
/* Customer mobile-first polish */
@media(max-width:760px){
  .nav{position:sticky;top:0;padding:11px 14px;gap:10px;flex-wrap:wrap}
  .nav .logo{font-size:17px}
  .nav nav{order:3;flex-basis:100%;width:100%;overflow-x:auto;gap:4px;padding-bottom:2px}
  .nav nav a{font-size:12px;padding:8px 10px;background:rgba(255,255,255,.025)}
  .nav>.btn{margin-left:auto}
  .hero{padding:38px 18px 28px;grid-template-columns:1fr;gap:16px}
  .hero h1{font-size:clamp(34px,10vw,48px)}
  .hero-card{min-height:190px;padding:22px}
  .stats{padding:8px 18px 28px;grid-template-columns:repeat(2,1fr);gap:9px}
  .stats div{padding:15px}.stats b{font-size:22px}
  .section{padding:32px 18px}
  .section-head{align-items:flex-start;flex-direction:column;gap:7px}
  .section-head h2{font-size:28px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .product{padding:11px;border-radius:15px}.thumb{height:110px;border-radius:12px;font-size:14px}
  .product h3{font-size:15px}.price{font-size:18px}
  .btn{min-height:42px;padding:10px 13px;font-size:13px}
}
@media(max-width:430px){
  .grid{grid-template-columns:1fr}
  .product .thumb{height:145px}
}
/* Admin 2026 dashboard shell */
.admin-nav{
  min-height:62px;
  box-shadow:0 10px 40px rgba(0,0,0,.20);
}
.admin-nav>div:first-child{display:flex;align-items:center;gap:7px}
.admin-nav .logo{font-size:17px}
.admin-links a{position:relative}
.admin-links a:hover{background:rgba(79,140,255,.12);color:#fff}
.admin-wrap{width:min(1500px,100%);margin:auto;padding:36px max(18px,4vw) 70px}
.admin-top{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:22px}
.admin-top h1{font-size:clamp(34px,5vw,58px)}
.admin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.admin-card{padding:20px;min-height:142px;overflow:hidden}
.admin-card:after{content:"";position:absolute;inset:auto -30px -55px auto;width:130px;height:130px;border-radius:50%;background:rgba(79,140,255,.06)}
.admin-card .label{color:#9eabc0;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.07em}
.admin-card .value{font-size:30px;font-weight:950;line-height:1.15;margin-top:25px;color:#fff}
.admin-card:nth-child(4) .value,.admin-card:nth-child(5) .value{color:var(--gold)}
.quick-title{font-size:12px;font-weight:900;letter-spacing:.15em;color:var(--gold);margin:30px 0 12px;text-transform:uppercase}
.quick-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:11px;margin-bottom:34px}
.quick{min-height:118px;padding:16px;border:1px solid var(--ui-border);border-radius:16px;background:linear-gradient(145deg,#101b2d,#0a1320);display:flex;flex-direction:column;justify-content:flex-start}
.quick span{font-size:22px}.quick b{font-size:14px;margin-top:auto}.quick small{color:#7f8da3;font-size:11px;margin-top:3px}
.admin-nav .btn{white-space:nowrap}
.table-wrap{box-shadow:0 12px 35px rgba(0,0,0,.15)}
@media(max-width:1050px){
  .admin-grid{grid-template-columns:repeat(2,1fr)}
  .quick-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  .admin-nav{padding:10px 12px;gap:9px}
  .admin-nav>div:first-child{width:100%}
  .admin-nav>.btn{position:absolute;right:12px;top:10px}
  .admin-nav .admin-links{order:3;flex-basis:100%;max-width:100%;padding-bottom:2px;gap:4px}
  .admin-links a{font-size:11px;padding:8px 9px;background:rgba(255,255,255,.025)}
  .admin-wrap{padding:25px 14px 90px}
  .admin-top{align-items:flex-start;flex-direction:column}
  .admin-grid{grid-template-columns:repeat(2,1fr);gap:9px}
  .admin-card{min-height:120px;padding:14px}.admin-card .value{font-size:24px;margin-top:21px}
  .quick-grid{grid-template-columns:repeat(2,1fr);gap:9px}
  .quick{min-height:105px;padding:13px}
  .quick b{font-size:13px}
}
@media(max-width:380px){
  .admin-grid,.quick-grid{grid-template-columns:1fr 1fr}
  .admin-card .value{font-size:21px}
}
/* Form controls */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.form-grid .full{grid-column:1/-1}
@media(max-width:650px){.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}}
.badge{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:999px;background:rgba(79,140,255,.10);border:1px solid rgba(79,140,255,.18);font-size:11px;font-weight:800}

/* ===== V6 MOBILE APP + ADMIN OPERATIONS LAYER ===== */
.admin-card{position:relative}
.ui-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 22px}
.ui-search{flex:1;min-width:220px;position:relative}.ui-search input{margin:0;padding-left:42px}.ui-search span{position:absolute;left:14px;top:11px;color:#718096}
.ui-status{display:inline-flex;align-items:center;gap:7px;padding:10px 13px;border:1px solid var(--ui-border);border-radius:12px;background:#0c1523;color:#9eabc0;font-size:12px;font-weight:800}
.ui-status i{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px rgba(111,227,161,.08)}
.ops-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0 0 26px}.ops-item{padding:14px 15px;border:1px solid var(--ui-border);border-radius:15px;background:#0b1421}.ops-item b{display:block;font-size:13px}.ops-item small{display:block;color:#718096;margin-top:3px}
.mobile-bottom{display:none}
.customer-shell{max-width:1220px;margin:auto;padding-bottom:96px}.customer-hero{display:grid;grid-template-columns:1fr 300px;gap:16px;margin-bottom:18px}.customer-welcome{padding:25px;border:1px solid var(--ui-border);border-radius:22px;background:linear-gradient(145deg,#111e31,#0a1320)}.customer-welcome h1{font-size:clamp(34px,5vw,56px);margin:4px 0 10px}.customer-welcome .sub{color:var(--muted)}.customer-balance{padding:24px;border-radius:22px;border:1px solid rgba(246,200,76,.25);background:linear-gradient(145deg,rgba(246,200,76,.12),#0b1421)}.customer-balance small{display:block;color:#9eabc0;font-weight:900;letter-spacing:.12em}.customer-balance strong{display:block;color:var(--gold);font-size:34px;margin:6px 0 14px}.customer-balance a{font-weight:900;color:var(--gold)}
@media(max-width:760px){
 .customer-shell{padding:12px 14px 92px}.customer-hero{grid-template-columns:1fr;gap:10px}.customer-welcome{padding:20px;border-radius:18px}.customer-welcome h1{font-size:36px}.customer-balance{padding:18px;border-radius:18px}.customer-balance strong{font-size:29px}.ops-strip{grid-template-columns:repeat(2,1fr);gap:8px}.ops-item{padding:12px}.ui-toolbar{gap:8px}.ui-search{min-width:100%;order:2}.ui-status{order:1}.mobile-bottom{position:fixed;display:grid;grid-template-columns:repeat(4,1fr);left:10px;right:10px;bottom:10px;z-index:50;padding:7px;border:1px solid rgba(125,155,205,.22);border-radius:18px;background:rgba(8,14,24,.92);backdrop-filter:blur(18px);box-shadow:0 15px 45px rgba(0,0,0,.45)}.mobile-bottom a{text-align:center;padding:7px 3px;border-radius:12px;color:#8f9eb4;font-size:18px}.mobile-bottom a.active{background:rgba(79,140,255,.13);color:#fff}.mobile-bottom small{display:block;font-size:10px;margin-top:1px}.account-wrap{padding-bottom:100px}.admin-wrap{padding-bottom:96px}
}

/* V7 APP EXPERIENCE + REALTIME */
.app-quickbar{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:24px 0 12px}.app-quickbar a{position:relative;display:flex;justify-content:center;align-items:center;gap:6px;padding:13px 9px;border:1px solid var(--ui-border);border-radius:14px;background:#0b1421;color:#dbe5f5;font-weight:800;font-size:12px}.notify-badge{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#ef5350;color:#fff;font-size:10px;display:inline-flex;align-items:center;justify-content:center}.realtime-panel{margin:0 0 30px;padding:20px;border:1px solid var(--ui-border);border-radius:20px;background:linear-gradient(145deg,#101b2d,#09121e);box-shadow:0 12px 35px rgba(0,0,0,.15)}.realtime-panel h2{margin:2px 0 3px}.realtime-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-top:16px}.realtime-kpis div{padding:13px;border-radius:13px;border:1px solid var(--ui-border);background:rgba(255,255,255,.025)}.realtime-kpis b{display:block;font-size:19px}.realtime-kpis small{color:#7f8da3;font-size:10px}@media(max-width:760px){.app-quickbar{grid-template-columns:repeat(2,1fr)}.realtime-panel{padding:15px}.realtime-kpis{grid-template-columns:repeat(2,1fr)}.realtime-kpis div:first-child{grid-column:span 1}}

/* V8 feature layer */
.v8-health{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0 0 24px;padding:20px;border:1px solid rgba(79,140,255,.25);border-radius:18px;background:linear-gradient(135deg,rgba(79,140,255,.10),rgba(12,20,33,.96));}.v8-health h2{font-size:22px;margin:0 0 5px}.health-badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.health-badges span{padding:8px 11px;border-radius:999px;background:#0b1523;border:1px solid #2a3c57;font-size:12px;font-weight:900;color:#bcd0ec}.compact-grid .action{min-height:105px}@media(max-width:700px){.v8-health{align-items:flex-start;flex-direction:column}.health-badges{width:100%}.health-badges .btn{margin-left:auto}}

/* V10 realtime notification layer */
.rt-toast{position:fixed;right:18px;bottom:22px;z-index:9999;width:min(380px,calc(100vw - 28px));padding:15px 16px;border:1px solid rgba(79,140,255,.28);border-radius:16px;background:rgba(8,15,27,.96);box-shadow:0 18px 55px rgba(0,0,0,.45);backdrop-filter:blur(14px);transform:translateY(18px);opacity:0;pointer-events:none;transition:.25s ease}.rt-toast.show{transform:translateY(0);opacity:1}.rt-toast b{display:block;color:#fff;font-size:13px;margin-bottom:5px}.rt-toast span{display:block;color:#aebbd0;font-size:12px;line-height:1.45}@media(max-width:760px){.rt-toast{right:14px;bottom:82px}}
/* V14 Admin security + mobile operations shell */
.admin-nav-actions{display:flex;align-items:center;gap:6px;margin-left:auto}.security-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);gap:16px;align-items:start}.security-card{margin-top:0}.security-card h2{font-size:25px}.security-message{padding:11px 13px;margin:14px 0;border-radius:12px;border:1px solid rgba(111,227,161,.25);background:rgba(111,227,161,.06);color:#d8f8e6}.security-side{display:grid;gap:12px}.security-side .admin-card{min-height:auto}.password-strength{height:7px;border-radius:999px;background:#111c2c;border:1px solid #273952;overflow:hidden;margin:3px 0 5px}.password-strength span{display:block;width:0;height:100%;background:var(--gold);transition:width .2s ease}.admin-icon{font-size:24px;margin-bottom:8px}@media(max-width:760px){.admin-nav-actions .btn:first-child{display:none}.security-layout{grid-template-columns:1fr}.security-card{padding:19px}.security-side{grid-template-columns:1fr}.admin-nav-actions{position:absolute;right:10px;top:10px}.admin-nav-actions .btn{min-height:36px}.admin-nav>.btn{display:none}}

/* V15 Admin App Shell */
.v15-admin-nav{gap:14px;box-shadow:0 8px 28px rgba(0,0,0,.18)}
.v15-admin-nav .admin-brand{min-width:230px}.v15-admin-nav .admin-brand .logo{font-size:20px}.v15-admin-nav .admin-brand small{display:block;margin-top:2px;font-size:9px;letter-spacing:.13em}
.v15-admin-nav .admin-links{align-items:center}.v15-admin-nav .admin-links a{display:flex;align-items:center;gap:5px}.admin-search-trigger{border:1px solid #26344b;background:#0b1422}.admin-search-trigger span{color:#aebbd0}
.admin-mobile-menu{display:none;border:1px solid #2a3b54;background:#0b1422;color:#fff;border-radius:11px;padding:8px 11px;font-size:18px}
.admin-mobile-actions{display:none}
.admin-search-modal{position:fixed;inset:0;z-index:1000;display:none}.admin-search-modal.show{display:block}.admin-search-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.68);backdrop-filter:blur(5px)}
.admin-search-box{position:relative;width:min(720px,calc(100% - 28px));margin:9vh auto 0;padding:20px;border:1px solid #30435f;border-radius:22px;background:#0a1320;box-shadow:0 30px 90px rgba(0,0,0,.55)}.admin-search-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.admin-search-head h2{margin:0 0 14px}.admin-search-input{display:flex;align-items:center;gap:10px;padding:13px 15px;border:1px solid #31435e;border-radius:14px;background:#07101d}.admin-search-input span{font-size:22px;color:var(--gold)}.admin-search-input input{margin:0;border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important}.admin-search-results{margin-top:14px;max-height:58vh;overflow:auto}.search-group{margin:0 0 15px}.search-group>b{display:block;padding:6px 4px;color:var(--gold);font-size:12px;text-transform:uppercase;letter-spacing:.1em}.search-group>a{display:flex;justify-content:space-between;gap:12px;padding:12px;border:1px solid #1f3047;border-radius:12px;background:#0d1725;margin-top:7px}.search-group>a:hover{border-color:rgba(246,200,76,.55);transform:translateY(-1px)}.search-group strong{color:#fff}.search-group small{color:#91a0b5;text-align:right}.admin-menu-open .admin-links{display:flex!important}
@media(max-width:900px){.v15-admin-nav .admin-brand{min-width:auto}.v15-admin-nav .admin-links a span{display:none}.v15-admin-nav .admin-links a{padding:9px}.v15-admin-nav .admin-search-trigger span{display:inline}.admin-mobile-menu{display:block}.admin-nav-actions{display:none}}
@media(max-width:760px){.v15-admin-nav{position:sticky;padding:10px 12px;flex-wrap:nowrap}.v15-admin-nav .admin-links{position:absolute;left:8px;right:8px;top:64px;display:none;flex-direction:column;align-items:stretch;padding:9px;border:1px solid #263750;border-radius:16px;background:rgba(7,14,24,.98);box-shadow:0 18px 50px rgba(0,0,0,.4);max-height:70vh;overflow:auto}.v15-admin-nav .admin-links a{justify-content:flex-start;padding:11px 12px}.v15-admin-nav .admin-links a span{display:inline}.v15-admin-nav .admin-search-trigger span{display:inline}.admin-mobile-actions{display:grid;position:fixed;z-index:50;left:10px;right:10px;bottom:10px;grid-template-columns:repeat(5,1fr);padding:6px;border:1px solid #24364f;border-radius:18px;background:rgba(7,14,24,.95);backdrop-filter:blur(18px);box-shadow:0 12px 40px rgba(0,0,0,.38)}.admin-mobile-actions a{text-align:center;color:#8f9fb5;padding:7px 2px;border-radius:12px;font-size:17px}.admin-mobile-actions a:hover{color:var(--gold);background:#101d2e}.admin-mobile-actions small{display:block;font-size:8px;font-weight:900;margin-top:2px}.admin-wrap{padding-bottom:95px}.admin-search-box{margin-top:5vh;padding:16px;border-radius:18px}.admin-search-results{max-height:62vh}.search-group>a{display:block}.search-group small{display:block;text-align:left;margin-top:3px}}
.admin-notification-link{position:relative}.admin-alert-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;margin-left:5px;border-radius:999px;background:#ff5f6d;color:#fff;font-size:10px;font-style:normal;font-weight:900;line-height:18px;box-shadow:0 0 12px rgba(255,95,109,.28)}.rt-toast{position:fixed;right:18px;bottom:22px;z-index:99999;width:min(390px,calc(100vw - 36px));padding:14px 16px;border:1px solid #2a405d;border-radius:16px;background:rgba(10,18,31,.97);box-shadow:0 18px 50px rgba(0,0,0,.38);transform:translateY(18px);opacity:0;pointer-events:none;transition:.25s}.rt-toast.show{transform:translateY(0);opacity:1}.rt-toast b{display:block;color:#fff;font-size:14px;margin-bottom:4px}.rt-toast span{display:block;color:#9dacbf;font-size:12px;line-height:1.45}@media(max-width:560px){.rt-toast{right:12px;bottom:76px;width:calc(100vw - 24px)}}

/* Unified customer mobile navigation hotfix */
@media(max-width:760px){.unified-customer-nav{display:grid!important;grid-template-columns:repeat(4,1fr)!important}.unified-customer-nav a.active{color:var(--gold)!important;background:rgba(246,200,76,.10)!important}.unified-customer-nav .nav-icon{display:block;font-size:20px;line-height:1.05}.unified-customer-nav small{font-size:10px!important;font-weight:800}.customer-shell,.section{padding-bottom:105px}}


/* =========================================================
   V20 — PREMIUM CUSTOMER + ADMIN EXPERIENCE
   Shared visual/UX layer; business logic remains untouched.
   ========================================================= */
:root{--v20-bg:#060b14;--v20-panel:rgba(13,22,37,.88);--v20-panel2:#0b1524;--v20-line:rgba(139,164,202,.16);--v20-blue:#5b9cff;--v20-cyan:#62d7ff;--v20-green:#57d89b;--v20-red:#ff6877;--v20-yellow:#ffd166;--v20-text:#f4f7fb;--v20-muted:#93a2b8;--v20-shadow:0 22px 70px rgba(0,0,0,.32)}
html{scroll-behavior:smooth}body{background:radial-gradient(circle at 12% -5%,rgba(91,156,255,.12),transparent 32%),radial-gradient(circle at 90% 5%,rgba(98,215,255,.07),transparent 28%),var(--v20-bg);color:var(--v20-text)}
.nav,.admin-nav{background:rgba(5,11,20,.84)!important;border-bottom:1px solid var(--v20-line)!important;backdrop-filter:blur(20px)!important;box-shadow:0 8px 40px rgba(0,0,0,.16)!important}
.logo{letter-spacing:-.02em}.nav nav a,.admin-links a{transition:color .18s ease,background .18s ease,transform .18s ease}.nav nav a:hover,.admin-links a:hover{transform:translateY(-1px);color:#fff}
.section,.admin-wrap{max-width:1240px}.section-head{align-items:flex-end}.section-head h1,.section-head h2{letter-spacing:-.03em}
.product,.action,.admin-card,.install-box,.realtime-panel,.v8-health,.bank-card,.recharge-card,.history,.customer-hero,.ops-strip{border-color:var(--v20-line)!important;box-shadow:0 12px 40px rgba(0,0,0,.13);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.product:hover,.action:hover{transform:translateY(-2px);border-color:rgba(91,156,255,.34)!important;box-shadow:var(--v20-shadow)}
.btn{border-radius:13px!important;font-weight:900!important;box-shadow:0 8px 22px rgba(0,0,0,.12)}.btn:not(.ghost){background:linear-gradient(135deg,#4e8ffb,#65c9ff)!important;color:#04101d!important;border:0!important}.btn.ghost{background:rgba(255,255,255,.035)!important;border-color:var(--v20-line)!important}
input,select,textarea{border-radius:12px!important;border-color:var(--v20-line)!important;background:#081220!important;color:#eef5ff!important}input:focus,select:focus,textarea:focus{outline:none!important;border-color:rgba(91,156,255,.7)!important;box-shadow:0 0 0 4px rgba(91,156,255,.09)!important}
.table-wrap{border:1px solid var(--v20-line);border-radius:18px;background:rgba(8,15,26,.72);overflow:auto;box-shadow:0 12px 40px rgba(0,0,0,.14)}table{border-collapse:collapse;width:100%}th{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#8293ab;background:rgba(255,255,255,.025)}td,th{padding:13px 14px;border-bottom:1px solid rgba(139,164,202,.09)}tbody tr:hover{background:rgba(91,156,255,.035)}
/* Customer command center */
.customer-shell{position:relative}.customer-hero{background:linear-gradient(135deg,rgba(17,31,54,.96),rgba(8,16,28,.96));overflow:hidden;position:relative}.customer-hero:after{content:"";position:absolute;width:280px;height:280px;right:-90px;top:-120px;border-radius:50%;background:rgba(91,156,255,.12);filter:blur(4px)}.customer-welcome,.customer-balance{position:relative;z-index:1}.customer-balance{border:1px solid rgba(98,215,255,.18);background:linear-gradient(145deg,rgba(91,156,255,.13),rgba(255,255,255,.025));box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}.customer-balance strong{letter-spacing:-.04em}.ops-strip{background:rgba(9,17,29,.8)}.ops-item{position:relative}.ops-item:not(:last-child):after{content:"";position:absolute;right:0;top:22%;height:56%;width:1px;background:var(--v20-line)}
/* Wallet / deposits */
.bank-card{background:linear-gradient(145deg,#0e1b2e,#09121e)!important}.bank-chip,.secure-chip{border:1px solid rgba(87,216,155,.22)!important;background:rgba(87,216,155,.07)!important;color:#9cf0c7!important}.receive-box{background:linear-gradient(135deg,rgba(87,216,155,.10),rgba(91,156,255,.08))!important;border:1px solid rgba(87,216,155,.18)!important}.receive-box strong{color:#a9f4cf!important;text-shadow:0 0 25px rgba(87,216,155,.18)}.amount-btn.active,.telco-btn.active{box-shadow:0 0 0 2px rgba(91,156,255,.45),0 10px 30px rgba(91,156,255,.10)!important}
/* Admin */
.admin-wrap{padding-top:26px}.admin-top{margin-bottom:18px}.admin-top h1{font-size:clamp(30px,4vw,46px);letter-spacing:-.045em}.admin-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.admin-card{background:linear-gradient(145deg,rgba(14,25,42,.94),rgba(8,15,26,.94))!important}.admin-card .value{font-variant-numeric:tabular-nums}.quick-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.quick{min-height:120px!important;border:1px solid var(--v20-line)!important;background:linear-gradient(145deg,rgba(14,24,40,.92),rgba(8,15,26,.92))!important;transition:.18s}.quick:hover{transform:translateY(-2px);border-color:rgba(91,156,255,.35)!important;box-shadow:var(--v20-shadow)}.quick span{font-size:25px}.quick b{font-size:14px}.quick small{color:var(--v20-muted)}
.admin-search-box{background:linear-gradient(145deg,#0d192a,#07101b)!important;border-color:rgba(91,156,255,.24)!important}.admin-search-trigger{border-radius:12px!important}
.status-pill,.status,.bank-status{border-radius:999px!important;font-weight:900!important}.status.s1,.bank-completed{color:#a8f2ca!important;background:rgba(87,216,155,.10)!important;border-color:rgba(87,216,155,.2)!important}.status.s99,.bank-pending{color:#a9cfff!important;background:rgba(91,156,255,.10)!important}.status.s2{color:#ffe3a0!important;background:rgba(255,209,102,.09)!important}.status.s3,.bank-failed{color:#ffb0b8!important;background:rgba(255,104,119,.09)!important}
/* Make desktop admin easier to scan */
.admin-links{gap:4px!important}.admin-links>a{border-radius:10px!important}.admin-links>a:hover{background:rgba(255,255,255,.035)}
/* Sticky quick actions on desktop */
@media(min-width:761px){.admin-top{position:relative}.admin-top .btn{box-shadow:0 10px 30px rgba(91,156,255,.12)}.section>.section-head:first-child{padding-top:6px}}
@media(max-width:980px){.admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:760px){.admin-grid,.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.admin-card{padding:15px!important}.quick{min-height:105px!important;padding:14px!important}.customer-welcome h1{font-size:32px!important}.ops-item:not(:last-child):after{display:none}.section-head{align-items:flex-start;gap:10px}.table-wrap{border-radius:14px}.table-wrap table{min-width:650px}.bank-card,.recharge-card,.history{border-radius:18px!important}}
@media(max-width:440px){.admin-grid,.quick-grid{grid-template-columns:1fr 1fr!important}.quick small{font-size:10px}.quick b{font-size:12px}.admin-card .value{font-size:20px!important}}

/* =========================================================
   V22 — PREMIUM FULL-SITE EXPERIENCE
   UX layer only: preserves existing business logic.
   ========================================================= */
:root{--x-bg:#050a12;--x-panel:#0b1524;--x-panel2:#0e1b2d;--x-line:rgba(123,163,215,.17);--x-blue:#49a4ff;--x-cyan:#65dcff;--x-green:#55e1a0;--x-gold:#ffd166;--x-red:#ff6f7f;--x-text:#f5f8ff;--x-muted:#8fa1ba;--x-shadow:0 24px 80px rgba(0,0,0,.35)}
body{background:radial-gradient(700px 420px at 5% -8%,rgba(73,164,255,.13),transparent 65%),radial-gradient(700px 420px at 100% 0%,rgba(101,220,255,.08),transparent 62%),var(--x-bg)}
.nav{padding:12px max(16px,5vw);border-color:var(--x-line)!important;background:rgba(4,9,17,.88)!important;box-shadow:0 10px 40px rgba(0,0,0,.18)}
.logo{display:flex;align-items:center;gap:8px}.logo:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--x-cyan);box-shadow:0 0 16px rgba(101,220,255,.7)}
.nav nav a{position:relative}.nav nav a:hover{background:rgba(73,164,255,.08)!important}.nav nav a[href*="deposit"]{color:#cfe9ff;background:rgba(73,164,255,.06)}
.hero,.section,.account-wrap,.deposit-hub,.pay-page{position:relative}.hero:before,.section:first-child:before{content:"";position:absolute;inset:0 6%;height:1px;background:linear-gradient(90deg,transparent,rgba(101,220,255,.22),transparent);pointer-events:none}
.hero h1{max-width:900px}.hero h1 span{color:var(--x-cyan)}
.hero-card,.product,.action,.admin-card,.install-box,.feature-card,.auth-card,.pay-card,.method,.customer-hero,.ops-strip,.table-wrap,.v8-health,.realtime-panel{border-color:var(--x-line)!important;background:linear-gradient(145deg,rgba(14,27,45,.94),rgba(7,14,25,.96))!important;box-shadow:0 14px 50px rgba(0,0,0,.16)}
.product,.action,.quick,.method,.pay-card{transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.product:hover,.action:hover,.quick:hover,.method:hover{transform:translateY(-3px);border-color:rgba(73,164,255,.4)!important;box-shadow:var(--x-shadow)}
.btn{background:linear-gradient(135deg,#38a0ff,#6b6bff)!important;color:#fff!important;border:0!important;box-shadow:0 12px 28px rgba(56,160,255,.18)!important}.btn:hover{filter:brightness(1.08);box-shadow:0 16px 34px rgba(56,160,255,.25)!important}.btn.ghost{background:rgba(255,255,255,.035)!important;border:1px solid var(--x-line)!important;color:#dbe7f8!important;box-shadow:none!important}
input,select,textarea{background:#071321!important;border-color:var(--x-line)!important}.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid rgba(101,220,255,.75);outline-offset:2px}
.section-head{margin-bottom:20px}.eyebrow{color:var(--x-cyan);font-size:10px}.muted{color:var(--x-muted)}
.stats div{background:linear-gradient(145deg,#0d1a2c,#08111d);border-color:var(--x-line)}.stats b{color:var(--x-cyan)}
.thumb{background:radial-gradient(circle at 75% 20%,rgba(101,220,255,.18),transparent 34%),linear-gradient(145deg,#142b48,#091321);border-color:var(--x-line)}
/* Customer command center */
.customer-shell{max-width:1240px}.customer-hero{padding:26px;border-radius:24px;display:grid;grid-template-columns:1fr 330px;gap:18px;overflow:hidden}.customer-balance{border-radius:18px;padding:20px;background:linear-gradient(145deg,rgba(73,164,255,.12),rgba(101,220,255,.04));border:1px solid rgba(101,220,255,.16)}.customer-balance strong{color:var(--x-cyan);font-size:38px}.ops-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:14px 0 20px;padding:4px;border-radius:18px}.ops-item{padding:16px;text-align:center}.ops-item b{display:block;font-size:18px}.ops-item small{color:var(--x-muted)}
/* Payment center */
.deposit-hub{max-width:1120px}.hub-hero{box-shadow:var(--x-shadow);position:relative;overflow:hidden}.hub-hero:after{content:"";position:absolute;width:220px;height:220px;right:-80px;top:-90px;border-radius:50%;background:rgba(101,220,255,.10);filter:blur(2px)}.hub-grid{gap:18px}.method{min-height:280px}.method-icon{box-shadow:0 12px 30px rgba(56,160,255,.18)}.hub-balance{color:#b8f3ff;background:rgba(101,220,255,.07);border-color:rgba(101,220,255,.16)}
/* Admin */
.admin-wrap{max-width:1320px}.admin-top h1{color:#fff}.admin-grid{gap:12px}.admin-card .value{color:var(--x-cyan)}.quick-grid{gap:12px}.quick{position:relative;overflow:hidden}.quick:after{content:"";position:absolute;right:-30px;bottom:-50px;width:110px;height:110px;border-radius:50%;background:rgba(73,164,255,.06)}.v20-tip,.ra-guide{border-color:rgba(101,220,255,.18)!important;background:rgba(73,164,255,.045)!important}
.table-wrap{overflow:auto}.table-wrap table{min-width:720px}.table-wrap th{background:#0a1524;position:sticky;top:0;z-index:1}
/* Form micro-UX */
form label{display:block;color:#d9e5f5;font-size:12px;font-weight:800;margin-top:10px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.form-grid .full{grid-column:1/-1}.pill-row{display:flex;gap:7px;flex-wrap:wrap}.pill{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;background:rgba(73,164,255,.07);border:1px solid rgba(73,164,255,.15);color:#bcd9f7;font-size:10px;font-weight:900}
/* Better empty/error states */
.empty-card,.empty{background:rgba(8,16,28,.7)!important;border:1px dashed rgba(123,163,215,.22)!important;border-radius:18px!important;padding:24px!important}.notice-list article{border-color:var(--x-line)!important;background:rgba(12,23,38,.75)!important}
/* Mobile navigation: five clear destinations */
@media(max-width:760px){.unified-customer-nav{grid-template-columns:repeat(5,1fr)!important;gap:3px!important;padding:6px!important}.unified-customer-nav a{min-width:0!important}.unified-customer-nav .nav-icon{font-size:19px!important}.unified-customer-nav small{font-size:9px!important}.customer-hero{grid-template-columns:1fr}.ops-strip{grid-template-columns:repeat(2,1fr)}.ops-item:nth-child(2){border-left:1px solid var(--x-line)}.ops-item:nth-child(3){border-top:1px solid var(--x-line)}.ops-item:nth-child(4){border-top:1px solid var(--x-line);border-left:1px solid var(--x-line)}}
@media(max-width:560px){.hero{padding-top:34px}.hero h1{font-size:40px}.section{padding-top:34px;padding-bottom:34px}.customer-hero{padding:18px}.customer-balance strong{font-size:31px}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.admin-grid{grid-template-columns:repeat(2,1fr)!important}.quick-grid{grid-template-columns:repeat(2,1fr)!important}.quick{min-height:108px!important;padding:14px!important}.pay-page{padding-left:12px;padding-right:12px}.hub-grid{gap:12px}.method{padding:18px;min-height:auto}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Product/account images: show real inventory photos instead of text placeholders. */
.thumb.has-image{position:relative;display:block;overflow:hidden;padding:0;background:#081321}
.thumb.has-image img{display:block;width:100%;height:100%;min-height:100%;object-fit:cover;border-radius:inherit;transition:transform .35s ease,opacity .25s ease}
.thumb.has-image:hover img{transform:scale(1.035)}
.thumb.has-image .thumb-fallback{display:none}
@media (prefers-reduced-motion: reduce){.thumb.has-image img{transition:none}.thumb.has-image:hover img{transform:none}}

/* V24 — clean account thumbnail/gallery: no text overlay, captions stay outside images */
.account-gallery{position:relative;padding:0!important;background:transparent!important;border:0!important;overflow:visible!important}
.account-gallery:before,.account-gallery:after,.account-gallery .thumb-fallback{display:none!important;content:none!important}
.account-gallery-stage{position:relative;width:100%;aspect-ratio:4/3;min-height:240px;overflow:hidden;border:1px solid rgba(123,163,215,.20);border-radius:18px;background:#071321;box-shadow:0 18px 55px rgba(0,0,0,.28)}
.account-main-image{position:absolute!important;inset:0;width:100%!important;height:100%!important;max-height:none!important;object-fit:contain!important;background:#071321;border-radius:0!important;display:block!important}
.account-gallery-caption{display:flex;justify-content:space-between;gap:10px;padding:10px 2px 4px;color:#e8f0fb;font-size:12px}.account-gallery-caption span{color:#8fa1ba}
.account-gallery-list{display:flex;gap:8px;overflow-x:auto;padding:8px 2px 2px;margin:0!important;scrollbar-width:thin}
.account-gallery-list::-webkit-scrollbar{height:5px}.account-gallery-list::-webkit-scrollbar-thumb{background:#263a55;border-radius:99px}
.gallery-thumb{flex:0 0 74px;width:74px;height:60px;padding:0;border:1px solid rgba(123,163,215,.20);border-radius:10px;overflow:hidden;background:#071321;cursor:pointer;opacity:.72;transition:.18s}.gallery-thumb img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;border:0!important;border-radius:0!important}.gallery-thumb.is-active,.gallery-thumb:hover{opacity:1;border-color:rgba(101,220,255,.75);box-shadow:0 0 0 2px rgba(101,220,255,.12)}
.gallery-nav,.gallery-zoom{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:38px;height:38px;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:rgba(4,10,18,.72);color:#fff;font-size:25px;line-height:1;backdrop-filter:blur(8px);cursor:pointer}.gallery-prev{left:10px}.gallery-next{right:10px}.gallery-zoom{top:12px;right:12px;transform:none;font-size:18px}
.gallery-lightbox{position:fixed;inset:0;z-index:99999;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(2,6,12,.94);backdrop-filter:blur(10px)}.gallery-lightbox.show{display:flex}.gallery-lightbox img{max-width:min(96vw,1200px);max-height:88vh;object-fit:contain;border-radius:12px}.gallery-close{position:absolute;top:18px;right:18px;width:44px;height:44px;border:1px solid rgba(255,255,255,.18);border-radius:50%;background:#0d1725;color:#fff;font-size:28px;cursor:pointer}
.account-gallery-empty{min-height:240px;display:flex;align-items:center;justify-content:center;border:1px dashed rgba(123,163,215,.24);border-radius:18px;color:#8fa1ba;background:#071321}
@media(max-width:560px){.account-gallery-stage{aspect-ratio:4/3;min-height:210px;border-radius:15px}.gallery-thumb{flex-basis:64px;width:64px;height:52px}.gallery-nav{width:34px;height:34px}.gallery-zoom{width:34px;height:34px;font-size:16px}.gallery-lightbox{padding:10px}}

/* V24 hardening: gallery owns its layout and cannot let image pixels overlap product text. */
.product > .account-gallery{display:block!important;position:relative!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;margin:0 0 14px!important;padding:0!important;overflow:visible!important;line-height:normal!important;box-sizing:border-box!important;isolation:isolate!important}
.product > .account-gallery .account-gallery-stage{display:block!important;position:relative!important;width:100%!important;height:auto!important;aspect-ratio:4/3!important;min-height:210px!important;max-height:78vh!important;overflow:hidden!important;box-sizing:border-box!important}
.product > .account-gallery .account-main-image{display:block!important;position:absolute!important;top:0!important;right:0!important;bottom:0!important;left:0!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;min-width:0!important;min-height:0!important;object-fit:contain!important;margin:0!important;padding:0!important;transform:none!important}
.product > .account-gallery .account-gallery-caption,.product > .account-gallery .account-gallery-list{position:relative!important;z-index:2!important}
.product > .account-gallery + p,.product > .account-gallery + h1,.product > .account-gallery ~ p,.product > .account-gallery ~ h1{position:relative;z-index:1}
@media(max-width:560px){.product > .account-gallery .account-gallery-stage{min-height:0!important;max-height:none!important;aspect-ratio:4/3!important}.product > .account-gallery{margin-bottom:12px!important}}

/* V25 — premium product gallery / typography polish */
.product > .account-gallery{margin-bottom:18px!important}
.product > .account-gallery .account-gallery-stage{background:linear-gradient(145deg,#0b1727,#050b14)!important;border:1px solid rgba(126,177,239,.22)!important;border-radius:20px!important;box-shadow:0 22px 70px rgba(0,0,0,.34)!important}
.product > .account-gallery .account-main-image{object-fit:contain!important;background:#050c15!important}
.gallery-topbar{position:absolute!important;left:12px!important;right:12px!important;top:12px!important;z-index:10!important;display:flex!important;justify-content:space-between!important;align-items:center!important;pointer-events:none!important}
.gallery-count{display:inline-flex!important;align-items:center!important;min-height:32px!important;padding:0 11px!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:999px!important;background:rgba(5,11,20,.68)!important;color:#eaf3ff!important;font-size:12px!important;font-weight:800!important;backdrop-filter:blur(12px)!important;box-shadow:0 8px 25px rgba(0,0,0,.22)!important}
.gallery-zoom{position:relative!important;inset:auto!important;transform:none!important;width:38px!important;height:38px!important;min-width:38px!important;padding:0!important;display:grid!important;place-items:center!important;border:1px solid rgba(255,255,255,.16)!important;border-radius:50%!important;background:rgba(5,11,20,.72)!important;color:#fff!important;font-size:18px!important;line-height:1!important;pointer-events:auto!important;box-shadow:0 8px 24px rgba(0,0,0,.25)!important;appearance:none!important;-webkit-appearance:none!important}
.gallery-zoom:hover{background:rgba(18,35,56,.9)!important;border-color:rgba(101,220,255,.65)!important}
.gallery-nav{display:grid!important;place-items:center!important;width:44px!important;height:44px!important;padding:0!important;border:1px solid rgba(255,255,255,.18)!important;border-radius:50%!important;background:rgba(5,11,20,.72)!important;color:#fff!important;font-size:30px!important;line-height:1!important;appearance:none!important;-webkit-appearance:none!important}
.gallery-thumb{position:relative!important;flex:0 0 82px!important;width:82px!important;height:62px!important;padding:0!important;border:1px solid rgba(126,177,239,.18)!important;border-radius:12px!important;background:#07111e!important;appearance:none!important;-webkit-appearance:none!important}
.gallery-thumb span{position:absolute!important;right:5px!important;bottom:4px!important;min-width:20px!important;height:20px!important;padding:0 5px!important;display:grid!important;place-items:center!important;border-radius:999px!important;background:rgba(3,8,15,.76)!important;color:#fff!important;font-size:10px!important;font-weight:900!important;line-height:1!important}
.gallery-thumb.is-active{border-color:rgba(101,220,255,.9)!important;box-shadow:0 0 0 2px rgba(101,220,255,.13)!important;opacity:1!important}
.gallery-lightbox{padding:16px!important}
.gallery-lightbox-inner{max-width:96vw!important;max-height:88vh!important;display:flex!important;align-items:center!important;justify-content:center!important}
.gallery-lightbox-inner img{display:block!important;max-width:96vw!important;max-height:86vh!important;width:auto!important;height:auto!important;object-fit:contain!important;border-radius:16px!important;box-shadow:0 30px 100px rgba(0,0,0,.55)!important}
.gallery-close{z-index:3!important;appearance:none!important;-webkit-appearance:none!important;background:rgba(13,23,37,.92)!important}
.product-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:4px 0 8px;color:#91a6c0;font-size:12px;font-weight:800;text-transform:none}
.product-meta span{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;border:1px solid rgba(126,177,239,.13);background:rgba(12,24,40,.62)}
.product-meta .product-sku{color:#dce9f8;background:rgba(73,164,255,.08)}
.product-title{margin:6px 0 10px!important;font-size:clamp(34px,5vw,58px)!important;line-height:1.02!important;letter-spacing:-.035em!important;color:#f7fbff!important}
.product-stats{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 15px!important}
.product-stats span{display:inline-flex;align-items:center;gap:5px;padding:9px 12px;border-radius:12px;background:rgba(12,24,40,.72);border:1px solid rgba(126,177,239,.12);color:#a8b9ce;font-size:13px}.product-stats b{color:#f5f8fd}
.product-description{padding:14px 15px;margin:0 0 15px;border:1px solid rgba(126,177,239,.12);border-radius:14px;background:rgba(10,20,33,.55);color:#c4d1e1;line-height:1.65}
@media(max-width:560px){.gallery-topbar{left:9px!important;right:9px!important;top:9px!important}.gallery-count{min-height:29px!important;padding:0 9px!important;font-size:11px!important}.gallery-zoom{width:34px!important;height:34px!important;min-width:34px!important;font-size:16px!important}.gallery-nav{width:36px!important;height:36px!important;font-size:25px!important}.gallery-thumb{flex-basis:72px!important;width:72px!important;height:56px!important}.product-title{font-size:35px!important}.product-meta{margin-top:0}.product-stats span{font-size:12px;padding:8px 10px}}