<style>
	/* Reset & base */
	* { box-sizing: border-box; margin: 0; padding: 0; }
	body { font-family: Arial, sans-serif; background-color: #f7f8fa; display: flex; align-items: center; justify-content: center; min-height: 100vh; }

	/* Form container */
	.form-container { background: #fff; padding: 2rem; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.05); width: 100%; max-width: 400px; }
	h2 { margin-bottom: 1rem; color: #111827; text-align: center; }

	/* Labels & inputs */
	.form-group { margin-bottom: 1.25rem; }
	.form-group label { display: block; margin-bottom: 0.5rem; font-size: 0.875rem; color: #374151; }
	.form-group input { width: 100%; padding: 0.75rem 0rem; border: 1px solid #d1d5db; border-radius: 6px; font-size: 1rem; color: #111827; background-color: #f9fafb; transition: border-color 0.2s; }
	.form-group textarea { width: 100%; padding: 0.75rem 0rem; border: 1px solid #d1d5db; border-radius: 6px; font-size: 1rem; color: #111827; background-color: #f9fafb; transition: border-color 0.2s; resize: vertical; min-height: 100px; }
	.form-group input:focus,
	.form-group textarea:focus { outline: none; border-color: #2563eb; background-color: #fff; }

	/* Password field wrapper */
	.password-wrapper { position: relative; }
	.password-wrapper svg { position: absolute; right: 0.75rem; bottom: 0.75rem; cursor: pointer; fill: #6b7280; }

	/* Buttons */
	.btn { width: 100%; padding: 0.75rem; background-color: #111827; color: #fff; border: none; border-radius: 6px; font-size: 1rem; cursor: pointer; transition: background-color 0.2s; }
	.btn:hover { background-color: #1e293b; }
	.text-center { text-align: center; }
</style>
