.device-details .sync-flow{margin:26px auto 24px;padding:24px 28px 18px;max-width:680px;border:1px solid var(--line);border-radius:24px;background:var(--experience-panel);color:var(--ink)}
.sync-flow-layout{display:grid;grid-template-columns:90px minmax(0,1fr) 90px;align-items:center;gap:26px}
.sync-flow-node{display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0;font-size:12px;font-weight:650;line-height:1.3}
.sync-flow-icon{display:grid;place-items:center;overflow:hidden;width:72px;height:72px;border-radius:18px;background:#fff;box-shadow:0 5px 16px #0000000c}
.sync-flow-health img{display:block;width:100%;height:100%;object-fit:contain}
.sync-flow-better img{display:block;width:40px;height:40px}
.sync-flow-lanes{display:grid;gap:23px;min-width:0}
.sync-flow-lane{display:flex;flex-direction:column;align-items:center;min-width:0;text-align:center;font-size:11px;line-height:1.5}
.sync-flow-lane strong{font-size:12px;font-weight:600;color:var(--ink)}
.sync-flow-lane>span{color:var(--muted)}
.sync-flow-arrow{display:block;width:100%;height:20px;margin:5px 0;overflow:visible;color:#559f85;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.sync-flow-write .sync-flow-arrow{color:#d97691}
.sync-flow-dot{fill:currentColor;stroke:none;opacity:0}
.device-details[open] .sync-flow-dot{animation:sync-record-travel 3.2s linear infinite}
.device-details[open] .sync-flow-write .sync-flow-dot{animation-direction:reverse;animation-delay:-1.6s}
.sync-flow figcaption{display:flex;justify-content:center;align-items:center;gap:6px;margin-top:22px;font-size:10px;line-height:1.6;color:var(--muted)}
.sync-flow figcaption svg{width:13px;height:13px;flex-shrink:0;stroke:currentColor;stroke-width:1.2}
[dir=rtl] .sync-flow-arrow{transform:scaleX(-1)}
@keyframes sync-record-travel{0%{transform:translateX(0);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateX(232px);opacity:0}}
@media(max-width:600px){.device-details .sync-flow{padding:20px 14px 16px;margin-top:22px;border-radius:20px}.sync-flow-layout{grid-template-columns:66px minmax(0,1fr) 66px;gap:13px}.sync-flow-icon{width:56px;height:56px;border-radius:15px}.sync-flow-better img{width:32px;height:32px}.sync-flow-node{font-size:10px;gap:9px}.sync-flow-lane{font-size:10px;line-height:1.55}.sync-flow-lane strong{font-size:11px}.sync-flow-lanes{gap:20px}.sync-flow figcaption{font-size:9px;margin-top:20px}}
@media(prefers-reduced-motion:reduce){.device-details[open] .sync-flow-dot{animation:none;display:none}}