/* Viewport feedback never changes card geometry or blocks another choice. */
.tr-fast-status { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 10001; display: flex; align-items: center; gap: 12px; max-width: calc(100vw - 32px); padding: 17px 22px; border: 1px solid #53d9bb99; border-radius: 16px; background: rgb(12 29 40 / 94%); color: #f3f8fc; box-shadow: 0 8px 30px #0004; font-size: 15px; font-weight: 600; line-height: 1.4; pointer-events: none; visibility: hidden; }
.tr-fast-status.is-visible { visibility: visible; }
.tr-fast-status__ring { box-sizing: border-box; flex: 0 0 30px; width: 30px; height: 30px; border: 3px solid #3be0b633; border-top-color: #3be0b6; border-right-color: #3be0b6; border-radius: 50%; }
.tr-fast-status.is-visible .tr-fast-status__ring { animation: tr-filter-spin .85s linear infinite; }
.tr-fast-status__live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
html[data-taring-theme="light"] .tr-fast-status { background: rgb(249 255 253 / 96%); color: #16304a; border-color: #008a7099; box-shadow: 0 8px 30px #1234; }
html[data-taring-theme="light"] .tr-fast-status__ring { border-color: #00876c33; border-top-color: #00876c; border-right-color: #00876c; }
@keyframes tr-filter-spin { to { transform: rotate(360deg); } }
/* Requested exception: only the small, visible loading ring keeps moving.
   Override the global reduced-motion duration/count, not any other animation. */
@media (prefers-reduced-motion: reduce) {
    .tr-fast-status.is-visible .tr-fast-status__ring {
        animation-duration: 2s !important;
        animation-iteration-count: infinite !important;
    }
}