Poprawiono CSS

src/App.scss

@@ -1,5 +1,5 @@
 body {
-	background-color: #f5f5f5;
+	background-color: ghostwhite;
 	font-family: 'Roboto', sans-serif;
 	font-size: 1em;
 	margin: 0;

src/Gra.scss

@@ -1,5 +1,26 @@
+$promien: 0.5em;
+
 .gra {
 	text-align: center;
-	width: 20em;
+	max-width: 30em;
 	margin: 0 auto;
+
+	.przyciskResetu {
+		margin: 1em;
+		border: none;
+		border-radius: $promien;
+		padding: $promien;
+		font-size: 1em;
+		color: white;
+		background-color: royalblue;
+		font-weight: bold;
+
+		&.jeszczeRaz {
+			background-color: green;
+		}
+
+		&.naPewno {
+			background-color: darkorange;
+		}
+	}
 }

src/Gra.tsx

@@ -113,6 +113,11 @@ function Gra() {
 		(potwierdzeniePoddaniaSię ? () => setWygranko('nie') : () => setPotwierdzeniePoddaniaSię(true)) :
 		resetuj
 
+	const klasaResetu = 'przyciskResetu' + (wygranko == '' ?
+		(potwierdzeniePoddaniaSię ? ' naPewno' : '') :
+		' jeszczeRaz'
+	)
+
 	return <div className="gra">
 		<div className="macierz">
 			{słowa}
@@ -139,7 +144,7 @@ function Gra() {
 				tryb oszusta (debug)
 			</label>
 		</p>
-		<button className="przyciskResetu" onClick={funkcjaResetu}>{napisResetu}</button>
+		<button className={klasaResetu} onClick={funkcjaResetu}>{napisResetu}</button>
 		{
 			wygranko != '' &&
 			<div className="koniecGry">

src/Klawiatura.scss

@@ -2,4 +2,5 @@
 	display: flex;
 	flex-direction: row;
 	flex-wrap: wrap;
+	justify-content: center;
 }

src/Slowo.scss

@@ -2,4 +2,5 @@
 	display: flex;
 	flex-direction: row;
 	font-size: 2em;
+	justify-content: center;
 }