diff --git a/src/scss/components/_cards.scss b/src/scss/components/_cards.scss
index f6b3506..c1fa0f4 100644
--- a/src/scss/components/_cards.scss
+++ b/src/scss/components/_cards.scss
@@ -2,7 +2,7 @@
 @use "typography" as *;
 
 .card {
-	max-width: 420px;
+	max-width: 340px;
 	width: 100%;
 	@include hard_panel($color-text-light);
 
@@ -19,7 +19,9 @@
 		height: 100%;
 
 		.card-thumb {
-			width: 100%;
+			display: block;
+			width: min(68%, 190px);
+			margin: $space-5 auto $space-6;
 		}
 
 		p {
diff --git a/src/scss/components/_lists.scss b/src/scss/components/_lists.scss
index beb1872..6b9ec27 100644
--- a/src/scss/components/_lists.scss
+++ b/src/scss/components/_lists.scss
@@ -27,37 +27,55 @@
 	}
 
 	&.list-definition {
-		gap: $space-md;
+		width: 100%;
+		max-width: 620px;
+		gap: 0;
+		border: $border-width-base solid $border-color-muted;
+		border-left-width: $border-width-accent;
+		background: $surface-panel-muted;
 
 		.list-row {
-			border-left: $border-width-base solid $color-primary;
-			padding: $space-2 0;
-
-			.list-term::before,
-			.list-desc::before {
-				content: "";
-				height: 2px;
-				width: $space-3;
-				position: absolute;
-				top: 50%;
-				left: 0;
-				margin-top: -1px;
-				display: block;
-				background: $color-primary;
-			}
-
-			.list-term,
-			.list-desc {
-				position: relative;
-			}
+			display: grid;
+			grid-template-columns: minmax(120px, 0.32fr) minmax(0, 1fr);
+			gap: $space-4;
+			align-items: start;
+			padding: $space-3 $space-4;
+			border-bottom: $border-width-base solid rgba($color-text-light, 0.08);
+			transition-duration: $motion-base;
+			transition-timing-function: $motion-ease;
+			transition-property: background, border-color;
 
 			.list-term {
-				padding-left: $space-5;
-				font-size: $font-size-xl;
+				display: inline-flex;
+				width: max-content;
+				max-width: 100%;
+				margin: 0;
+				padding: $space-1 $space-2;
+				color: $color-black;
+				background: $color-primary;
+				font-size: $font-size-sm;
+				font-weight: $font-weight-bold;
+				line-height: $line-height-base;
+				text-transform: uppercase;
 			}
 
 			.list-desc {
-				padding-left: $space-5;
+				margin: 0;
+				color: $color-text-medium;
+				font-size: $font-size-sm;
+				line-height: $line-height-relaxed;
+			}
+
+			&:last-child {
+				border-bottom: 0;
+			}
+
+			@include hover_touch {
+				background: $surface-panel-strong;
+
+				.list-term {
+					background: $color-secondary;
+				}
 			}
 		}
 	}
@@ -167,3 +185,14 @@
 		}
 	}
 }
+
+@include media_down("sm") {
+	.list {
+		&.list-definition {
+			.list-row {
+				grid-template-columns: 1fr;
+				gap: $space-2;
+			}
+		}
+	}
+}
diff --git a/src/scss/components/_toasts.scss b/src/scss/components/_toasts.scss
index 9d0019c..23ddb0a 100644
--- a/src/scss/components/_toasts.scss
+++ b/src/scss/components/_toasts.scss
@@ -34,6 +34,7 @@
 		gap: 0;
 
 		.toast-title {
+			min-height: $control-height-sm;
 			font-size: $font-size-lg;
 			display: flex;
 			flex-direction: row;
@@ -58,11 +59,14 @@
 		top: 0;
 		right: 0;
 		color: $color-black;
-		height: $control-height-md;
-		width: $control-height-md;
+		height: $control-height-sm;
+		width: $control-height-sm;
+		border-color: transparent;
 
-		&:hover {
+		@include hover_touch {
 			color: $color-black;
+			background: rgba($color-black, 0.12);
+			border-color: rgba($color-black, 0.42);
 		}
 	}