:root{--blue:#126af5;--ink:#1f2937;--muted:#7a8494;--line:#e7ebf0;--bg:#f6f8fa;--card:#fff;--green:#17a673;--danger:#e65151}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:14px}.topbar{height:64px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 max(28px,calc((100vw - 1180px)/2));gap:38px;position:sticky;top:0;z-index:5}.brand{display:flex;align-items:center;gap:9px;color:#182338;text-decoration:none;font-size:18px;font-weight:700;white-space:nowrap}.brand-mark{width:28px;height:28px;color:#fff;background:var(--blue);display:grid;place-items:center;border-radius:8px;font-size:15px}nav{height:100%;display:flex;gap:26px}nav a{height:100%;display:grid;place-items:center;color:#606b7b;text-decoration:none;border-bottom:2px solid transparent}nav a.active{color:var(--blue);border-color:var(--blue);font-weight:600}.sync-button{margin-left:auto;border:0;background:var(--blue);color:#fff;padding:9px 15px;border-radius:7px;cursor:pointer;font-size:14px;font-weight:600}.sync-button:disabled{opacity:.65;cursor:wait}.sync-icon{font-size:18px;margin-right:5px;vertical-align:-1px}.logout-button{border:1px solid #d5dbe4;background:#fff;color:#596579;padding:8px 13px;border-radius:7px;cursor:pointer;font-size:14px;font-weight:600;white-space:nowrap}.logout-button:hover{border-color:#f0b8b8;background:#fff7f7;color:var(--danger)}.logout-button:focus-visible{outline:3px solid rgba(22,119,255,.2);outline-offset:2px}.logout-button:disabled{opacity:.65;cursor:wait}.page-shell{max-width:1180px;margin:0 auto;padding:30px 22px 60px}.page{display:none}.page.active{display:block}.card{background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:0 2px 7px rgba(28,39,56,.025)}.profile-card{padding:24px;display:flex;align-items:center;gap:18px}.avatar{width:68px;height:68px;border-radius:50%;background:#d9e9ff;object-fit:cover}.avatar-placeholder{display:grid;place-items:center;font-size:28px;font-weight:700;color:#4689e6}.profile-main{flex:1;min-width:0}.profile-name{font-size:20px;font-weight:700}.badges{margin-top:7px;color:var(--muted)}.tag{display:inline-block;background:#eef5ff;color:#3179d7;padding:2px 7px;border-radius:4px;margin-right:6px;font-size:12px}.bio{margin:9px 0 0;color:#576273;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.profile-stats{display:flex;gap:30px;text-align:center}.profile-stats b{display:block;font-size:20px}.profile-stats span{color:var(--muted);font-size:12px}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:18px 0}.metric-card{padding:18px 20px}.metric-card p{margin:0;color:var(--muted)}.metric-card strong{font-size:25px;margin:10px 0 7px;display:block}.delta{font-size:12px;color:var(--green)}.delta.neutral{color:var(--muted)}.section-card{margin-top:18px;padding:22px}.section-head{display:flex;align-items:center;gap:14px;margin-bottom:20px}.section-title{font-size:17px;font-weight:700;margin:0}.tabs{display:flex;gap:4px}.tabs button,.range button,.filter button{border:0;border-radius:5px;background:transparent;color:#657083;cursor:pointer;padding:6px 10px}.tabs button.active,.range button.active,.filter button.active{color:var(--blue);background:#edf5ff;font-weight:600}.range{margin-left:auto;background:#f5f7fa;border-radius:6px;padding:2px}.chart{width:100%;height:260px;position:relative}.chart-empty{height:100%;display:grid;place-items:center;color:var(--muted)}.chart svg{width:100%;height:100%;overflow:visible}.grid-line{stroke:#edf0f3;stroke-width:1}.area{fill:rgba(22,119,255,.1)}.line{fill:none;stroke:var(--blue);stroke-width:2.5}.dot{fill:#fff;stroke:var(--blue);stroke-width:2}.axis-label{font-size:11px;fill:#8a94a3}.top-list{list-style:none;padding:0;margin:0}.top-list li{display:flex;align-items:center;gap:13px;padding:14px 0;border-top:1px solid var(--line)}.rank{color:#a0a9b6;font-weight:700;width:18px}.work-title{color:#28374c;text-decoration:none;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.work-meta{color:var(--muted);white-space:nowrap}.toolbar{padding:14px 18px;display:flex;gap:24px;align-items:center;margin-bottom:15px}.filter label{color:var(--muted);margin-right:7px}.table-card{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:820px}.data-table th{text-align:left;color:#778294;font-weight:500;background:#fbfcfd}.data-table th button{border:0;background:transparent;color:inherit;cursor:pointer;padding:0;font:inherit}.data-table td,.data-table th{padding:15px 14px;border-bottom:1px solid var(--line)}.data-table tbody tr:hover{background:#f8fbff}.data-table .title-cell{max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.type-pill{font-size:12px;padding:3px 7px;border-radius:4px;background:#f1f3f5;color:#657083}.deleted{opacity:.48}.pagination{display:flex;justify-content:flex-end;gap:10px;align-items:center;padding:16px}.pagination button{border:1px solid var(--line);background:#fff;border-radius:5px;padding:5px 9px;cursor:pointer}.empty{padding:72px 20px;text-align:center}.empty-icon{font-size:48px;color:#a8c9f6}.empty h2{margin:13px 0 8px;font-size:20px}.empty p{color:var(--muted);margin:0 0 20px}.primary{border:0;background:var(--blue);color:#fff;border-radius:6px;padding:10px 15px;cursor:pointer;font-weight:600}.secondary{border:1px solid #cfd7e2;background:#fff;color:#39465a;border-radius:6px;padding:9px 13px;cursor:pointer}.settings-grid{display:grid;gap:18px}.settings-card{padding:22px}.settings-card h2{font-size:16px;margin:0 0 16px}.settings-row{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:14px 0;gap:16px}.settings-row:first-of-type{border-top:0;padding-top:0}.settings-row p{margin:4px 0 0;color:var(--muted);font-size:13px}.action-group{display:flex;gap:8px;flex-wrap:wrap}.danger{color:var(--danger);border-color:#f2c4c4}.detail-back{border:0;background:transparent;color:var(--blue);cursor:pointer;padding:0 0 16px;font-size:14px}.detail-title{margin:0;font-size:24px}.detail-subtitle{color:var(--muted);margin:10px 0 0}.detail-metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border-radius:8px;overflow:hidden;margin-top:18px}.detail-metrics div{background:#fff;padding:15px}.detail-metrics span{display:block;color:var(--muted);font-size:12px}.detail-metrics b{display:block;font-size:19px;margin-top:5px}.toast{position:fixed;top:80px;left:50%;transform:translateX(-50%) translateY(-15px);opacity:0;pointer-events:none;background:#27364a;color:#fff;padding:10px 15px;border-radius:7px;transition:.2s;z-index:20}.toast.visible{opacity:1;transform:translateX(-50%)}.modal{position:fixed;inset:0;background:rgba(20,30,42,.42);display:none;place-items:center;z-index:10}.modal.open{display:grid}.modal-box{background:#fff;border-radius:10px;width:min(420px,calc(100% - 40px));padding:24px}.modal-box h3{margin:0 0 9px}.modal-box p{color:var(--muted);line-height:1.6}.modal-actions{text-align:right;margin-top:20px;display:flex;justify-content:flex-end;gap:9px}@media(max-width:720px){.topbar{padding:0 16px;gap:15px}.topbar nav{gap:12px}.brand{font-size:0}.brand-mark{font-size:15px}.sync-button span:last-child{display:none}.logout-button{padding-inline:10px}.page-shell{padding:18px 14px}.profile-card{align-items:flex-start;flex-wrap:wrap}.profile-stats{width:100%;justify-content:space-around}.metric-grid{grid-template-columns:repeat(2,1fr);gap:10px}.detail-metrics{grid-template-columns:repeat(2,1fr)}.toolbar{display:block}.filter{margin-top:9px}.section-head{flex-wrap:wrap}.range{margin-left:0}}
.preview-badge {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1000;
  padding: 8px 12px;
  border: 1px solid #c9d6ff;
  border-radius: 999px;
  background: rgba(241, 245, 255, 0.94);
  box-shadow: 0 8px 24px rgba(34, 64, 132, 0.14);
  color: #3156a3;
  font-size: 12px;
  font-weight: 700;
  pointer-events: auto;
  transition: opacity .16s ease, transform .16s ease;
}
.preview-badge.pointer-hidden { opacity: 0; transform: translateY(6px); pointer-events: none; }

/* 客户端顶部账号状态与同步状态 */
.topbar { gap: 24px; }
.topbar nav { flex: 0 1 auto; }
.sync-button { display: inline-flex; align-items: center; justify-content: center; min-width: 108px; max-width: 210px; white-space: nowrap; }
.sync-button span:last-child { overflow: hidden; text-overflow: ellipsis; }
.sync-spinner { width: 14px; height: 14px; margin-right: 7px; border: 2px solid rgba(255,255,255,.45); border-top-color: #fff; border-radius: 50%; animation: sync-spin .8s linear infinite; }
@keyframes sync-spin { to { transform: rotate(360deg); } }
.user-menu { position: relative; flex: 0 0 auto; }
.user-status-button { min-width: 142px; height: 42px; display: grid; grid-template-columns: 30px minmax(0,1fr) 14px; align-items: center; gap: 9px; padding: 5px 9px; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: var(--ink); cursor: pointer; text-align: left; }
.user-status-button:hover,.user-menu.open .user-status-button,.user-menu:focus-within .user-status-button { border-color: #b9d6ff; background: #f8fbff; }
.user-avatar { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(135deg,#1677ff,#65a6ff); color: #fff; font-size: 13px; font-weight: 700; }
.user-status-copy { min-width: 0; display: grid; line-height: 1.2; }
.user-status-copy b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.user-status-copy small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.user-chevron { color: #8792a3; transition: transform .16s ease; }
.user-menu.open .user-chevron { transform: rotate(180deg); }
.user-menu-popover { position: absolute; top: calc(100% + 9px); right: 0; z-index: 30; width: 180px; padding: 7px; border: 1px solid var(--line); border-radius: 10px; background: #fff; box-shadow: 0 14px 36px rgba(30,45,65,.16); opacity: 0; visibility: hidden; transform: translateY(-5px); transition: .16s ease; }
.user-menu-popover::before { content: ""; position: absolute; top: -10px; right: 0; left: 0; height: 10px; }
.user-menu.open .user-menu-popover { opacity: 1; visibility: visible; transform: translateY(0); }
.user-menu-popover button { width: 100%; display: flex; align-items: center; gap: 10px; padding: 10px 11px; border: 0; border-radius: 7px; background: transparent; color: #344054; cursor: pointer; font: inherit; text-align: left; }
.user-menu-popover button:hover,.user-menu-popover button:focus-visible { background: #f2f6fb; outline: none; }
.user-menu-popover button.danger:hover { background: #fff2f2; color: var(--danger); }
.client-update-button { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 7px 11px; border: 1px solid #ffd591; border-radius: 8px; background: #fff8e8; color: #9a5b00; cursor: pointer; font-size: 12px; font-weight: 600; white-space: nowrap; }
.client-update-button[hidden] { display: none; }
.client-update-button:hover { border-color: #ffbd59; background: #fff3d2; }
.client-update-button:disabled { cursor: wait; opacity: .78; }
.client-update-dot { width: 7px; height: 7px; border-radius: 50%; background: #fa8c16; box-shadow: 0 0 0 4px rgba(250,140,22,.13); }
.client-update-button.current { border-color: #cfe6dc; background: #f2faf6; color: #28765a; }
.client-update-button.current .client-update-dot { background: #35a477; box-shadow: 0 0 0 4px rgba(53,164,119,.12); }
.client-update-button.checking .client-update-dot,
.client-update-button.downloading .client-update-dot,.client-update-button.verifying .client-update-dot { animation: sync-pulse 1.1s ease infinite; }
.client-update-button.error { border-color: #f2c4c4; background: #fff2f2; color: var(--danger); }
.client-update-button.error .client-update-dot { background: var(--danger); box-shadow: 0 0 0 4px rgba(230,81,81,.12); }
.sync-status-panel { position: fixed; top: 74px; right: max(24px,calc((100vw - 1180px)/2)); z-index: 18; width: min(640px,calc(100vw - 32px)); padding: 17px; border: 1px solid #dce6f3; border-radius: 12px; background: rgba(255,255,255,.98); box-shadow: 0 16px 42px rgba(30,53,83,.17); backdrop-filter: blur(10px); }
.sync-status-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.sync-status-head > div { display: flex; align-items: center; gap: 10px; }
.sync-status-head strong { font-size: 15px; }
.sync-status-head span { padding: 3px 8px; border-radius: 999px; background: #edf5ff; color: var(--blue); font-size: 11px; }
.sync-status-panel.success .sync-status-head span { background: #eaf8f2; color: #12815b; }
.sync-status-panel.error .sync-status-head span { background: #fff1f1; color: #b13b3b; }
.sync-status-head button { border: 0; background: transparent; color: #8c97a7; cursor: pointer; font-size: 20px; line-height: 1; }
.sync-status-panel > p { margin: 8px 0 13px; color: #647084; font-size: 12px; }
.sync-stage-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.sync-stage { min-height: 42px; display: flex; align-items: center; gap: 7px; padding: 9px 10px; border-radius: 8px; background: #f4f6f9; color: #8a95a6; font-size: 11px; line-height: 1.35; }
.sync-stage i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: #c7ced8; }
.sync-stage > span { min-width: 0; display: grid; gap: 3px; }
.sync-stage small { overflow: hidden; color: #56729a; font-size: 10px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.sync-stage.active { background: #eaf3ff; color: #1269db; font-weight: 600; }
.sync-stage.active i { background: var(--blue); box-shadow: 0 0 0 4px rgba(22,119,255,.12); animation: sync-pulse 1.2s ease infinite; }
.sync-stage.complete { background: #edf8f3; color: #14805b; }
.sync-stage.complete i { background: #20a474; }
.sync-stage.error { background: #fff1f1; color: #b13b3b; }
.sync-stage.error i { background: var(--danger); }
@keyframes sync-pulse { 50% { box-shadow: 0 0 0 7px rgba(22,119,255,.04); } }
.sync-scope-form { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding-top: 16px; border-top: 1px solid var(--line); color: #5f6b7c; }
.sync-scope-form label { display: inline-flex; align-items: center; gap: 7px; }
.sync-scope-form input { width: 92px; padding: 9px 10px; border: 1px solid #cfd7e2; border-radius: 7px; color: var(--ink); font: inherit; }
.sync-scope-form .primary { margin-left: auto; }
@media(max-width:1000px){.topbar{gap:14px}.topbar nav{gap:16px}.brand>span:last-child{display:none}.client-update-button{max-width:130px}.client-update-button span:last-child{overflow:hidden;text-overflow:ellipsis}.user-status-button{min-width:42px;grid-template-columns:30px;padding:5px}.user-status-copy,.user-chevron{display:none}}
@media(max-width:720px){.sync-status-panel{top:70px;right:16px}.sync-stage-grid{grid-template-columns:1fr 1fr}.sync-scope-form{align-items:flex-start}.sync-scope-form .primary{width:100%;margin-left:0}.user-menu-popover{position:fixed;top:64px;right:10px}}

.release-notes{white-space:pre-wrap;max-height:240px;overflow:auto}
.zhihu-topic-tags { display: inline-flex; flex-wrap: wrap; gap: 8px; margin-left: 12px; vertical-align: middle; max-width: 100%; }
.zhihu-topic-tag { display: inline-block; padding: 6px 14px; border-radius: 999px; background: #e7f0ff; color: #1767d2; font-size: 13px; line-height: 1.6; font-weight: 400; overflow-wrap: anywhere; }
@media (max-width: 600px) { .zhihu-topic-tags { margin-left: 6px; row-gap: 6px; } }