/* CodeFlow · 主题层 v3 — 冷灰中性 + 靛蓝主色, 顶栏布局, 独立后台 (最后加载, 覆盖前面各层) */
:root {
  --bg: #f6f7f9;
  --bg-soft: #f1f3f6;
  --bg-muted: #e9ecf1;
  --card: #ffffff;
  --card-2: #f9fafb;
  --border: #d9dde4;
  --border-soft: #e6e9ee;
  --text: #171a21;
  --muted: #5d6573;
  --faint: #959cab;
  --acc: #3b5bdb;
  --acc-hover: #3049b8;
  --acc-soft: #edf1fd;
  --acc-ring: rgba(59, 91, 219, .22);
  --acc-2: #e8590c;
  --acc-2-soft: #fff1e8;
  --green: #2b8a3e;
  --green-soft: #ebf6ee;
  --purple: #7048e8;
  --purple-soft: #f1edfd;
  --danger: #e03131;
  --danger-soft: #fdeeee;
  --warn: #c27c0e;
  --warn-soft: #fff6e0;
  --radius: 8px;
  --radius-sm: 6px;
  --shadow-sm: 0 1px 2px rgba(23, 26, 33, .05);
  --shadow: 0 12px 32px rgba(23, 26, 33, .12), 0 2px 6px rgba(23, 26, 33, .06);
  --sidebar: #fff;
}
body { background: var(--bg); }
.brand-mark { background: var(--acc); box-shadow: none; border-radius: 8px; }

/* ---------- 顶栏 ---------- */
.topbar { position: sticky; top: 0; z-index: 80; background: rgba(255,255,255,.92); backdrop-filter: saturate(1.6) blur(10px);
  border-bottom: 1px solid var(--border-soft); }
.tb-inner { max-width: 1280px; margin: 0 auto; height: 58px; padding: 0 28px; display: flex; align-items: center; gap: 20px; }
.tb-left { display: flex; align-items: center; gap: 22px; flex: none; }
.tb-brand { display: flex; align-items: center; gap: 9px; font-weight: 700; font-size: 16px; color: var(--text); letter-spacing: -.2px; }
.tb-brand:hover { text-decoration: none; }
.tb-brand .brand-mark { width: 28px; height: 28px; }
.tb-navs { display: flex; gap: 2px; }
.tb-nav { height: 34px; padding: 0 12px; display: inline-flex; align-items: center; border-radius: 6px; color: var(--muted); font-weight: 500; }
.tb-nav:hover { color: var(--text); background: var(--bg-soft); text-decoration: none; }
.tb-nav.active { color: var(--text); background: var(--bg-muted); }
.tb-search { flex: 1; max-width: 420px; margin-left: auto; display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 10px 0 12px;
  background: var(--bg-soft); border: 1px solid transparent; border-radius: 8px; color: var(--faint); font: 13.5px var(--sans); cursor: pointer; text-align: left; }
