/* TPOAD Review 后台样式（2026-09-23 从 admin.html 拆出；服务器按文件名顺序拼成 /admin-app.css） */
:root { --admin-css-ok: 1; }
/* ---------- 登录：与 Transfer 员工登录页同构（左大标题 + 右微旋转卡片） ---------- */
.login { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; align-items: center; padding: 56px 0 48px; min-height: calc(100dvh - 64px - 110px); }
.login__brand { display: flex; flex-direction: column; gap: 26px; animation: rise 700ms var(--ease-out) both; }
.login__headline { margin: 0; font-size: clamp(36px, 4.6vw, 56px); line-height: 1.1; font-weight: 600; }
html[lang="en"] .login__headline { font-family: var(--font-latin); font-size: clamp(40px, 5.2vw, 64px); line-height: 1.02; letter-spacing: -0.03em; }
.login__headline span { display: block; }
.login__headline .is-red { color: var(--red); }
.login__lede { margin: 0; max-width: 440px; color: var(--ink-2); font-size: 16px; line-height: 1.65; }
.login__pills { display: flex; flex-wrap: wrap; gap: 10px; }
/* 旋转用独立的 rotate 属性：rise 动画结束帧是 transform:none，写在 transform 里会被覆盖，只剩子元素的反向旋转，内容就歪了 */
.login__card { position: relative; background: var(--card); border-radius: 26px; padding: 36px 36px 30px; border: 1px solid var(--line); box-shadow: 0 16px 40px rgba(17,16,14,.08); rotate: -.6deg; animation: rise 800ms var(--ease-out) 120ms both; }
.login__card > * { rotate: .6deg; }
/* 记住密码（只在桌面版里显示）：小勾选，不抢登录按钮 */
.login__keep { display: flex; align-items: center; gap: 8px; margin: 2px 0 12px; font-size: 13px; color: var(--ink-2); cursor: pointer; }
.login__keep[hidden] { display: none; }
.login__keep input { width: 15px; height: 15px; margin: 0; accent-color: var(--red); }
.login__card h2 { margin: 10px 0 6px; font-size: 28px; font-weight: 600; }
.login__card p { margin: 0 0 22px; color: var(--muted); font-size: 14.5px; }
.field { display: flex; flex-direction: column; gap: 7px; margin-bottom: 14px; }
.field span { font-size: 12.5px; font-weight: 600; color: var(--ink-2); }
.field .input { height: 42px; font-size: 15px; }
.login__btn { width: 100%; margin-top: 8px; height: 42px; font-size: 15px; }
.login__err { margin: 12px 0 0; color: var(--danger); font-size: 13.5px; white-space: pre-wrap; }
/* 要写成两级选择器：.login__card p 的 margin 优先级更高，会把上边距清零，说明文字就贴在按钮上 */
.login__card .login__foot { margin: 18px 0 0; font-size: 12.5px; color: var(--muted); }

