/* GATE
   The private preview's door: a page of its own, read before the theme's
   bundle, on the tokens alone. */

*,*::before,*::after {
	box-sizing:border-box;
}

body,h1,p,figure {
	margin:0;
}

.nc-gate {
	min-height:100vh;
	min-height:100svh;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:32px 24px;
	background:var(--nc-floor);
	color:var(--nc-ink);
	font-family:var(--nc-font-sans);
	font-weight:400;
	-webkit-font-smoothing:antialiased;
}

.nc-gate__panel {
	width:100%;
	max-width:392px;
}

.nc-gate__mark {
	display:block;
	width:168px;
	height:auto;
	margin-bottom:44px;
}

.nc-gate__kicker {
	font-family:var(--nc-font-mono);
	font-size:var(--nc-mono-kicker);
	letter-spacing:var(--nc-mono-kicker-tracking);
	text-transform:uppercase;
	color:var(--nc-si-open);
	margin-bottom:14px;
}

.nc-gate__title {
	font-size:clamp(25px,3.3vw,32px);
	font-weight:var(--nc-weight-display);
	line-height:var(--nc-leading-heading);
	letter-spacing:var(--nc-tracking-heading);
	margin-bottom:12px;
}

.nc-gate__lede {
	font-size:var(--nc-text-body);
	line-height:var(--nc-leading-body);
	color:var(--nc-si-open);
	max-width:34ch;
}

.nc-gate__form {
	margin-top:38px;
}

.nc-gate__label {
	display:block;
	font-family:var(--nc-font-mono);
	font-size:var(--nc-mono-readout);
	letter-spacing:var(--nc-mono-readout-tracking);
	text-transform:uppercase;
	color:var(--nc-si-open);
	margin-bottom:9px;
}

.nc-gate__row {
	display:flex;
	align-items:stretch;
	gap:10px;
}

.nc-gate__input {
	flex:1 1 auto;
	min-width:0;
	appearance:none;
	background:transparent;
	border:0;
	border-bottom:1px solid var(--nc-rule-plate);
	border-radius:0;
	padding:11px 2px;
	color:var(--nc-ink);
	font-family:var(--nc-font-mono);
	font-size:14px;
	letter-spacing:.1em;
	transition:border-color .2s linear;
}

.nc-gate__input:focus {
	outline:none;
	border-bottom-color:var(--nc-ink);
}

.nc-gate__input[aria-invalid="true"] {
	border-bottom-color:var(--nc-tile);
}

.nc-gate__submit {
	--nc-btn-fill:var(--nc-material);
	position:relative;
	isolation:isolate;
	overflow:hidden;
	flex:0 0 auto;
	appearance:none;
	cursor:pointer;
	border:1px solid var(--nc-ink);
	border-radius:0;
	background:var(--nc-ink);
	color:var(--nc-ground-open-start);
	font-family:var(--nc-font-mono);
	font-size:10.5px;
	letter-spacing:var(--nc-mono-kicker-tracking);
	text-transform:uppercase;
	padding:13px 22px;
	transition:color 0s linear .17s,border-color .32s linear;
}

.nc-gate__submit::before {
	content:'';
	position:absolute;
	inset:0;
	z-index:-1;
	background:var(--nc-btn-fill);
	transform:scaleY(0);
	transform-origin:50% 100%;
	transition:transform .34s cubic-bezier(.2,.6,.2,1);
}

.nc-gate__submit:hover,.nc-gate__submit:focus-visible {
	color:var(--nc-ink);
}

.nc-gate__submit:hover::before,.nc-gate__submit:focus-visible::before {
	transform:scaleY(1);
}

.nc-gate__submit:active {
	scale:.96;
}

.nc-gate__error {
	margin-top:12px;
	font-family:var(--nc-font-mono);
	font-size:10px;
	letter-spacing:var(--nc-mono-row-tracking);
	text-transform:uppercase;
	color:var(--nc-tile);
}

@media (prefers-reduced-motion:reduce) {
	.nc-gate__submit,.nc-gate__submit::before,.nc-gate__input {
		transition-duration:.01ms;
	}
	.nc-gate__submit:active {
		scale:1;
	}
}

@media (max-width:480px) {
	.nc-gate__row {
		flex-direction:column;
		align-items:stretch;
		gap:18px;
	}
	.nc-gate__submit {
		width:100%;
	}
}