@stackoverflow/stacks 3.0.0-beta.22 → 3.0.0-beta.23

package/dist/css/stacks.css

@@ -1339,15 +1339,18 @@ body.theme-highcontrast .s-breadcrumbs .s-breadcrumbs--divider {
 }
 .s-btn:not(.s-btn__danger):not(.s-btn__featured):not(.s-btn__tonal):not(.s-btn__link):not(.s-btn__unset):not(.s-btn__facebook):not(.s-btn__github):not(.s-btn__google) {
   --_bu-bg: var(--theme-button-color, var(--theme-secondary));
-  --_bu-bg-disabled: var(--black-350);
+  --_bu-bg-disabled: var(--theme-secondary-300);
   --_bu-bg-hover: var(--theme-button-hover-background-color, var(--theme-secondary-500));
   --_bu-fc: var(--white);
-  --_bu-fc-disabled: var(--black-050);
+  --_bu-fc-disabled: var(--theme-secondary-100);
   --_bu-fc-hover: var(--theme-button-hover-color, var(--white));
   --_bu-badge-bg: var(--theme-secondary-500);
   --_bu-badge-fc: var(--white);
-  --_bu-badge-bg-disabled: var(--black-250);
-  --_bu-badge-fc-disabled: var(--black-050);
+  --_bu-badge-bg-disabled: var(--theme-secondary-300);
+  --_bu-badge-fc-disabled: var(--theme-secondary-100);
+}
+body.theme-highcontrast .s-btn:not(.s-btn__danger):not(.s-btn__featured):not(.s-btn__tonal):not(.s-btn__link):not(.s-btn__unset):not(.s-btn__facebook):not(.s-btn__github):not(.s-btn__google) {
+  --_bu-bg-disabled: var(--theme-secondary-300);
 }
 .s-btn:not(.s-btn__danger):not(.s-btn__featured):not(.s-btn__tonal):not(.s-btn__link):not(.s-btn__unset):not(.s-btn__facebook):not(.s-btn__github):not(.s-btn__google).s-btn__clear {
   --_bu-bg: transparent;
@@ -1359,11 +1362,15 @@ body.theme-highcontrast .s-breadcrumbs .s-breadcrumbs--divider {
   --_bu-fc-hover: var(--_bu-fc);
   --_bu-badge-bg: var(--theme-secondary-100);
   --_bu-badge-fc: var(--theme-secondary-500);
-  --_bu-badge-bg-disabled: var(--black-100);
-  --_bu-badge-fc-disabled: var(--black-350);
+  --_bu-badge-bg-disabled: var(--theme-secondary-100);
+  --_bu-badge-fc-disabled: var(--theme-secondary-300);
 }
 body.theme-highcontrast .s-btn:not(.s-btn__danger):not(.s-btn__featured):not(.s-btn__tonal):not(.s-btn__link):not(.s-btn__unset):not(.s-btn__facebook):not(.s-btn__github):not(.s-btn__google).s-btn__clear {
-  --_bu-bc: var(--theme-secondary-600);
+  --_bu-bc: var(--theme-secondary-400);
+  --_bu-bc-disabled: var(--theme-secondary-300);
+  --_bu-bg-disabled: var(--white);
+  --_bu-badge-bg-disabled: var(--theme-secondary-100);
+  --_bu-badge-fc-disabled: var(--theme-secondary-300);
 }
 .s-btn.s-btn__danger {
   --_bu-bg: var(--red-400);
@@ -1378,6 +1385,39 @@ body.theme-highcontrast .s-btn:not(.s-btn__danger):not(.s-btn__featured):not(.s-
   --_bu-badge-bg-disabled: var(--red-300);
   --_bu-badge-fc-disabled: var(--black-100);
 }
+@media (prefers-color-scheme: dark) {
+  body.theme-system .s-btn.s-btn__danger {
+    --_bu-bg-disabled: var(--red-300);
+    --_bu-badge-fc-disabled: var(--black-050);
+    --_bu-badge-bg-disabled: var(--red-400);
+  }
+}
+body.theme-dark .s-btn.s-btn__danger,
+.theme-dark__forced .s-btn.s-btn__danger,
+body.theme-system .theme-dark__forced .s-btn.s-btn__danger {
+  --_bu-bg-disabled: var(--red-300);
+  --_bu-badge-fc-disabled: var(--black-050);
+  --_bu-badge-bg-disabled: var(--red-400);
+}
+body.theme-highcontrast .s-btn.s-btn__danger {
+  --_bu-fc-disabled: var(--black-300);
+  --_bu-badge-bg-disabled: var(--red-100);
+  --_bu-badge-fc-disabled: var(--black-300);
+}
+@media (prefers-color-scheme: dark) {
+  body.theme-highcontrast.theme-system .s-btn.s-btn__danger {
+    --_bu-bg-disabled: var(--red-300);
+    --_bu-fc-disabled: var(--black-050);
+    --_bu-badge-fc-disabled: var(--black-050);
+    --_bu-badge-bg-disabled: var(--red-400);
+  }
+}
+body.theme-highcontrast.theme-dark .s-btn.s-btn__danger {
+  --_bu-bg-disabled: var(--red-300);
+  --_bu-fc-disabled: var(--black-050);
+  --_bu-badge-fc-disabled: var(--black-050);
+  --_bu-badge-bg-disabled: var(--red-400);
+}
 .s-btn.s-btn__danger.s-btn__clear {
   --_bu-bg: transparent;
   --_bu-bg-disabled: var(--_bu-bg);
@@ -1392,9 +1432,39 @@ body.theme-highcontrast .s-btn:not(.s-btn__danger):not(.s-btn__featured):not(.s-
   --_bu-badge-bg-disabled: var(--red-100);
   --_bu-badge-fc-disabled: var(--red-300);
 }
+@media (prefers-color-scheme: dark) {
+  body.theme-system .s-btn.s-btn__danger.s-btn__clear {
+    --_bu-bg-disabled: var(--_bu-bg);
+    --_bu-fc-disabled: var(--red-300);
+    --_bu-badge-bg-disabled: var(--red-100);
+    --_bu-badge-fc-disabled: var(--red-400);
+  }
+}
+body.theme-dark .s-btn.s-btn__danger.s-btn__clear,
+.theme-dark__forced .s-btn.s-btn__danger.s-btn__clear,
+body.theme-system .theme-dark__forced .s-btn.s-btn__danger.s-btn__clear {
+  --_bu-bg-disabled: var(--_bu-bg);
+  --_bu-fc-disabled: var(--red-300);
+  --_bu-badge-bg-disabled: var(--red-100);
+  --_bu-badge-fc-disabled: var(--red-400);
+}
 body.theme-highcontrast .s-btn.s-btn__danger.s-btn__clear {
   --_bu-bc: var(--red-600);
-  --_bu-bc-disabled: var(--red-300);
+  --_bu-bc-disabled: var(--black-300);
+}
+@media (prefers-color-scheme: dark) {
+  body.theme-highcontrast.theme-system .s-btn.s-btn__danger.s-btn__clear {
+    --_bu-bg-disabled: var(--black-050);
+    --_bu-fc-disabled: var(--red-300);
+    --_bu-badge-bg-disabled: var(--red-100);
+    --_bu-badge-fc-disabled: var(--red-300);
+  }
+}
+body.theme-highcontrast.theme-dark .s-btn.s-btn__danger.s-btn__clear {
+  --_bu-bg-disabled: var(--black-050);
+  --_bu-fc-disabled: var(--red-300);
+  --_bu-badge-bg-disabled: var(--red-100);
+  --_bu-badge-fc-disabled: var(--red-300);
 }
 .s-btn.s-btn__featured {
   --_bu-bg: var(--purple-400);
@@ -1408,6 +1478,39 @@ body.theme-highcontrast .s-btn.s-btn__danger.s-btn__clear {
   --_bu-badge-bg-disabled: var(--purple-300);
   --_bu-badge-fc-disabled: var(--black-100);
 }
+@media (prefers-color-scheme: dark) {
+  body.theme-system .s-btn.s-btn__featured {
+    --_bu-bg-disabled: var(--purple-100);
+    --_bu-fc-disabled: var(--purple-400);
+    --_bu-badge-fc-disabled: var(--purple-400);
+    --_bu-badge-bg-disabled: var(--purple-200);
+  }
+}
+body.theme-dark .s-btn.s-btn__featured,
+.theme-dark__forced .s-btn.s-btn__featured,
+body.theme-system .theme-dark__forced .s-btn.s-btn__featured {
+  --_bu-bg-disabled: var(--purple-100);
+  --_bu-fc-disabled: var(--purple-400);
+  --_bu-badge-fc-disabled: var(--purple-400);
+  --_bu-badge-bg-disabled: var(--purple-200);
+}
+body.theme-highcontrast .s-btn.s-btn__featured {
+  --_bu-fc-disabled: var(--black-300);
+  --_bu-badge-fc-disabled: var(--black-300);
+  --_bu-badge-bg-disabled: var(--purple-200);
+}
+@media (prefers-color-scheme: dark) {
+  body.theme-highcontrast.theme-system .s-btn.s-btn__featured {
+    --_bu-fc-disabled: var(--purple-400);
+    --_bu-badge-bg-disabled: var(--purple-200);
+    --_bu-badge-fc-disabled: var(--purple-400);
+  }
+}
+body.theme-highcontrast.theme-dark .s-btn.s-btn__featured {
+  --_bu-fc-disabled: var(--purple-400);
+  --_bu-badge-bg-disabled: var(--purple-200);
+  --_bu-badge-fc-disabled: var(--purple-400);
+}
 .s-btn.s-btn__tonal {
   --_bu-bg: var(--black-150);
   --_bu-bg-disabled: var(--black-100);
@@ -1419,10 +1522,11 @@ body.theme-highcontrast .s-btn.s-btn__danger.s-btn__clear {
   --_bu-badge-bg: var(--black-200);
   --_bu-badge-fc: var(--black-600);
   --_bu-badge-bg-disabled: var(--black-100);
-  --_bu-badge-fc-disabled: var(--black-350);
+  --_bu-badge-fc-disabled: var(--black-300);
 }
 body.theme-highcontrast .s-btn.s-btn__tonal {
-  --_bu-bc: var(--black-300);
+  --_bu-bc: var(--black-400);
+  --_bu-bc-disabled: var(--black-300);
 }
 .s-btn.s-btn__facebook {
   --_bu-bg: #1877F2;
@@ -3718,469 +3822,248 @@ body.theme-system .theme-dark__forced .s-popover {
   padding: var(--su12);
 }
 .s-post-summary {
-  --_ps-bb: var(--su1) solid var(--bc-light);
-  --_ps-bg: unset;
-  --_ps-o: unset;
-  --_ps-content-excerpt-fc: var(--_ps-state-fc, var(--fc-medium));
-  --_ps-content-title-a-fc: var(--_ps-state-fc, var(--theme-post-title-color, var(--theme-link-color, var(--theme-secondary))));
-  --_ps-content-title-a-fc-hover: var(--_ps-state-fc, var(--theme-post-title-color-hover, var(--theme-link-color-hover, var(--theme-secondary-500))));
-  --_ps-content-title-a-fc-visited: var(--_ps-state-fc, var(--theme-post-title-color-visited, var(--theme-link-color-visited, var(--purple-500))));
-  --_ps-content-title-a-fc-hover-visited: var(--_ps-state-fc, var(--theme-post-title-color-hover, var(--theme-link-color-hover, var(--purple-600))));
-  --_ps-stats-ai: flex-end;
-  --_ps-stats-fc: var(--_ps-state-fc, var(--fc-light));
-  --_ps-stats-fd: column;
-  --_ps-stats-w: calc(var(--su96) + var(--su12));
-  --_ps-has-answers-bc: var(--green-400);
-  --_ps-has-answers-bg: unset;
-  --_ps-has-answers-fc: var(--green-400);
-  --_ps-has-accepted-answers-bc: var(--green-400);
-  --_ps-has-accepted-answers-bg: var(--green-400);
-  --_ps-has-accepted-answers-fc: var(--white);
-  --_ps-stats-item-emphasized-fc: var(--_ps-state-fc, var(--fc-dark));
-  background-color: var(--_ps-bg);
-  border-bottom: var(--_ps-bb);
+  --_ps-answer-icon-fc: unset;
+  --_ps-content-type-bc: var(--black-200);
+  --_ps-content-type-bg: var(--black-050);
+  --_ps-content-type-fc: var(--black-600);
+  --_ps-stats-answers-bg: unset;
+  --_ps-stats-answers-fc: var(--black-400);
+  --_ps-stats-answers-fw: unset;
+  --_ps-stats-answers-icon-fc: unset;
+  --_ps-title-link-fc: var(--theme-secondary-600);
+  container-type: inline-size;
+  container-name: post-summary;
+  color: var(--black-500);
   display: flex;
-  padding: var(--su16);
+  gap: var(--su16);
   position: relative;
-}
-@media (max-width: 71.875rem) {
-  .s-post-summary {
-    --_ps-stats-ai: center;
-    --_ps-stats-fd: row;
-    --_ps-stats-w: auto;
-    flex-direction: column;
-  }
-}
-.s-post-summary.s-post-summary__minimal,
-.s-post-summary .s-post-summary--answer {
-  --_ps-stats-ai: center;
-  --_ps-stats-fd: row;
-  --_ps-stats-w: auto;
-}
-.s-post-summary.s-post-summary__minimal {
-  flex-direction: column;
-}
-.s-post-summary.s-post-summary__minimal .s-post-summary--content {
   width: 100%;
 }
-.s-post-summary.s-post-summary__deleted,
-.s-post-summary.s-post-summary__ignored {
-  --_ps-o: 0.75;
-  --_ps-has-answers-bc: var(--black-350);
-  --_ps-has-answers-bg: transparent;
-  --_ps-has-answers-fc: var(--_ps-state-fc);
-  --_ps-has-accepted-answers-bc: transparent;
-  --_ps-has-accepted-answers-bg: var(--black-150);
-  --_ps-has-accepted-answers-fc: var(--_ps-state-fc);
-  --_ps-meta-tags-tag-bg: var(--black-150);
-  --_ps-meta-tags-tag-fc: var(--_ps-state-fc);
-  --_ps-state-fc: var(--black-400);
-}
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags a,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags a,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .post-tag,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .post-tag,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .s-tag,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .s-tag,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags a:active,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags a:active,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .post-tag:active,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .post-tag:active,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .s-tag:active,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .s-tag:active,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags a:hover,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags a:hover,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .post-tag:hover,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .post-tag:hover,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .s-tag:hover,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .s-tag:hover,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags a:focus,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags a:focus,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .post-tag:focus,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .post-tag:focus,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .s-tag:focus,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .s-tag:focus,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags a .focus-bordered,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags a .focus-bordered,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .post-tag .focus-bordered,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .post-tag .focus-bordered,
-.s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .s-tag .focus-bordered,
-.s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .s-tag .focus-bordered {
-  background-color: var(--_ps-meta-tags-tag-bg);
-  color: var(--black-500);
-  border-color: var(--black-300);
-}
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags a,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags a,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .post-tag,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .post-tag,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .s-tag,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .s-tag,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags a:active,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags a:active,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .post-tag:active,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .post-tag:active,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .s-tag:active,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .s-tag:active,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags a:hover,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags a:hover,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .post-tag:hover,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .post-tag:hover,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .s-tag:hover,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .s-tag:hover,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags a:focus,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags a:focus,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .post-tag:focus,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .post-tag:focus,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .s-tag:focus,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .s-tag:focus,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags a .focus-bordered,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags a .focus-bordered,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .post-tag .focus-bordered,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .post-tag .focus-bordered,
-body.theme-highcontrast .s-post-summary.s-post-summary__deleted .s-post-summary--meta-tags .s-tag .focus-bordered,
-body.theme-highcontrast .s-post-summary.s-post-summary__ignored .s-post-summary--meta-tags .s-tag .focus-bordered {
-  border-color: currentColor;
+body.theme-highcontrast .s-post-summary__deleted * {
+  --_ps-ignored-fc: var(--black-500);
 }
-.s-post-summary.s-post-summary__deleted .s-user-card a,
-.s-post-summary.s-post-summary__ignored .s-user-card a,
-.s-post-summary.s-post-summary__deleted .s-user-card .s-user-card--link,
-.s-post-summary.s-post-summary__ignored .s-user-card .s-user-card--link,
-.s-post-summary.s-post-summary__deleted .s-user-card .s-user-card--rep,
-.s-post-summary.s-post-summary__ignored .s-user-card .s-user-card--rep,
-.s-post-summary.s-post-summary__deleted .s-user-card .s-user-card--time,
-.s-post-summary.s-post-summary__ignored .s-user-card .s-user-card--time {
-  color: var(--_ps-state-fc);
+@container post-summary (width <= 28rem) {
+  .s-post-summary .s-post-summary--sm-hide {
+    display: none !important;
+  }
+  .s-post-summary .s-post-summary--sm-show {
+    display: flex !important;
+  }
 }
-.s-post-summary.s-post-summary__deleted .s-user-card .s-badge,
-.s-post-summary.s-post-summary__ignored .s-user-card .s-badge {
-  filter: grayscale(100%);
+@container post-summary (width > 28rem) {
+  .s-post-summary .s-post-summary--sm-hide {
+    display: flex !important;
+  }
+  .s-post-summary .s-post-summary--sm-show {
+    display: none !important;
+  }
+}
+.s-post-summary.s-post-summary__answered {
+  --_ps-stats-answers-bg: var(--green-400);
+  --_ps-stats-answers-fc: var(--white);
+  --_ps-stats-answers-fw: 600;
+  --_ps-stats-answers-icon-fc: var(--green-400);
 }
 .s-post-summary.s-post-summary__deleted,
-.s-post-summary.s-post-summary__watched {
-  background-color: var(--_ps-bg);
+.s-post-summary:has(.s-tag.s-tag__ignored) {
+  --_ps-ignored-bg: var(--black-100);
+  --_ps-ignored-fc: var(--black-400);
+}
+.s-post-summary.s-post-summary__deleted.s-post-summary__answered,
+.s-post-summary:has(.s-tag.s-tag__ignored).s-post-summary__answered {
+  --_ps-stats-answers-bg: var(--_ps-ignored-bg);
+  --_ps-stats-answers-fc: var(--_ps-ignored-fc);
+  --_ps-stats-answers-icon-fc: var(--black-350);
+}
+.s-post-summary.s-post-summary__deleted *,
+.s-post-summary:has(.s-tag.s-tag__ignored) * {
+  color: var(--_ps-ignored-fc) !important;
+}
+.s-post-summary.s-post-summary__deleted .s-avatar,
+.s-post-summary:has(.s-tag.s-tag__ignored) .s-avatar {
+  opacity: 0.5;
+}
+.s-post-summary.s-post-summary__deleted .s-user-card--rep .s-bling:before,
+.s-post-summary:has(.s-tag.s-tag__ignored) .s-user-card--rep .s-bling:before {
+  background-color: var(--_ps-ignored-fc) !important;
+}
+.s-post-summary.s-post-summary__deleted .s-badge,
+.s-post-summary:has(.s-tag.s-tag__ignored) .s-badge,
+.s-post-summary.s-post-summary__deleted .s-tag,
+.s-post-summary:has(.s-tag.s-tag__ignored) .s-tag,
+.s-post-summary.s-post-summary__deleted .s-post-summary--stats-bounty,
+.s-post-summary:has(.s-tag.s-tag__ignored) .s-post-summary--stats-bounty {
+  background-color: var(--_ps-ignored-bg) !important;
+  border-color: var(--_ps-ignored-bg) !important;
+  color: var(--_ps-ignored-fc) !important;
 }
 .s-post-summary.s-post-summary__deleted {
-  --_ps-bg: var(--red-100);
-  --_ps-has-accepted-answers-bg: var(--black-200);
-  --_ps-has-accepted-answers-fc: var(--black-500);
-  --_ps-meta-tags-tag-bg: var(--black-200);
+  background-color: var(--red-100);
+  border: var(--su8) solid var(--red-100);
 }
-.s-post-summary.s-post-summary__deleted .is-deleted,
-.s-post-summary.s-post-summary__deleted .s-badge__danger.s-badge__filled {
-  background-color: var(--red-500);
+.s-post-summary .s-tag.s-tag__watched {
+  --_ta-bc: var(--yellow-200);
+  --_ta-bg: var(--yellow-200);
+  --_ta-fc: var(--yellow-600);
+  --_ta-bc-hover: var(--yellow-200);
+  --_ta-bg-hover: var(--yellow-200);
 }
-@media (prefers-color-scheme: dark) {
-  body.theme-system .s-post-summary.s-post-summary__deleted .is-deleted,
-  body.theme-system .s-post-summary.s-post-summary__deleted .s-badge__danger.s-badge__filled {
-    background-color: var(--red-600);
-    color: var(--white);
-  }
-}
-body.theme-dark .s-post-summary.s-post-summary__deleted .is-deleted,
-body.theme-dark .s-post-summary.s-post-summary__deleted .s-badge__danger.s-badge__filled,
-.theme-dark__forced .s-post-summary.s-post-summary__deleted .is-deleted,
-.theme-dark__forced .s-post-summary.s-post-summary__deleted .s-badge__danger.s-badge__filled,
-body.theme-system .theme-dark__forced .s-post-summary.s-post-summary__deleted .is-deleted,
-body.theme-system .theme-dark__forced .s-post-summary.s-post-summary__deleted .s-badge__danger.s-badge__filled {
-  background-color: var(--red-600);
-  color: var(--white);
-}
-.s-post-summary.s-post-summary__watched:not(.s-post-summary__deleted):not(.s-post-summary__ignored) {
-  --_ps-bg: var(--yellow-100);
-  --_ps-stats-fc: var(--black-400);
-  --_ps-content-title-a-fc: var(--theme-post-title-color, var(--theme-link-color, var(--theme-secondary)));
-  --_ps-content-title-a-fc-hover: var(--theme-post-title-color-hover, var(--theme-link-color-hover, var(--theme-secondary-500)));
-  --_ps-content-title-a-fc-visited: var(--theme-post-title-color-visited, var(--theme-link-color-visited, var(--purple-500)));
-  --_ps-content-title-a-fc-hover-visited: var(--theme-post-title-color-hover, var(--theme-link-color-hover, var(--purple-600)));
-}
-.s-post-summary.s-post-summary__watched:not(.s-post-summary__deleted):not(.s-post-summary__ignored) .s-user-card a {
-  color: var(--_ps-content-title-a-fc);
-}
-.s-post-summary.s-post-summary__watched:not(.s-post-summary__deleted):not(.s-post-summary__ignored) .s-user-card a:active,
-.s-post-summary.s-post-summary__watched:not(.s-post-summary__deleted):not(.s-post-summary__ignored) .s-user-card a:hover {
-  color: var(--_ps-content-title-a-fc-hover);
-}
-.s-post-summary.s-post-summary__watched:not(.s-post-summary__deleted):not(.s-post-summary__ignored) .s-user-card a:visited {
-  color: var(--_ps-content-title-a-fc-visited);
-}
-.s-post-summary.s-post-summary__watched:not(.s-post-summary__deleted):not(.s-post-summary__ignored) .s-user-card a:visited:hover {
-  color: var(--_ps-content-title-a-fc-hover-visited);
-}
-.s-post-summary.s-post-summary__watched:not(.s-post-summary__deleted):not(.s-post-summary__ignored) .s-user-card .s-user-card--rep,
-.s-post-summary.s-post-summary__watched:not(.s-post-summary__deleted):not(.s-post-summary__ignored) .s-user-card .s-user-card--time {
-  color: var(--black-500);
-}
-.s-post-summary:last-child {
-  --_ps-bb: none;
+.s-post-summary .s-post-summary--answers {
+  display: flex;
+  flex-direction: column;
+  gap: var(--su16);
+  padding-top: calc(var(--su8) + var(--su2));
 }
 .s-post-summary .s-post-summary--answer {
-  margin: var(--su16) 1em 0 1em;
-  padding: 0.5em 0 0.5em calc(1em + var(--su4));
-  position: relative;
-}
-.s-post-summary .s-post-summary--answer + .s-post-summary .s-post-summary--answer {
-  margin-top: var(--su16);
-}
-.s-post-summary .s-post-summary--answer:before {
-  background: var(--black-250);
-  border-radius: var(--su8);
-  bottom: 0;
-  content: "";
-  display: block;
-  left: 0;
-  position: absolute;
-  top: 0;
-  width: var(--su4);
+  border-left: var(--su4) solid var(--black-200);
+  display: flex;
+  flex-direction: column;
+  gap: var(--su6);
+  padding-left: var(--su8);
 }
-body.theme-highcontrast .s-post-summary .s-post-summary--answer:before {
-  background: var(--black-500);
+.s-post-summary .s-post-summary--answer__accepted {
+  --_ps-answer-icon-fc: var(--green-400);
 }
-.s-post-summary .s-post-summary--answer-excerpt {
-  display: -webkit-box;
-  -webkit-line-clamp: 4;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  color: var(--black-500);
-  margin-bottom: var(--su8);
+.s-post-summary .s-post-summary--answer .s-post-summary--stats-answers--icon {
+  color: var(--_ps-answer-icon-fc);
 }
 .s-post-summary .s-post-summary--content {
-  flex-grow: 1;
-  max-width: 100%;
-}
-.s-post-summary .s-post-summary--content > *:not(.s-post-summary--content-menu-button):not(.s-post-summary--meta):not(.s-popover) {
-  opacity: var(--_ps-o);
-}
-.s-post-summary .s-post-summary--content-excerpt {
-  /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */
-  word-break: break-word !important;
-  overflow-wrap: break-word !important;
-  -webkit-hyphens: auto !important;
-  -moz-hyphens: auto !important;
-  -ms-hyphens: auto !important;
-  hyphens: auto !important;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  color: var(--_ps-content-excerpt-fc);
-  font-family: var(--theme-post-body-font-family, var(--theme-body-font-family));
-  margin-top: var(--sun2);
-  margin-bottom: var(--su8);
-}
-.s-post-summary .s-post-summary--content-excerpt.s-post-summary--content-excerpt__sm {
-  display: -webkit-box;
-  -webkit-line-clamp: 1;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-}
-.s-post-summary .s-post-summary--content-excerpt.s-post-summary--content-excerpt__md {
-  display: -webkit-box;
-  -webkit-line-clamp: 3;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-}
-.s-post-summary .s-post-summary--content-excerpt.s-post-summary--content-excerpt__lg {
-  display: -webkit-box;
-  -webkit-line-clamp: 4;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-}
-.s-post-summary .s-post-summary--content-menu-button {
-  right: var(--su8);
-  top: var(--su8);
-}
-.s-post-summary .s-post-summary--content-menu-button .svg-icon {
-  margin: 0 !important;
-}
-.s-post-summary .s-post-summary--content-menu-button,
-.s-post-summary .s-post-summary--content-menu-button.s-btn {
-  padding: var(--su8);
-  position: absolute;
-}
-.s-post-summary .s-post-summary--content-title {
-  /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */
-  word-break: break-word !important;
-  overflow-wrap: break-word !important;
-  -webkit-hyphens: auto !important;
-  -moz-hyphens: auto !important;
-  -ms-hyphens: auto !important;
-  hyphens: auto !important;
-  display: block;
-  font-size: var(--fs-body3);
-  font-weight: normal;
-  line-height: var(--lh-md);
-  margin-bottom: 0.3365rem;
-  margin-top: -0.125rem;
-  padding-right: var(--su24);
-}
-.s-post-summary .s-post-summary--content-title a {
-  /* stylelint-disable-next-line declaration-property-value-keyword-no-deprecated */
-  word-break: break-word !important;
-  overflow-wrap: break-word !important;
-  -webkit-hyphens: auto !important;
-  -moz-hyphens: auto !important;
-  -ms-hyphens: auto !important;
-  hyphens: auto !important;
-  color: var(--_ps-content-title-a-fc);
-  font-family: var(--theme-post-title-font-family, var(--theme-body-font-family));
-}
-.s-post-summary .s-post-summary--content-title a:active,
-.s-post-summary .s-post-summary--content-title a:hover {
-  color: var(--_ps-content-title-a-fc-hover);
-}
-.s-post-summary .s-post-summary--content-title a:visited {
-  color: var(--_ps-content-title-a-fc-visited);
-}
-.s-post-summary .s-post-summary--content-title a:visited:hover {
-  color: var(--_ps-content-title-a-fc-hover-visited);
-}
-.s-post-summary .s-post-summary--content-title .iconShield {
-  color: var(--fc-light);
-}
-.s-post-summary .s-post-summary--content-title .svg-icon {
-  position: relative;
-  top: var(--sun1);
-  vertical-align: text-bottom;
-}
-.s-post-summary .s-post-summary--content-type {
-  color: var(--fc-medium);
-  margin-bottom: var(--su4);
-}
-.s-post-summary .s-post-summary--content-type .svg-icon {
-  color: var(--fc-light);
-  margin-left: var(--sun2);
+  display: flex;
+  flex-direction: column;
+  gap: var(--su4);
+  width: 100%;
 }
-.s-post-summary .s-post-summary--meta {
+.s-post-summary .s-post-summary--content-meta {
   align-items: center;
-  column-gap: var(--su6);
+  color: var(--black-400);
   display: flex;
   flex-wrap: wrap;
-  justify-content: space-between;
-  row-gap: var(--su8);
-}
-.s-post-summary .s-post-summary--meta > *:not(.s-post-summary--meta-tags):not(.s-user-card) > * {
-  opacity: var(--_ps-o);
-}
-.s-post-summary .s-post-summary--meta .s-user-card {
-  flex-wrap: wrap;
-  justify-content: flex-end;
-  margin-left: auto;
-}
-.s-post-summary .s-post-summary--meta .s-user-card > *:not(.magic-popup) {
-  opacity: var(--_ps-o);
+  font-size: var(--fs-caption);
+  gap: var(--su6);
+  margin-bottom: var(--su4);
 }
-.s-post-summary .s-post-summary--meta-tags {
+.s-post-summary .s-post-summary--content-type {
+  border: var(--su-static1) solid var(--_ps-content-type-bc);
+  background-color: var(--_ps-content-type-bg);
+  color: var(--_ps-content-type-fc);
   display: flex;
-  flex-wrap: wrap;
+  align-items: center;
   gap: var(--su4);
+  padding: 0 var(--su4);
+  font-size: var(--fs-caption);
+}
+.s-post-summary .s-post-summary--content-type:focus-visible {
+  box-shadow: 0 0 0 var(--su-static2) var(--focus-neutral), 0 0 0 var(--su-static4) var(--focus-theme);
+  outline: var(--su-static2) solid transparent !important;
 }
-.s-post-summary .s-post-summary--meta-tags > ul > li > a,
-.s-post-summary .s-post-summary--meta-tags > a,
-.s-post-summary .s-post-summary--meta-tags .post-tag,
-.s-post-summary .s-post-summary--meta-tags .s-tag {
-  opacity: var(--_ps-o);
+.s-post-summary .s-post-summary--content-type:hover {
+  --_ps-content-type-bc: var(--black-150);
+  --_ps-content-type-bg: var(--black-100);
+  --_ps-content-type-fc: var(--black-600);
+}
+.s-post-summary .s-post-summary--excerpt {
+  line-height: 1.25rem;
+  margin-bottom: 0;
 }
 .s-post-summary .s-post-summary--stats {
-  align-items: var(--_ps-stats-ai);
-  color: var(--_ps-stats-fc);
-  flex-direction: var(--_ps-stats-fd);
-  width: var(--_ps-stats-w);
   display: flex;
-  flex-shrink: 0;
-  flex-wrap: wrap;
-  font-size: var(--fs-body1);
   gap: var(--su6);
-  margin-bottom: var(--su4);
-  margin-right: var(--su16);
+  font-size: var(--fs-caption);
 }
-.s-post-summary .s-post-summary--stats > *:not(.s-badge__danger) {
-  opacity: var(--_ps-o);
+.s-post-summary .s-post-summary--stats.s-post-summary--sm-hide {
+  flex-direction: column;
 }
-.s-post-summary .s-post-summary--stats-item:not(.s-badge) {
+.s-post-summary .s-post-summary--stats.s-post-summary--sm-hide .s-post-summary--stats-answers {
+  background-color: var(--_ps-stats-answers-bg);
+  color: var(--_ps-stats-answers-fc);
+  font-weight: var(--_ps-stats-answers-fw);
   align-items: center;
-  border: var(--su1) solid transparent;
-  display: inline-flex;
-  gap: 0.3em;
+  display: flex;
+  gap: var(--su4);
   justify-content: center;
-  white-space: nowrap;
+  padding: var(--su4);
 }
-.s-post-summary .s-post-summary--stats-item:not(.s-badge).is-deleted {
+.s-post-summary .s-post-summary--stats.s-post-summary--sm-hide .s-post-summary--stats-bounty {
+  align-items: center;
+  background-color: var(--blue-400);
   color: var(--white);
+  display: flex;
+  gap: var(--su2);
+  font-weight: 600;
+  justify-content: center;
+  padding: var(--su4);
 }
-.s-post-summary .s-post-summary--stats-item.s-badge {
-  font-size: var(--fs-body1);
-  line-height: var(--lh-md);
-  padding: var(--su2) var(--su4);
-}
-.s-post-summary .s-post-summary--stats-item.has-answers,
-.s-post-summary .s-post-summary--stats-item.has-bounty,
-.s-post-summary .s-post-summary--stats-item.is-archived,
-.s-post-summary .s-post-summary--stats-item.is-closed,
-.s-post-summary .s-post-summary--stats-item.is-deleted,
-.s-post-summary .s-post-summary--stats-item.is-draft,
-.s-post-summary .s-post-summary--stats-item.is-pinned,
-.s-post-summary .s-post-summary--stats-item.is-published,
-.s-post-summary .s-post-summary--stats-item.is-review {
-  border-radius: var(--br-md);
-  padding: var(--su2) var(--su4);
+.s-post-summary .s-post-summary--stats.s-post-summary--sm-hide .s-post-summary--stats-votes {
+  align-items: center;
+  aspect-ratio: 1/1;
+  border: var(--su1) solid var(--black-200);
+  display: flex;
+  justify-content: center;
+  font-size: var(--fs-body2);
+  font-weight: 600;
+  margin-bottom: var(--su2);
+  padding: var(--su4);
+  width: calc(var(--su48) + var(--su8));
 }
-.s-post-summary .s-post-summary--stats-item.has-answers {
-  background-color: var(--_ps-has-answers-bg);
-  border: var(--su1) solid var(--_ps-has-answers-bc);
-  color: var(--_ps-has-answers-fc);
+.s-post-summary .s-post-summary--stats.s-post-summary--sm-show {
+  align-items: center;
+  justify-content: center;
+  padding: var(--su4);
 }
-.s-post-summary .s-post-summary--stats-item.has-answers.has-accepted-answer {
-  background-color: var(--_ps-has-accepted-answers-bg);
-  border-color: var(--_ps-has-accepted-answers-bc);
-  color: var(--_ps-has-accepted-answers-fc);
+.s-post-summary .s-post-summary--stats.s-post-summary--sm-show .s-post-summary--stats-answers--icon {
+  color: var(--_ps-stats-answers-icon-fc);
 }
-.s-post-summary .s-post-summary--stats-item.has-bounty {
-  background-color: var(--blue-500);
+.s-post-summary .s-post-summary--stats .s-post-summary--stats-bounty {
+  align-items: center;
+  justify-content: center;
+  background-color: var(--blue-400);
   color: var(--white);
+  display: flex;
+  gap: var(--su1);
+  padding: 0 calc(var(--su4) - var(--su1));
 }
-.s-post-summary .s-post-summary--stats-item.is-warm {
-  color: var(--_ps-state-fc, var(--yellow-500));
-}
-.s-post-summary .s-post-summary--stats-item.is-hot {
-  color: var(--_ps-state-fc, var(--orange-500));
-}
-.s-post-summary .s-post-summary--stats-item.is-supernova {
-  color: var(--_ps-state-fc, var(--red-500));
+.s-post-summary .s-post-summary--stats-item {
+  align-items: center;
+  display: flex;
+  gap: var(--su6);
 }
-.s-post-summary .s-post-summary--stats-item.is-archived {
-  background-color: var(--black-225);
-  border-color: var(--black-500);
-  color: var(--black-600);
+.s-post-summary .s-post-summary--stats-item:before {
+  aspect-ratio: 1/1;
+  background-color: var(--black-300);
+  content: "";
+  display: block;
+  height: var(--su4);
 }
-.s-post-summary .s-post-summary--stats-item.is-closed {
-  background-color: var(--red-300);
-  border-color: var(--red-500);
-  color: var(--red-600);
+.s-post-summary .s-post-summary--tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--su8);
+  margin-top: var(--su6);
 }
-.s-post-summary .s-post-summary--stats-item.is-draft {
-  background-color: var(--blue-300);
-  border-color: var(--blue-500);
-  color: var(--blue-600);
+.s-post-summary .s-post-summary--title {
+  display: flex;
+  gap: var(--su6);
+  line-height: 1.563rem;
 }
-.s-post-summary .s-post-summary--stats-item.is-pinned {
-  background-color: var(--black-500);
-  color: var(--white);
+.s-post-summary .s-post-summary--title-link {
+  color: var(--_ps-title-link-fc);
+  display: flex;
+  font-size: var(--fs-body3);
+  font-weight: 600;
+  gap: var(--su4);
+  margin-top: var(--su2);
 }
-.s-post-summary .s-post-summary--stats-item.is-published {
-  background-color: var(--black-150);
-  color: var(--black-600);
+.s-post-summary .s-post-summary--title-link:hover {
+  --_ps-title-link-fc: var(--theme-secondary-500);
 }
-.s-post-summary .s-post-summary--stats-item.is-review {
-  background-color: var(--yellow-300);
-  border-color: var(--yellow-500);
-  color: var(--yellow-600);
+.s-post-summary .s-post-summary--title-link:hover:visited {
+  color: var(--theme-secondary-600);
 }
-.s-post-summary .s-post-summary--stats-item__emphasized {
-  color: var(--_ps-stats-item-emphasized-fc);
+.s-post-summary .s-post-summary--title-link:visited {
+  color: var(--theme-secondary-400);
 }
-.s-post-summary .s-post-summary--stats-item-number {
-  font-weight: 500;
+.s-post-summary .s-post-summary--title-icon {
+  flex-shrink: 0;
 }
 .s-progress {
   --_pr-bar: var(--br-md);