/* Zedulex Control Center V5.77 Beta — futuristic mobile-first UI */
:root{
  --z577-red:#ff2738;--z577-red-2:#c80f1d;--z577-blue:#1597ff;--z577-green:#18d983;--z577-amber:#ffad24;
  --z577-radius:18px;--z577-shadow:0 18px 44px rgba(0,0,0,.22);--z577-ease:180ms ease;
}
html[data-theme="dark"] body.zcc-ui-v577,
html[data-theme="dark"] body.zcc-auth-v577{
  --z577-bg:#020406;--z577-bg-2:#070b0f;--z577-surface:#071018;--z577-surface-2:#0b141c;--z577-panel:rgba(5,13,19,.92);
  --z577-text:#f4f8fb;--z577-muted:#88a1b4;--z577-line:#163247;--z577-soft-blue:rgba(21,151,255,.12);--z577-soft-red:rgba(255,39,56,.12);
  --z577-carbon-a:rgba(255,255,255,.022);--z577-carbon-b:rgba(255,255,255,.012);
}
html[data-theme="light"] body.zcc-ui-v577,
html[data-theme="light"] body.zcc-auth-v577{
  --z577-bg:#f7f9fc;--z577-bg-2:#ffffff;--z577-surface:#ffffff;--z577-surface-2:#f4f8fc;--z577-panel:rgba(255,255,255,.94);
  --z577-text:#0c1930;--z577-muted:#60758d;--z577-line:#d7e5f1;--z577-soft-blue:rgba(21,151,255,.09);--z577-soft-red:rgba(255,39,56,.08);
  --z577-carbon-a:rgba(14,40,67,.035);--z577-carbon-b:rgba(14,40,67,.02);
}
body.zcc-ui-v577,body.zcc-auth-v577{color:var(--z577-text)}
body.zcc-ui-v577::before,body.zcc-auth-v577::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(circle at 88% 6%,rgba(21,151,255,.13),transparent 26%),
  radial-gradient(circle at 12% 16%,rgba(255,39,56,.11),transparent 22%),
  repeating-linear-gradient(135deg,var(--z577-carbon-a) 0 2px,transparent 2px 7px),
  repeating-linear-gradient(45deg,var(--z577-carbon-b) 0 2px,transparent 2px 7px),
  linear-gradient(180deg,var(--z577-bg-2),var(--z577-bg));}
html[data-theme="dark"] body.zcc-ui-v577::after,html[data-theme="dark"] body.zcc-auth-v577::after{content:"";position:fixed;left:-16vw;right:-8vw;top:25vh;height:2px;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,39,56,.15),#ff2738,rgba(21,151,255,.15),transparent);transform:rotate(-16deg);box-shadow:0 0 24px rgba(255,39,56,.48)}
html[data-theme="light"] body.zcc-ui-v577::after,html[data-theme="light"] body.zcc-auth-v577::after{content:"";position:fixed;left:-16vw;right:-8vw;top:22vh;height:2px;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,39,56,.08),rgba(255,39,56,.65),transparent);transform:rotate(-16deg)}

