@xingwangzhe/stalux 1.31.2 → 1.31.3

package/README.md

@@ -291,3 +291,5 @@ Keep the TypeScript 6 alias for `astro check`, upgrade Vitest and its coverage p
 ## Style development and output
 
 Stalux precompiles its UnoCSS styles; consuming projects need no UnoCSS dependency or configuration. Shared CSS is a cacheable external stylesheet by default. Article/math, archive, category, tag and quote styles load with their components. Explicit Astro `build.inlineStylesheets: "always"` restores inline output. New utilities in consumer override components require the consumer’s own compiler. See [STYLING.md](./docs/STYLING.md) for maintenance and watch mode.
+
+Wide article pages use 280px sidebars within a layout up to 1920px wide, with 16px outer padding. Sidebars collapse below 1600px. UnoCSS remains the style builder; prose and integration styles use standard CSS, and build checks reject Tailwind variables and uncompiled directives.

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@xingwangzhe/stalux",
-    "version": "1.31.2",
+    "version": "1.31.3",
     "description": "A powerful, modern Astro blog theme — use as template or install as plugin",
     "keywords": [
         "astro",

package/src/styles/content.css

@@ -17,7 +17,7 @@
     .stalux-prose h4,
     .stalux-prose h5,
     .stalux-prose h6 {
-        @apply font-semibold;
+        font-weight: 600;
         color: var(--white-full);
         line-height: 1.3;
         margin-top: var(--space-xl);
@@ -25,7 +25,7 @@
     }
 
     .stalux-prose h1 {
-        @apply font-bold;
+        font-weight: 700;
         font-size: 2.6rem;
         line-height: 1.25;
         margin-top: 2.5rem;
@@ -79,12 +79,12 @@
     }
 
     .stalux-prose strong {
-        @apply font-semibold;
+        font-weight: 600;
         color: #ffd966;
     }
 
     .stalux-prose em {
-        @apply italic;
+        font-style: italic;
         color: var(--white-85p);
     }
 
@@ -98,7 +98,7 @@
     }
 
     .stalux-prose mark {
-        @apply text-inherit;
+        color: inherit;
         background-color: rgba(255, 217, 102, 0.25);
         padding: 0.1em 0.2em;
         border-radius: 2px;
@@ -121,7 +121,7 @@
     }
 
     .stalux-prose a {
-        @apply no-underline;
+        text-decoration: none;
         color: var(--accent-80p);
         border-bottom: 2px solid transparent;
         transition:
@@ -154,7 +154,7 @@
     }
 
     .stalux-prose pre {
-        @apply overflow-x-auto;
+        overflow-x: auto;
         background: var(--black-30p);
         color: var(--white-85p);
         padding: 1.2rem 1.5rem;
@@ -169,7 +169,8 @@
     }
 
     .stalux-prose pre code {
-        @apply text-inherit p-0;
+        color: inherit;
+        padding: 0;
         background: none;
         border: none;
         font-size: inherit;
@@ -228,7 +229,7 @@
     }
 
     .stalux-prose blockquote p {
-        @apply m-0;
+        margin: 0;
         line-height: 1.7;
     }
 
