.app-update-banner{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:15px;padding:10px 12px;margin:0 0 18px;background:var(--paper)}
.app-update-copy{flex:1;min-width:0;padding:3px 0;text-align:left;line-height:1.4}
.app-update-copy strong{display:block;font-size:13px;font-weight:650}.app-update-copy small{display:block;font-size:11px;color:var(--muted);margin-top:4px}
.app-update-quick{flex:none;color:var(--blue);font-size:12px;font-weight:650;padding:8px 4px}
.app-update-banner>.icon-button{width:32px;min-width:32px;padding:4px}.app-update-banner>.icon-button .icon{width:17px;height:17px;color:var(--muted)}
.app-update-sheet .app-update-version{font-size:13px;color:var(--muted);margin:0 0 8px}.app-update-sheet h3{font-size:18px;line-height:1.4}
.app-update-sheet .app-update-notes{white-space:pre-line;font-size:14px;color:var(--ink);line-height:1.6;margin-top:16px}
.app-update-sheet .app-update-message{font-size:12px;line-height:1.6;color:var(--muted);margin-top:16px}
.app-update-sheet progress{display:block;width:100%;height:8px;accent-color:var(--blue);margin-top:20px;border-radius:5px;overflow:hidden}
.app-update-sheet>.primary{margin-top:22px}
.app-update-status{position:relative;display:flex;align-items:center;gap:14px;padding:12px 0 18px;min-height:84px}
.app-update-status h3{font-size:17px;min-width:0}
.app-update-signal{position:relative;display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%;color:var(--blue);background:color-mix(in srgb,var(--blue) 10%,transparent);transition:color .2s,background-color .2s}
.app-update-signal svg{width:25px;height:25px;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.app-update-signal::after{content:"";position:absolute;inset:-2px;border:2px solid transparent;border-top-color:currentColor;border-right-color:currentColor;border-radius:50%;opacity:0}
[data-update-state=checking] .app-update-signal::after,[data-update-state=verifying] .app-update-signal::after{opacity:1;animation:update-orbit 1.1s linear infinite}
.app-update-checking .icon{animation:update-orbit 1.4s linear infinite}
.app-update-scan{position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:3px;background:color-mix(in srgb,var(--blue) 10%,transparent);overflow:hidden}
.app-update-scan::after{content:"";display:block;width:40%;height:100%;border-radius:inherit;background:var(--blue);animation:update-scan 1.4s ease-in-out infinite}
[data-update-state=current] .app-update-signal{color:var(--green)}
[data-update-state=current] .app-update-signal path{stroke-dasharray:22;animation:update-check .3s ease-out}
[data-update-state=error] .app-update-signal{color:var(--red)}
@keyframes update-orbit{to{transform:rotate(360deg)}}
@keyframes update-scan{from{transform:translateX(-105%)}to{transform:translateX(355%)}}
@keyframes update-check{from{stroke-dashoffset:22}to{stroke-dashoffset:0}}
html[data-motion=off] .app-update-signal::after,html[data-motion=off] .app-update-scan::after,html[data-motion=off] .app-update-checking .icon,html[data-motion=off] .app-update-signal path{animation:none}
@media(prefers-reduced-motion:reduce){.app-update-signal::after,.app-update-scan::after,.app-update-checking .icon,.app-update-signal path{animation:none}}