/* Каркас рабочего пространства */
#app { min-height: 100vh; }
.app-shell { display:grid; grid-template-columns:var(--sidebar-width) minmax(0,1fr); gap:20px; padding:12px; min-height:100vh; min-height:100dvh; }
.sidebar {
  position:sticky; top:12px; align-self:start; height:calc(100vh - 24px); height:calc(100dvh - 24px);
  display:flex; flex-direction:column; gap:26px; padding:23px 12px 12px;
  border:1px solid var(--border-glass); border-radius:22px; background:var(--sidebar-bg); z-index:40;
  box-shadow:var(--shadow-card);
}
.sidebar-brand { display:flex; align-items:center; gap:12px; padding:0 10px; }
.sidebar-brand .brand-emblem { width:36px; height:38px; object-fit:contain; flex:none; opacity:.91; }
[data-theme="light"] .sidebar-brand .brand-emblem { filter:brightness(0) saturate(100%) opacity(.7); }
.sidebar-brand .title { font-size:15px; font-weight:650; letter-spacing:.035em; line-height:1.3; }
.sidebar-brand .subtitle { margin-top:3px; font-size:10px; color:var(--text-tertiary); }
.sidebar-nav { display:flex; flex-direction:column; gap:5px; flex:1; min-height:0; overflow-y:auto; position:relative; }
.nav-indicator {
  position:absolute; left:0; right:0; top:0; height:0; opacity:0; pointer-events:none; z-index:0;
  border:1px solid var(--accent-border); border-radius:12px; background:var(--accent-soft);
  box-shadow:inset 0 1px 0 var(--glass-highlight);
  transition:transform .45s var(--ease-premium),height .3s var(--ease-premium),opacity .25s ease;
}
.sidebar-nav .nav-item {
  appearance:none; display:flex; align-items:center; gap:11px; min-height:43px; width:100%; padding:10px 12px;
  border:0; border-radius:12px; position:relative; z-index:1; background:transparent;
  color:var(--text-secondary); font-size:13px; font-weight:450; text-align:left; white-space:nowrap; cursor:pointer;
  transition:background .2s ease,color .25s ease;
}
.sidebar-nav .nav-item .nav-icon { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; flex:none; opacity:.9; transition:opacity .25s ease; }
.sidebar-nav .nav-item .ui-icon { width:21px; height:21px; stroke-width:1.7; }
.sidebar-nav .nav-item:hover { background:var(--surface-hover); color:var(--text-primary); }
.sidebar-nav .nav-item.active { color:var(--color-gold); font-weight:550; }
.sidebar-nav .nav-item.active .nav-icon { opacity:1; }
.ui-icon { display:block; }
.acc-ic { display:inline-flex; align-items:center; justify-content:center; width:20px; flex:none; color:var(--text-secondary); }
.sidebar-nav .nav-badge { margin-left:auto; padding:1px 6px; min-width:21px; border-radius:7px; background:var(--control-hover); color:var(--text-secondary); font-size:10px; font-weight:600; text-align:center; font-variant-numeric:tabular-nums; }
.sidebar-footer { border-top:1px solid var(--divider); padding-top:12px; }
.sidebar-user { display:flex; align-items:center; gap:10px; width:100%; padding:10px 8px; border:0; border-radius:12px; background:transparent; color:var(--text-primary); text-align:left; cursor:pointer; transition:background .2s ease; }
.sidebar-user:hover { background:var(--surface-hover); }
.avatar { display:grid; place-items:center; border-radius:50%; background:var(--accent-soft); color:var(--color-gold); border:1px solid var(--accent-border); font-weight:550; }
.sidebar-user .avatar { width:34px; height:34px; flex:none; font-size:11px; }
.sidebar-user > div:last-child { min-width:0; }
.sidebar-user .name { font-size:11px; font-weight:550; line-height:1.4; overflow:hidden; text-overflow:ellipsis; }
.sidebar-user .role { margin-top:3px; font-size:10px; color:var(--text-tertiary); }

