/* 橙岛 ERP · 新版界面样式（紧凑、白卡片、黑色主按钮、紫色强调）。只在 body.yj 下生效。 */
body.yj {
  --page: #f3f5f9; --surface: #fff; --surface-muted: #f8f9fb; --hover: #f2f3f7; --line: #e6e8ee; --line-strong: #d6d9e1;
  --text: #111; --muted: #6b7280; --blue: #3b82f6; --blue-soft: #eef4ff; --yj-purple: #7c5cff; --yj-purple-soft: #f1edff; --yj-red: #ef4444;
  --sidebar: 168px; --topbar: 52px; --tabs: 36px; --shadow: none;
  font-size: 12px; background: var(--page);
}
body.yj[data-theme="dark"] { --page: #111315; --surface: #191b1e; --surface-muted: #151719; --hover: #23262a; --line: #2d3035; --line-strong: #3b3f45; --text: #f4f4f5; --muted: #a1a1aa; --yj-purple-soft: #2a2347; }

/* 侧栏 */
body.yj .sidebar { width: var(--sidebar); border-right: 1px solid var(--line); }
body.yj .brand { height: var(--topbar); padding: 0 14px; gap: 8px; }
body.yj .brand img { width: 26px; height: 26px; }
body.yj .brand b { font-size: 16px; color: var(--text); }
body.yj .brand em { font-size: 14px; color: #ff7a1a; }
body.yj .sidebar-scroll { padding: 8px 8px 16px; }
body.yj .nav-entry, body.yj .nav-group-head { min-height: 34px; gap: 8px; padding: 0 10px; font-size: 13px; font-weight: 500; color: #374151; border-radius: 8px; }
body.yj[data-theme="dark"] .nav-entry, body.yj[data-theme="dark"] .nav-group-head { color: var(--muted); }
body.yj .nav-entry svg, body.yj .nav-group-head svg { width: 16px; height: 16px; stroke-width: 1.8; }
body.yj .nav-entry:hover, body.yj .nav-group-head:hover { background: var(--hover); color: var(--text); }
body.yj .nav-entry.active { background: var(--yj-purple-soft); color: var(--yj-purple); font-weight: 600; }
body.yj .nav-group.has-active > .nav-group-head { color: var(--text); font-weight: 600; }
body.yj .nav-group-head .yj-chev { margin-left: auto; color: #9ca3af; width: 14px; height: 14px; }
body.yj .nav-group-head .yj-badge + .yj-chev { margin-left: 4px; }
body.yj .nav-children { padding: 2px 0 4px 16px; gap: 1px; }
body.yj .nav-children .nav-entry { min-height: 32px; padding: 0 8px; font-size: 12.5px; }
body.yj .nav-entry .badge { display: none; }
body.yj .yj-badge { margin-left: auto; padding: 0 5px; height: 16px; line-height: 15px; border-radius: 4px; font-size: 10px; font-weight: 600; border: 1px solid #f3dfb8; background: #fff7e6; color: #b26a00; white-space: nowrap; }
body.yj .yj-badge.soon { border-color: var(--line); background: var(--surface-muted); color: #9ca3af; }
body.yj .sidebar-footer { padding: 8px; }
body.yj .sidebar-footer button { height: 32px; font-size: 12px; padding: 0 10px; }
body.yj .sidebar.collapsed { width: 56px; }
body.yj .sidebar.collapsed .yj-badge, body.yj .sidebar.collapsed .yj-chev { display: none; }
body.yj .sidebar.collapsed + .mobile-backdrop + .workspace { margin-left: 56px; }
body.yj .workspace { margin-left: var(--sidebar); }

/* 顶栏 */
body.yj .topbar { height: var(--topbar); padding: 0 14px; gap: 8px; box-shadow: none; background: var(--surface); flex-wrap: nowrap; }
body.yj .topbar-left, body.yj .topbar-right { gap: 6px; }
body.yj .icon-btn { width: 30px; height: 30px; border-radius: 8px; }
body.yj .icon-btn svg { width: 17px; height: 17px; }
body.yj .workspace-button { display: none; }
body.yj .platform-button { height: 28px; padding: 0 10px; border-radius: 999px; font-size: 12px; border: 1px solid var(--line); background: var(--surface); }
body.yj .platform-button svg { width: 14px; height: 14px; }
body.yj .yj-crumb { display: flex; align-items: center; gap: 4px; margin-left: 6px; font-size: 13px; color: var(--muted); white-space: nowrap; }
body.yj .yj-crumb b { color: var(--text); font-weight: 600; }
body.yj .yj-crumb svg { color: #9ca3af; }
body.yj .yj-top-link, body.yj .commercial.download { height: 28px; display: inline-flex; align-items: center; gap: 4px; padding: 0 8px; border: 0; border-radius: 6px; background: transparent; color: #374151; font-size: 12px; font-weight: 500; white-space: nowrap; }
body.yj[data-theme="dark"] .yj-top-link, body.yj[data-theme="dark"] .commercial.download { color: var(--muted); }
body.yj .yj-top-link:hover, body.yj .commercial.download:hover { background: var(--hover); color: var(--text); }
body.yj .yj-top-link svg, body.yj .commercial.download svg { width: 14px; height: 14px; }
body.yj .yj-cs { height: 28px; display: inline-flex; align-items: center; gap: 4px; padding: 0 12px; border: 0; border-radius: 999px; background: var(--yj-purple); color: #fff; font-size: 12px; font-weight: 600; }
body.yj .yj-cs:hover { filter: brightness(1.06); }
body.yj .oz-points-badge { height: 28px !important; padding: 0 10px !important; border-radius: 999px !important; border: 1px solid #e3dcff !important; background: var(--yj-purple-soft) !important; color: var(--yj-purple) !important; font-size: 12px !important; gap: 4px !important; box-shadow: none !important; }
body.yj .oz-points-badge svg { width: 14px !important; height: 14px !important; }
body.yj .oz-points-badge b { color: var(--yj-purple) !important; font-weight: 700; }
body.yj .oz-points-badge em.oz-points-buy-tag { margin-left: 2px; padding: 0 6px; border-radius: 999px; background: var(--yj-purple) !important; color: #fff !important; font-size: 10px; font-style: normal; line-height: 16px; }
body.yj .account-button { width: 30px; height: 30px; border-radius: 999px; }
body.yj .yj-pop-wrap { position: relative; }
body.yj .yj-pop { position: absolute; top: calc(100% + 8px); right: 0; z-index: 80; min-width: 210px; display: none; flex-direction: column; gap: 2px; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: 0 10px 30px rgba(15, 23, 42, .12); }
body.yj .yj-pop.open { display: flex; }
body.yj .yj-pop strong { padding: 2px 6px 6px; font-size: 12px; }
body.yj .yj-pop button, body.yj .yj-pop a { display: flex; align-items: center; gap: 6px; height: 30px; padding: 0 8px; border: 0; border-radius: 6px; background: transparent; font-size: 12px; text-align: left; }
body.yj .yj-pop button:hover, body.yj .yj-pop a:hover { background: var(--hover); }
body.yj .yj-pop-cs { align-items: center; text-align: center; width: 220px; }
body.yj .yj-pop-cs img { width: 170px; height: 170px; object-fit: contain; border-radius: 8px; border: 1px solid var(--line); background: #fff; }
body.yj .yj-pop-cs small { margin-top: 6px; color: var(--muted); }
body.yj .yj-pop-empty { margin: 8px 6px 4px; color: var(--muted); }

/* 标签栏 */
body.yj .tabsbar { height: var(--tabs); min-height: var(--tabs); padding: 4px 10px 0; gap: 2px; align-items: flex-end; background: var(--page); border-bottom: 1px solid var(--line); }
body.yj .tab-button { height: 30px; padding: 0 10px; gap: 6px; border: 1px solid transparent; border-bottom: 0; border-radius: 8px 8px 0 0; background: transparent; color: var(--muted); font-size: 12px; font-weight: 500; box-shadow: none; }
body.yj .tab-button:hover { background: rgba(255, 255, 255, .6); color: var(--text); }
body.yj .tab-button.active { background: var(--surface); border-color: var(--line); color: var(--text); font-weight: 600; margin-bottom: -1px; height: 31px; }
body.yj .tab-button svg { width: 13px; height: 13px; }
body.yj .tab-close { width: 16px; height: 16px; display: inline-grid; place-items: center; border-radius: 4px; color: #9ca3af; font-size: 13px; font-weight: 400; }
body.yj .tab-close:hover { background: var(--hover); color: var(--text); }

/* 页面通用 */
body.yj .page-body { padding: 0; }
body.yj .page-container { max-width: none; padding: 12px 14px 24px; }
body.yj .page-heading { margin-bottom: 10px; gap: 10px; }
body.yj .page-heading h1 { font-size: 16px; font-weight: 650; letter-spacing: 0; }
body.yj .page-heading p { margin-top: 2px; font-size: 12px; color: var(--muted); }
body.yj .card { border: 1px solid var(--line); border-radius: 8px; box-shadow: none; background: var(--surface); }
body.yj .card-header { padding: 10px 14px; min-height: 0; }
body.yj .card-header h2 { font-size: 13px; }
body.yj .primary-btn, body.yj .secondary-btn { height: 28px; min-height: 28px; padding: 0 12px; gap: 5px; border-radius: 6px; font-size: 12px; font-weight: 500; box-shadow: none; }
body.yj .primary-btn { background: #111; border-color: #111; color: #fff; }
body.yj .primary-btn:hover { background: #2b2b2b; }
body.yj[data-theme="dark"] .primary-btn { background: #f4f4f5; border-color: #f4f4f5; color: #111; }
body.yj .secondary-btn { background: var(--surface); border: 1px solid var(--line-strong); color: var(--text); }
body.yj .secondary-btn:hover { background: var(--hover); }
body.yj .primary-btn svg, body.yj .secondary-btn svg { width: 14px; height: 14px; }
body.yj .input, body.yj .select, body.yj textarea.input { min-height: 28px; height: 28px; padding: 0 8px; border-radius: 6px; font-size: 12px; border-color: var(--line-strong); }
body.yj textarea.input { height: auto; padding: 6px 8px; }
body.yj .link-button { font-size: 12px; color: var(--blue); }
body.yj .status { padding: 1px 6px; border-radius: 4px; font-size: 11px; font-weight: 500; }
body.yj .data-table { font-size: 12px; }
body.yj .data-table th { height: 36px; padding: 0 10px; background: var(--surface-muted); color: #4b5563; font-size: 12px; font-weight: 600; border-bottom: 1px solid var(--line); }
body.yj .data-table td { padding: 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
body.yj .data-table tbody tr:hover td { background: #fafbff; }
body.yj[data-theme="dark"] .data-table tbody tr:hover td { background: var(--hover); }
body.yj .data-table tr.oz-selected td { background: #f5f3ff; }
body.yj .notice { padding: 8px 12px; border-radius: 8px; font-size: 12px; }
body.yj .empty-state h2 { font-size: 14px; }
body.yj .empty-state p { font-size: 12px; }
body.yj .mini-stats > div { padding: 10px 12px; border-radius: 8px; }
body.yj .mini-stats strong { font-size: 18px; }
body.yj .review-storage { margin: 0 0 8px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); font-size: 12px; color: var(--muted); line-height: 1.6; }
body.yj .review-storage br { display: none; }
body.yj .review-storage strong { margin-right: 8px; color: var(--text); font-weight: 600; }

/* 易见式部件 */
.yj-panel { overflow: visible; }
.yj-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.yj-toolbar-left, .yj-toolbar-right { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.yj-toolbar-right { margin-left: auto; justify-content: flex-end; }
.yj-btn, .yj-btn-dark { height: 28px; display: inline-flex; align-items: center; gap: 4px; padding: 0 10px; border-radius: 6px; font-size: 12px; font-weight: 500; white-space: nowrap; cursor: pointer; text-decoration: none; }
.yj-btn { border: 1px solid var(--line-strong); background: var(--surface); color: var(--text); }
.yj-btn:hover:not(:disabled) { background: var(--hover); }
.yj-btn-dark { border: 1px solid #111; background: #111; color: #fff; }
.yj-btn-dark:hover:not(:disabled) { background: #2b2b2b; }
body[data-theme="dark"] .yj-btn-dark { background: #f4f4f5; border-color: #f4f4f5; color: #111; }
.yj-btn:disabled, .yj-btn-dark:disabled { opacity: .45; cursor: not-allowed; }
.yj-btn.sm, .yj-btn-dark.sm { height: 26px; padding: 0 8px; }
.yj-btn.sq { width: 28px; padding: 0; justify-content: center; }
.yj-btn svg, .yj-btn-dark svg { width: 14px; height: 14px; }
.yj-btn-group { display: inline-flex; }
.yj-btn-group .yj-select { border-radius: 6px 0 0 6px; border-right: 0; max-width: 130px; }
.yj-btn-group .yj-btn { border-radius: 0 6px 6px 0; }
.yj-select { height: 28px; padding: 0 24px 0 8px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); color: var(--text); font-size: 12px; }
.yj-counter { display: inline-flex; align-items: center; gap: 4px; height: 28px; padding: 0 8px; border-radius: 6px; background: var(--surface-muted); border: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.yj-counter b { color: var(--text); }
.yj-x { border: 0; background: transparent; color: var(--muted); font-size: 14px; padding: 0 2px; }
.yj-filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; }
.yj-search { display: inline-flex; align-items: center; gap: 6px; height: 28px; min-width: 240px; padding: 0 8px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); color: #9ca3af; }
.yj-search.wide { min-width: 320px; }
.yj-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 12px; }
.yj-search:focus-within { border-color: var(--yj-purple); box-shadow: 0 0 0 2px var(--yj-purple-soft); }
.yj-grow { flex: 1; }
.yj-table-wrap { overflow-x: auto; border-top: 1px solid var(--line); }
.yj-table { width: 100%; }
.yj-table .product-thumb { width: 56px; height: 56px; flex: 0 0 56px; border-radius: 6px; border: 1px solid var(--line); background: var(--surface-muted); }
.yj-prod { display: flex; align-items: center; gap: 10px; min-width: 0; }
.yj-prod-main { min-width: 0; display: grid; gap: 4px; }
.yj-prod-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 12.5px; font-weight: 500; line-height: 1.45; color: var(--text); max-width: 520px; }
.yj-prod-sub { color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 480px; }
.yj-prod-tags { display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.yj-prod-tags .status { font-size: 11px; }
.yj-pill { display: inline-flex; align-items: center; height: 18px; padding: 0 6px; border-radius: 4px; background: var(--surface-muted); border: 1px solid var(--line); color: #4b5563; font-size: 11px; }
.yj-tag { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 4px; font-size: 11px; font-weight: 500; background: #f3f4f6; color: #4b5563; border: 1px solid transparent; white-space: nowrap; }
.yj-tag.warn { background: #fff4e5; color: #d46b08; border-color: #ffe0b8; }
.yj-tag.ok { background: #eafaf1; color: #16a34a; border-color: #c7efd8; }
.yj-tag.info { background: #eef4ff; color: #3b82f6; border-color: #d6e4ff; }
.yj-tag.error { background: #fef2f2; color: #ef4444; border-color: #fdd5d5; }
.yj-tag-btn { cursor: pointer; }
.yj-src-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text); }
.yj-src-badge i { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 3px; border-radius: 5px; color: #fff; font-size: 10px; font-style: normal; font-weight: 700; }
.yj-srcinfo { display: grid; gap: 3px; color: var(--muted); font-size: 12px; }
.yj-srcinfo a { color: var(--blue); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 230px; display: block; }
.yj-srcinfo b { color: var(--text); font-weight: 600; }
.yj-srcinfo em, .yj-muted { color: #9ca3af; font-style: normal; }
.yj-time { color: #374151; font-size: 12px; white-space: nowrap; }
.yj-time small { display: block; margin-top: 3px; color: #9ca3af; overflow: hidden; text-overflow: ellipsis; max-width: 140px; }
.yj-cat { color: #4b5563; font-size: 12px; }
.yj-ops { display: flex; align-items: center; justify-content: center; gap: 4px; }
.yj-more { position: relative; }
.yj-more summary { list-style: none; width: 26px; height: 26px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 6px; cursor: pointer; color: #4b5563; background: var(--surface); }
.yj-more summary::-webkit-details-marker { display: none; }
.yj-menu { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; min-width: 140px; display: grid; padding: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: 0 10px 24px rgba(15, 23, 42, .12); }
.yj-menu button { display: flex; align-items: center; gap: 6px; height: 30px; padding: 0 8px; border: 0; border-radius: 6px; background: transparent; font-size: 12px; text-align: left; white-space: nowrap; }
.yj-menu button:hover { background: var(--hover); }
.yj-menu button.danger { color: var(--yj-red); }
.yj-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.yj-pager { display: flex; align-items: center; gap: 4px; }
.yj-pager button { width: 26px; height: 26px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); color: var(--text); font-size: 13px; }
.yj-pager button:disabled { opacity: .4; cursor: default; }
.yj-page-now { min-width: 30px; height: 26px; display: inline-grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 6px; color: var(--text); }
.yj-pagesize { margin-left: 6px; padding: 0 8px; height: 26px; display: inline-grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 6px; }
.yj-empty-actions { display: flex; gap: 8px; justify-content: center; margin-top: 10px; }
.yj-stabs { display: inline-flex; gap: 2px; padding: 2px; border-radius: 8px; background: var(--surface-muted); border: 1px solid var(--line); }
.yj-stab { height: 26px; display: inline-flex; align-items: center; gap: 6px; padding: 0 10px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); font-size: 12px; }
.yj-stab.active { background: var(--surface); color: var(--text); font-weight: 600; box-shadow: 0 1px 2px rgba(15, 23, 42, .08); }
.yj-count { display: inline-grid; place-items: center; min-width: 18px; height: 16px; padding: 0 5px; border-radius: 999px; background: #eceef3; color: #4b5563; font-size: 10px; font-weight: 600; }
.yj-count.warn { background: #fff1de; color: #d46b08; }
.yj-count.ok { background: #e3f7ec; color: #16a34a; }
.yj-count.info { background: #e6efff; color: #3b82f6; }
.yj-stabs-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 12px 10px; }
.yj-rail { display: flex; align-items: center; gap: 6px; color: #9ca3af; font-size: 12px; }
.yj-rail b { width: 14px; height: 1px; background: var(--line-strong); }
.yj-rail .done { color: #16a34a; }
.yj-rail .active { color: var(--yj-purple); font-weight: 600; }
.yj-note { display: flex; gap: 8px; align-items: flex-start; margin-top: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--muted); font-size: 12px; line-height: 1.6; }
.yj-note svg { flex: 0 0 auto; color: #16a34a; margin-top: 2px; }
.yj-note strong, .yj-note b { color: var(--text); }
body.yj .oz-cloud { margin: 0; font-size: 12px; color: var(--muted); }
body.yj .oz-page .oz-cloud { padding: 0; border: 0; background: transparent; }
.yj-related { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 8px 12px; margin-bottom: 10px; font-size: 12px; }
.yj-related b { margin-right: 6px; }
.yj-related button { display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface-muted); font-size: 12px; color: #374151; }
.yj-related button:hover { border-color: var(--yj-purple); color: var(--yj-purple); }
.yj-seg { display: inline-flex; gap: 2px; padding: 2px; border-radius: 8px; background: var(--surface-muted); border: 1px solid var(--line); }
.yj-seg button { height: 26px; display: inline-flex; align-items: center; gap: 5px; padding: 0 12px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); font-size: 12px; }
.yj-seg button.active { background: #111; color: #fff; font-weight: 600; }
.yj-seg button.active .yj-count { background: rgba(255, 255, 255, .2); color: #fff; }
.yj-seg-page { margin-bottom: 10px; background: var(--surface); }
.yj-chip { display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 8px; border: 1px dashed var(--line-strong); border-radius: 6px; background: var(--surface); color: var(--muted); font-size: 12px; max-width: 320px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.yj-chip.ok { border-style: solid; border-color: #c7efd8; background: #eafaf1; color: #16a34a; }
.yj-storage { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--muted); }
.yj-storage b { color: var(--text); }
.yj-bar { width: 180px; height: 6px; border-radius: 999px; background: #eceef3; overflow: hidden; }
.yj-bar i { display: block; height: 100%; background: var(--yj-purple); border-radius: 999px; }
.yj-img-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; padding: 12px; }
@media (max-width: 1100px) { .yj-img-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.yj-img-card { position: relative; margin: 0; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: var(--surface); }
.yj-img-box { aspect-ratio: 1; display: grid; place-items: center; background: var(--surface-muted); }
.yj-img-box img { width: 100%; height: 100%; object-fit: cover; }
.yj-img-card figcaption { display: grid; gap: 2px; padding: 8px; font-size: 12px; }
.yj-img-card figcaption b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yj-img-card figcaption small { color: #9ca3af; }
.yj-img-ops { position: absolute; top: 6px; right: 6px; display: none; gap: 4px; }
.yj-img-card:hover .yj-img-ops { display: flex; }
.yj-img-ops button, .yj-img-ops a { width: 26px; height: 26px; display: grid; place-items: center; border: 0; border-radius: 6px; background: rgba(17, 17, 17, .72); color: #fff; }
.yj-soon { display: grid; justify-items: center; gap: 8px; padding: 56px 24px; text-align: center; color: var(--muted); }
.yj-soon > svg { color: var(--yj-purple); }
.yj-soon h2 { margin: 4px 0 0; font-size: 16px; color: var(--text); }
.yj-soon p { margin: 0; max-width: 520px; font-size: 12px; line-height: 1.7; }
.yj-soon-links { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: center; margin-top: 10px; }

/* 信息加工页：覆盖在工作区上（不遮侧栏和顶栏） */
body.yj dialog#ozWorkbench.oz-workbench { position: fixed; inset: calc(var(--topbar) + var(--tabs)) 0 0 var(--sidebar); width: auto; max-width: none; height: auto; max-height: none; margin: 0; padding: 0; border: 0; border-radius: 0; background: var(--page); box-shadow: none; z-index: 44; display: flex; flex-direction: column; overflow: hidden; }
body.yj .sidebar.collapsed ~ dialog#ozWorkbench, body.yj.yj-collapsed dialog#ozWorkbench.oz-workbench { left: 56px; }
@media (max-width: 1023px) { body.yj dialog#ozWorkbench.oz-workbench { left: 0; } }
.yj-wb-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 14px; background: var(--surface); border-bottom: 1px solid var(--line); }
.yj-wb-crumb { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--muted); }
.yj-wb-crumb b { color: var(--text); font-size: 14px; }
.yj-wb-stat b.warn { color: #d46b08; }
.yj-wb-scroll { flex: 1; min-height: 0; overflow: auto; padding: 12px 14px; }
.yj-wb-card { border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.yj-wb-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.yj-wb-idx { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 6px; background: var(--surface-muted); border: 1px solid var(--line); font-size: 11px; color: var(--muted); }
.yj-wb-row .product-thumb { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 6px; border: 1px solid var(--line); }
.yj-wb-title { flex: 1; min-width: 0; display: grid; gap: 2px; }
.yj-wb-title strong { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yj-wb-title small { color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yj-wb-title a { color: var(--blue); }
.yj-wb-meta { color: var(--muted); font-size: 12px; padding: 0 6px; border-left: 1px solid var(--line); white-space: nowrap; }
.yj-wb-tools { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 8px 12px; border-bottom: 1px solid var(--line); }
.yj-wb-tools-right { margin-left: auto; display: flex; gap: 6px; }
.yj-wb-tools [data-oz-ai-set] { border-color: #d9ceff; color: var(--yj-purple); }
.yj-wb-tools [data-oz-ai-text] { border-color: #cfe0ff; color: var(--blue); }
body.yj #ozWorkbench .oz-wb-body { padding: 14px; overflow: visible; max-height: none; }
body.yj #ozWorkbench .oz-wb-body h3 { font-size: 13px; }
body.yj #ozWorkbench .oz-wb-body label > span { font-size: 12px; }
.yj-wb-foot { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 10px 14px; background: var(--surface); border-top: 1px solid var(--line); }
.yj-wb-sum { margin-right: auto; display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; }
.yj-wb-sum b { color: var(--text); }
.yj-wb-sum i { width: 1px; height: 12px; background: var(--line-strong); }

/* 其他弹窗统一圆角与按钮 */
body.yj dialog.oz-payload, body.yj #ozPointsPanel { border-radius: 12px; border: 1px solid var(--line); }
body.yj .oz-tabs button.active { color: var(--yj-purple); border-color: var(--yj-purple); }
body.yj .nav-entry > span:not(.yj-badge), body.yj .nav-group-head > span:not(.yj-badge) { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.yj .yj-badge { flex: 0 0 auto; }
body.yj .sidebar { --sidebar: 176px; }
body.yj { --sidebar: 176px; }
body.yj, body.yj .sidebar { --sidebar: 184px; }
body.yj .nav-entry > span:not(.yj-badge), body.yj .nav-group-head > span:not(.yj-badge) { flex: 0 0 auto; max-width: 104px; }
body.yj .nav-children { padding-left: 10px; }
body.yj .yj-badge { padding: 0 4px; font-size: 9.5px; height: 15px; line-height: 14px; }
body.yj .nav-entry.is-soon { color: #9ca3af; }
body.yj .nav-entry.is-soon.active { color: var(--yj-purple); }

/* ===== v2 设计参数（2026-10-27b）：按参考站实测数值独立重写 =====
 * 页面底 #f7f8fa · 卡片 #fff · 分隔线 #e4e4e7 / 强 #d4d4d8 · 正文 #18181b · 次要 #71717a · 悬停 #f4f4f5
 * 侧栏 256/68 · 顶栏 56 · 标签栏 42（标签 34 高、上圆角 10）· 卡片圆角 10 · 控件圆角 8/6 · 阴影 0 1px 2px rgba(15,23,42,.04)
 * 导航：默认 #68707a，悬停/当前 #111827，二级当前 紫字 #6d28d9 + 浅紫底 #ede9fe；new 标记琥珀色呼吸光 */
body.yj {
  --page: #f7f8fa; --surface: #fff; --surface-muted: #fafafa; --hover: #f4f4f5; --line: #e4e4e7; --line-strong: #d4d4d8;
  --text: #18181b; --muted: #71717a; --blue: #2563eb; --blue-soft: #eff6ff; --yj-purple: #6d28d9; --yj-purple-soft: #ede9fe; --yj-red: #dc2626;
  --topbar: 56px; --tabs: 42px; --yj-radius: 10px; --yj-shadow: 0 1px 2px rgba(15, 23, 42, .04);
  font-family: Inter, "PingFang SC", "Noto Sans SC", "Microsoft YaHei UI", system-ui, sans-serif;
}
body.yj, body.yj .sidebar { --sidebar: 256px; }
body.yj .sidebar.collapsed { width: 68px; }
body.yj .sidebar.collapsed + .mobile-backdrop + .workspace { margin-left: 68px; }
body.yj .sidebar.collapsed ~ dialog#ozWorkbench, body.yj.yj-collapsed dialog#ozWorkbench.oz-workbench { left: 68px; }
body.yj .sidebar-scroll { padding: 10px 12px 16px; }
body.yj .nav-entry, body.yj .nav-group-head { min-height: 36px; padding: 0 10px; font-size: 13px; color: #68707a; border-radius: var(--yj-radius); }
body.yj .nav-entry svg, body.yj .nav-group-head svg { color: currentColor; }
body.yj .nav-entry:hover, body.yj .nav-group-head:hover { background: transparent; color: #111827; }
body.yj .nav-group.has-active > .nav-group-head { color: var(--yj-purple); font-weight: 600; }
body.yj .nav-entry.active { background: var(--yj-purple-soft); color: var(--yj-purple); font-weight: 600; }
body.yj .nav-children { padding-left: 14px; }
body.yj .nav-children .nav-entry { min-height: 34px; font-size: 13px; }
body.yj .nav-entry > span:not(.yj-badge), body.yj .nav-group-head > span:not(.yj-badge) { flex: 0 1 auto; max-width: 168px; }
body.yj .nav-entry.is-soon { color: #a1a1aa; }
body.yj .yj-nav-sec { margin: 14px 10px 4px; font-size: 11px; font-weight: 600; letter-spacing: .04em; color: #a1a1aa; }
body.yj .sidebar.collapsed .yj-nav-sec { margin: 10px 0 4px; height: 1px; overflow: hidden; color: transparent; background: var(--line); }
body.yj .yj-badge.new, body.yj .yj-badge:not(.soon) { animation: yjNewGlow 3s ease-in-out infinite; }
@keyframes yjNewGlow { 0%, 100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); } 50% { box-shadow: 0 0 0 3px rgba(245, 158, 11, .14); } }
@media (prefers-reduced-motion: reduce) { body.yj .yj-badge { animation: none !important; } }
body.yj .topbar { height: var(--topbar); padding: 0 16px; box-shadow: var(--yj-shadow); border-bottom: 1px solid var(--line); background: rgba(255, 255, 255, .96); }
body.yj .icon-btn { border-radius: 8px; color: var(--muted); }
body.yj .icon-btn:hover { background: var(--hover); color: var(--text); }
body.yj .tabsbar { height: var(--tabs); min-height: var(--tabs); padding: 0 8px 0 10px; gap: 0; background: #f3f4f6; border-bottom: 0; box-shadow: inset 0 -1px #d8dde5; }
body.yj .tab-button { position: relative; height: 34px; margin-top: 6px; min-width: 76px; max-width: 190px; padding: 0 12px; border-radius: 10px 10px 0 0; color: #5f6975; font-size: 13.5px; font-weight: 500; }
body.yj .tab-button:not(.active)::after { content: ""; position: absolute; top: 8px; bottom: 8px; right: 0; width: 1px; background: #d8dde5; }
body.yj .tab-button:hover { background: transparent; color: #5f6975; }
body.yj .tab-button.active { height: 34px; margin-bottom: 0; background: #fff; border-color: #d8dde5; color: #111827; font-weight: 500; }
body.yj .tab-button.active::before { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: #fff; }
body.yj .tab-close { border-radius: 999px; color: #8a939d; }
body.yj .card, body.yj .yj-panel { border-radius: var(--yj-radius); box-shadow: var(--yj-shadow); }
body.yj .primary-btn, body.yj .yj-btn-dark { background: #171717; border-color: #171717; }
body.yj .primary-btn:hover, body.yj .yj-btn-dark:hover { background: #262626; }
body.yj .secondary-btn, body.yj .yj-btn { border-color: var(--line-strong); border-radius: 8px; }
body.yj .secondary-btn:hover, body.yj .yj-btn:hover { border-color: #a3a3a3; background: var(--hover); }
body.yj .input, body.yj .select, body.yj .yj-select { border-color: var(--line-strong); border-radius: 8px; }
body.yj .input:focus, body.yj .select:focus { box-shadow: 0 0 0 3px rgba(24, 24, 27, .16); border-color: #a3a3a3; outline: 0; }
body.yj .data-table th { background: #fafafa; color: #52525b; font-weight: 600; }
body.yj .data-table tbody tr:hover td { background: #fafafa; }
body.yj .data-table tr.oz-selected td { background: #f5f3ff; }
body.yj .link-button { color: var(--blue); }
body.yj[data-theme="dark"] { --page: #111315; --surface: #191b1e; --surface-muted: #151719; --hover: #23262a; --line: #2d3035; --line-strong: #3b3f45; --text: #f4f4f5; --muted: #a1a1aa; --yj-purple: #a78bfa; --yj-purple-soft: #2a2347; }
body.yj[data-theme="dark"] .tabsbar { background: var(--page); box-shadow: inset 0 -1px var(--line); }
body.yj[data-theme="dark"] .tab-button.active, body.yj[data-theme="dark"] .tab-button.active::before { background: var(--surface); color: var(--text); }
body.yj[data-theme="dark"] .topbar { background: var(--surface); }
/* 人民币价格输入 */
.oz-cny-in { display: inline-flex; align-items: center; gap: 2px; }
.oz-cny-in i { font-style: normal; color: var(--muted, #71717a); font-size: 12px; }
.oz-cny-in .input { min-width: 70px; }
.oz-legacy-price { display: block; margin-top: 2px; color: #b45309; font-size: 11px; }
.yj-strike { text-decoration: line-through; color: var(--muted, #71717a); }
/* 规划页版面预览 */
.yj-plan { margin-top: 12px; }
.yj-plan-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.yj-plan .yj-stab[disabled] { cursor: default; opacity: .85; }
.yj-plan-filter { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border: 1px dashed var(--line-strong); border-radius: 8px; color: var(--muted); font-size: 12px; background: var(--surface); }
.yj-plan-empty { height: 72px; text-align: center; color: #a1a1aa; }
body.yj .yj-soon:has(+ .yj-plan) { padding-top: 22px; padding-bottom: 22px; min-height: 0; }
.yj-plan .yj-stabs-row { padding: 10px 12px 0; }
.yj-plan .yj-filters { padding: 10px 12px; }
body.yj .data-table td.yj-plan-empty { text-align: center; height: 72px; color: #a1a1aa; }

/* ---------- v3：工作台新版 / 首屏不闪旧版 / 暗色修正 ---------- */
body.yj:not(.yj-ready) #sidebarNav, body.yj:not(.yj-ready) #pageBody, body.yj:not(.yj-ready) .tabsbar { visibility: hidden; }
.yj-home { display: flex; flex-direction: column; gap: 12px; }
.yj-home-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.yj-home-head h1 { margin: 0 0 4px; font-size: 18px; font-weight: 600; color: var(--text); }
.yj-home-head p { margin: 0; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; font-size: 12px; color: var(--muted); }
.yj-home-head p svg { width: 13px; height: 13px; }
.yj-home-head [data-cloud-status] { color: var(--text); font-weight: 500; }
.yj-home-sub { margin-left: 8px; }
.yj-home-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.yj-home-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.yj-home-kpi { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 12px 14px; text-align: left; border: 1px solid var(--line); border-radius: var(--yj-radius, 10px); background: var(--surface); box-shadow: var(--yj-shadow); cursor: pointer; color: var(--text); }
.yj-home-kpi:hover { border-color: var(--yj-purple); }
.yj-home-kpi-l { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--muted); }
.yj-home-kpi-l svg { width: 14px; height: 14px; }
.yj-home-kpi strong { font-size: 22px; font-weight: 600; line-height: 1.2; }
.yj-home-kpi small { font-size: 11px; color: var(--muted); }
.yj-home-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 12px; }
.yj-home-card { border: 1px solid var(--line); background: var(--surface); }
.yj-home-card > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--line); font-size: 13px; }
.yj-home-card > header small { color: var(--muted); font-size: 12px; font-weight: 400; }
.yj-home-flow { display: flex; align-items: center; gap: 6px; padding: 14px; }
.yj-home-flow button { flex: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-muted); color: var(--text); font-size: 12px; cursor: pointer; text-align: left; }
.yj-home-flow button:hover { border-color: var(--yj-purple); }
.yj-home-flow button svg { width: 16px; height: 16px; color: var(--yj-purple); }
.yj-home-flow button strong { font-size: 18px; font-weight: 600; }
.yj-home-flow button.warn svg, .yj-home-flow button.warn strong { color: var(--yj-red); }
.yj-home-arrow { display: inline-flex; color: var(--muted); }
.yj-home-arrow svg { width: 14px; height: 14px; }
.yj-home-quick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; padding: 12px; }
.yj-home-quick button { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 4px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--text); font-size: 12px; cursor: pointer; }
.yj-home-quick button:hover { background: var(--hover); border-color: var(--line); }
.yj-home-quick button svg { width: 18px; height: 18px; color: var(--yj-purple); }
.yj-home-table tbody tr { cursor: pointer; }
.yj-home-table td, .yj-home-table th { padding: 8px 14px; font-size: 12px; text-align: left; }
.yj-home .yj-tag { display: inline-flex; padding: 1px 8px; border-radius: 999px; background: var(--yj-purple-soft); color: var(--yj-purple); font-size: 11px; }
.yj-home-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 28px 12px; color: var(--muted); font-size: 12px; }
.yj-home-empty p { margin: 0; }
.yj-home-loading { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 240px; color: var(--muted); font-size: 13px; }
.yj-home-loading svg { animation: yj-spin 1s linear infinite; }
@keyframes yj-spin { to { transform: rotate(360deg); } }
@media (max-width: 1200px) { .yj-home-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } .yj-home-grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .yj-home-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .yj-home-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); } .yj-home-flow { flex-wrap: wrap; } .yj-home-arrow { display: none; } }
body.yj #platformMenu [data-platform="tiktok"] { opacity: .5; cursor: not-allowed; }
body.yj[data-theme="dark"] .primary-btn, body.yj[data-theme="dark"] .yj-btn-dark { background: #f4f4f5; border-color: #f4f4f5; color: #111; }
body.yj[data-theme="dark"] .primary-btn:hover, body.yj[data-theme="dark"] .yj-btn-dark:hover { background: #e4e4e7; }
body.yj[data-theme="dark"] .tab-button:not(.active)::after { background: var(--line); }

/* ---------- v4：易见式概览（工作台） ---------- */
.yj-ov .yj-ov-metric { appearance: none; border: 0; background: transparent; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.yj-ov .yj-ov-metric:not([data-route]) { cursor: default; }
.yj-ov .yj-ov-metric small { display: block; margin-top: 2px; font-size: 11px; color: var(--muted); font-weight: 400; }
.yj-ov .step.yj-done .step-number { background: #16a34a; color: #fff; }
.yj-ov a.quick-item { text-decoration: none; color: inherit; }
.yj-ov .video .duration { font-size: 10px; }
.yj-ov-ws { display: flex; align-items: center; gap: 18px; padding: 14px 18px; flex-wrap: wrap; }
.yj-ov-ws-head { display: flex; flex-direction: column; gap: 2px; min-width: 200px; }
.yj-ov-ws-head b { font-size: 14px; color: var(--text); }
.yj-ov-ws-head small { font-size: 12px; color: var(--muted); }
.yj-ov-ws-row { flex: 1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.yj-ov-ws-row button { appearance: none; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); padding: 8px 12px; display: flex; justify-content: space-between; align-items: center; font: inherit; color: var(--text); cursor: pointer; }
.yj-ov-ws-row button span { font-size: 12px; color: var(--muted); }
.yj-ov-ws-row button strong { font-size: 18px; }
.yj-ov-ws-row button:hover { border-color: #a78bfa; }
.yj-ov-cloud { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 2px 4px 8px; font-size: 12px; color: var(--muted); }
.yj-ov-cloud svg { width: 12px; height: 12px; }
.yj-ov-cloud button { appearance: none; border: 0; background: none; padding: 0; font: inherit; color: #6d28d9; cursor: pointer; }
.yj-ov-cloud button:hover { text-decoration: underline; }
@media (max-width: 900px) { .yj-ov-ws-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