.zcc-brand-glyph{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:linear-gradient(145deg,#ff3b49,#ba0716);color:#fff;font-size:25px;font-weight:1000;font-style:italic;letter-spacing:-.08em;box-shadow:0 0 22px rgba(255,39,56,.34)}
.zcc-brand-copy{display:grid;line-height:1}.zcc-brand-copy strong{letter-spacing:.22em;font-size:13px}.zcc-brand-copy small{margin-top:5px;color:var(--z577-muted);font-size:10px;letter-spacing:.17em}
.zcc-mobile-brand{display:none;text-decoration:none;color:var(--z577-text)!important;align-items:center;gap:10px}
.zcc-mobile-user-chip{display:none;width:38px;height:38px;border-radius:50%;place-items:center;background:linear-gradient(145deg,#203d55,#0d2233);border:1px solid rgba(21,151,255,.35);color:#fff;font-weight:900}

.zcc-page-v577{display:grid;gap:16px;color:var(--z577-text)}
.zcc-v577-hero{position:relative;overflow:hidden;padding:22px;border:1px solid var(--z577-line);border-radius:24px;background:linear-gradient(135deg,var(--z577-panel),var(--z577-surface-2));box-shadow:var(--z577-shadow)}
.zcc-v577-hero::after{content:"";position:absolute;width:220px;height:2px;right:-35px;top:46px;background:linear-gradient(90deg,transparent,var(--z577-red));transform:rotate(-18deg);box-shadow:0 0 18px rgba(255,39,56,.45)}
.zcc-v577-eyebrow{display:block;margin-bottom:7px;color:var(--z577-blue);font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.zcc-v577-hero h1{margin:0;font-size:clamp(30px,4vw,48px);line-height:1}.zcc-v577-hero p{margin:9px 0 0;color:var(--z577-muted)}
.zcc-v577-status{display:flex;align-items:center;gap:7px;margin-top:13px;color:var(--z577-muted);font-size:12px}.zcc-v577-status-dot{width:8px;height:8px;border-radius:50%;background:var(--z577-green);box-shadow:0 0 12px rgba(24,217,131,.55)}

.zcc-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.zcc-kpi-card{display:grid;gap:7px;min-width:0;padding:17px;border:1px solid var(--z577-line);border-radius:18px;background:linear-gradient(180deg,var(--z577-surface),var(--z577-panel));box-shadow:0 10px 24px rgba(0,0,0,.08)}
.zcc-kpi-card.is-primary{border-color:rgba(255,39,56,.7);box-shadow:0 0 0 1px rgba(255,39,56,.08),0 0 24px rgba(255,39,56,.12)}
.zcc-kpi-icon{font-size:20px;color:var(--z577-blue)}.zcc-kpi-card.is-primary .zcc-kpi-icon{color:var(--z577-red)}.zcc-kpi-label{color:var(--z577-muted);font-weight:750;font-size:13px}.zcc-kpi-value{font-size:clamp(24px,3vw,34px);font-weight:950;letter-spacing:-.03em}.zcc-kpi-trend{font-size:12px;font-weight:850;color:var(--z577-green)}
.zcc-section-card{padding:18px;border:1px solid var(--z577-line);border-radius:20px;background:linear-gradient(180deg,var(--z577-panel),var(--z577-surface));box-shadow:0 12px 28px rgba(0,0,0,.08)}
.zcc-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}.zcc-section-head h2,.zcc-section-head h3{margin:0}.zcc-section-head h2{font-size:21px}.zcc-section-link{color:var(--z577-blue)!important;text-decoration:none;font-weight:850;font-size:13px}
.zcc-metric-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.zcc-metric-tile{display:grid;gap:4px;padding:13px;border:1px solid var(--z577-line);border-radius:15px;background:var(--z577-surface-2)}.zcc-metric-tile span{color:var(--z577-muted);font-size:12px}.zcc-metric-tile strong{font-size:22px}.zcc-metric-tile small{color:var(--z577-green);font-weight:800}
.zcc-chart-card{padding:18px;border:1px solid var(--z577-line);border-radius:20px;background:linear-gradient(180deg,var(--z577-panel),var(--z577-surface));box-shadow:0 12px 28px rgba(0,0,0,.08)}
.zcc-chart-wrap{height:240px;margin-top:10px;padding:8px;border:1px solid var(--z577-line);border-radius:16px;background:linear-gradient(180deg,var(--z577-surface-2),transparent);overflow:hidden}.zcc-chart-svg{width:100%;height:100%}.zcc-chart-gridline{stroke:var(--z577-line);stroke-width:.35}.zcc-chart-area{fill:url(#zccArea)}.zcc-chart-line{fill:none;stroke:var(--z577-red);stroke-width:2.2;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 5px rgba(255,39,56,.45))}.zcc-chart-point{fill:#fff;stroke:var(--z577-red);stroke-width:1.5;vector-effect:non-scaling-stroke}
.zcc-dual-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.zcc-list{display:grid;gap:0}.zcc-list-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid var(--z577-line)}.zcc-list-row:last-child{border-bottom:0}.zcc-list-dot{width:10px;height:10px;border-radius:50%;background:var(--z577-blue);box-shadow:0 0 10px rgba(21,151,255,.4)}.zcc-list-dot.red{background:var(--z577-red)}.zcc-list-dot.amber{background:var(--z577-amber)}.zcc-list-copy{min-width:0}.zcc-list-copy strong,.zcc-list-copy small{display:block}.zcc-list-copy small{margin-top:3px;color:var(--z577-muted);overflow-wrap:anywhere}.zcc-list-meta{color:var(--z577-muted);font-size:12px;text-align:right}
.zcc-tabs-v577{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.zcc-tabs-v577::-webkit-scrollbar{display:none}.zcc-tabs-v577 a{flex:0 0 auto;padding:9px 14px;border:1px solid var(--z577-line);border-radius:999px;background:var(--z577-surface);color:var(--z577-muted)!important;text-decoration:none;font-weight:850;font-size:13px}.zcc-tabs-v577 a.active{border-color:rgba(255,39,56,.75);background:var(--z577-soft-red);color:var(--z577-red)!important;box-shadow:0 0 16px rgba(255,39,56,.08)}
.zcc-mobile-card-list{display:grid;gap:10px}.zcc-mobile-data-card{padding:14px;border:1px solid var(--z577-line);border-radius:16px;background:var(--z577-surface);color:var(--z577-text)}.zcc-mobile-data-card-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.zcc-mobile-data-card h3{margin:0;font-size:16px}.zcc-mobile-data-card p{margin:4px 0 0;color:var(--z577-muted);font-size:13px}.zcc-mobile-data-card-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:12px}.zcc-mobile-data-card-stats span{display:grid;gap:2px;padding:9px;border-radius:11px;background:var(--z577-surface-2);color:var(--z577-muted);font-size:10px}.zcc-mobile-data-card-stats strong{font-size:14px;color:var(--z577-text)}
.zcc-product-feature{display:grid;gap:13px;padding:17px;border:1px solid rgba(255,39,56,.65);border-radius:19px;background:linear-gradient(135deg,var(--z577-soft-red),var(--z577-surface));box-shadow:0 0 24px rgba(255,39,56,.09)}
.zcc-product-feature-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.zcc-product-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:rgba(24,217,131,.12);color:var(--z577-green);font-size:11px;font-weight:900}.zcc-product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.zcc-system-grid-v577{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.zcc-system-card-v577{display:grid;gap:12px;padding:15px;border:1px solid var(--z577-line);border-radius:17px;background:var(--z577-surface)}.zcc-system-card-v577 h2{margin:0;font-size:17px}.zcc-system-card-v577 p{margin:4px 0 0;color:var(--z577-muted);font-size:12px}.zcc-system-card-v577 .system-card-links{display:grid;grid-template-columns:1fr;gap:7px}.zcc-system-card-v577 .system-card-links a{min-height:42px!important;background:var(--z577-surface-2)!important;border-color:var(--z577-line)!important;color:var(--z577-text)!important}
.zcc-desktop-only{display:block}.zcc-mobile-only{display:none}

/* Login */
body.zcc-auth-v577{min-height:100vh;background:var(--z577-bg);padding:18px}
body.zcc-auth-v577 .zcc-auth-card-v577{position:relative;width:min(460px,100%);padding:0;border:1px solid var(--z577-line);border-radius:30px;background:linear-gradient(180deg,var(--z577-panel),var(--z577-surface));box-shadow:0 30px 80px rgba(0,0,0,.26);overflow:hidden}
body.zcc-auth-v577 .auth-theme-toggle{position:absolute;top:15px;right:15px;z-index:3;width:44px;height:44px;padding:0;border:1px solid var(--z577-line);border-radius:50%;background:var(--z577-surface)!important;color:var(--z577-text)!important}
.zcc-login-v577{display:grid;gap:22px;padding:34px 28px 28px}.zcc-login-brand{display:flex;align-items:center;gap:13px;padding-right:50px}.zcc-login-brand .zcc-brand-glyph{width:54px;height:54px;font-size:32px}.zcc-login-brand .zcc-brand-copy strong{font-size:17px}.zcc-login-tagline{margin:0;color:var(--z577-muted);font-size:11px;letter-spacing:.14em;text-transform:uppercase}.zcc-login-heading h1{margin:0;font-size:32px}.zcc-login-heading p{margin:8px 0 0;color:var(--z577-muted)}.zcc-login-form{display:grid;gap:14px}.zcc-login-form label{color:var(--z577-text);font-size:13px}.zcc-input-shell{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;padding:0 12px;border:1px solid var(--z577-line);border-radius:14px;background:var(--z577-surface-2)}.zcc-input-shell span{color:var(--z577-blue)}.zcc-input-shell input{height:50px;border:0;background:transparent;color:var(--z577-text);outline:0}.zcc-login-meta{display:flex;justify-content:space-between;align-items:center;gap:12px}.zcc-login-meta span{color:var(--z577-muted);font-size:12px}.zcc-login-meta a{color:var(--z577-blue)!important;font-size:12px}.zcc-login-submit{min-height:52px!important;border-radius:14px!important;background:linear-gradient(135deg,var(--z577-red),var(--z577-red-2))!important;font-size:16px;font-weight:900;box-shadow:0 0 24px rgba(255,39,56,.28)}
body.zcc-auth-v577 .flash{margin:18px 18px 0;background:var(--z577-surface-2);border-left-color:var(--z577-red);color:var(--z577-text)}
body.zcc-auth-v577 .auth-card>h1,body.zcc-auth-v577 .auth-card>p,body.zcc-auth-v577 .auth-card>form{margin-left:24px;margin-right:24px}body.zcc-auth-v577 .auth-card>h1{margin-top:34px}body.zcc-auth-v577 .auth-card>p:last-child{margin-bottom:28px}

@media(max-width:1100px){.zcc-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.zcc-metric-strip{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:860px){
  body.zcc-ui-v577{background:var(--z577-bg)!important;font-size:14px;overflow-x:hidden}
  .zcc-ui-v577 .v576-sidebar,.zcc-ui-v577 .mobile-menu-backdrop,.zcc-ui-v577 .mobile-menu-toggle{display:none!important}
  .zcc-ui-v577 .main-content{padding:8px 10px calc(90px + env(safe-area-inset-bottom))!important;max-width:100%;overflow:visible!important}
  .zcc-ui-v577 .topbar-v576{position:sticky;top:max(6px,env(safe-area-inset-top));z-index:45;margin:0 0 12px;padding:10px 11px!important;min-height:62px;border:1px solid var(--z577-line)!important;border-radius:18px!important;background:rgba(4,10,14,.82)!important;backdrop-filter:blur(18px);box-shadow:0 12px 30px rgba(0,0,0,.18)}
  html[data-theme="light"] .zcc-ui-v577 .topbar-v576{background:rgba(255,255,255,.86)!important}
  .zcc-ui-v577 .zcc-mobile-brand{display:flex}.zcc-ui-v577 .topbar-leading{display:none!important}.zcc-ui-v577 .topbar-actions{margin-left:auto}.zcc-ui-v577 .topbar-meta{display:none}.zcc-ui-v577 .theme-toggle{width:42px;height:42px;min-height:42px;padding:0!important;border:1px solid var(--z577-line)!important;border-radius:50%!important;background:var(--z577-surface)!important;color:var(--z577-text)!important;box-shadow:none!important}.zcc-ui-v577 .theme-toggle-text{display:none!important}.zcc-ui-v577 .zcc-mobile-user-chip{display:grid}
  .zcc-mobile-bottom-nav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));z-index:50;padding:7px;border:1px solid var(--z577-line);border-radius:20px;background:rgba(4,10,14,.94);backdrop-filter:blur(18px);box-shadow:0 18px 40px rgba(0,0,0,.32)}
  html[data-theme="light"] .zcc-mobile-bottom-nav{background:rgba(255,255,255,.94)}
  .zcc-mobile-bottom-nav a{display:grid;place-items:center;gap:3px;min-height:56px;border-radius:14px;text-decoration:none;color:var(--z577-muted)!important;font-size:10px;font-weight:850}.zcc-mobile-bottom-nav a span:first-child{font-size:19px}.zcc-mobile-bottom-nav a.active{background:var(--z577-soft-red);color:var(--z577-red)!important;box-shadow:inset 0 -2px 0 var(--z577-red)}
  .zcc-ui-v577 footer{display:none}.zcc-desktop-only{display:none!important}.zcc-mobile-only{display:block!important}
  .zcc-v577-hero{padding:18px;border-radius:20px}.zcc-v577-hero h1{font-size:31px}.zcc-kpi-grid{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(148px,42vw);grid-template-columns:none;overflow-x:auto;gap:10px;padding:2px 1px 8px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none}.zcc-kpi-grid::-webkit-scrollbar{display:none}.zcc-kpi-card{scroll-snap-align:start;padding:14px;border-radius:16px}.zcc-kpi-value{font-size:24px}
  .zcc-metric-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(116px,34vw);grid-template-columns:none;overflow-x:auto;gap:8px;padding-bottom:5px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.zcc-metric-strip::-webkit-scrollbar{display:none}.zcc-section-card,.zcc-chart-card{padding:14px;border-radius:18px}.zcc-chart-wrap{height:190px}.zcc-dual-grid{grid-template-columns:1fr}.zcc-product-grid{grid-template-columns:1fr}.zcc-system-grid-v577{grid-template-columns:1fr}.zcc-mobile-data-card-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .zcc-ui-v577 .product-portfolio-grid{grid-template-columns:1fr}.zcc-ui-v577 .product-portfolio-card{border-color:var(--z577-line)!important;background:var(--z577-surface)!important;box-shadow:none!important}.zcc-ui-v577 .product-portfolio-stats span{background:var(--z577-surface-2)!important}.zcc-ui-v577 .workspace-tabs.product-tabs{border-color:var(--z577-line)!important;background:var(--z577-surface)!important;box-shadow:none!important;overflow-x:auto!important;flex-wrap:nowrap!important}.zcc-ui-v577 .product-tabs>a,.zcc-ui-v577 .product-tabs .product-more>summary{border:1px solid var(--z577-line);border-radius:999px;color:var(--z577-muted)!important}.zcc-ui-v577 .product-tabs>a.active,.zcc-ui-v577 .product-tabs .product-more>summary.active{border-color:rgba(255,39,56,.6);background:var(--z577-soft-red)!important;color:var(--z577-red)!important}
  .zcc-ui-v577 .system-hub-grid{grid-template-columns:1fr!important}.zcc-ui-v577 .system-hub-card{border-color:var(--z577-line)!important;background:var(--z577-surface)!important;box-shadow:none!important}
  .zcc-ui-v577 .panel,.zcc-ui-v577 .card,.zcc-ui-v577 .table-wrap{border-color:var(--z577-line)!important;background:var(--z577-surface)!important;color:var(--z577-text);box-shadow:none!important}.zcc-ui-v577 .muted{color:var(--z577-muted)!important}.zcc-ui-v577 input,.zcc-ui-v577 select,.zcc-ui-v577 textarea{background:var(--z577-surface-2)!important;border-color:var(--z577-line)!important;color:var(--z577-text)!important}
}
@media(max-width:520px){.zcc-login-v577{padding:30px 20px 24px}.zcc-login-heading h1{font-size:29px}.zcc-mobile-data-card-stats{grid-template-columns:1fr 1fr}.zcc-chart-wrap{height:170px}}
@media(min-width:861px){.zcc-mobile-bottom-nav,.zcc-mobile-only,.zcc-mobile-brand,.zcc-mobile-user-chip{display:none!important}}