/* Header: рабочая панель с локальным стеклом и не обрезанными popover */
.main-area { display:flex; flex-direction:column; min-height:calc(100vh - 24px); min-width:0; }
.topbar {
  position:sticky; top:12px; z-index:45; flex:none; height:var(--topbar-height); min-width:0;
  display:flex; align-items:center; gap:20px; margin:0; padding:0 20px; border-radius:20px;
}
.topbar.glass { overflow:visible; background:var(--sidebar-bg); -webkit-backdrop-filter:blur(26px) saturate(125%); backdrop-filter:blur(26px) saturate(125%); }
.topbar .page-title { flex:none; font-size:19px; font-weight:600; letter-spacing:-.025em; }
.topbar-search {
  appearance:none; flex:1; min-width:0; max-width:390px; height:36px; padding:0 12px;
  display:flex; align-items:center; gap:8px; text-align:left;
  background:var(--control-bg); border:1px solid var(--border-glass); border-radius:11px;
  color:var(--text-tertiary); cursor:pointer; font-size:12px; transition:background .25s ease,border-color .25s ease;
}
.topbar-search .search-label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.topbar-search > .ui-icon { flex:none; width:16px; height:16px; }
.topbar-search:hover { background:var(--control-hover); border-color:var(--border-glass-strong); }
.topbar-search kbd { margin-left:auto; flex:none; padding:1px 5px; border:1px solid var(--border-glass); border-radius:5px; font:10px var(--font-main); background:var(--control-bg); opacity:.8; }
.topbar-actions { display:flex; align-items:center; gap:8px; margin-left:auto; flex:none; }
.icon-btn { width:36px; height:36px; padding:0; display:flex; align-items:center; justify-content:center; position:relative; border-radius:11px; background:var(--control-bg); border:1px solid var(--border-glass); color:var(--text-secondary); font-size:16px; cursor:pointer; transition:background .22s ease,color .22s ease,border-color .22s ease; }
.icon-btn:hover { background:var(--control-hover); color:var(--text-primary); border-color:var(--border-glass-strong); }
.icon-btn:active { background:var(--accent-soft); }
.notif-dropdown.account-dropdown { width:240px; max-width:calc(100vw - 32px); }
.account-logout-item { color:var(--color-warm); }
.icon-btn .dot-badge { position:absolute; top:-3px; right:-3px; min-width:15px; height:15px; padding:0 4px; display:flex; align-items:center; justify-content:center; border-radius:6px; background:#a46e52; border:1px solid var(--surface-solid); font-size:8px; font-weight:650; color:#fff; }
.content { flex:1; min-width:0; padding:24px 6px 32px; }
.content-inner { width:100%; max-width:1480px; min-width:0; margin:0 auto; }
.bottom-nav { display:none; }

/* Навигационная цепочка */
.breadcrumbs { display:flex; align-items:center; flex-wrap:wrap; gap:4px; font-size:12px; color:var(--text-tertiary); margin-bottom:18px; }
.breadcrumbs .crumb { cursor:pointer; padding:5px 7px; border-radius:7px; transition:background .2s ease,color .2s ease; }
.breadcrumbs .crumb:hover { background:var(--control-hover); color:var(--text-primary); }
.breadcrumbs .crumb.current { color:var(--text-secondary); font-weight:550; cursor:default; }
.breadcrumbs .crumb.current:hover { background:none; }
.breadcrumbs .sep { opacity:.5; }

/* Все разделы доступны и с мобильной панели */
.mobile-menu-overlay { position:fixed; inset:0; z-index:900; display:grid; align-items:end; padding:18px; background:rgba(4,15,9,.4); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); animation:fadeInUp .2s ease both; }
.mobile-menu-panel { width:min(520px,100%); margin:0 auto; padding:22px 16px 16px; border-radius:26px; background:var(--surface-solid); border:1px solid var(--border-glass-strong); box-shadow:var(--shadow-float); }
.mobile-menu-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 6px 18px; font-size:17px; font-weight:600; }
.mobile-menu-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.mobile-menu-item { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; min-height:82px; padding:12px 5px; border:1px solid var(--border-glass); border-radius:15px; color:var(--text-secondary); background:var(--control-bg); cursor:pointer; font-size:11px; }
.mobile-menu-item.active { background:var(--accent-soft); border-color:var(--accent-border); color:var(--color-gold); }
.mobile-menu-item:hover { background:var(--control-hover); }
@media (prefers-reduced-motion:reduce) { .mobile-menu-overlay { animation:none; } }