:root {
/* defaults */
	--fw-x-light: 100;
	--fw-light: 200;
	--fw-lighter: 300;
	--fw-normal: 400;
	--fw-bolder: 600;
	--fw-semibold: 600;
	--fw-bold: 700;
	--fw-x-bold: 800;
	--fw-heavy: 900;
	--fw-x-black: 950;

	--fs-100: .5625em;
	--fs-200: .625em;
	--fs-300: .8125em;
	--fs-350: .9em;
	--fs-400: 1em;
	--fs-450: 1.1em;
	--fs-500: 1.125em;
	--fs-600: 1.5em;
	--fs-700: 2em;

	--fs-xx-small: var(--fs-100);
	--fs-x-small: var(--fs-200);
	--fs-small: var(--fs-300);
	--fs-smaller: var(--fs-350);
	--fs-medium: var(--fs-400);
	--fs-larger: var(--fs-450);
	--fs-large: var(--fs-500);
	--fs-x-large: var(--fs-600);
	--fs-xx-large: var(--fs-700);

	--ui-color: #d0d0bf;
	--ui-color-accent: #666;
	--ui-color-shade: #f0f0ef;

	--ui-border-radius: .25rem;
	--ui-border: 1px solid var(--ui-color);
	--ui-outline: 1px solid var(--ui-color-accent);
	--ui-outline-offset: 1px;

/* headers */
	--clr-100: #fff;
	--clr-150: #eee;
	--clr-200: #999;
	--clr-300: #666;
	--clr-400: #333;
	--clr-700: #000;

	--color-background: var(--clr-100);
	--color-background-accent: var(--ui-color-shade);
	--color-primary: var(--clr-400);
	--color-accent: var(--clr-700);

	/* items list */
	--color-items-background: var(--color-background);
	--color-items-primary: var(--color-primary);
	--color-items-accent: var(--color-accent);

	/* used in homepages list */
	--color-brand: hsl(196, 88%, 56%); /* #2dbdf2 */
	--color-brand-on: var(--clr-100);

	--color-brand-alt: hsl(196, 88%, 40%);
	--color-brand-alt-on: var(--clr-100);

	--color-brand-primary: hsl(60, 1%, 61%); /* #9d9d9c */
	--color-brand-accent: hsl(0, 0%, 33%); /* #545454 */

	--color-mobile-menu: hsla(0, 0%, 0%, .95);
	--color-mobile-text: var(--color-brand-on);

	--color-submenu-background: var(--color-brand-primary);
	--color-submenu-text: var(--color-brand-on);

	--color-localmenu-background: var(--ui-color-shade);

	--logo-brand: url('imgs/logo-name.png');
	--logo-brand-small: url('imgs/logo.png');

	--header-height: 3.75rem;
	--footer-height: 2rem;

	--min-vw: 320px;
	--max-vw: 1440px;

	--mosaic-min-width: 32ch;
}
/* content */
body[data-mode^="shaman"] div.breadcrumbs-container {
	min-height: 2lh;
	padding-block: .25rem;
	display: grid;
	grid-template-areas: 'breadcrumbs actions';
	grid-template-columns: 1fr auto;
	align-items: center;
	border-bottom: var(--ui-border);
}

body[data-mode^="shaman"] ul.breadcrumbs {
	grid-area: breadcrumbs;
	list-style-type: none;
	display: flex;
	flex-flow: row wrap;
	gap: .25rem 1rem;
	align-items: center;
}
body[data-mode^="shaman"] div.breadcrumbs_actions {
	grid-area: actions;
	justify-self: end;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	gap: .25rem;
	align-items: center;
	align-content: align-center;
	justify-content: flex-end;
}
body[data-mode^="shaman"] a.breadcrumbs {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  gap: 0 .25rem;
}

/* tree */
body[data-mode^="shaman"] div#tree li.breadcrumbs a {
  border-bottom: none;
}
body[data-mode^="shaman"] div#folder_tree_root_container ul.tree li.tree div.nodetree {
	gap: .25rem;
	height: 20px;
	line-height: 20px;
	margin-right: 16px;
	overflow: hidden;
	text-overflow: ellipsis;
}
body[data-mode^="shaman"] div.nodetree {
	white-space: nowrap;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
}
body[data-mode^="shaman"] div.nodetree a {
	display: flex;
}