*
{
	margin	:	0;
	padding	:	0;

	box-sizing	:	border-box;
	
}

body
{
	
	display			:	flex;
	flex-direction	:	column;

	height	:	100vh;

	font-family	:	sans-serif;	
}

header
{
	display			:	flex;
	align-items		:	center;
	justify-content	:	space-between;
	
	padding	:	1rem;

	border-bottom	:	1px solid #ccc;
}

.layout
{
	display					:	grid;
	grid-template-columns	:	minmax( 12rem, max-content ) 1fr;
	min-height				:	0;

	flex	:	1;	
}

.sidebar
{	
	padding		:	1rem;

	white-space	:	nowrap;

	border-right	:	1px solid #ccc;
}
.sidebar ul 
{
	list-style	:	none;
}

.sidebar li 
{
	display			:	flex;
	align-items		:	center;	
}
.sidebar li > a
{
	margin-right	: 1rem;

	overflow		:	hidden;
	text-overflow	:	ellipsis;
}
.sidebar li > span
{
	display	: flex;	
	gap		: 0.25rem;

	margin-left	: auto;
}

.sidebar a 
{
	padding			:	0.5rem;

	text-decoration	:	none;
	color			:	inherit;
}	


.permissions,
.builder,
.response 
{
	border	:	1px solid #ccc;
	padding	:	10px;
}

.permissions
{
	font-family	:	monospace;
}
.permissions dl
{
	display					:	grid;
	grid-template-columns	:	auto auto;
}
.permissions dd
{
	font-weight	: bold;
}