/*
 Theme Name:   Nanmang Shan
 Theme URI:    https://nanmang.com
 Description:  Custom child theme for Nan Mang Shan cultivation sect website
 Author:       Shou Cang Dian
 Template:     generatepress
 Version:      1.0.0
 Text Domain:  nanmang
 */


/* ===== NANMANG FRONT PAGE ===== */

   *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
   @import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700;900&family=Lora:ital,wght@0,400;0,600;1,400&family=Noto+Serif+SC:wght@400;600;700;900&display=swap');
 
   :root {
     --gold: #C9A96E;
     --gold-dim: rgba(201, 169, 110, 0.6);
     --black: #050505;
     --dark: #0D0D0D;
     --surface: #1A1A1A;
     --border: #2A2A2A;
     --text: #E0D8C8;
     --text-dim: #8A8578;
     --text-dimmer: #5A5548;
     --vermilion: #C0392B;
     --green: #2D5016;
     --copper: #8B6914;
     --moonwhite: #D4D4C8;
   }
 
   html { scroll-behavior: smooth; }
 
   body {
     font-family: 'Noto Serif SC', 'Lora', serif;
     background: var(--black);
     color: var(--text);
     overflow-x: hidden;
   }
 
   /* =============================================
    *  SECTION 0: THE MOUNTAIN GATE (Hero)
    * ============================================= */
   .gate {
     position: relative;
     width: 100%;
     height: 100vh;
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
   }
 
   .gate-bg {
     position: absolute;
     inset: 0;
     background:
       url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 900"><defs><linearGradient id="g" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="0%" stop-color="%2305080e"/><stop offset="30%" stop-color="%230a0f1a"/><stop offset="60%" stop-color="%23101820"/><stop offset="100%" stop-color="%23050505"/></linearGradient><clipPath id="c"><path d="M0,900 L200,600 L350,300 L500,100 L650,250 L800,50 L950,200 L1100,100 L1250,300 L1400,600 L1600,900 Z"/></clipPath></defs><rect width="1600" height="900" fill="url(%23g)"/><g clip-path="url(%23c)"><polygon points="0,900 200,600 350,300 500,100 650,250 800,50 950,200 1100,100 1250,300 1400,600 1600,900" fill="%230d0d0d"/><polygon points="0,900 200,620 350,340 500,160 650,290 800,100 950,230 1100,140 1250,340 1400,620 1600,900" fill="%23121212"/><polygon points="0,900 200,650 350,380 500,220 650,330 800,150 950,260 1100,190 1250,380 1400,650 1600,900" fill="%23161818"/><polygon points="0,900 200,680 350,420 500,280 650,370 800,200 950,300 1100,240 1250,420 1400,680 1600,900" fill="%231a1c1c"/><polygon points="0,900 200,720 350,480 500,360 650,430 800,280 950,360 1100,320 1250,480 1400,720 1600,900" fill="%231e2020"/></g></svg>')
       center/cover no-repeat;
     filter: brightness(0.5) contrast(1.1);
   }
 
   .gate-bg::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(to bottom,
       transparent 0%, transparent 30%,
       rgba(5,5,5,0.3) 50%,
       rgba(5,5,5,0.6) 70%,
       rgba(5,5,5,0.85) 85%,
       #050505 100%
     );
   }
 
   /* Fog overlay */
   .fog {
     position: absolute;
     inset: 0;
     pointer-events: none;
     z-index: 2;
     opacity: 0.25;
     background:
       radial-gradient(ellipse at 20% 50%, rgba(180,175,165,0.15) 0%, transparent 60%),
       radial-gradient(ellipse at 75% 40%, rgba(160,155,145,0.10) 0%, transparent 55%),
       radial-gradient(ellipse at 50% 70%, rgba(140,135,125,0.12) 0%, transparent 50%);
     animation: fogDrift 35s ease-in-out infinite alternate;
   }
 
   @keyframes fogDrift {
     0%   { transform: translateX(0) scale(1); }
     33%  { transform: translateX(2%) scale(1.02); }
     66%  { transform: translateX(-1.5%) scale(0.98); }
     100% { transform: translateX(1.2%) scale(1.01); }
   }
 
   /* Particles */
   .particles {
     position: absolute;
     inset: 0;
     z-index: 3;
     pointer-events: none;
     overflow: hidden;
   }
 
   .particle {
     position: absolute;
     width: 1px;
     height: 1px;
     background: rgba(201, 169, 110, 0.4);
     border-radius: 50%;
     animation: float linear infinite;
   }
 
   .particle:nth-child(1) { left: 10%; animation-duration: 12s; animation-delay: 0s; }
   .particle:nth-child(2) { left: 25%; animation-duration: 15s; animation-delay: 2s; }
   .particle:nth-child(3) { left: 40%; animation-duration: 18s; animation-delay: 4s; }
   .particle:nth-child(4) { left: 55%; animation-duration: 14s; animation-delay: 1s; }
   .particle:nth-child(5) { left: 70%; animation-duration: 16s; animation-delay: 3s; }
   .particle:nth-child(6) { left: 85%; animation-duration: 13s; animation-delay: 5s; }
   .particle:nth-child(7) { left: 35%; animation-duration: 19s; animation-delay: 6s; }
   .particle:nth-child(8) { left: 60%; animation-duration: 11s; animation-delay: 7s; }
 
   @keyframes float {
     0% { transform: translateY(100vh) scale(0); opacity: 0; }
     10% { opacity: 1; }
     90% { opacity: 1; }
     100% { transform: translateY(-10vh) scale(1); opacity: 0; }
   }
 
   /* Gate content */
   .gate-content {
     position: relative;
     z-index: 5;
     text-align: center;
     animation: gateAppear 2.5s ease-out forwards;
     opacity: 0;
   }
 
   @keyframes gateAppear {
     0%   { opacity: 0; transform: translateY(30px); }
     100% { opacity: 1; transform: translateY(0); }
   }
 
   .gate-symbol {
     font-family: 'Cinzel', serif;
     font-size: 0.7rem;
     letter-spacing: 0.6em;
     text-transform: uppercase;
     color: var(--gold-dim);
     margin-bottom: 3rem;
     animation: symbolPulse 4s ease-in-out infinite;
   }
 
   @keyframes symbolPulse {
     0%, 100% { opacity: 0.6; }
     50% { opacity: 1; }
   }
 
   .gate-title {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(3.5rem, 12vw, 8rem);
     font-weight: 900;
     color: var(--text);
     letter-spacing: 0.3em;
     line-height: 1;
     margin-bottom: 0.5rem;
     text-shadow: 0 0 60px rgba(201,169,110,0.1);
   }
 
   .gate-title-en {
     font-family: 'Cinzel', serif;
     font-size: clamp(0.6rem, 1.8vw, 1.1rem);
     font-weight: 400;
     letter-spacing: 0.8em;
     text-transform: uppercase;
     color: var(--gold-dim);
     margin-bottom: 2.5rem;
   }
 
   .gate-motto {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(1.2rem, 3vw, 2rem);
     color: var(--gold);
     letter-spacing: 0.5em;
     margin-bottom: 0.5rem;
     font-weight: 600;
   }
 
   .gate-motto-en {
     font-family: 'Cinzel', serif;
     font-size: clamp(0.5rem, 1.2vw, 0.8rem);
     letter-spacing: 0.6em;
     text-transform: uppercase;
     color: var(--text-dim);
     margin-bottom: 3.5rem;
   }
 
   .gate-divider {
     width: 1px;
     height: 60px;
     background: linear-gradient(to bottom, var(--gold-dim), transparent);
     margin: 0 auto 2.5rem;
   }
 
   .gate-btn {
     display: inline-block;
     padding: 1rem 3rem;
     border: 1px solid var(--gold-dim);
     color: var(--gold);
     text-decoration: none;
     font-family: 'Cinzel', serif;
     font-size: 0.75rem;
     letter-spacing: 0.4em;
     text-transform: uppercase;
     transition: all 0.6s ease;
     background: transparent;
     cursor: pointer;
   }
 
   .gate-btn:hover {
     background: rgba(201, 169, 110, 0.08);
     border-color: var(--gold);
   }
 
   /* Scroll indicator */
   .scroll-indicator {
     position: absolute;
     bottom: 2.5rem;
     left: 50%;
     transform: translateX(-50%);
     z-index: 5;
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 0.5rem;
     animation: scrollBounce 2.5s ease-in-out infinite;
     cursor: pointer;
   }
 
   @keyframes scrollBounce {
     0%, 100% { transform: translateX(-50%) translateY(0); }
     50% { transform: translateX(-50%) translateY(8px); }
   }
 
   .scroll-indicator span {
     font-family: 'Cinzel', serif;
     font-size: 0.5rem;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: var(--text-dimmer);
   }
 
   .scroll-line {
     width: 1px;
     height: 30px;
     background: linear-gradient(to bottom, var(--text-dimmer), transparent);
   }
 
   /* =============================================
    *  SECTION 1: RESTORATION DECREE
    * ============================================= */
   .decree-section {
     width: 100%;
     background: var(--dark);
     padding: 6rem 1.5rem;
     display: flex;
     justify-content: center;
   }
 
   .decree-container {
     max-width: 720px;
     width: 100%;
   }
 
   .decree-header {
     text-align: center;
     margin-bottom: 3rem;
   }
 
   .decree-label {
     font-family: 'Cinzel', serif;
     font-size: 0.6rem;
     letter-spacing: 0.5em;
     text-transform: uppercase;
     color: var(--text-dimmer);
     margin-bottom: 1rem;
   }
 
   .decree-title {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(1.2rem, 2.5vw, 1.8rem);
     font-weight: 700;
     color: var(--vermilion);
     letter-spacing: 0.15em;
   }
 
   .decree-title-en {
     font-family: 'Cinzel', serif;
     font-size: clamp(0.5rem, 1vw, 0.7rem);
     letter-spacing: 0.4em;
     color: var(--text-dim);
     margin-top: 0.5rem;
   }
 
   .decree-body {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(0.9rem, 1.3vw, 1.05rem);
     line-height: 2.2;
     color: var(--text);
     text-align: justify;
     padding: 2rem 0;
     border-top: 1px solid var(--border);
     border-bottom: 1px solid var(--border);
     position: relative;
   }
 
   .decree-body p {
     margin-bottom: 1.5rem;
   }
 
   .decree-body p:last-child {
     margin-bottom: 0;
   }
 
   .decree-seal {
     text-align: right;
     margin-top: 2rem;
     font-family: 'Cinzel', serif;
     font-size: 0.7rem;
     letter-spacing: 0.2em;
     color: var(--gold-dim);
   }
 
   .decree-seal-mark {
     display: inline-block;
     width: 50px;
     height: 50px;
     border: 1px solid var(--gold-dim);
     border-radius: 50%;
     margin-right: 1rem;
     vertical-align: middle;
     position: relative;
   }
 
   .decree-seal-mark::after {
     content: '灞?;
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     font-family: 'Noto Serif SC', serif;
     font-size: 1.2rem;
     color: var(--vermilion);
     opacity: 0.7;
   }
 
   /* =============================================
    *  SECTION 2: NAVIGATION GATES
    * ============================================= */
   .nav-section {
     width: 100%;
     background: var(--black);
     padding: 4rem 1.5rem;
   }
 
   .nav-inner {
     max-width: 1000px;
     margin: 0 auto;
   }
 
   .nav-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     gap: 1px;
     background: var(--border);
   }
 
   .nav-item {
     background: var(--dark);
     padding: 2.5rem 1.5rem;
     text-decoration: none;
     color: var(--text);
     transition: all 0.4s ease;
     position: relative;
     overflow: hidden;
     display: block;
   }
 
   .nav-item::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 2px;
     background: var(--gold);
     transform: scaleX(0);
     transform-origin: left;
     transition: transform 0.4s ease;
   }
 
   .nav-item:hover::before {
     transform: scaleX(1);
   }
 
   .nav-item:hover {
     background: #111;
   }
 
   .nav-item-icon {
     font-family: 'Noto Serif SC', serif;
     font-size: 1.4rem;
     margin-bottom: 0.8rem;
     opacity: 0.5;
   }
 
   .nav-item-title {
     font-family: 'Noto Serif SC', serif;
     font-size: 1.1rem;
     font-weight: 600;
     margin-bottom: 0.3rem;
     display: flex;
     align-items: center;
     gap: 0.6rem;
   }
 
   .nav-item-title-en {
     font-family: 'Cinzel', serif;
     font-size: 0.55rem;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: var(--text-dim);
   }
 
   .nav-item-desc {
     font-family: 'Lora', serif;
     font-size: 0.8rem;
     color: var(--text-dimmer);
     line-height: 1.6;
     margin-top: 0.4rem;
   }
 
   .nav-item-color-shoucang { border-left: 2px solid var(--vermilion); }
   .nav-item-color-langhuan { border-left: 2px solid var(--copper); }
   .nav-item-color-shiwei   { border-left: 2px solid var(--gold); }
   .nav-item-color-shilian  { border-left: 2px solid var(--green); }
   .nav-item-color-wendao   { border-left: 2px solid var(--moonwhite); }
   .nav-item-color-shifang  { border-left: 2px solid var(--copper); }
 
   /* =============================================
    *  SECTION 3: LANGUAGE SWITCH
    * ============================================= */
   .lang-switch {
     position: fixed;
     top: 2rem;
     right: 2rem;
     z-index: 50;
     display: flex;
     gap: 1rem;
   }
 
   .lang-switch a {
     color: var(--text-dimmer);
     text-decoration: none;
     font-family: 'Cinzel', serif;
     font-size: 0.6rem;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     transition: color 0.4s;
   }
 
   .lang-switch a:hover { color: var(--gold-dim); }
   .lang-switch a.active { color: var(--gold); }
 
   /* =============================================
    *  SECTION 4: RECENT DECRYPTIONS
    * ============================================= */
   .recent-section {
     width: 100%;
     background: var(--dark);
     padding: 4rem 1.5rem;
   }
 
   .recent-inner {
     max-width: 1000px;
     margin: 0 auto;
   }
 
   .section-title {
     font-family: 'Noto Serif SC', serif;
     font-size: 1rem;
     color: var(--text-dim);
     margin-bottom: 1.5rem;
     letter-spacing: 0.1em;
   }
 
   .recent-list {
     display: flex;
     flex-direction: column;
     gap: 1px;
   }
 
   .recent-item {
     background: var(--black);
     padding: 1rem 1rem;
     text-decoration: none;
     display: flex;
     align-items: center;
     gap: 1rem;
     transition: background 0.3s;
   }
 
   .recent-item:hover { background: #111; }
 
   .recent-id {
     font-family: 'Cinzel', serif;
     font-size: 0.6rem;
     color: var(--gold-dim);
     min-width: 65px;
     letter-spacing: 0.1em;
   }
 
   .recent-name {
     font-family: 'Noto Serif SC', serif;
     font-size: 0.9rem;
     color: var(--text);
     font-weight: 600;
   }
 
   .recent-name-en {
     font-family: 'Lora', serif;
     font-size: 0.75rem;
     color: var(--text-dim);
     font-style: italic;
   }
 
   .recent-meta {
     margin-left: auto;
     font-family: 'Cinzel', serif;
     font-size: 0.55rem;
     color: var(--text-dimmer);
     letter-spacing: 0.15em;
   }
 
   /* =============================================
    *  FOOTER
    * ============================================= */
   .site-footer {
     width: 100%;
     background: var(--black);
     border-top: 1px solid var(--border);
     padding: 3rem 1.5rem;
     text-align: center;
   }
 
   .footer-motto {
     font-family: 'Noto Serif SC', serif;
     font-size: 1.2rem;
     color: var(--gold-dim);
     letter-spacing: 0.3em;
     margin-bottom: 0.5rem;
   }
 
   .footer-disclaimer {
     font-family: 'Lora', serif;
     font-size: 0.65rem;
     color: var(--text-dimmer);
     line-height: 1.8;
   }
 
   @media (max-width: 640px) {
     .nav-grid { grid-template-columns: 1fr; }
     .recent-item { flex-wrap: wrap; }
     .recent-meta { margin-left: 0; width: 100%; }
     .gate-title { letter-spacing: 0.15em; }
   }
 

/* ===== NANMANG FRONT PAGE ===== */

   *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
   @import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700;900&family=Lora:ital,wght@0,400;0,600;1,400&family=Noto+Serif+SC:wght@400;600;700;900&display=swap');
 
   :root {
     --gold: #C9A96E;
     --gold-dim: rgba(201, 169, 110, 0.6);
     --black: #050505;
     --dark: #0D0D0D;
     --surface: #1A1A1A;
     --border: #2A2A2A;
     --text: #E0D8C8;
     --text-dim: #8A8578;
     --text-dimmer: #5A5548;
     --vermilion: #C0392B;
     --green: #2D5016;
     --copper: #8B6914;
     --moonwhite: #D4D4C8;
   }
 
   html { scroll-behavior: smooth; }
 
   body {
     font-family: 'Noto Serif SC', 'Lora', serif;
     background: var(--black);
     color: var(--text);
     overflow-x: hidden;
   }
 
   /* =============================================
    *  SECTION 0: THE MOUNTAIN GATE (Hero)
    * ============================================= */
   .gate {
     position: relative;
     width: 100%;
     height: 100vh;
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
   }
 
   .gate-bg {
     position: absolute;
     inset: 0;
     background:
       url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 900"><defs><linearGradient id="g" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="0%" stop-color="%2305080e"/><stop offset="30%" stop-color="%230a0f1a"/><stop offset="60%" stop-color="%23101820"/><stop offset="100%" stop-color="%23050505"/></linearGradient><clipPath id="c"><path d="M0,900 L200,600 L350,300 L500,100 L650,250 L800,50 L950,200 L1100,100 L1250,300 L1400,600 L1600,900 Z"/></clipPath></defs><rect width="1600" height="900" fill="url(%23g)"/><g clip-path="url(%23c)"><polygon points="0,900 200,600 350,300 500,100 650,250 800,50 950,200 1100,100 1250,300 1400,600 1600,900" fill="%230d0d0d"/><polygon points="0,900 200,620 350,340 500,160 650,290 800,100 950,230 1100,140 1250,340 1400,620 1600,900" fill="%23121212"/><polygon points="0,900 200,650 350,380 500,220 650,330 800,150 950,260 1100,190 1250,380 1400,650 1600,900" fill="%23161818"/><polygon points="0,900 200,680 350,420 500,280 650,370 800,200 950,300 1100,240 1250,420 1400,680 1600,900" fill="%231a1c1c"/><polygon points="0,900 200,720 350,480 500,360 650,430 800,280 950,360 1100,320 1250,480 1400,720 1600,900" fill="%231e2020"/></g></svg>')
       center/cover no-repeat;
     filter: brightness(0.5) contrast(1.1);
   }
 
   .gate-bg::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(to bottom,
       transparent 0%, transparent 30%,
       rgba(5,5,5,0.3) 50%,
       rgba(5,5,5,0.6) 70%,
       rgba(5,5,5,0.85) 85%,
       #050505 100%
     );
   }
 
   /* Fog overlay */
   .fog {
     position: absolute;
     inset: 0;
     pointer-events: none;
     z-index: 2;
     opacity: 0.25;
     background:
       radial-gradient(ellipse at 20% 50%, rgba(180,175,165,0.15) 0%, transparent 60%),
       radial-gradient(ellipse at 75% 40%, rgba(160,155,145,0.10) 0%, transparent 55%),
       radial-gradient(ellipse at 50% 70%, rgba(140,135,125,0.12) 0%, transparent 50%);
     animation: fogDrift 35s ease-in-out infinite alternate;
   }
 
   @keyframes fogDrift {
     0%   { transform: translateX(0) scale(1); }
     33%  { transform: translateX(2%) scale(1.02); }
     66%  { transform: translateX(-1.5%) scale(0.98); }
     100% { transform: translateX(1.2%) scale(1.01); }
   }
 
   /* Particles */
   .particles {
     position: absolute;
     inset: 0;
     z-index: 3;
     pointer-events: none;
     overflow: hidden;
   }
 
   .particle {
     position: absolute;
     width: 1px;
     height: 1px;
     background: rgba(201, 169, 110, 0.4);
     border-radius: 50%;
     animation: float linear infinite;
   }
 
   .particle:nth-child(1) { left: 10%; animation-duration: 12s; animation-delay: 0s; }
   .particle:nth-child(2) { left: 25%; animation-duration: 15s; animation-delay: 2s; }
   .particle:nth-child(3) { left: 40%; animation-duration: 18s; animation-delay: 4s; }
   .particle:nth-child(4) { left: 55%; animation-duration: 14s; animation-delay: 1s; }
   .particle:nth-child(5) { left: 70%; animation-duration: 16s; animation-delay: 3s; }
   .particle:nth-child(6) { left: 85%; animation-duration: 13s; animation-delay: 5s; }
   .particle:nth-child(7) { left: 35%; animation-duration: 19s; animation-delay: 6s; }
   .particle:nth-child(8) { left: 60%; animation-duration: 11s; animation-delay: 7s; }
 
   @keyframes float {
     0% { transform: translateY(100vh) scale(0); opacity: 0; }
     10% { opacity: 1; }
     90% { opacity: 1; }
     100% { transform: translateY(-10vh) scale(1); opacity: 0; }
   }
 
   /* Gate content */
   .gate-content {
     position: relative;
     z-index: 5;
     text-align: center;
     animation: gateAppear 2.5s ease-out forwards;
     opacity: 0;
   }
 
   @keyframes gateAppear {
     0%   { opacity: 0; transform: translateY(30px); }
     100% { opacity: 1; transform: translateY(0); }
   }
 
   .gate-symbol {
     font-family: 'Cinzel', serif;
     font-size: 0.7rem;
     letter-spacing: 0.6em;
     text-transform: uppercase;
     color: var(--gold-dim);
     margin-bottom: 3rem;
     animation: symbolPulse 4s ease-in-out infinite;
   }
 
   @keyframes symbolPulse {
     0%, 100% { opacity: 0.6; }
     50% { opacity: 1; }
   }
 
   .gate-title {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(3.5rem, 12vw, 8rem);
     font-weight: 900;
     color: var(--text);
     letter-spacing: 0.3em;
     line-height: 1;
     margin-bottom: 0.5rem;
     text-shadow: 0 0 60px rgba(201,169,110,0.1);
   }
 
   .gate-title-en {
     font-family: 'Cinzel', serif;
     font-size: clamp(0.6rem, 1.8vw, 1.1rem);
     font-weight: 400;
     letter-spacing: 0.8em;
     text-transform: uppercase;
     color: var(--gold-dim);
     margin-bottom: 2.5rem;
   }
 
   .gate-motto {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(1.2rem, 3vw, 2rem);
     color: var(--gold);
     letter-spacing: 0.5em;
     margin-bottom: 0.5rem;
     font-weight: 600;
   }
 
   .gate-motto-en {
     font-family: 'Cinzel', serif;
     font-size: clamp(0.5rem, 1.2vw, 0.8rem);
     letter-spacing: 0.6em;
     text-transform: uppercase;
     color: var(--text-dim);
     margin-bottom: 3.5rem;
   }
 
   .gate-divider {
     width: 1px;
     height: 60px;
     background: linear-gradient(to bottom, var(--gold-dim), transparent);
     margin: 0 auto 2.5rem;
   }
 
   .gate-btn {
     display: inline-block;
     padding: 1rem 3rem;
     border: 1px solid var(--gold-dim);
     color: var(--gold);
     text-decoration: none;
     font-family: 'Cinzel', serif;
     font-size: 0.75rem;
     letter-spacing: 0.4em;
     text-transform: uppercase;
     transition: all 0.6s ease;
     background: transparent;
     cursor: pointer;
   }
 
   .gate-btn:hover {
     background: rgba(201, 169, 110, 0.08);
     border-color: var(--gold);
   }
 
   /* Scroll indicator */
   .scroll-indicator {
     position: absolute;
     bottom: 2.5rem;
     left: 50%;
     transform: translateX(-50%);
     z-index: 5;
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 0.5rem;
     animation: scrollBounce 2.5s ease-in-out infinite;
     cursor: pointer;
   }
 
   @keyframes scrollBounce {
     0%, 100% { transform: translateX(-50%) translateY(0); }
     50% { transform: translateX(-50%) translateY(8px); }
   }
 
   .scroll-indicator span {
     font-family: 'Cinzel', serif;
     font-size: 0.5rem;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: var(--text-dimmer);
   }
 
   .scroll-line {
     width: 1px;
     height: 30px;
     background: linear-gradient(to bottom, var(--text-dimmer), transparent);
   }
 
   /* =============================================
    *  SECTION 1: RESTORATION DECREE
    * ============================================= */
   .decree-section {
     width: 100%;
     background: var(--dark);
     padding: 6rem 1.5rem;
     display: flex;
     justify-content: center;
   }
 
   .decree-container {
     max-width: 720px;
     width: 100%;
   }
 
   .decree-header {
     text-align: center;
     margin-bottom: 3rem;
   }
 
   .decree-label {
     font-family: 'Cinzel', serif;
     font-size: 0.6rem;
     letter-spacing: 0.5em;
     text-transform: uppercase;
     color: var(--text-dimmer);
     margin-bottom: 1rem;
   }
 
   .decree-title {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(1.2rem, 2.5vw, 1.8rem);
     font-weight: 700;
     color: var(--vermilion);
     letter-spacing: 0.15em;
   }
 
   .decree-title-en {
     font-family: 'Cinzel', serif;
     font-size: clamp(0.5rem, 1vw, 0.7rem);
     letter-spacing: 0.4em;
     color: var(--text-dim);
     margin-top: 0.5rem;
   }
 
   .decree-body {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(0.9rem, 1.3vw, 1.05rem);
     line-height: 2.2;
     color: var(--text);
     text-align: justify;
     padding: 2rem 0;
     border-top: 1px solid var(--border);
     border-bottom: 1px solid var(--border);
     position: relative;
   }
 
   .decree-body p {
     margin-bottom: 1.5rem;
   }
 
   .decree-body p:last-child {
     margin-bottom: 0;
   }
 
   .decree-seal {
     text-align: right;
     margin-top: 2rem;
     font-family: 'Cinzel', serif;
     font-size: 0.7rem;
     letter-spacing: 0.2em;
     color: var(--gold-dim);
   }
 
   .decree-seal-mark {
     display: inline-block;
     width: 50px;
     height: 50px;
     border: 1px solid var(--gold-dim);
     border-radius: 50%;
     margin-right: 1rem;
     vertical-align: middle;
     position: relative;
   }
 
   .decree-seal-mark::after {
     content: '灞?;
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     font-family: 'Noto Serif SC', serif;
     font-size: 1.2rem;
     color: var(--vermilion);
     opacity: 0.7;
   }
 
   /* =============================================
    *  SECTION 2: NAVIGATION GATES
    * ============================================= */
   .nav-section {
     width: 100%;
     background: var(--black);
     padding: 4rem 1.5rem;
   }
 
   .nav-inner {
     max-width: 1000px;
     margin: 0 auto;
   }
 
   .nav-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     gap: 1px;
     background: var(--border);
   }
 
   .nav-item {
     background: var(--dark);
     padding: 2.5rem 1.5rem;
     text-decoration: none;
     color: var(--text);
     transition: all 0.4s ease;
     position: relative;
     overflow: hidden;
     display: block;
   }
 
   .nav-item::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 2px;
     background: var(--gold);
     transform: scaleX(0);
     transform-origin: left;
     transition: transform 0.4s ease;
   }
 
   .nav-item:hover::before {
     transform: scaleX(1);
   }
 
   .nav-item:hover {
     background: #111;
   }
 
   .nav-item-icon {
     font-family: 'Noto Serif SC', serif;
     font-size: 1.4rem;
     margin-bottom: 0.8rem;
     opacity: 0.5;
   }
 
   .nav-item-title {
     font-family: 'Noto Serif SC', serif;
     font-size: 1.1rem;
     font-weight: 600;
     margin-bottom: 0.3rem;
     display: flex;
     align-items: center;
     gap: 0.6rem;
   }
 
   .nav-item-title-en {
     font-family: 'Cinzel', serif;
     font-size: 0.55rem;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: var(--text-dim);
   }
 
   .nav-item-desc {
     font-family: 'Lora', serif;
     font-size: 0.8rem;
     color: var(--text-dimmer);
     line-height: 1.6;
     margin-top: 0.4rem;
   }
 
   .nav-item-color-shoucang { border-left: 2px solid var(--vermilion); }
   .nav-item-color-langhuan { border-left: 2px solid var(--copper); }
   .nav-item-color-shiwei   { border-left: 2px solid var(--gold); }
   .nav-item-color-shilian  { border-left: 2px solid var(--green); }
   .nav-item-color-wendao   { border-left: 2px solid var(--moonwhite); }
   .nav-item-color-shifang  { border-left: 2px solid var(--copper); }
 
   /* =============================================
    *  SECTION 3: LANGUAGE SWITCH
    * ============================================= */
   .lang-switch {
     position: fixed;
     top: 2rem;
     right: 2rem;
     z-index: 50;
     display: flex;
     gap: 1rem;
   }
 
   .lang-switch a {
     color: var(--text-dimmer);
     text-decoration: none;
     font-family: 'Cinzel', serif;
     font-size: 0.6rem;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     transition: color 0.4s;
   }
 
   .lang-switch a:hover { color: var(--gold-dim); }
   .lang-switch a.active { color: var(--gold); }
 
   /* =============================================
    *  SECTION 4: RECENT DECRYPTIONS
    * ============================================= */
   .recent-section {
     width: 100%;
     background: var(--dark);
     padding: 4rem 1.5rem;
   }
 
   .recent-inner {
     max-width: 1000px;
     margin: 0 auto;
   }
 
   .section-title {
     font-family: 'Noto Serif SC', serif;
     font-size: 1rem;
     color: var(--text-dim);
     margin-bottom: 1.5rem;
     letter-spacing: 0.1em;
   }
 
   .recent-list {
     display: flex;
     flex-direction: column;
     gap: 1px;
   }
 
   .recent-item {
     background: var(--black);
     padding: 1rem 1rem;
     text-decoration: none;
     display: flex;
     align-items: center;
     gap: 1rem;
     transition: background 0.3s;
   }
 
   .recent-item:hover { background: #111; }
 
   .recent-id {
     font-family: 'Cinzel', serif;
     font-size: 0.6rem;
     color: var(--gold-dim);
     min-width: 65px;
     letter-spacing: 0.1em;
   }
 
   .recent-name {
     font-family: 'Noto Serif SC', serif;
     font-size: 0.9rem;
     color: var(--text);
     font-weight: 600;
   }
 
   .recent-name-en {
     font-family: 'Lora', serif;
     font-size: 0.75rem;
     color: var(--text-dim);
     font-style: italic;
   }
 
   .recent-meta {
     margin-left: auto;
     font-family: 'Cinzel', serif;
     font-size: 0.55rem;
     color: var(--text-dimmer);
     letter-spacing: 0.15em;
   }
 
   /* =============================================
    *  FOOTER
    * ============================================= */
   .site-footer {
     width: 100%;
     background: var(--black);
     border-top: 1px solid var(--border);
     padding: 3rem 1.5rem;
     text-align: center;
   }
 
   .footer-motto {
     font-family: 'Noto Serif SC', serif;
     font-size: 1.2rem;
     color: var(--gold-dim);
     letter-spacing: 0.3em;
     margin-bottom: 0.5rem;
   }
 
   .footer-disclaimer {
     font-family: 'Lora', serif;
     font-size: 0.65rem;
     color: var(--text-dimmer);
     line-height: 1.8;
   }
 
   @media (max-width: 640px) {
     .nav-grid { grid-template-columns: 1fr; }
     .recent-item { flex-wrap: wrap; }
     .recent-meta { margin-left: 0; width: 100%; }
     .gate-title { letter-spacing: 0.15em; }
   }
 

/* ===== NANMANG FRONT PAGE ===== */

   *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
   @import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700;900&family=Lora:ital,wght@0,400;0,600;1,400&family=Noto+Serif+SC:wght@400;600;700;900&display=swap');
 
   :root {
     --gold: #C9A96E;
     --gold-dim: rgba(201, 169, 110, 0.6);
     --black: #050505;
     --dark: #0D0D0D;
     --surface: #1A1A1A;
     --border: #2A2A2A;
     --text: #E0D8C8;
     --text-dim: #8A8578;
     --text-dimmer: #5A5548;
     --vermilion: #C0392B;
     --green: #2D5016;
     --copper: #8B6914;
     --moonwhite: #D4D4C8;
   }
 
   html { scroll-behavior: smooth; }
 
   body {
     font-family: 'Noto Serif SC', 'Lora', serif;
     background: var(--black);
     color: var(--text);
     overflow-x: hidden;
   }
 
   /* =============================================
    *  SECTION 0: THE MOUNTAIN GATE (Hero)
    * ============================================= */
   .gate {
     position: relative;
     width: 100%;
     height: 100vh;
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
   }
 
   .gate-bg {
     position: absolute;
     inset: 0;
     background:
       url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 900"><defs><linearGradient id="g" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="0%" stop-color="%2305080e"/><stop offset="30%" stop-color="%230a0f1a"/><stop offset="60%" stop-color="%23101820"/><stop offset="100%" stop-color="%23050505"/></linearGradient><clipPath id="c"><path d="M0,900 L200,600 L350,300 L500,100 L650,250 L800,50 L950,200 L1100,100 L1250,300 L1400,600 L1600,900 Z"/></clipPath></defs><rect width="1600" height="900" fill="url(%23g)"/><g clip-path="url(%23c)"><polygon points="0,900 200,600 350,300 500,100 650,250 800,50 950,200 1100,100 1250,300 1400,600 1600,900" fill="%230d0d0d"/><polygon points="0,900 200,620 350,340 500,160 650,290 800,100 950,230 1100,140 1250,340 1400,620 1600,900" fill="%23121212"/><polygon points="0,900 200,650 350,380 500,220 650,330 800,150 950,260 1100,190 1250,380 1400,650 1600,900" fill="%23161818"/><polygon points="0,900 200,680 350,420 500,280 650,370 800,200 950,300 1100,240 1250,420 1400,680 1600,900" fill="%231a1c1c"/><polygon points="0,900 200,720 350,480 500,360 650,430 800,280 950,360 1100,320 1250,480 1400,720 1600,900" fill="%231e2020"/></g></svg>')
       center/cover no-repeat;
     filter: brightness(0.5) contrast(1.1);
   }
 
   .gate-bg::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(to bottom,
       transparent 0%, transparent 30%,
       rgba(5,5,5,0.3) 50%,
       rgba(5,5,5,0.6) 70%,
       rgba(5,5,5,0.85) 85%,
       #050505 100%
     );
   }
 
   /* Fog overlay */
   .fog {
     position: absolute;
     inset: 0;
     pointer-events: none;
     z-index: 2;
     opacity: 0.25;
     background:
       radial-gradient(ellipse at 20% 50%, rgba(180,175,165,0.15) 0%, transparent 60%),
       radial-gradient(ellipse at 75% 40%, rgba(160,155,145,0.10) 0%, transparent 55%),
       radial-gradient(ellipse at 50% 70%, rgba(140,135,125,0.12) 0%, transparent 50%);
     animation: fogDrift 35s ease-in-out infinite alternate;
   }
 
   @keyframes fogDrift {
     0%   { transform: translateX(0) scale(1); }
     33%  { transform: translateX(2%) scale(1.02); }
     66%  { transform: translateX(-1.5%) scale(0.98); }
     100% { transform: translateX(1.2%) scale(1.01); }
   }
 
   /* Particles */
   .particles {
     position: absolute;
     inset: 0;
     z-index: 3;
     pointer-events: none;
     overflow: hidden;
   }
 
   .particle {
     position: absolute;
     width: 1px;
     height: 1px;
     background: rgba(201, 169, 110, 0.4);
     border-radius: 50%;
     animation: float linear infinite;
   }
 
   .particle:nth-child(1) { left: 10%; animation-duration: 12s; animation-delay: 0s; }
   .particle:nth-child(2) { left: 25%; animation-duration: 15s; animation-delay: 2s; }
   .particle:nth-child(3) { left: 40%; animation-duration: 18s; animation-delay: 4s; }
   .particle:nth-child(4) { left: 55%; animation-duration: 14s; animation-delay: 1s; }
   .particle:nth-child(5) { left: 70%; animation-duration: 16s; animation-delay: 3s; }
   .particle:nth-child(6) { left: 85%; animation-duration: 13s; animation-delay: 5s; }
   .particle:nth-child(7) { left: 35%; animation-duration: 19s; animation-delay: 6s; }
   .particle:nth-child(8) { left: 60%; animation-duration: 11s; animation-delay: 7s; }
 
   @keyframes float {
     0% { transform: translateY(100vh) scale(0); opacity: 0; }
     10% { opacity: 1; }
     90% { opacity: 1; }
     100% { transform: translateY(-10vh) scale(1); opacity: 0; }
   }
 
   /* Gate content */
   .gate-content {
     position: relative;
     z-index: 5;
     text-align: center;
     animation: gateAppear 2.5s ease-out forwards;
     opacity: 0;
   }
 
   @keyframes gateAppear {
     0%   { opacity: 0; transform: translateY(30px); }
     100% { opacity: 1; transform: translateY(0); }
   }
 
   .gate-symbol {
     font-family: 'Cinzel', serif;
     font-size: 0.7rem;
     letter-spacing: 0.6em;
     text-transform: uppercase;
     color: var(--gold-dim);
     margin-bottom: 3rem;
     animation: symbolPulse 4s ease-in-out infinite;
   }
 
   @keyframes symbolPulse {
     0%, 100% { opacity: 0.6; }
     50% { opacity: 1; }
   }
 
   .gate-title {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(3.5rem, 12vw, 8rem);
     font-weight: 900;
     color: var(--text);
     letter-spacing: 0.3em;
     line-height: 1;
     margin-bottom: 0.5rem;
     text-shadow: 0 0 60px rgba(201,169,110,0.1);
   }
 
   .gate-title-en {
     font-family: 'Cinzel', serif;
     font-size: clamp(0.6rem, 1.8vw, 1.1rem);
     font-weight: 400;
     letter-spacing: 0.8em;
     text-transform: uppercase;
     color: var(--gold-dim);
     margin-bottom: 2.5rem;
   }
 
   .gate-motto {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(1.2rem, 3vw, 2rem);
     color: var(--gold);
     letter-spacing: 0.5em;
     margin-bottom: 0.5rem;
     font-weight: 600;
   }
 
   .gate-motto-en {
     font-family: 'Cinzel', serif;
     font-size: clamp(0.5rem, 1.2vw, 0.8rem);
     letter-spacing: 0.6em;
     text-transform: uppercase;
     color: var(--text-dim);
     margin-bottom: 3.5rem;
   }
 
   .gate-divider {
     width: 1px;
     height: 60px;
     background: linear-gradient(to bottom, var(--gold-dim), transparent);
     margin: 0 auto 2.5rem;
   }
 
   .gate-btn {
     display: inline-block;
     padding: 1rem 3rem;
     border: 1px solid var(--gold-dim);
     color: var(--gold);
     text-decoration: none;
     font-family: 'Cinzel', serif;
     font-size: 0.75rem;
     letter-spacing: 0.4em;
     text-transform: uppercase;
     transition: all 0.6s ease;
     background: transparent;
     cursor: pointer;
   }
 
   .gate-btn:hover {
     background: rgba(201, 169, 110, 0.08);
     border-color: var(--gold);
   }
 
   /* Scroll indicator */
   .scroll-indicator {
     position: absolute;
     bottom: 2.5rem;
     left: 50%;
     transform: translateX(-50%);
     z-index: 5;
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 0.5rem;
     animation: scrollBounce 2.5s ease-in-out infinite;
     cursor: pointer;
   }
 
   @keyframes scrollBounce {
     0%, 100% { transform: translateX(-50%) translateY(0); }
     50% { transform: translateX(-50%) translateY(8px); }
   }
 
   .scroll-indicator span {
     font-family: 'Cinzel', serif;
     font-size: 0.5rem;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: var(--text-dimmer);
   }
 
   .scroll-line {
     width: 1px;
     height: 30px;
     background: linear-gradient(to bottom, var(--text-dimmer), transparent);
   }
 
   /* =============================================
    *  SECTION 1: RESTORATION DECREE
    * ============================================= */
   .decree-section {
     width: 100%;
     background: var(--dark);
     padding: 6rem 1.5rem;
     display: flex;
     justify-content: center;
   }
 
   .decree-container {
     max-width: 720px;
     width: 100%;
   }
 
   .decree-header {
     text-align: center;
     margin-bottom: 3rem;
   }
 
   .decree-label {
     font-family: 'Cinzel', serif;
     font-size: 0.6rem;
     letter-spacing: 0.5em;
     text-transform: uppercase;
     color: var(--text-dimmer);
     margin-bottom: 1rem;
   }
 
   .decree-title {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(1.2rem, 2.5vw, 1.8rem);
     font-weight: 700;
     color: var(--vermilion);
     letter-spacing: 0.15em;
   }
 
   .decree-title-en {
     font-family: 'Cinzel', serif;
     font-size: clamp(0.5rem, 1vw, 0.7rem);
     letter-spacing: 0.4em;
     color: var(--text-dim);
     margin-top: 0.5rem;
   }
 
   .decree-body {
     font-family: 'Noto Serif SC', serif;
     font-size: clamp(0.9rem, 1.3vw, 1.05rem);
     line-height: 2.2;
     color: var(--text);
     text-align: justify;
     padding: 2rem 0;
     border-top: 1px solid var(--border);
     border-bottom: 1px solid var(--border);
     position: relative;
   }
 
   .decree-body p {
     margin-bottom: 1.5rem;
   }
 
   .decree-body p:last-child {
     margin-bottom: 0;
   }
 
   .decree-seal {
     text-align: right;
     margin-top: 2rem;
     font-family: 'Cinzel', serif;
     font-size: 0.7rem;
     letter-spacing: 0.2em;
     color: var(--gold-dim);
   }
 
   .decree-seal-mark {
     display: inline-block;
     width: 50px;
     height: 50px;
     border: 1px solid var(--gold-dim);
     border-radius: 50%;
     margin-right: 1rem;
     vertical-align: middle;
     position: relative;
   }
 
   .decree-seal-mark::after {
     content: '灞?;
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     font-family: 'Noto Serif SC', serif;
     font-size: 1.2rem;
     color: var(--vermilion);
     opacity: 0.7;
   }
 
   /* =============================================
    *  SECTION 2: NAVIGATION GATES
    * ============================================= */
   .nav-section {
     width: 100%;
     background: var(--black);
     padding: 4rem 1.5rem;
   }
 
   .nav-inner {
     max-width: 1000px;
     margin: 0 auto;
   }
 
   .nav-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     gap: 1px;
     background: var(--border);
   }
 
   .nav-item {
     background: var(--dark);
     padding: 2.5rem 1.5rem;
     text-decoration: none;
     color: var(--text);
     transition: all 0.4s ease;
     position: relative;
     overflow: hidden;
     display: block;
   }
 
   .nav-item::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 2px;
     background: var(--gold);
     transform: scaleX(0);
     transform-origin: left;
     transition: transform 0.4s ease;
   }
 
   .nav-item:hover::before {
     transform: scaleX(1);
   }
 
   .nav-item:hover {
     background: #111;
   }
 
   .nav-item-icon {
     font-family: 'Noto Serif SC', serif;
     font-size: 1.4rem;
     margin-bottom: 0.8rem;
     opacity: 0.5;
   }
 
   .nav-item-title {
     font-family: 'Noto Serif SC', serif;
     font-size: 1.1rem;
     font-weight: 600;
     margin-bottom: 0.3rem;
     display: flex;
     align-items: center;
     gap: 0.6rem;
   }
 
   .nav-item-title-en {
     font-family: 'Cinzel', serif;
     font-size: 0.55rem;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: var(--text-dim);
   }
 
   .nav-item-desc {
     font-family: 'Lora', serif;
     font-size: 0.8rem;
     color: var(--text-dimmer);
     line-height: 1.6;
     margin-top: 0.4rem;
   }
 
   .nav-item-color-shoucang { border-left: 2px solid var(--vermilion); }
   .nav-item-color-langhuan { border-left: 2px solid var(--copper); }
   .nav-item-color-shiwei   { border-left: 2px solid var(--gold); }
   .nav-item-color-shilian  { border-left: 2px solid var(--green); }
   .nav-item-color-wendao   { border-left: 2px solid var(--moonwhite); }
   .nav-item-color-shifang  { border-left: 2px solid var(--copper); }
 
   /* =============================================
    *  SECTION 3: LANGUAGE SWITCH
    * ============================================= */
   .lang-switch {
     position: fixed;
     top: 2rem;
     right: 2rem;
     z-index: 50;
     display: flex;
     gap: 1rem;
   }
 
   .lang-switch a {
     color: var(--text-dimmer);
     text-decoration: none;
     font-family: 'Cinzel', serif;
     font-size: 0.6rem;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     transition: color 0.4s;
   }
 
   .lang-switch a:hover { color: var(--gold-dim); }
   .lang-switch a.active { color: var(--gold); }
 
   /* =============================================
    *  SECTION 4: RECENT DECRYPTIONS
    * ============================================= */
   .recent-section {
     width: 100%;
     background: var(--dark);
     padding: 4rem 1.5rem;
   }
 
   .recent-inner {
     max-width: 1000px;
     margin: 0 auto;
   }
 
   .section-title {
     font-family: 'Noto Serif SC', serif;
     font-size: 1rem;
     color: var(--text-dim);
     margin-bottom: 1.5rem;
     letter-spacing: 0.1em;
   }
 
   .recent-list {
     display: flex;
     flex-direction: column;
     gap: 1px;
   }
 
   .recent-item {
     background: var(--black);
     padding: 1rem 1rem;
     text-decoration: none;
     display: flex;
     align-items: center;
     gap: 1rem;
     transition: background 0.3s;
   }
 
   .recent-item:hover { background: #111; }
 
   .recent-id {
     font-family: 'Cinzel', serif;
     font-size: 0.6rem;
     color: var(--gold-dim);
     min-width: 65px;
     letter-spacing: 0.1em;
   }
 
   .recent-name {
     font-family: 'Noto Serif SC', serif;
     font-size: 0.9rem;
     color: var(--text);
     font-weight: 600;
   }
 
   .recent-name-en {
     font-family: 'Lora', serif;
     font-size: 0.75rem;
     color: var(--text-dim);
     font-style: italic;
   }
 
   .recent-meta {
     margin-left: auto;
     font-family: 'Cinzel', serif;
     font-size: 0.55rem;
     color: var(--text-dimmer);
     letter-spacing: 0.15em;
   }
 
   /* =============================================
    *  FOOTER
    * ============================================= */
   .site-footer {
     width: 100%;
     background: var(--black);
     border-top: 1px solid var(--border);
     padding: 3rem 1.5rem;
     text-align: center;
   }
 
   .footer-motto {
     font-family: 'Noto Serif SC', serif;
     font-size: 1.2rem;
     color: var(--gold-dim);
     letter-spacing: 0.3em;
     margin-bottom: 0.5rem;
   }
 
   .footer-disclaimer {
     font-family: 'Lora', serif;
     font-size: 0.65rem;
     color: var(--text-dimmer);
     line-height: 1.8;
   }
 
   @media (max-width: 640px) {
     .nav-grid { grid-template-columns: 1fr; }
     .recent-item { flex-wrap: wrap; }
     .recent-meta { margin-left: 0; width: 100%; }
     .gate-title { letter-spacing: 0.15em; }
   }

/* ===== GLOBAL DARK THEME OVERRIDES ===== */
body {
    background: #050505 !important;
    color: #E0D8C8 !important;
}
.site, .page, .site-content, .site-main, .inside-article, .content-area, .site-footer {
    background: #050505 !important;
    color: #E0D8C8 !important;
}
.entry-header, .entry-content, .entry-summary, .page-header {
    background: transparent !important;
}
h1, h2, h3, h4, h5 {
    color: #E0D8C8 !important;
}
p, li, .entry-meta {
    color: #B0A898 !important;
}
a {
    color: #C9A96E !important;
}
a:hover {
    color: #D4B87A !important;
}
.entry-title a {
    color: #C9A96E !important;
}
.separate-containers .inside-article, .separate-containers .site-main {
    background: #0D0D0D !important;
    padding: 2rem;
    border: 1px solid #2A2A2A;
    border-radius: 6px;
    margin-bottom: 1.5rem;
}
.site-header {
    background: #0A0A0A !important;
    border-bottom: 1px solid #2A2A2A !important;
}
.main-navigation, .main-navigation ul ul {
    background: #0A0A0A !important;
}
.main-navigation a {
    color: #B0A898 !important;
}
.main-navigation .menu-item-has-children > a::after {
    border-color: #B0A898 transparent !important;
}
button, .button, .wp-block-button__link {
    background: #1A1A1A !important;
    color: #C9A96E !important;
    border: 1px solid #C9A96E !important;
}
button:hover, .button:hover {
    background: #2A2A2A !important;
}
input, textarea, select {
    background: #1A1A1A !important;
    color: #E0D8C8 !important;
    border: 1px solid #2A2A2A !important;
}
.widget-title {
    color: #C9A96E !important;
}
.site-footer {
    background: #0A0A0A !important;
    border-top: 1px solid #2A2A2A !important;
}
/* Sidebar */
.widget {
    background: #0D0D0D !important;
    padding: 1.5rem !important;
    border: 1px solid #2A2A2A !important;
}
/* Card grid for summary pages */
.cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1px;
    background: #2A2A2A;
    border: 1px solid #2A2A2A;
    border-radius: 6px;
    overflow: hidden;
    margin: 2rem 0;
}
.card-item {
    background: #1A1A1A;
    padding: 2rem 1.5rem;
    text-decoration: none;
    display: block;
    transition: all 0.3s;
}
.card-item:hover {
    background: #222;
}
.card-item .card-title {
    font-family: 'Noto Serif SC', serif;
    font-size: 1rem;
    color: #C9A96E;
    font-weight: 600;
    margin-bottom: 0.3rem;
}
.card-item .card-meta {
    font-family: 'Cinzel', serif;
    font-size: 0.55rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: #8A8578;
    margin-bottom: 0.5rem;
}
.card-item .card-desc {
    font-family: 'Lora', serif;
    font-size: 0.8rem;
    color: #6B5B3E;
    line-height: 1.6;
}
.card-item .card-read {
    font-family: 'Cinzel', serif;
    font-size: 0.6rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #C9A96E;
    margin-top: 0.8rem;
}
/* Back link */
.back-link {
    display: inline-block;
    margin-bottom: 2rem;
    font-family: 'Cinzel', serif;
    font-size: 0.65rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #8A8578;
    text-decoration: none;
}
.back-link:hover { color: #C9A96E; }