.sync-shell{width:min(960px,calc(100% - 32px));margin:14px auto 0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",Arial,sans-serif}
.sync-nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line,#d8d1c4);border-radius:12px;background:var(--card,#fffdf8);color:var(--ink,#202124);box-shadow:0 2px 10px rgba(0,0,0,.04)}
.sync-nav a,.sync-nav button{display:inline-flex;align-items:center;min-height:36px;padding:6px 11px;border:1px solid var(--line,#d8d1c4);border-radius:9px;background:var(--card,#fffdf8);color:var(--accent,#315f94);font:inherit;text-decoration:none;cursor:pointer}
.sync-nav a:hover,.sync-nav button:hover{border-color:var(--accent,#315f94);background:var(--answer,#eef5ff)}
.sync-reading-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sync-nav .sync-spacer{flex:1}
.sync-status{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:var(--chip,#edf3fb);color:var(--muted,#686d75);font-size:.86rem}
.sync-status::before{content:"";width:8px;height:8px;border-radius:50%;background:#c68a18}
.sync-status[data-mode="cloud"]::before{background:#25824b}
.sync-status[data-mode="syncing"]::before{background:#397fc1;animation:sync-pulse 1s ease-in-out infinite alternate}
.sync-status[data-mode="pending"]::before{background:#c68a18}
.sync-status[data-mode="error"]::before{background:#c43d3d}
.sync-bottom{margin-top:28px;margin-bottom:34px}
.sync-tools{display:flex;flex-wrap:wrap;gap:8px}
.sync-mobile-game-link{display:none!important}
.sync-import-input{display:none}
.sync-note{width:100%;margin:3px 0 0;color:var(--muted,#686d75);font-size:.82rem}
.toolbar .reading-review-button{min-height:44px}
@keyframes sync-pulse{to{opacity:.35}}
@media(max-width:640px){.sync-shell{width:min(100% - 20px,960px)}.sync-nav{padding:9px}.sync-nav a,.sync-nav button{flex:1;justify-content:center}.sync-nav .sync-spacer{display:none}.sync-status{flex-basis:100%;justify-content:center}}
.sync-auth{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:min(960px,calc(100% - 32px));margin:12px auto 0;padding:10px 12px;border:1px solid var(--line,#3b414a);border-radius:10px;background:var(--card,#22252a);color:var(--muted,#abb1bb);font-size:.92rem}
.sync-auth input{min-width:180px;padding:7px 9px;border:1px solid var(--line,#3b414a);border-radius:7px;background:transparent;color:inherit}
.sync-auth button{padding:7px 11px;border:1px solid var(--line,#3b414a);border-radius:7px;background:transparent;color:inherit;cursor:pointer}
.sync-auth button:hover{border-color:var(--accent,#9fc4f5)}
.sync-auth [data-sync-auth-note]{color:var(--muted,#abb1bb)}
@media(max-width:650px){
  body{padding-bottom:env(safe-area-inset-bottom,0px)}
  .sync-shell,.sync-auth{width:min(100% - 20px,960px)}
  .sync-shell{font-size:1rem;line-height:1.65}
  .sync-nav{display:grid;grid-template-columns:1fr;padding:10px;gap:9px}
  .sync-reading-links,.sync-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:8px}
  .sync-reading-links a,.sync-reading-links>span,.sync-tools a,.sync-tools button{width:100%;min-height:44px;justify-content:center;text-align:center}
  .sync-mobile-game-link{display:inline-flex!important}
  .sync-desktop-game-link{display:none!important}
  .sync-reading-links>*:only-child{grid-column:1/-1}
  .sync-nav .sync-spacer{display:none}
  .sync-status{width:100%;min-height:44px;justify-content:center}
  .sync-note{margin:0;text-align:center;line-height:1.5}
  .sync-bottom{margin-bottom:calc(34px + env(safe-area-inset-bottom,0px))}
  .sync-auth{display:grid;grid-template-columns:1fr;gap:8px;padding:10px}
  .sync-auth input,.sync-auth button{width:100%;min-width:0;min-height:44px}
}