@import url("./static/css/base/_variables.css");
        @import url("./static/css/base/_global.css");
        @import url("./static/css/base/_typography.css");
        @import url("./static/css/utilities/_helpers.css");
        @import url("./static/css/layout/_header.css");
        @import url("./static/css/layout/_container.css");
        @import url("./static/css/layout/_footer.css");
        @import url("./static/css/layout/_grid-systems.css");
        @import url("./static/css/components/_buttons.css");
        @import url("./static/css/components/_forms.css");
        @import url("./static/css/components/_cards.css");
        @import url("./static/css/components/_menu-dropdown.css");
        @import url("./static/css/components/_image-comparer.css");
        @import url("./static/css/pages/_home.css");

        /* Responsividade para mobile: reduzir tamanhos removido para consistência */
        /* @media (max-width: 768px) { ... } REMOVIDO */

        /* Modal Styles */
        .modal {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(2, 6, 17, .58);
            backdrop-filter: blur(3px);
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 3000;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.25s ease, visibility 0.25s ease;
        }

        .modal.open {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
        }

        .modal-content {
            background: linear-gradient(180deg, #0b1220 0%, #0a0f18 100%);
            border-radius: 1rem;
            padding: 2rem;
            max-width: 90%;
            max-height: 90%;
            overflow-y: auto;
            position: relative;
            border: 1px solid rgba(148, 163, 184, .35);
            box-shadow: 0 20px 48px rgba(0,0,0,.45);
            transform: translateY(16px) scale(.985);
            opacity: 0;
            transition: transform .25s ease, opacity .25s ease;
        }

        .modal.open .modal-content {
            transform: translateY(0) scale(1);
            opacity: 1;
        }

        .close-btn {
            position: absolute;
            top: 1rem;
            right: 1.5rem;
            color: #9ca3af;
            font-size: 2rem;
            font-weight: bold;
            transition: 0.3s;
            cursor: pointer;
        }

        .close-btn:hover {
            color: #ffffff;
        }

        #payment-method-modal {
            background: rgba(2, 6, 17, .58) !important;
            backdrop-filter: blur(3px);
            transition: opacity .25s ease !important;
        }

        #payment-method-modal [data-transition-content] {
            background: linear-gradient(180deg, #0b1220 0%, #0a0f18 100%) !important;
            border: 1px solid rgba(148, 163, 184, .35);
            border-radius: 16px;
            box-shadow: 0 20px 48px rgba(0,0,0,.45);
        }

        /* Light theme harmony */
        html.theme-light body,
        html.theme-light main,
        html.theme-light .bg-gray-900 {
            background: #f8fafc !important;
            color: #0f172a !important;
        }

        html.theme-light .bg-gray-750,
        html.theme-light .bg-gray-800,
        html.theme-light .bg-gray-800\/80,
        html.theme-light .bg-gray-700,
        html.theme-light .bg-gray-700\/50 {
            background: #ffffff !important;
            border-color: #dbe6f4 !important;
            color: #0f172a !important;
            box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
        }

        html.theme-light .text-white { color: #0f172a !important; }
        html.theme-light .text-gray-400,
        html.theme-light .text-gray-300 { color: #475569 !important; }

        html.theme-light #credit-balance {
            background: #eff6ff !important;
            border-color: #bfdbfe !important;
            color: #1d4ed8 !important;
        }

        html.theme-light #btn-add-credits {
            background: linear-gradient(90deg, #0ea5a4 0%, #0d9488 100%) !important;
            color: #ffffff !important;
        }

        html.theme-light #view-monthly-plans-btn {
            background: linear-gradient(90deg, #2563eb 0%, #1d4ed8 100%) !important;
            color: #ffffff !important;
        }

        html.theme-light .modal-content {
            background: linear-gradient(180deg, #ffffff 0%, #f7f9fc 100%);
            border-color: rgba(148, 163, 184, .4);
            box-shadow: 0 18px 38px rgba(2,6,23,.2);
        }

        html.theme-light #plan-info-modal .modal-content,
        html.theme-light #monthly-plans-modal .modal-content {
            background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
            border-color: #cfdbea !important;
            box-shadow: 0 16px 36px rgba(15, 23, 42, 0.14) !important;
        }

        html.theme-light #plan-info-modal {
            background: rgba(148, 163, 184, 0.34) !important;
            backdrop-filter: blur(2px);
        }

        html.theme-light #plan-info-modal .text-white,
        html.theme-light #monthly-plans-modal .text-white {
            color: #0f172a !important;
        }

        html.theme-light #plan-info-modal .text-gray-300,
        html.theme-light #plan-info-modal .text-gray-400,
        html.theme-light #monthly-plans-modal .text-gray-300,
        html.theme-light #monthly-plans-modal .text-gray-400 {
            color: #475569 !important;
        }

        html.theme-light #plan-info-modal .bg-gray-900\/50,
        html.theme-light #monthly-plans-modal .bg-gray-900\/50 {
            background: #eef4ff !important;
            border-color: #cfddf0 !important;
        }

        html.theme-light #monthly-plans-modal .bg-gray-750 {
            background: #ffffff !important;
            border-color: #d7e2f1 !important;
            box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08) !important;
        }

        html.theme-light #monthly-plans-modal button[id^="btn-subscribe-"] {
            color: #ffffff !important;
        }

        html.theme-light #monthly-plans-modal #plan-tab-monthly.bg-blue-600,
        html.theme-light #monthly-plans-modal #plan-tab-annual.bg-blue-600 {
            color: #ffffff !important;
            background: #2563eb !important;
            border-color: #1d4ed8 !important;
        }

        html.theme-light #monthly-plans-modal #plan-tab-monthly.bg-gray-700,
        html.theme-light #monthly-plans-modal #plan-tab-annual.bg-gray-700 {
            color: #475569 !important;
            background: #e2e8f0 !important;
            border-color: #cbd5e1 !important;
        }

        html.theme-light #plan-info-modal .close-btn,
        html.theme-light #monthly-plans-modal .close-btn {
            color: #64748b !important;
        }

        html.theme-light #plan-info-modal .close-btn:hover,
        html.theme-light #monthly-plans-modal .close-btn:hover {
            color: #0f172a !important;
        }

        html.theme-light #plan-subscription-terms {
            background: #eef4ff !important;
            border-color: #c9d9f2 !important;
            color: #334155 !important;
        }

        html.theme-light #plan-subscription-terms p {
            color: #334155 !important;
        }

        html.theme-light #plan-info-modal #btn-cancel-plan-info {
            border-color: #cbd5e1 !important;
            color: #334155 !important;
            background: #ffffff !important;
        }

        html.theme-light #plan-info-modal #btn-cancel-plan-info:hover {
            background: #f1f5f9 !important;
        }

        html.theme-light #plan-info-modal #btn-confirm-plan-info {
            background: linear-gradient(90deg, #2563eb 0%, #1d4ed8 100%) !important;
            color: #ffffff !important;
        }

        html.theme-light #payment-method-modal [data-transition-content] {
            background: linear-gradient(180deg, #ffffff 0%, #f7f9fc 100%) !important;
            border-color: rgba(148, 163, 184, .4);
            box-shadow: 0 18px 38px rgba(2,6,23,.2);
        }

        html.theme-light #upscale-info-toggle,
        html.theme-light #upscale-info-content {
            background: #ffffff !important;
            border-color: #dbe6f4 !important;
            color: #0f172a !important;
        }

        html.theme-light button[data-accordion-trigger="video-specs-content"],
        html.theme-light #video-specs-content,
        html.theme-light button[data-accordion-trigger="upscale-info-content"],
        html.theme-light #upscale-info-content {
            background: #ffffff !important;
            border-color: #dbe6f4 !important;
            color: #0f172a !important;
        }

        html.theme-light .accordion-item {
            background: #ffffff !important;
            border-color: #dbe6f4 !important;
        }

        html.theme-light #video-specs-content .text-gray-400,
        html.theme-light #upscale-info-content .text-gray-400,
        html.theme-light #video-specs-content .text-gray-300,
        html.theme-light #upscale-info-content .text-gray-300 {
            color: #475569 !important;
        }

        html.theme-light #video-specs-icon,
        html.theme-light #upscale-info-icon {
            color: #64748b !important;
        }