:root{
  --jz-brand:#17684f;
  --jz-brand-strong:#10503d;
  --jz-brand-soft:#e8f3ee;
  --jz-canvas:#f3f6f4;
  --jz-surface:#fff;
  --jz-sidebar:#172723;
  --jz-ink:#18231f;
  --jz-muted:#65736d;
  --jz-line:#dbe3df;
  --jz-warning:#9a6218;
  --jz-danger:#9d3f3f;
  --green:var(--jz-brand);
  --green-dark:var(--jz-brand-strong);
  --green-soft:var(--jz-brand-soft);
  --ink:var(--jz-ink);
  --muted:var(--jz-muted);
  --line:var(--jz-line);
  --canvas:var(--jz-canvas);
  --sidebar:var(--jz-sidebar);
  font-family:"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;
}

*{box-sizing:border-box}
html{background:var(--jz-canvas)}
body.jz-shell-active{
  min-width:320px;
  min-height:100vh;
  margin:0;
  padding:64px 0 0 248px;
  background:var(--jz-canvas);
  color:var(--jz-ink);
}
body.jz-shell-active button,
body.jz-shell-active input,
body.jz-shell-active select,
body.jz-shell-active textarea{font-family:inherit}
body.jz-shell-active [hidden]{display:none!important}
body.jz-shell-active a:focus-visible,
body.jz-shell-active button:focus-visible,
body.jz-shell-active input:focus-visible,
body.jz-shell-active select:focus-visible,
body.jz-shell-active textarea:focus-visible{
  outline:3px solid #8fc7b5;
  outline-offset:2px;
}

.jz-skip-link{
  position:fixed;
  z-index:130;
  top:8px;
  left:264px;
  padding:9px 13px;
  border-radius:7px;
  background:#fff;
  color:var(--jz-brand);
  box-shadow:0 8px 25px #0002;
  transform:translateY(-160%);
}
.jz-skip-link:focus{transform:none}

