/* KUNPO 自动搭建 shell only — safe to load on legacy pages (clplan / std-build) */

:root{
  --pb-side-w:240px;
  --pb-side-collapsed-w:64px;
  --bg:#0f1117; --surface:#171a23; --surface2:#1e222e; --surface3:#262b3a;
  --border:#2a2f40; --border-strong:#3a4155;
  --text:#e6e8ef; --text2:#98a0b3; --text3:#6b7285;
  --accent:#5b8def; --accent-hover:#6d9af0; --accent-soft:rgba(91,141,239,.14);
  --success:#43d9ad; --success-soft:rgba(67,217,173,.14);
  --warning:#e5a054; --warning-soft:rgba(229,160,84,.14);
  --danger:#e55565;  --danger-soft:rgba(229,85,101,.14);
  --purple:#a78bfa;  --purple-soft:rgba(167,139,250,.14);
  --r-sm:6px; --r:8px; --r-pill:999px;
}
body.theme-light{
  --bg:#f4f6fa; --surface:#ffffff; --surface2:#f7f9fc; --surface3:#eef1f6;
  --border:#e3e7ee; --border-strong:#cfd6e2;
  --text:#1f2329; --text2:#6b7280; --text3:#9aa1ad;
  --accent:#1677ff; --accent-hover:#3b8dff; --accent-soft:rgba(22,119,255,.10);
  --success:#0fbf7f; --success-soft:rgba(15,191,127,.12);
  --warning:#d48806; --warning-soft:rgba(212,136,6,.12);
  --danger:#e5453b;  --danger-soft:rgba(229,69,59,.12);
  --purple:#722ed1;  --purple-soft:rgba(114,46,209,.12);
}

body.pb-shell{display:flex !important;flex-direction:column;height:100vh !important;overflow:hidden !important;min-height:0 !important;margin:0}
body.pb-shell > .pb-impersonate,
body.pb-shell > #pb-readonly-banner,
body.pb-shell > #readonly-banner{flex:none}

.pb-app-frame{display:grid;grid-template-columns:var(--pb-side-w) 1fr;flex:1;min-height:0;overflow:hidden}
body.pb-shell.pb-side-collapsed .pb-app-frame{grid-template-columns:var(--pb-side-collapsed-w) 1fr}

.pb-side-nav{
  display:flex;flex-direction:column;height:100%;overflow:auto;
  background:var(--surface);border-right:1px solid var(--border);padding:16px 12px;gap:4px;z-index:90}
.pb-side-nav .pb-brand{display:flex;align-items:center;gap:10px;padding:4px 10px 16px;font-weight:700;font-size:15px;color:var(--text)}
.pb-side-nav .pb-brand .pb-logo{width:28px;height:28px}
.pb-side-nav .nav-label{font-size:11px;color:var(--text3);font-weight:600;letter-spacing:.4px;padding:14px 12px 6px}
.pb-side-nav a.nav-item,
.pb-side-nav button.nav-item{
  display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:9px 12px;border:0;border-radius:var(--r-sm);
  background:transparent;color:var(--text2);font-size:13.5px;font-weight:500;cursor:pointer;font-family:inherit;text-decoration:none}
.pb-side-nav a.nav-item:hover,
.pb-side-nav button.nav-item:hover{background:var(--surface2);color:var(--text)}
.pb-side-nav a.nav-item.active,
.pb-side-nav button.nav-item.active{background:var(--accent-soft);color:var(--accent);font-weight:600}
.pb-side-nav .ic{width:18px;text-align:center;flex:none;opacity:.9}
.pb-side-nav .pb-side-sub{display:none;flex-direction:column;gap:2px;padding:4px 0 8px 8px;margin:0 0 4px 12px;border-left:1px solid var(--border)}
body.pb-shell.pb-on-settings .pb-side-nav .pb-side-sub{display:flex}
.pb-side-nav .pb-side-sub button{
  display:flex;align-items:center;gap:6px;width:100%;text-align:left;padding:7px 10px;border:0;border-radius:var(--r-sm);
  background:transparent;color:var(--text2);font-size:12.5px;cursor:pointer;font-family:inherit}
