Add .file class + Generator user agent

src/styles/classes/file.postcss

@@ -0,0 +1,53 @@
+.file {
+	border-radius: var(--rounded);
+	background-color: var(--color-button-bg);
+	box-shadow: var(--shadow-raised-sm), var(--shadow-inset);
+
+	&:is(a):hover {
+		filter: brightness(0.9);
+	}
+
+	&--primary {
+		background-color: var(--color-brand-light);
+	}
+
+	&__tab {
+		display: flex;
+		align-items: center;
+		padding: 0.75rem 1rem;
+		gap: 1rem;
+
+		:global(.icon) {
+			/* Uses `px` to make icons slightly larger */
+			min-width: 18px;
+			height: 18px;
+		}
+
+		&__name {
+			text-overflow: ellipsis;
+			overflow: hidden;
+			white-space: nowrap;
+			margin-right: auto;
+
+			@media (width <= 900px) {
+				word-break: break-all;
+			}
+		}
+	}
+
+	&__preview {
+		width: 100%;
+		border-radius: var(--rounded-bottom);
+		overflow: hidden;
+		display: flex;
+		justify-content: center;
+		background-color: black;
+
+		&__image {
+			height: auto;
+			max-height: 22rem;
+			width: 100%;
+			object-fit: contain;
+		}
+	}
+}