.auth-screen.svelte-1i2smtp {
		display: grid;
		min-height: calc(100svh - 36px);
		align-content: center;
		gap: 10px;
		padding-block: clamp(10px, 3dvh, 24px);
	}

	@supports (height: 100dvh) {
		.auth-screen.svelte-1i2smtp {
			min-height: calc(100dvh - 36px);
		}
	}

	.cat-badge.svelte-1i2smtp {
		position: relative;
		z-index: 1;
		display: grid;
		width: 76px;
		height: 76px;
		justify-self: center;
		place-items: center;
		border: 1px solid color-mix(in srgb, var(--color-line) 86%, transparent);
		border-radius: 30px;
		background:
			radial-gradient(
				circle at 38% 26%,
				color-mix(in srgb, var(--color-peach-soft) 68%, transparent),
				transparent 56%
			),
			var(--color-paper-2);
		box-shadow: var(--shadow-card);
	}

	.cat-badge.svelte-1i2smtp img:where(.svelte-1i2smtp) {
		width: 62px;
		height: 62px;
		object-fit: contain;
		filter: drop-shadow(0 2px 6px color-mix(in srgb, var(--color-charcoal) 16%, transparent));
	}

	.auth-card.svelte-1i2smtp {
		display: grid;
		gap: 12px;
		border: 1px solid var(--color-line);
		border-radius: 34px;
		background:
			radial-gradient(
				circle at 16% 0%,
				color-mix(in srgb, var(--color-sky-soft) 38%, transparent),
				transparent 36%
			),
			radial-gradient(
				circle at 100% 24%,
				color-mix(in srgb, var(--color-peach-soft) 42%, transparent),
				transparent 34%
			),
			var(--color-paper-2);
		padding: 18px 18px 16px;
		box-shadow: var(--shadow-float);
	}

	.auth-heading.svelte-1i2smtp {
		display: grid;
		gap: 4px;
		text-align: center;
	}

	.auth-heading.svelte-1i2smtp p:where(.svelte-1i2smtp) {
		margin: 0;
		color: var(--color-muted);
		font-size: 0.82rem;
		font-weight: 850;
	}

	.auth-heading.svelte-1i2smtp h1:where(.svelte-1i2smtp) {
		margin: 0;
		color: var(--color-ink);
		font-size: clamp(1.72rem, 7vw, 2.08rem);
		line-height: 1.02;
	}

	.mode-switch.svelte-1i2smtp {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 6px;
		border-radius: var(--radius-pill);
		background: var(--color-paper);
		padding: 5px;
		box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-line) 84%, transparent);
	}

	.mode-switch.svelte-1i2smtp button:where(.svelte-1i2smtp) {
		min-height: 36px;
		border: 0;
		border-radius: var(--radius-pill);
		background: transparent;
		color: var(--color-muted);
		font-size: 0.86rem;
		font-weight: 900;
		cursor: pointer;
	}

	.mode-switch.svelte-1i2smtp button.active:where(.svelte-1i2smtp) {
		background: var(--color-charcoal);
		color: var(--color-paper-2);
		box-shadow: 0 8px 16px color-mix(in srgb, var(--color-charcoal) 12%, transparent);
	}

	.google-button.svelte-1i2smtp,
	.guest-button.svelte-1i2smtp,
	.submit-button.svelte-1i2smtp {
		display: inline-flex;
		width: 100%;
		min-height: 46px;
		align-items: center;
		justify-content: center;
		gap: 10px;
		border: 0;
		border-radius: var(--radius-pill);
		font-size: 0.96rem;
		font-weight: 900;
		text-decoration: none;
		cursor: pointer;
		transition: transform 120ms ease;
	}

	.google-button.svelte-1i2smtp {
		border: 1px solid color-mix(in srgb, var(--color-line) 90%, transparent);
		background: var(--color-paper-2);
		color: var(--color-charcoal);
		box-shadow: 0 10px 22px color-mix(in srgb, var(--color-charcoal) 6%, transparent);
	}

	.guest-button.svelte-1i2smtp {
		border: 1px solid color-mix(in srgb, var(--color-charcoal) 18%, var(--color-line));
		background: var(--color-sage-soft);
		color: var(--color-charcoal);
	}

	.google-button.svelte-1i2smtp:active,
	.guest-button.svelte-1i2smtp:active,
	.submit-button.svelte-1i2smtp:active {
		transform: translateY(1px);
	}

	.google-mark.svelte-1i2smtp {
		display: grid;
		width: 26px;
		height: 26px;
		place-items: center;
		border-radius: 50%;
		background: var(--color-sky-soft);
		color: var(--color-ink);
		font-size: 0.88rem;
		font-weight: 900;
	}

	.divider.svelte-1i2smtp {
		display: grid;
		grid-template-columns: 1fr auto 1fr;
		align-items: center;
		gap: 12px;
		color: var(--color-muted);
		font-size: 0.76rem;
		font-weight: 800;
	}

	.divider.svelte-1i2smtp::before,
	.divider.svelte-1i2smtp::after {
		content: '';
		height: 1px;
		background: var(--color-line);
	}

	.email-form.svelte-1i2smtp {
		display: grid;
		gap: 10px;
	}

	.field.svelte-1i2smtp {
		display: grid;
		gap: 7px;
	}

	.field.svelte-1i2smtp > span:where(.svelte-1i2smtp):first-child {
		color: var(--color-charcoal);
		font-size: 0.78rem;
		font-weight: 850;
	}

	.input-wrap.svelte-1i2smtp {
		display: grid;
		grid-template-columns: 22px 1fr auto;
		gap: 9px;
		align-items: center;
		min-height: 46px;
		border: 1px solid color-mix(in srgb, var(--color-line) 92%, transparent);
		border-radius: 18px;
		background: var(--color-paper);
		padding: 0 12px;
		color: var(--color-muted);
		box-shadow: inset 0 1px 0 color-mix(in srgb, var(--color-paper-2) 80%, transparent);
	}

	.input-wrap.svelte-1i2smtp:focus-within {
		border-color: color-mix(in srgb, var(--color-charcoal) 30%, var(--color-line));
		background: var(--color-paper-2);
	}

	.input-wrap.svelte-1i2smtp input:where(.svelte-1i2smtp) {
		min-width: 0;
		border: 0;
		outline: 0;
		background: transparent;
		color: var(--color-ink);
		font-size: 0.94rem;
		font-weight: 650;
	}

	.show-password.svelte-1i2smtp {
		display: grid;
		width: 30px;
		height: 30px;
		place-items: center;
		border: 0;
		border-radius: 50%;
		background: transparent;
		color: var(--color-muted);
		cursor: pointer;
	}

	.field.svelte-1i2smtp small:where(.svelte-1i2smtp),
	.form-message.svelte-1i2smtp {
		margin: 0;
		border-radius: 16px;
		background: var(--color-danger-bg);
		color: var(--color-danger-text);
		padding: 9px 11px;
		font-size: 0.78rem;
		font-weight: 750;
		line-height: 1.34;
	}

	.forgot-link.svelte-1i2smtp {
		justify-self: start;
		color: var(--color-info-text);
		font-size: 0.82rem;
		font-weight: 850;
		text-decoration: none;
	}

	.submit-button.svelte-1i2smtp {
		margin-top: 0;
		background: var(--color-charcoal);
		color: var(--color-paper-2);
		box-shadow: 0 12px 26px color-mix(in srgb, var(--color-charcoal) 18%, transparent);
	}

	.sr-only.svelte-1i2smtp {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
	}

	@media (max-width: 360px) {
		.auth-card.svelte-1i2smtp {
			padding-inline: 16px;
		}

		.google-button.svelte-1i2smtp,
		.guest-button.svelte-1i2smtp,
		.submit-button.svelte-1i2smtp {
			font-size: 0.9rem;
		}
	}

	@media (max-height: 640px) {
		.auth-screen.svelte-1i2smtp {
			gap: 8px;
			padding-block: 8px;
		}

		.cat-badge.svelte-1i2smtp {
			width: 62px;
			height: 62px;
			border-radius: 24px;
		}

		.cat-badge.svelte-1i2smtp img:where(.svelte-1i2smtp) {
			width: 52px;
			height: 52px;
		}

		.auth-card.svelte-1i2smtp {
			gap: 9px;
			padding-block: 14px;
		}

		.auth-heading.svelte-1i2smtp h1:where(.svelte-1i2smtp) {
			font-size: 1.58rem;
		}

		.mode-switch.svelte-1i2smtp button:where(.svelte-1i2smtp),
		.google-button.svelte-1i2smtp,
		.guest-button.svelte-1i2smtp,
		.submit-button.svelte-1i2smtp,
		.input-wrap.svelte-1i2smtp {
			min-height: 42px;
		}
	}