:root{
  --bg:#f6f8fb;--surface:#fff;--text:#0f172a;--muted:#6b7280;--primary:#0b5b96;--border:#e5e7eb;--sidebar:#0f172a;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:"Cairo",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial}
.layout{display:grid;grid-template-columns:280px 1fr;min-height:100vh}
.layout.collapsed{grid-template-columns:72px 1fr}

/* Sidebar */
aside{background:var(--sidebar);color:#fff;padding:20px 16px;position:sticky;top:0;height:100vh;overflow-y:auto}
.layout.collapsed aside{padding:20px 8px}
.layout.collapsed .brand h1,
.layout.collapsed .user,
.layout.collapsed .section .title{display:none}
.brand{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.brand img{width:44px;height:44px;object-fit:contain}
.brand h1{font-size:18px;margin:0;font-weight:700}
.user{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:10px 12px;margin-bottom:14px}
.user small{color:#9aa4b2;display:block}
nav .section{margin-top:10px;border-top:1px dashed rgba(255,255,255,.12);padding-top:10px}
.section .title{font-weight:700;font-size:14px;color:#e5e7eb;margin:8px 0}
.submenu a{display:flex;align-items:center;gap:10px;color:#cdd5df;text-decoration:none;padding:8px 10px;border-radius:8px;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.submenu a:hover{background:rgba(255,255,255,.08);color:#fff}