.ft-loading .post-body,
.ft-title.ft-loading {
    position: relative;
    overflow: hidden;
}

.ft-loading .post-body::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: 4px;
    background: linear-gradient(100deg, transparent 35%, rgba(150, 160, 180, 0.30) 50%, transparent 65%);
    background-size: 200% 100%;
    animation: ft-shimmer 1.3s linear infinite;
}

.ft-title.ft-loading {
    opacity: 0.55;
}

.ft-rope {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 6px;
    vertical-align: -1px;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    animation: ft-spin 0.9s linear infinite;
}

.ft-perpost.ft-pending {
    opacity: 0.65;
    cursor: progress;
    pointer-events: none;
}

/* Catalog cards/reviews: keep the per-item translate control small and muted,
   spaced from the description text it acts on. */
.cat-actions {
    display: inline;
}

.cat-actions .ft-perpost {
    color: var(--text-secondary);
    font-size: 12px;
    opacity: 0.7;
    margin-left: 8px;
    white-space: nowrap;
}

/* Translate icon shown persistently next to the original/translate toggle. */
.ft-mark {
    display: inline-block;
    margin-left: 8px;
    margin-right: 6px;
    line-height: 0;
    vertical-align: middle;
    white-space: nowrap;
}

.ft-mark svg {
    width: 14px;
    height: 14px;
    fill: currentColor;
    color: var(--text-secondary);
    opacity: 0.6;
}

.cat-actions .ft-perpost:hover,
.cat-actions .ft-perpost:focus-visible {
    opacity: 1;
    color: var(--accent);
}

.ft-done {
    animation: ft-fade 0.35s ease-out;
}

@keyframes ft-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

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

@keyframes ft-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}