/* 前台侧边栏：浅色简洁风（与内容区同一套配色，放在 web.css 之后加载） */
.side{background:#fff;border-right:1px solid var(--line);color:#4b5563;overflow:hidden}
.side::before{content:"";position:absolute;inset:0;pointer-events:none;
    background:radial-gradient(circle at 0 0,rgba(79,70,229,.07) 0%,transparent 55%)}
.side>*{position:relative;z-index:1}

/* 品牌区：高度与右侧顶栏（搜索框那一行）对齐 */
.brand{height:66px;padding:0 20px;gap:12px;border-bottom:none}
.brand .brand-logo{width:36px;height:36px;border-radius:10px;object-fit:cover;flex-shrink:0}
.brand .brand-logo-ph{display:flex;align-items:center;justify-content:center;color:#fff;
    background:linear-gradient(135deg,#6366f1 0%,#4f46e5 100%);box-shadow:0 4px 12px rgba(79,70,229,.28)}
.brand .brand-logo-ph svg{width:19px;height:19px}
.brand .brand-text{display:flex;flex-direction:column;min-width:0}
.brand .brand-name{color:#111827;font-size:16px;font-weight:700;line-height:1.25}
.brand .brand-sub{margin-top:1px;font-size:10px;letter-spacing:.24em;color:#a3a9b8}

/* 菜单 */
.menu{padding:4px 12px 24px}
.menu::-webkit-scrollbar{width:6px}
.menu::-webkit-scrollbar-thumb{background:rgba(15,23,42,.12);border-radius:3px}
.menu-title{display:flex;align-items:center;gap:10px;padding:16px 10px 8px;font-size:11px;letter-spacing:.16em;color:#a3a9b8}
.menu-title::after{content:"";flex:1;height:1px;background:var(--line)}

.menu a{position:relative;display:flex;align-items:center;gap:10px;height:38px;padding:0 10px;margin-bottom:2px;border-radius:10px;color:#4b5563;
    transition:background .2s,color .2s}
.menu a:hover{background:#f3f4f8;color:#111827;transform:none}
.menu a.active{color:var(--pri);font-weight:600;background:var(--pri-soft)}
.menu a.active::before{content:"";position:absolute;left:-12px;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;
    background:linear-gradient(180deg,#818cf8,#4f46e5)}

.menu .mi{width:26px;height:26px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
    background:transparent;color:#9ca3af;transition:background .2s,color .2s}
.menu a:hover .mi{color:#6b7280}
.menu a.active .mi{background:#fff;color:var(--pri);box-shadow:0 1px 3px rgba(79,70,229,.18)}
.menu .mi svg{width:17px;height:17px}
.menu .mi img{width:20px;height:20px;border-radius:6px;object-fit:cover}
.menu .mt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.menu .mc{font-size:11px;line-height:1;color:#9ca3af;background:#f3f4f8;border-radius:8px;padding:3px 7px}
.menu a.active .mc{color:var(--pri);background:#fff}

/* 顶栏里的搜索图标 / 用户菜单图标 */
.search .si{display:flex;opacity:.5}
.search .si svg{width:16px;height:16px}
.user-pop a{display:flex;align-items:center;gap:10px}
.user-pop a svg{width:16px;height:16px;color:#8b93a7;flex-shrink:0}

@media (max-width:860px){
    .side{box-shadow:none}
    body.side-open .side{box-shadow:0 0 40px rgba(15,23,42,.18)}
}