.jz-global-sidebar{
  position:fixed;
  z-index:60;
  inset:0 auto 0 0;
  width:248px;
  padding:20px 14px 16px;
  overflow:auto;
  display:flex;
  flex-direction:column;
  background:var(--jz-sidebar);
  color:#dbe7e2;
  border-right:1px solid #0d1916;
}
.jz-brand{
  min-height:52px;
  padding:0 8px 18px;
  display:flex;
  align-items:center;
  gap:11px;
  border-bottom:1px solid #ffffff18;
  color:#fff;
  text-decoration:none;
}
.jz-brand-mark{
  width:36px;
  height:36px;
  flex:none;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:var(--jz-brand);
  color:#fff;
  font-size:13px;
  font-weight:800;
  letter-spacing:.5px;
}
.jz-brand strong,.jz-brand small{display:block}
.jz-brand strong{font-size:16px;letter-spacing:.2px}
.jz-brand small{margin-top:2px;color:#7f9890;font-size:9px;letter-spacing:1.3px}
.jz-nav-caption{padding:18px 10px 8px;color:#718981;font-size:10px;letter-spacing:1.5px}
.jz-primary-nav{display:grid;gap:3px}
.jz-nav-group{border-radius:8px}
.jz-nav-link{
  position:relative;
  min-height:44px;
  padding:0 12px;
  display:flex;
  align-items:center;
  gap:11px;
  border-radius:7px;
  color:#aebfba;
  text-decoration:none;
  font-size:13px;
  transition:background-color .16s ease,color .16s ease,box-shadow .16s ease;
}
.jz-nav-link svg{width:18px;height:18px;flex:none}
.jz-nav-link:after{
  content:"";
  width:6px;
  height:6px;
  margin-left:auto;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:rotate(45deg);
  transition:transform .16s ease;
}
.jz-nav-group.expanded>.jz-nav-link:after{transform:rotate(225deg)}
.jz-nav-link:hover{background:#ffffff0d;color:#fff}
.jz-nav-group.expanded>.jz-nav-link{background:#ffffff0a;color:#e8f2ee}
.jz-nav-group.active>.jz-nav-link{
  background:#27644f;
  color:#fff;
  font-weight:700;
  box-shadow:inset 3px 0 0 #62d1ae,0 4px 14px #0716112b;
}
.jz-subnav{
  margin:4px 0 7px 21px;
  padding-left:16px;
  display:grid;
  gap:2px;
  border-left:1px solid #ffffff1a;
}
.jz-subnav a{
  position:relative;
  min-height:44px;
  padding:7px 9px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  border-radius:6px;
  color:#849b94;
  text-decoration:none;
  font-size:13px;
  line-height:1.35;
  transition:background-color .16s ease,color .16s ease,box-shadow .16s ease;
}
.jz-subnav a.muted{color:#526660}
.jz-subnav a.muted:hover{background:#ffffff08;color:#9aada7}
.jz-subnav a.muted.active{background:#24433a;color:#dbe7e2}
.jz-subnav a:hover{background:#ffffff0c;color:#fff}
.jz-subnav-item>a.active{
  background:#244b3f;
  color:#fff;
  font-weight:700;
  box-shadow:inset 2px 0 0 #54c6a7;
}
.jz-subnav a.active:before{
  content:"";
  position:absolute;
  top:50%;
  left:-19px;
  width:5px;
  height:5px;
  transform:translateY(-50%);
  border-radius:50%;
  background:#54c6a7;
}
.jz-subnav a>span{min-width:0;flex:1}
.jz-subnav-item{min-width:0}
.jz-subnav-item.has-tertiary>a:after{
  content:"";
  width:5px;
  height:5px;
  flex:none;
  margin-left:auto;
  border-right:1px solid currentColor;
  border-bottom:1px solid currentColor;
  transform:rotate(45deg);
  transition:transform .16s ease;
}
.jz-subnav-item.has-tertiary.expanded>a:after{transform:rotate(225deg)}
.jz-tertiary-nav{
  margin:3px 0 6px 10px;
  padding-left:10px;
  display:grid;
  gap:2px;
  border-left:1px solid #ffffff17;
}
.jz-tertiary-nav a{min-height:34px;padding:5px 9px;color:#789088;font-size:10px}
.jz-tertiary-nav a.active{
  background:#1d5b47;
  color:#fff;
  font-weight:700;
  box-shadow:inset 2px 0 0 #75dbba;
}
.jz-tertiary-nav a.active:before{left:-13px;width:4px;height:4px;background:#75dbba}
.jz-subnav small{
  margin-left:auto;
  padding:2px 5px;
  border:1px solid #ffffff20;
  border-radius:8px;
  color:#91a8a1;
  font-size:10px;
}
.jz-sidebar-foot{
  margin-top:auto;
  padding:15px 10px 0;
  border-top:1px solid #ffffff18;
}
.jz-sidebar-foot span,.jz-sidebar-foot small{display:block}
.jz-sidebar-foot span{overflow:hidden;color:#d9e5e1;font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.jz-sidebar-foot small{margin-top:4px;color:#6f8880;font-size:9px}

.jz-global-header{
  position:fixed;
  z-index:50;
  inset:0 0 auto 248px;
  height:64px;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid var(--jz-line);
  background:#fffffff2;
  box-shadow:0 1px 0 #142a2210;
  backdrop-filter:blur(12px);
}
.jz-header-title{min-width:0;display:flex;align-items:center;gap:8px;font-size:12px}
.jz-header-title strong{font-size:15px}
.jz-header-title span{overflow:hidden;color:var(--jz-muted);text-overflow:ellipsis;white-space:nowrap}
.jz-header-actions{display:flex;align-items:center;gap:8px}
.jz-header-actions a,.jz-header-actions button{
  min-height:36px;
  padding:0 12px;
  border:1px solid var(--jz-line);
  border-radius:7px;
  display:inline-flex;
  align-items:center;
  background:#fff;
  color:var(--jz-ink);
  text-decoration:none;
  font-size:11px;
  cursor:pointer;
}
.jz-header-actions a:hover,.jz-header-actions button:hover{border-color:#a7bbb3;color:var(--jz-brand)}
.jz-menu-button{
  width:42px;
  height:42px;
  padding:10px;
  border:0;
  border-radius:7px;
  display:none;
  background:transparent;
  color:var(--jz-ink);
}
.jz-menu-button svg{width:22px;height:22px}
.jz-menu-backdrop{display:none}

body.jz-shell-active>aside.sidebar,
body.jz-shell-active>.app>aside.sidebar,
body.jz-shell-active>#app>aside.sidebar,
body.jz-shell-active #root>.app-shell>nav.sidebar,
body.jz-shell-active #root>.app-shell .workspace>nav.sidebar{display:none!important}
body.jz-shell-active>.app,
body.jz-shell-active>#app:not(.hidden),
body.jz-shell-active #root>.app-shell{display:block!important;min-height:calc(100vh - 64px)!important}
body.jz-shell-active>#app.hidden{display:none!important}
body.jz-shell-active>.app>.main,
body.jz-shell-active>#app>.main,
body.jz-shell-active>main,
body.jz-shell-active #root>.app-shell>main{min-width:0!important;margin-left:0!important}
body.jz-shell-active #root>.app-shell{width:100%!important}
body.jz-shell-active #root>.app-shell .workspace{display:block!important}
body.jz-shell-active #root>.app-shell .workspace>main.content{width:100%!important;max-width:none!important}
.jz-no-permission{min-height:360px;margin:24px;padding:72px 24px;display:grid;place-content:center;gap:10px;text-align:center;border:1px solid var(--jz-line);border-radius:8px;background:#fff;color:var(--jz-muted)}
.jz-no-permission strong{color:var(--jz-ink);font-size:20px}
.jz-no-permission p{margin:0;font-size:12px}

body.jz-shell-active .topbar,
body.jz-shell-active .top{
  top:64px!important;
  min-height:58px;
  height:auto;
  padding:10px 24px;
  border-bottom:1px solid var(--jz-line);
  background:#fff;
  box-shadow:none;
}
body.jz-shell-active .topbar .mobile-menu,
body.jz-shell-active .topbar .logout-btn{display:none!important}
body.jz-shell-active .content{width:100%;max-width:1500px;margin:0 auto;padding:26px 28px 44px}
body.jz-shell-active .page-head h1,
body.jz-shell-active .section-head h2{letter-spacing:-.3px}
body.jz-shell-active .summary,
body.jz-shell-active .kpis,
body.jz-shell-active .metrics{gap:14px}
body.jz-shell-active .summary article,
body.jz-shell-active .kpi,
body.jz-shell-active .metric,
body.jz-shell-active .mini{
  border:1px solid var(--jz-line);
  border-radius:10px;
  background:var(--jz-surface);
  box-shadow:0 3px 14px #173c2f08;
}
body.jz-shell-active .panel,
body.jz-shell-active .card,
body.jz-shell-active .form-band{
  border-color:var(--jz-line);
  border-radius:10px;
  box-shadow:0 3px 16px #173c2f08;
}
body.jz-shell-active button,
body.jz-shell-active a,
body.jz-shell-active input,
body.jz-shell-active select{accent-color:var(--jz-brand)}
body.jz-shell-active button:not(:disabled){cursor:pointer}
body.jz-shell-active input,
body.jz-shell-active select,
body.jz-shell-active textarea{border-radius:7px}
body.jz-shell-active .primary,
body.jz-shell-active .primary-btn{background:var(--jz-brand)!important;border-color:var(--jz-brand)!important;color:#fff!important}
body.jz-shell-active .tabs{overflow-x:auto;scrollbar-width:thin}
body.jz-shell-active .tabs button{min-height:44px;white-space:nowrap}
body.jz-shell-active .table-wrap{max-width:100%;overflow:auto}
body.jz-shell-active table{background:#fff}
body.jz-shell-active th{background:#f6f9f7;color:#4c5e56}
body.jz-shell-active tbody tr:hover{background:#f1f7f4}
body.jz-shell-active .empty-row{min-height:180px}
body.jz-shell-active .drawer-backdrop{z-index:90!important}
body.jz-shell-active .drawer{z-index:91!important}
body.jz-shell-active .toast{z-index:120!important}

body.jz-shell-active>main.page-shell{
  width:min(1460px,calc(100% - 48px));
  min-height:auto;
  margin:24px auto!important;
  padding:24px;
  overflow:hidden;
  border:1px solid var(--jz-line);
  border-radius:10px;
  background:#fff;
  box-shadow:0 3px 16px #173c2f08;
}
body.jz-shell-active>main.page-shell>header{margin-bottom:20px}
body.jz-shell-active>main.page-shell h1{margin:0;font-size:24px}
body.jz-shell-active>main.page-shell p{margin:7px 0 0;color:var(--jz-muted);font-size:12px}
body.jz-shell-active>main.page-shell nav{display:flex;gap:8px;overflow:auto;margin-bottom:16px}
body.jz-shell-active>main.page-shell nav button,
body.jz-shell-active>main.page-shell>section button,
body.jz-shell-active>main.page-shell>#refresh{
  min-height:38px;
  padding:0 13px;
  border:1px solid var(--jz-line);
  border-radius:7px;
  background:#fff;
  color:var(--jz-ink);
}
body.jz-shell-active>main.page-shell nav button.active{border-color:var(--jz-brand);background:var(--jz-brand-soft);color:var(--jz-brand);font-weight:700}
body.jz-shell-active>main.page-shell>table{display:block;max-width:100%;overflow:auto;border-collapse:collapse}
body.jz-shell-active>main.page-shell th,
body.jz-shell-active>main.page-shell td{padding:12px 14px;border-bottom:1px solid var(--jz-line);text-align:left;white-space:nowrap;font-size:11px}

.module-data{min-height:300px!important;padding:18px!important;text-align:left!important}
.module-data .module-data-head{margin-bottom:14px;display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.module-data .module-data-head h2{margin:0;font-size:16px}
.module-data .module-data-head p{margin:5px 0 0;color:var(--jz-muted);font-size:10px}
.module-data .module-data-head span{color:var(--jz-muted);font-size:10px}
.module-data .table-wrap{border:1px solid var(--jz-line);border-radius:8px}
.module-data table{min-width:820px}

body.jz-compat-page:after{
  content:"兼容工作区";
  position:fixed;
  z-index:45;
  right:24px;
  bottom:18px;
  padding:6px 10px;
  border:1px solid #d5b57a;
  border-radius:14px;
  background:#fff8e9;
  color:#7c571d;
  font-size:9px;
  pointer-events:none;
}

@media(max-width:1024px){
  body.jz-shell-active{padding-left:0}
  .jz-global-header{left:0;padding:0 16px}
  .jz-global-sidebar{
    z-index:100;
    width:min(288px,84vw);
    transform:translateX(-105%);
    transition:transform .2s ease;
    box-shadow:18px 0 50px #0003;
  }
  .jz-menu-button{display:grid;place-items:center}
  .jz-menu-backdrop{
    position:fixed;
    z-index:95;
    inset:0;
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:#07171280;
  }
  body.jz-menu-open{overflow:hidden}
  body.jz-menu-open .jz-global-sidebar{transform:none}
  body.jz-menu-open .jz-menu-backdrop{display:block}
  .jz-skip-link{left:64px}
  body.jz-shell-active .topbar,
  body.jz-shell-active .top{top:64px!important}
}

@media(max-width:720px){
  .jz-global-header{height:60px}
  body.jz-shell-active{padding-top:60px}
  .jz-header-title{gap:5px}
  .jz-header-title strong{font-size:13px}
  .jz-header-actions a{display:none}
  .jz-header-actions button{min-height:38px;padding:0 10px}
  body.jz-shell-active .topbar,
  body.jz-shell-active .top{top:60px!important;padding:9px 14px}
  body.jz-shell-active .top-actions{max-width:100%;overflow:auto}
  body.jz-shell-active .content{padding:20px 14px 34px}
  body.jz-shell-active .summary,
  body.jz-shell-active .kpis,
  body.jz-shell-active .metrics{grid-template-columns:1fr 1fr!important}
  body.jz-shell-active .page-head{align-items:flex-start;flex-direction:column}
  body.jz-shell-active .toolbar{flex-wrap:wrap}
  body.jz-shell-active .toolbar label{width:100%}
  body.jz-shell-active>main.page-shell{width:calc(100% - 24px);margin:12px auto!important;padding:16px}
  .module-data{padding:12px!important}
  .module-data .module-data-head{align-items:flex-start;flex-direction:column}
}

@media(max-width:420px){
  .jz-header-view,.jz-header-title>span:first-of-type{display:none}
  body.jz-shell-active .summary,
  body.jz-shell-active .kpis,
  body.jz-shell-active .metrics{grid-template-columns:1fr!important}
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}