/* ---------- 控制台 ---------- */
.tabs { display: flex; gap: 4px; padding: 4px; margin: 0 0 18px; border-radius: 16px; background: rgba(17,16,14,.06); width: fit-content; max-width: 100%; overflow-x: auto; animation: rise 600ms var(--ease-out) 40ms both; }
.tab { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 13px; border: 0; border-radius: 10px; background: transparent; color: var(--ink-2); font-size: 14px; font-weight: 500; white-space: nowrap; transition: background 160ms var(--ease-out), color 160ms, box-shadow 160ms; }
.tab svg { width: 16px; height: 16px; flex: none; }
.tab:hover { color: var(--ink); }
.tab.is-on { background: var(--card); color: var(--red-deep); font-weight: 600; box-shadow: 0 1px 2px rgba(17,16,14,.08), 0 4px 12px -4px rgba(17,16,14,.14); }
.panel { margin: 0 0 18px; overflow: hidden; animation: rise 700ms var(--ease-out) 80ms both; }
.panel__head { display: flex; align-items: center; gap: 10px; padding: 16px 18px 6px; flex-wrap: wrap; }
.panel__head h2 { margin: 0; font-size: 16px; font-weight: 600; }
.panel__body { padding: 10px 18px 18px; }
.stepno { width: 28px; height: 28px; flex: none; border-radius: 9px; display: grid; place-items: center; color: #fff; font-size: 13px; font-weight: 700; background: linear-gradient(135deg, var(--red), var(--amber)); }
#sendUpload .stepno { background: linear-gradient(135deg, var(--teal), var(--blue)); }
#sendRound .stepno { background: linear-gradient(135deg, var(--violet), var(--red)); }
.count { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: var(--radius-pill); font-size: 12.5px; font-weight: 600; background: rgba(var(--accent-rgb),.10); color: var(--red-deep); }
.count:empty { display: none; }
.toolbar-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.toolbar-row .grow { flex: 1; }
.toolbar-row select.input { width: auto; min-width: min(420px, 100%); max-width: 100%; height: 38px; }
.exportOut:not(:empty) { margin-top: 14px; padding: 14px 16px; border-radius: 14px; background: linear-gradient(135deg, rgba(22,183,170,.10), rgba(150,169,255,.12)); font-size: 13.5px; line-height: 1.8; color: var(--ink-2); animation: pop 300ms var(--ease-out) both; }
.exportOut code { background: rgba(255,255,255,.7); }
.help { margin: 0 22px 8px; color: var(--muted); font-size: 13px; line-height: 1.6; }
.subhead { margin: 8px 0 10px; font-size: 14px; font-weight: 600; color: var(--ink-2); }
.note { margin: 0 0 18px; padding: 14px 16px; border-radius: 14px; background: rgba(255,176,32,.14); color: #6b4a00; font-size: 14px; }
.form-msg { margin-top: 10px; font-size: 13.5px; white-space: pre-wrap; line-height: 1.6; }
.form-msg.ok { color: var(--ok); font-weight: 600; }
.form-msg.err { color: var(--danger); }
.strong { font-weight: 600; }
.nowrap { white-space: nowrap; }
.actions { white-space: nowrap; }
.actions .btn { margin: 2px 6px 2px 0; }
/* 旧链接的说明文字允许换行，不能把撤销按钮挤出卡片 */
.actions .not-copyable { display: inline-block; margin-right: 8px; white-space: normal; cursor: help; border-bottom: 1px dotted currentColor; }
.btn--danger { color: var(--danger); border-color: rgba(var(--danger-rgb),.35); }
/* 删除类确认按钮：实底危险红，不跟主题变色 */
.btn.btn--danger-solid { background: var(--danger); color: #fff; }
.btn.btn--danger-solid:hover { background: #b8231b; }
.btn--danger:hover { background: rgba(var(--danger-rgb),.06); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); border: 0; }

.tablewrap { overflow-x: auto; padding: 0 10px 10px; }
table { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 860px; }
[data-panel="users"] table { min-width: 760px; }
/* 2026-09-14 老板「这种布局我不喜欢，完整展示列表」：项目右侧那栏放不下 8 列，轮次名被挤成一字一行、按钮要横向滚动。
   已发出的链接改成一条一行的完整列表：第一行轮次 + 状态，第二行链接类型，第三行创建人 / 时间 / 打开次数 + 操作；窄了自动换行，不横向滚动。
   仍保留 table / tr 结构（测试与手机单栏依赖）；用 id 选择器压过手机 .tablewrap 规则。 */
#sharesTableWrap { overflow: visible; padding: 0 22px 8px; }
#sendLinks table, #sendLinks tbody { display: block; width: 100%; min-width: 0; }
#sendLinks thead { display: none; }
/* 悬停浅灰底左右各放出 14px，不贴着文字和按钮（老板 9-26）：负外边距＋同样的内边距，文字仍和卡片标题对齐。
   分隔线不用 border-bottom——配上圆角两端会沿圆角上弯——改成内缩 14px 的 1px 背景线，和文字同宽；悬停时灰底整块盖掉它 */
#sendLinks tr { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 28px; width: auto; margin: 0 -14px; padding: 16px 14px; border: 0; border-radius: 12px;
  background: linear-gradient(var(--line), var(--line)) no-repeat 14px 100% / calc(100% - 28px) 1px; }
#sendLinks tbody tr:last-child { background-image: none; }
#sendLinks tbody tr:hover { background: rgba(17,16,14,.025); }
#sendLinks td { display: block; width: auto; padding: 0; border: 0; line-height: 1.5; }
#sendLinks .lk-round { order: 0; flex: 1 1 0; min-width: 0; align-self: flex-start; font-size: 15px; overflow-wrap: anywhere; }
#sendLinks .lk-status { order: 1; flex: none; align-self: flex-start; }
#sendLinks .lk-kind { order: 2; flex: 0 0 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: -2px; }
#sendLinks .lk-meta { order: 3; flex: none; font-size: 13.5px; }
#sendLinks td[data-label]::before { content: attr(data-label); display: block; margin: 0 0 1px; font-size: 11.5px; font-weight: 600; color: var(--muted); }
#sendLinks .lk-actions { order: 4; margin-left: auto; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; white-space: normal; padding: 0; }
#sendLinks .lk-actions .btn { margin: 0; }
#sendLinks .lk-actions:empty { display: none; }
#secLogWrap table { min-width: 0; }
/* 2026-09-14 桌面版改成一个窗口：本机处理队列（只在 TPOAD Review 桌面版里出现，浏览器里一直隐藏） */
.dq-target { margin-top: 10px; font-size: 13px; font-weight: 600; color: var(--ink-2); }
.dq-quality { margin-top: 10px; }
.dq-quality select.input { width: auto; min-width: 240px; height: 34px; }
.dq-custom { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.dq-custom input.input { width: 96px; height: 34px; padding: 0 10px; }
.dq-quality__hint { margin: 6px 0 0; font-size: 12.5px; line-height: 1.6; }
.drop.is-version { border-color: var(--red); background: rgba(var(--accent-rgb),.04); }
.dq { margin-top: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--card); }
.dq__head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding: 12px 14px 8px; }
.dq__head strong { font-size: 14px; }
.dq__list { list-style: none; margin: 0; padding: 0; }
.dq__job { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 14px; border-top: 1px solid var(--line); }
.dq__ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: rgba(17,16,14,.05); color: var(--ink-2); }
.dq__ico svg { width: 16px; height: 16px; animation: dq-bob 2.4s ease-in-out infinite; }
.dq__job[data-phase="transcoding"] .dq__ico svg, .dq__job[data-phase="probing"] .dq__ico svg { animation: dq-breathe 1.6s ease-in-out infinite; }
.dq__job[data-phase="done"] .dq__ico { background: rgba(31,157,85,.12); color: var(--ok); }
.dq__job[data-phase="failed"] .dq__ico { background: rgba(var(--danger-rgb),.10); color: var(--danger); }
.dq__top { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; min-width: 0; }
.dq__name { font-size: 13.5px; overflow-wrap: anywhere; }
.dq__to { font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.dq__bar { height: 5px; margin: 7px 0 5px; border-radius: 999px; background: rgba(17,16,14,.08); overflow: hidden; }
.dq__bar i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--red), var(--amber)); transition: width 400ms var(--ease-out); }
.dq__job[data-phase="done"] .dq__bar i { background: var(--ok); }
.dq__job[data-phase="failed"] .dq__bar i, .dq__job[data-phase="cancelled"] .dq__bar i { background: rgba(17,16,14,.22); }
.dq__status { font-size: 12.5px; color: var(--ink-2); font-variant-numeric: tabular-nums; white-space: pre-wrap; overflow-wrap: anywhere; }
.dq__job[data-phase="failed"] .dq__status { color: var(--danger); }
.dq__acts { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.dq__acts .btn[hidden] { display: none; }
.dq__note { margin: 0; padding: 10px 14px 12px; border-top: 1px solid var(--line); font-size: 12px; }
@keyframes dq-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-1.5px); } }
@keyframes dq-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
@media (prefers-reduced-motion: reduce) { .dq__ico svg { animation: none !important; } .dq__bar i { transition: none; } }
@media (max-width: 640px) { .dq__job { grid-template-columns: 30px minmax(0, 1fr); } .dq__acts { grid-column: 1 / -1; justify-content: flex-start; } }
th { text-align: left; font-size: 12px; color: var(--muted); font-weight: 600; padding: 10px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }
td { padding: 14px 12px; border-bottom: 1px solid var(--line); vertical-align: top; line-height: 1.6; }
tbody tr { transition: background 120ms; }
tbody tr:hover { background: rgba(17,16,14,.025); }
tbody tr:last-child td { border-bottom: 0; }
.no { display: inline-grid; place-items: center; min-width: 30px; height: 30px; padding: 0 7px; border-radius: 10px; color: #fff; font-weight: 700; font-size: 13px; background: linear-gradient(135deg, var(--red), var(--amber)); }
.muted { color: var(--muted); font-size: 12.5px; }
.badge { display: inline-flex; align-items: center; height: 22px; margin-top: 6px; padding: 0 8px; border-radius: var(--radius-pill); font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.badge.late { background: rgba(255,176,32,.18); color: #8a5a00; }
/* 客户自己改过的意见：点开看改前原话 */
.edited > summary { list-style: none; cursor: pointer; background: rgba(150,169,255,.18); color: #3549a8; }
.edited > summary::-webkit-details-marker { display: none; }
.edited[open] > summary { margin-bottom: 4px; }
/* 导出给设计之后：已导出的轻标一下；客户又改了 / 撤回了、还没点知道了的标红；撤回的意见单列（2026-09-24） */
.xtag { margin-top: 4px; font-size: 12px; color: var(--muted); }
.xflag { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; padding: 6px 10px; border-radius: 10px; background: rgba(var(--danger-rgb),.08); color: #b3261e; font-size: 12.5px; font-weight: 600; }
.xbar { margin: 0 16px 10px; padding: 8px 12px; border-radius: 10px; background: rgba(var(--danger-rgb),.08); color: #b3261e; font-size: 13px; font-weight: 600; }
tr.is-attn > td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
tr.is-withdrawn .wd__head { font-weight: 600; color: var(--muted); }
tr.is-withdrawn .wd__text { margin-top: 2px; color: var(--muted); overflow-wrap: anywhere; }
/* 按修改项汇总里的撤回卡片：比修改项卡片矮，一行编号＋内容 */
.cr.cr--wd { display: flex; gap: 12px; align-items: flex-start; padding: 12px 16px; background: var(--paper); }
.cr--wd .no { flex: none; }
.cr--wd__body { min-width: 0; flex: 1; }
.cr--wd .wd__head { font-size: 13.5px; font-weight: 600; color: var(--muted); }
.cr--wd .wd__text { margin-top: 2px; font-size: 13px; color: var(--muted); overflow-wrap: anywhere; }
.cr.cr--wd.is-attn { box-shadow: inset 3px 0 0 var(--danger); }
.status { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: var(--radius-pill); font-size: 12px; font-weight: 600; white-space: nowrap; }
.status--active { background: rgba(31,157,85,.14); color: var(--ok); }
.status--disabled, .status--revoked { background: rgba(17,16,14,.08); color: var(--muted); }
.status--expired { background: rgba(var(--danger-rgb),.12); color: var(--danger); }
.thumbwrap { position: relative; width: 210px; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); background: #efece6; }
.thumbwrap img { width: 100%; display: block; }
.thumbwrap svg { position: absolute; inset: 0; width: 100%; height: 100%; }
/* S4 网页审阅 */
.wb-globe { animation: wbspin 14s linear infinite; }
.vcard__web { display: grid; place-items: center; align-content: center; gap: 6px; width: 100%; height: 100%; padding: 10px; color: var(--red, #FF362C); text-align: center; }
.vcard__web svg { width: 34px; height: 34px; }
.vcard__web small { color: var(--muted); font-size: 12px; line-height: 1.35; word-break: break-all; }
.thumbweb { display: grid; place-items: center; height: 118px; color: var(--red, #FF362C); }
.thumbweb svg { width: 30px; height: 30px; }
.stepno.wb-ico svg { width: 15px; height: 15px; }
#sendWeb h3 { margin: 18px 0 6px; font-size: 15px; }
#webBuildForm { margin-top: 12px; }
#webBuildForm .input { height: 38px; }
.wb-origins { list-style: none; margin: 6px 0 12px; padding: 0; display: grid; gap: 6px; }
.wb-origins li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; }
.wb-origins code, .wb-snippet code { font-size: 13px; word-break: break-all; }
.wb-snippet { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; background: #f3f1ec; }
.wb-snippet code { flex: 1; }
.wb-demo { margin: 10px 0 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
@keyframes wbspin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .wb-globe { animation: none; } }
/* ---------- 2026-09-14 项目管理：项目列表、分栏、作品文件夹 ---------- */
/* ---------- 工作区（2026-09-23 改版，参照 Frame.io / Filestage：左侧项目栏常驻，右侧项目头 + 标签；宽屏铺满、加栏不加留白） ---------- */
body.is-console .container { width: calc(100% - 48px); max-width: none; }
.console { padding: 18px 0 40px; }
.ws { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; align-items: start; }
.ws-main { min-width: 0; }
#projectRail { display: none; }
@media (min-width: 1100px) {
  .ws { grid-template-columns: 264px minmax(0, 1fr); }
  #projectRail { display: flex; flex-direction: column; gap: 10px; position: sticky; top: 16px; max-height: calc(100vh - 32px); padding: 14px; border-radius: 20px; background: var(--card); border: 1px solid var(--line); }
}
@media (min-width: 2200px) { .ws { grid-template-columns: 300px minmax(0, 1fr); } }
body.is-people #projectRail, body.is-people #sendProject, body.is-people #projectTabs { display: none !important; }
body.is-people .ws { grid-template-columns: minmax(0, 1fr); }
.prail__new span { white-space: nowrap; }

/* 项目头：客户 › 项目（下拉切换）· 分享给客户 · 更多 */
.phead { margin: 0 0 6px; }
.phead__row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-height: 42px; }
.phead__row .grow { flex: 1; }
.crumbs { display: flex; align-items: center; gap: 6px; min-width: 0; flex: 0 1 auto; }
/* 客户名不跟项目下拉一起缩（老板 9-26：「这里信息显示完整」）；只有长到屏宽四成以上才省略 */
.crumbs__client { flex: none; color: var(--muted); font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 40vw; }
.crumbs__client:empty, .crumbs__client:empty + .crumbs__sep { display: none; }
.crumbs__sep { color: var(--muted); }
.crumbs select.input { height: 34px; min-width: 0; max-width: min(560px, 70vw); padding-left: 10px; font-size: 15px; font-weight: 600; border-color: transparent; background-color: transparent; }
.crumbs select.input:hover, .crumbs select.input:focus-visible { border-color: var(--line-strong); background-color: var(--card); }
/* 展开的项目列表（老板 9-25：文字太大）：客户名分组小一号，项目名常规字重 */
.crumbs select.input optgroup { font-size: 12.5px; font-weight: 600; color: var(--muted); }
.crumbs select.input option { font-size: 13.5px; font-weight: 400; color: var(--ink); }
.crumbs__badges { display: flex; gap: 6px; flex: none; }
.crumbs__badges:empty { display: none; }
.crumbs__badges .tagpill { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 999px; font-size: 12px; font-weight: 600; background: rgba(17,16,14,.07); color: var(--ink-2); }
.crumbs__badges .tagpill.is-secret { background: rgba(var(--danger-rgb),.1); color: var(--danger); }

/* 下拉菜单（原生 details，键盘和读屏天然可用） */
.menu { position: relative; }
.menu > summary { list-style: none; cursor: pointer; user-select: none; }
.menu > summary::-webkit-details-marker { display: none; }
.menu__btn svg { width: 16px; height: 16px; }
.menu__list { position: absolute; right: 0; top: calc(100% + 6px); z-index: 40; min-width: 210px; padding: 6px; display: flex; flex-direction: column; border-radius: 14px; background: var(--card); border: 1px solid var(--line); box-shadow: 0 14px 36px -10px rgba(17,16,14,.28); animation: pop 160ms var(--ease-out) both; }
.menu__item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 12px; border: 0; border-radius: 10px; background: transparent; color: var(--ink); font-size: 14px; text-align: left; white-space: nowrap; cursor: pointer; }
.menu__item:hover, .menu__item:focus-visible { background: rgba(17,16,14,.06); outline: none; }
.menu__item svg { width: 16px; height: 16px; flex: none; }
.menu__item.is-danger, .menu__item.is-secret { color: var(--danger); }
.menu__sep { height: 1px; margin: 4px 6px; background: var(--line); }
@media (min-width: 1100px) { .menu__item.only-narrow { display: none; } }

/* 项目内的标签：下划线式，数字角标 */
.ptabs { width: 100%; max-width: 100%; padding: 0; gap: 2px; border-radius: 0; background: transparent; box-shadow: inset 0 -1px 0 var(--line); margin: 0 0 18px; overflow-y: hidden; }
.ptabs .tab { position: relative; height: 38px; border-radius: 10px 10px 0 0; }
.ptabs .tab:hover { background: rgba(17,16,14,.04); }
.ptabs .tab.is-on { background: transparent; box-shadow: none; }
/* 下划线贴在标签栏底边、盖住底线（底线是内阴影）；不再压出底边 1px——那 1px 会让标签栏出竖向滚动条 */
.ptabs .tab.is-on::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 0; height: 2px; border-radius: 2px; background: var(--red); }
.tab__n { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: rgba(17,16,14,.07); color: var(--ink-2); font-size: 11.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.tab__n:empty { display: none; }
.tab__n.is-hot { background: var(--red); color: #fff; }

/* 顶栏：人员、我的账号、退出 */
.topnav { display: flex; gap: 2px; }
.nav .topnav .tab { height: 32px; padding: 0 11px; flex-direction: row; font-size: 13px; border-radius: 9px; }
.nav .topnav .tab.is-on { background: rgba(var(--accent-rgb),.08); box-shadow: none; }
.topnav__out { white-space: nowrap; }

/* 意见页工具条 */
.ntool { margin: 0 0 14px; }
.ntool__row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ntool__row .grow { flex: 1; }
.ntool__round select.input { height: 36px; width: auto; min-width: min(360px, 100%); max-width: 100%; }
.ntool__q { width: 220px; height: 36px; }
.ntool__f { width: auto; height: 36px; }
.nbanner { display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 8px 8px 8px 14px; border-radius: 14px; background: rgba(var(--accent-rgb),.07); color: var(--red-deep); font-size: 14px; font-weight: 600; animation: pop 240ms var(--ease-out) both; }
.nbanner span { flex: 1; }
.ngrid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 18px; align-items: start; }
@media (min-width: 1700px) {
  .ngrid { grid-template-columns: minmax(0, 1fr) 420px; }
  .ngrid__main { order: 1; min-width: 0; }
  .ngrid__side { order: 2; position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow: auto; }
}
@media (min-width: 2600px) { .ngrid { grid-template-columns: minmax(0, 1fr) 560px; } }
/* 顶栏在平板和手机上只留图标，不挤出屏幕 */
@media (max-width: 900px) {
  .nav .topnav .tab span, .topnav__out span { display: none; }
  .nav .topnav .tab, .topnav__out { padding: 0 10px; }
  .who { max-width: 150px; }
}
tr.is-filtered, .cr.is-filtered { display: none; }

/* 意见的回复（客户与我方的对话）+ 回复框 */
.rthread { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.rmsg { padding: 7px 10px; border-radius: 10px; background: rgba(17,16,14,.04); font-size: 13px; line-height: 1.5; }
.rmsg.is-ours { background: rgba(22,183,170,.09); }
.rmsg.is-internal { background: rgba(255,176,32,.13); }
.rmsg__who { display: flex; gap: 8px; align-items: baseline; margin-bottom: 2px; font-size: 11.5px; color: var(--muted); }
.rmsg__who b { color: var(--ink-2); font-weight: 600; }
.rmsg__tag { font-weight: 600; color: #8a5a00; }
.rbtn { margin-top: 6px; border: 0; background: none; padding: 0; color: var(--red-deep); font-size: 13px; font-weight: 600; cursor: pointer; }
.rform { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.rform textarea.input { min-height: 72px; font-size: 14px; }
.rform__row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.rform__row select.input { width: auto; height: 32px; font-size: 13px; }
.rform__row .grow { flex: 1; }

/* 分享给客户：对话框 */
.sdlg { width: min(860px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); padding: 0; border: 0; border-radius: 18px; background: var(--card); color: var(--ink); box-shadow: 0 30px 80px -20px rgba(17,16,14,.4); }
.sdlg::backdrop { background: rgba(17,16,14,.42); }
.sdlg__box { display: flex; flex-direction: column; gap: 13px; padding: 16px 20px 18px; }
.sdlg__head { display: flex; align-items: center; gap: 12px; }
.sdlg__head h2 { margin: 0; font-size: 17px; font-weight: 600; }
.sdlg__head .grow, .sdlg__label .grow { flex: 1; }
.sdlg__x { width: 30px; height: 30px; display: grid; place-items: center; border: 0; border-radius: 9px; background: transparent; cursor: pointer; }
.sdlg__x:hover { background: rgba(17,16,14,.06); }
.sdlg__x svg { width: 16px; height: 16px; }
.sdlg__label { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; font-size: 14px; font-weight: 600; }
.sdlg__assets { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; max-height: 300px; overflow: auto; padding: 2px; }
.shitem { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 8px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; }
.shitem.is-on { border-color: var(--red); box-shadow: 0 0 0 2px rgba(var(--accent-rgb),.18); }
.shitem .vcard__thumb { border-radius: 8px; }
.shitem input { position: absolute; top: 14px; left: 14px; z-index: 2; width: 18px; height: 18px; accent-color: var(--red); }
.shitem span { font-size: 12.5px; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shitem em { font-style: normal; font-size: 11.5px; color: var(--muted); }
.sdlg__form .panel__body { padding: 0; }
.linkish { border: 0; background: none; padding: 0; color: var(--red-deep); font-size: 13px; font-weight: 600; cursor: pointer; }

.sec-more { margin: 12px 0 14px; font-size: 13.5px; }
.sec-more > summary { cursor: pointer; width: fit-content; color: var(--ink-2); font-weight: 600; }
.usr-help { margin: 0 22px 12px; }
.usr-help p { margin: 8px 0 0; }
@media (max-width: 640px) {
  .nav .topnav .tab span, .topnav__out span { display: none; }
  .nav .topnav .tab { padding: 0 10px; }
  .ntool__row { display: grid; grid-template-columns: 1fr auto; }
  #btnRefresh span { display: none; }
  .ntool__round select.input { width: 100%; min-width: 0; }
  .ntool__row .grow { display: none; }
  .ntool__q { width: 100%; grid-column: 1 / -1; }
  .crumbs select.input { flex: 1; width: 100%; font-size: 14px; max-width: none; text-overflow: ellipsis; }
  .crumbs__client, .crumbs__sep { display: none; }
  .ptabs .tab { height: 48px; }
  .phead__row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; column-gap: 6px; }
  .phead__row .crumbs { grid-column: 1; grid-row: 1; width: 100%; overflow: hidden; }
  .phead__row .grow { display: none; }
  #btnShare { grid-column: 2; grid-row: 1; white-space: nowrap; padding: 6px 8px; font-size: 12px; }
  #projMenu { grid-column: 3; grid-row: 1; justify-self: end; }
  #projMenu .menu__list { right: 0; left: auto; width: min(190px, calc(100vw - 24px)); min-width: 0; }
  .ptabs .tab { position: relative; height: 52px; gap: 1px; overflow: visible; }
  .ptabs .tab .tab__n { position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px; padding: 0 3px; font-size: 10px; }
}
.prail__head { display: flex; align-items: center; gap: 8px; }
.prail__head h3 { margin: 0; font-size: 15px; flex: 1; }
.prail__head .btn { padding: 4px 10px; min-height: 0; font-size: 12.5px; }
#projectSearch { height: 34px; font-size: 13.5px; }
#projectList { overflow-y: auto; display: flex; flex-direction: column; gap: 2px; margin: 0 -6px; padding: 0 6px; }
.pgroup { margin-top: 8px; font-size: 11.5px; font-weight: 600; color: var(--muted); letter-spacing: .02em; padding: 0 6px; }
.pitem { display: flex; flex-direction: column; gap: 2px; width: 100%; padding: 8px 10px; border: 0; border-radius: 12px; background: transparent; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.pitem:hover { background: rgba(17,16,14,.05); }
.pitem.is-on { background: rgba(var(--accent-rgb),.08); box-shadow: inset 3px 0 0 var(--red); }
.pitem strong { font-size: 13.5px; font-weight: 600; line-height: 1.35; }
.pitem span { font-size: 11.5px; color: var(--muted); }
.pitem.is-archived strong { color: var(--muted); }
.parchived { margin-top: 8px; padding: 6px; border: 0; background: transparent; font: inherit; font-size: 12px; color: var(--muted); text-align: left; cursor: pointer; }
/* 2026-09-15 老板：已发出的链接、规则与定稿人不再藏在分栏里，按 4、5 步排在发起审阅后面 */
#sendLinks .stepno { background: linear-gradient(135deg, var(--blue), var(--violet)); }
#sendRules .stepno { background: linear-gradient(135deg, var(--amber), var(--red)); }
.atools { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin-top: 14px; }
.atools .chips { display: flex; flex-wrap: wrap; gap: 6px; }
.achip { height: 30px; padding: 0 11px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--card); font: inherit; font-size: 12.5px; color: var(--ink-2); cursor: pointer; white-space: nowrap; }
.achip.is-on { border-color: var(--red); background: rgba(var(--accent-rgb),.08); color: var(--red-deep); font-weight: 600; }
.achip--new { border-style: dashed; }
.atools__search { height: 30px; width: 190px; font-size: 13px; margin-left: auto; }
.agroup { grid-column: 1 / -1; margin-top: 6px; }
.agroup__head { display: flex; align-items: center; gap: 8px; width: 100%; padding: 6px 2px; border: 0; background: transparent; font: inherit; text-align: left; cursor: pointer; color: inherit; }
.agroup__head strong { font-size: 14px; }
.agroup__head span { font-size: 12px; color: var(--muted); }
.agroup__head svg { width: 14px; height: 14px; transition: transform 160ms; }
.agroup.is-closed .agroup__head svg { transform: rotate(-90deg); }
.agroup.is-closed .agroup__grid { display: none; }
.agroup__grid { margin-top: 4px; }
.vpick { height: 28px; max-width: 100%; padding: 0 22px 0 8px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--card); font-size: 12px; }
.vcard__acts { flex-wrap: wrap; }
.upload-into { margin-top: 8px; font-size: 12.5px; color: var(--red-deep); }
@media (max-width: 640px) {
  .atools__search { width: 100%; margin-left: 0; }
  /* 手机上一行两张：作品多时不用刷很长 */
  .vgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .vcard__meta { padding: 8px 10px; }
  .vcard__meta strong { font-size: 13px; }
  .vcard__meta span { font-size: 11px; }
  .vcard__acts { gap: 4px; padding: 0 8px 8px; }
  .vcard__acts .btn { padding: 3px 7px; font-size: 11.5px; }
  .vcard__acts .vpick { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .agroup__head svg { transition: none; } }
.thumbwrap.is-long { height: 180px; }
.thumbwrap .tw-inner { position: absolute; left: 0; right: 0; top: 0; }
.thumbwrap .tw-inner img { width: 100%; height: 100%; display: block; }
.thumbwrap .tw-inner svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.thumbtime { position: absolute; left: 6px; bottom: 6px; padding: 1px 8px; border-radius: 999px; background: rgba(17,16,14,.74); color: #fff; font-size: 11.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
td select, .cr__side select { height: 34px; padding: 0 30px 0 11px; border-radius: 9px; border: 1px solid #dcd8d3; background-color: #fcfbfa; font-size: 14px; appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236f6c65' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 15px; }
td select:focus, .cr__side select:focus { outline: none; border-color: var(--red); box-shadow: 0 0 0 3px rgba(var(--accent-rgb),.08); }
td select:disabled, .cr__side select:disabled { opacity: .6; cursor: not-allowed; }
.ok { color: var(--ok); font-size: 12.5px; font-weight: 600; }
.err { color: var(--danger); white-space: pre-wrap; }
.empty { padding: 36px 20px 40px; text-align: center; color: var(--muted); }
.who { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px 0 9px; border-radius: var(--radius-pill); border: 1px solid var(--line); background: var(--card); font-size: 13px; font-weight: 500; white-space: nowrap; max-width: 240px; overflow: hidden; text-overflow: ellipsis; }

/* ---------- 发给客户 ---------- */
.inline-form { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; margin-top: 12px; }
.inline-form .btn { height: 38px; }
.drop {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 30px 20px;
  border-radius: 18px; text-align: center; cursor: pointer;
  background: rgba(17,16,14,.035); border: 1px dashed rgba(17,16,14,.18);
  transition: background 200ms var(--ease-out), border-color 200ms, box-shadow 200ms;
}
.drop:hover, .drop.is-over {
  border-style: solid; border-color: transparent;
  background: linear-gradient(rgba(150,169,255,.08), rgba(150,169,255,.08)) padding-box, var(--stroke-spectrum) border-box;
  box-shadow: 0 0 0 6px rgba(150,169,255,.10);
}
.drop__icon { width: 52px; height: 52px; margin-bottom: 6px; border-radius: 50%; display: grid; place-items: center; color: var(--red); background: linear-gradient(135deg, rgba(var(--accent-rgb),.10), rgba(255,176,32,.14)); box-shadow: inset 0 0 0 1px rgba(var(--accent-rgb),.12); }
.drop__icon svg { width: 24px; height: 24px; animation: ico-bob 1.6s ease-in-out infinite alternate; }
.drop strong { font-size: 16px; font-weight: 600; }
.drop span { color: var(--muted); font-size: 13px; }
.pick-hint { margin: 16px 0 0; }
.vgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; margin-top: 10px; }
.vcard { position: relative; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--card); cursor: pointer; transition: border-color 160ms, box-shadow 160ms, transform 160ms var(--ease-out); }
.vcard:hover { transform: translateY(-2px); box-shadow: 0 12px 26px -12px rgba(17,16,14,.25); }
.vcard.is-on { border-color: var(--red); box-shadow: 0 0 0 3px rgba(var(--accent-rgb),.12); }
/* 勾选框压在缩略图上：加一圈白底，避免和画面里的字挤在一起看不清 */
.vcard input { position: absolute; top: 10px; left: 10px; z-index: 1; width: 20px; height: 20px; margin: 0; accent-color: var(--red); border-radius: 5px; background: #fff; box-shadow: 0 0 0 4px #fff, 0 2px 8px 2px rgba(17,16,14,.25); }
.vcard__thumb { aspect-ratio: 4 / 3; display: grid; place-items: center; overflow: hidden; background: #efece6; }
.vcard__thumb img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.vcard__thumb { position: relative; }
.vcard__play { position: absolute; left: 50%; top: 50%; width: 38px; height: 38px; margin: -19px 0 0 -19px; border-radius: 50%; display: grid; place-items: center; background: rgba(17,16,14,.72); color: #fff; pointer-events: none; }
.vcard__play svg { width: 15px; height: 15px; margin-left: 2px; }
.vcard__meta { padding: 10px 12px; }
.vcard__meta strong { display: block; font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vcard__meta span { font-size: 12px; color: var(--muted); }
.vcard__acts { display: flex; gap: 6px; padding: 0 12px 10px; }
.vcard__acts .btn { font-size: 12px; padding: 4px 10px; min-height: 0; }
.btn--danger { color: var(--danger); }
.apr-status { display: inline-flex; align-items: center; height: 26px; padding: 0 12px; border-radius: 999px; font-size: 13px; font-weight: 600; margin-left: 10px; }
.apr-status--PENDING { background: rgba(255,176,32,.18); color: #8a5a00; }
.apr-status--APPROVED { background: rgba(31,157,85,.14); color: var(--ok); }
.apr-status--CHANGES_REQUESTED { background: rgba(var(--danger-rgb),.12); color: var(--danger); }
.apr-status--RELEASED { background: var(--ink); color: #fff; }
.apr-status--NOT_REQUIRED { background: rgba(17,16,14,.07); color: var(--muted); }
.apr-head-ico { width: 18px; height: 18px; color: var(--red); margin-right: 8px; flex: none; }
.apr-grid { display: grid; gap: 16px; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
@media (max-width: 900px) { .apr-grid { grid-template-columns: 1fr; } }
.apr-label { font-size: 13px; font-weight: 600; color: var(--muted); }
.apr-list { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.apr-list li { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 12px; background: var(--paper); font-size: 14px; }
.apr-list li .grow { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.apr-pick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.apr-pick label { display: inline-flex; gap: 6px; align-items: center; padding: 6px 10px; border-radius: 999px; border: 1px solid var(--line); font-size: 13px; cursor: pointer; }
.apr-hist { margin-top: 10px; }
.apr-hist summary { cursor: pointer; font-size: 13px; color: var(--muted); }
.apr-blk { padding: 10px 12px; border-radius: 12px; background: rgba(255,176,32,.14); margin-bottom: 10px; font-size: 14px; }
.pillst--must, .pillst--sug { border: 0; cursor: pointer; font: inherit; font-size: 12px; font-weight: 600; }
.pillst--must { background: rgba(var(--danger-rgb),.12); color: var(--danger); }
.pillst--sug { background: rgba(150,169,255,.18); color: #3549a8; }
.cr__reason { font-size: 12.5px; color: var(--muted); margin: 2px 0 6px; }
.exp-files { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.exp-files div { display: flex; gap: 10px; align-items: center; font-size: 13px; }
.cdlg { border: 0; padding: 0; border-radius: 16px; width: min(420px, calc(100vw - 32px)); background: var(--card); color: var(--ink); box-shadow: 0 30px 80px -20px rgba(17,16,14,.4); }
.cdlg::backdrop { background: rgba(17,16,14,.42); }
.cdlg__box { padding: 18px 18px 15px; display: flex; flex-direction: column; gap: 9px; }
.cdlg__box h3 { margin: 0; font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
.cdlg__box p { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.6; }
.cdlg__acts { display: flex; justify-content: flex-end; gap: 8px; margin-top: 6px; }
.round-form { display: grid; grid-template-columns: 1.4fr .8fr; gap: 12px; align-items: end; }
.round-form .field { margin: 0; }
.round-form .field .input { height: 40px; font-size: 15px; }
.round-form .btn { height: 38px; }
/* 2026-09-13 客户在电脑上先看到哪种视图：默认工作台，单张广告图可选对照清单 */
.view-pick { margin-top: 12px; }
.view-pick__label { font-size: 12.5px; font-weight: 600; color: var(--ink-2); margin-bottom: 8px; }
.view-pick__opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.viewopt { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 11px; align-items: center; padding: 9px; border: 1px solid rgba(17,16,14,.14); border-radius: 13px; background: var(--card); text-align: left; font: inherit; color: inherit; cursor: pointer; transition: border-color 160ms var(--ease-out), box-shadow 160ms; }
.viewopt:hover { border-color: var(--line-strong); }
.viewopt.is-on { border: 2px solid var(--red); padding: 8px; box-shadow: 0 0 0 3px rgba(var(--accent-rgb),.08); }
.viewopt:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
.viewopt strong { display: block; font-size: 14px; font-weight: 600; }
.viewopt .desc { display: block; margin-top: 4px; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.vsketch { height: 56px; border-radius: 9px; background: #efece6; padding: 6px; display: grid; gap: 4px; }
.vsketch--work { grid-template-columns: 16px minmax(0, 1fr) 32px; }
.vsketch--list { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.vsketch > i { display: grid; place-items: center; border-radius: 4px; background: #fff; }
.vsketch > i.soft { background: rgba(255,255,255,.7); }
.vsketch > i.col { background: transparent; gap: 3px; place-items: stretch; }
.vsketch b { display: block; width: 20px; height: 26px; border-radius: 2px; background: var(--red); opacity: .35; }
.vsketch u { display: block; border-radius: 3px; background: #fff; text-decoration: none; }
.vsketch--list u { display: grid; grid-template-columns: 12px 1fr; gap: 3px; padding: 2px; }
.vsketch--list u::before { content: ""; border-radius: 2px; background: #f6d2cf; }
.view-pick__note { margin-top: 8px; font-size: 12.5px; color: var(--muted); }
.round-actions { display: flex; justify-content: flex-end; margin-top: 16px; }
.round-actions .btn { height: 38px; }
.linkbox { margin-top: 16px; padding: 16px; border-radius: 16px; background: linear-gradient(135deg, rgba(22,183,170,.12), rgba(150,169,255,.14)); animation: pop 300ms var(--ease-out) both; }
.linkbox__label { margin-bottom: 8px; font-size: 13px; font-weight: 600; color: var(--ok); }
.linkbox__row { display: flex; gap: 8px; flex-wrap: wrap; }
.linkbox__row .input { flex: 1; min-width: 240px; background: #fff; font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 13px; }
.linkbox__row .btn { height: 38px; }

/* ---------- 人员 / 我的账号 ---------- */
.user-form { display: grid; grid-template-columns: 1.2fr 1fr .8fr 1.2fr auto; gap: 10px; }
.user-form .btn { height: 38px; }
.acc-grid { display: grid; grid-template-columns: 110px 1fr; gap: 10px 16px; margin: 4px 0 22px; font-size: 14px; }
.acc-grid dt { color: var(--muted); }
.acc-grid dd { margin: 0; font-weight: 500; }
.pw-form { display: grid; gap: 10px; max-width: 420px; }
.toast { position: fixed; left: 50%; bottom: 28px; z-index: 60; transform: translateX(-50%); padding: 10px 18px; border-radius: var(--radius-pill); background: rgba(17,16,14,.9); color: #fff; font-size: 14px; box-shadow: 0 12px 30px -10px rgba(17,16,14,.5); animation: pop 200ms var(--ease-out) both; }

/* ---------- 客户同事审阅进度 ---------- */
.chips { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.chip { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border-radius: var(--radius-pill); border: 1px solid var(--line); background: var(--card); font-size: 12.5px; font-weight: 500; color: var(--ink-2); white-space: nowrap; }
.linkish { border: 0; background: none; padding: 0; color: var(--red-deep); font-size: 13px; font-weight: 600; cursor: pointer; }
.rgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 10px; }
.rcard { display: flex; align-items: center; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 16px; background: var(--card); min-width: 0; }
.av { width: 32px; height: 32px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 700; }
.rcard__main { flex: 1; min-width: 0; }
.rcard__name { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 验证状态、最后活动时间整句显示（老板 9-26「完整展示文字信息」），放不下就折行，不省略 */
.rcard__meta { font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.tag { display: inline-flex; align-items: center; height: 19px; padding: 0 7px; margin-left: 6px; border-radius: var(--radius-pill); font-size: 11px; font-weight: 700; background: var(--ink); color: #fff; vertical-align: 1px; }
.pillst { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: var(--radius-pill); font-size: 12px; font-weight: 600; white-space: nowrap; flex: none; }
.pillst--done { background: rgba(31,157,85,.14); color: var(--ok); }
.pillst--todo { background: rgba(17,16,14,.07); color: var(--muted); }
.pillst--wait { background: rgba(255,176,32,.2); color: #8a5a00; }
.pillst--merge { background: rgba(150,169,255,.22); color: #3549a8; }
.sumline { margin: 14px 0 0; font-size: 14px; color: var(--ink-2); }
.sumline:empty { display: none; }

/* 客户随意见带上来的参考（2026-09-16）*/
.refs{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.refs a{display:inline-flex;align-items:center;gap:5px;max-width:200px;padding:3px 7px;border:1px solid var(--line);border-radius:9px;font-size:12px;color:var(--ink-2);text-decoration:none;background:var(--card);cursor:pointer}
.refs a:hover{border-color:var(--line-strong)}
.refs a img{width:30px;height:30px;object-fit:cover;border-radius:5px;background:#efece6}
.refs a span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.refs .refs__k{color:var(--muted);flex:none}

/* ---------- 按修改项汇总 ---------- */
.viewseg { display: flex; gap: 2px; padding: 3px; margin-left: auto; border-radius: 14px; background: rgba(17,16,14,.06); }
.viewseg button { height: 28px; padding: 0 11px; border: 0; border-radius: 9px; background: transparent; color: var(--ink-2); font-size: 13px; font-weight: 500; white-space: nowrap; }
.viewseg button.is-on { background: var(--card); color: var(--red-deep); font-weight: 600; box-shadow: 0 1px 2px rgba(17,16,14,.08), 0 4px 12px -4px rgba(17,16,14,.14); }
.crbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 4px 22px 12px; }
.crlist { display: flex; flex-direction: column; gap: 12px; padding: 0 22px 22px; }
.cr { display: grid; grid-template-columns: auto 190px minmax(0, 1fr) 240px; gap: 13px; padding: 13px; border: 1px solid var(--line); border-radius: 14px; background: var(--card); }
.cr.is-wait { border-color: rgba(255,176,32,.65); }
.cr__pick input { width: 18px; height: 18px; margin: 10px 0 0; accent-color: var(--red); }
.cr__head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cr__title { flex: 1; min-width: 200px; height: 34px; padding: 0 10px; border: 1px solid transparent; border-radius: 9px; background: transparent; font-size: 15px; font-weight: 600; color: var(--ink); }
.cr__title:hover, .cr__title:focus { border-color: #dcd8d3; background: #fcfbfa; outline: none; }
.quote { display: flex; gap: 9px; align-items: flex-start; margin-top: 7px; padding: 9px 11px; border-radius: 12px; background: var(--paper); }
.quote .no { min-width: 30px; height: 26px; border-radius: 9px; font-size: 12.5px; }
.quote__text { flex: 1; min-width: 0; font-size: 14px; line-height: 1.55; }
.quote__meta { margin-top: 2px; font-size: 12px; color: var(--muted); }
.quote__sub { margin-top: 4px; font-size: 12.5px; color: #3549a8; }
.quote__reply { margin-top: 4px; padding-left: 10px; border-left: 2px solid var(--line-strong); font-size: 13px; color: var(--ink-2); }
.quote .btn--sm { height: 28px; padding: 0 9px; font-size: 12px; }
.cr__side { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; padding: 10px; border-radius: 12px; background: var(--paper); align-self: start; }
.cr__side select { width: auto; min-width: 150px; max-width: 100%; }
.dbox { margin-top: 10px; padding: 12px 14px; border-radius: 14px; background: rgba(255,176,32,.10); font-size: 13.5px; line-height: 1.6; }
.dbox.is-done { background: rgba(31,157,85,.10); }
.dbox__q { font-weight: 600; }
.dbox__res { font-weight: 600; color: var(--ok); }
.dbox .input { margin-top: 8px; height: 34px; font-size: 14px; }
.dbox textarea.input { min-height: 64px; height: auto; }
.dbox label.opt { display: flex; gap: 8px; align-items: flex-start; margin-top: 6px; font-size: 13.5px; cursor: pointer; }
.dbox label.opt input { margin-top: 4px; accent-color: var(--red); }
/* 标记已改 → 客户逐条复核（2026-09-13） */
.fbox { margin-top: 10px; padding: 12px 14px; border-radius: 14px; background: rgba(150,169,255,.12); font-size: 13.5px; line-height: 1.6; }
.fbox.is-ok { background: rgba(31,157,85,.10); }
.fbox.is-again { background: rgba(255,176,32,.14); }
.fbox__head { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.fbox__head svg { width: 16px; height: 16px; flex: none; }
.fbox.is-ok .fbox__head { color: var(--ok); }
.fbox.is-again .fbox__head { color: #8a5a00; }
.fbox__note, .fbox__rv { margin-top: 4px; }
.fbox .input { margin-top: 8px; height: 34px; font-size: 14px; width: 100%; }
.fbox textarea.input { min-height: 72px; height: auto; padding-top: 8px; }
.fbox .btnrow { margin-top: 8px; }
[data-fix-open] svg { width: 16px; height: 16px; }
.btnrow { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.btnrow .grow { flex: 1; }

/* ---------- 审阅规则 / 定稿人 ---------- */
.rule { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 12px 22px; padding: 16px 0; border-top: 1px solid var(--line); }
.rule:first-child { border-top: 0; padding-top: 4px; }
.rule__label { font-size: 14.5px; font-weight: 600; line-height: 1.5; }
.rule__opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ropt { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border: 1px solid var(--line-strong); border-radius: 14px; background: var(--card); text-align: left; font: inherit; color: inherit; cursor: pointer; transition: border-color 140ms, box-shadow 140ms; }
.ropt strong { font-size: 14px; font-weight: 600; }
.ropt span { font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.ropt em { font-style: normal; font-size: 12px; color: var(--red-deep); }
.ropt.is-on { border: 2px solid var(--red); padding: 11px 13px; box-shadow: 0 0 0 3px rgba(var(--accent-rgb),.08); }
.ropt:disabled { cursor: not-allowed; opacity: .6; }
.rule__foot { grid-column: 2; margin-top: -2px; font-size: 12.5px; color: var(--muted); }
.dec-form { display: grid; grid-template-columns: 1fr 1.2fr 1.4fr auto; gap: 10px; margin-top: 12px; }
.dec-form .btn { height: 38px; }
.dec-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 0; border-top: 1px solid var(--line); }
.dec-row:first-child { border-top: 0; }
.dec-row__main { flex: 1; min-width: 220px; }
.dec-row select.input { width: auto; min-width: 180px; height: 34px; }
.kind { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: var(--radius-pill); font-size: 11.5px; font-weight: 600; white-space: nowrap; background: rgba(17,16,14,.07); color: var(--ink-2); }
.kind--decider { background: rgba(var(--accent-rgb),.10); color: var(--red-deep); }
/* 处理状态说明、不采纳理由、方案删除、可选访问码、成员与权限（2026-09-14 第二轮） */
.sthelp { margin: 0 22px 12px; font-size: 13px; color: var(--ink-2); }
.sthelp summary { cursor: pointer; color: var(--muted); font-weight: 600; width: fit-content; }
.sthelp dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 14px; margin: 10px 0 0; }
.sthelp dt { font-weight: 600; white-space: nowrap; }
.sthelp dd { margin: 0; }
.cr__why { margin-top: 6px; font-size: 12.5px; color: var(--ink-2); max-width: 220px; overflow-wrap: anywhere; }
.dopt { display: flex; gap: 6px; align-items: center; }
.dopt .input { flex: 1; min-width: 0; }
.chkline { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; font-size: 13.5px; color: var(--ink-2); cursor: pointer; }
.chkline input { width: 16px; height: 16px; flex: none; }
.pmrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--line); min-width: 0; }
.pmrow__who { display: flex; flex-direction: column; min-width: 0; }
.pmrow__who b { font-size: 13.5px; font-weight: 600; }
.pmrow__who em { font-style: normal; font-size: 11.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pmrow select { min-width: 150px; max-width: 55%; }
@media (max-width: 640px) { .sthelp dl { grid-template-columns: 1fr; gap: 2px 0; } .sthelp dd { margin-bottom: 6px; } .pmrow select { min-width: 0; } }
/* 涉密项目（2026-09-14，docs/12） */
.kind--secret { background: rgba(200,16,46,.10); color: #A30D25; }
.secret-badge { display: inline-flex; align-items: center; height: 18px; padding: 0 6px; margin-left: 4px; border-radius: var(--radius-pill); font-size: 10.5px; font-weight: 700; vertical-align: 1px; background: rgba(200,16,46,.12); color: #A30D25; }
.btn.is-secret { color: #A30D25; border-color: rgba(200,16,46,.35); }
.codebox { margin-top: 12px; padding: 12px 14px; border-radius: 12px; border: 1px dashed rgba(200,16,46,.45); background: rgba(255,255,255,.7); }
.codebox__label { font-size: 12px; font-weight: 600; color: #A30D25; }
.codebox b { display: block; margin: 2px 0; font: 700 26px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .22em; color: #A30D25; font-variant-numeric: tabular-nums; }
.codebox span { display: block; font-size: 12px; color: var(--ink-2); }
.sec-state { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; font-size: 14px; }
.sec-rules { margin: 0 0 14px; padding-left: 18px; font-size: 13px; color: var(--ink-2); line-height: 1.75; }
.sec-rules li.limit { color: var(--muted); list-style: "⚠ "; }
.sec-members { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 0 24px; margin: 8px 0 10px; }
.sec-members label { display: flex; align-items: center; gap: 8px; font-size: 13px; min-width: 0; }
.sec-members label em { font-style: normal; font-size: 11.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#sendSecurity h3 { margin: 16px 0 6px; font-size: 14px; }

@media (max-width: 900px) {
  .login { grid-template-columns: 1fr; gap: 28px; padding: 28px 0; min-height: 0; }
  .login__card { rotate: none; padding: 28px 22px 24px; }
  .login__card > * { rotate: none; }
  .toolbar-row select.input { min-width: 100%; }
  .inline-form, .user-form, .round-form, .dec-form { grid-template-columns: 1fr; }
  .cr { grid-template-columns: auto minmax(0, 1fr); }
  .cr__thumb, .cr__side { grid-column: 1 / -1; }
  .rule { grid-template-columns: 1fr; }
  .rule__opts { grid-template-columns: 1fr; }
  .rule__foot { grid-column: 1; }
}
@media (max-width: 480px) {
  .who { display: none; }
}
/* 2026-09-14 老板反馈「后台竖版时排版有些问题」：标签页不再被截掉、表格改成一条一张卡片、选视图的卡片不再把字挤成一列 */
@media (max-width: 640px) {
  .tabs { width: 100%; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); overflow: visible; }
  .tab { flex-direction: column; justify-content: center; height: 48px; padding: 4px 2px; gap: 3px; font-size: 12px; min-width: 0; }
  .tab span { overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .tab[hidden] { display: none; }
  .view-pick__opts { grid-template-columns: 1fr; }
  .viewopt { grid-template-columns: 84px minmax(0, 1fr); gap: 12px; }
  .vsketch { height: 50px; }
  .cr { grid-template-columns: 22px minmax(0, 1fr); gap: 10px; padding: 12px; }
  .cr__thumb { grid-column: 2 !important; }
  .cr__thumb .thumbwrap { width: 132px; }
  .cr__thumb .muted { font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
  .cr > div:nth-child(3) { grid-column: 1 / -1; }
  .cr__side { grid-column: 1 / -1 !important; }
  .cr__title { min-width: 0; font-size: 15px; }
  .tablewrap { padding: 0 4px 8px; }
  .tablewrap table { min-width: 0; }
  .tablewrap table, .tablewrap tbody, .tablewrap tr, .tablewrap td { display: block; width: 100%; box-sizing: border-box; }
  .tablewrap thead { display: none; }
  .tablewrap tr { padding: 12px 8px; border-bottom: 1px solid var(--line); }
  .tablewrap td { padding: 4px 0; border: 0; }
  .tablewrap td[data-label]::before { content: attr(data-label); display: block; font-size: 11.5px; font-weight: 600; color: var(--muted); margin: 6px 0 2px; }
  .tablewrap .thumbwrap { width: 150px; }
  .tablewrap td.actions { display: flex; flex-wrap: wrap; gap: 6px; padding-top: 8px; }
  .tablewrap td select { width: 100%; }
  .dec-row select.input { width: 100%; }
}

/* 顶栏在 480px 以下的手机上再收紧一点：「项目」「人员」「我的账号」三个图标 + 语言 + 退出要放得下 */
@media (max-width: 480px) {
  .site-header .nav { gap: 4px; }
  .nav .topnav .tab, .topnav__out { padding: 0 8px; }
}
/* 作品筛选：「类型」「文件夹」两组各带小标题，不再看着像一排重复的按钮；选中文件夹时的改名 / 删除（9-24） */
.achip-label { align-self: center; margin-right: 2px; font-size: 12px; font-weight: 600; color: var(--muted); white-space: nowrap; }
.achip--act { border-style: dashed; }
.achip--act.is-danger { color: var(--danger); }

/* 超宽屏（老板 5120×1440，放在文件最后：要压过前面 .crlist 等的基础规则）：加栏不加留白——修改项卡片、设置卡片排成多列，网页审阅放到作品旁边 */
@media (min-width: 2200px) {
  .crlist { display: grid; grid-template-columns: repeat(auto-fill, minmax(860px, 1fr)); align-items: start; }
  [data-panel="send"]:not([hidden]) { display: grid; grid-template-columns: minmax(0, 1fr) 620px; gap: 0 18px; align-items: start; }
  [data-panel="send"] > #viewerNote { grid-column: 1 / -1; }
  [data-panel="settings"]:not([hidden]) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; align-items: start; }
}
@media (min-width: 3400px) { [data-panel="settings"]:not([hidden]) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }