/* 基础与变量 CSS */
        :root {
            --simp-green: #39FF14;
            --simp-pink: #FF00FF;
            --simp-black: #000000;
            --simp-dark: #111111;
            --simp-border: #333333;
            --simp-text-mut: #6b7280;
            --simp-text-sub: #9ca3af;
        }

        .simp-wrapper { max-width: 1152px; margin: 0 auto; width: 100%; padding: 1rem; box-sizing: border-box; font-family: 'Noto Sans TC', sans-serif; background-color: transparent; color: #ffffff; }
        .simp-wrapper * { box-sizing: border-box; border-radius: 0 !important; }

        .simp-header { margin-bottom: 1.5rem; border-bottom: 4px solid var(--simp-green); padding-bottom: 1rem; display: flex; flex-direction: column; gap: 1rem; }
        @media (min-width: 768px) { .simp-header { flex-direction: row; justify-content: space-between; align-items: flex-end; } .simp-wrapper { padding: 2rem; } }
        .simp-title { font-size: 2.25rem; font-weight: 900; margin: 0 0 0.5rem 0; color: #fff; }
        @media (min-width: 768px) { .simp-title { font-size: 3rem; } }
        .simp-subtitle { color: var(--simp-green); font-family: monospace; margin: 0; font-size: 1rem; }
        .simp-slogan { color: var(--simp-text-mut); font-family: monospace; display: none; margin: 0;}
        @media (min-width: 768px) { .simp-slogan { display: block; } }

        .glitch-text { position: relative; animation: glitch-anim 2s infinite linear alternate-reverse; }
        @keyframes glitch-anim { 0% { text-shadow: -2px 0 var(--simp-pink); } 2% { text-shadow: 2px 0 #FFFF00; } 4% { text-shadow: -1px 0 var(--simp-pink); } 100% { text-shadow: 0 0 transparent; } }

        .simp-tabs { display: flex; gap: 1rem; margin-bottom: 2rem; }
        .simp-tab-btn { flex: 1; background-color: var(--simp-black); color: #fff; border: 2px solid var(--simp-border); font-weight: 900; font-size: 1.125rem; padding: 0.75rem 0; cursor: pointer; transition: all 0.3s; text-align: center; }
        .simp-tab-btn:hover { border-color: var(--simp-green); }
        .simp-tab-btn.active { background-color: var(--simp-green); color: var(--simp-black); border-color: var(--simp-green); }
        .simp-tab-content { display: none; animation: fadeIn 0.3s ease-out; }
        .simp-tab-content.active { display: block; }
        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

        .simp-featured { background-color: var(--simp-dark); border: 2px solid var(--simp-pink); margin-bottom: 2rem; cursor: pointer; display: flex; flex-direction: column; transition: all 0.3s; }
        .simp-featured:hover { box-shadow: 8px 8px 0 var(--simp-pink); }
        .simp-featured-img { width: 100%; aspect-ratio: 16 / 9; border-bottom: 2px solid var(--simp-pink); position: relative; background-color: var(--simp-black); display: flex; align-items: center; justify-content: center; background-size: cover; background-position: center; overflow: hidden; }
        .simp-featured-badge { position: absolute; top: 0.5rem; left: 0.5rem; background-color: var(--simp-pink); color: #fff; padding: 0.25rem 0.5rem; font-size: 0.75rem; font-weight: bold; border: 1px solid #fff; z-index: 10; }
        .simp-featured-svg { width: 6rem; height: 6rem; color: var(--simp-pink); opacity: 0.5; transition: transform 0.3s; }
        .simp-featured:hover .simp-featured-svg { transform: scale(1.1); }
        .simp-featured-body { padding: 1.5rem; display: flex; flex-direction: column; justify-content: center; width: 100%; }
        @media (min-width: 768px) { .simp-featured { flex-direction: row; } .simp-featured-img { width: 50%; border-bottom: none; border-right: 2px solid var(--simp-pink); } .simp-featured-body { width: 50%; padding: 2rem; } }
        .simp-meta { font-size: 0.75rem; color: var(--simp-green); font-family: monospace; margin-bottom: 0.5rem; }
        .simp-featured-title { font-size: 1.5rem; font-weight: 900; color: #fff; margin: 0 0 1rem 0; line-height: 1.2; transition: color 0.3s; }
        .simp-featured:hover .simp-featured-title { color: var(--simp-pink); }

        .simp-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
        @media (min-width: 768px) { .simp-grid { grid-template-columns: repeat(2, 1fr); } }
        @media (min-width: 1024px) { .simp-grid.cols-3 { grid-template-columns: repeat(3, 1fr); } }

        .simp-card { background-color: var(--simp-black); border: 1px solid var(--simp-border); padding: 1.25rem; display: flex; flex-direction: column; cursor: pointer; transition: all 0.2s; position: relative; }
        .simp-card:hover { border-color: var(--simp-green); box-shadow: 4px 4px 0 rgba(57, 255, 20, 0.2); }
        .simp-card-meta { font-size: 10px; color: var(--simp-text-mut); margin-bottom: 0.5rem; font-family: monospace; }
        .simp-card-title { font-size: 1.125rem; font-weight: bold; color: #fff; margin: 0 0 0.75rem 0; line-height: 1.2; transition: color 0.3s; }
        .simp-card:hover .simp-card-title.hover-pink { color: var(--simp-pink); }
        .simp-card:hover .simp-card-title.hover-green { color: var(--simp-green); }
        .simp-excerpt { color: var(--simp-text-sub); font-size: 0.875rem; margin: 0 0 1.25rem 0; flex: 1; }
        .line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

        .simp-card-footer { border-top: 1px solid var(--simp-border); padding-top: 0.75rem; display: flex; justify-content: space-between; align-items: center; margin-top: auto; }
        
        .simp-btn-read { background-color: transparent !important; border: none !important; border-bottom: 1px solid var(--simp-pink) !important; color: var(--simp-pink); font-weight: bold; cursor: pointer; padding: 0; font-size: 1rem; transition: all 0.3s; box-shadow: none !important; }
        .simp-btn-read:hover, .simp-btn-read:focus, .simp-btn-read:active { color: #fff; border-bottom-color: #fff !important; background-color: transparent !important; box-shadow: none !important; outline: none !important; }

        .simp-interact-btn { background-color: transparent !important; border: none !important; color: var(--simp-text-mut); display: flex; align-items: center; gap: 0.25rem; cursor: pointer; font-family: monospace; font-size: 0.875rem; transition: transform 0.2s; padding: 0; box-shadow: none !important; }
        .simp-interact-btn:hover, .simp-interact-btn:focus, .simp-interact-btn:active { transform: scale(1.1); background-color: transparent !important; outline: none !important; box-shadow: none !important; }
        .simp-interact-btn .icon { font-size: 1.25rem; display: inline-block; }
        .simp-interact-btn.active-pink { color: var(--simp-pink); }
        .simp-interact-btn.active-green { color: var(--simp-green); }

        @keyframes bounce-small { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-25%); } }
        .animate-bounce-small { animation: bounce-small 1s; }

        .simp-share-btn { background-color: transparent !important; border: 1px solid var(--simp-text-mut) !important; color: var(--simp-text-mut); padding: 0.1rem 0.5rem; font-size: 0.75rem; cursor: pointer; border-radius: 2px !important; box-shadow: none !important; }
        .simp-share-btn:hover, .simp-share-btn:focus, .simp-share-btn:active { color: #fff; border-color: #fff !important; background-color: transparent !important; box-shadow: none !important; outline: none !important; }

        /* SEO 分类专属样式（增加多种颜色池） */
        .seo-header-flex { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 1rem; }
        .seo-badge { font-weight: bold; padding: 0.25rem 0.5rem; font-size: 0.75rem; color: #000; border-radius: 2px; }
        .bg-tag-0 { background-color: var(--simp-green); color: #000; }
        .bg-tag-1 { background-color: #facc15; color: #000; } /* Yellow */
        .bg-tag-2 { background-color: #22d3ee; color: #000; } /* Cyan */
        .bg-tag-3 { background-color: #f472b6; color: #000; } /* Pink-ish */
        .bg-tag-4 { background-color: #a78bfa; color: #fff; } /* Purple */

        /* —— 文章詳情（單篇 post）—— */
        .simp-single-wrap { padding-top: 1.25rem; padding-bottom: 3rem; }

        .simp-single-back {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            margin-bottom: 1.25rem;
            font-size: 0.7rem;
            font-weight: 800;
            font-family: ui-monospace, monospace;
            color: var(--simp-text-mut);
            text-decoration: none;
            text-transform: uppercase;
            letter-spacing: 0.12em;
            border-bottom: 1px solid var(--simp-border);
            padding-bottom: 0.35rem;
            transition: color 0.2s, border-color 0.2s;
        }
        .simp-single-back:hover { color: var(--simp-green); border-bottom-color: var(--simp-green); }
        .simp-single-back__icon { width: 1rem; height: 1rem; flex-shrink: 0; color: var(--simp-green); }

        .simp-article-single {
            background-color: var(--simp-dark);
            border: 2px solid var(--simp-border);
            overflow: hidden;
        }
        .simp-article-single--diary { border-color: var(--simp-pink); }
        .simp-article-single--seo { border-color: var(--simp-green); }

        .simp-article-single__pill {
            display: inline-block;
            background: rgba(255, 0, 255, 0.12);
            color: var(--simp-pink);
            border: 1px solid rgba(255, 0, 255, 0.45);
            padding: 0.2rem 0.55rem;
            font-size: 0.7rem;
            font-weight: 800;
            letter-spacing: 0.06em;
        }

        .simp-article-single__meta-line { margin: 0; }
        .simp-article-single__dot { opacity: 0.6; }

        .simp-article-single__head { padding: 1.35rem 1.25rem 1rem; }
        @media (min-width: 768px) { .simp-article-single__head { padding: 2rem 2rem 1.25rem; } }

        .simp-article-single__badges { display: flex; flex-wrap: wrap; align-items: center; gap: 0.65rem 1rem; margin-bottom: 1rem; }

        .simp-article-single__title {
            font-size: 1.65rem;
            font-weight: 900;
            line-height: 1.15;
            color: #fff;
            margin: 0;
            letter-spacing: -0.02em;
        }
        @media (min-width: 768px) { .simp-article-single__title { font-size: 2.25rem; } }

        .simp-article-single__hero {
            position: relative;
            width: 100%;
            aspect-ratio: 21 / 9;
            min-height: 10rem;
            background-color: var(--simp-black);
            background-size: cover;
            background-position: center;
            border-top: 2px solid var(--simp-border);
            border-bottom: 2px solid var(--simp-border);
        }
        .simp-article-single--diary .simp-article-single__hero { border-color: var(--simp-pink); }
        .simp-article-single--seo .simp-article-single__hero { border-color: var(--simp-green); }

        .simp-article-single__hero-shade {
            position: absolute;
            inset: 0;
            background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, transparent 55%);
            pointer-events: none;
        }

        .simp-article-single__hero-fallback {
            position: absolute;
            inset: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: clamp(3rem, 12vw, 5rem);
            opacity: 0.35;
            filter: drop-shadow(0 0 20px rgba(255,255,255,0.2));
        }
        .simp-article-single--diary .simp-article-single__hero-fallback { color: var(--simp-pink); }
        .simp-article-single--seo .simp-article-single__hero-fallback { color: var(--simp-green); }

        .simp-article-single__body { padding: 1.5rem 1.25rem 1.75rem; }
        @media (min-width: 768px) { .simp-article-single__body { padding: 2rem 2rem 2.25rem; max-width: 52rem; margin: 0 auto; } }

        .simp-article-single__lead {
            font-size: 1.05rem;
            font-weight: 700;
            color: #e5e7eb;
            line-height: 1.65;
            margin: 0 0 1.5rem;
            padding-left: 1rem;
            border-left: 4px solid var(--simp-pink);
        }
        .simp-article-single--seo .simp-article-single__lead { border-left-color: var(--simp-green); }

        .simp-article-single__content {
            color: #d1d5db;
            font-size: 0.95rem;
            line-height: 1.85;
        }
        .simp-article-single__content > *:first-child { margin-top: 0; }
        .simp-article-single__content > *:last-child { margin-bottom: 0; }

        .simp-article-single__content p { margin: 0 0 1.15em; }
        .simp-article-single__content a {
            color: var(--simp-green);
            text-decoration: underline;
            text-underline-offset: 3px;
        }
        .simp-article-single__content a:hover { color: #fff; }

        .simp-article-single__content h2,
        .simp-article-single__content h3,
        .simp-article-single__content h4 {
            color: #fff;
            font-weight: 900;
            margin: 1.75em 0 0.65em;
            line-height: 1.25;
        }
        .simp-article-single__content h2 { font-size: 1.35rem; border-bottom: 1px solid var(--simp-border); padding-bottom: 0.35em; }
        .simp-article-single--diary .simp-article-single__content h2 { border-bottom-color: rgba(255, 0, 255, 0.35); }
        .simp-article-single--seo .simp-article-single__content h2 { border-bottom-color: rgba(57, 255, 20, 0.35); }
        .simp-article-single__content h3 { font-size: 1.12rem; }
        .simp-article-single__content h4 { font-size: 1rem; }

        .simp-article-single__content ul,
        .simp-article-single__content ol { margin: 0 0 1.15em 1.25em; padding: 0; }
        .simp-article-single__content li { margin-bottom: 0.35em; }

        .simp-article-single__content blockquote {
            margin: 1.25em 0;
            padding: 0.85rem 1rem;
            border-left: 4px solid var(--simp-pink);
            background: rgba(255, 255, 255, 0.04);
            color: #e5e7eb;
            font-style: italic;
        }
        .simp-article-single--seo .simp-article-single__content blockquote { border-left-color: var(--simp-green); }

        .simp-article-single__content img {
            max-width: 100%;
            height: auto;
            border: 1px solid var(--simp-border);
            display: block;
            margin: 1.25em auto;
        }

        .simp-article-single__content pre,
        .simp-article-single__content code {
            font-family: ui-monospace, monospace;
            font-size: 0.88em;
        }
        .simp-article-single__content pre {
            overflow-x: auto;
            padding: 1rem;
            background: #0a0a0a;
            border: 1px solid var(--simp-border);
            margin: 1.25em 0;
        }

        .simp-article-single__toolbar {
            margin-top: 2rem;
            padding-top: 1.25rem;
            border-top: 1px solid var(--simp-border);
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
        }
        .simp-article-single__share { margin: 0; }