/* ── Header ── */
  .app-header {
    border-bottom: 1px solid var(--color-border-bar);
  }
  .app-header-inner {
    min-height: 53px;
    padding: 0 16px 0 0;
    display: flex;
    align-items: center;
    gap: 16px;
    box-sizing: border-box;
  }
  .header-brand-slot {
    width: var(--sidebar-w);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    height: 53px;
    padding: 0 12px 0 24px;
    box-sizing: border-box;
    min-width: 0;
    transition: width 0.18s ease;
  }
  .left-rail-toggle {
    width: 32px;
    height: 32px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--color-text-secondary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    cursor: pointer;
  }
  .left-rail-toggle:hover, .left-rail-toggle.active {
    background: var(--color-bg-elevated);
    border-color: var(--color-border);
    color: var(--color-text-primary);
  }
  #main-layout {
    background: var(--color-bg-canvas);
  }
  #detail-panel {
    min-width: 0;
  }
  /* detail page canvas 需要尽量占满,缩小左右内边距让段图撑大 */
  #detail-panel:has(.detail-workbench-canvas) {
    padding: 16px;
  }
  #app-sidebar {
    width: var(--sidebar-w);
    transition: width 0.18s ease, transform 0.25s ease;
    overflow: hidden;
  }
  body.left-rail-collapsed #app-sidebar {
    width: 72px !important;
  }
  body.left-rail-collapsed .header-brand-slot {
    justify-content: center;
    padding: 0;
  }
  body.left-rail-collapsed .header-brand-slot .left-rail-toggle {
    display: none !important;
  }
  body.left-rail-collapsed #project-context {
    padding: 0;
    border-bottom: 0;
  }
  body.left-rail-collapsed #project-header,
  body.left-rail-collapsed #drop-zone,
  body.left-rail-collapsed .item-list-header {
    display: none !important;
  }
  body.left-rail-collapsed #batch-switcher-btn,
  body.left-rail-collapsed .project-header {
    justify-content: center;
  }
  body.left-rail-collapsed .project-header-name-text,
  body.left-rail-collapsed #batch-switcher-badge,
  body.left-rail-collapsed #batch-switcher-chevron,
  body.left-rail-collapsed .project-header-actions,
  body.left-rail-collapsed .dz-full-label,
  body.left-rail-collapsed .dz-full-sublabel,
  body.left-rail-collapsed .dz-full-actions span,
  body.left-rail-collapsed .dz-inline-label,
  body.left-rail-collapsed .dz-inline-sublabel,
  body.left-rail-collapsed .item-list-title,
  body.left-rail-collapsed .item-list-header-title,
  body.left-rail-collapsed .item-list-count,
  body.left-rail-collapsed .sidebar-account-copy,
  body.left-rail-collapsed .sidebar-account-chevron,
  body.left-rail-collapsed #sidebar-poster {
    display: none !important;
  }
  body.left-rail-collapsed .drop-zone {
    min-height: 48px;
    padding: 8px;
  }
  body.left-rail-collapsed .dz-full-content,
  body.left-rail-collapsed .dz-inline-content {
    align-items: center;
    justify-content: center;
  }
  body.left-rail-collapsed .drop-zone-btn {
    width: 36px;
    min-width: 36px;
    padding: 0;
    justify-content: center;
  }
  body.left-rail-collapsed #item-list {
    padding: 6px 8px 72px;
  }
  body.left-rail-collapsed .item-list-header {
    justify-content: center;
    padding-left: 8px;
    padding-right: 8px;
  }
  body.left-rail-collapsed .item-row {
    width: 56px;
    min-height: 56px;
    padding: 0 !important;
    margin: 0 0 8px !important;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  body.left-rail-collapsed .item-row.active {
    border-color: rgba(var(--color-accent-rgb), 0.32);
  }
  body.left-rail-collapsed .item-row > .flex {
    width: 100%;
    justify-content: center;
  }
  body.left-rail-collapsed .item-row .flex-1 {
    display: none !important;
  }
  body.left-rail-collapsed .item-row-thumb {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    margin: 0;
  }
  body.left-rail-collapsed .sidebar-account-shell {
    width: 72px;
    padding: 8px;
  }
  body.left-rail-collapsed .sidebar-account-trigger {
    justify-content: center;
    padding: 8px;
  }
  .sidebar-collapsed-actions {
    display: none;
  }
  body.left-rail-collapsed .sidebar-collapsed-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    padding: 8px 0 6px;
    flex-shrink: 0;
  }
  .sidebar-rail-icon {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--color-text-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
  }
  .sidebar-rail-icon:hover,
  .sidebar-rail-icon:focus-visible {
    background: var(--color-bg-elevated);
    color: var(--color-text-primary);
    outline: none;
  }
  .app-brand-lockup {
    width: 106px;
    height: 32px;
    margin: 0;
    display: flex;
    align-items: center;
    line-height: 0;
    font-size: 0;
    overflow: visible;
  }
  .app-header .app-brand-logo {
    width: auto;
    height: 32px;
    max-width: 106px;
    object-fit: contain;
  }
  .app-header .app-brand-mark {
    width: 28px;
    height: 28px;
    max-width: 28px;
    object-fit: contain;
    display: none;
  }
  body.left-rail-collapsed .app-header .app-brand-logo {
    display: none;
  }
  body.left-rail-collapsed .app-header .app-brand-lockup {
    width: 30px;
    height: 30px;
    justify-content: center;
  }
  body.left-rail-collapsed .app-header .app-brand-mark {
    display: block;
  }
  @media (min-width: 769px) {
    body.left-rail-collapsed .account-menu {
      position: fixed;
      left: 8px;
      right: auto;
      bottom: 70px;
      width: min(260px, calc(100vw - 16px));
      max-height: min(560px, calc(100vh - 94px));
    }
  }
  .header-logo-icon {
    width: 30px;
    height: 30px;
    border-radius: var(--radius-md);
    background: var(--color-accent);
    color: var(--color-on-dark);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .header-icon-btn {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-md);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-secondary);
    transition: all var(--transition-fast);
  }
  .header-icon-btn:hover {
    background: var(--color-bg-elevated);
    border-color: var(--color-border-focus);
    color: var(--color-text-primary);
  }
  .header-brand-slot .left-rail-toggle.header-icon-btn,
  .tool-dock-header-toggle.header-icon-btn {
    width: 36px;
    height: 36px;
    min-width: 36px;
    min-height: 36px;
    background: transparent;
    border-color: transparent;
    color: var(--color-text-secondary);
    box-shadow: none;
  }
  .header-brand-slot .left-rail-toggle.header-icon-btn:hover,
  .header-brand-slot .left-rail-toggle.header-icon-btn.active,
  .tool-dock-header-toggle.header-icon-btn:hover,
  .tool-dock-header-toggle.header-icon-btn.active {
    background: var(--color-bg-elevated);
    border-color: var(--color-border);
    color: var(--color-text-primary);
  }
  .rail-toggle-svg {
    transform-origin: 50% 50%;
    transition: none;
  }
  .header-brand-slot .left-rail-toggle:not(.active) .rail-toggle-svg,
  .tool-dock-header-toggle:not(.active) .rail-toggle-svg {
    transform: none;
  }

  /* ── Sidebar ── */
  .sidebar-action-btn {
    padding: 8px 12px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: transparent;
    color: var(--color-text-secondary);
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
    text-align: center;
  }
  .sidebar-action-btn:hover {
    background: var(--color-bg-elevated);
    border-color: var(--color-border-focus);
    color: var(--color-text-primary);
  }
  .header-credits-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px 5px 8px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    background: var(--color-bg-card);
    color: var(--color-text-secondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all var(--transition-fast);
  }
  .header-credits-btn:hover {
    background: var(--color-bg-elevated);
    border-color: var(--color-border-focus);
    color: var(--color-text-primary);
  }
  .header-credits-value {
    font-variant-numeric: tabular-nums;
    min-width: 28px;
    text-align: right;
  }
  .header-avatar-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--color-accent);
    color: var(--color-on-dark);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 600;
    transition: all var(--transition-fast);
  }
  .header-avatar-btn:hover {
    background: var(--color-accent-hover);
    transform: scale(1.05);
  }

  /* ── User drawer ── */
  .drawer-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 100;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
  }
  .user-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 380px;
    max-width: 90vw;
    background: var(--color-bg-canvas);
    z-index: 101;
    display: flex;
    flex-direction: column;
    box-shadow: -8px 0 40px rgba(0, 0, 0, 0.4);
    animation: drawerSlideIn 0.25s ease-out;
  }
  @keyframes drawerSlideIn {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
  }
  .user-profile-card {
    padding: 4px 0;
  }
  .user-avatar-lg {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--color-accent);
    color: var(--color-on-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
    flex-shrink: 0;
  }
  .user-recharge-strip {
    padding: 12px 14px;
    background: var(--color-bg-card);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    cursor: pointer;
    transition: all var(--transition-fast);
  }
  .user-recharge-strip:hover {
    background: var(--color-bg-elevated);
    border-color: rgba(119,136,255,0.2);
  }
  .recharge-arrow {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--color-accent-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-accent);
  }
  .user-drawer-tab {
    background: transparent;
    border: none;
    color: var(--color-text-tertiary);
    border-radius: var(--radius-md);
    padding: 6px 14px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s;
  }
  .user-drawer-tab:hover { color: var(--color-text-primary); background: var(--color-bg-elevated); }
  .user-drawer-tab.active { color: var(--color-text-primary); background: var(--color-bg-elevated); }
  .user-logout-btn {
    padding: 10px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    background: transparent;
    color: var(--color-text-secondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
  }
  .user-logout-btn:hover {
    background: var(--color-error-bg);
    border-color: var(--color-error);
    color: var(--color-error);
  }

  /* ── Drawer form elements ── */
  .drawer-label {
    font-size: 12px;
    font-weight: 500;
    color: var(--color-text-tertiary);
    margin-bottom: 6px;
  }
  .drawer-value {
    font-size: 14px;
    color: var(--color-text-secondary);
  }
  .drawer-input {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    color: var(--color-text-primary);
    padding: 10px 14px;
    font-size: 14px;
    outline: none;
    transition: border-color 0.2s;
  }
  .drawer-input:focus {
    border-color: var(--color-border-focus);
  }
  .drawer-save-btn {
    padding: 8px 20px;
    border-radius: var(--radius-md);
    background: var(--color-accent);
    color: var(--color-on-dark);
    border: none;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
  }
  .drawer-save-btn:hover {
    background: var(--color-accent-hover);
  }
  .drawer-stat-card {
    padding: 16px;
    border-radius: var(--radius-lg);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    text-align: center;
  }
  .drawer-stat-value {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
  }
  .drawer-stat-label {
    font-size: 12px;
    color: var(--color-text-tertiary);
    margin-top: 4px;
  }

  /* ── Account menu in sidebar (ChatGPT-style placement) ── */
  .header-right-actions {
    margin-left: auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-shrink: 0;
  }

  .header-notif-btn {
    position: relative;
    background: transparent;
    border-color: transparent;
  }

  .sidebar-bottom {
    border-top: 0;
    flex-shrink: 0;
  }

  .sidebar-account-shell {
    position: fixed;
    left: 0;
    bottom: 0;
    width: var(--sidebar-w);
    box-sizing: border-box;
    z-index: 41;
    padding: 8px;
    background: var(--color-bg-canvas);
    border-right: 1px solid var(--color-border);
    border-bottom-right-radius: 0;
  }

  #sidebar-poster {
    width: 100%;
    aspect-ratio: 3 / 2;
    margin: 0 0 6px;
    overflow: hidden;
    border-radius: var(--radius-md);
    cursor: pointer;
    background: var(--color-bg-elevated);
    transition: opacity 0.15s ease;
  }
  #sidebar-poster-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  #sidebar-poster:hover { opacity: 0.85; }
  #sidebar-poster:focus-visible {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
    border-radius: var(--radius-md);
  }

  #item-list {
    padding-bottom: 72px;
  }
  /* sidebar 滚动条收窄,避免视觉上跟海报抢眼 */
  #item-list::-webkit-scrollbar,
  #app-sidebar ::-webkit-scrollbar { width: 3px; }
  #item-list::-webkit-scrollbar-thumb,
  #app-sidebar ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.06); border-radius: 2px; }
  #item-list::-webkit-scrollbar-thumb:hover,
  #app-sidebar ::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.18); }
  [data-theme="light"] #item-list::-webkit-scrollbar-thumb,
  [data-theme="light"] #app-sidebar ::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.06); }
  [data-theme="light"] #item-list::-webkit-scrollbar-thumb:hover,
  [data-theme="light"] #app-sidebar ::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.18); }

  .sidebar-account-trigger {
    width: 100%;
    min-height: 46px;
    padding: 8px;
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text-primary);
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: background 0.15s ease, color 0.15s ease;
  }

  .sidebar-account-trigger:hover,
  .sidebar-account-trigger[aria-expanded="true"] {
    background: var(--color-bg-elevated);
  }

  .sidebar-account-avatar,
  .account-menu-avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--color-accent);
    color: var(--color-on-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    flex-shrink: 0;
  }

  .sidebar-account-copy,
  .account-menu-profile-copy {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1px;
  }

  .sidebar-account-name,
  .account-menu-user-name {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .sidebar-account-meta,
  .account-menu-user-meta,
  .account-menu-meta {
    font-size: 12px;
    color: var(--color-text-tertiary);
    line-height: 1.25;
    font-variant-numeric: tabular-nums;
  }

  .sidebar-account-chevron {
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-tertiary);
    flex-shrink: 0;
  }

  .account-menu {
    position: absolute;
    left: 8px;
    right: 8px;
    bottom: calc(100% + 8px);
    z-index: var(--z-dropdown);
    padding: 6px;
    border: 1px solid var(--color-border);
    border-radius: 12px;
    background: var(--color-glass-panel-bg);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
    max-height: min(560px, calc(100vh - 112px));
    overflow-y: auto;
  }

  [data-theme="light"] .account-menu {
    background: #ffffff;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.16);
  }

  .account-menu-profile {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
  }

  .account-menu-group {
    padding: 6px 0;
    border-top: 1px solid var(--color-border);
  }

  .account-menu-profile + .account-menu-group {
    border-top: none;
    padding-top: 4px;
  }

  .account-menu-item {
    width: 100%;
    min-height: 38px;
    padding: 8px 10px;
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text-primary);
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.25;
    text-align: left;
    text-decoration: none;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
  }

  .account-menu-item:hover {
    background: var(--color-bg-elevated);
  }

  .account-menu-item.danger:hover {
    color: var(--color-error);
    background: var(--color-error-bg);
  }

  .account-menu-icon {
    width: 20px;
    height: 20px;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-tertiary);
    flex-shrink: 0;
  }

  .account-menu-icon.accent {
    color: var(--color-warning);
  }

  .account-menu-item:hover .account-menu-icon {
    color: currentColor;
  }

  .account-menu-meta {
    margin-left: auto;
    white-space: nowrap;
  }

  .account-menu .lang-menu {
    position: static;
    min-width: 0;
    margin: 4px 0 2px;
    padding: 4px;
    border-radius: var(--radius-md);
    background: var(--color-bg-canvas);
    box-shadow: none;
  }

  .account-menu .lang-menu.hidden {
    display: none !important;
  }

  /* ── Account settings modal ── */
  .account-settings-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal);
    background: rgba(0, 0, 0, 0.48);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
  }

  .account-settings-modal {
    width: min(720px, 92vw);
    height: min(760px, 88vh);
    max-height: min(760px, 88vh);
    border: 1px solid var(--color-border);
    border-radius: 22px;
    background: var(--color-bg-canvas);
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.5);
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    overflow: hidden;
  }

  .account-settings-sidebar {
    display: none;
  }

  .account-settings-profile {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 4px 14px;
  }

  .account-settings-profile-copy {
    min-width: 0;
    flex: 1;
  }

  .account-settings-tabs {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 12px 0;
  }

  .account-settings-tabs .user-drawer-tab {
    width: 100%;
    min-height: 36px;
    padding: 8px 10px;
    border-radius: var(--radius-md);
    text-align: left;
    display: flex;
    justify-content: flex-start;
  }
  .account-settings-main {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: var(--color-bg-canvas);
  }

  .account-settings-head {
    min-height: auto;
    padding: 28px 32px 6px;
    border-bottom: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
  }

  .account-settings-eyebrow {
    display: none;
    margin-bottom: 2px;
    font-size: 11px;
    color: var(--color-text-tertiary);
  }

  .account-settings-head h2 {
    margin: 0;
    color: var(--color-text-primary);
    font-size: 26px;
    font-weight: 650;
    letter-spacing: -0.03em;
  }

  .account-settings-close {
    width: 34px;
    height: 34px;
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text-tertiary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
  }

  .account-settings-close:hover {
    background: var(--color-bg-elevated);
    color: var(--color-text-primary);
  }

  .account-settings-content {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: 14px 32px 34px;
  }

  .account-profile-editor {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
  }

  .account-edit-avatar {
    width: 142px;
    height: 142px;
    margin: 28px auto 18px;
    border-radius: 50%;
    background: #b24036;
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 54px;
    font-weight: 500;
    letter-spacing: -0.08em;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
  }

  .account-edit-fields {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .account-edit-field {
    min-height: 70px;
    padding: 12px 14px 10px;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    background: transparent;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
  }

  .account-edit-field:focus-within {
    border-color: var(--color-border-focus);
  }

  .account-edit-field span {
    font-size: 13px;
    color: var(--color-text-secondary);
  }

  .account-edit-field input {
    width: 100%;
    padding: 0;
    border: none;
    outline: none;
    background: transparent;
    color: var(--color-text-primary);
    font-size: 18px;
    line-height: 1.35;
  }

  .account-edit-field.readonly {
    opacity: 0.92;
  }

  .account-readonly-value {
    color: var(--color-text-primary);
    font-size: 18px;
    line-height: 1.35;
    word-break: break-all;
  }

  .account-edit-help {
    margin: 0;
    color: var(--color-text-tertiary);
    text-align: center;
    font-size: 14px;
    line-height: 1.55;
  }

  .account-usage-line {
    color: var(--color-text-tertiary);
    text-align: center;
    font-size: 12px;
    line-height: 1.5;
  }

  .account-minor-panel {
    border-top: 1px solid var(--color-border);
    padding-top: 10px;
  }

  .account-minor-panel summary {
    list-style: none;
    cursor: pointer;
    color: var(--color-text-secondary);
    font-size: 13px;
    line-height: 1.4;
  }

  .account-minor-panel summary::-webkit-details-marker {
    display: none;
  }

  .account-minor-panel summary:hover {
    color: var(--color-text-primary);
  }

  .account-minor-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 10px;
  }

  .account-edit-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 2px;
  }

  .account-primary-btn,
  .account-secondary-btn {
    min-height: 42px;
    padding: 0 22px;
    border-radius: 999px;
    border: 1px solid var(--color-border);
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
  }

  .account-primary-btn {
    border-color: transparent;
    background: var(--color-text-primary);
    color: var(--color-bg-canvas);
  }

  .account-primary-btn:hover {
    background: var(--color-text-secondary);
  }

  .account-secondary-btn {
    background: transparent;
    color: var(--color-text-primary);
  }

  .account-secondary-btn:hover {
    background: var(--color-bg-elevated);
  }

  .referral-poster {
    margin-bottom: 4px;
  }
  .referral-poster img {
    display: block;
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    border-radius: var(--radius-lg);
  }

  .referral-minimal {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .referral-hero {
    padding: 28px 22px 24px;
    border-radius: 18px;
    background: var(--color-bg-card);
    text-align: center;
    border: 1px solid var(--color-border);
  }

  .referral-hero-icon {
    width: 58px;
    height: 58px;
    margin: 0 auto 14px;
    border-radius: 18px;
    background: var(--color-accent-bg);
    color: var(--color-accent);
    display: grid;
    place-items: center;
  }

  .referral-hero h3 {
    margin: 0;
    color: var(--color-text-primary);
    font-size: 22px;
    font-weight: 650;
    letter-spacing: -0.02em;
  }

  .referral-hero p {
    max-width: 420px;
    margin: 8px auto 0;
    color: var(--color-text-tertiary);
    font-size: 14px;
    line-height: 1.65;
  }

  .referral-link-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--color-border);
    border-radius: 14px;
    background: transparent;
  }

  .referral-link-text,
  .referral-link-empty {
    flex: 1;
    min-width: 0;
    color: var(--color-text-secondary);
    font-size: 13px;
    line-height: 1.5;
    word-break: break-all;
  }

  .referral-link-empty {
    color: var(--color-text-tertiary);
  }

  .referral-status-line {
    color: var(--color-text-tertiary);
    text-align: center;
    font-size: 12px;
  }

  .referral-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 10px;
  }

  .referral-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid var(--color-border);
  }

  .referral-row-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }

  .referral-row-main strong {
    color: var(--color-text-primary);
    font-size: 13px;
    font-weight: 550;
  }

  .referral-row-main span,
  .referral-row-status,
  .referral-empty {
    color: var(--color-text-tertiary);
    font-size: 12px;
  }

  .referral-empty {
    padding: 10px 0 2px;
  }

  .account-profile-stack {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }

  .account-settings-section {
    padding: 14px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-bg-card);
  }

  .account-settings-section.danger-zone {
    background: transparent;
  }

  .account-profile-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 14px;
  }

  .account-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }

  .account-delete-btn {
    width: 100%;
    padding: 10px;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text-tertiary);
    border: 1px solid var(--color-border);
    font-size: 13px;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
  }

  .account-delete-btn:hover {
    color: var(--color-error);
    border-color: var(--color-error);
    background: var(--color-error-bg);
  }

  @media (max-width: 768px) {
    .detail-style-picker-overlay {
      padding: 10px;
      align-items: stretch;
      justify-content: stretch;
    }
    .detail-style-picker-box {
      width: calc(100vw - 20px);
      max-height: calc(100vh - 20px);
    }
    .detail-style-picker-list {
      grid-template-columns: 1fr;
      padding: 12px;
    }
    .detail-style-picker-head,
    .detail-style-picker-foot {
      padding-left: 14px;
      padding-right: 14px;
    }
    .detail-style-picker-foot {
      align-items: stretch;
      flex-direction: column;
    }
    .detail-style-picker-foot > div {
      width: 100%;
    }
    .detail-style-picker-foot .btn-ghost,
    .detail-style-picker-foot .btn-primary {
      flex: 1 1 0;
      justify-content: center;
    }
    .detail-confirm-overlay {
      padding: 10px;
      align-items: stretch;
      justify-content: stretch;
    }
    .detail-confirm-box {
      width: calc(100vw - 20px);
      max-height: calc(100vh - 20px);
    }
    .detail-confirm-grid,
    .detail-confirm-sources {
      grid-template-columns: 1fr;
    }
    .detail-confirm-head,
    .detail-confirm-body,
    .detail-confirm-actions,
    .detail-revise-body {
      padding-left: 14px;
      padding-right: 14px;
    }

    .account-menu {
      max-height: min(520px, calc(100vh - 116px));
    }

    .account-settings-overlay {
      padding: 0;
      align-items: stretch;
      justify-content: stretch;
    }

    .account-settings-modal {
      width: 100vw;
      height: 100dvh;
      max-height: 100dvh;
      border-radius: 0;
      border: none;
      grid-template-columns: 1fr;
      grid-template-rows: auto minmax(0, 1fr);
    }

    .account-settings-main {
      min-height: 0;
    }

    .account-settings-sidebar {
      border-right: none;
      border-bottom: 1px solid var(--color-border);
      padding: 12px;
    }
    .account-settings-profile {
      display: none;
    }

    .account-settings-tabs {
      flex-direction: row;
      overflow-x: auto;
      padding: 0;
    }

    .account-settings-tabs .user-drawer-tab {
      width: auto;
      flex-shrink: 0;
      white-space: nowrap;
    }

    .account-settings-head {
      min-height: 62px;
      padding: 14px 16px 12px;
    }

    .account-settings-content {
      padding: 16px 16px 28px;
    }

    .account-settings-head h2 {
      font-size: 22px;
    }

    .account-edit-avatar {
      width: 112px;
      height: 112px;
      margin-top: 18px;
      font-size: 44px;
    }

    .referral-link-card,
    .account-edit-actions {
      flex-direction: column;
      align-items: stretch;
    }

    .account-profile-grid,
    .account-stats-grid {
      grid-template-columns: 1fr;
    }
  }

  .pkg-card {
    position: relative;
    padding: 20px 16px;
    border-radius: var(--radius-lg);
    background: var(--color-bg-card);
    border: 2px solid var(--color-border);
    cursor: pointer;
    transition: all 0.2s;
    text-align: center;
    overflow: hidden;
  }
  .pkg-card:hover {
    border-color: var(--color-border-focus);
    background: var(--color-bg-elevated);
  }
  .pkg-card.selected {
    border-color: var(--color-accent);
    background: var(--color-accent-bg);
  }
  .pkg-badge {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 10px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 0 0 0 var(--radius-md);
    background: var(--color-accent);
    color: var(--color-on-dark);
  }
  .pkg-credits {
    font-size: 28px;
    font-weight: 700;
    color: var(--color-text-primary);
    line-height: 1.2;
  }
  .pkg-price {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-warning);
    margin-top: 6px;
  }
  .pkg-bonus {
    font-size: 12px;
    color: var(--color-success);
    margin-top: 2px;
    font-weight: 500;
  }
  /* ── Recharge modal v2 (slide-down) ── */
  .rch-balance-strip {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    margin: 12px 24px 0;
    border-radius: var(--radius-lg);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
  }
  .rch-balance-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255,159,10,0.12);
    border: 1px solid rgba(255,159,10,0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
  .rch-balance-info { flex: 1; min-width: 0; }
  .rch-balance-label { font-size: 11px; color: var(--color-text-tertiary); margin-bottom: 2px; }
  .rch-balance-row { display: flex; align-items: baseline; gap: 6px; }
  .rch-balance-num {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-warning);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
  }
  .rch-balance-unit { font-size: 12px; color: var(--color-text-tertiary); }
  .rch-gen-chip {
    font-size: 11px;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--color-accent-bg);
    color: var(--color-accent);
    font-weight: 500;
    white-space: nowrap;
    flex-shrink: 0;
    border: 1px solid var(--color-border);
  }
  .rch-section-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--color-text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 10px;
  }
  .rch-pkg-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .rch-pkg-card {
    position: relative;
    padding: 14px 14px 20px;
    border-radius: var(--radius-lg);
    border: 1.5px solid var(--color-border);
    background: var(--color-bg-elevated);
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, transform 0.1s;
    text-align: left;
    overflow: hidden;
    user-select: none;
  }
  .rch-pkg-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(119,136,255,0.07) 0%, transparent 55%);
    opacity: 0;
    transition: opacity 0.2s;
    pointer-events: none;
  }
  .rch-pkg-card:hover { border-color: rgba(119,136,255,0.4); background: var(--color-bg-input, var(--color-bg-elevated)); }
  .rch-pkg-card:hover::before { opacity: 1; }
  .rch-pkg-card:active { transform: scale(0.97); }
  .rch-pkg-card.selected {
    border-color: var(--color-accent);
    background: var(--color-accent-bg);
  }
  .rch-pkg-card.selected::before { opacity: 1; }
  .rch-pkg-card.selected::after {
    content: '';
    position: absolute;
    top: 8px;
    right: 8px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: var(--color-accent);
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 5.5L4 7.5L8 3' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
  }
  .rch-pkg-badge {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 11px;
    font-weight: 800;
    padding: 4px 8px;
    border-radius: 0 var(--radius-lg) 0 var(--radius-md);
    background: var(--color-success, #34c759);
    color: var(--color-bg-canvas);
    letter-spacing: 0.04em;
  }
  .rch-pkg-card.recommended {
    overflow: visible;
  }
  .rch-pkg-popular {
    position: absolute;
    top: -9px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 10px;
    font-weight: 600;
    padding: 2px 10px;
    border-radius: 8px;
    background: var(--color-accent);
    color: var(--color-on-accent);
    white-space: nowrap;
  }
  .rch-fold-stack {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 14px;
  }
  .rch-fold {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-bg-card);
    overflow: hidden;
  }
  .rch-fold[open] {
    border-color: rgba(119,136,255,0.28);
    background: var(--color-bg-elevated);
  }
  .rch-fold summary {
    list-style: none;
    min-height: 52px;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    cursor: pointer;
    color: var(--color-text-primary);
  }
  .rch-fold summary::-webkit-details-marker { display: none; }
  .rch-fold summary strong {
    display: block;
    margin-bottom: 2px;
    font-size: 13px;
    font-weight: 650;
  }
  .rch-fold summary small {
    display: block;
    color: var(--color-text-tertiary);
    font-size: 11px;
    line-height: 1.45;
  }
  .rch-fold summary svg {
    color: var(--color-text-tertiary);
    transition: transform 0.15s ease;
    flex-shrink: 0;
  }
  .rch-fold[open] summary svg { transform: rotate(180deg); }
  .rch-fold-body {
    padding: 0 12px 12px;
  }
  .rch-redeem-row {
    display: flex;
    gap: 8px;
  }
  .rch-redeem-row input {
    flex: 1;
    min-width: 0;
    padding: 10px 12px;
    background: var(--color-bg-canvas);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    color: var(--color-text-primary);
    font-size: 14px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    letter-spacing: 0.05em;
    outline: none;
    transition: border-color 0.15s ease;
  }
  .rch-redeem-row input:focus {
    border-color: var(--color-border-focus);
  }
  .rch-redeem-row button {
    padding: 10px 16px;
    background: var(--color-accent);
    color: var(--color-on-accent);
    border: none;
    border-radius: var(--radius-md);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
    white-space: nowrap;
  }
  .rch-redeem-row button:hover {
    background: var(--color-accent-hover);
  }
  .rch-redeem-row button:disabled {
    opacity: 0.55;
    cursor: not-allowed;
  }
  .rch-fold-note {
    margin-top: 10px;
    color: var(--color-text-tertiary);
    font-size: 11px;
    line-height: 1.6;
  }
  /* Bank panel slide-down */
  .rch-bank-panel {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    scroll-margin-top: 12px;
    transition: max-height 0.38s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease;
  }
  .rch-bank-panel.open {
    max-height: 480px;
    opacity: 1;
  }
  /* Channel selection */
  .rch-channel-panel {
    margin-top: 16px;
    margin-bottom: 14px;
    scroll-margin-top: 12px;
  }
  .rch-channel-btns {
    display: flex; gap: 8px; flex-wrap: wrap;
  }
  .rch-channel-btn {
    display: flex; align-items: center; gap: 8px;
    padding: 10px 16px; border-radius: var(--radius-md);
    border: 1px solid var(--color-border); background: var(--color-bg-card);
    color: var(--color-text-primary); font-size: 13px; font-weight: 500;
    cursor: pointer; transition: all 0.15s; font-family: inherit;
  }
  .rch-channel-btn:hover { border-color: var(--color-accent); background: var(--color-accent-bg); }
  .rch-channel-btn.selected { border-color: var(--color-accent); background: var(--color-accent-bg); color: var(--color-accent); }
  .rch-channel-icon {
    width: 20px; height: 20px; border-radius: 4px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 700;
  }
  .rch-channel-icon.wechat { background: #07c160; color: var(--color-on-dark); }
  .rch-channel-icon.alipay { background: #1677ff; color: var(--color-on-dark); }
  .rch-channel-icon.bank { background: var(--color-bg-elevated); color: var(--color-text-secondary); border: 1px solid var(--color-border); }
  .rch-qr-area {
    display: flex; flex-direction: column; align-items: center; padding: 12px 0;
  }
  .rch-qr-area img {
    width: 180px; height: 180px; border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
  }
  .rch-qr-hint {
    margin-top: 8px; font-size: 11px; color: var(--color-text-tertiary);
  }
  .rch-bank-inner {
    margin-top: 14px;
    padding: 16px;
    border-radius: var(--radius-lg);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    position: relative;
    overflow: hidden;
  }
  .rch-order-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 12px;
    margin-bottom: 12px;
    border-bottom: 1px solid var(--color-border);
  }
  .rch-bank-fields { display: flex; flex-direction: column; gap: 6px; }
  .rch-bank-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: var(--radius-sm);
    background: var(--color-bg-elevated);
    border: 1px solid var(--color-border);
  }
  .rch-bank-row-label {
    font-size: 11px;
    color: var(--color-text-tertiary);
    width: 60px;
    flex-shrink: 0;
  }
  .rch-bank-row-value {
    flex: 1;
    font-size: 12px;
    color: var(--color-text-primary);
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .rch-bank-row-value.highlight { color: var(--color-accent); font-weight: 600; }
  .rch-copy-btn {
    padding: 2px 8px;
    font-size: 11px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: transparent;
    color: var(--color-text-tertiary);
    cursor: pointer;
    transition: all 0.15s;
    flex-shrink: 0;
    font-family: inherit;
  }
  .rch-copy-btn:hover { border-color: var(--color-accent); color: var(--color-accent); background: var(--color-accent-bg); }
  .rch-copy-btn.copied { border-color: var(--color-success, #34c759); color: var(--color-success, #34c759); }
  .rch-bank-note {
    margin-top: 10px;
    font-size: 11px;
    color: var(--color-text-tertiary);
    line-height: 1.6;
    padding: 8px 10px;
    background: rgba(255,159,10,0.06);
    border-radius: var(--radius-sm);
    border: 1px solid rgba(255,159,10,0.15);
  }
  .rch-submit-btn {
    width: 100%;
    margin-top: 12px;
    padding: 11px;
    border-radius: var(--radius-md);
    background: var(--color-accent);
    color: var(--color-on-dark);
    border: none;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, opacity 0.15s;
    font-family: inherit;
    letter-spacing: -0.01em;
  }
  .rch-submit-btn:hover { background: var(--color-accent-hover); }
  .rch-submit-btn:disabled { opacity: 0.45; cursor: not-allowed; }
  /* Confirm panel */
  .rch-confirm-panel {
    display: none;
    margin-top: 12px;
    padding: 18px 16px;
    border-radius: var(--radius-lg);
    background: rgba(52,199,89,0.08);
    border: 1px solid rgba(52,199,89,0.25);
    text-align: center;
  }
  .rch-confirm-panel.show { display: block; }
  .rch-confirm-icon { font-size: 28px; margin-bottom: 6px; }
  .rch-confirm-title { font-size: 14px; font-weight: 600; color: var(--color-success, #34c759); }
  .rch-confirm-desc { font-size: 12px; color: var(--color-text-secondary); margin-top: 5px; line-height: 1.6; }
  .rch-confirm-order-no { font-size: 11px; color: var(--color-text-tertiary); margin-top: 6px; font-family: monospace; }
  /* Footer */
  .rch-footer {
    padding: 8px 24px 10px;
    border-top: 1px solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .rch-icp { font-size: 10px; opacity: 0.4; color: var(--color-text-secondary); }

  /* ── 基础响应式 ── */
  @media (max-width: 768px) {
    .batch-bar { left: 0 !important; right: 0 !important; bottom: 0 !important; border-radius: 0 !important; border: none !important; box-shadow: none !important; padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px)) 12px !important; font-size: 12px; }
    .batch-bar { flex-direction: column; align-items: stretch; gap: 8px; }
    .batch-bar-actions { justify-content: flex-start; }
    .batch-delivery-actions { width: 100%; flex-wrap: wrap; }
    .batch-bar-action { flex: 1 1 140px; min-width: 0; }
    .batch-preflight-toggle { flex: 0 0 auto; min-height: 32px; }
    .batch-preflight-box { width: calc(100vw - 24px); max-height: 88vh; }
    .batch-preflight-head { padding: 18px 16px 14px; }
    .batch-preflight-content { padding: 14px 16px; max-height: calc(88vh - 164px); }
    .batch-preflight-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .batch-preflight-row { align-items: flex-start; flex-direction: column; }
    .batch-preflight-link { width: 100%; }
    .batch-preflight-footer { padding: 12px 16px; flex-wrap: wrap; }
    .batch-preflight-footer-toggle { width: 100%; margin-right: 0; }
    .batch-preflight-footer .btn-primary { flex: 1 1 100%; min-width: 0; }
    .batch-bar-actions .result-toolbar-group { width: 100%; justify-content: center; flex-wrap: wrap; border-radius: 12px; }
    .result-toolbar { justify-content: flex-start; }
    .admin-panel, .admin-panel * { font-size: 12px; }
    .admin-search { width: 140px !important; }
    #img-modal .relative { max-width: 95vw !important; }
    #img-modal.ref-preview #img-modal-src { max-width:92vw !important; max-height:82vh !important; }
    #img-modal.result-preview .img-modal-stage { width:calc(100vw - 84px) !important; max-width:calc(100vw - 84px) !important; max-height:calc(100vh - 96px) !important; flex-direction:column !important; gap:10px !important; }
    #img-modal.result-preview .img-modal-main { width:100%; max-width:100% !important; }
    #img-modal.result-preview #img-modal-src { max-width:calc(100vw - 84px) !important; max-height:54vh !important; }
    #img-modal.result-preview #ref-compare-side { width:100% !important; max-width:calc(100vw - 84px) !important; max-height:20vh !important; overflow-x:auto !important; overflow-y:hidden !important; align-items:stretch !important; }
    #img-modal.result-preview #ref-compare-list { width:100%; flex-direction:row !important; gap:8px !important; align-items:center; }
    #img-modal.result-preview #ref-compare-list .ref-compare-img { flex:0 0 auto; min-width:84px; max-width:38vw !important; max-height:16vh !important; }
  }



      /* batch-switcher-row 保留为兼容 class（_bpOutsideClick 检查它） */
      .batch-switcher-row{display:flex;align-items:center;padding:0 6px 0 12px}
      /* 方向 A:项目头计数改灰色小字,不再用蓝色胶囊 */
      .batch-switcher-badge{font-size:11px;padding:0;color:var(--color-text-tertiary);white-space:nowrap;flex-shrink:0;font-variant-numeric:tabular-nums}
      .batch-switcher-icon-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border-radius:6px;border:none;background:none;cursor:pointer;color:var(--color-text-tertiary);line-height:0;transition:all .15s}
      .batch-switcher-icon-btn:hover{background:var(--color-bg-elevated);color:var(--color-text-primary)}
      .project-header .batch-switcher-icon-btn svg,.project-header .batch-switcher-chevron{display:block;width:16px;height:16px;flex:0 0 16px}
      .batch-switcher-chevron{transition:transform 150ms ease;color:var(--color-text-tertiary)}
      .batch-switcher-chevron.open{transform:rotate(180deg)}
      /* 方向 A:项目面板从内嵌半高浮层改为覆盖整个侧栏区域的全高面板(桌面定宽=侧栏宽,移动端由 mobile-workbench.css 全屏规则接管) */
      .batch-panel{position:fixed;top:53px;left:0;bottom:0;z-index:200;display:flex;flex-direction:column;border-right:1px solid var(--color-border);box-shadow:var(--shadow-md);animation:fadeIn 150ms cubic-bezier(.16,1,.3,1)}
      /* 桌面端面板内容从项目头之下开始: 53px=.app-header-inner 高度, 37px=.project-header 高度
         (36px min-height + 1px border, styles.css:348-350)。否则面板搜索框被不透明项目头遮住,
         点击搜索框会误触 batch-switcher toggle 关面板。头部高度改动时必须同步此处 */
      @media (min-width:769px){.batch-panel{top:90px;width:var(--sidebar-w)}}
      /* 仅桌面:收栏时藏面板。移动端 body 也可能带 left-rail-collapsed(抽屉照常开关),不能误杀 */
      @media (min-width:769px){body.left-rail-collapsed .batch-panel{display:none!important}}
      /* 面板开启动画期间仍不吞触发器:项目头浮在面板之上(再点一次=关闭,E2E 契约)。
         不设背景色——移动抽屉底色与 canvas 不同,全局背景会在抽屉里造成色差块 */
      #project-header{position:relative;z-index:201}
      [data-theme="light"] .bp-menu{background:rgba(255,255,255,0.98)!important}
      .batch-panel-search{position:relative;padding:10px 12px;flex-shrink:0;display:flex;align-items:center;gap:6px}
      .batch-panel-search svg{flex-shrink:0;color:var(--color-text-tertiary)}
      .batch-panel-search input{background:var(--color-bg-elevated);border:1px solid transparent;color:var(--color-text-primary);padding:7px 10px;font-size:13px;outline:none;width:100%;border-radius:8px;transition:border-color .15s}
      .batch-panel-search input:focus{border-color:var(--color-accent)}
      .batch-panel-search input::placeholder{color:var(--color-text-tertiary)}
      .batch-panel-list{flex:1;overflow-y:auto;padding:4px 8px}
      .bp-row{display:flex;align-items:center;padding:6px 8px;cursor:pointer;transition:background .12s;border-radius:8px;gap:9px;position:relative;margin:0}
      .bp-row.is-child{padding-left:calc(8px + var(--bp-indent,8px))}
      .bp-row.is-group .bp-name{font-weight:600}
      .bp-row:hover{background:var(--color-bg-elevated)}
      .bp-row.is-current{background:var(--color-accent-bg)}
      .bp-tree-toggle,.bp-tree-spacer{width:10px;height:28px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
      .bp-tree-toggle{border:0;background:transparent;color:var(--color-text-tertiary);cursor:pointer;border-radius:5px;font-size:16px;line-height:1;padding:0;transition:background .12s,color .12s}
      .bp-tree-toggle:hover{background:var(--color-bg-elevated);color:var(--color-text-secondary)}
      .bp-thumb-wrap{position:relative;width:28px;height:28px;flex-shrink:0;border-radius:6px;overflow:hidden;background:var(--color-bg-elevated);display:flex;align-items:center;justify-content:center}
      .bp-thumb-group{color:var(--color-accent);background:var(--color-accent-bg)}
      .bp-thumb-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
      .bp-thumb-fallback{width:100%;height:100%;background:var(--color-bg-elevated);color:var(--color-text-tertiary);font-size:11px;font-weight:500;display:flex;align-items:center;justify-content:center}
      .bp-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;overflow:hidden}
      .bp-name-row{display:flex;align-items:center;min-width:0}
      .bp-name{flex:1;min-width:0;font-size:13px;font-weight:500;color:var(--color-text-primary);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
      .bp-current{flex-shrink:0;margin-left:6px;font-size:10px;line-height:1.5;padding:0 5px;color:var(--color-accent);border:1px solid var(--color-accent);border-radius:4px;white-space:nowrap}
      .bp-meta{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--color-text-tertiary);line-height:1.3;overflow:hidden;white-space:nowrap}
      .bp-count{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
      .bp-time{margin-left:auto;flex-shrink:0;white-space:nowrap;font-variant-numeric:tabular-nums}
      .bp-more-btn{position:absolute;right:2px;top:50%;transform:translateY(-50%);width:22px;background:none;border:none;cursor:pointer;font-size:14px;line-height:1;color:var(--color-text-tertiary);padding:4px 0;border-radius:6px;opacity:0;letter-spacing:0;transition:opacity .12s,background .12s}
      .bp-row:hover .bp-more-btn{opacity:.7}
      .bp-more-btn:hover{background:var(--color-bg-elevated);color:var(--color-text-secondary);opacity:1!important}
      .bp-pin-indicator{position:absolute;left:2px;top:50%;transform:translateY(-50%);font-size:6px;color:var(--color-warning)}
      .bp-empty{padding:20px 16px;text-align:center;color:var(--color-text-tertiary);font-size:13px}
      .bp-menu{position:fixed;z-index:999;min-width:130px;border:1px solid var(--color-border);border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,0.35);padding:4px;animation:bp-menu-in 120ms cubic-bezier(.16,1,.3,1)}
      @keyframes bp-menu-in{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
      .bp-menu-item{padding:8px 12px;font-size:13px;color:var(--color-text-secondary);cursor:pointer;border-radius:6px;transition:background .1s,color .1s;white-space:nowrap}
      .bp-menu-item:hover{background:var(--color-bg-elevated);color:var(--color-text-primary)}
      .bp-menu-item.danger{color:var(--color-error)}
      .bp-menu-item.danger:hover{background:rgba(255,69,58,0.1);color:var(--color-error)}
      .item-list-header{min-height:38px;padding:7px 12px 6px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--color-border);box-sizing:border-box}
      .item-list-header-title{font-size:12px;font-weight:650;color:var(--color-text-tertiary);letter-spacing:0}
      /* 方向 A 款式行:左 40px 缩略图 + 名称行(名称/NEW 小圆点/已选数) + meta 行(异常圆点+张数/待生成+右侧时间) */
      .item-row{position:relative;padding:7px 10px!important;margin:0 6px 2px;border-radius:8px;border:1px solid transparent;transition:background .14s ease,border-color .14s ease}
      .item-row:hover{background:var(--color-control-surface-hover)}
      .item-row.active{background:var(--color-accent-subtle);border-color:rgba(var(--color-accent-rgb),0.12)}
      .item-row.active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:2px;border-radius:2px;background:var(--color-accent)}
      @media (min-width:769px){body.left-rail-collapsed .item-row.active::before{display:none}}
      .item-row.dragging{opacity:.55}
      .item-row.drag-over{background:var(--color-accent-bg);border-color:rgba(var(--color-accent-rgb),0.28)}
      .item-row-thumb{width:40px;height:40px;border-radius:8px;overflow:hidden;flex-shrink:0;background:var(--color-control-surface);border:1px solid var(--color-detail-border);display:flex;align-items:center;justify-content:center;margin-right:10px;position:relative;color:var(--color-text-tertiary)}
      .item-row-thumb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
      .item-row-thumb-fallback{display:flex;align-items:center;justify-content:center;color:var(--color-text-tertiary);opacity:.7}
      .item-row-placeholder-icon{display:block}
      .item-row-nameline{display:flex;align-items:center;gap:6px;min-width:0}
      .item-row-name{flex:1;min-width:0;font-size:13px;font-weight:600;line-height:1.3;color:var(--color-text-primary);letter-spacing:0}
      .item-row-new-dot{width:6px;height:6px;border-radius:50%;background:var(--color-accent);flex-shrink:0}
      .item-row-sel-count{font-size:11px;line-height:18px;padding:0 7px;border-radius:999px;background:var(--color-success-bg);color:var(--color-success);font-weight:700;flex-shrink:0;font-variant-numeric:tabular-nums}
      .item-row-meta{display:flex;align-items:center;gap:6px;margin-top:3px;min-width:0;font-size:11px;line-height:1.3;color:var(--color-text-tertiary)}
      .item-state-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
      .item-state-dot.is-running{background:var(--color-accent)}
      .item-state-dot.is-partial{background:var(--color-warning)}
      .item-state-dot.is-error{background:var(--color-error)}
      .item-row-time{margin-left:auto;flex-shrink:0;font-size:11px;color:var(--color-text-tertiary);line-height:1.3;font-variant-numeric:tabular-nums;white-space:nowrap}
      /* 行内状态去胶囊:完成态只留灰字张数;异常才带色 */
      .item-row .status-badge{min-height:0;padding:0;border-radius:0;background:transparent;font-size:11px;font-weight:500;margin-left:0;letter-spacing:0;color:var(--color-text-secondary)}
      .item-row .status-badge.s-error{color:var(--color-error)}
      .item-row .detail-item-badge{margin-left:0;min-height:0;padding:0;border-radius:0;background:transparent;font-size:11px;font-weight:500;color:var(--color-text-secondary)}
      .item-row .detail-item-badge.running{color:var(--color-accent);background:transparent}
      .item-row .detail-item-badge.review{color:var(--color-warning);background:transparent}
      .item-row .detail-item-badge.failed{color:var(--color-error);background:transparent}
      .item-row .detail-item-badge.done{display:none}
      [data-theme="light"] .item-row.active{background:rgba(var(--color-accent-rgb),0.08);border-color:rgba(var(--color-accent-rgb),0.12)}
      [data-theme="light"] .item-row-thumb{background:rgba(0,0,0,0.035);border-color:rgba(0,0,0,0.06)}


.fl-glow{animation:fl-glow 3.5s ease-out infinite;transform-origin:12 13}.fl-ray{animation:fl-ray 3.5s ease-out infinite}@keyframes fl-glow{0%,82%,98%,100%{opacity:0;transform:scale(.4)}86%{opacity:1;transform:scale(1.2)}92%{opacity:.2;transform:scale(1.8)}}@keyframes fl-ray{0%,83%,97%,100%{opacity:0}86%,94%{opacity:.8}}

.tg-o{animation:tg-pulse 2.8s ease-in-out infinite}.tg-m{animation:tg-pulse 2.8s ease-in-out .3s infinite}.tg-i{animation:tg-pulse 2.8s ease-in-out .6s infinite}.tg-c{animation:tg-core 1.8s ease-in-out infinite}@keyframes tg-pulse{0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.05);opacity:1}}@keyframes tg-core{0%,100%{r:2}50%{r:2.5}}

