@media (prefers-reduced-motion: no-preference) {
    .chat-app,
    .chat-window,
    .gpt-chat,
    .gpt-messages,
    .gpt-composer,
    .sidebar,
    .gpt-input-box,
    .gpt-bubble,
    .gpt-popover-menu,
    .gpt-popover-submenu,
    .gpt-command-menu,
    .modal-content {
        transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
    }
}

@media (prefers-color-scheme: dark) {
    html,
    body {
        color-scheme: dark;
        background: #0b1220;
        color: #e5e7eb;
        accent-color: #34d399;
    }

    .chat-app,
    .chat-window,
    .gpt-chat,
    .gpt-messages,
    .gpt-composer {
        background: #0b1220;
        color: #e5e7eb;
    }

    .sidebar,
    .sidebar.offcanvas-md,
    .sidebar .offcanvas-body {
        background: #111827;
        color: #e5e7eb;
        border-color: #273449;
    }

    ::selection {
        background: rgba(52, 211, 153, 0.32);
        color: #ffffff;
    }

    a {
        color: #60a5fa;
    }

    a:hover {
        color: #93c5fd;
    }

    .sidebar-brand,
    .sidebar-collapse-toggle,
    .sidebar-history-toggle,
    .sidebar .btn-new,
    .sidebar .sidebar-nav-btn,
    .application-app-item,
    .history-item,
    .quota-profile-name {
        color: #e5e7eb;
    }

    .sidebar .user-info .username,
    .sidebar .user-info .details {
        color: #f1f5f9;
    }

    .sidebar .text-muted,
    .sidebar .user-info .text-muted {
        color: #94a3b8 !important;
    }

    .sidebar-mobile-close.btn-close {
        opacity: 0.82;
        filter: invert(1) grayscale(100%) brightness(190%);
    }

    .sidebar-mobile-close.btn-close:hover,
    .sidebar-mobile-close.btn-close:focus-visible {
        opacity: 1;
    }

    .chat-app.sidebar-collapsed .sidebar-collapse-toggle {
        background: #111827;
    }

    .sidebar .btn-new:hover,
    .sidebar .btn-new.active,
    .sidebar .sidebar-nav-btn:hover,
    .sidebar .sidebar-nav-btn.active,
    .sidebar-nav-btn:hover,
    .sidebar-nav-btn.active,
    .application-app-item:hover,
    .application-app-item.is-enabled,
    .history-item:hover,
    .history-item.active,
    .sidebar-collapse-toggle:hover,
    .sidebar-history-toggle:hover {
        background: #1f2937;
    }

    .history-item.active .history-title,
    .gpt-welcome,
    .gpt-bubble,
    .gpt-content,
    .gpt-apps-page-title,
    .gpt-app-name,
    .gpt-app-detail {
        color: #e5e7eb;
    }

    .sidebar-section-title,
    .gpt-time,
    .gpt-disclaimer,
    .gpt-apps-page-subtitle,
    .gpt-app-description,
    .gpt-app-inline-meta,
    .gpt-app-meta,
    .gpt-app-empty-state,
    .quota-profile-name span,
    .quota-profile-account {
        color: #94a3b8;
    }

    .history-delete,
    .sidebar-nav-btn i,
    .application-app-item .application-app-icon {
        color: #94a3b8;
    }

    .history-delete.text-muted {
        color: #94a3b8 !important;
        opacity: 1;
    }

    .history-delete:hover,
    .history-delete:focus-visible {
        background: rgba(248, 113, 113, 0.12);
        color: #fca5a5 !important;
    }

    .gpt-row.is-user .gpt-bubble,
    .gpt-process-status,
    .gpt-app-meta span {
        background: #182235;
        border-color: #334155;
    }

    .gpt-input-box,
    .gpt-popover-menu,
    .gpt-popover-submenu,
    .gpt-command-menu,
    .quota-container,
    .gpt-feedback-panel,
    .gpt-modal-content,
    .pwa-install-banner-content,
    .pwa-ios-install-guide-panel,
    .chat-app.sidebar-collapsed .history-section.is-popover-open .sidebar-history-popover {
        background: #111827;
        border-color: #334155;
        color: #e5e7eb;
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.38);
    }

    .quota-container .quota-summary-panel {
        background: #182235;
        border-color: #334155;
    }

    .quota-container .quota-summary-title {
        color: #94a3b8;
    }

    .quota-container .quota-summary-label,
    .quota-container .quota-summary-label i,
    .quota-container .quota-summary-value {
        color: #e5e7eb;
    }

    .quota-container .menu-item,
    .quota-container .menu-item i {
        color: #e5e7eb;
    }

    .quota-container .menu-item:hover,
    .quota-container .menu-item:focus-visible {
        background: #1f2937;
        color: #f8fafc;
    }

    .quota-container .menu-separator {
        background: #334155;
    }

    .chat-input,
    .gpt-apps-search,
    .gpt-feedback-text {
        background: transparent;
        color: #f8fafc;
        caret-color: #34d399;
    }

    .gpt-input-box:focus-within,
    .modal-login .form-control:focus,
    .gpt-apps-search:focus,
    .gpt-feedback-text:focus {
        border-color: #34d399;
        box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.16);
    }

    .chat-input::placeholder,
    .gpt-apps-search::placeholder,
    .gpt-feedback-text::placeholder {
        color: #94a3b8;
        opacity: 1;
    }

    .btn-plus,
    .gpt-app-toggle,
    .gpt-feedback-reason,
    .gpt-followup-option,
    .code-copy {
        background: #182235;
        border-color: #3b4a60;
        color: #e5e7eb;
    }

    .btn-plus:hover,
    .gpt-command-item:hover,
    .gpt-command-item.is-active,
    .menu-item:hover,
    .menu-item.is-open,
    .gpt-app-row:hover,
    .gpt-followup-option:hover,
    .gpt-followup-option:focus-visible,
    .code-copy:hover {
        background: #1f2937;
        color: #f8fafc;
    }

    .gpt-command-item,
    .gpt-command-text strong,
    .menu-item,
    .pwa-install-banner-copy,
    .pwa-install-banner-copy strong,
    .pwa-ios-install-guide-header {
        color: #e5e7eb;
    }

    .gpt-command-text small,
    .menu-item .menu-chevron {
        color: #94a3b8;
    }

    .gpt-command-icon,
    .gpt-app-icon {
        background: #1f2937;
        color: #60a5fa;
    }

    .menu-separator,
    .gpt-toolbar,
    .gpt-feedback-header,
    .gpt-modal-header,
    .pwa-ios-install-guide-header,
    .sidebar .user-info {
        border-color: #334155;
    }

    .gpt-loading {
        background: rgba(11, 18, 32, 0.72);
    }

    .gpt-loading-inner,
    .code-block,
    .code-header {
        background: #111827;
        border-color: #334155;
        color: #cbd5e1;
    }

    .gpt-content table,
    .gpt-content th,
    .gpt-content td {
        color: #e5e7eb;
        border-color: #334155;
        background: #111827;
    }

    .gpt-content th,
    .gpt-content tbody tr:nth-child(even) td {
        background: #182235;
        color: #f8fafc;
    }

    .modal-login .modal-content {
        background: #111827;
        color: #e5e7eb;
    }

    .modal-login .form-control {
        background: #182235;
        border-color: #334155;
        color: #f8fafc;
    }

    .modal-login .form-control::placeholder {
        color: #94a3b8;
        opacity: 1;
    }

    .modal-login .text-muted {
        color: #94a3b8 !important;
    }

    .modal-login a:not(.btn) {
        color: #60a5fa;
    }

    .modal-login a:not(.btn):hover,
    .modal-login a:not(.btn):focus-visible {
        color: #93c5fd;
    }

    .modal-login input:-webkit-autofill,
    .modal-login input:-webkit-autofill:hover,
    .modal-login input:-webkit-autofill:focus {
        -webkit-text-fill-color: #f8fafc;
        box-shadow: 0 0 0 1000px #182235 inset;
        caret-color: #34d399;
    }

    .modal-login .form-control:focus {
        background: #1f2937;
    }

    .gpt-feedback-notice,
    .pwa-ios-install-guide-header button {
        background: #1f2937;
        color: #cbd5e1;
    }

    .gpt-feedback-close,
    .gpt-modal-close,
    .gpt-process-toggle,
    .gpt-typing {
        color: #94a3b8;
    }

    .gpt-feedback-close:hover,
    .gpt-modal-close:hover,
    .gpt-process-toggle:hover,
    .gpt-process-toggle:focus-visible {
        background: #1f2937;
        color: #f8fafc;
    }

    .gpt-input-alert {
        border-color: #7f1d1d;
        background: #32171b;
        color: #fecaca;
    }

    .quota-warning {
        color: #fbbf24;
    }

    .quota-warning.strong,
    .quota-warning.blocked {
        color: #fca5a5;
    }

    .image-quota-notice {
        color: #93c5fd;
    }

    .modal-backdrop.show {
        opacity: 0.72;
    }

    .pwa-install-secondary {
        background: #182235;
        border-color: #3b4a60;
        color: #e5e7eb;
    }

    * {
        scrollbar-color: #475569 #111827;
    }
}