/* Status indicator in modal header (Typing.../Saving) */
        .modal-save-status {
            font-size: var(--font-size-sm);
            color: var(--text-tertiary);
            margin-right: var(--space-2);
            min-width: 50px;
            text-align: right;
        }

        .modal-save-status:empty {
            display: none;
        }

        .modal-checkbox {
            margin-top: 4px;
        }

        .modal-title-input {
            flex: 1;
            font-family: var(--font-family);
            font-size: var(--font-size-lg);
            font-weight: 600;
            border: none;
            background: transparent;
            outline: none;
            color: var(--text-primary);
        }

        .modal-title-input:empty::before {
            content: attr(data-placeholder);
            color: var(--text-tertiary);
            pointer-events: none;
        }

        .modal-title-input[contenteditable] {
            white-space: nowrap;
            overflow: hidden;
            min-height: 1.4em;
        }

        .modal-close {
            width: 28px;
            height: 28px;
            display: flex;
            align-items: center;
            justify-content: center;
            border: none;
            background: transparent;
            color: var(--text-tertiary);
            border-radius: var(--radius-sm);
            cursor: pointer;
            transition: all var(--transition-fast);
        }

        .modal-close:hover {
            background: rgba(0, 0, 0, 0.05);
            color: var(--text-secondary);
        }

        .modal-close.active {
            background: var(--accent-blue-light);
            color: var(--accent-blue);
        }

        .modal-close svg {
            width: 16px;
            height: 16px;
        }

        /* Modal saving state - shows spinner while save is in progress */
        .modal-close.saving {
            pointer-events: none;
            opacity: 0.7;
        }

        .modal-close.saving svg {
            display: none;
        }

        .modal-close.saving::after {
            content: '';
            width: 14px;
            height: 14px;
            border: 2px solid var(--border-light);
            border-top-color: var(--accent-blue);
            border-radius: var(--radius-circle);
            animation: modal-spinner 0.6s linear infinite;
        }

        @keyframes modal-spinner {
            to { transform: rotate(360deg); }
        }

        /* Modal saving overlay - prevents interaction during save */
        .modal-saving-overlay {
            position: absolute;
            inset: 0;
            background: rgba(255, 255, 255, 0.5);
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 10;
            opacity: 0;
            pointer-events: none;
            transition: opacity var(--transition-fast);
        }

        .modal-saving-overlay.visible {
            opacity: 1;
            pointer-events: auto;
        }