.itt-dropzone {
    border: 2px dashed var(--border-color);
    border-radius: var(--radius-lg);
    background:
        radial-gradient(circle at top, rgba(var(--primary-rgb), 0.08), transparent 55%),
        rgba(var(--primary-rgb), 0.02);
    padding: 2.5rem 1.5rem;
    text-align: center;
    cursor: pointer;
    transition: border-color var(--transition-speed) ease, background-color var(--transition-speed) ease, transform var(--transition-speed) ease;
}

.itt-dropzone:hover,
.itt-dropzone.dragover {
    border-color: var(--primary-color);
    background-color: rgba(var(--primary-rgb), 0.06);
    transform: translateY(-1px);
}

.itt-dropzone__icon {
    font-size: 3.5rem;
    line-height: 1;
}

.itt-preview-stage {
    min-height: 420px;
    max-height: 72vh;
    overflow: auto;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    background:
        radial-gradient(circle at top, rgba(var(--primary-rgb), 0.07), transparent 58%),
        linear-gradient(180deg, rgba(var(--primary-rgb), 0.03), rgba(var(--primary-rgb), 0.01));
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.itt-preview-frame {
    display: block;
    max-width: none;
    max-height: none;
}

.itt-preview-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
    user-select: none;
    -webkit-user-drag: none;
    transform-origin: center center;
}

.itt-toolbar .btn {
    min-height: 46px;
}

.itt-result-textarea {
    min-height: 320px;
    resize: vertical;
    white-space: pre-wrap;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.itt-info-list .list-group-item {
    background: transparent;
    border-color: var(--border-color);
}

.itt-sticky-panel {
    position: sticky;
    top: 1.25rem;
}

.itt-faq .accordion-button {
    background-color: transparent;
    color: var(--text-color);
    box-shadow: none;
}

.itt-faq .accordion-button:not(.collapsed) {
    background-color: rgba(var(--primary-rgb), 0.05);
    color: var(--text-color);
}

.itt-faq .accordion-body {
    color: var(--text-color);
}

.itt-result-textarea:focus {
    box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.15);
}

@media (max-width: 991.98px) {
    .itt-sticky-panel {
        position: static;
        top: auto;
    }

    .itt-preview-stage {
        min-height: 320px;
    }
}