@@ -245,7 +246,10 @@
     }
 
     .stalux-prose table {
-        @apply w-full overflow-hidden block overflow-x-auto;
+        width: 100%;
+        overflow: hidden;
+        display: block;
+        overflow-x: auto;
         border-collapse: collapse;
         margin: var(--space-xl) 0;
         box-shadow: var(--shadow-md);
@@ -255,14 +259,15 @@
 
     .stalux-prose th,
     .stalux-prose td {
-        @apply text-left;
+        text-align: left;
         padding: 0.75rem 1rem;
         border-bottom: 1px solid var(--white-10p);
         line-height: 1.6;
     }
 
     .stalux-prose th {
-        @apply font-semibold whitespace-nowrap;
+        font-weight: 600;
+        white-space: nowrap;
         background: var(--accent-30p);
         color: var(--white-full);
         font-size: 0.95em;
@@ -286,7 +291,8 @@
     }
 
     .stalux-prose img {
-        @apply max-w-full block;
+        max-width: 100%;
+        display: block;
         height: auto;
         margin: var(--space-xl) auto;
         border-radius: 8px;
@@ -304,7 +310,8 @@
 
     .stalux-prose embed,
     .stalux-prose video {
-        @apply max-w-full block;
+        max-width: 100%;
+        display: block;
         height: auto;
         margin: var(--space-xl) auto;
         border-radius: 8px;
@@ -342,7 +349,8 @@
         box-sizing: border-box;
     }
     .stalux-prose summary {
-        @apply cursor-pointer font-semibold;
+        cursor: pointer;
+        font-weight: 600;
         color: var(--white-90p);
     }
 
@@ -353,12 +361,12 @@
     }
 
     .stalux-prose figure {
-        @apply text-center;
+        text-align: center;
         margin: var(--space-xl) 0;
     }
 
     .stalux-prose figcaption {
-        @apply italic;
+        font-style: italic;
         font-size: 0.9em;
         color: var(--white-70p);
         margin-top: 0.5rem;

package/src/styles/generated-article.css

@@ -1,3 +1,3 @@
 @layer theme, base, components, utilities;
-@layer components{.stalux-article{box-shadow:var(--surface-glass-shadow);box-sizing:border-box;background:var(--surface-glass);border-radius:18px;flex-direction:column;flex:1;width:100%;min-width:0;max-width:100%;min-height:100vh;padding:clamp(1rem,2vw,2rem);display:flex}.stalux-byline-author-bio{border-top:var(--border-thin) solid var(--white-10p);margin:var(--space-md) 0 0;width:100%;padding-top:var(--space-md);text-align:center;color:var(--white-70p);line-height:1.6;font-size:var(--font-size-small)}.stalux-byline-author-card{background:var(--black-05p);border-radius:var(--radius-lg);padding:var(--space-md);box-shadow:var(--card-box-shadow);flex-direction:column;display:flex}.stalux-license-box{border:var(--border-thin) solid var(--white-20p);margin:var(--space-lg) auto;border-radius:var(--radius-md);background-color:var(--black-10p);max-width:80%;padding:var(--space-lg);position:relative;overflow:hidden}.stalux-license-watermark{opacity:.15;transition:opacity var(--transition-normal);pointer-events:none;z-index:1;position:absolute;bottom:.5rem;right:.5rem}.stalux-pagination{border-top:var(--border-thin) solid var(--white-20p);border-bottom:var(--border-thin) solid var(--white-20p);margin:var(--space-lg) 0;width:100%;padding-top:var(--space-lg);padding-bottom:var(--space-lg)}.stalux-pagination-arrow{color:var(--white-70p);flex-shrink:0;justify-content:center;align-items:center;transition:translate .18s;display:flex}.stalux-pagination-label{margin-bottom:var(--space-xs);color:var(--accent-90p);font-weight:500;font-size:var(--font-size-small)}.stalux-pagination-link{background:var(--black-10p);outline:1px solid var(--white-10p);outline-offset:0;box-shadow:var(--shadow-sidebar);box-sizing:border-box;align-items:center;gap:var(--space-sm);border-radius:var(--radius-md);min-width:0;padding:var(--space-md);color:var(--white-90p);flex:1 1 0;text-decoration:none;transition:background-color .18s,outline-color .18s;display:flex;position:relative}.stalux-pagination-title{text-overflow:ellipsis;white-space:nowrap;max-width:100%;color:var(--white-90p);font-size:var(--font-size-base);overflow:hidden}.stalux-post-article-footer{border-top:1px solid var(--white-10p);margin-top:3rem;padding-top:2rem;animation:.22s .36s both stalux-post-content-reveal}.stalux-post-article-header{border-bottom:1px solid var(--white-10p);margin-bottom:3rem;padding-bottom:2rem;animation:.22s .36s both stalux-post-content-reveal}.stalux-post-body{box-sizing:border-box;flex:1;width:min(1200px,100%);min-width:0;max-width:100%;margin:0 auto;padding:0 0 2rem;animation:.22s .36s both stalux-post-content-reveal}.stalux-post-layout{box-sizing:border-box;flex:1;grid-template-columns:200px minmax(0,1fr) 200px;gap:1.5rem;width:100%;min-width:0;max-width:1696px;margin:0 auto;padding:1.5rem;display:grid}.stalux-post-meta-item{transition:color var(--transition-fast);align-items:center;gap:.5rem;display:inline-flex}.stalux-post-meta-row{flex-basis:100%;justify-content:center;display:flex}.stalux-post-metadata{color:#ffffffb3;flex-wrap:wrap;justify-content:center;gap:1.5rem;font-size:.95rem;display:flex}.stalux-post-page-stats{border-top:1px solid var(--white-10p);color:#ffffffb3;justify-content:center;align-items:center;gap:1rem;margin-top:1rem;padding-top:.8rem;font-size:.9rem;display:flex}.stalux-post-reading-time{align-items:center;gap:.3rem;display:inline-flex}.stalux-post-source-link{background:var(--white-10p);border-top:1px solid var(--white-20p);border-right:1px solid var(--white-20p);border-left:1px solid var(--white-20p);transition:background var(--transition-fast), transform var(--transition-fast);border-radius:var(--radius-full,999px);color:var(--white-full);border-bottom:0;align-items:center;gap:.4rem;padding:.5rem 1.1rem;font-size:.85rem;font-weight:500;text-decoration:none;display:inline-flex}.stalux-post-taxonomy-item-column{background:var(--white-05p);border-left:var(--border-thick) solid var(--accent-60p);transition:color var(--transition-medium), transform var(--transition-medium);border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:var(--space-sm) var(--space-xs);color:var(--white-80p);font-size:var(--font-size-small);text-decoration:none;display:inline-flex;transform:translate(0)}.stalux-post-taxonomy-item-pill{background:var(--white-10p);transition:color var(--transition-medium), transform var(--transition-medium);white-space:nowrap;border-radius:var(--radius-full);color:var(--white-85p);font-size:var(--font-size-smaller);border:none;padding:.4rem .8rem;text-decoration:none;display:inline-block;transform:translateY(0)}.stalux-post-taxonomy-title{border-bottom:var(--border-thin) solid var(--white-20p);padding-bottom:var(--space-sm);color:var(--white-90p);font-weight:600;font-size:var(--font-size-base);margin:0}.stalux-post-title{word-break:break-word;text-align:center;color:var(--white-full);text-shadow:var(--stalux-text-shadow);margin:0 0 1.5rem;font-size:2.5rem;font-weight:700;line-height:1.2}.stalux-random-container{transition:background-color .3s,border-color .3s}.stalux-random-header{border-bottom:2px solid #0000000d;justify-content:space-between;align-items:center;margin-bottom:1em;padding-bottom:.75em;display:flex}.stalux-random-list{flex-direction:column;gap:.75em;margin:0;padding:0;list-style-type:none;transition:opacity .3s;display:flex}.stalux-random-refresh{cursor:pointer;width:2em;height:2em;color:var(--foreground-60p,#333);background:0 0;border:none;border-radius:.375em;justify-content:center;align-items:center;padding:0;transition:color .2s;display:flex}.stalux-sidebar-container{box-shadow:var(--surface-glass-shadow);padding:var(--space-md);background:var(--surface-glass);border-radius:14px;flex-direction:column;transition:box-shadow .22s,background-color .22s;display:flex}.stalux-sidebar-right{scroll-padding-bottom:8rem}.stalux-toc-item{border-left:var(--border-thick) solid transparent;transition:color var(--transition-medium), background-color var(--transition-medium), border-left-color var(--transition-medium), transform var(--transition-medium);word-break:break-word;border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:var(--space-sm) var(--space-xs);color:var(--white-70p);line-height:1.4;font-size:var(--font-size-small);text-decoration:none;display:block}.stalux-toc-title{border-bottom:var(--border-thin) solid var(--white-20p);margin:0 0 var(--space-xs);padding-bottom:var(--space-sm);color:var(--white-90p);font-weight:600;font-size:var(--font-size-base)}.stalux-license-content{z-index:2;position:relative}.stalux-random-title{color:var(--foreground-60p,#333);margin:0;font-size:1.1em;font-weight:600}.stalux-toc-list{gap:var(--space-sm);flex-direction:column;margin:0;padding:0;list-style-type:none;display:flex}.stalux-license-title{margin-top:0;margin-bottom:var(--space-sm);color:var(--white-90p);font-size:var(--font-size-subtitle)}.stalux-post-source-link-row{justify-content:center;margin-top:1.2rem;display:flex}.stalux-byline-author-section{width:100%}.stalux-license-icon{justify-content:center;align-items:center;width:120px;height:120px;display:flex}.stalux-pagination-content{flex-direction:column;min-width:0;display:flex;overflow:hidden}.stalux-post-page{flex-direction:column;width:100%;min-height:100vh;display:flex}.stalux-byline-sidebar-container,.stalux-post-footer-content{gap:var(--space-lg);flex-direction:column;display:flex}.stalux-pagination-inner{justify-content:space-between;gap:var(--space-md);display:flex}.stalux-post-taxonomy-container{gap:var(--space-xs);flex-direction:column;display:flex}.stalux-post-taxonomy-list-column{flex-direction:column}.stalux-post-taxonomy-list-wrap{flex-wrap:wrap}.stalux-post-taxonomy-empty{padding:var(--space-md) 0;text-align:center;color:var(--white-50p);font-size:var(--font-size-small)}.stalux-random-error{color:var(--accent-60p,#e74c3c)}.stalux-toc-empty{color:var(--white-60p);font-size:var(--font-size-small)}.stalux-random-refresh:active{opacity:.7}.stalux-random-refresh svg{width:1em;height:1em}.stalux-random-refresh.stalux-random-rotating svg{animation:.6s linear stalux-random-spin}.stalux-random-loading,.stalux-random-error,.stalux-random-no-more{text-align:center;color:var(--foreground-60p,#666);padding:1em;font-size:.95em}.stalux-random-list>li>a{color:var(--foreground-60p,#333);word-break:break-word;background:0 0;border-radius:.375em;padding:.75em 1em;text-decoration:none;transition:color .2s,transform .2s;display:block}.stalux-random-list>li>a:active,.stalux-post-taxonomy-item-column:active,.stalux-post-taxonomy-item-pill:active{background:var(--white-05p)}.stalux-toc-item:active,.stalux-toc-item.stalux-toc-active{color:var(--accent-90p);background-color:var(--accent-20p);border-left-color:var(--accent-80p);font-weight:500}.stalux-toc-depth-1{padding-left:var(--space-xs)}.stalux-toc-depth-2{padding-left:var(--space-lg);font-size:var(--font-size-smaller)}.stalux-toc-depth-3{font-size:var(--font-size-tiny);padding-left:2.25rem}.stalux-toc-depth-4,.stalux-toc-depth-5,.stalux-toc-depth-6{padding-left:var(--space-2xl);color:var(--white-60p);font-size:.75rem}:is(.stalux-post-taxonomy-list,.stalux-post-taxonomy-list-column,.stalux-post-taxonomy-list-wrap){gap:var(--space-sm);display:flex}:is(.stalux-sidebar,.stalux-sidebar-right){gap:var(--space-lg);width:100%;height:fit-content;max-height:calc(100vh - 40px);padding:var(--space-lg) 0;scrollbar-width:none;-ms-overflow-style:none;flex-direction:column;display:flex;position:sticky;top:20px;overflow-y:auto}.stalux-pagination-link:before,.stalux-pagination-link:after{display:none}:is(.stalux-sidebar,.stalux-sidebar-right)::-webkit-scrollbar{display:none}a.stalux-pagination-link:focus-visible{background:var(--white-05p);outline-color:var(--accent-50p);outline:2px solid var(--stalux-accent-color);outline-offset:3px}a.stalux-pagination-prev-post:focus-visible .stalux-pagination-arrow{translate:-2px}a.stalux-pagination-next-post:focus-visible .stalux-pagination-arrow{translate:2px}.stalux-pagination-link.stalux-pagination-disabled{pointer-events:none;opacity:.5;cursor:not-allowed;background:var(--black-15p)}.stalux-pagination-link.stalux-pagination-prev-post{text-align:left;margin-left:var(--space-xs)}.stalux-pagination-link.stalux-pagination-next-post{text-align:right;margin-right:var(--space-xs);justify-content:flex-end}.stalux-post-layout>:first-child,.stalux-post-layout>:nth-child(3){margin:0}.stalux-post-layout>:nth-child(2){min-width:0;margin:0}.stalux-post-layout :focus-visible{outline:2px solid var(--accent-80p);outline-offset:2px}.stalux-post-page-stats span{align-items:center;gap:.3rem;display:inline-flex}#stalux-post-vercount_value_page_pv{color:#ffffffb3;font-weight:600}#stalux-post-vercount_container_page_pv{transition:opacity .3s}.stalux-post-source-link:focus,.stalux-post-source-link:active{background:var(--accent,#fff2);border-top-color:var(--accent,#fff4);border-right-color:var(--accent,#fff4);border-left-color:var(--accent,#fff4);text-decoration:none}.stalux-post-source-link:after{display:none!important}.stalux-license-author,.stalux-license-url,.stalux-license-license{margin:var(--space-sm) 0;line-height:1.6;font-size:var(--font-size-small);color:var(--white-80p)}.stalux-license-box a{color:var(--accent-90p);transition:color var(--transition-normal), border-bottom-color var(--transition-normal);border-bottom:1px dashed var(--accent-50p);padding-bottom:1px;text-decoration:none;position:relative}.stalux-license-box a:active{color:var(--accent-70p)}.stalux-license-icon svg{width:100%;height:100%;display:block}.stalux-license-icon path{color:var(--white-full);fill:currentColor}@media (hover:hover) and (pointer:fine){.stalux-random-refresh:hover{color:var(--accent-60p,#06c)}.stalux-random-list>li>a:hover,.stalux-toc-item:hover,.stalux-post-taxonomy-item-column:hover,.stalux-post-taxonomy-item-pill:hover{background:var(--white-05p)}a.stalux-pagination-link:hover{background:var(--white-05p);outline-color:var(--accent-50p)}a.stalux-pagination-prev-post:hover .stalux-pagination-arrow{translate:-2px}a.stalux-pagination-next-post:hover .stalux-pagination-arrow{translate:2px}.stalux-post-source-link:hover{background:var(--accent,#fff2);border-top-color:var(--accent,#fff4);border-right-color:var(--accent,#fff4);border-left-color:var(--accent,#fff4);text-decoration:none}.stalux-license-box a:hover{color:var(--stalux-accent-color);border-bottom-color:var(--accent-80p)}.stalux-license-box:hover .stalux-license-watermark{opacity:.25}}@media (prefers-color-scheme:dark){.stalux-random-header{border-bottom-color:#ffffff1a}.stalux-random-title,.stalux-random-refresh,.stalux-random-list>li>a{color:var(--foreground-60p,#e0e0e0)}.stalux-random-loading,.stalux-random-error,.stalux-random-no-more{color:var(--foreground-60p,#b0b0b0)}}@media (prefers-contrast:more){.stalux-post-layout{gap:2rem}}@media (width<=1599px){:is(.stalux-sidebar,.stalux-sidebar-right){display:none}.stalux-post-layout{grid-template-columns:minmax(0,1fr);max-width:1312px}}@media (width<=1024px){.stalux-post-title{font-size:2rem}.stalux-post-metadata{gap:1rem}}@media (width<=768px){:is(.stalux-sidebar,.stalux-sidebar-right),.stalux-sidebar-right{display:none}.stalux-pagination{margin:var(--space-md) 0}.stalux-pagination-inner{gap:var(--space-sm)}.stalux-pagination-link{padding:var(--space-sm) var(--space-md);flex-direction:column;justify-content:center;align-items:flex-start;min-height:120px}.stalux-pagination-link.stalux-pagination-next-post{align-items:flex-end}.stalux-pagination-arrow{transform:scale(.85)}.stalux-pagination-label{margin-bottom:var(--space-xs);font-size:.75rem}.stalux-pagination-title{max-width:100%;font-size:var(--font-size-small);white-space:normal}.stalux-post-page{padding:0}.stalux-post-layout{flex-direction:column;gap:2rem;margin:0;padding:0;display:flex}.stalux-post-layout>:nth-child(2){order:1}.stalux-post-layout>:first-child{order:2}.stalux-post-layout>:nth-child(3){order:3}.stalux-article{box-sizing:border-box;width:100%;box-shadow:none;background:0 0;margin:0;padding:clamp(1rem,2vw,2rem)}.stalux-post-body{width:100%;margin:0;padding:0 0 2rem}.stalux-post-article-header{margin-bottom:2rem;padding:1rem 1rem 0}.stalux-post-title{font-size:1.75rem}.stalux-post-metadata{flex-direction:column;gap:.75rem;font-size:.85rem}.stalux-post-article-footer{margin-top:2rem;padding-top:1.5rem}.stalux-post-page-stats{margin-top:.8rem;padding-top:.6rem;font-size:.85rem}.stalux-license-box{max-width:95%;padding:var(--space-md);margin:var(--space-md) auto}.stalux-license-title{margin-bottom:var(--space-xs);font-size:var(--font-size-base)}.stalux-license-author,.stalux-license-url,.stalux-license-license{margin:var(--space-xs) 0;font-size:.85rem}.stalux-license-icon{width:80px;height:80px}}@media (width<=480px){.stalux-pagination{margin:var(--space-md) 0}.stalux-pagination-inner{gap:var(--space-sm);flex-direction:column}.stalux-pagination-link{width:100%;padding:var(--space-sm) var(--space-md);justify-content:flex-start;align-items:center;gap:var(--space-md);flex-direction:row;min-height:100px}.stalux-pagination-link.stalux-pagination-prev-post,.stalux-pagination-link.stalux-pagination-next-post{text-align:left;align-items:center;margin-left:0;margin-right:0}.stalux-pagination-link.stalux-pagination-next-post{justify-content:flex-start}.stalux-pagination-title{white-space:normal}.stalux-post-layout{gap:1.25rem;padding:0}.stalux-license-box{max-width:100%;padding:var(--space-sm);margin:var(--space-md) 0}.stalux-license-title{margin-bottom:var(--space-2xs);font-size:var(--font-size-small)}.stalux-license-author,.stalux-license-url,.stalux-license-license{margin:var(--space-2xs) 0;font-size:.8rem}.stalux-license-icon{width:60px;height:60px}}@media (prefers-reduced-motion:reduce){.stalux-post-page *{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media print{.stalux-post-layout{grid-template-columns:1fr;gap:2rem}.stalux-post-layout>:first-child,.stalux-post-layout>:nth-child(3){display:none}}}@layer utilities,theme,base;
+@layer components{.stalux-article{box-shadow:var(--surface-glass-shadow);box-sizing:border-box;background:var(--surface-glass);border-radius:18px;flex-direction:column;flex:1;width:100%;min-width:0;max-width:100%;min-height:100vh;padding:clamp(1rem,2vw,2rem);display:flex}.stalux-byline-author-bio{border-top:var(--border-thin) solid var(--white-10p);margin:var(--space-md) 0 0;width:100%;padding-top:var(--space-md);text-align:center;color:var(--white-70p);line-height:1.6;font-size:var(--font-size-small)}.stalux-byline-author-card{background:var(--black-05p);border-radius:var(--radius-lg);padding:var(--space-md);box-shadow:var(--card-box-shadow);flex-direction:column;display:flex}.stalux-license-box{border:var(--border-thin) solid var(--white-20p);margin:var(--space-lg) auto;border-radius:var(--radius-md);background-color:var(--black-10p);max-width:80%;padding:var(--space-lg);position:relative;overflow:hidden}.stalux-license-watermark{opacity:.15;transition:opacity var(--transition-normal);pointer-events:none;z-index:1;position:absolute;bottom:.5rem;right:.5rem}.stalux-pagination{border-top:var(--border-thin) solid var(--white-20p);border-bottom:var(--border-thin) solid var(--white-20p);margin:var(--space-lg) 0;width:100%;padding-top:var(--space-lg);padding-bottom:var(--space-lg)}.stalux-pagination-arrow{color:var(--white-70p);flex-shrink:0;justify-content:center;align-items:center;transition:translate .18s;display:flex}.stalux-pagination-label{margin-bottom:var(--space-xs);color:var(--accent-90p);font-weight:500;font-size:var(--font-size-small)}.stalux-pagination-link{background:var(--black-10p);outline:1px solid var(--white-10p);outline-offset:0;box-shadow:var(--shadow-sidebar);box-sizing:border-box;align-items:center;gap:var(--space-sm);border-radius:var(--radius-md);min-width:0;padding:var(--space-md);color:var(--white-90p);flex:1 1 0;text-decoration:none;transition:background-color .18s,outline-color .18s;display:flex;position:relative}.stalux-pagination-title{text-overflow:ellipsis;white-space:nowrap;max-width:100%;color:var(--white-90p);font-size:var(--font-size-base);overflow:hidden}.stalux-post-article-footer{border-top:1px solid var(--white-10p);margin-top:3rem;padding-top:2rem;animation:.22s .36s both stalux-post-content-reveal}.stalux-post-article-header{border-bottom:1px solid var(--white-10p);margin-bottom:3rem;padding-bottom:2rem;animation:.22s .36s both stalux-post-content-reveal}.stalux-post-body{box-sizing:border-box;flex:1;width:min(1200px,100%);min-width:0;max-width:100%;margin:0 auto;padding:0 0 2rem;animation:.22s .36s both stalux-post-content-reveal}.stalux-post-layout{box-sizing:border-box;flex:1;grid-template-columns:280px minmax(0,1fr) 280px;gap:1.5rem;width:100%;min-width:0;max-width:1920px;margin:0 auto;padding:1.5rem 1rem;display:grid}.stalux-post-meta-item{transition:color var(--transition-fast);align-items:center;gap:.5rem;display:inline-flex}.stalux-post-meta-row{flex-basis:100%;justify-content:center;display:flex}.stalux-post-metadata{color:#ffffffb3;flex-wrap:wrap;justify-content:center;gap:1.5rem;font-size:.95rem;display:flex}.stalux-post-page-stats{border-top:1px solid var(--white-10p);color:#ffffffb3;justify-content:center;align-items:center;gap:1rem;margin-top:1rem;padding-top:.8rem;font-size:.9rem;display:flex}.stalux-post-reading-time{align-items:center;gap:.3rem;display:inline-flex}.stalux-post-source-link{background:var(--white-10p);border-top:1px solid var(--white-20p);border-right:1px solid var(--white-20p);border-left:1px solid var(--white-20p);transition:background var(--transition-fast), transform var(--transition-fast);border-radius:var(--radius-full,999px);color:var(--white-full);border-bottom:0;align-items:center;gap:.4rem;padding:.5rem 1.1rem;font-size:.85rem;font-weight:500;text-decoration:none;display:inline-flex}.stalux-post-taxonomy-item-column{background:var(--white-05p);border-left:var(--border-thick) solid var(--accent-60p);transition:color var(--transition-medium), transform var(--transition-medium);border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:var(--space-sm) var(--space-xs);color:var(--white-80p);font-size:var(--font-size-small);text-decoration:none;display:inline-flex;transform:translate(0)}.stalux-post-taxonomy-item-pill{background:var(--white-10p);transition:color var(--transition-medium), transform var(--transition-medium);white-space:nowrap;border-radius:var(--radius-full);color:var(--white-85p);font-size:var(--font-size-smaller);border:none;padding:.4rem .8rem;text-decoration:none;display:inline-block;transform:translateY(0)}.stalux-post-taxonomy-title{border-bottom:var(--border-thin) solid var(--white-20p);padding-bottom:var(--space-sm);color:var(--white-90p);font-weight:600;font-size:var(--font-size-base);margin:0}.stalux-post-title{word-break:break-word;text-align:center;color:var(--white-full);text-shadow:var(--stalux-text-shadow);margin:0 0 1.5rem;font-size:2.5rem;font-weight:700;line-height:1.2}.stalux-random-container{transition:background-color .3s,border-color .3s}.stalux-random-header{border-bottom:2px solid #0000000d;justify-content:space-between;align-items:center;margin-bottom:1em;padding-bottom:.75em;display:flex}.stalux-random-list{flex-direction:column;gap:.75em;margin:0;padding:0;list-style-type:none;transition:opacity .3s;display:flex}.stalux-random-refresh{cursor:pointer;width:2em;height:2em;color:var(--foreground-60p,#333);background:0 0;border:none;border-radius:.375em;justify-content:center;align-items:center;padding:0;transition:color .2s;display:flex}.stalux-sidebar-container{box-shadow:var(--surface-glass-shadow);padding:var(--space-md);background:var(--surface-glass);border-radius:14px;flex-direction:column;transition:box-shadow .22s,background-color .22s;display:flex}.stalux-sidebar-right{scroll-padding-bottom:8rem}.stalux-toc-item{border-left:var(--border-thick) solid transparent;transition:color var(--transition-medium), background-color var(--transition-medium), border-left-color var(--transition-medium), transform var(--transition-medium);word-break:break-word;border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:var(--space-sm) var(--space-xs);color:var(--white-70p);line-height:1.4;font-size:var(--font-size-small);text-decoration:none;display:block}.stalux-toc-title{border-bottom:var(--border-thin) solid var(--white-20p);margin:0 0 var(--space-xs);padding-bottom:var(--space-sm);color:var(--white-90p);font-weight:600;font-size:var(--font-size-base)}.stalux-license-content{z-index:2;position:relative}.stalux-random-title{color:var(--foreground-60p,#333);margin:0;font-size:1.1em;font-weight:600}.stalux-toc-list{gap:var(--space-sm);flex-direction:column;margin:0;padding:0;list-style-type:none;display:flex}.stalux-license-title{margin-top:0;margin-bottom:var(--space-sm);color:var(--white-90p);font-size:var(--font-size-subtitle)}.stalux-post-source-link-row{justify-content:center;margin-top:1.2rem;display:flex}.stalux-byline-author-section{width:100%}.stalux-license-icon{justify-content:center;align-items:center;width:120px;height:120px;display:flex}.stalux-pagination-content{flex-direction:column;min-width:0;display:flex;overflow:hidden}.stalux-post-page{flex-direction:column;width:100%;min-height:100vh;display:flex}.stalux-byline-sidebar-container,.stalux-post-footer-content{gap:var(--space-lg);flex-direction:column;display:flex}.stalux-pagination-inner{justify-content:space-between;gap:var(--space-md);display:flex}.stalux-post-taxonomy-container{gap:var(--space-xs);flex-direction:column;display:flex}.stalux-post-taxonomy-list-column{flex-direction:column}.stalux-post-taxonomy-list-wrap{flex-wrap:wrap}.stalux-post-taxonomy-empty{padding:var(--space-md) 0;text-align:center;color:var(--white-50p);font-size:var(--font-size-small)}.stalux-random-error{color:var(--accent-60p,#e74c3c)}.stalux-toc-empty{color:var(--white-60p);font-size:var(--font-size-small)}.stalux-sidebar .stalux-author-figure,.stalux-post-layout>:first-child,.stalux-post-layout>:nth-child(3){margin:0}.stalux-sidebar .stalux-author-figure figcaption{font-size:1.75rem}.stalux-sidebar-right #stalux-date-date-time #stalux-date-date{white-space:nowrap;font-size:1.5rem}.stalux-sidebar-right #stalux-date-date-time #stalux-date-time{white-space:nowrap;font-size:2.25rem}.stalux-random-refresh:active{opacity:.7}.stalux-random-refresh svg{width:1em;height:1em}.stalux-random-refresh.stalux-random-rotating svg{animation:.6s linear stalux-random-spin}.stalux-random-loading,.stalux-random-error,.stalux-random-no-more{text-align:center;color:var(--foreground-60p,#666);padding:1em;font-size:.95em}.stalux-random-list>li>a{color:var(--foreground-60p,#333);word-break:break-word;background:0 0;border-radius:.375em;padding:.75em 1em;text-decoration:none;transition:color .2s,transform .2s;display:block}.stalux-random-list>li>a:active,.stalux-post-taxonomy-item-column:active,.stalux-post-taxonomy-item-pill:active{background:var(--white-05p)}.stalux-toc-item:active,.stalux-toc-item.stalux-toc-active{color:var(--accent-90p);background-color:var(--accent-20p);border-left-color:var(--accent-80p);font-weight:500}.stalux-toc-depth-1{padding-left:var(--space-xs)}.stalux-toc-depth-2{padding-left:var(--space-lg);font-size:var(--font-size-smaller)}.stalux-toc-depth-3{font-size:var(--font-size-tiny);padding-left:2.25rem}.stalux-toc-depth-4,.stalux-toc-depth-5,.stalux-toc-depth-6{padding-left:var(--space-2xl);color:var(--white-60p);font-size:.75rem}:is(.stalux-post-taxonomy-list,.stalux-post-taxonomy-list-column,.stalux-post-taxonomy-list-wrap){gap:var(--space-sm);display:flex}:is(.stalux-sidebar,.stalux-sidebar-right){box-sizing:border-box;gap:var(--space-lg);width:100%;min-width:0;height:fit-content;max-height:calc(100vh - 40px);padding:var(--space-lg) 0;scrollbar-width:none;-ms-overflow-style:none;flex-direction:column;display:flex;position:sticky;top:20px;overflow-y:auto}.stalux-pagination-link:before,.stalux-pagination-link:after{display:none}:is(.stalux-sidebar,.stalux-sidebar-right)::-webkit-scrollbar{display:none}a.stalux-pagination-link:focus-visible{background:var(--white-05p);outline-color:var(--accent-50p);outline:2px solid var(--stalux-accent-color);outline-offset:3px}a.stalux-pagination-prev-post:focus-visible .stalux-pagination-arrow{translate:-2px}a.stalux-pagination-next-post:focus-visible .stalux-pagination-arrow{translate:2px}.stalux-pagination-link.stalux-pagination-disabled{pointer-events:none;opacity:.5;cursor:not-allowed;background:var(--black-15p)}.stalux-pagination-link.stalux-pagination-prev-post{text-align:left;margin-left:var(--space-xs)}.stalux-pagination-link.stalux-pagination-next-post{text-align:right;margin-right:var(--space-xs);justify-content:flex-end}.stalux-post-layout>:nth-child(2){min-width:0;margin:0}.stalux-post-layout :focus-visible{outline:2px solid var(--accent-80p);outline-offset:2px}.stalux-post-page-stats span{align-items:center;gap:.3rem;display:inline-flex}#stalux-post-vercount_value_page_pv{color:#ffffffb3;font-weight:600}#stalux-post-vercount_container_page_pv{transition:opacity .3s}.stalux-post-source-link:focus,.stalux-post-source-link:active{background:var(--accent,#fff2);border-top-color:var(--accent,#fff4);border-right-color:var(--accent,#fff4);border-left-color:var(--accent,#fff4);text-decoration:none}.stalux-post-source-link:after{display:none!important}.stalux-license-author,.stalux-license-url,.stalux-license-license{margin:var(--space-sm) 0;line-height:1.6;font-size:var(--font-size-small);color:var(--white-80p)}.stalux-license-box a{color:var(--accent-90p);transition:color var(--transition-normal), border-bottom-color var(--transition-normal);border-bottom:1px dashed var(--accent-50p);padding-bottom:1px;text-decoration:none;position:relative}.stalux-license-box a:active{color:var(--accent-70p)}.stalux-license-icon svg{width:100%;height:100%;display:block}.stalux-license-icon path{color:var(--white-full);fill:currentColor}@media (hover:hover) and (pointer:fine){.stalux-random-refresh:hover{color:var(--accent-60p,#06c)}.stalux-random-list>li>a:hover,.stalux-toc-item:hover,.stalux-post-taxonomy-item-column:hover,.stalux-post-taxonomy-item-pill:hover{background:var(--white-05p)}a.stalux-pagination-link:hover{background:var(--white-05p);outline-color:var(--accent-50p)}a.stalux-pagination-prev-post:hover .stalux-pagination-arrow{translate:-2px}a.stalux-pagination-next-post:hover .stalux-pagination-arrow{translate:2px}.stalux-post-source-link:hover{background:var(--accent,#fff2);border-top-color:var(--accent,#fff4);border-right-color:var(--accent,#fff4);border-left-color:var(--accent,#fff4);text-decoration:none}.stalux-license-box a:hover{color:var(--stalux-accent-color);border-bottom-color:var(--accent-80p)}.stalux-license-box:hover .stalux-license-watermark{opacity:.25}}@media (prefers-color-scheme:dark){.stalux-random-header{border-bottom-color:#ffffff1a}.stalux-random-title,.stalux-random-refresh,.stalux-random-list>li>a{color:var(--foreground-60p,#e0e0e0)}.stalux-random-loading,.stalux-random-error,.stalux-random-no-more{color:var(--foreground-60p,#b0b0b0)}}@media (prefers-contrast:more){.stalux-post-layout{gap:2rem}}@media (width<=1599px){:is(.stalux-sidebar,.stalux-sidebar-right){display:none}.stalux-post-layout{grid-template-columns:minmax(0,1fr);max-width:1312px}}@media (width<=1024px){.stalux-post-title{font-size:2rem}.stalux-post-metadata{gap:1rem}}@media (width<=768px){:is(.stalux-sidebar,.stalux-sidebar-right),.stalux-sidebar-right{display:none}.stalux-pagination{margin:var(--space-md) 0}.stalux-pagination-inner{gap:var(--space-sm)}.stalux-pagination-link{padding:var(--space-sm) var(--space-md);flex-direction:column;justify-content:center;align-items:flex-start;min-height:120px}.stalux-pagination-link.stalux-pagination-next-post{align-items:flex-end}.stalux-pagination-arrow{transform:scale(.85)}.stalux-pagination-label{margin-bottom:var(--space-xs);font-size:.75rem}.stalux-pagination-title{max-width:100%;font-size:var(--font-size-small);white-space:normal}.stalux-post-page{padding:0}.stalux-post-layout{flex-direction:column;gap:2rem;margin:0;padding:0;display:flex}.stalux-post-layout>:nth-child(2){order:1}.stalux-post-layout>:first-child{order:2}.stalux-post-layout>:nth-child(3){order:3}.stalux-article{box-sizing:border-box;width:100%;box-shadow:none;background:0 0;margin:0;padding:clamp(1rem,2vw,2rem)}.stalux-post-body{width:100%;margin:0;padding:0 0 2rem}.stalux-post-article-header{margin-bottom:2rem;padding:1rem 1rem 0}.stalux-post-title{font-size:1.75rem}.stalux-post-metadata{flex-direction:column;gap:.75rem;font-size:.85rem}.stalux-post-article-footer{margin-top:2rem;padding-top:1.5rem}.stalux-post-page-stats{margin-top:.8rem;padding-top:.6rem;font-size:.85rem}.stalux-license-box{max-width:95%;padding:var(--space-md);margin:var(--space-md) auto}.stalux-license-title{margin-bottom:var(--space-xs);font-size:var(--font-size-base)}.stalux-license-author,.stalux-license-url,.stalux-license-license{margin:var(--space-xs) 0;font-size:.85rem}.stalux-license-icon{width:80px;height:80px}}@media (width<=480px){.stalux-pagination{margin:var(--space-md) 0}.stalux-pagination-inner{gap:var(--space-sm);flex-direction:column}.stalux-pagination-link{width:100%;padding:var(--space-sm) var(--space-md);justify-content:flex-start;align-items:center;gap:var(--space-md);flex-direction:row;min-height:100px}.stalux-pagination-link.stalux-pagination-prev-post,.stalux-pagination-link.stalux-pagination-next-post{text-align:left;align-items:center;margin-left:0;margin-right:0}.stalux-pagination-link.stalux-pagination-next-post{justify-content:flex-start}.stalux-pagination-title{white-space:normal}.stalux-post-layout{gap:1.25rem;padding:0}.stalux-license-box{max-width:100%;padding:var(--space-sm);margin:var(--space-md) 0}.stalux-license-title{margin-bottom:var(--space-2xs);font-size:var(--font-size-small)}.stalux-license-author,.stalux-license-url,.stalux-license-license{margin:var(--space-2xs) 0;font-size:.8rem}.stalux-license-icon{width:60px;height:60px}}@media (prefers-reduced-motion:reduce){.stalux-post-page *{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media print{.stalux-post-layout{grid-template-columns:1fr;gap:2rem}.stalux-post-layout>:first-child,.stalux-post-layout>:nth-child(3){display:none}}}@layer utilities,theme,base;
 /*$vite$:1*/

package/src/styles/integrations.css

@@ -14,7 +14,7 @@
 
 /* 评论区标题样式与博客风格一致 */
 .waline-comment-title {
-    @apply text-center;
+    text-align: center;
     margin: 0 0 1.5rem 0;
     font-size: 2rem;
     background: linear-gradient(90deg, var(--white-90p), rgba(var(--waline-accent-rgb), 0.9));
@@ -56,12 +56,12 @@
 
 /* 修复登录后头像向下偏移 — 全局 a::after 下划线动画撑高了 wl-login-nick */
 .wl-login-nick {
-    @apply overflow-hidden;
+    overflow: hidden;
     display: block !important;
     height: var(--waline-avatar-size, 52px);
 }
 .wl-login-nick::after {
-    @apply hidden;
+    display: none;
 }
 
 /* 修复 markdown 全局 img margin 误伤 Waline 头像 */
@@ -69,7 +69,7 @@
     margin: 0 !important;
 }
 .wl-btn {
-    @apply cursor-pointer;
+    cursor: pointer;
     background: rgba(var(--waline-accent-rgb), 0.6) !important;
     color: var(--white-full) !important;
     border: none !important;
@@ -192,7 +192,7 @@
 
 /* 文章评价反应区域 */
 .wl-reaction {
-    @apply text-center;
+    text-align: center;
     background-color: rgba(17, 17, 17, 0.3);
     border-radius: 12px;
     padding: 1rem;
@@ -207,12 +207,13 @@
 }
 
 .wl-reaction-list {
-    @apply flex justify-center;
+    display: flex;
+    justify-content: center;
     flex-wrap: wrap;
 }
 
 .wl-reaction-item {
-    @apply cursor-pointer;
+    cursor: pointer;
     background-color: rgba(30, 30, 30, 0.5) !important;
     border-radius: 8px;
     margin: 5px;
@@ -254,7 +255,8 @@
 
 /* 评论计数和排序 */
 .wl-meta-head {
-    @apply flex items-center;
+    display: flex;
+    align-items: center;
     margin-bottom: 1.2rem;
     border-bottom: 1px solid rgba(70, 70, 70, 0.3);
     padding-bottom: 0.8rem;
@@ -268,12 +270,12 @@
 }
 
 .wl-sort {
-    @apply flex;
+    display: flex;
     gap: 1rem;
 }
 
 .wl-sort li {
-    @apply cursor-pointer;
+    cursor: pointer;
     transition:
         background-color 180ms ease,
         border-color 180ms ease,
@@ -293,7 +295,7 @@
 
 /* 页码导航 */
 .wl-page {
-    @apply text-center;
+    text-align: center;
     margin-top: 1.2rem;
 }
 
@@ -324,7 +326,7 @@
 
 /* Waline底部版权信息 */
 .wl-power {
-    @apply text-center;
+    text-align: center;
     opacity: 0.6;
     font-size: 0.85rem;
     margin-top: 2rem;
@@ -347,7 +349,7 @@
 
 /* 评论为空状态 */
 .wl-empty {
-    @apply text-center;
+    text-align: center;
     padding: 2rem 0;
     color: var(--white-60p);
     font-size: 1.1rem;
@@ -402,11 +404,11 @@
     }
 
     .wl-header {
-        @apply flex-col;
+        flex-direction: column;
     }
 
     .wl-header-item {
-        @apply w-full;
+        width: 100%;
         margin-bottom: 0.5rem;
     }
 
@@ -447,20 +449,22 @@
     }
 
     .wl-card {
-        @apply w-full box-border;
+        width: 100%;
+        box-sizing: border-box;
         padding: 0.75rem;
         margin-left: 0;
     }
 
     /* 小屏幕上的嵌套评论处理 */
     .wl-children {
-        @apply w-full box-border;
+        width: 100%;
+        box-sizing: border-box;
         margin-left: 0;
         padding-left: 0;
     }
 
     .wl-children .wl-card {
-        @apply w-full;
+        width: 100%;
         margin-left: 0;
         border-left: 3px solid rgba(var(--waline-accent-rgb), 0.4);
         padding-left: 0.6rem;
@@ -472,7 +476,7 @@
     }
 
     .wl-meta-head {
-        @apply flex-col;
+        flex-direction: column;
         gap: 0.5rem;
         align-items: flex-start;
     }