.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:#161d2b;color:#d8dfeb;display:flex;flex-direction:column;z-index:40}.brand{height:72px;display:flex;align-items:center;gap:11px;padding:0 22px;border-bottom:1px solid rgba(255,255,255,.08)}.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--red-600);display:grid;place-items:center;color:#fff;font-weight:900;font-size:20px}.brand strong{display:block;color:#fff;letter-spacing:.08em;font-size:.91rem}.brand small{display:block;color:#909aae;font-size:.72rem}.nav-scroll{padding:14px 12px 110px;overflow:auto}.nav-group{margin:16px 0 6px;padding:0 12px;color:#7f8a9d;font-size:.7rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase}.nav-link{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:9px;color:#b7c0ce;font-size:.89rem;margin:2px 0}.nav-link:hover{background:rgba(255,255,255,.06);color:#fff}.nav-link.active{background:var(--red-600);color:#fff;box-shadow:0 8px 18px rgba(217,22,47,.25)}.nav-icon{width:18px;height:18px;display:inline-grid;place-items:center;flex:0 0 18px}.nav-icon svg,.icon svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sidebar-foot{position:absolute;bottom:0;left:0;right:0;padding:12px;background:#161d2b;border-top:1px solid rgba(255,255,255,.08)}.demo-chip{display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.07);padding:10px 12px;border-radius:10px;font-size:.8rem}.demo-dot{width:8px;height:8px;border-radius:99px;background:#fbbf24;box-shadow:0 0 0 4px rgba(251,191,36,.12)}
.main-shell{padding-left:var(--sidebar);min-height:100vh}.topbar{height:var(--topbar);position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:0 28px}.mobile-menu{display:none}.global-search{position:relative;flex:1;max-width:540px}.global-search input{width:100%;height:42px;border:1px solid var(--line);background:var(--surface-alt);border-radius:10px;padding:0 44px 0 40px;color:var(--ink-950)}.global-search .icon{position:absolute;left:14px;top:12px;width:18px;color:var(--ink-500)}.search-key{position:absolute;right:10px;top:9px;padding:3px 7px;border:1px solid var(--line);border-radius:6px;color:var(--ink-500);font-size:.72rem;background:#fff}.top-actions{margin-left:auto;display:flex;align-items:center;gap:8px}.content{padding:24px 28px 44px;max-width:1700px;margin:auto}.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin:0 0 20px}.breadcrumbs{color:var(--ink-500);font-size:.8rem;margin-bottom:5px}.page-head h1{font-size:1.65rem;letter-spacing:-.025em;margin:0}.page-sub{color:var(--ink-500);margin:5px 0 0;font-size:.88rem}.page-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.grid{display:grid;gap:16px}.grid.metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.grid.two{grid-template-columns:minmax(0,1.7fr) minmax(290px,.8fr)}.grid.equal{grid-template-columns:repeat(2,minmax(0,1fr))}.stack{display:grid;gap:16px}.mobile-scrim{display:none}
@media(max-width:1100px){.grid.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.two{grid-template-columns:1fr}.topbar{padding:0 20px}.content{padding:20px}.sidebar{transform:translateX(-100%);transition:transform .2s ease}.sidebar.open{transform:none}.main-shell{padding-left:0}.mobile-menu{display:grid}.mobile-scrim.show{display:block;position:fixed;inset:0;background:rgba(17,24,39,.48);z-index:35}}
@media(max-width:650px){.grid.metrics,.grid.equal{grid-template-columns:1fr}.content{padding:16px}.topbar{height:64px;padding:0 12px;gap:8px}.page-head{align-items:flex-start;flex-direction:column}.page-head h1{font-size:1.35rem}.global-search{display:none}.page-actions{width:100%}.page-actions .btn.primary{flex:1}.hide-mobile{display:none!important}}