.header.svelte-it3mw6 {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1rem;
		padding: 0.75rem 1.25rem;
		background: white;
		border-bottom: 1px solid #e5e7eb;
		box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
		flex-shrink: 0;
	}

	.left.svelte-it3mw6,
	.right.svelte-it3mw6 {
		display: flex;
		align-items: center;
		gap: 0.75rem;
		flex: 1;
	}

	.right.svelte-it3mw6 {
		justify-content: flex-end;
	}

	.center.svelte-it3mw6 {
		text-align: center;
		flex-shrink: 0;
	}

	.title.svelte-it3mw6 {
		margin: 0;
		font-size: 1.5rem;
		font-weight: 900;
		color: #1e3a8a;
	}

	.subtitle.svelte-it3mw6 {
		margin: 0;
		font-size: 0.85rem;
		color: #64748b;
	}

	.repeat-btn.svelte-it3mw6 {
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
		background: linear-gradient(135deg, #f97316, #ea580c);
		color: white;
		font-weight: 800;
		padding: 0.65rem 1.1rem;
		border-radius: 999px;
		box-shadow: 0 8px 22px rgba(249, 115, 22, 0.35);
		transition: transform 120ms ease;
	}

	.repeat-btn.svelte-it3mw6:hover {
		transform: translateY(-1px);
	}

	.repeat-btn.svelte-it3mw6:active {
		transform: translateY(0);
	}

	.new-game-btn.svelte-it3mw6 {
		background: #f1f5f9;
		color: #0f172a;
		font-weight: 700;
		padding: 0.55rem 1rem;
		border-radius: 999px;
		border: 1px solid #e2e8f0;
	}

	.new-game-btn.svelte-it3mw6:hover {
		background: #e2e8f0;
	}

	.size-picker.svelte-it3mw6 {
		display: inline-flex;
		gap: 0.25rem;
		padding: 0.25rem;
		background: #f1f5f9;
		border-radius: 999px;
	}

	.size-btn.svelte-it3mw6 {
		font-weight: 700;
		padding: 0.35rem 0.75rem;
		border-radius: 999px;
		font-size: 0.85rem;
		color: #475569;
	}

	.size-btn.active.svelte-it3mw6 {
		background: white;
		color: #0f172a;
		box-shadow: 0 2px 6px rgba(15, 23, 42, 0.12);
	}

	.score.svelte-it3mw6 {
		display: inline-flex;
		align-items: center;
		gap: 0.4rem;
		background: #eff6ff;
		color: #1d4ed8;
		font-weight: 800;
		padding: 0.5rem 0.9rem;
		border-radius: 999px;
		border: 1px solid #bfdbfe;
	}

	.score-value.svelte-it3mw6 {
		font-size: 1.2rem;
		min-width: 1.5rem;
		text-align: center;
	}

	.settings-btn.svelte-it3mw6 {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		background: #f1f5f9;
		color: #475569;
		border-radius: 999px;
		border: 1px solid #e2e8f0;
		transition:
			background 120ms ease,
			color 120ms ease,
			transform 120ms ease;
	}

	.settings-btn.svelte-it3mw6:hover {
		background: #e2e8f0;
		color: #0f172a;
		transform: rotate(20deg);
	}

	.letter-card.svelte-erqnn2 {
		display: flex;
		align-items: center;
		justify-content: center;
		background: white;
		border: 2px solid #e5e7eb;
		border-radius: 1.25rem;
		box-shadow:
			0 1px 0 rgba(15, 23, 42, 0.04),
			0 8px 20px rgba(15, 23, 42, 0.06);
		cursor: pointer;
		transition:
			transform 120ms ease,
			box-shadow 160ms ease,
			border-color 160ms ease,
			background 160ms ease;
		/* הגריד מכתיב את המידות (rows/cols) — אין צורך ב-aspect-ratio */
		width: 100%;
		height: 100%;
		min-height: 0;
		min-width: 0;
		padding: 0;
		/* container query — מאפשר לתוכן הפנימי להגיב לגודל הכרטיס */
		container-type: size;
		container-name: card;
	}

	.letter-card.svelte-erqnn2:hover:not(.disabled) {
		transform: translateY(-2px);
		border-color: #fdba74;
		box-shadow: 0 12px 30px rgba(249, 115, 22, 0.18);
	}

	.letter-card.svelte-erqnn2:active:not(.disabled) {
		transform: translateY(0);
	}

	.letter-card.disabled.svelte-erqnn2 {
		cursor: default;
	}

	.letter-card.pop-success.svelte-erqnn2 {
		background: #dcfce7;
		border-color: #22c55e;
	}

	.letter.svelte-erqnn2 {
		font-family: 'David', 'Frank Ruehl CLM', 'Times New Roman', serif;
		font-weight: 800;
		color: #1e3a8a;
		/* גודל הפונט מתאים את עצמו לגודל הכרטיס — 60% מהגובה הזמין */
		font-size: 60cqh;
		line-height: 1;
	}

	.board-wrapper.svelte-13hzbgg {
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 0;
		min-width: 0;
	}

	.board.svelte-13hzbgg {
		display: grid;
		gap: 12px;
		padding: 16px;
		border: 6px solid var(--color-frame, #ff6a3d);
		border-radius: 1.5rem;
		background: white;
		box-shadow: 0 24px 60px rgba(15, 23, 42, 0.08);
		box-sizing: border-box;
	}

	.game-main.svelte-1uha8ag {
		flex: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 1rem;
		min-height: 0;
		position: relative;
	}

	/* ProgressWidget מקובע בפינה השמאלית של אזור המשחק (RTL → "צד" של הלוח) */
	.progress-widget-pos.svelte-1uha8ag {
		position: absolute;
		top: 1rem;
		left: 1rem;
		z-index: 20;
		pointer-events: auto;
	}

	.empty.svelte-1uha8ag {
		font-size: 1.5rem;
		color: #475569;
		text-align: center;
	}

	/* פתק "עונש בגלל טעות" — מופיע בראש אזור המשחק עם ספירה לאחור */
	.cooldown-pill.svelte-1uha8ag {
		position: absolute;
		top: 1rem;
		right: 50%;
		transform: translateX(50%);
		z-index: 30;
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
		background: #fef2f2;
		color: #b91c1c;
		font-weight: 800;
		padding: 0.5rem 1rem;
		border-radius: 999px;
		border: 2px solid #fecaca;
		box-shadow: 0 8px 24px rgba(239, 68, 68, 0.2);
		animation: svelte-1uha8ag-pulse 1s ease-in-out infinite;
	}

	.cooldown-icon.svelte-1uha8ag {
		font-size: 1.2rem;
	}

	.cooldown-num.svelte-1uha8ag {
		font-size: 1.4rem;
		min-width: 1.5rem;
		text-align: center;
		font-variant-numeric: tabular-nums;
	}

	@keyframes svelte-1uha8ag-pulse {
		0%, 100% {
			transform: translateX(50%) scale(1);
		}
		50% {
			transform: translateX(50%) scale(1.05);
		}
	}