feat(frontend): deepen single post 1:1 parity with Zibll

Split related style/source settings, add subtitle/meta/allow-view helpers, align cover/author/tags/pay shell markup and CSS with Zibll single.

assets/css/frontend/breadcrumb.css

@@ -1,5 +1,7 @@
 /* ========== 面包屑导航 — 对齐 zibll breadcrumb ========== */
-.breadcrumb-nav {
+.breadcrumb-nav,
+ul.breadcrumb,
+.breadcrumbs-wrap {
   font-size: 13px;
   padding: 0 8px;
   margin-bottom: 12px;
@@ -8,7 +10,9 @@
 }
 
 .breadcrumb-nav ol,
-.breadcrumb-nav ul {
+.breadcrumb-nav ul,
+ul.breadcrumb,
+.breadcrumbs.breadcrumb {
   list-style: none;
   margin: 0;
   padding: 0;
@@ -18,59 +22,85 @@
   gap: 0;
 }
 
-.breadcrumb-nav li {
+.breadcrumb-nav li,
+ul.breadcrumb > li,
+.breadcrumbs.breadcrumb > li {
   display: inline-flex;
   align-items: center;
 }
 
-.breadcrumb-nav li + li::before {
+/* Zibll flat ul.breadcrumb inserts parents with " </li><li> " — separators via content */
+.breadcrumb-nav li + li::before,
+ul.breadcrumb > li + li::before {
   content: '/';
-  padding: 0 0 0 6px;
+  padding: 0 6px 0 6px;
   opacity: 0.6;
 }
 
-.breadcrumb-nav a {
+.breadcrumbs.breadcrumb .breadcrumbs__sep {
+  padding: 0 6px;
+  opacity: 0.6;
+}
+
+.breadcrumb-nav a,
+ul.breadcrumb a,
+.breadcrumbs a {
   color: var(--color-ink-4, #999);
   text-decoration: none;
   transition: color 0.2s;
 }
 
-.breadcrumb-nav a:hover {
+.breadcrumb-nav a:hover,
+ul.breadcrumb a:hover,
+.breadcrumbs a:hover {
   color: var(--color-primary, #f04494);
 }
 
-.breadcrumb-nav .current {
+.breadcrumb-nav .current,
+ul.breadcrumb > li:last-child,
+.breadcrumbs__item.is-current {
   color: var(--color-ink-2, #4e5358);
   font-weight: 500;
 }
 
 .single-cover-con .breadcrumb-nav,
-.single-cover-con .breadcrumb {
+.single-cover-con .breadcrumb,
+.single-cover-con ul.breadcrumb,
+.post-breadcrumbs .breadcrumb {
   font-size: 13px;
   margin: 5px 0 0 -6px;
   opacity: unset;
+  padding: 0;
 }
 
 /* 封面内面包屑 */
-.single-cover-con .breadcrumb-nav {
-  color: rgba(255, 255, 255, 0.7);
+.single-cover-con .breadcrumb-nav,
+.single-cover-con ul.breadcrumb,
+.single-cover-con .breadcrumb {
+  color: rgba(255, 255, 255, 0.85);
 }
 
-.single-cover-con .breadcrumb-nav a {
-  color: rgba(255, 255, 255, 0.7);
+.single-cover-con .breadcrumb-nav a,
+.single-cover-con ul.breadcrumb a,
+.single-cover-con .breadcrumb a {
+  color: rgba(255, 255, 255, 0.85);
 }
 
-.single-cover-con .breadcrumb-nav a:hover {
+.single-cover-con .breadcrumb-nav a:hover,
+.single-cover-con ul.breadcrumb a:hover {
   color: #fff;
 }
 
-.single-cover-con .breadcrumb-nav .current {
+.single-cover-con .breadcrumb-nav .current,
+.single-cover-con ul.breadcrumb > li:last-child {
   color: #fff;
 }
 
 /* 移动端 */
 @media (max-width: 767px) {
-  .breadcrumb-nav {
+  .breadcrumb-nav,
+  ul.breadcrumb,
+  .breadcrumbs-wrap {
     font-size: 12px;
   }
 }