.sync-status-panel{z-index:20;flex-shrink:0;grid-template-rows:0fr;transition:grid-template-rows .22s;display:grid}.sync-status-panel.occupied{grid-template-rows:1fr}.sync-status-panel.exiting{grid-template-rows:0fr}.sync-status-clip{min-height:0;overflow:hidden}.sync-status-panel .sync-status-banner{text-align:left;opacity:1;font-size:.75rem;font-weight:600;transition:opacity .22s,transform .22s;transform:translateY(0)}.sync-status-panel.exiting .sync-status-panel .sync-status-banner{opacity:0;pointer-events:none;transform:translateY(-8px)}.sync-status-panel .sync-status-banner.loading{background:var(--tone-info-bg);color:var(--tone-info-fg)}.sync-status-panel .sync-status-banner.warning{background:var(--tone-error-bg);color:var(--tone-error-fg)}.sync-status-panel .sync-status-banner.success{background:var(--tone-success-bg);color:var(--tone-success-fg)}.sync-status-panel .sync-status-banner.settled{background:var(--bg);color:var(--text-muted)}.sync-banner-content{justify-content:center;align-items:center;gap:8px;width:100%;max-width:680px;min-height:44px;margin:0 auto;padding:7px 13px;display:flex}.sync-status-panel .sync-status-message{overflow-wrap:anywhere;text-align:center;flex:0 auto;min-width:0;line-height:1.35}.sync-status-symbol{flex:0 0 18px;justify-content:center;align-items:center;width:18px;display:flex}.sync-status-symbol svg{width:18px;height:18px;display:block}.sync-status-panel .sync-status-icon{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round}.sync-status-symbol.spinning{box-sizing:border-box;border:1.7px solid;border-color:currentColor currentColor #1f5f8630 #1f5f8630;border-radius:50%;flex-basis:15px;width:15px;height:15px;animation:1s linear infinite sync-spin}.sync-banner-details{font:inherit;min-height:30px;color:inherit;cursor:pointer;background:linear-gradient(#e1edf7,#d9e8f3);border:1px solid #1f5f8633;border-radius:8px;flex-shrink:0;padding:6px 10px;font-size:.7rem;font-weight:650;position:relative}.sync-banner-details:before{content:"";position:absolute;inset:-7px 0}.sync-status-panel .sync-status-banner.warning .sync-banner-details{background:linear-gradient(#fbe5e5,#f6dcdc);border-color:#9f2a2a2e}.sync-status-panel .sync-status-banner.success .sync-banner-details{background:linear-gradient(#e2f0e7,#d9ebdf);border-color:#2b6f452e}.sync-status-panel .sync-status-banner.settled .sync-banner-details{border-color:var(--border);background:var(--bg)}.sync-banner-details:focus{outline:none}.sync-status-panel.keyboard-focus .sync-banner-details:focus-visible{outline-offset:-3px;outline:2px solid}.sync-detail-dialog{background:var(--card);width:calc(100% - 32px);max-width:430px;max-height:calc(100dvh - 48px);color:var(--text);box-shadow:var(--shadow-md);border:0;border-radius:18px;margin:auto;padding:0;position:fixed;inset:0;overflow:hidden}.sync-detail-dialog[open]{flex-direction:column;animation:.18s sync-dialog-in;display:flex}.sync-detail-dialog:focus{outline:none}.sync-detail-dialog::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#20354166}body:has(.sync-detail-dialog[open]) .app-content{overflow:hidden}.sync-details{overscroll-behavior:contain;padding:20px 24px;font-size:.82rem;overflow:auto}.sync-dialog-summary{color:#235773;background:#edf4f8;border-left:3px solid #6c9cb4;border-radius:11px;padding:15px 16px}.sync-dialog-summary.warning{color:var(--tone-error-fg);background:#fdf0ef;border-color:#cd7774}.sync-dialog-summary.success{color:var(--tone-success-fg);background:#edf6f0;border-color:#79aa8b}.sync-dialog-summary.settled{background:var(--bg);border-color:var(--border);color:var(--text)}.sync-dialog-summary strong{font-size:.875rem}.sync-details p{color:var(--text-muted);overflow-wrap:anywhere;margin:8px 0 0;font-size:.75rem;line-height:1.55}.sync-task-list{margin:0;padding:0;list-style:none}.sync-task-list>li{padding:18px 0}.sync-task-list>li+li{border-top:1px solid var(--border)}.sync-task-list>li:last-child{padding-bottom:0}.sync-task-heading{justify-content:space-between;gap:15px;font-size:.75rem;display:flex}.sync-task-heading strong{overflow-wrap:anywhere;min-width:0}.sync-task-heading span{color:var(--text-muted);text-align:right;font-size:.7rem}.sync-task-note{color:var(--text-muted);font-size:.7rem}.sync-details progress{width:100%;height:6px;accent-color:var(--accent);margin:14px 0 5px}.sync-dialog-footer{border-top:1px solid var(--border);flex-wrap:wrap;flex-shrink:0;justify-content:flex-end;gap:8px;padding:16px 24px;display:flex}.sync-recovery-actions{margin-top:16px}.sync-recovery-actions ul{padding:0;list-style:none}.sync-recovery-actions li{margin-top:12px}@keyframes sync-spin{to{transform:rotate(360deg)}}@keyframes sync-dialog-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.sync-status-panel,.sync-status-panel .sync-status-banner{transition:none}.sync-status-symbol.spinning,.sync-detail-dialog[open]{animation:none}.sync-status-symbol.spinning{border-style:dotted;border-color:currentColor}}.sync-dialog-footer button{min-height:44px}.sync-detail-dialog .vw-edit-save-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:10px;padding:8px 20px;font-family:inherit;font-size:.82rem;font-weight:600;transition:background .2s}.sync-detail-dialog .vw-edit-save-btn:hover{background:var(--accent-hover)}.sync-detail-dialog .vw-dialog-cancel{border:1.5px solid var(--border);color:var(--text);cursor:pointer;background:0 0;border-radius:10px;padding:8px 18px;font-family:inherit;font-size:.82rem;font-weight:600;transition:all .2s}.sync-detail-dialog .vw-dialog-cancel:hover{background:var(--bg-secondary);border-color:var(--accent)}.sync-detail-dialog .vw-preview-header{border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.sync-detail-dialog .vw-preview-title{color:var(--text);text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:.95rem;font-weight:600;overflow:hidden}.sync-detail-dialog .vw-preview-close{width:32px;height:32px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;transition:color .2s;display:flex}.sync-detail-dialog .vw-preview-close:hover{color:var(--text)}.sync-unconfirmed{margin-top:16px}.sync-unconfirmed__label{color:var(--text-muted);letter-spacing:.06em;text-transform:uppercase;font-size:11px;font-weight:600}.sync-unconfirmed__list{flex-direction:column;gap:8px;margin-top:8px;display:flex}.sync-unconfirmed__item{background:var(--bg);border-radius:10px;flex-direction:column;gap:8px;padding:12px 14px;display:flex}.sync-unconfirmed__head{justify-content:space-between;gap:12px;font-size:.75rem;display:flex}.sync-unconfirmed__head strong{overflow-wrap:anywhere;min-width:0}.sync-unconfirmed__head span{color:var(--text-muted);white-space:nowrap;font-size:11px}.sync-details .sync-unconfirmed__hint{margin:0;font-size:12px;line-height:1.45}.sync-unconfirmed__actions{justify-content:flex-end;display:flex}.sync-unconfirmed__discard{border:1px solid var(--border-strong);background:var(--card);min-height:30px;color:var(--text);cursor:pointer;border-radius:8px;padding:4px 12px;font-family:inherit;font-size:12px;font-weight:600}.sync-unconfirmed__discard:hover{border-color:var(--accent)}
