* {
	box-sizing:border-box
}
html {
	color-scheme:light;
	min-height:100%;
	background:var(--page-bg,var(--bg,#f2f5f8))
}
body {
	margin:0;
	font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
	color:var(--ink,#142c44);
	line-height:1.6;
	-webkit-text-size-adjust:100%
}
a {
	color:inherit
}
button,a {
	-webkit-tap-highlight-color:transparent
}
a:focus-visible,[tabindex]:focus-visible {
	outline:3px solid currentColor;
	outline-offset:5px
}
.skip {
	position:absolute;
	left:16px;
	top:-120px;
	padding:12px;
	background:#fff;
	color:#142c44;
	z-index:2
}
.skip:focus {
	top:12px
}
.bio {
	max-width:512px;
	margin:auto;
	padding:48px 22px 28px;
	padding-bottom:max(28px,env(safe-area-inset-bottom));
	min-height:100svh
}
.profile {
	text-align:center;
	margin-bottom:30px
}
.avatar {
	display:block;
	width:112px;
	height:112px;
	object-fit:contain;
	border-radius:28px;
	margin:0 auto 22px;
	background:#fff;
	box-shadow:0 8px 28px #0000000c
}
.monogram {
	display:grid;
	place-items:center;
	font-size:52px;
	font-weight:800;
	background:var(--button);
	color:var(--button-ink)
}
.eyebrow {
	font-size:10px;
	font-weight:750;
	letter-spacing:.18em;
	margin:0 0 12px
}
h1 {
	font-size:clamp(20px,5.2vw,24px);
	line-height:1.22;
	letter-spacing:-.035em;
	margin:0 auto 14px;
	max-width:440px;
	overflow-wrap:anywhere
}
.description {
	font-size:15px;
	max-width:350px;
	margin:0 auto;
	white-space:pre-line;
	overflow-wrap:anywhere
}
.links {
	display:grid;
	gap:13px
}
.bio-link {
	display:flex;
	align-items:center;
	gap:13px;
	padding:17px 19px;
	min-height:60px;
	border-radius:var(--button-radius,14px);
	background:var(--button);
	color:var(--button-ink);
	text-decoration:none;
	font-weight:650;
	font-size:15px;
	box-shadow:0 4px 10px #00000009
}
.bio-link svg {
	flex-shrink:0
}
.bio-link>span:first-of-type {
	flex:1;
	overflow-wrap:anywhere
}
.arrow {
	font-size:20px;
	font-weight:400;
	flex-shrink:0
}
.bio-link:focus-visible {
	outline:3px solid #fff;
	box-shadow:0 0 0 6px #000
}
.socials {
	display:flex;
	justify-content:center;
	gap:4px;
	flex-wrap:wrap;
	margin:26px 0 0
}
.socials a {
	width:44px;
	height:44px;
	display:grid;
	place-items:center;
	border:0;
	border-radius:8px;
	text-decoration:none
}
footer {
	text-align:center;
	margin-top:42px;
	font-size:11px
}
footer a {
	display:block;
	font-size:13px;
	font-weight:800;
	letter-spacing:.095em;
	text-decoration:none;
	margin-bottom:5px
}
footer span {
	display:block
}
.preview {
	padding:14px;
	border:2px dashed currentColor;
	margin-bottom:24px;
	font-size:13px
}
.empty {
	text-align:center;
	font-size:14px;
	border:1px dashed currentColor;
	padding:20px;
	border-radius:14px
}
@media(hover:hover) {
	.bio-link:hover {
		transform:translateY(-2px)
	}
	.socials a:hover {
		outline:1px solid currentColor;
		outline-offset:2px
	}

}
@media(prefers-reduced-motion:no-preference) {
	.bio-link {
		transition:transform .16s ease
	}

}
@media(max-width:350px) {
	.bio {
		padding:30px 16px
	}
	.bio-link {
		padding:15px 14px
	}

}
@media(forced-colors:active) {
	.bio-link,.avatar {
		border:1px solid CanvasText
	}

}
.socials svg {
	width:28px;
	height:28px
}
.text-plate .profile,.text-plate .socials,.text-plate footer,.text-plate .preview,.text-plate .empty {
	background:#fff;
	border-radius:20px;
	padding:20px
}
.text-plate .socials {
	padding:10px
}
.text-plate footer {
	padding:14px
}