/* Only the refresh control and its transient feedback own these styles. */
.tss-mobile-refresh { display: none; }
.tss-refresh-feedback {
    position: fixed; z-index: 1085; top: calc(var(--tss-refresh-top, 0px) + 10px);
    left: 50%; transform: translateX(-50%); box-sizing: border-box;
    max-width: calc(100% - 24px); width: max-content; padding: 10px 16px;
    border: 1px solid var(--tss-border, #cbd5e1); border-radius: 16px;
    background: var(--tss-surface, #fff); color: var(--tss-text, #0f172a);
    box-shadow: 0 4px 16px rgb(15 23 42 / 12%); font-family: inherit; font-weight: 500;
    font-size: 13px; line-height: 1.6;
    text-align: center; pointer-events: none;
}
.tss-refresh-feedback[hidden] { display: none; }
.tss-mobile-refresh:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.tss-mobile-refresh[aria-busy="true"] svg { animation: tss-refresh-spin 1s linear infinite; }
@keyframes tss-refresh-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .tss-mobile-refresh[aria-busy="true"] svg { animation: none; }
}
@media (max-width: 991.98px) {
    html.tss-refresh-enabled, html.tss-refresh-enabled body { overscroll-behavior-y: none; }
    .tss-mobile-refresh {
        display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px;
        width: 44px; min-width: 44px; height: 44px; margin: 0; padding: 10px;
        border: 1px solid transparent; border-radius: 12px; cursor: pointer;
        background: transparent; color: var(--tss-text, #0f172a);
    }
    .tss-mobile-refresh svg { width: 22px; height: 22px; }
    .tss-mobile-refresh:hover, .tss-mobile-refresh:active { background: var(--tss-surface-muted, #f1f5f9); }
    .tss-mobile-refresh:disabled { cursor: wait; }
    html.tss-content-frame .tss-mobile-refresh { display: none; }
}