/* ---------- modal ---------- */
  .modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(14, 14, 16, 0.45);
    backdrop-filter: blur(6px);
    z-index: 60;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
  }
  .modal-card {
    background: #ffffff;
    border-radius: 18px;
    box-shadow: 0 30px 60px -20px rgba(14,14,16,0.4);
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .field-input, .field-textarea {
    width: 100%;
    background: #ffffff;
    border: 1px solid rgba(14,14,16,0.12);
    border-radius: 10px;
    padding: 9px 12px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13.5px;
    color: #0e0e10;
    outline: none;
    transition: border-color 120ms ease, box-shadow 120ms ease;
  }
  .field-input:focus, .field-textarea:focus {
    border-color: #0a87f7;
    box-shadow: 0 0 0 3px rgba(10,135,247,0.15);
  }
  .field-textarea {
    min-height: 90px;
    resize: vertical;
    line-height: 1.55;
  }
  /* ===== Auth: nav account cluster + login/register modal ===== */
  /* Ghost "登岛" button — shares the 发布岗位 nav CTA's ghost-pill styling so
     the two right-cluster actions read as a matched pair. */
  .nav-login {
    display: inline-flex;
    align-items: center;
    background: transparent;
    color: #0e0e10;
    border: 1px solid rgba(14,14,16,0.16);
    border-radius: 999px;
    padding: 8px 15px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    flex-shrink: 0;
    cursor: pointer;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
  }
  .nav-login:hover {
    background: rgba(10,135,247,0.08);
    border-color: rgba(10,135,247,0.45);
    color: #0969da;
  }
  .nav-login:disabled {
    opacity: 0.58;
    cursor: default;
    transform: none;
  }
  .nav-login:disabled:hover {
    background: transparent;
    border-color: rgba(14,14,16,0.16);
    color: #0e0e10;
  }
  /* Signed-in avatar chip. */
  .nav-account {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid rgba(14,14,16,0.12);
    background: #f3f0ff;
    color: #0969da;
    cursor: pointer;
    overflow: hidden;
    padding: 0;
    transition: box-shadow 150ms ease, transform 150ms ease;
  }
  .nav-account:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px -10px rgba(10,135,247,0.6);
  }
  .nav-account-img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .nav-account-initial { font-size: 14px; font-weight: 600; line-height: 1; }
  .account-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 210px;
    background: #ffffff;
    border: 1px solid rgba(14,14,16,0.1);
    border-radius: 14px;
    box-shadow: 0 18px 42px -18px rgba(14,14,16,0.35);
    padding: 12px;
    z-index: 70;
  }
  .account-menu-name {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: #0e0e10;
    padding: 2px 6px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .account-menu-email {
    font-size: 12.5px;
    color: #8a8a92;
    padding: 0 6px 10px;
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(14,14,16,0.06);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .account-menu-item {
    display: block;
    width: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    border-radius: 8px;
    padding: 9px 6px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13.5px;
    color: #38383d;
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease;
  }
  .account-menu-item:hover { background: rgba(10,135,247,0.08); color: #0969da; }
  .account-menu-sep { height: 1px; background: rgba(14,14,16,0.07); margin: 6px 0; }

  /* ---------- favorite (♡) buttons ---------- */
  /* Card heart — pinned top-left of the cover, mirroring the badges top-right. */
  /* Card heart — lives inline in the cover's top-right cluster (next to the
     badges), so it never overlaps the bottom-left logo. */
  .job-card-fav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    border: 0;
    background: rgba(255,255,255,0.88);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    color: #5a5a62;
    cursor: pointer;
    box-shadow: 0 2px 5px -1px rgba(14,14,16,0.12);
    transition: color 140ms ease, background 140ms ease, transform 140ms ease;
  }
  /* 带收藏数时从圆形图标变成自适应宽度的胶囊（♡ N）。 */
  .job-card-fav.has-count { width: auto; min-width: 26px; padding: 0 8px 0 7px; }
  .job-card-fav-count { font-size: 11.5px; font-weight: 600; line-height: 1; font-family: 'Geist', 'Noto Sans SC', sans-serif; }
  .job-card-fav:hover { color: #db2777; transform: translateY(-1px); background: #ffffff; }
  .job-card-fav.is-saved { color: #db2777; }

  /* Saved state — pink accent, the favourite's only divergence from the
     shared pill above. Its hover keeps the pink (slightly deeper) rather
     than falling back to the neutral highlight. */
  .sheet-fav-btn.is-saved { color: #db2777; border-color: rgba(219,39,119,0.4); background: rgba(219,39,119,0.06); }
  .sheet-fav-btn.is-saved:hover { color: #db2777; border-color: rgba(219,39,119,0.5); background: rgba(219,39,119,0.12); }
  .fav-track-arrow {
    position: absolute;
    right: 14px;
    bottom: 12px;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(14,14,16,0.1);
    border-radius: 999px;
    background: rgba(255,255,255,0.94);
    color: #0a87f7;
    box-shadow: 0 8px 22px -16px rgba(14,14,16,0.55);
    opacity: 0;
    transform: translateX(-4px);
    cursor: pointer;
    z-index: 2;
    transition: opacity 180ms ease, transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1), color 140ms ease, border-color 140ms ease, background 140ms ease;
  }
  .job-card:hover .fav-track-arrow,
  .fav-track-arrow:focus-visible {
    opacity: 1;
    transform: translateX(0);
  }
  .fav-track-arrow:hover {
    background: #ffffff;
    border-color: rgba(10,135,247,0.32);
  }
  .fav-track-arrow.is-added {
    color: #047857;
    border-color: rgba(16,185,129,0.28);
  }
  .fav-track-arrow::after {
    content: attr(data-tip);
    position: absolute;
    right: 0;
    bottom: calc(100% + 8px);
    max-width: 112px;
    padding: 5px 8px;
    border-radius: 7px;
    background: rgba(14,14,16,0.92);
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    opacity: 0;
    transform: translateY(3px);
    pointer-events: none;
    transition: opacity 140ms ease, transform 140ms ease;
  }
  .fav-track-arrow:hover::after,
  .fav-track-arrow:focus-visible::after {
    opacity: 1;
    transform: translateY(0);
  }

  /* ---------- account center modal ---------- */
  .account-modal-frame {
    position: relative;
    width: min(680px, calc(100vw - 32px));
    max-height: min(86vh, 760px);
    display: flex;
    flex-direction: column;
    background: #FAF9F6;
    border: 1px solid rgba(14,14,16,0.1);
    border-radius: 20px;
    box-shadow: 0 30px 80px -30px rgba(14,14,16,0.5);
    overflow: hidden;
  }
  /* 收藏 / 发布的 Tab 视图包裹层：撑满 frame 并保留内部滚动行为。 */
  .account-modal-inner { display: flex; flex-direction: column; min-height: 0; flex: 1; }
  .account-modal-bar {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 13px 12px 13px 22px; border-bottom: 1px solid rgba(14,14,16,0.08);
  }
  .account-modal-close {
    flex-shrink: 0; display: inline-flex; padding: 8px; border-radius: 10px; border: 0;
    background: transparent; color: #5a5a62; cursor: pointer;
    transition: background 140ms ease, color 140ms ease;
  }
  .account-modal-close:hover { background: rgba(14,14,16,0.06); color: #0e0e10; }
  .account-tabs { display: flex; gap: 4px; }
  .account-tab {
    position: relative; background: transparent; border: 0; cursor: pointer;
    padding: 10px 12px 12px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13.5px; font-weight: 500; color: #8a8a92;
    transition: color 140ms ease;
  }
  .account-tab:hover { color: #0e0e10; }
  .account-tab.is-active { color: #0e0e10; }
  .account-tab.is-active::after {
    content: ""; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2px;
    background: #0a87f7; border-radius: 2px;
  }
  .account-modal-scroll { padding: 16px 20px 22px; overflow-y: auto; }
  .account-empty { text-align: center; color: #8a8a92; font-size: 13.5px; padding: 32px 12px; line-height: 1.6; }
  /* 设置弹窗右栏的「加载中…/错误」态是面板里唯一的直接子元素，默认只有
     text-align 水平居中、贴顶显示——这里让它在整个空白面板内水平+垂直居中。 */
  .settings-content > .account-empty {
    display: flex; align-items: center; justify-content: center;
    min-height: 100%;
  }
  .account-empty-stack {
    flex-direction: column;
    gap: 12px;
  }
  .account-link { background: transparent; border: 0; color: #0a87f7; cursor: pointer; font-size: 13.5px; font-weight: 500; padding: 0 2px; }
  .account-link:hover { color: #0969da; text-decoration: underline; }
  .account-list { display: flex; flex-direction: column; gap: 10px; }
  .account-card { border: 1px solid rgba(14,14,16,0.1); border-radius: 14px; background: #ffffff; }
  .account-row {
    display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px;
    border: 1px solid rgba(14,14,16,0.1); border-radius: 14px; background: #ffffff;
  }
  .account-card > .account-row { border: 0; }
  .account-row.is-clickable { cursor: pointer; transition: border-color 140ms ease, box-shadow 140ms ease; }
  .account-row.is-clickable:hover { border-color: rgba(10,135,247,0.4); box-shadow: 0 8px 20px -14px rgba(14,14,16,0.4); }
  .account-row-main { min-width: 0; flex: 1; }
  .account-row-org { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; color: #8a8a92; margin-bottom: 2px; }
  .account-row-role {
    font-family: 'Geist', 'Noto Sans SC', sans-serif; font-size: 15px; font-weight: 600; color: #0e0e10;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .account-row-meta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 4px; font-size: 12.5px; color: #8a8a92; }
  .account-row-actions { display: flex; gap: 6px; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }
  .account-row-btn {
    background: #ffffff; border: 1px solid rgba(14,14,16,0.16); border-radius: 999px; padding: 6px 13px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif; font-size: 12.5px; font-weight: 500; color: #38383d;
    cursor: pointer; white-space: nowrap;
    transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
  }
  .account-row-btn:hover { border-color: rgba(10,135,247,0.45); color: #0969da; background: rgba(10,135,247,0.06); }
  .account-row-btn.is-primary { background: #0e0e10; border-color: #0e0e10; color: #fff; }
  .account-row-btn.is-primary:hover { background: #1a1a1d; color: #fff; }
  .account-row-btn.is-danger:hover { border-color: rgba(219,39,119,0.45); color: #db2777; background: rgba(219,39,119,0.06); }
  .account-status { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
  .account-status.st-approved { background: rgba(16,185,129,0.12); color: #047857; }
  .account-status.st-pending  { background: rgba(245,158,11,0.14); color: #b45309; }
  .account-status.st-rejected { background: rgba(14,14,16,0.08); color: #6b7280; }
  .account-edit { padding: 14px 16px 16px; border-top: 1px solid rgba(14,14,16,0.08); }
  .account-edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px; }
  .account-field { display: block; margin-bottom: 10px; }
  .account-field-label { display: block; font-size: 12px; color: #5a5a62; margin-bottom: 4px; font-weight: 500; }
  .account-edit-actions, .account-settings-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 6px; }
  .account-settings { max-width: 460px; }
  /* Each view's content sits on its own white card over the FAF9F6 frame. */
  .account-panel { background: #ffffff; border: 1px solid rgba(14,14,16,0.1); border-radius: 16px; padding: 22px 20px; }
  .account-profile { max-width: 420px; margin: 0 auto; text-align: center; }
  .account-profile-avatar {
    width: 72px; height: 72px; border-radius: 999px; margin: 4px auto 12px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #f3f0ff; color: #0969da; overflow: hidden; border: 1px solid rgba(14,14,16,0.08);
  }
  .account-profile-avatar .nav-account-initial { font-size: 28px; font-weight: 600; }
  .account-profile-name { font-family: 'Geist', 'Noto Sans SC', sans-serif; font-size: 18px; font-weight: 600; color: #0e0e10; }
  .account-profile-email { font-size: 13px; color: #8a8a92; margin-top: 3px; }
  .account-profile-divider { height: 1px; background: rgba(14,14,16,0.08); margin: 18px 0; }
  .account-profile .account-field { text-align: left; }
  .account-soon {
    font-size: 12.5px; color: #8a8a92; background: rgba(14,14,16,0.03);
    border: 1px dashed rgba(14,14,16,0.14); border-radius: 10px; padding: 10px 12px; line-height: 1.5;
  }
  /* ---------- 我的设置：左上角标题 + 左侧栏布局 ---------- */
  .account-modal-frame.is-settings { width: min(760px, calc(100vw - 32px)); }
  .settings-modal { display: flex; flex-direction: column; min-height: 0; flex: 1; }
  .settings-bar {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 13px 12px 13px 22px; border-bottom: 1px solid rgba(14,14,16,0.08); flex-shrink: 0;
  }
  .settings-title {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 16px; font-weight: 600; color: #0e0e10;
  }
  .settings-body { display: flex; min-height: 0; flex: 1; }
  .settings-nav {
    flex: 0 0 168px; display: flex; flex-direction: column; gap: 2px;
    padding: 16px 12px; border-right: 1px solid rgba(14,14,16,0.08);
  }
  .settings-nav-item {
    text-align: left; background: transparent; border: 0; cursor: pointer;
    padding: 9px 12px; border-radius: 10px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13.5px; font-weight: 500; color: #5a5a62;
    transition: background 140ms ease, color 140ms ease;
  }
  .settings-nav-item:hover { background: rgba(14,14,16,0.04); color: #0e0e10; }
  .settings-nav-item.is-active { background: rgba(10,135,247,0.1); color: #0969da; }
  .settings-content { flex: 1; min-width: 0; padding: 22px 24px; overflow-y: auto; }
  .settings-section-head { margin-bottom: 18px; }
  .settings-section-title {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 15px; font-weight: 600; color: #0e0e10;
  }
  .settings-section-sub { font-size: 12.5px; color: #8a8a92; margin-top: 3px; }
  .settings-field { margin-bottom: 18px; }
  .settings-field-label { font-size: 12px; color: #5a5a62; font-weight: 500; margin-bottom: 6px; }
  .settings-field-hint { font-size: 12px; color: #8a8a92; line-height: 1.5; }
  .settings-field-error { font-size: 12px; color: #db2777; line-height: 1.5; margin-top: 4px; }
  .settings-shortlink-actions { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; }
  .settings-shortlink-actions .account-link { align-self: flex-start; padding: 0; font-weight: 600; }
  .settings-shortlink-input {
    display: flex; align-items: center;
    border: 1px solid rgba(14,14,16,0.12); border-radius: 10px;
    background: #ffffff; overflow: hidden;
    transition: border-color 120ms ease, box-shadow 120ms ease;
  }
  .settings-shortlink-input:focus-within {
    border-color: #0a87f7;
    box-shadow: 0 0 0 3px rgba(10,135,247,0.15);
  }
  .settings-shortlink-prefix {
    flex: 0 0 auto; padding: 0 0 0 12px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13.5px; color: #8a8a92; white-space: nowrap;
  }
  .settings-shortlink-input .field-input {
    border: 0; border-radius: 0; box-shadow: none; padding-left: 2px;
  }
  .settings-shortlink-input .field-input:focus { box-shadow: none; }
  .settings-avatar-row { display: flex; align-items: center; gap: 14px; }
  .settings-avatar {
    position: relative; flex: 0 0 auto; width: 72px; height: 72px; border-radius: 999px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #f3f0ff; color: #0969da; overflow: hidden; cursor: pointer;
    border: 1px solid rgba(14,14,16,0.08);
  }
  .settings-avatar input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; font-size: 0; }
  .settings-avatar .nav-account-initial { font-size: 28px; font-weight: 600; }
  .settings-avatar-overlay {
    position: absolute; left: 0; right: 0; bottom: 0; height: 24px;
    display: flex; align-items: center; justify-content: center;
    background: rgba(14,14,16,0.55); color: #fff; font-size: 11px; font-weight: 500;
    opacity: 0; transition: opacity 140ms ease; pointer-events: none;
  }
  .settings-avatar:hover .settings-avatar-overlay { opacity: 1; }
  .settings-avatar-busy { position: absolute; inset: 0; background: rgba(255,255,255,0.6); border-radius: 999px; }
  .settings-avatar-busy::after {
    content: ""; position: absolute; top: 50%; left: 50%; width: 20px; height: 20px;
    margin: -10px 0 0 -10px; border-radius: 999px;
    border: 2px solid rgba(10,135,247,0.3); border-top-color: #0a87f7;
    animation: publish-logo-spin 0.7s linear infinite;
  }
  .settings-avatar-side { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; min-width: 0; }
  .settings-readonly {
    font-size: 14px; color: #0e0e10; padding: 10px 12px;
    background: rgba(14,14,16,0.03); border: 1px solid rgba(14,14,16,0.08); border-radius: 10px;
    word-break: break-all;
  }
  .settings-id-row { display: flex; align-items: center; gap: 8px; }
  .settings-id {
    flex: 1; min-width: 0; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 12.5px; color: #5a5a62; padding: 9px 12px;
    background: rgba(14,14,16,0.03); border: 1px solid rgba(14,14,16,0.08); border-radius: 10px;
    word-break: break-all; line-height: 1.4;
  }
  html.dark .settings-id { color: #c4c4cd; background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.1); }
  .settings-danger {
    margin-top: 26px; padding: 16px; border-radius: 14px;
    border: 1px solid rgba(219,39,119,0.28); background: rgba(219,39,119,0.04);
  }
  .settings-danger-title { font-size: 14px; font-weight: 600; color: #be185d; }
  .settings-danger-desc { font-size: 12.5px; color: #8a8a92; line-height: 1.6; margin: 6px 0 12px; }
  .settings-danger-btn {
    background: #fff; border: 1px solid rgba(219,39,119,0.5); border-radius: 999px;
    padding: 8px 16px; font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13px; font-weight: 600; color: #db2777; cursor: pointer;
    transition: background 140ms ease, color 140ms ease, border-color 140ms ease;
  }
  .settings-danger-btn:hover { background: #db2777; color: #fff; border-color: #db2777; }
  .settings-danger-btn:disabled { opacity: 0.55; cursor: not-allowed; }
  /* 社媒链接：一行一个平台 —— logo + 名称 + 输入框 */
  .settings-social-sync { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 4px 0 18px; }
  .settings-social-sync-btn {
    display: inline-flex; align-items: center; gap: 6px;
    background: #fff; color: #1a1a1f; border: 1px solid rgba(14,14,16,0.18);
    border-radius: 999px; padding: 9px 18px; font-size: 14px; font-weight: 500;
    cursor: pointer; transition: border-color 140ms ease, background 140ms ease;
  }
  .settings-social-sync-btn:hover:not(:disabled) { border-color: #0e0e10; background: #f6f6f8; }
  .settings-social-sync-btn:disabled { opacity: .45; cursor: not-allowed; }
  .settings-social-group { margin-bottom: 20px; }
  .settings-social-group:last-of-type { margin-bottom: 18px; }
  .settings-social-group-title {
    font-size: 11px; font-weight: 600; letter-spacing: .04em; color: #9a9aa3;
    margin: 0 0 10px; padding-bottom: 6px; border-bottom: 1px solid #ececef;
  }
  .settings-social-list { display: flex; flex-direction: column; gap: 10px; }
  .settings-social-row { display: flex; align-items: center; gap: 10px; }
  .settings-social-icon {
    flex: 0 0 20px; width: 20px; height: 20px; color: #0e0e10;
    display: inline-flex; align-items: center; justify-content: center;
  }
  .settings-social-icon svg { width: 18px; height: 18px; display: block; }
  .settings-social-icon img { width: 18px; height: 18px; display: block; border-radius: 4px; object-fit: cover; }
  .settings-social-badge {
    width: 18px; height: 18px; border-radius: 4px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 600; line-height: 1;
    font-family: 'Noto Sans SC', sans-serif;
  }
  .settings-social-name { flex: 0 0 104px; font-size: 13px; font-weight: 500; color: #5a5a62; }
  .settings-social-row .field-input { flex: 1; min-width: 0; }
  html.dark .settings-social-icon { color: #f5f5f7; }
  html.dark .settings-social-name { color: #c4c4cd; }
  html.dark .settings-social-group-title { color: #8a8a93; border-bottom-color: #2e2e34; }
  /* 多链接平台（github / huggingface / 公众号）：每条一行，回车新增下一条 */
  .settings-social-multi { display: flex; flex-direction: column; gap: 8px; }
  /* 输入框 + 内嵌「×」：×绝对定位在框内右侧，输入框宽度恒定不受 × 有无影响 */
  .settings-social-input-wrap { position: relative; flex: 1 1 auto; min-width: 0; display: block; }
  .settings-social-input-wrap .field-input { width: 100%; box-sizing: border-box; }
  .settings-social-input-wrap .field-input.has-inset-action { padding-right: 30px; }
  /* 删除「×」：嵌在框内的幽灵按钮——默认隐形，hover 该行才浮现，hover 到自身变红 */
  .settings-social-remove {
    position: absolute; top: 50%; right: 5px; transform: translateY(-50%);
    width: 22px; height: 22px; padding: 0; cursor: pointer;
    border: 0; background: none; color: #c2c2c8; border-radius: 5px;
    display: inline-flex; align-items: center; justify-content: center;
    transition: opacity .15s ease, color .15s ease, background .15s ease;
  }
  .settings-social-remove:hover { color: #e5484d; background: rgba(229,72,77,.09); }
  html.dark .settings-social-remove { color: #5f5f68; }
  html.dark .settings-social-remove:hover { color: #ff6166; background: rgba(255,97,102,.12); }
  @media (hover: hover) {
    .settings-social-remove { opacity: 0; }
    .settings-social-row:hover .settings-social-remove,
    .settings-social-remove:focus-visible { opacity: 1; }
  }
  .settings-social-hint { padding-left: 144px; margin-top: 2px; font-size: 11px; color: #b0b0b6; }
  html.dark .settings-social-hint { color: #6f6f78; }
  @media (max-width: 600px) {
    .settings-social-row { flex-wrap: wrap; }
    .settings-social-name { flex: 1; }
    .settings-social-row .field-input { flex: 1 1 100%; }
    /* 多链接行：保持单行（输入框可压缩，× 不换行），名称列收窄 */
    .settings-social-multi .settings-social-row { flex-wrap: nowrap; }
    .settings-social-multi .settings-social-name { flex: 0 0 64px; }
    .settings-social-multi .settings-social-row .field-input { flex: 1 1 auto; min-width: 0; }
    .settings-social-hint { padding-left: 0; }
  }
  html.dark .settings-bar { border-bottom-color: rgba(255,255,255,0.1); }
  html.dark .settings-title, html.dark .settings-section-title { color: #f5f5f7; }
  html.dark .settings-nav { border-right-color: rgba(255,255,255,0.1); }
  html.dark .settings-nav-item:hover { background: rgba(255,255,255,0.06); color: #f5f5f7; }
  html.dark .settings-nav-item.is-active { background: rgba(10,135,247,0.22); color: #93c5fd; }
  html.dark .settings-readonly { color: #f5f5f7; background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.1); }
  html.dark .settings-field-error { color: #f472b6; }
  html.dark .settings-shortlink-input { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.12); }
  html.dark .settings-shortlink-prefix { color: #8a8a93; }
  html.dark .settings-avatar-busy { background: rgba(25,36,56,0.6); }
  /* ---------- 我的设置：API keys ---------- */
  .settings-keys-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
  .settings-keys-list { display: flex; flex-direction: column; gap: 10px; }
  .settings-key-row {
    display: flex; align-items: center; gap: 12px;
    padding: 12px 14px; border-radius: 12px;
    border: 1px solid rgba(14,14,16,0.1); background: rgba(14,14,16,0.015);
    transition: border-color 200ms ease, background 200ms ease;
  }
  .settings-key-row.is-new { border-color: rgba(10,135,247,0.5); background: rgba(10,135,247,0.06); }
  .settings-key-main { flex: 1; min-width: 0; }
  .settings-key-code {
    display: block; font-family: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 13px; color: #0e0e10; word-break: break-all; line-height: 1.5;
  }
  .settings-key-meta { display: flex; align-items: center; gap: 8px; margin-top: 4px; font-size: 12px; color: #8a8a92; }
  .settings-key-new-tag { color: #0969da; font-weight: 600; }
  .settings-key-actions { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
  html.dark .settings-key-row { border-color: rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); }
  html.dark .settings-key-row.is-new { border-color: rgba(10,135,247,0.55); background: rgba(10,135,247,0.16); }
  html.dark .settings-key-code { color: #f5f5f7; }
  html.dark .settings-key-new-tag { color: #93c5fd; }
  /* 配置 agent 环境：单行可横滑的启动命令 + runtime 状态灯 */
  .settings-cmd-row { display: flex; align-items: center; gap: 10px; }
  .settings-cmd-code {
    flex: 1; min-width: 0;
    font-family: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 13px; color: #0e0e10; line-height: 1.5;
    white-space: nowrap; overflow-x: auto;          /* 单行、可横向滑动 */
    word-spacing: 0.45em;                            /* 拉宽词间距，避免 --flag 看着像没空格 */
    padding: 10px 12px; border-radius: 10px;
    border: 1px solid rgba(14,14,16,0.1); background: rgba(14,14,16,0.02);
  }
  .settings-cmd-copy { flex: 0 0 auto; }
  .settings-runtime-grid { display: flex; flex-wrap: wrap; gap: 10px; }
  .settings-runtime-stat {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 14px; border-radius: 10px; font-size: 13px; color: #9a9aa2;  /* 灰：未检测到 */
    border: 1px solid rgba(14,14,16,0.1); background: rgba(14,14,16,0.02);
    transition: color 200ms ease, border-color 200ms ease, background 200ms ease;
  }
  .settings-runtime-led {
    width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; background: #c4c4cc;  /* 灰点 */
    transition: background 200ms ease, box-shadow 200ms ease;
  }
  .settings-runtime-stat.is-on { color: #0e0e10; border-color: rgba(34,197,94,0.4); background: rgba(34,197,94,0.06); }
  .settings-runtime-stat.is-on .settings-runtime-led { background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,0.18); }
  /* 当前固定选用的 runtime（蓝，覆盖 is-on 的绿）。 */
  .settings-runtime-stat.is-selected { color: #0e0e10; border-color: #2563eb; background: rgba(37,99,235,0.08); }
  .settings-runtime-stat.is-selected .settings-runtime-led { background: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,0.18); }
  html.dark .settings-cmd-code { color: #f5f5f7; border-color: rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); }
  html.dark .settings-runtime-stat { border-color: rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); color: #8a8a92; }
  html.dark .settings-runtime-stat.is-on { color: #f5f5f7; border-color: rgba(34,197,94,0.45); background: rgba(34,197,94,0.14); }
  /* 本地 daemon 版本：落后高亮提示更新（琥珀），已最新低调展示（绿） */
  .settings-daemon-ver { font-size: 13px; line-height: 1.5; border-radius: 10px; padding: 10px 12px; }
  .settings-daemon-ver.is-latest {
    display: inline-flex; align-items: center; gap: 8px; color: #0e0e10;
    border: 1px solid rgba(34,197,94,0.4); background: rgba(34,197,94,0.06);
  }
  .settings-daemon-ver.is-latest .ver-led { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,0.18); }
  .settings-daemon-ver.is-outdated { color: #0e0e10; border: 1px solid rgba(245,158,11,0.45); background: rgba(245,158,11,0.08); }
  .settings-daemon-ver.is-outdated .ver-head { display: flex; align-items: center; gap: 8px; font-weight: 600; }
  .settings-daemon-ver .ver-badge { font-size: 11px; font-weight: 700; color: #b45309; background: rgba(245,158,11,0.18); padding: 2px 8px; border-radius: 999px; }
  .settings-daemon-ver .ver-note { margin-top: 6px; font-size: 12px; font-weight: 400; color: #6b6b73; }
  html.dark .settings-daemon-ver.is-latest { color: #f5f5f7; border-color: rgba(34,197,94,0.45); background: rgba(34,197,94,0.14); }
  html.dark .settings-daemon-ver.is-outdated { color: #f5f5f7; border-color: rgba(245,158,11,0.5); background: rgba(245,158,11,0.16); }
  html.dark .settings-daemon-ver .ver-badge { color: #fcd34d; background: rgba(245,158,11,0.25); }
  html.dark .settings-daemon-ver .ver-note { color: #b8b8c0; }
  @media (max-width: 560px) {
    .modal-backdrop { padding: 14px; }
    .account-modal-frame.is-settings {
      width: calc(100vw - 28px);
      max-height: min(84svh, 720px);
      border-radius: 18px;
    }
    .settings-bar { padding: 14px 12px 13px 18px; }
    .settings-title { font-size: 18px; }
    .settings-key-row { flex-direction: column; align-items: stretch; }
    .settings-key-actions { justify-content: flex-end; }
    .settings-body { flex-direction: column; }
    .settings-nav {
      flex: 0 0 auto; flex-direction: row; gap: 6px; overflow-x: auto;
      padding: 10px 12px;
      border-right: 0; border-bottom: 1px solid rgba(14,14,16,0.08);
      scrollbar-width: none;
      -webkit-overflow-scrolling: touch;
    }
    .settings-nav::-webkit-scrollbar { display: none; }
    .settings-nav-item {
      flex: 0 0 auto;
      white-space: nowrap;
      padding: 9px 12px;
      border-radius: 999px;
      line-height: 1;
    }
    .settings-content { padding: 18px 16px; min-height: 300px; }
    .settings-section-head { margin-bottom: 16px; }
    .settings-section-title { font-size: 16px; }
    .settings-section-sub { margin-top: 5px; line-height: 1.55; }
    .settings-avatar-row { align-items: flex-start; }
    .settings-id-row { align-items: stretch; }
    .settings-id-row .account-row-btn { flex: 0 0 auto; }
    .account-edit-grid { grid-template-columns: 1fr; }
    .account-row { flex-direction: column; }
    .account-row-actions { justify-content: flex-start; }
    .tracker-board { grid-auto-columns: minmax(248px, 78vw); }
    .tracker-modal {
      width: calc(100vw - 28px);
      max-height: min(86svh, 720px);
    }
    .tracker-form-grid { grid-template-columns: 1fr; }
  }
  /* dark mode */
  html.dark .account-modal-frame { background: #121a2c; border-color: rgba(255,255,255,0.1); }
  html.dark .account-modal-bar { border-bottom-color: rgba(255,255,255,0.1); }
  html.dark .account-panel { background: #192438; border-color: rgba(255,255,255,0.1); }
  html.dark .account-profile-name { color: #f5f5f7; }
  html.dark .account-profile-divider { background: rgba(255,255,255,0.1); }
  html.dark .account-modal-name { color: #f5f5f7; }
  html.dark .account-tabs { border-bottom-color: rgba(255,255,255,0.1); }
  html.dark .account-tab.is-active { color: #fff; }
  html.dark .account-row, html.dark .account-card { background: #192438; border-color: rgba(255,255,255,0.1); }
  html.dark .account-row-role { color: #f5f5f7; }
  html.dark .account-edit { border-top-color: rgba(255,255,255,0.1); }
  html.dark .account-row-btn { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.16); color: #c4c4cd; }
  html.dark .account-row-btn.is-primary { background: #fff; color: #0e0e10; border-color: #fff; }
  html.dark .account-soon { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.16); }
  html.dark .account-modal-close:hover { background: rgba(255,255,255,0.08); color: #fff; }
  html.dark .job-card-fav { background: rgba(16,25,44,0.72); color: #c4c4cd; }
  html.dark .job-card-views { color: rgba(255,255,255,0.5); }

  /* The auth modal can be triggered from inside other modals (e.g. tapping
     收藏 in the job sheet). All .modal-backdrop share z-index 60, so the
     later-in-DOM sheet would otherwise paint on top of it. Lift the auth
     backdrop above every other layer (incl. the sheet's export popover at
     z-index 100) so the login window is always frontmost. */
  .auth-backdrop { z-index: 120; }
  .auth-modal-card {
    position: relative;
    width: min(420px, calc(100vw - 32px));
  }
  .auth-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    display: inline-flex;
    padding: 6px;
    border-radius: 8px;
    border: 0;
    background: transparent;
    color: #5a5a62;
    cursor: pointer;
    z-index: 1;
    transition: background 120ms ease, color 120ms ease;
  }
  .auth-modal-close:hover { background: rgba(14,14,16,0.06); color: #0e0e10; }
  .auth-modal-body { padding: 34px 30px 28px; overflow-y: auto; }
  .auth-brand {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: #0a87f7;
    letter-spacing: 0.2px;
  }
  .auth-title {
    margin: 14px 0 4px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 23px;
    font-weight: 700;
    color: #0e0e10;
    line-height: 1.2;
  }
  .auth-subtitle {
    margin: 0 0 22px;
    font-size: 13.5px;
    color: #8a8a92;
    line-height: 1.6;
  }
  .auth-google-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    background: #ffffff;
    border: 1px solid rgba(14,14,16,0.16);
    border-radius: 10px;
    padding: 11px 16px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #0e0e10;
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
  }
  .auth-google-btn:hover:not(:disabled) {
    background: #faf9fc;
    border-color: rgba(14,14,16,0.28);
    box-shadow: 0 6px 16px -10px rgba(14,14,16,0.4);
  }
  .auth-google-btn:disabled { opacity: 0.55; cursor: not-allowed; }
  .auth-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 18px 0;
    color: #a0a0a8;
    font-size: 12px;
  }
  .auth-divider::before,
  .auth-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: rgba(14,14,16,0.1);
  }
  .auth-form { display: flex; flex-direction: column; gap: 14px; }
  .auth-field { display: flex; flex-direction: column; gap: 6px; }
  .auth-field-label {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 12.5px;
    font-weight: 500;
    color: #5a5a62;
  }
  .auth-error {
    font-size: 12.5px;
    line-height: 1.5;
    color: #d92d20;
    background: rgba(217,45,32,0.07);
    border-radius: 8px;
    padding: 8px 10px;
  }
  .auth-notice {
    font-size: 12.5px;
    line-height: 1.5;
    color: #027a48;
    background: rgba(2,122,72,0.08);
    border-radius: 8px;
    padding: 8px 10px;
  }
  .auth-submit {
    width: 100%;
    background: #0a87f7;
    color: #ffffff;
    border: 0;
    border-radius: 10px;
    padding: 12px 16px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 14.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background 140ms ease, transform 140ms ease;
  }
  .auth-submit:hover:not(:disabled) { background: #0969da; transform: translateY(-1px); }
  .auth-submit:disabled { opacity: 0.6; cursor: not-allowed; }
  .auth-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
    font-size: 13px;
    color: #8a8a92;
  }
  .auth-link {
    background: transparent;
    border: 0;
    padding: 0;
    font-size: 13px;
    font-weight: 500;
    color: #0a87f7;
    cursor: pointer;
  }
  .auth-link:hover { color: #0969da; text-decoration: underline; }
  .auth-link:disabled { opacity: 0.5; cursor: not-allowed; }

  /* Dark-mode overrides — .modal-card / .field-input already flip via the
     shared dark rules below; these cover the auth-specific surfaces. */
  html.dark .nav-login {
    color: #ececf1;
    border-color: rgba(255,255,255,0.18);
  }
  html.dark .nav-login:hover {
    background: rgba(10,135,247,0.18);
    border-color: rgba(96,165,250,0.5);
    color: #93c5fd;
  }
  html.dark .nav-login:disabled:hover {
    background: transparent;
    border-color: rgba(255,255,255,0.18);
    color: #ececf1;
  }
  html.dark .nav-account {
    background: #233148;
    color: #93c5fd;
    border-color: rgba(255,255,255,0.1);
  }
  html.dark .nav-agent { color: #d4d4dc; }
  html.dark .nav-agent:hover { color: #ececf1; }
  html.dark .nav-agent svg { color: #ececf1; }
  html.dark .account-menu {
    background: #151e32;
    border-color: rgba(255,255,255,0.1);
  }
  html.dark .account-menu-name { color: #ececf1; }
  html.dark .account-menu-email { color: #9a9aa2; border-color: rgba(255,255,255,0.08); }
  html.dark .account-menu-item { color: #d4d4dc; }
  html.dark .account-menu-item:hover { background: rgba(10,135,247,0.2); color: #93c5fd; }
  html.dark .auth-title { color: #ececf1; }
  html.dark .auth-subtitle { color: #9a9aa2; }
  html.dark .auth-google-btn {
    background: #1d2940;
    color: #ececf1;
    border-color: rgba(255,255,255,0.14);
  }
  html.dark .auth-google-btn:hover:not(:disabled) { background: #233148; }
  html.dark .auth-divider::before,
  html.dark .auth-divider::after { background: rgba(255,255,255,0.1); }
  html.dark .auth-field-label { color: #9a9aa2; }
  html.dark .auth-modal-close { color: #9a9aa2; }
  html.dark .auth-modal-close:hover { background: rgba(255,255,255,0.08); color: #ececf1; }
  .chip-toggle {
    display: inline-flex;
    align-items: center;
    padding: 5px 11px;
    border-radius: 999px;
    border: 1px solid rgba(14,14,16,0.14);
    background: #ffffff;
    color: #38383d;
    font-family: 'Geist', sans-serif;
    font-size: 12px;
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
  }
  .chip-toggle:hover { border-color: #0e0e10; color: #0e0e10; }
  .chip-toggle.is-on { background: #0e0e10; color: #ffffff; border-color: #0e0e10; }
  .chip-toggle:disabled { opacity: 0.4; cursor: not-allowed; }

  /* ---------- agent skill modal ----------
     Surfaces the public /skill.md URL plus copy-to-clipboard install
     commands for Claude Code / Codex / Kimi. Visually matches the
     detail-modal language: pale section labels, mono code blocks
     against the same #f3f3f1 chip background used elsewhere in the
     detail/sheet modals, copy buttons that mirror .btn-ghost shape. */
  .skill-modal-card { background: #ffffff; }
  .skill-row {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .skill-row-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'Geist', sans-serif;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #0969da;
  }
  .skill-row-body {
    display: flex;
    align-items: stretch;
    gap: 8px;
  }
  .skill-prompt-body {
    display: block;
    position: relative;
  }
  .skill-prompt {
    width: 100%;
    min-width: 0;
    background: #f3f3f1;
    color: #2a2a2f;
    border-radius: 10px;
    padding: 12px 44px 12px 13px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13px;
    line-height: 1.62;
    white-space: pre-line;
    /* Long unbreakable tokens (the skill repo URL) wrap mid-token inside
       the rounded block on narrow screens instead of spilling past it.
       Wrapping beats overflow-x scrolling here: mobile hides scrollbars,
       so clipped-at-the-edge text just reads as broken. */
    overflow-wrap: anywhere;
    word-break: break-word; /* legacy WebKit fallback */
  }
  .skill-code {
    flex: 1 1 0;
    min-width: 0;
    display: block;
    height: 44px;
    background: #f3f3f1;
    color: #0e0e10;
    border-radius: 10px;
    /* right padding clears the absolutely-positioned .skill-copy-btn */
    padding: 11px 44px 11px 13px;
    font-family: 'Geist Mono', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 12.5px;
    line-height: 20px;
    white-space: nowrap;
    word-break: normal;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(14,14,16,0.22) transparent;
    -webkit-overflow-scrolling: touch;
  }
  .skill-code::-webkit-scrollbar { height: 6px; }
  .skill-code::-webkit-scrollbar-track { background: transparent; }
  .skill-code::-webkit-scrollbar-thumb {
    background: rgba(14,14,16,0.18);
    border-radius: 999px;
  }
  .skill-code-url {
    font-size: 13px;
    color: #5b21b6;
  }
  .skill-copy-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 30px;
    height: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.72);
    color: #5a5a62;
    border: 1px solid rgba(14, 14, 16, 0.08);
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease, border-color 120ms ease, transform 120ms ease;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
  }
  .skill-copy-btn:hover {
    background: #ffffff;
    color: #0e0e10;
    border-color: rgba(14, 14, 16, 0.18);
  }
  .skill-copy-btn:active { transform: scale(0.94); }
  .skill-copy-btn.is-copied {
    color: #15803d;
    background: rgba(220, 252, 231, 0.85);
    border-color: rgba(22, 163, 74, 0.35);
  }
  .skill-copy-btn.is-failed {
    color: #b91c1c;
    background: rgba(254, 226, 226, 0.85);
    border-color: rgba(220, 38, 38, 0.35);
  }
  /* "获取测试 API key" — an inline link inside the hint, click to copy. */
  .skill-testkey-link {
    font-weight: 600;
    color: #0969da;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 120ms ease;
  }
  .skill-testkey-link:hover { color: #0a5fc0; }
  .skill-testkey-link.is-copied { color: #15803d; }
  .skill-testkey-link.is-failed { color: #b91c1c; }
  .skill-row-hint {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 12.5px;
    line-height: 1.6;
    color: #6a6a72;
  }
  .skill-row-hint code {
    background: rgba(14,14,16,0.06);
    padding: 1px 6px;
    border-radius: 5px;
    font-family: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11.5px;
    color: #38383d;
  }
  .skill-key-note {
    margin-top: 8px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 12px;
    line-height: 1.6;
    color: #8a8a92;
  }
  .skill-key-note code {
    background: rgba(14,14,16,0.06);
    padding: 1px 5px;
    border-radius: 5px;
    font-family: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11px;
    color: #38383d;
  }
  .skill-footer-note {
    margin-top: 2px;
    padding-top: 14px;
    border-top: 1px dashed rgba(14,14,16,0.08);
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 12.5px;
    line-height: 1.6;
    color: #6a6a72;
  }
  .skill-footer-link {
    color: #0a87f7;
    word-break: break-all;
  }
  .skill-footer-link:hover { text-decoration: underline; }
  /* Skeleton state for the brief window between modal open and the
     /api/agent-config response landing. Three placeholder bars
     pulsing in the same #f3f3f1 hue we use for the real .skill-code
     blocks — so the transition into the loaded state doesn't shift
     layout. */
  .skill-skeleton { display: flex; flex-direction: column; gap: 14px; }
  .skill-skeleton-row {
    height: 44px;
    border-radius: 10px;
    background: #f3f3f1;
    position: relative;
    overflow: hidden;
  }
  .skill-skeleton-row::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0.55) 50%,
      rgba(255,255,255,0) 100%);
    transform: translateX(-100%);
    animation: skill-shimmer 1.1s ease-in-out infinite;
  }
  @keyframes skill-shimmer { to { transform: translateX(100%); } }

  /* ---------- detail modal sections ---------- */
  .detail-section-label {
    font-family: 'Geist', sans-serif;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #0969da;
    margin-bottom: 6px;
  }
  .detail-section-body {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 14px;
    line-height: 1.65;
    color: #2a2a2f;
    white-space: pre-wrap;
  }

  /* ---------- empty + toast ---------- */
  .empty-state {
    background: #ffffff;
    border: 1px dashed rgba(14,14,16,0.18);
    border-radius: 18px;
    padding: 60px 24px;
    text-align: center;
  }
  /* ---------- 我的收藏 独立页 ---------- */
  .fav-back {
    display: inline-flex; align-items: center; gap: 6px;
    background: transparent; border: 0; cursor: pointer; padding: 4px 2px;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13px; font-weight: 500; color: #5a5a62;
    transition: color 140ms ease;
  }
  .fav-back:hover { color: #0e0e10; }
  .fav-page-head { display: flex; align-items: baseline; gap: 12px; margin: 10px 0 22px; flex-wrap: wrap; }
  .fav-page-title {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 28px; font-weight: 700; letter-spacing: -0.02em; color: #0e0e10;
  }
  .fav-page-count { font-size: 13.5px; color: #8a8a92; font-weight: 500; }
  .fav-page-action {
    margin-left: auto; display: inline-flex; align-items: center; gap: 5px;
    background: #0e0e10; color: #fff; border: 0; border-radius: 999px;
    padding: 7px 14px; font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13px; font-weight: 500; cursor: pointer;
    transition: background 140ms ease;
  }
  .fav-page-action:hover { background: #1a1a1d; }
  html.dark .fav-back { color: #9a9aa2; }
  html.dark .fav-back:hover { color: #f5f5f7; }
  html.dark .fav-page-title { color: #f5f5f7; }
  html.dark .fav-page-action { background: #fff; color: #0e0e10; }

  /* ---------- 我的看板 ---------- */
  .tracker-board {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(248px, 1fr);
    gap: 8px;
    align-items: stretch;
    overflow-x: auto;
    padding: 2px 2px 16px;
    scrollbar-width: thin;
  }
  .tracker-column {
    min-width: 0;
    display: flex;
    flex-direction: column;
    min-height: clamp(360px, 46vh, 520px);
    border: 1px solid rgba(14,14,16,0.065);
    border-radius: 8px;
    background: rgba(255,255,255,0.28);
    overflow: hidden;
    transition: border-color 140ms ease, background 140ms ease;
  }
  .tracker-column-head {
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 10px;
    border-bottom: 1px solid rgba(14,14,16,0.055);
    background: rgba(250,249,246,0.48);
  }
  .tracker-column-title {
    min-width: 0;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 12.5px;
    font-weight: 650;
    color: #38383d;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .tracker-column-count {
    min-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: rgba(14,14,16,0.055);
    color: #6f6f78;
    font-size: 11.5px;
    font-weight: 600;
  }
  .tracker-column-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 6px;
    min-height: 0;
    transition: background 140ms ease;
  }
  .tracker-column-body.is-empty {
    justify-content: center;
  }
  .tracker-column-body.is-drag-over {
    background: rgba(10,135,247,0.06);
    box-shadow: inset 0 0 0 1px rgba(10,135,247,0.18);
  }
  .tracker-column-empty {
    border: 1px dashed transparent;
    border-radius: 7px;
    padding: 10px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #c2c2c8;
    font-size: 12px;
    background: transparent;
  }
  .tracker-column-body.is-drag-over .tracker-column-empty {
    border-color: rgba(10,135,247,0.2);
    color: #7a7f8a;
    background: rgba(255,255,255,0.36);
  }
  .tracker-card {
    display: flex;
    flex-direction: column;
    gap: 7px;
    border: 1px solid rgba(14,14,16,0.07);
    border-radius: 7px;
    background: rgba(255,255,255,0.78);
    padding: 9px 9px 8px;
    box-shadow: none;
    cursor: grab;
    user-select: none;
    transition: border-color 140ms ease, background 140ms ease, box-shadow 140ms ease;
  }
  .tracker-card:active {
    cursor: grabbing;
  }
  .tracker-card:hover {
    background: #ffffff;
    border-color: rgba(14,14,16,0.13);
    box-shadow: 0 12px 28px -24px rgba(14,14,16,0.5);
  }
  .tracker-card.is-dragging {
    opacity: 0.52;
    transform: scale(0.985);
  }
  .tracker-card-line {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
  }
  .tracker-card-main {
    min-width: 0;
    flex: 1 1 auto;
  }
  .tracker-source {
    min-width: 0;
    max-width: 96px;
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 6px;
    border-radius: 6px;
    background: rgba(14,14,16,0.055);
    color: #6f6f78;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .tracker-source.is-offerdao {
    background: rgba(10,135,247,0.08);
    color: #0969da;
  }
  .tracker-company {
    color: #0e0e10;
    font-size: 13.2px;
    font-weight: 650;
    line-height: 1.32;
    overflow-wrap: anywhere;
  }
  .tracker-role {
    margin-top: 3px;
    color: #8a8a92;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    overflow-wrap: anywhere;
  }
  .tracker-card-meta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
    min-width: 0;
  }
  .tracker-micro-pill,
  .tracker-updated {
    height: 20px;
    display: inline-flex;
    align-items: center;
    padding: 0 6px;
    border-radius: 6px;
    background: rgba(14,14,16,0.045);
    color: #8a8a92;
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
  }
  .tracker-next-inline {
    min-width: 0;
    color: #4a4a52;
    font-size: 12px;
    line-height: 1.45;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .tracker-card-actions {
    display: flex;
    align-items: center;
    gap: 3px;
    opacity: 0;
    transform: translateX(2px);
    transition: opacity 140ms ease, transform 140ms ease;
  }
  .tracker-card:hover .tracker-card-actions,
  .tracker-card:focus-within .tracker-card-actions {
    opacity: 1;
    transform: translateX(0);
  }
  .tracker-icon-btn {
    width: 25px;
    height: 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: #8a8a92;
    cursor: pointer;
    transition: color 140ms ease, border-color 140ms ease, background 140ms ease;
  }
  .tracker-icon-btn:hover {
    color: #0969da;
    border-color: rgba(10,135,247,0.35);
    background: rgba(10,135,247,0.06);
  }
  .tracker-icon-btn.is-danger:hover {
    color: #db2777;
    border-color: rgba(219,39,119,0.35);
    background: rgba(219,39,119,0.06);
  }
  .tracker-card-status-select {
    display: none;
    width: 100%;
    height: 28px;
    border: 1px solid rgba(14,14,16,0.08);
    border-radius: 6px;
    background: rgba(255,255,255,0.78);
    color: #5a5a62;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 12px;
    font-weight: 500;
    padding: 0 8px;
  }
  .tracker-confirm-modal {
    width: min(420px, calc(100vw - 32px));
    border-radius: 12px;
    background: #ffffff;
    border: 1px solid rgba(14,14,16,0.12);
    box-shadow: 0 28px 80px -28px rgba(14,14,16,0.55);
    padding: 20px;
  }
  .tracker-confirm-kicker {
    color: #8a8a92;
    font-size: 12px;
    font-weight: 650;
  }
  .tracker-confirm-title {
    margin-top: 8px;
    color: #0e0e10;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
  }
  .tracker-confirm-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
    color: #5a5a62;
    font-size: 13px;
  }
  .tracker-modal {
    width: min(660px, calc(100vw - 32px));
    max-height: min(760px, calc(100vh - 44px));
    display: flex;
    flex-direction: column;
    border-radius: 16px;
    background: #fbfaf8;
    border: 1px solid rgba(14,14,16,0.1);
    box-shadow: 0 30px 90px -36px rgba(14,14,16,0.58);
    overflow: hidden;
  }
  .tracker-modal-bar {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px 0 20px;
    border-bottom: 1px solid rgba(14,14,16,0.07);
    background: linear-gradient(180deg, rgba(255,255,255,0.84), rgba(250,249,246,0.72));
  }
  .tracker-modal-title {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 15.5px;
    font-weight: 700;
    color: #0e0e10;
  }
  .tracker-form {
    overflow-y: auto;
    padding: 18px 20px 20px;
  }
  .tracker-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 14px;
    border: 1px solid rgba(14,14,16,0.075);
    border-radius: 12px;
    background: rgba(255,255,255,0.74);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.72);
  }
  .tracker-form .account-field {
    margin-bottom: 0;
  }
  .tracker-form .account-field-label {
    margin-bottom: 6px;
    color: #6f6f78;
    font-size: 11.5px;
    font-weight: 650;
  }
  .tracker-form .field-input {
    min-height: 42px;
    border-radius: 9px;
    border-color: rgba(14,14,16,0.105);
    background: rgba(255,255,255,0.9);
    box-shadow: 0 1px 0 rgba(14,14,16,0.025);
  }
  .tracker-form .field-input:hover {
    border-color: rgba(14,14,16,0.16);
  }
  .tracker-form select.field-input,
  .tracker-card-status-select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236f6f78' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 14px 14px;
    padding-right: 40px;
  }
  .tracker-form-wide {
    grid-column: 1 / -1;
  }
  .tracker-textarea {
    min-height: 126px;
    resize: vertical;
    line-height: 1.5;
  }
  .tracker-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 14px;
  }
  html.dark .tracker-column {
    background: rgba(25,36,56,0.34);
    border-color: rgba(255,255,255,0.1);
  }
  html.dark .tracker-column-head {
    background: rgba(18,26,44,0.54);
    border-bottom-color: rgba(255,255,255,0.1);
  }
  html.dark .tracker-column-title,
  html.dark .tracker-company,
  html.dark .tracker-confirm-title,
  html.dark .tracker-modal-title { color: #f5f5f7; }
  html.dark .tracker-card,
  html.dark .tracker-icon-btn,
  html.dark .tracker-card-status-select,
  html.dark .tracker-confirm-modal,
  html.dark .tracker-modal {
    background: #192438;
    border-color: rgba(255,255,255,0.12);
  }
  html.dark .tracker-icon-btn,
  html.dark .tracker-next-inline { color: #d4d4dc; }
  html.dark .tracker-micro-pill,
  html.dark .tracker-source,
  html.dark .tracker-column-count {
    background: rgba(255,255,255,0.06);
  }
  html.dark .tracker-role,
  html.dark .tracker-updated,
  html.dark .tracker-confirm-meta { color: #aeb0bb; }
  html.dark .tracker-modal-bar {
    background: linear-gradient(180deg, rgba(25,36,56,0.94), rgba(18,26,44,0.86));
    border-bottom-color: rgba(255,255,255,0.1);
  }
  html.dark .tracker-form-grid {
    background: rgba(255,255,255,0.035);
    border-color: rgba(255,255,255,0.1);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
  }
  html.dark .tracker-form .account-field-label {
    color: #aeb0bb;
  }
  html.dark .tracker-form .field-input {
    background-color: rgba(255,255,255,0.045);
    border-color: rgba(255,255,255,0.12);
    color: #f5f5f7;
    box-shadow: none;
  }
  html.dark .tracker-form .field-input:hover {
    border-color: rgba(255,255,255,0.2);
  }
  html.dark .tracker-form select.field-input,
  html.dark .tracker-card-status-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23aeb0bb' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 14px 14px;
  }
  @media (max-width: 560px) {
    .tracker-board { grid-auto-columns: minmax(248px, 78vw); }
    .tracker-column { min-height: clamp(320px, 44vh, 460px); }
    .tracker-modal {
      width: calc(100vw - 28px);
      max-height: min(86svh, 720px);
    }
    .tracker-form { padding: 14px; }
    .tracker-form-grid {
      grid-template-columns: 1fr;
      gap: 10px;
      padding: 12px;
    }
  }
  @media (hover: none), (pointer: coarse) {
    .tracker-card { cursor: default; }
    .tracker-card-actions {
      opacity: 0.72;
      transform: none;
    }
    .tracker-card-status-select {
      display: block;
    }
  }

  /* ---------- 我的发布：详情 sheet 内的管理操作栏 ---------- */
  .sheet-manage {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    flex-wrap: wrap; margin-bottom: 16px; padding: 12px 14px;
    background: rgba(10,135,247,0.05); border: 1px solid rgba(10,135,247,0.18);
    border-radius: 14px;
  }
  .sheet-manage-status { display: flex; align-items: center; gap: 10px; min-width: 0; flex-wrap: wrap; }
  .sheet-manage-hint { font-size: 12px; color: #8a8a92; }
  .sheet-manage-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
  html.dark .sheet-manage { background: rgba(10,135,247,0.12); border-color: rgba(10,135,247,0.3); }
  .toast {
    position: fixed;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%);
    background: #0e0e10;
    color: #ffffff;
    border-radius: 999px;
    padding: 10px 18px;
    font-family: 'Geist', sans-serif;
    font-size: 13px;
    box-shadow: 0 18px 40px -16px rgba(14,14,16,0.5);
    z-index: 80;
  }

  /* 微信社群引导卡 — 右下角浮层（收藏成功后的自动引导 + 各「加入社群」入口
     的统一落点）。z-index 低于 toast(80)，高于页面内容与 sticky nav。 */
  .community-card {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 75;
    width: 232px;
    padding: 18px 16px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
    background: #ffffff;
    border: 1px solid rgba(14,14,16,0.10);
    border-radius: 16px;
    box-shadow: 0 18px 44px -14px rgba(14,14,16,0.28);
  }
  .community-card-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: #94949c;
    cursor: pointer;
    transition: color 140ms ease, background 140ms ease;
  }
  .community-card-close:hover { color: #0e0e10; background: rgba(14,14,16,0.06); }
  .community-card-title {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-weight: 600;
    font-size: 14.5px;
    color: #0e0e10;
    letter-spacing: -0.1px;
  }
  .community-card-sub {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 12px;
    line-height: 1.6;
    color: #5a5a62;
  }
  .community-card-qr {
    width: 148px;
    height: 148px;
    object-fit: contain;
    border-radius: 10px;
    margin-top: 6px;
    border: 1px solid rgba(14,14,16,0.06);
  }
  @media (max-width: 520px) {
    .community-card { right: 12px; bottom: 12px; left: auto; }
  }
  html.dark .community-card {
    background: #11192b;
    border-color: rgba(255,255,255,0.10);
    box-shadow: 0 18px 44px -12px rgba(0,0,0,0.6);
  }
  html.dark .community-card-title { color: #ececf1; }
  html.dark .community-card-sub { color: #9a9aa6; }
  html.dark .community-card-close:hover { color: #ececf1; background: rgba(255,255,255,0.08); }
  html.dark .community-card-qr { border-color: rgba(255,255,255,0.08); }

  /* Detail modal · share action row (poster PNG + short link copy).
     Sticky bottom band so the outro affordance is always visible without
     scrolling through long postings. */
  .detail-share-row {
    display: flex;
    gap: 10px;
    padding: 14px 22px;
    border-top: 1px solid rgba(14,14,16,0.06);
    background: #fafaf7;
    border-radius: 0 0 16px 16px;
  }
  .detail-share-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid rgba(14,14,16,0.12);
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13px;
    font-weight: 500;
    color: #0e0e10;
    cursor: pointer;
    transition: border-color 140ms ease, color 140ms ease, background 140ms ease;
  }
  .detail-share-btn:hover:not(:disabled) {
    border-color: #0e0e10;
    background: #0e0e10;
    color: #ffffff;
  }
  .detail-share-btn:disabled { opacity: 0.55; cursor: wait; }

  /* Publish modal · success overlay (3 share actions after a successful
     submit). Covers the entire publish-modal-frame so the form stays
     mounted underneath (cheap to dismount, plus the poster can hit
     "继续发布" to flip back without losing field-state caches). */
  .publish-success-overlay {
    position: absolute;
    inset: 0;
    background: rgba(250, 249, 246, 0.96);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: inherit;
    padding: 28px;
  }
  .publish-success-card {
    width: 100%;
    max-width: 460px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
  }
  .publish-success-icon {
    width: 64px;
    height: 64px;
    border-radius: 999px;
    background: linear-gradient(135deg, #0a6ce8 0%, #38b6f8 100%);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 18px 40px -16px rgba(10,135,247,0.45);
    margin-bottom: 8px;
  }
  .publish-success-title {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-weight: 600;
    font-size: 22px;
    color: #0e0e10;
    letter-spacing: -0.2px;
  }
  .publish-success-sub {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13.5px;
    color: #5a5a62;
    margin-bottom: 18px;
  }
  .publish-success-actions {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .publish-success-action {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px 14px;
    background: #ffffff;
    border: 1px solid rgba(14,14,16,0.10);
    border-radius: 12px;
    cursor: pointer;
    transition: border-color 140ms ease, transform 180ms cubic-bezier(0.2,0.8,0.2,1), box-shadow 180ms ease;
    text-align: left;
  }
  .publish-success-action:hover:not(:disabled) {
    border-color: rgba(10,135,247,0.5);
    transform: translateY(-1px);
    box-shadow: 0 10px 24px -14px rgba(10,135,247,0.25);
  }
  .publish-success-action:disabled { opacity: 0.55; cursor: wait; }
  .publish-success-action-icon {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(14,14,16,0.05);
    color: #0e0e10;
  }
  .publish-success-action-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .publish-success-action-title {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-weight: 600;
    font-size: 13.5px;
    color: #0e0e10;
  }
  .publish-success-action-sub {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 11.5px;
    color: #5a5a62;
  }
  .publish-success-action-cta {
    flex-shrink: 0;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #0a87f7;
  }
  /* 发布成功 · 社群引导条 — 三个分享动作之下的横向小条：二维码 + 一句
     供给侧钩子。虚线边框 + 品牌浅蓝底，与上面的实线分享卡区分主次。 */
  .publish-success-community {
    width: 100%;
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: rgba(10,135,247,0.05);
    border: 1px dashed rgba(10,135,247,0.35);
    border-radius: 12px;
    text-align: left;
  }
  .publish-success-community-qr {
    flex-shrink: 0;
    width: 72px;
    height: 72px;
    object-fit: contain;
    border-radius: 8px;
  }
  .publish-success-community-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .publish-success-community-title {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-weight: 600;
    font-size: 13.5px;
    color: #0e0e10;
  }
  .publish-success-community-sub {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 11.5px;
    line-height: 1.5;
    color: #5a5a62;
  }
  html.dark .publish-success-community { background: rgba(10,135,247,0.12); border-color: rgba(10,135,247,0.4); }
  html.dark .publish-success-community-title { color: #ececf1; }
  html.dark .publish-success-community-sub { color: #9a9aa6; }

  .publish-success-footer {
    width: 100%;
    margin-top: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }
  .publish-success-footer-link {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 12.5px;
    color: #5a5a62;
    background: none;
    border: none;
    cursor: pointer;
    padding: 6px 0;
    transition: color 140ms ease;
  }
  .publish-success-footer-link:hover { color: #0e0e10; text-decoration: underline; }
  .publish-success-footer-done {
    padding: 8px 22px;
    border-radius: 999px;
    background: #0e0e10;
    color: #ffffff;
    border: none;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 140ms ease;
  }
  .publish-success-footer-done:hover { background: #0e1c33; }

  /* Discard-confirm overlay — second-chance guard against accidentally closing
     the publish modal (X / 取消 / 点击弹窗外 / Esc) after the poster has typed
     something. Mirrors .publish-success-overlay's frosted full-frame cover so
     the half-filled form stays mounted underneath and re-appears the instant
     they pick 继续编辑. Only shown when the form is actually dirty. */
  .publish-confirm-overlay {
    position: absolute;
    inset: 0;
    background: rgba(250, 249, 246, 0.96);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: inherit;
    padding: 28px;
  }
  .publish-confirm-card {
    width: 100%;
    max-width: 380px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
  }
  .publish-confirm-icon {
    width: 56px;
    height: 56px;
    border-radius: 999px;
    background: rgba(226, 98, 10, 0.12);
    color: #e2620a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
  }
  .publish-confirm-title {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-weight: 600;
    font-size: 19px;
    color: #0e0e10;
    letter-spacing: -0.2px;
  }
  .publish-confirm-sub {
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13px;
    color: #5a5a62;
    line-height: 1.5;
    margin-bottom: 20px;
  }
  .publish-confirm-actions {
    width: 100%;
    display: flex;
    gap: 10px;
  }
  .publish-confirm-stay {
    flex: 1;
    padding: 10px 18px;
    border-radius: 999px;
    background: #0e0e10;
    color: #ffffff;
    border: none;
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13.5px;
    font-weight: 500;
    cursor: pointer;
    transition: background 140ms ease;
  }
  .publish-confirm-stay:hover { background: #0e1c33; }
  .publish-confirm-discard {
    flex: 1;
    padding: 10px 18px;
    border-radius: 999px;
    background: transparent;
    color: #c0392b;
    border: 1px solid rgba(192, 57, 43, 0.4);
    font-family: 'Geist', 'Noto Sans SC', sans-serif;
    font-size: 13.5px;
    font-weight: 500;
    cursor: pointer;
    transition: background 140ms ease, border-color 140ms ease;
  }
  .publish-confirm-discard:hover { background: rgba(192, 57, 43, 0.08); border-color: rgba(192, 57, 43, 0.6); }