Get the item list styles finished, and start working on the weight summary / carry capacity for the tab

styles/Apps/PlayerSheet.css

@@ -37,7 +37,21 @@
 		}
 	}
 
+	.item-list-header {
+		display: flex;
+		flex-direction: row;
+		gap: 8px;
+		border-radius: 6px 6px 0 0;
+		padding: 4px;
+		margin-bottom: 2px;
+		background: var(--item-list-header-background);
+		color: var(--item-list-header-color);
+	}
+
 	.item-list {
+		display: flex;
+		flex-direction: column;
+		gap: 2px;
 		list-style: none;
 		margin: 0;
 		padding: 0;
@@ -46,8 +60,8 @@
 	.item {
 		background: var(--item-card-background);
 		color: var(--item-card-color);
-		border-radius: 4px;
 		overflow: hidden;
+		margin-bottom: 0;
 
 		.summary {
 			display: grid;
@@ -79,13 +93,27 @@
 				opacity: 90%;
 			}
 
-			input {
+			input, button {
 				background: var(--item-card-header-input-background);
 				color: var(--item-card-header-input-color);
 				text-align: center;
 			}
 		}
 
+		.expand-button {
+			border: none;
+			aspect-ratio: 1;
+
+			&:focus-visible {
+				filter: brightness(150%);
+				outline: none;
+			}
+
+			&[data-expanded="true"] {
+				rotate: 180deg;
+			}
+		}
+
 		.full-details {
 			padding: 4px;
 
@@ -93,6 +121,10 @@
 				display: none;
 			}
 		}
+
+		&:last-child {
+			border-radius: 0 0 6px 6px;
+		}
 	}
 
 	.content {

styles/resets/button.css

@@ -1,3 +1,8 @@
 .taf > .window-content button {
 	height: initial;
+
+	&:focus {
+		outline: none;
+		box-shadow: none;
+	}
 }

styles/themes/dark.css

@@ -7,6 +7,8 @@
 	--tab-button-active-border: rebeccapurple;
 	--tab-button-hover-bg: var(--color-cool-3);
 
+	--item-list-header-background: #171e26;
+	--item-list-header-color: white;
 	--item-card-background: #1d262f;
 	--item-card-color: white;
 	--item-card-header-background: #242d38;

styles/themes/variables.css

@@ -0,0 +1,3 @@
+:root {
+	--steel-650: #2b3642;
+}