/* =================================
	   Design System Variables
	   ================================= */
	.register-page.svelte-1f2d5fz {
		--font-display:
			'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Display', system-ui, sans-serif;
		--font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Text', system-ui, sans-serif;

		--space-xs: 0.25rem;
		--space-sm: 0.5rem;
		--space-md: 1rem;
		--space-lg: 1.5rem;
		--space-xl: 2rem;
		--space-2xl: 3rem;
		--space-3xl: 4rem;
		--space-4xl: 6rem;

		--ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
		--ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
	}

	/* =================================
	   Page Layout
	   ================================= */
	.register-page.svelte-1f2d5fz {
		min-height: 100vh;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: var(--space-xl);
		padding-top: 6rem;
		background: rgb(255, 255, 255);
	}

	.dark .register-page.svelte-1f2d5fz {
		background: rgb(9, 9, 11);
	}

	.register-container.svelte-1f2d5fz {
		display: grid;
		grid-template-columns: 1fr;
		gap: var(--space-3xl);
		width: 100%;
		max-width: 80rem;
	}

	@media (min-width: 1024px) {
		.register-container.svelte-1f2d5fz {
			grid-template-columns: 1fr 1.2fr;
			gap: var(--space-4xl);
			align-items: center;
		}
	}

	/* =================================
	   Hero Section
	   ================================= */
	.hero-section.svelte-1f2d5fz {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.hero-content.svelte-1f2d5fz {
		display: flex;
		flex-direction: column;
		gap: var(--space-lg);
	}

	.hero-badge.svelte-1f2d5fz {
		display: inline-flex;
		align-items: center;
		gap: var(--space-sm);
		padding: 0.5rem 1rem;
		background: rgb(244, 244, 245);
		border-radius: 999px;
		width: fit-content;
	}

	.dark .hero-badge.svelte-1f2d5fz {
		background: rgb(39, 39, 42);
	}

	.badge-dot.svelte-1f2d5fz {
		width: 6px;
		height: 6px;
		background: rgb(34, 197, 94);
		border-radius: 50%;
		animation: svelte-1f2d5fz-pulse 2s infinite;
	}

	@keyframes svelte-1f2d5fz-pulse {
		0%,
		100% {
			opacity: 1;
		}
		50% {
			opacity: 0.5;
		}
	}

	.badge-text.svelte-1f2d5fz {
		font-family: var(--font-body);
		font-size: 0.75rem;
		font-weight: 600;
		letter-spacing: 0.05em;
		text-transform: uppercase;
		color: rgb(63, 63, 70);
	}

	.dark .badge-text.svelte-1f2d5fz {
		color: rgb(161, 161, 170);
	}

	.hero-title.svelte-1f2d5fz {
		display: flex;
		flex-direction: column;
		gap: 0;
		margin: var(--space-md) 0;
	}

	.title-line.svelte-1f2d5fz {
		font-family: var(--font-display);
		font-size: clamp(3rem, 10vw, 6rem);
		font-weight: 900;
		letter-spacing: -0.04em;
		line-height: 0.9;
		text-transform: uppercase;
		color: rgb(9, 9, 11);
	}

	.dark .title-line.svelte-1f2d5fz {
		color: rgb(250, 250, 250);
	}

	.hero-subtitle.svelte-1f2d5fz {
		font-family: var(--font-body);
		font-size: 1rem;
		font-weight: 400;
		line-height: 1.7;
		color: rgb(113, 113, 122);
		max-width: 28ch;
		margin: 0;
	}

	.dark .hero-subtitle.svelte-1f2d5fz {
		color: rgb(161, 161, 170);
	}

	.hero-meta.svelte-1f2d5fz {
		display: flex;
		align-items: center;
		gap: var(--space-lg);
		margin-top: var(--space-xl);
		padding-top: var(--space-xl);
		border-top: 1px solid rgba(0, 0, 0, 0.06);
	}

	.dark .hero-meta.svelte-1f2d5fz {
		border-top-color: rgba(255, 255, 255, 0.06);
	}

	.meta-item.svelte-1f2d5fz {
		display: flex;
		flex-direction: column;
		gap: var(--space-xs);
	}

	.meta-label.svelte-1f2d5fz {
		font-size: 0.6875rem;
		font-weight: 500;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: rgb(161, 161, 170);
	}

	.meta-value.svelte-1f2d5fz {
		font-size: 0.875rem;
		font-weight: 500;
		color: rgb(24, 24, 27);
	}

	.dark .meta-value.svelte-1f2d5fz {
		color: rgb(250, 250, 250);
	}

	.meta-divider.svelte-1f2d5fz {
		width: 1px;
		height: 2rem;
		background: rgba(0, 0, 0, 0.08);
	}

	.dark .meta-divider.svelte-1f2d5fz {
		background: rgba(255, 255, 255, 0.08);
	}

	/* =================================
	   Form Section
	   ================================= */
	.form-section.svelte-1f2d5fz {
		display: flex;
		flex-direction: column;
	}

	.form-wrapper.svelte-1f2d5fz {
		background: rgb(250, 250, 250);
		border-radius: 1.5rem;
		padding: var(--space-2xl);
		border: 1px solid rgba(0, 0, 0, 0.04);
	}

	.dark .form-wrapper.svelte-1f2d5fz {
		background: rgb(18, 18, 20);
		border-color: rgba(255, 255, 255, 0.04);
	}

	.form-header.svelte-1f2d5fz {
		display: flex;
		align-items: center;
		gap: var(--space-md);
		margin-bottom: var(--space-2xl);
		padding-bottom: var(--space-lg);
		border-bottom: 1px solid rgba(0, 0, 0, 0.06);
	}

	.dark .form-header.svelte-1f2d5fz {
		border-bottom-color: rgba(255, 255, 255, 0.06);
	}

	.form-number.svelte-1f2d5fz {
		font-family: 'SF Mono', 'Fira Code', monospace;
		font-size: 0.75rem;
		font-weight: 500;
		color: rgb(161, 161, 170);
	}

	.form-label.svelte-1f2d5fz {
		font-family: var(--font-body);
		font-size: 0.875rem;
		font-weight: 600;
		color: rgb(24, 24, 27);
	}

	.dark .form-label.svelte-1f2d5fz {
		color: rgb(250, 250, 250);
	}

	.register-form.svelte-1f2d5fz {
		display: flex;
		flex-direction: column;
		gap: var(--space-xl);
	}

	.form-row.svelte-1f2d5fz {
		display: grid;
		grid-template-columns: 1fr;
		gap: var(--space-xl);
	}

	@media (min-width: 640px) {
		.form-row.svelte-1f2d5fz {
			grid-template-columns: 1fr 1fr;
		}
	}

	.form-group.svelte-1f2d5fz {
		position: relative;
		display: flex;
		flex-direction: column;
		gap: var(--space-sm);
	}

	.form-group.full-width.svelte-1f2d5fz {
		grid-column: 1 / -1;
	}

	.form-label-text.svelte-1f2d5fz {
		font-family: var(--font-body);
		font-size: 0.75rem;
		font-weight: 600;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: rgb(113, 113, 122);
		transition: color 200ms ease;
	}

	.form-group.focused.svelte-1f2d5fz .form-label-text:where(.svelte-1f2d5fz) {
		color: rgb(24, 24, 27);
	}

	.dark .form-group.focused.svelte-1f2d5fz .form-label-text:where(.svelte-1f2d5fz) {
		color: rgb(250, 250, 250);
	}

	.form-input.svelte-1f2d5fz,
	.form-textarea.svelte-1f2d5fz {
		width: 100%;
		padding: var(--space-md) 0;
		background: transparent;
		border: none;
		font-family: var(--font-body);
		font-size: 1rem;
		color: rgb(24, 24, 27);
		outline: none;
	}

	.dark .form-input.svelte-1f2d5fz,
	.dark .form-textarea.svelte-1f2d5fz {
		color: rgb(250, 250, 250);
	}

	.form-input.svelte-1f2d5fz::placeholder,
	.form-textarea.svelte-1f2d5fz::placeholder {
		color: rgb(161, 161, 170);
	}

	.dark .form-input.svelte-1f2d5fz::placeholder,
	.dark .form-textarea.svelte-1f2d5fz::placeholder {
		color: rgb(82, 82, 91);
	}

	.form-textarea.svelte-1f2d5fz {
		resize: none;
		min-height: 6rem;
	}

	.input-line.svelte-1f2d5fz {
		height: 2px;
		background: rgba(0, 0, 0, 0.08);
		border-radius: 999px;
		transform-origin: left;
		transition:
			background 250ms var(--ease-out-expo),
			transform 250ms var(--ease-out-expo);
	}

	.dark .input-line.svelte-1f2d5fz {
		background: rgba(255, 255, 255, 0.08);
	}

	.form-group.focused.svelte-1f2d5fz .input-line:where(.svelte-1f2d5fz) {
		background: rgb(24, 24, 27);
		transform: scaleY(1.5);
	}

	.dark .form-group.focused.svelte-1f2d5fz .input-line:where(.svelte-1f2d5fz) {
		background: rgb(250, 250, 250);
	}

	/* =================================
	   Submit Button
	   ================================= */
	.form-actions.svelte-1f2d5fz {
		margin-top: var(--space-lg);
	}

	.submit-btn.svelte-1f2d5fz {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: var(--space-sm);
		width: 100%;
		padding: 1rem 2rem;
		background: rgb(24, 24, 27);
		border: none;
		border-radius: 999px;
		font-family: var(--font-body);
		font-size: 0.875rem;
		font-weight: 600;
		color: rgb(255, 255, 255);
		cursor: pointer;
		transition: all 200ms var(--ease-out-expo);
	}

	.dark .submit-btn.svelte-1f2d5fz {
		background: rgb(250, 250, 250);
		color: rgb(24, 24, 27);
	}

	.submit-btn.svelte-1f2d5fz:hover {
		transform: translateY(-2px);
		box-shadow: 0 8px 24px -8px rgba(0, 0, 0, 0.3);
	}

	.dark .submit-btn.svelte-1f2d5fz:hover {
		box-shadow: 0 8px 24px -8px rgba(255, 255, 255, 0.15);
	}

	.btn-arrow.svelte-1f2d5fz {
		display: flex;
		transition: transform 200ms var(--ease-out-expo);
	}

	.submit-btn.svelte-1f2d5fz:hover .btn-arrow:where(.svelte-1f2d5fz) {
		transform: translateX(4px);
	}

	.btn-arrow.svelte-1f2d5fz svg:where(.svelte-1f2d5fz) {
		width: 1rem;
		height: 1rem;
	}

	@media (min-width: 640px) {
		.submit-btn.svelte-1f2d5fz {
			width: auto;
		}
	}

	/* =================================
	   Reduced Motion
	   ================================= */
	@media (prefers-reduced-motion: reduce) {
		.badge-dot.svelte-1f2d5fz {
			animation: none;
		}
	}