.rbac-split-layout { display: flex; height: calc(100vh - 86px); max-height: calc(100vh - 86px); padding: 16px; gap: 16px; background: #f0f3f4; overflow: hidden; box-sizing: border-box; width: 100%; } .rbac-split-layout .left-sidebar { width: 280px; flex-shrink: 0; height: 100%; } .rbac-split-layout .right-panel { flex: 1; min-width: 0; height: 100%; border-radius: 12px; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06); overflow: hidden; display: flex; flex-direction: column; } .rbac-split-layout .section-card { background: var(--color-fill-1); border: 1px solid var(--color-border-2); border-radius: 8px; padding: 16px 20px; margin-bottom: 16px; } .rbac-split-layout .section-card-title { font-size: 14px; font-weight: 600; color: var(--color-text-1); margin: 0 0 12px; } .rbac-split-layout .sticky-toolbar { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; margin: -4px 0 16px; background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(8px); border: 1px solid var(--color-border-2); border-radius: 8px; flex-wrap: wrap; } .rbac-split-layout .avatar-circle { width: 48px; height: 48px; border-radius: 50%; background: linear-gradient(135deg, var(--app-primary-color, #2d8c8c) 0%, #3aa8a8 100%); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 600; } .rbac-split-layout .icon-badge-circle { width: 48px; height: 48px; border-radius: 12px; background: rgba(var(--primary-6), 0.1); color: var(--app-primary-color, #2d8c8c); display: flex; align-items: center; justify-content: center; font-size: 24px; }