@import url("./type-scale.css");
@import url("./typography.css");
@import url("./palette/default.css");
@import url("./color-theme.css");
@import url("./layouts/centered.css");
@import url("./layouts/grid.css");
@import url("./containers/card.css");
@import url("./containers/media.css");
@import url("./components/bluesky-post.css");

* {
	box-sizing: border-box;
}
html,
body {
	height: 100%;
	font-size: var(--step-0);
}

img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

body {
	font-family: var(--base-font-family);
	font-weight: normal;
	font-weight: normal;
	font-size: var(--step-0);
	line-height: 1.6;
	font-weight: 300;

	background-color: var(--color-background);
	color: var(--color-text-normal);
	padding: 0;
}
h1,
h2,
h3 {
	line-height: 1.1;
	font-family: var(--headline-font-family);
	font-weight: normal;
}

h1 {
	font-size: var(--step-3);
	font-weight: 100;
}

h2 {
	font-size: var(--step-2);
	font-weight: 100;
}

h3 {
	font-size: var(--step-1);
	font-weight: 200;
}

main {
	margin: auto;
	max-width: 82ch;
	padding-inline: 1em;
}

svg {
	height: 60vmin;
}

a {
	color: currentColor;
	text-decoration: unterline;
	text-underline-offset: 4px;
	text-decoration-thickness: 1px;
}
.h-card {
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
}
.h-card img {
	width: 2em;
	height: 2em;
	border-radius: 2em;
}
.linklist {
	font-size: var(--step--1);
	display: flex;
	flex-wrap: wrap;
	width: fit-content;
	gap: 1em;
}