/* Хажуу цэс: PC дээр icon rail, татахад/hover зурагтай самбар болно; утсанд burger эсвэл зүүн ирмэгээс шудрана. --p = 0 хаалттай → 1 нээлттэй */
.sd{--w:320px;--rail:76px;--p:0;position:fixed;z-index:70;left:12px;top:calc(10px + var(--st));bottom:calc(10px + var(--sb));width:calc(var(--w) + 24px);pointer-events:none}
.sd.open{--p:1}
.sd-in{pointer-events:auto;position:relative;width:var(--w);height:100%;display:flex;flex-direction:column;background:linear-gradient(180deg,#191B1E,#0E1013);box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 rgba(255,255,255,.12);border-radius:24px;overflow:hidden;
  clip-path:inset(0 calc((1 - var(--p)) * (var(--w) - var(--rail))) 0 0 round 24px);transition:clip-path .42s var(--ease);will-change:clip-path;view-transition-name:sidenav}
.sd.drag .sd-in,.sd.drag .sd-grip,.sd.drag~.sd-scrim{transition:none}
.sd [hidden]{display:none!important}
.sd-head{flex:none;display:flex;align-items:center;gap:12px;height:72px;padding:0 12px;width:var(--w)}
.sd-btn{flex:none;position:relative;width:52px;height:52px;display:grid;place-items:center;border:0;border-radius:18px;background:rgba(255,255,255,.07);color:var(--text);cursor:pointer;transition:background .2s}
.sd-btn:hover{background:rgba(255,255,255,.14)}
.sd-btn .ms{grid-area:1/1;transition:opacity .25s,transform .35s var(--ease)}
.sd-btn .ms+.ms{opacity:0;transform:rotate(-90deg)}
.sd.open .sd-btn .ms{opacity:0;transform:rotate(90deg)}.sd.open .sd-btn .ms+.ms{opacity:1;transform:none}
.sd-title{font:800 15px/1.2 var(--fd);letter-spacing:-.01em;white-space:nowrap}
.sd-title small{display:block;font:500 12px/1.3 var(--fb);color:var(--muted);letter-spacing:0}
.ms{width:24px;height:24px;fill:currentColor;flex:none}
.sd-scroll{flex:1;min-height:0;overflow:hidden auto;overscroll-behavior:contain;scrollbar-width:none;padding:0 0 12px;display:flex;flex-direction:column;gap:4px;touch-action:pan-y}
.sd-scroll::-webkit-scrollbar{display:none}
.sd-a{position:relative;flex:none;display:flex;align-items:center;gap:14px;height:60px;margin-inline:8px;padding-inline:4px;border-radius:18px;color:var(--muted);overflow:hidden;isolation:isolate;-webkit-tap-highlight-color:transparent;transition:color .2s,background .25s}
.sd-ic{flex:none;position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:16px;transition:background .25s,color .25s,transform .35s var(--spring)}
.sd-ic .ms{grid-area:1/1;transition:opacity .2s}
.sd-ic .ms+.ms{opacity:0}
.sd-t{min-width:0;white-space:nowrap;line-height:1.25;z-index:1}
.sd-t b{display:block;font:700 15px/1.25 var(--fb);color:var(--text);text-shadow:0 1px 6px rgba(8,10,13,.8)}
.sd-t small{display:block;font-size:12px;font-weight:500;color:var(--muted);text-shadow:0 1px 6px rgba(8,10,13,.9)}
.sd-im{position:absolute;z-index:-1;right:0;top:0;width:190px;height:100%;object-fit:cover;opacity:.5;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 70%);mask-image:linear-gradient(90deg,transparent,#000 70%);transition:opacity .3s,transform .6s var(--ease)}
@media (hover:hover){.sd-a:hover{background:rgba(255,255,255,calc(.06 * var(--p)));color:var(--text)}.sd-a:hover .sd-im{opacity:.95;transform:scale(1.06)}.sd-a:hover .sd-ic{transform:scale(1.06);background:rgba(255,255,255,.08)}.sd-a:hover .ms+.ms{opacity:1}.sd-a:hover .sd-ic .ms:first-child{opacity:0}}
.sd-a:active .sd-ic{transform:scale(.92)}
.sd-a:focus-visible,.sd-btn:focus-visible{outline:2px solid var(--lime);outline-offset:-2px}
.sd-a[aria-current]{background:rgba(255,255,255,calc(.08 * var(--p)))}
.sd-a[aria-current] .sd-ic{background:var(--lime);color:#17191C;box-shadow:0 8px 22px -8px var(--lime)}
.sd-a[aria-current] .sd-ic .ms:first-child{opacity:0}.sd-a[aria-current] .sd-ic .ms+.ms{opacity:1}
.sd-a[aria-current] .sd-im{opacity:.85}
.sd-sub{flex:none;height:1px;margin:6px 20px;background:var(--line)}
.sd-a.sm{height:50px}.sd-a.sm .sd-ic{height:44px}.sd-a.sm .sd-t b{font-size:14px;font-weight:600}
.sd-end{flex:none;padding:10px 0 10px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:4px}
.sd-a.sd-cta .sd-ic{background:var(--lime);color:#17191C}.sd-a.sd-cta{color:var(--text)}
.sd-promo{position:relative;flex:none;display:block;height:104px;margin:6px 12px 4px;border-radius:18px;overflow:hidden;opacity:var(--p);transition:opacity .3s;width:calc(var(--w) - 24px)}
.sd-promo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.sd-promo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,16,19,.92) 25%,rgba(14,16,19,.1))}
.sd-promo span{position:absolute;z-index:1;left:16px;top:50%;transform:translateY(-50%);max-width:180px}
.sd-promo b{display:block;font:800 16px/1.2 var(--fd)}
.sd-promo i{display:inline-flex;align-items:center;gap:2px;margin-top:6px;font:700 13px/1 var(--fb);color:var(--lime)}
.sd-promo i .ms{width:18px;height:18px}
@media (hover:hover){.sd-promo:hover img{transform:scale(1.06)}}
@media (max-height:960px),(max-width:899px){.sd-promo{display:none}}
/* Татах бариул */
.sd-grip{pointer-events:auto;position:absolute;z-index:2;left:0;top:50%;width:24px;height:96px;margin-top:-48px;padding:0;border:0;background:none;cursor:grab;touch-action:none;
  transform:translateX(calc(var(--rail) + var(--p) * (var(--w) - var(--rail))));transition:transform .42s var(--ease)}
.sd-grip::after{content:"";position:absolute;left:6px;top:50%;width:5px;height:44px;margin-top:-22px;border-radius:9px;background:rgba(255,255,255,.28);transition:background .2s,height .25s var(--spring),margin .25s var(--spring)}
.sd-grip:hover::after,.sd.drag .sd-grip::after{background:var(--lime);height:60px;margin-top:-30px}
.sd.drag .sd-grip{cursor:grabbing}
.sd-scrim{position:fixed;inset:0;z-index:68;background:rgba(5,7,10,.6);opacity:0;pointer-events:none;transition:opacity .3s}
.sd.pin~.sd-scrim{opacity:var(--p);pointer-events:auto}
.sd.drag~.sd-scrim{opacity:var(--p)}
html.sd-lock,html.sd-lock body{overflow:hidden}
.sd-burger{display:none}
@media (min-width:900px){
  body{padding-left:88px}
}
@media (max-width:899px){
  .sd{--rail:0px;--w:min(340px,100vw - 44px);left:8px;top:calc(8px + var(--st));bottom:calc(8px + var(--sb))}
  .sd-in{clip-path:none;transform:translateX(calc((var(--p) - 1) * (100% + 16px)));transition:transform .42s var(--ease);will-change:transform}
  .sd.drag .sd-in{transition:none}
  .sd:not(.open):not(.drag) .sd-in{visibility:hidden;transition:transform .42s var(--ease),visibility 0s .42s}
  .sd-grip{left:-8px}
  .sd-burger{flex:none;display:grid;place-items:center;width:42px;height:42px;margin-left:-6px;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:var(--text);cursor:pointer}
  .topbar-in{gap:10px}
  .topbar-act .btn-ghost{display:none}
}
.calm .sd-in,.calm .sd-grip,.calm .sd-im{transition-duration:.01s}
@media print{.sd,.sd-scrim{display:none}}
.footer-bottom .cr{display:block;margin-top:4px;font-size:11px;opacity:.55}
/* Серверийн удирдлагын хуудсууд: Dashboard цэс (layout.php $app) */
.sd-grp{flex:none;margin:14px 22px 4px;font:750 10.5px/1 Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#5F6268;white-space:nowrap;opacity:var(--p,1)}
.sd-grp:first-child{margin-top:4px}
.sd-appnav .sd-a[aria-current] .sd-ic .ms:first-child{opacity:1}
.sd-a[hidden],.sd-grp[hidden]{display:none!important}
