.shell{min-height:100vh;display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr)}
.sidebar{
  position:fixed;inset:0 auto 0 0;width:var(--sidebar);z-index:40;
  display:flex;flex-direction:column;padding:18px 14px;
  background:rgba(7,7,7,.91);backdrop-filter:blur(20px);
  border-right:1px solid var(--line-soft)
}
.brand{
  height:56px;display:flex;align-items:center;gap:12px;padding:0 8px 15px;
  border-bottom:1px solid var(--line-soft);margin-bottom:16px
}
.brand-mark{
  width:31px;height:31px;border:1px solid #5c5c5c;border-radius:8px;
  display:grid;place-items:center;color:#ddd
}
.brand-mark svg{width:17px;height:17px}
.brand-name{font-size:17px;font-weight:720;letter-spacing:-.025em;word-spacing:.18em;color:#ececea;white-space:nowrap}
.nav-label{padding:14px 10px 7px;color:#565656;text-transform:uppercase;font:650 10px ui-monospace,monospace;letter-spacing:.15em}
.nav{display:grid;gap:4px}
.nav-link{
  min-height:42px;padding:0 12px;border-radius:10px;display:flex;align-items:center;gap:12px;
  color:#929292;font-size:13px;font-weight:560;transition:.18s ease
}
.nav-link:hover{background:#111;color:#e9e9e9}
.nav-link.active{background:#171717;color:#fff;box-shadow:inset 0 0 0 1px #252525}
.nav-icon{width:19px;height:19px;display:grid;place-items:center;color:#707070}
.nav-icon svg{width:18px;height:18px}.active .nav-icon{color:#fff}
.nav-count{margin-left:auto;padding:2px 7px;border-radius:99px;background:#202020;color:#aaa;font:650 10px ui-monospace,monospace}
.sidebar-foot{margin-top:auto}
.operator{
  padding:10px;border:1px solid var(--line-soft);border-radius:12px;background:#0d0d0d;
  display:flex;align-items:center;gap:10px
}
.avatar{width:34px;height:34px;border-radius:9px;background:linear-gradient(145deg,#eee,#888);color:#090909;display:grid;place-items:center;font-weight:850;font-size:12px}
.operator-name{font-size:12px;font-weight:700}.operator-role{margin-top:2px;color:#646464;font:600 9px ui-monospace,monospace}
.online-dot{width:6px;height:6px;border-radius:50%;background:var(--green);margin-left:auto;box-shadow:0 0 14px rgba(103,228,128,.38)}
.main{grid-column:2;padding:0 26px 48px;min-width:0}
.topbar{
  position:sticky;top:0;z-index:30;height:var(--topbar);display:flex;align-items:center;gap:14px;
  border-bottom:1px solid var(--line-soft);
  background:linear-gradient(to bottom,rgba(7,7,7,.97),rgba(7,7,7,.82));backdrop-filter:blur(18px)
}
.breadcrumb{display:flex;align-items:center;gap:9px;font:650 11px ui-monospace,monospace;color:#666;letter-spacing:.06em;text-transform:uppercase}
.breadcrumb strong{color:#eee;font:650 13px Inter,system-ui,sans-serif;letter-spacing:0;text-transform:none}
.top-spacer{flex:1}
.system-state{display:flex;align-items:center;gap:7px;color:#a8a8a8;font:650 9px ui-monospace,monospace;text-transform:uppercase;letter-spacing:.08em}
.state-dot{width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 0 5px rgba(103,228,128,.05),0 0 14px rgba(103,228,128,.35)}
.clock{color:#656565;font:550 10px ui-monospace,monospace}
.lang-switch{display:flex;gap:2px;padding:3px;border:1px solid #222;background:#0d0d0d;border-radius:9px}
.lang-switch button{border:0;background:transparent;color:#555;padding:6px 7px;border-radius:6px;cursor:pointer;font:650 9px ui-monospace,monospace}
.lang-switch button.active{background:#1b1b1b;color:#eee}
.top-action{
  height:36px;padding:0 10px;border:1px solid #242424;border-radius:9px;background:#101010;color:#777;
  display:flex;align-items:center;gap:8px;cursor:pointer
}
.top-action:hover{color:#ddd;border-color:#333}
.top-action svg{width:15px;height:15px}
.mobile-nav{display:none}