/* Единое левое меню: рабочие экраны и админ-панель */
.side{background:#1C2026;color:#C9CED6;display:flex;flex-direction:column;padding:22px 12px 16px;position:sticky;top:0;height:100vh;overflow-y:auto;
  width:232px;flex:none;box-sizing:border-box;font-family:"Manrope",system-ui,sans-serif;font-size:14px;line-height:1.4;scrollbar-width:thin;scrollbar-color:#3A4049 transparent}
.side .brand{display:block;text-decoration:none;color:#fff;padding:2px 10px 18px}
.side .brand b{display:block;font:700 19px/1 "Unbounded",sans-serif;letter-spacing:-.01em;color:#fff}
.side .brand b span{color:#D7262E}
.side .brand small{display:block;margin-top:8px;font-size:12px;color:#8C939E}
.side .nav{display:flex;flex-direction:column;gap:14px}
.side .nav-group{display:flex;flex-direction:column;gap:1px}
.side .nav-title{padding:0 12px 4px;font-size:12px;font-weight:600;color:#6F7782}
.side .nav a{display:flex;align-items:center;gap:11px;padding:8px 12px;border-radius:9px;color:#C9CED6;text-decoration:none;font-weight:500}
.side .nav a svg{width:19px;height:19px;flex:none;opacity:.75}
.side .nav a:hover{background:#2A2F37;color:#fff}
.side .nav a.on{background:#fff;color:#1C2026}
.side .nav a.on svg{opacity:1;color:#D7262E}
.side .nav a:focus-visible{outline:2px solid #D7262E;outline-offset:1px}
.side .me{margin-top:auto;padding:14px 12px 0;border-top:1px solid #2F343C;font-size:13px}
.side .me b{display:block;color:#fff;font-weight:600;margin-top:10px}
.side .me form{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px}
.side .me a,.side .me button{padding:0;background:none;color:#8C939E;font:inherit;cursor:pointer;border:0;text-decoration:none}
.side .me a:hover,.side .me button:hover{color:#fff;background:none}
.mbar,.tabbar,.side-shade,.side-close{display:none}
@media (max-width:900px){
  html{background:#ECEEF1}
  .shell{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  /* верхняя полоска: логотип, где я, кнопка меню */
  .mbar{display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:30;background:#1C2026;color:#fff;padding:10px 8px 10px 14px;padding-top:max(10px,env(safe-area-inset-top))}
  .brand-m{text-decoration:none;flex:none}.brand-m b{font:700 15px/1 "Unbounded",sans-serif;color:#fff;letter-spacing:-.01em}.brand-m b span{color:#D7262E}
  .mbar-page{flex:1;min-width:0;font:600 13px "Manrope",sans-serif;color:#8C939E;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mbar-btn{width:44px;height:40px;display:grid;place-items:center;padding:0;background:none;border:0;color:#fff;border-radius:10px;cursor:pointer}
  .mbar-btn:hover,.mbar-btn:active{background:#2A2F37}
  .mbar-btn svg{width:24px;height:24px}
  /* меню целиком — выезжает слева */
  .side{position:fixed;top:0;left:0;bottom:0;height:auto;width:min(300px,86vw);z-index:50;transform:translateX(-105%);transition:transform .22s ease;box-shadow:none;padding-top:max(22px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom))}
  html.side-open .side{transform:none;box-shadow:12px 0 40px rgba(0,0,0,.35)}
  .side-shade{display:block;position:fixed;inset:0;z-index:40;background:rgba(15,18,22,.5);opacity:0;pointer-events:none;transition:opacity .2s}
  html.side-open .side-shade{opacity:1;pointer-events:auto}
  html.side-open body{overflow:hidden}
  .side-close{display:grid;place-items:center;position:absolute;top:max(14px,env(safe-area-inset-top));right:10px;width:40px;height:40px;padding:0;background:none;border:0;color:#8C939E;font-size:18px;border-radius:10px}
  .side-close:hover{background:#2A2F37;color:#fff}
  .side .nav a{padding:11px 12px;font-size:15px}
  /* нижняя панель — главные разделы под большим пальцем */
  .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:1px solid #DDE1E6;padding:4px 4px max(4px,env(safe-area-inset-bottom))}
  .tabbar a,.tabbar button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;background:none;border:0;border-radius:10px;color:#6F7782;text-decoration:none;font:600 11px/1.2 "Manrope",sans-serif;cursor:pointer;min-width:0}
  .tabbar svg{width:23px;height:23px}
  .tabbar span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .tabbar .on{color:#D7262E}
  .shell>.main{padding:16px 14px 90px}
}
@media (prefers-reduced-motion:reduce){.side,.side-shade{transition:none}}
