@media (max-width: 540px) {
    :root {
        --ce-space-md: 12px;
        --ce-space-lg: 20px;
        /* Further reduce indent on very small screens */
        --ce-reply-indent: 12px;
    }

    .ce-v6-container { padding: 0 12px; }
    .ce-v6-comment-meta { font-size: 0.78rem; }
    .ce-v6-comment-username { font-size: 0.9rem; }
    .ce-v6-comment-content { font-size: 0.92rem; }
    .ce-v6-comment-btn,
    .ce-v6-reaction-btn { font-size: 0.8rem; padding: 0.4rem 0.6rem; }
    .ce-v6-reaction-btn { flex: 1 1 auto; }

    .ce-v6-comment-form .ce-v6-media-buttons { flex-direction: row; }
    .ce-v6-comment-form .ce-v6-btn-icon { width: auto; }

    .ce-v6-comment-actions { gap: var(--ce-space-sm); }
    .ce-v6-comment-votes { gap: 0.5rem; }
    .ce-v6-vote-count { font-size: 0.8rem; }

    /* Make inline reply input more comfortable on very small screens */
    .ce-v6-reply-text { min-height: 140px; }

    .ce-toast { top: 10px; }

    .ce-v6-comment-replies::before {
        /* Adjust threadline position for the new indent */
        transform: translateX(6px);
    }

    /* Prevent horizontal overflow on very small screens */
    .ce-v6-container, #comment-engine-v6, .ce-v6-comments-list { overflow-x: hidden; }
    .ce-v6-comment-card { width: 100%; max-width: 100%; }
    .ce-v6-comment-header { flex-wrap: wrap; min-width: 0; }
    .ce-v6-comment-meta { flex-wrap: wrap; gap: 6px; min-width: 0; }
    .ce-v6-freshness-badge, .ce-v6-hot-badge { transform: scale(0.86); transform-origin: left center; white-space: nowrap; }
}