.tb-search:hover { border-color: var(--border); background: #fff; }
.tb-right { display: flex; align-items: center; gap: 8px; flex: none; }
.tb-icon { width: 34px; height: 34px; box-shadow: none; border-color: transparent; background: transparent; color: var(--muted); position: relative; }
.tb-icon:hover { background: var(--bg-soft); color: var(--text); }
.tb-dot { position: absolute; top: 7px; right: 8px; width: 7px; height: 7px; border-radius: 50%; background: var(--acc-2); box-shadow: 0 0 0 2px #fff; }
.tb-admin { height: 30px; color: var(--muted); }
.tb-user { background: none; border: none; padding: 3px; border-radius: 50%; cursor: pointer; display: flex; }
.tb-user:hover { box-shadow: 0 0 0 3px var(--bg-muted); }
.tb-user .avatar.sm { width: 30px; height: 30px; font-size: 13px; }
.topbar .menu { min-width: 220px; }
.topbar .menu .avatar.xs { width: 16px; height: 16px; }
@media (max-width: 820px) {
  .tb-inner { padding: 0 14px; gap: 10px; }
  .tb-navs, .tb-admin, .tb-search .grow, .tb-search .kbd { display: none; }
  .tb-search { flex: none; width: 36px; padding: 0; justify-content: center; margin-left: auto; }
}

/* 页面容器 */
.wrap { max-width: 1280px; padding: 28px 28px 64px; }
.footer { background: transparent; }
.footer-inner { max-width: 1280px; padding: 22px 28px; }

/* ---------- 仓库页头: 整条白底, 标签贴底 ---------- */
.repo-header { background: var(--card); border-bottom: 1px solid var(--border-soft); }
.repo-header-inner { max-width: 1280px; padding: 22px 28px 0; }
.repo-card-head { background: transparent; border: none; box-shadow: none; padding: 0; border-radius: 0; overflow: visible; }
.repo-ava { border-radius: 10px; }
.chip { background: var(--bg-soft); border-color: transparent; }
.tabs.repo-tabs { margin: 16px 0 0; padding: 0; border-top: none; }
.tabs.repo-tabs a { padding: 0 14px; }
.tabs.repo-tabs a:first-child { padding-left: 4px; }
.repo-header + .wrap { padding-top: 24px; }

/* 卡片统一 */
.box, .card, .file-box, .flow-card, .side-card, .stat, .lane-item, .repo-tile, .wb-stat { border-radius: var(--radius); }
.flow-card, .side-card { box-shadow: none; }
.lane { background: var(--bg-soft); border-radius: 10px; }
.box-head, .file-box-head, .comment-head, .diff-head, .latest-commit { background: var(--card-2); }
.box-row:hover, .issue-row:hover { background: #f8f9fb; }
.code-block, .md pre { background: #f5f6f8; }
.log-panel { background: #f7f8fa; }
.state-pill.open { background: var(--green); }
.repo-tile:hover { box-shadow: 0 6px 18px rgba(23,26,33,.07); }
.bento .tint { background: linear-gradient(160deg, #eef1fd 0%, #fff 60%); }
.bento .ink, .land-end { background: #171a21; }
.land-hero h1 .flowtext { background: linear-gradient(90deg, var(--acc), #7048e8); -webkit-background-clip: text; background-clip: text; }
.fb-bar i { background: linear-gradient(90deg, var(--acc), #7048e8); }
.journey::before { background: repeating-linear-gradient(90deg, var(--acc) 0 8px, transparent 8px 14px); }

/* ================= 管理后台: 独立外壳 ================= */
body.admin-mode .topbar, body.admin-mode .footer, body.admin-mode #announce { display: none; }
body.admin-mode { background: #f4f5f8; }
.adm-shell { display: flex; min-height: 100vh; }
.adm-side { width: 232px; flex: none; position: sticky; top: 0; height: 100vh; overflow-y: auto; background: #151821; color: #c4c8d2;
  display: flex; flex-direction: column; padding: 18px 12px 14px; z-index: 70; }
.adm-brand { display: flex; align-items: center; gap: 10px; padding: 2px 8px 22px; color: #fff; }
.adm-brand:hover { text-decoration: none; }
.adm-brand .brand-mark { width: 32px; height: 32px; }
.adm-brand b { display: block; font-size: 15px; line-height: 1.2; }
.adm-brand small { display: block; font-size: 11.5px; color: #8a90a0; }
.adm-group { margin-bottom: 18px; }
.adm-gt { font-size: 11px; font-weight: 600; color: #6c7283; letter-spacing: .8px; padding: 0 10px 6px; }
.adm-link { display: flex; align-items: center; gap: 10px; height: 36px; padding: 0 10px; border-radius: 7px; color: #c4c8d2; font-weight: 500; }
.adm-link .ic { color: #7d8496; }
.adm-link:hover { background: rgba(255,255,255,.06); color: #fff; text-decoration: none; }
.adm-link.active { background: var(--acc); color: #fff; }
.adm-link.active .ic { color: #fff; }
.adm-side-foot { margin-top: auto; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.08); }
.adm-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.adm-bar { height: 58px; display: flex; align-items: center; gap: 12px; padding: 0 28px; background: #fff; border-bottom: 1px solid var(--border-soft);
  position: sticky; top: 0; z-index: 60; }
.adm-crumb { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.adm-crumb .ic { color: var(--faint); }
.adm-menu { display: none; }
.adm-content { padding: 26px 28px 64px; max-width: 1320px; width: 100%; }
.adm-content > .page-head .page-title { font-size: 20px; }
.adm-content .box, .adm-content .stat { box-shadow: var(--shadow-sm); border-color: var(--border-soft); }
.adm-content .info-box { background: var(--acc-soft); }
@media (max-width: 900px) {
  .adm-side { position: fixed; left: 0; top: 0; transform: translateX(-100%); transition: transform .2s; }
  body.adm-open .adm-side { transform: none; }
  .adm-menu { display: inline-flex; }
  .adm-content { padding: 20px 16px 48px; }
}
.admin-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1000px) { .admin-stats { grid-template-columns: 1fr 1fr; } }
.astat .ico { border-radius: 10px; }
.t-acc2 { background: var(--acc-2-soft); color: var(--acc-2); }
.storage-type button.active { background: var(--acc-soft); }
.diff-head { top: 58px; }

/* ---- 个人设置 ---- */
.set-head { display: flex; align-items: center; gap: 14px; margin: 4px 0 22px; }
.settings-main { min-width: 0; }
.set-card { border: 1px solid var(--border); border-radius: var(--radius); background: #fff; margin-top: 20px; }
.set-card-head { padding: 14px 18px; border-bottom: 1px solid var(--border-soft); }
.set-card-head h3 { margin: 0; font-size: 15px; }
.set-card-head p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.set-card-body { padding: 16px 18px; }
.set-card.danger-zone { border-color: rgba(207,34,46,.35); }
.set-card.danger-zone .set-card-head h3 { color: var(--danger); }
.kv > span:nth-child(odd) { color: var(--muted); }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
@media (max-width: 720px) { .grid2 { grid-template-columns: 1fr; } }
.pin-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.pin-opt { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); cursor: pointer; min-width: 0; }
.pin-opt:hover { border-color: var(--acc); }
.pin-opt:has(input:checked) { border-color: var(--acc); background: var(--acc-soft); }
.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.warn-text { color: var(--warn); }
.mt4 { margin-top: 4px; }
input.switch { appearance: none; -webkit-appearance: none; width: 36px; height: 20px; border-radius: 20px; background: #cfd4dc; position: relative; cursor: pointer; flex: none; transition: background .15s; border: none; padding: 0; margin: 0; }
input.switch::after { content: ""; position: absolute; left: 2px; top: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: left .15s; }
input.switch:checked { background: var(--acc); }
input.switch:checked::after { left: 18px; }
.pw-meter { display: flex; gap: 4px; width: 160px; }
.pw-meter i { flex: 1; height: 4px; border-radius: 2px; background: var(--border); }
.pw-meter.s1 i:nth-child(-n+1) { background: var(--danger); }
.pw-meter.s2 i:nth-child(-n+2) { background: #e0a33a; }
.pw-meter.s3 i:nth-child(-n+3) { background: var(--acc); }
.pw-meter.s4 i { background: var(--green); }
.sess-ic { width: 38px; height: 38px; border-radius: 50%; background: var(--bg-soft); display: inline-flex; align-items: center; justify-content: center; color: var(--muted); flex: none; }
.sess-ic.cur { background: var(--acc-soft); color: var(--acc); }
/* 令牌 */
.scope-list { border: 1px solid var(--border); border-radius: var(--radius-sm); }
.scope-opt { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; cursor: pointer; }
.scope-opt + .scope-opt { border-top: 1px solid var(--border-soft); }
.scope-opt input { margin-top: 4px; }
.scope-opt code { font-size: 12px; background: var(--bg-soft); padding: 1px 6px; border-radius: 4px; }
.token-row.expired { background: #fff8f8; }
.token-row.expired b { text-decoration: line-through; color: var(--muted); }
.token-fresh { border: 1px solid rgba(59,91,219,.3); background: var(--acc-soft); border-radius: var(--radius); padding: 14px 16px; margin-bottom: 16px; }
.token-fresh > .flex { color: var(--acc); }
.token-val { display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 8px 10px; margin: 10px 0 12px; }
.token-val code { word-break: break-all; font-size: 13px; }
.token-fresh pre { white-space: pre-wrap; word-break: break-all; background: #fff; }
/* 个人主页 */
.profile-cols { grid-template-columns: 280px minmax(0, 1fr); }
.profile-status { margin-top: 10px; padding: 6px 10px; border: 1px solid var(--border); border-radius: 20px; font-size: 13px; background: #fff; display: inline-block; max-width: 100%; }
.follow-line { display: flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--muted); flex-wrap: wrap; }
.follow-line a { color: var(--muted); } .follow-line a:hover { color: var(--acc); text-decoration: none; } .follow-line b { color: var(--text); }
.pin-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 20px; }
@media (max-width: 760px) { .pin-grid { grid-template-columns: 1fr; } }
.pin-card { border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 16px; background: #fff; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.pin-card:hover { border-color: #c5cdf5; }
.pin-desc { margin: 0; flex: 1; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.heat .box-body { padding: 12px 16px; }
.hm-scroll { overflow-x: auto; }
.hm-wrap { display: flex; gap: 6px; width: max-content; }
.hm-days { display: grid; grid-template-rows: 16px repeat(7, 13px); }
.hm-days span { line-height: 11px; }
.hm-months { position: relative; height: 16px; font-size: 11px; color: var(--muted); }
.hm-months span { position: absolute; top: 0; }
.hm-grid { display: flex; gap: 2px; }
.hm-col { display: flex; flex-direction: column; gap: 2px; }
.hm-cell { display: inline-block; width: 11px; height: 11px; border-radius: 2px; background: #eceef2; }
.hm-cell.empty { background: transparent; }
.hm-cell.l1 { background: #c9d4f6; } .hm-cell.l2 { background: #8ea3ec; } .hm-cell.l3 { background: #5875e0; } .hm-cell.l4 { background: #2f49b5; }
.hm-legend { display: inline-flex; align-items: center; gap: 3px; font-weight: 400; }
.hm-kinds { display: flex; gap: 16px; padding: 8px 16px 12px; flex-wrap: wrap; }
.hm-kinds b { color: var(--text); }
.feed { border-left: 2px solid var(--border-soft); margin-left: 12px; padding-left: 0; }
.feed-item { display: flex; gap: 12px; align-items: flex-start; padding: 6px 0 12px; position: relative; }
.feed-ic { width: 26px; height: 26px; border-radius: 50%; background: #fff; border: 1px solid var(--border); display: inline-flex; align-items: center; justify-content: center; margin-left: -14px; color: var(--muted); flex: none; }
.feed-ic.k-push { color: var(--acc); } .feed-ic.k-release { color: var(--acc-2); } .feed-ic.k-pull { color: var(--purple); } .feed-ic.k-issue { color: var(--green); }