.pb-side-nav .pb-side-sub button:hover{background:var(--surface2);color:var(--text)}
.pb-side-nav .pb-side-sub button.active{color:var(--accent);font-weight:600;background:var(--accent-soft)}
.pb-side-nav .pb-side-sub .perm-label{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.perm-tag{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:16px;padding:0 4px;
  border-radius:4px;font-size:10px;font-weight:700;line-height:1;letter-spacing:.02em}
.perm-tag.admin{background:var(--warning-soft);color:var(--warning)}
.perm-tag.dev{background:var(--success-soft);color:var(--success)}
.pb-side-nav .pb-side-foot{margin-top:auto;padding-top:12px;border-top:1px solid var(--border)}
.pb-side-nav .collapse-btn{font-size:12px;color:var(--text3)}
body.pb-shell.pb-side-collapsed .pb-side-nav .pb-brand span:not(.pb-logo),
body.pb-shell.pb-side-collapsed .pb-side-nav .nav-label,
body.pb-shell.pb-side-collapsed .pb-side-nav .nav-item span:not(.ic),
body.pb-shell.pb-side-collapsed .pb-side-nav .pb-side-sub,
body.pb-shell.pb-side-collapsed .pb-side-nav .collapse-btn span:not(.ic){display:none}
body.pb-shell.pb-side-collapsed .pb-side-nav .nav-item{justify-content:center;padding:10px}
body.pb-shell.pb-side-collapsed .pb-side-nav{padding:16px 8px}

.pb-app-main{min-width:0;height:100%;display:flex;flex-direction:column;overflow:hidden}
.pb-header{flex:none;position:relative;z-index:100;display:flex;align-items:center;gap:24px;
  height:56px;padding:0 20px;background:var(--surface);border-bottom:1px solid var(--border)}
.pb-header .pb-brand,.pb-header .pb-nav{display:none}
.pb-brand{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:700;letter-spacing:.2px;white-space:nowrap}
.pb-logo{width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,var(--accent),var(--purple));
  display:grid;place-items:center;color:#fff;font-size:13px;font-weight:800}
.pb-right{margin-left:auto;display:flex;align-items:center;gap:12px;font-size:12.5px}
.pb-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--r-pill);
  background:var(--surface2);border:1px solid var(--border);color:var(--text2)}
.pb-chip .dot{width:6px;height:6px;border-radius:50%;background:var(--success)}
.pb-chip.warn{background:var(--warning-soft);border-color:transparent;color:var(--warning)}
.pb-user{display:flex;align-items:center;gap:8px;padding:4px 6px 4px 4px;border-radius:var(--r-pill);cursor:pointer;color:var(--text)}
.pb-user:hover{background:var(--surface2)}
.pb-avatar{width:24px;height:24px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:11px;font-weight:700}
.pb-user .role{color:var(--text3)}
.icon-btn{width:30px;height:30px;border-radius:var(--r-sm);border:1px solid var(--border);background:var(--surface2);
  color:var(--text2);cursor:pointer;font-size:14px;display:grid;place-items:center;font-family:inherit}
.icon-btn:hover{color:var(--text);border-color:var(--border-strong)}

/* legacy page content fills remaining height under slim header */
body.pb-shell .main-wrapper{flex:1;min-height:0;height:auto !important}
body.pb-shell .pb-app-main > .container{flex:1;min-height:0;overflow:auto}

.pb-impersonate{display:flex;align-items:center;justify-content:center;gap:14px;padding:7px 16px;
  background:var(--warning);color:#1a1207;font-size:12.5px;font-weight:600}
.pb-impersonate button{border:0;border-radius:var(--r-sm);padding:3px 10px;background:rgba(0,0,0,.22);color:#fff;
  cursor:pointer;font-size:12px;font-family:inherit;font-weight:600}

/* login chip in header only */
.pb-header .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 15px;border-radius:var(--r-sm);
  border:1px solid var(--border-strong);background:var(--surface2);color:var(--text);font-size:13px;font-weight:550;
  cursor:pointer;font-family:inherit;text-decoration:none}
.pb-header .btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}
.pb-header .btn-sm{padding:4px 10px;font-size:12px}

@media(max-width:900px){
  .pb-app-frame{grid-template-columns:1fr}
  .pb-side-nav{position:relative;height:auto;max-height:40vh;border-right:0;border-bottom:1px solid var(--border)}
  body.pb-shell.pb-side-collapsed .pb-app-frame{grid-template-columns:1fr}
}