feat: add multilingual theme introduction posts

- Added localized Retypeset theme introduction posts for multiple languages
- Included posts in English, Spanish, Russian, Japanese, Chinese (Simplified and Traditional)
- Standardized post structure with consistent metadata and content
- Updated content configuration to support multilingual post entries

src/styles/global.css

@@ -3,68 +3,82 @@
   --uno-colors-secondary: theme('colors.secondary');
   --uno-colors-background: theme('colors.background');
 }
+
 html {
-  --at-apply: 'bg-background c-secondary scroll-smooth antialiased text-62.5%';
+  --at-apply: 'bg-background c-secondary text-62.5% antialiased scroll-smooth';
   scrollbar-width: none;
   -ms-overflow-style: none;
 }
+
 html::-webkit-scrollbar {
   --at-apply: 'hidden';
 }
+
 body {
   --at-apply: 'text-1.6rem';
+  /* Fix for iOS browser flash issue */
   transform: translateZ(0);
   -webkit-transform: translateZ(0);
 }
+
 h1, h2, h3 {
   text-rendering: optimizeLegibility;
 }
+
 h1 {
   --at-apply: 'text-3.6rem';
 }
+
 h2 {
   --at-apply: 'text-3rem';
 }
+
 h3 {
   --at-apply: 'text-2.4rem';
 }
+
 h4 {
   --at-apply: 'text-2rem';
 }
+
 h5 {
   --at-apply: 'text-1.8rem';
 }
+
 h6 {
   --at-apply: 'text-1.6rem';
 }
+
 article img {
-  cursor: zoom-in;
-  transform: translateZ(0);
-  -webkit-transform: translateZ(0);
+  --at-apply: 'cursor-zoom-in';
 }
+
 /* Horizontal reveal animation on theme toggle */
 @keyframes reveal {
   from {
     clip-path: inset(var(--from));
   }
 }
+
 html.dark {
   --from: 0 0 100% 0;
 }
+
 html:not(.dark) {
   --from: 100% 0 0 0;
 }
+
 ::view-transition-new(theme-transition) {
   animation: reveal 1s cubic-bezier(0.4, 0, 0.2, 1);
   clip-path: inset(0 0 0 0);
   z-index: 2;
-  transform: translateZ(0);
-  -webkit-transform: translateZ(0);
 }
+
 ::view-transition-old(theme-transition) {
   animation: none;
   z-index: 1;
 }
+
 @supports not (view-transition-name: none) {
   body:not([data-restore-theme]) {
     --at-apply: 'transition-colors duration-500 ease-in-out';

src/styles/photoswipe.css

@@ -1,17 +1,21 @@
 .pswp__button {
   --at-apply: 'flex items-center justify-center transition';
 }
+
 .pswp__button--zoom,
 .pswp__button--close {
   --at-apply: 'mt-2 lg:mt-4 active:scale-92';
 }
+
 .pswp__button--zoom svg:hover,
 .pswp__button--close svg:hover {
     fill: #BEBEBE;
 }
+
 .pswp__button--close {
   --at-apply: 'mr-4 lg:mr-8';
 }
+
 .pswp__button--zoom {
   --at-apply: 'mr--6 lg:mr-0';
 }

src/styles/scrollbar.css

@@ -10,16 +10,19 @@
   --os-handle-perpendicular-size-active: 160%;
   --os-handle-interactive-area-offset: 3px;
 }
+
 .scrollbar-light {
   --os-handle-bg: #C9C4C1;
   --os-handle-bg-hover: #B8B3B0;
   --os-handle-bg-active: #B8B3B0;
 }
+
 .scrollbar-dark {
   --os-handle-bg: #383838;
   --os-handle-bg-hover: #464646;
   --os-handle-bg-active: #464646;
 }
+
 @media (max-width: 1023px) {
   .os-scrollbar {
     display: none !important;