        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        :root {
            /* Light theme variables - Xiaohongshu Style */
            --xhs-pink: #FE2C55;
            --xhs-pink-light: #FF6B8A;
            --xhs-pink-lighter: #FFE5EB;
            --xhs-pink-pale: #FFF5F7;
            --bg-gradient-start: #FFFFFF;
            --bg-gradient-end: #E6E8EB;
            /* Deeper blue-gray */
            --bg-gradient-mid: #F0F2F5;
            /* Lighter blue-gray */
            --container-bg: rgba(255, 255, 255, 0.98);
            --container-shadow: rgba(254, 44, 85, 0.08);
            --header-gradient-start: #FE2C55;
            --header-gradient-end: #FF6B8A;
            --header-gradient-mid: #FE4569;
            --header-color: white;
            --text-primary: #333333;
            --text-secondary: #666666;
            --text-tertiary: #999999;
            --text-light: #BBBBBB;
            --bg-light: #FAFAFA;
            --bg-lighter: #F5F5F5;
            --border-color: #EEEEEE;
            --filter-bg: rgba(255, 255, 255, 0.95);
            --poem-desc-bg: rgba(255, 255, 255, 0.98);
            --poem-desc-border: #FE2C55;
            --search-result-bg: #FAFAFA;
            --search-result-hover: #FFF5F7;
            --refresh-btn-gradient-start: #FE2C55;
            --refresh-btn-gradient-end: #FF6B8A;
            --refresh-btn-color: white;
            --clear-btn-bg: #999999;
            --clear-btn-hover: #666666;
            --search-btn-bg: #FE2C55;
            --search-btn-hover: #E02548;
            --footer-color: #999999;
            --accent-glow: rgba(254, 44, 85, 0.2);
            --card-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
            --card-shadow-hover: 0 4px 20px rgba(254, 44, 85, 0.15);
        }

        .dark-mode {
            /* Dark theme variables - Xiaohongshu Dark Style with improved contrast */
            --xhs-pink: #FF6B8A;
            --xhs-pink-light: #FF8FA8;
            --xhs-pink-lighter: #FFB3C6;
            --xhs-pink-pale: #3A1A25;
            --bg-gradient-start: #0A0A0A;
            --bg-gradient-end: #1F242B;
            /* Deeper blue-gray */
            --bg-gradient-mid: #171B22;
            /* Lighter blue-gray */
            --container-bg: rgba(30, 30, 30, 0.97);
            --container-shadow: rgba(0, 0, 0, 0.7);
            --header-gradient-start: #E02548;
            --header-gradient-end: #FF6B8A;
            --header-gradient-mid: #F23669;
            --header-color: #FFFFFF;
            --text-primary: #FFFFFF;
            --text-secondary: #E0E0E0;
            --text-tertiary: #C0C0C0;
            --text-light: #A0A0A0;
            --bg-light: #1F1F1F;
            --bg-lighter: #262626;
            --border-color: #555555;
            --filter-bg: rgba(30, 30, 30, 0.95);
            --poem-desc-bg: rgba(25, 25, 25, 0.98);
            --poem-desc-border: #FF6B8A;
            --search-result-bg: #262626;
            --search-result-hover: #3A2A3A;
            --refresh-btn-gradient-start: #E02548;
            --refresh-btn-gradient-end: #FF6B8A;
            --refresh-btn-color: #FFFFFF;
            --clear-btn-bg: #666666;
            --clear-btn-hover: #777777;
            --search-btn-bg: #E02548;
            --search-btn-hover: #C01830;
            --footer-color: #B0B0B0;
            --accent-glow: rgba(255, 107, 138, 0.4);
            --card-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
            --card-shadow-hover: 0 4px 20px rgba(255, 107, 138, 0.3);
        }

        .classic-paper-theme {
            /* Classic Paper Theme - Warm, traditional colors */
            --xhs-pink: #D49A6A;
            --xhs-pink-light: #DDAE7E;
            --xhs-pink-lighter: #E7C9A9;
            --xhs-pink-pale: #F5E9D9;
            --bg-gradient-start: #FDF6E3;
            --bg-gradient-end: #D4D8DD;
            /* Deeper blue-gray */
            --bg-gradient-mid: #E6E9ED;
            /* Lighter blue-gray */
            --container-bg: rgba(253, 246, 227, 0.98);
            --container-shadow: rgba(212, 154, 106, 0.1);
            --header-gradient-start: #D49A6A;
            --header-gradient-end: #B8864B;
            --header-gradient-mid: #C68F5D;
            --header-color: #5D4037;
            --text-primary: #3E2723;
            --text-secondary: #5D4037;
            --text-tertiary: #8D6E63;
            --text-light: #A1887F;
            --bg-light: #F5EEF0;
            --bg-lighter: #EFEBE9;
            --border-color: #D7CCC8;
            --filter-bg: rgba(253, 246, 227, 0.95);
            --poem-desc-bg: rgba(253, 246, 227, 0.98);
            --poem-desc-border: #D49A6A;
            --search-result-bg: #F5EEF0;
            --search-result-hover: #F0E6D4;
            --refresh-btn-gradient-start: #D49A6A;
            --refresh-btn-gradient-end: #B8864B;
            --refresh-btn-color: #FFFFFF;
            --clear-btn-bg: #8D6E63;
            --clear-btn-hover: #6D4B40;
            --search-btn-bg: #D49A6A;
            --search-btn-hover: #B8864B;
            --footer-color: #8D6E63;
            --accent-glow: rgba(212, 154, 106, 0.3);
            --card-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
            --card-shadow-hover: 0 4px 20px rgba(212, 154, 106, 0.15);
        }

        .modern-minimal-theme {
            /* Modern Minimal Theme - Clean and modern aesthetic */
            --xhs-pink: #3F51B5;
            --xhs-pink-light: #7986CB;
            --xhs-pink-lighter: #C5CAE9;
            --xhs-pink-pale: #E8EAF6;
            --bg-gradient-start: #FFFFFF;
            --bg-gradient-end: #D9DDE2;
            /* Deeper blue-gray */
            --bg-gradient-mid: #E8EBF0;
            /* Lighter blue-gray */
            --container-bg: rgba(255, 255, 255, 0.98);
            --container-shadow: rgba(0, 0, 0, 0.05);
            --header-gradient-start: #3F51B5;
            --header-gradient-end: #5C6BC0;
            --header-gradient-mid: #5163A8;
            --header-color: white;
            --text-primary: #212121;
            --text-secondary: #757575;
            --text-tertiary: #9E9E9E;
            --text-light: #BDBDBD;
            --bg-light: #F5F5F5;
            --bg-lighter: #EEEEEE;
            --border-color: #E0E0E0;
            --filter-bg: rgba(255, 255, 255, 0.95);
            --poem-desc-bg: rgba(255, 255, 255, 0.98);
            --poem-desc-border: #3F51B5;
            --search-result-bg: #F5F5F5;
            --search-result-hover: #EEEEEE;
            --refresh-btn-gradient-start: #3F51B5;
            --refresh-btn-gradient-end: #5C6BC0;
            --refresh-btn-color: white;
            --clear-btn-bg: #9E9E9E;
            --clear-btn-hover: #757575;
            --search-btn-bg: #3F51B5;
            --search-btn-hover: #303F9F;
            --footer-color: #9E9E9E;
            --accent-glow: rgba(63, 81, 181, 0.2);
            --card-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
            --card-shadow-hover: 0 4px 16px rgba(63, 81, 181, 0.1);
        }

        .nature-green-theme {
            /* Nature Green Theme - Earthy, natural colors */
            --xhs-pink: #4CAF50;
            --xhs-pink-light: #81C784;
            --xhs-pink-lighter: #A5D6A7;
            --xhs-pink-pale: #E8F5E9;
            --bg-gradient-start: #F1F8E9;
            --bg-gradient-end: #D0D8D2;
            /* Deeper blue-gray */
            --bg-gradient-mid: #E3EAE6;
            /* Lighter blue-gray */
            --container-bg: rgba(241, 248, 233, 0.98);
            --container-shadow: rgba(76, 175, 80, 0.1);
            --header-gradient-start: #4CAF50;
            --header-gradient-end: #66BB6A;
            --header-gradient-mid: #56A35A;
            --header-color: white;
            --text-primary: #2E7D32;
            --text-secondary: #388E3C;
            --text-tertiary: #689F38;
            --text-light: #9E9E9E;
            --bg-light: #E8F5E9;
            --bg-lighter: #C8E6C9;
            --border-color: #C8E6C9;
            --filter-bg: rgba(241, 248, 233, 0.95);
            --poem-desc-bg: rgba(241, 248, 233, 0.98);
            --poem-desc-border: #4CAF50;
            --search-result-bg: #E8F5E9;
            --search-result-hover: #C8E6C9;
            --refresh-btn-gradient-start: #4CAF50;
            --refresh-btn-gradient-end: #66BB6A;
            --refresh-btn-color: white;
            --clear-btn-bg: #757575;
            --clear-btn-hover: #4CAF50;
            --search-btn-bg: #4CAF50;
            --search-btn-hover: #388E3C;
            --footer-color: #689F38;
            --accent-glow: rgba(76, 175, 80, 0.2);
            --card-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
            --card-shadow-hover: 0 4px 20px rgba(76, 175, 80, 0.15);
        }

        .ocean-blue-theme {
            /* Ocean Blue Theme - Calming blue colors */
            --xhs-pink: #2196F3;
            --xhs-pink-light: #64B5F6;
            --xhs-pink-lighter: #90CAF9;
            --xhs-pink-pale: #E3F2FD;
            --bg-gradient-start: #E1F5FE;
            --bg-gradient-end: #9CB5C8;
            /* Deeper blue-gray */
            --bg-gradient-mid: #B7CDD8;
            /* Lighter blue-gray */
            --container-bg: rgba(225, 245, 254, 0.98);
            --container-shadow: rgba(33, 150, 243, 0.1);
            --header-gradient-start: #2196F3;
            --header-gradient-end: #42A5F5;
            --header-gradient-mid: #329AF3;
            --header-color: white;
            --text-primary: #0D47A1;
            --text-secondary: #1976D2;
            --text-tertiary: #42A5F5;
            --text-light: #90CAF9;
        }

        .image-section {
            padding: 0;
            margin: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            min-height: 280px;
            max-height: 380px;
            position: relative;
            z-index: 1;
        }

        @media (min-width: 768px) {
            .image-section {
                padding: 0;
                margin: 0;
                min-height: 380px;
                max-height: 380px;
            }
        }

        .poem-image {
            width: 100%;
            max-width: 100%;
            height: 100%;
            aspect-ratio: 4/3;
            border-radius: 15px 15px 0 0;
            object-fit: cover;
            box-shadow: none;
            transition: transform 0.3s ease;
            border: none;
            margin: 0;
            padding: 0;
        }

        .poem-image:hover {
            transform: scale(1.01);
            box-shadow: none;
        }

        .fade-in {
            animation: fadeIn 0.5s ease-in;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }
