/* Dialog safe margins on mobile */
    #contact-dialog {
        margin: 1rem auto;
        max-height: calc(100dvh - 2rem);
    }
    @media (min-width: 640px) {
        #contact-dialog {
            margin: 2rem auto;
            max-height: calc(100dvh - 4rem);
        }
    }

    /* Feedback input focus */
    .feedback-input.svelte-1ala2vd:focus {
        border-color: var(--feedback-accent);
    }

    /* Toolbar button */
    .rte-btn.svelte-1ala2vd {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2rem;
        height: 2rem;
        border-radius: 0.375rem;
        border: none;
        background: transparent;
        cursor: pointer;
        color: inherit;
        transition: background-color 0.15s;
        padding: 0;
    }
    .rte-btn.svelte-1ala2vd:hover {
        background-color: rgba(0, 0, 0, 0.08);
    }
    .rte-btn-active.svelte-1ala2vd {
        background-color: var(--feedback-accent, #009688);
        color: #fff;
    }
    .rte-btn-active.svelte-1ala2vd:hover {
        background-color: var(--feedback-accent, #009688);
        filter: brightness(1.1);
        color: #fff;
    }
    .dark .rte-btn.svelte-1ala2vd:hover {
        background-color: rgba(255, 255, 255, 0.1);
    }
    .dark .rte-btn-active.svelte-1ala2vd {
        background-color: var(--feedback-accent, #009688);
        color: #fff;
    }
    .dark .rte-btn-active.svelte-1ala2vd:hover {
        background-color: var(--feedback-accent, #009688);
        filter: brightness(1.15);
        color: #fff;
    }

    /* Toolbar — ensure popups can overflow */
    .rte-toolbar.svelte-1ala2vd {
        position: relative;
        z-index: 10;
        overflow: visible;
    }

    /* Toolbar divider */
    .rte-divider.svelte-1ala2vd {
        width: 1px;
        height: 1.25rem;
        background-color: rgba(0, 0, 0, 0.12);
        margin: 0 0.25rem;
    }
    .dark .rte-divider.svelte-1ala2vd {
        background-color: rgba(255, 255, 255, 0.15);
    }

    /* Popup */
    .rte-popup.svelte-1ala2vd {
        position: absolute;
        top: calc(100% + 4px);
        left: 0;
        z-index: 100;
        min-width: 10rem;
        padding: 0.5rem;
        border-radius: 0.5rem;
        border: 1px solid rgba(0, 0, 0, 0.1);
        background-color: var(--popup-bg, #fff);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    }
    .dark .rte-popup.svelte-1ala2vd {
        --popup-bg: #1e293b;
        border-color: rgba(255, 255, 255, 0.1);
    }

    /* Color grid */
    .rte-color-grid.svelte-1ala2vd {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
        gap: 0.375rem;
    }
    .rte-color-swatch.svelte-1ala2vd {
        width: 1.5rem;
        height: 1.5rem;
        border-radius: 0.25rem;
        border: 2px solid transparent;
        cursor: pointer;
        transition:
            border-color 0.15s,
            transform 0.1s;
    }
    .rte-color-swatch.svelte-1ala2vd:hover {
        transform: scale(1.15);
    }

    /* Font option */
    .rte-font-option.svelte-1ala2vd {
        display: block;
        width: 100%;
        text-align: left;
        padding: 0.375rem 0.625rem;
        border-radius: 0.375rem;
        border: none;
        background: transparent;
        cursor: pointer;
        color: inherit;
        font-size: 0.8125rem;
        transition: background-color 0.15s;
    }
    .rte-font-option.svelte-1ala2vd:hover {
        background-color: rgba(0, 0, 0, 0.06);
    }
    .dark .rte-font-option.svelte-1ala2vd:hover {
        background-color: rgba(255, 255, 255, 0.08);
    }
    .rte-font-active.svelte-1ala2vd {
        font-weight: 600;
        background-color: rgba(0, 150, 136, 0.1);
    }

    /* Font size popup — multi-column */
    .rte-fontsize-popup.svelte-1ala2vd {
        min-width: 8rem;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0.125rem;
    }
    .rte-fontsize-popup.svelte-1ala2vd .rte-font-option:where(.svelte-1ala2vd) {
        text-align: center;
    }

    /* List styles inside editor */
    .rte-wrapper .tiptap ul {
        list-style-type: disc;
        padding-left: 1.5rem;
        margin: 0.25rem 0;
    }
    .rte-wrapper .tiptap ol {
        list-style-type: decimal;
        padding-left: 1.5rem;
        margin: 0.25rem 0;
    }
    .rte-wrapper .tiptap li {
        margin: 0.125rem 0;
    }
    .rte-wrapper .tiptap li::marker {
        color: currentColor;
        font-family: inherit;
        font-size: inherit;
    }

    /* Editor wrapper — no overflow-hidden so popups can escape */
    .rte-wrapper.svelte-1ala2vd {
        position: relative;
        overflow: visible;
    }

    /* Editor area */
    .rte-wrapper .tiptap {
        min-height: 8rem;
        padding: 0.75rem 1rem;
        font-size: 14px;
        line-height: 1.6;
        outline: none;
        overflow-y: auto;
        max-height: 16rem;
    }
    .rte-wrapper .tiptap p.is-editor-empty:first-child::before {
        color: rgba(0, 0, 0, 0.35);
        content: attr(data-placeholder);
        float: left;
        height: 0;
        pointer-events: none;
    }
    .dark .rte-wrapper .tiptap p.is-editor-empty:first-child::before {
        color: rgba(255, 255, 255, 0.35);
    }

    /* Focus ring on wrapper */
    /* (unused) .rte-wrapper:has(.tiptap:focus) {
        border-color: var(--feedback-accent);
    }*/

    /* Cancel button hover */
    @media (hover: hover) {
        .feedback-cancel-btn.svelte-1ala2vd:hover {
            background-color: var(--cancel-hover);
        }
    }