.spinner {
    width: 48px;
    height: 48px;
    border: 4px solid #e5e7eb;
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

#drop-zone.drag-over {
    border-color: #2563eb;
    background-color: #eff6ff;
}

.verdict-verdadero { background-color: #ecfdf5; border-color: #a7f3d0; }
.verdict-verdadero .badge { background-color: #059669; color: white; }
.verdict-verdadero .bar { background-color: #059669; }

.verdict-falso { background-color: #fef2f2; border-color: #fecaca; }
.verdict-falso .badge { background-color: #dc2626; color: white; }
.verdict-falso .bar { background-color: #dc2626; }

.verdict-enganoso { background-color: #fffbeb; border-color: #fde68a; }
.verdict-enganoso .badge { background-color: #d97706; color: white; }
.verdict-enganoso .bar { background-color: #d97706; }

.verdict-no-verificable { background-color: #f9fafb; border-color: #d1d5db; }
.verdict-no-verificable .badge { background-color: #6b7280; color: white; }
.verdict-no-verificable .bar { background-color: #6b7280; }

/* Workspace: single column por defecto */
#workspace {
    display: block;
}

/* Workspace: dos columnas al iniciar verificación */
#workspace.split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    align-items: start;
}

/* Loading oculto hasta que workspace tenga .split */
#workspace #loading-section {
    display: none;
}

#workspace.split #loading-section {
    display: block;
    animation: slideInRight 0.45s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideInRight {
    from { opacity: 0; transform: translateX(24px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* Preview image: mínimo alto mientras carga el src */
#preview-image {
    min-height: 180px;
    background-color: #f3f4f6;
}

@media (max-width: 767px) {
    #workspace.split {
        grid-template-columns: 1fr;
    }
    #workspace.split #loading-section {
        animation: fadeDown 0.4s ease forwards;
    }
}

@keyframes fadeDown {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

.claim-card {
    border-left: 4px solid #e5e7eb;
    padding-left: 1rem;
}
.claim-card.supports { border-left-color: #059669; }
.claim-card.contradicts { border-left-color: #dc2626; }
.claim-card.neutral { border-left-color: #d97706; }