/* BZ-VP App Styles - Modern Clean UI */
:root{
  --bg:#0b1220; --panel:#0f172a; --panel-2:#111827; --text:#e5e7eb; --muted:#9ca3af;
  --primary:#22c55e; --primary-2:#16a34a; --accent:#06b6d4; --danger:#ef4444;
  --border:#1f2937;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif;background:linear-gradient(120deg,#0b1220,#0b1425 60%,#0a1628);color:var(--text)}

.app-layout{display:grid;grid-template-columns:280px 1fr;grid-template-rows:auto 1fr;height:100vh}
.sidebar{grid-row:1/3;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column}
.brand{display:flex;gap:12px;align-items:center;padding:16px;border-bottom:1px solid var(--border)}
.brand-icon{width:28px;height:28px;color:var(--accent)}
.brand-text{line-height:1.2}
.brand-title{font-weight:700}
.brand-sub{font-size:12px;color:var(--muted)}
.menu{padding:8px 8px 16px;overflow:auto}
.menu-section{margin:12px 8px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.menu-item{display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;color:var(--text);text-decoration:none}
.menu-item:hover{background:#0c1b32}
.menu-item.active{background:#0d1f3a;outline:1px solid #0e2a55}
.menu-icon{width:20px;height:20px;color:var(--muted)}

.main{display:flex;flex-direction:column}
.topbar{height:56px;display:flex;align-items:center;gap:12px;padding:0 14px;border-bottom:1px solid var(--border);background:var(--panel-2)}
.btn-icon{background:transparent;border:0;color:var(--text);border-radius:8px;padding:8px;cursor:pointer}
.btn-icon:hover{background:#0c1b32}
.btn-icon-svg{width:20px;height:20px}
.topbar-title{font-weight:600}
.version-pill{font-size:12px;color:var(--muted);background:#0c1b32;border:1px solid var(--border);padding:4px 8px;border-radius:999px}
.content{padding:14px}
.app-frame{width:100%;height:calc(100vh - 56px - 28px);border:0;border-radius:14px;background:#0c1b32}

/* Responsive */
@media (max-width: 980px){
  .app-layout{grid-template-columns:1fr}
  .sidebar{position:fixed;left:0;top:0;bottom:0;width:280px;transform:translateX(-100%);transition:transform .25s ease}
  .sidebar.open{transform:translateX(0)}
  .content{padding:8px}
}

/* Utility */
.hidden{display:none}