@layer components{.sync-status{align-items:center;gap:var(--space-2) var(--space-3);padding:var(--space-2) var(--page-pad);border-bottom:var(--border-strong) solid var(--color-line);background:var(--color-surface);color:var(--color-ink);font-size:var(--text-sm);flex-wrap:wrap;margin:0;display:flex}.sync-status svg{flex:none}.sync-status-connection{align-items:center;gap:6px;font-weight:700;display:inline-flex}.sync-status-connection.is-disconnected{color:var(--color-danger)}.sync-status-summary{align-items:center;gap:2px var(--space-1);flex-wrap:wrap;min-width:0;display:inline-flex}.sync-status-pill{min-height:32px;padding:2px var(--space-3);border-radius:var(--radius-full);background:var(--color-success-bg);color:var(--color-success);align-items:center;gap:6px;font-weight:700;display:inline-flex}.sync-status-pill.is-waiting{background:var(--color-primary);color:var(--color-on-primary)}.sync-status-last{color:var(--color-ink-muted)}.sync-status-link,.sync-status-attention{min-height:var(--target-min);color:var(--color-ink);align-items:center;gap:6px;font-weight:700;display:inline-flex}.sync-status-link{padding-inline:var(--space-1)}.sync-status-attention{padding:2px var(--space-3);border-radius:var(--radius-full);background:var(--color-danger);color:var(--color-ink-inverse);text-decoration:none}.sync-status-action.secondary{min-height:var(--target-min);padding:var(--space-1) var(--space-3);font-size:var(--text-sm);gap:6px;margin-left:auto}.sync-status-note{flex-basis:100%}.sync-status-pill__short{display:none}@media (width<=599px){.sync-status-connection.is-connected .sync-status-connection__text,.sync-status-last{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}}@media (width<=419px){.sync-status:not([data-layout=field]){gap:var(--space-1) var(--space-2);padding-inline:var(--space-4)}.sync-status-pill{white-space:nowrap;min-height:28px;padding-inline:var(--space-2);font-size:var(--text-xs)}.sync-status-pill__long{display:none}.sync-status-pill__short{display:inline}.sync-status-sync.secondary{min-width:var(--target-min);padding-inline:var(--space-2);justify-content:center}.sync-status-sync .sync-status-action__label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}}.sync-status[data-layout=field]{padding-block:var(--space-2);background:var(--color-bar);color:var(--color-on-bar);font-size:var(--text-base);border-bottom:0;justify-content:flex-end}.sync-status[data-layout=field] .sync-status-connection.is-disconnected{color:var(--color-primary);margin-right:auto}.sync-status-send{align-items:center;gap:var(--space-2);min-height:var(--target-min);padding:var(--space-1) var(--space-4);border-radius:var(--radius-full);background:var(--color-primary);color:var(--color-on-primary);font:inherit;cursor:pointer;border:0;font-weight:700;display:inline-flex}.sync-status-send:disabled{cursor:default;opacity:1}.sync-status[data-layout=field] .sync-status-attention{min-height:var(--target-min)}.sync-status[data-layout=field] .sync-status-note{color:var(--color-on-bar)}}