@view-transition{
	navigation:auto
}
:root{
	color-scheme:dark;
	accent-color:var(--wp--preset--color--primary);
	interpolate-size:allow-keywords;
	overflow:hidden scroll;
	&:has(dialog[open]:modal){
		overflow:hidden;
		scrollbar-gutter:stable;
	}
}
form[role='form']{
	& input:is([type='url'],[type='email'],[type='tel'],[type='datetime-local'],[type='datetime'],[type='date'],[type='week'],[type='month'],[type='number'],[type='password'],[type='text'],[type='file'],[list]),select,textarea{
	z-index:1;
	width:100%;
	height:fit-content;
	margin:1rem 0 0;
	padding:.575em .875em;
	border-radius:.425rem;
	color:inherit;
	&[readonly]{
			background:0;
			border-style:dashed;
			&:not([oncopy]){
			pointer-events:none;
		}
	}
	+label[for]{
			z-index:1;
			position:absolute;
			top:1.15em;
			left:.6em;
			background:0;
			border:.35em solid transparent;
			pointer-events:none;
			+button[for]{
			position:absolute;
			top:.125rem;
			right:.25rem;
			border-radius:.25rem;
		}
	}
	&:is(:focus,:not(:placeholder-shown),:not(:placeholder-shown):hover)+label[for]{
		transform:scale(.8) translateY(-1.8em);
		background:var(--wp--preset--color--primary);
		border:.125em solid var(--wp--preset--color--white);
		border-radius:.5rem;
		padding:.325rem 1rem;
	}
	&::placeholder{
		color:currentColor;
		opacity:0
	}
	}
	& select{
		-webkit-appearance:listbox;
		appearance:listbox;
	&[multiple]{
		height:6rem;
	}
	& option{
		white-space:normal;
		outline-color:inherit;
	}
	}
	& input[oncopy]{
		cursor:copy
	}
	& input[type='file']:not([readonly]){
		border-width:.125rem;
		border-style:dashed;
	&:hover{
		border-width:.125rem;
		border-style:dashed;
	}
	&:focus{
		border-width:.125rem;
		border-style:dashed;
	}
	}
	& [role='upload']{
		& span{
			position:absolute;
			right:1rem;
			bottom:1rem;
			z-index:1;
			pointer-events:none;
		}
		& label{
			position:absolute;
			left:1rem;
			bottom:1rem;
			z-index:1;
			pointer-events:none;
		}
	}
	& div{
		position:relative;
		margin:.75em auto auto;
	}
}
dialog{
	background:var(--wp--preset--color--accent);
	border:0;
	border-radius:.425rem;
	box-shadow:none;
	transform:translateY(-1.5rem);
	&::backdrop{
		background:var(--wp--preset--color--accent)25;
		backdrop-filter:blur(.15rem);
		pointer-events:none;
	}
	&[popover]{
		color:var(--wp--preset--color--white);
		background:light-dark(#e8382e, #d33434);
	}
	&[role=alertdialog]{
		color:var(--wp--preset--color--white);
		background:light-dark(#e8382e, #d33434);
	}
	&[role=alertdialog]::backdrop{
		background:light-dark(#e8382e50, #d3343450);
		backdrop-filter:blur(.5rem);
	}
	&[aria-live=polite]::backdrop{
		background:0;
		backdrop-filter:none;
	}
	&,&::backdrop{
		opacity:0;
	}
	&[open],&:popover-open{
		opacity:1;
		transform:translateY(0);
		@starting-style{
			opacity:0;
			transform:translateY(1.5rem);
		}
	}
	&[open]::backdrop{
		opacity:1;
		@starting-style{
			opacity:0;
		}
	}
}
[hidden],noscript>img,datalist{
	content:'';
	display:none
}
img[aria-hidden='true']{
	width:0;
	height:0
}
[aria-hidden='false'][hidden]{
	display:initial
}
[aria-hidden='false'][hidden]:not(:focus),form[role='form'] div[aria-hidden='true']{
	position:absolute;
	opacity:0
}
[aria-busy='true']{
	cursor:progress
}
[aria-disabled='true'],:disabled{
	-webkit-appearance:none;
	appearance:none;
	cursor:default;
	background-color:revert;
	border-color:transparent;
	opacity:.75;
	filter:saturate(.25) contrast(.75)
}
button[name='top']{
	z-index:15;
	position:fixed;
	top:unset;
	left:unset;
	bottom:1.875rem;
	right:1.875rem;
	width:3.125rem;
	height:3.125rem;
	pointer-events:none;
	opacity:0;
	transform:translateY(6.25rem)
}
:is(button[name='top'],button[name='top']:is(:focus,:hover,:active,:hover:active)):not(:disabled,[tabindex='0']){
	padding:0;
	margin:0;
	border:0
}
button[name='top'].min{
	pointer-events:auto;
	opacity:1;
	transform:translateY(0)
}
button[name='top'] svg{
	fill:none;
	transform:rotate(-90deg)
}
button[name='top'] circle:first-of-type{
	stroke:currentColor;
	opacity:.5;
	stroke-width:.125rem
}
button[name='top'] circle:last-of-type{
	stroke:currentColor;
	stroke-width:.125rem
}
button[name='top'] path{
	fill:currentColor
}
@media(max-width:62rem){
	button[name='top']{
		bottom:2rem;
		right:2rem;
		width:2.5rem;
		height:2.5rem
	}
}
@media screen and (any-hover:none){
	html{
		-webkit-tap-highlight-color:transparent
	}
	:is(a[href],area[href],details,summary,input,select,textarea,[role='button'],button):not(:disabled,[type='hidden']),[contenteditable]{
		touch-action:manipulation
	}
}
@media not (prefers-reduced-motion:reduce){
	html{
		scroll-behavior:smooth
	}
	header,a[href],a[href] svg,textarea,select,progress,meter,input,button,ul,ol,li,details,summary,::marker,form:not(:empty){
		-webkit-transition:all .75s ease;
		transition:all .75s ease
	}
	label[for]{
		-webkit-transition:all .25s ease-in;
		transition:all .25s ease-in
	}
	:is(p:not([class]) a[href]){
		-webkit-transition:all .25s ease-out;
		transition:all .25s ease-out
	}
	::details-content{
		transition-property:block-size,content-visibility;
		transition-duration:.3s;
		transition-behavior:allow-discrete
	}
	dialog,::backdrop{
		transition:display,overlay,opacity,transform;
		transition-duration:1s;
		transition-behavior:allow-discrete
	}
	@keyframes slide-in-up{
		0%{transform:translateY(100%)}
		100%{transform:translateY(0)}
	}
	@keyframes slide-in-down{
		0%{transform:translateY(0)}
		100%{transform:translateY(100%)}
	}
	@keyframes fade-out{
		0%{opacity:1}
		100%{opacity:0}
	}
	@keyframes fade-in{
		0%{opacity:0}
		100%{opacity:1}
	}
}