.sm-p{animation:sm-float 3s ease-in-out infinite}.sm-w{animation:sm-wave 2.5s ease-in-out infinite;transform-origin:17 8}.sm-w2{animation:sm-wave 2.5s ease-in-out .4s infinite;transform-origin:17 8}@keyframes sm-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-.8px)}}@keyframes sm-wave{0%,100%{opacity:.3;transform:scale(1)}50%{opacity:.8;transform:scale(1.15)}}

.bs-ph{animation:bs-tilt 3.5s ease-in-out infinite;transform-origin:15 14}.bs-fl{animation:bs-flash 3.5s ease-out infinite}@keyframes bs-tilt{0%,100%{transform:rotate(0)}40%,60%{transform:rotate(3deg)}}@keyframes bs-flash{0%,78%,94%,100%{opacity:0}82%{opacity:1}88%{opacity:.3}90%{opacity:.9}}

.gl-b{animation:gl-spin 8s linear infinite;transform-origin:12 12}.gl-m{animation:gl-meridian 4s ease-in-out infinite}@keyframes gl-spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes gl-meridian{0%,100%{opacity:.5;transform:scaleX(1)}50%{opacity:.9;transform:scaleX(.9)}}
.wand-spark{animation:wand-tw 1.5s ease-in-out infinite}.wand-spark2{animation:wand-tw 1.5s ease-in-out .75s infinite}@keyframes wand-tw{0%,100%{opacity:.3}50%{opacity:1}}
.arrow{animation:arrow-hit 2.6s cubic-bezier(.5,.1,.25,1) infinite}@keyframes arrow-hit{0%,12%{transform:translate(8px,0);opacity:0}26%{opacity:1}42%,100%{transform:translate(0,0);opacity:1}}