/* 色彩 token：语义色统一从这里取值，新增样式不要写裸 hex。
   --green/--orange 已收敛历史双写（绿 #18a778→#26a078、橙 #e49739→#d29740，与 badge/热力图/关卡同源）。 */
:root { --blue: #243e70; --blue-600: #3b5c93; --blue-soft: #edf0f4; --ink: #1b1d21; --muted: #7a7a78; --line: #eaeae8; --canvas: #f6f6f4; --green: #26a078;
  --green-bg: #eaf8f1; --orange: #d29740; --amber: #c98a2d; --red: #dd5d67; --red-400: #d28370; --radius: 11px;
  font-family: -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    'PingFang SC',
    'Microsoft YaHei',
    sans-serif;
  color: var(--ink); font-size: 14px; }
* { box-sizing: border-box; }
/* 首屏骨架：API 快照返回前的品牌占位，首个 render() 会整体替换 #app（含本节点） */
.boot-splash { height: 100dvh; display: grid; place-items: center; }
.boot-splash svg { width: 44px; height: 44px; animation: bootPulse 1.6s ease-in-out infinite; }
@keyframes bootPulse { 0%, 100% { opacity: .3; } 50% { opacity: .9; } }
@media (prefers-reduced-motion: reduce) { .boot-splash svg { animation: none; opacity: .7; } }
body { margin: 0; background: var(--canvas); height: 100dvh; overflow: hidden; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, a { touch-action: manipulation; }
button { cursor: pointer; }
button { border: 0; background: none; color: inherit; }
a { color: var(--blue); text-decoration: none; }
button:disabled { cursor: not-allowed; opacity: 0.45; }
button:focus-visible, a:focus-visible { outline: 3px solid #8fa3c6; outline-offset: 3px; }
/* 切页后焦点程序性落到页面标题（键盘可达性），标题不是交互元素，不画焦点环 */
.page-heading h1:focus { outline: none; }
input:focus, select:focus, textarea:focus { border-color: var(--blue); outline: 3px solid #243e7014; }
svg { width: 20px; height: 20px; flex-shrink: 0; vertical-align: middle; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 30px; letter-spacing: -1px; font-weight: 700; color: var(--ink); }
h2 { font-size: 16px; font-weight: 650; }
h3 { font-size: 14px; font-weight: 600; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.row { display: flex; align-items: center; gap: 12px; }
.between { justify-content: space-between; }
.stack { display: flex; flex-direction: column; gap: 5px; }
.sidebar { width: 232px; position: fixed; inset: 0 auto 0 0; background: white; border-right: 1px solid var(--line); display: flex;
  flex-direction: column; padding: 29px 18px 20px; z-index: 30; }
.brand { display: flex; align-items: center; gap: 11px; padding: 0 10px 34px; flex-shrink: 0; }
.brandmark { width: 39px; height: 39px; display: grid; place-items: center; }
.brandmark svg { width: 39px; height: 39px; display: block; }
.brand strong { font-size: clamp(15px, 1.35vw, 20px); letter-spacing: -0.6px; white-space: nowrap; }
.brand small { display: block; color: #82838a; font-size: 10px; letter-spacing: 1.5px; margin-top: 4px; }
.nav-label { font-size: 10px; letter-spacing: 1.4px; color: #8a8b90; padding: 9px 17px 12px; }
.nav { display: grid; gap: 6px; flex: 1; min-height: 0; overflow-y: auto; align-content: start; padding-right: 2px; }
.nav button { display: flex; align-items: center; gap: 12px; text-align: left; padding: 13px 16px; border-radius: 9px; color: #5c6067;
  font-size: 13px; }
.nav button:hover { background: #f4f4f2; }
.nav button.active { background: var(--blue-soft); color: var(--blue); font-weight: 600; box-shadow: inset 0 0 0 1px #d6dce6; }
.nav button .count { margin-left: auto; background: #dde2ea; font-size: 11px; padding: 2px 6px; border-radius: 5px; }
.sidebar-bottom { margin-top: auto; padding-top: 28px; }
.lab-card { border: 1px solid var(--line); border-radius: 12px; padding: 14px; background: #fafaf8; font-size: 12px; }
.lab-card p { margin-top: 7px; color: var(--muted); font-size: 11px; line-height: 1.7; }
.sidebar-footer { padding: 18px 7px 0; font-size: 10px; color: #8a8b90; display: flex; justify-content: space-between; }
.main { margin-left: 232px; height: 100dvh; display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.topbar { height: 68px; background: #fff; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between;
  padding: 0 30px; gap: 18px; flex-shrink: 0; }
.breadcrumb { color: #82838a; font-size: 12px; display: flex; align-items: center; gap: 10px; }
.breadcrumb span:last-child { color: #4a4e55; }
.back-link { display: inline-flex; align-items: center; gap: 5px; color: var(--blue); font-size: 12px; padding: 0; background: none; border: 0; cursor: pointer; }
.back-link:hover { text-decoration: underline; }
.back-arrow { transform: scaleX(-1); width: 15px; height: 15px; }
.top-actions { display: flex; align-items: center; gap: 19px; }
.mode { font-size: 11px; display: flex; align-items: center; gap: 7px; color: var(--muted); }
.dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); display: inline-block; }
.icon-btn { padding: 8px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; position: relative; }
.icon-btn:hover { background: var(--canvas); }
.notification-dot { position: absolute; right: 8px; top: 7px; width: 5px; height: 5px; border-radius: 50%; background: var(--orange);
  border: 1px solid white; }
.divider { width: 1px; height: 28px; background: var(--line); }
.avatar { width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #e7ebf1; color: #4a5e82;
  font-size: 12px; font-weight: 600; }
.avatar.a1 { background: #e8f5ef; color: #478d74; }
.avatar.a2 { background: #f8ecdf; color: #ad8354; }
.avatar.a3 { background: #f0ecfa; color: #9279b5; }
.avatar.a4 { background: #e5f2f5; color: #508c9b; }
.profile-name { font-size: 12px; line-height: 1.7; text-align: left; }
.profile-name small { font-size: 10px; color: var(--muted); display: block; }
.content { max-width: 1600px; margin: auto; padding: 22px 30px 20px; flex: 1; min-height: 0; overflow: hidden; width: 100%; }
.page-fit { height: 100%; display: flex; flex-direction: column; overflow: hidden; gap: 12px; }
.page-fit > * { flex-shrink: 0; }
.page-fit > .panel { flex: 1; min-height: 0; display: flex; flex-direction: column; margin-bottom: 0; }
.page-fit > .panel > .toolbar, .page-fit > .panel > .panel-head, .page-fit > .panel > .panel-foot, .page-fit > .panel > .pagination,
.page-fit > .panel > .perm-note { flex-shrink: 0; }
.page-fit > .panel > .table-wrap, .page-fit > .panel > .full-log, .page-fit > .panel > .lb-list, .page-fit > .panel > .rule-list,
.page-fit > .panel > .checkin-grid, .page-fit > .panel > .ann-list, .page-fit > .panel > .member-task-list,
.page-fit > .panel > .competition-cards, .page-fit > .panel > .member-grid, .page-fit > .panel > .group-grid,
.page-fit > .panel > .news-timeline, .page-fit > .panel > .task-board,
    .page-fit > .panel > .todo-list, .page-fit > .panel > .activity,
    .page-fit > .panel > .chart-body > .ach-grid { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; }
.page-fit > .panel > .table-wrap, .page-fit > .panel > .task-board { overflow-x: auto; }
.page-fit > .panel > .table-wrap.perm-wrap { overflow-y: auto; }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 14px; }
.page-heading h1 { font-size: 26px; letter-spacing: -1px; font-weight: 700; color: var(--ink); }
.page-heading p { font-size: 12px; color: var(--muted); margin-top: 11px; }
.eyebrow { color: var(--blue); font-size: 10px; letter-spacing: 1.4px; margin-bottom: 6px; font-weight: 600; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 15px; border-radius: 8px; background: white;
  border: 1px solid #e2e2e0; font-size: 12px; white-space: nowrap; min-height: 38px; transition: background .15s ease, border-color .15s ease,
  box-shadow .15s ease, transform .06s ease; }
.btn svg { width: 16px; height: 16px; }
.btn:active { transform: scale(0.98); }
.btn:hover { background: #f6f7f9; border-color: #c6ccd6; }
.btn.primary { background: var(--blue); border-color: var(--blue); color: white; box-shadow: 0 3px 5px #243e7014; }
.btn.primary:hover { background: #1c3260; }
.btn.danger { color: var(--red); background: #fff5f5; border-color: #f6d6d8; }
.btn.small { padding: 6px 10px; min-height: 30px; font-size: 11px; }
.text-btn { font-size: 11px; color: var(--blue); padding: 5px; }
.text-btn:hover { text-decoration: underline; }
.text-btn.muted-text { color: #82838a; }
.text-btn.muted-text:hover { color: #5a5e66; text-decoration: underline; }
.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.stat { padding: 14px 17px; background: white; border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 1px 3px rgba(20, 24, 35, .06), 0 6px 18px rgba(16, 24, 64, .04); transition: box-shadow .18s ease, transform .18s ease; }
button.stat { display: block; width: 100%; text-align: left; cursor: pointer; }
button.stat:active { transform: scale(0.985); }
.stat:hover { box-shadow: 0 2px 4px rgba(16, 24, 64, .04), 0 10px 26px rgba(16, 24, 64, .07); transform: translateY(-1px); }
.stat-top { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: #71757c; }
.stat-icon { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; background: #f3f3f1; color: var(--muted); }
.stat-icon.green { background: #eaf7f2; color: #55aa8c; }
.stat-icon.orange { background: #fff4e7; color: #deaa65; }
.stat-icon.purple { background: #f1edff; color: #9581d0; }
.stat-icon.red { background: #fff0ef; color: #d87978; }
.stat-value { font-size: 28px; font-weight: 700; letter-spacing: -1.2px; margin: 4px 0 8px; font-variant-numeric: tabular-nums;
  color: var(--ink); }
.stat-value small { font-size: 12px; font-weight: 400; letter-spacing: 0; color: var(--muted); margin-left: 8px; }
.stat-foot { font-size: 10px; color: var(--muted); display: flex; gap: 11px; align-items: center; }
.mini-tag { color: var(--green); background: #eef9f3; padding: 3px 6px; border-radius: 4px; }
.grid-main { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(285px, 1fr); gap: 22px; }
.panel { background: white; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; margin-bottom: 14px; min-width: 0;
  box-shadow: 0 1px 3px rgba(20, 24, 35, .06), 0 6px 18px rgba(16, 24, 64, .04); }
.panel-head { display: flex; align-items: center; justify-content: space-between; padding: 13px 18px; gap: 10px; }
.panel-head h2 { display: flex; align-items: center; gap: 9px; }
.panel-head h2 span { background: #f1f1ef; color: var(--muted); font-size: 10px; font-weight: 500; border-radius: 5px; padding: 3px 6px; }
.panel-head p { font-size: 11px; color: var(--muted); margin-top: 7px; }
.legend { display: flex; align-items: center; gap: 13px; font-size: 10px; color: var(--muted); }
.legend i { display: inline-block; width: 5px; height: 5px; border-radius: 50%; margin-right: 4px; }
.member-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 0 16px 10px; }
.member-card { border: 1px solid var(--line); border-radius: 10px; padding: 9px 10px; text-align: left; transition: 0.18s;
  background: #fff; box-shadow: 0 1px 3px rgba(20, 24, 35, .06); }
.member-card:hover { border-color: #c8ceda; box-shadow: 0 1px 3px rgba(20, 24, 35, .06); transform: translateY(-2px); }
.member-card .avatar { width: 34px; height: 34px; }
.member-card strong { font-size: 12px; font-weight: 600; }
.member-card small { display: block; font-size: 10px; color: var(--muted); margin-top: 4px; }
.member-card-bottom { display: flex; align-items: center; justify-content: space-between; margin-top: 15px; font-size: 10px; color: #82838a; gap: 5px; }
.badge { display: inline-flex; align-items: center; gap: 5px; border-radius: 5px; font-size: 10px; padding: 4px 7px; background: #f0f0ee;
  color: var(--muted); white-space: nowrap; line-height: 1.4; }
.badge:before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: currentColor; }
.badge.green { background: var(--green-bg); color: var(--green); }
.badge.blue { background: #edf0f4; color: var(--blue-600); }
.badge.orange { background: #fff3e4; color: var(--orange); }
.badge.red { background: #fff0ef; color: #d87978; }
.badge.purple { background: #f3effc; color: #9170bd; }
.panel-foot { border-top: 1px solid var(--line); padding: 9px 18px; font-size: 10px; color: #82838a; display: flex; align-items: center;
  justify-content: space-between; background: #fbfbf9; flex-shrink: 0; }
.utilization { display: flex; align-items: center; justify-content: center; gap: 28px; padding: 6px 22px 17px; }
.donut { width: 143px; height: 143px; border-radius: 50%; position: relative; flex-shrink: 0; display: grid; place-items: center;
  transform: rotate(-90deg); }
.donut:before { content: ''; position: absolute; inset: 15px; background: white; border-radius: 50%; }
.donut-label { position: relative; text-align: center; transform: rotate(90deg); }
.donut-label strong { font-size: 30px; letter-spacing: -1px; font-weight: 600; display: block; }
.donut-label span { font-size: 10px; color: var(--muted); display: block; margin-top: 4px; }
.chart-legend { display: grid; gap: 16px; min-width: 100px; }
.chart-legend div, .chart-legend span { display: flex; align-items: center; gap: 7px; font-size: 11px; color: var(--muted); }
.chart-legend b { margin-left: auto; color: #33363c; font-size: 12px; font-weight: 500; }
.chart-legend i { display: inline-block; width: 6px; height: 6px; border-radius: 2px; }
.usage-bottom { margin: 0 22px 19px; border-top: 1px solid var(--line); padding-top: 15px; display: flex; justify-content: space-between;
  font-size: 10px; color: var(--muted); }
.usage-bottom strong { color: var(--green); font-weight: 500; }
.todo-list { padding: 0 18px 4px; }
.todo { padding: 8px 0; display: flex; gap: 12px; border-bottom: 1px solid var(--line); align-items: center; }
.todo:last-child { border-bottom: 0; }
.todo-icon { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: var(--blue-soft); color: #4c6796;
  flex-shrink: 0; }
.todo-icon.orange { background: #fff4e6; color: #d7a059; }
.todo strong { display: block; font-size: 11px; font-weight: 500; line-height: 1.6; }
.todo small { font-size: 10px; color: var(--muted); display: block; margin-top: 5px; }
.todo .arrow { margin-left: auto; color: #8a8b90; }
.todo .arrow svg { width: 15px; }
.activity { padding: 0 22px 19px; }
.activity-item { padding: 0 0 12px 18px; border-left: 1px solid #e6e7e9; position: relative; font-size: 11px; margin-left: 3px; }
.activity-item:last-child { padding-bottom: 0; border-color: transparent; }
.activity-item:before { content: ''; position: absolute; left: -4px; top: 2px; width: 7px; height: 7px; border-radius: 50%; background: #cbd1da;
  border: 2px solid white; box-sizing: content-box; }
.activity-item small { display: block; color: #8a8b90; font-size: 10px; margin-top: 6px; }
.table-wrap { overflow-x: auto; overflow-y: hidden; }
.table-wrap.perm-wrap { overflow-y: auto; }
.perm-wrap thead th { position: sticky; top: 0; z-index: 2; }
table { width: 100%; border-collapse: collapse; white-space: nowrap; text-align: left; }
th { background: #f4f4f2; color: #4a4e55; font-size: 10px; font-weight: 600; padding: 8px 14px; border-bottom: 1px solid var(--line);
  letter-spacing: .02em; }
td { padding: 8px 14px; border-bottom: 1px solid #f0f0ee; font-size: 11px; color: #5a5e66; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #fafaf8; }
td strong { font-size: 11px; color: #33363c; font-weight: 500; display: block; }
td small { display: block; font-size: 10px; margin-top: 3px; color: var(--muted); }
.hardware-icon { width: 33px; height: 33px; border-radius: 8px; background: #f3f3f1; display: grid; place-items: center; color: #6b7078;
  flex-shrink: 0; }
.hardware-icon svg { width: 19px; height: 19px; }
.hardware-icon.comm { background: #edf1fb; color: #5d7bb5; }
.hardware-icon.sensor { background: #f2efe9; color: #8d7c57; }
.asset-image-wrap { margin: 16px 0; display: flex; align-items: flex-start; gap: 12px; }
.asset-image { width: 100%; max-height: 260px; object-fit: contain; border: 1px solid var(--line); border-radius: 10px; background: var(--canvas); }
.asset-image-wrap .btn.small { flex-shrink: 0; margin-top: 4px; }
.asset-image-placeholder { flex: 1; height: 130px; border: 1px dashed var(--line); border-radius: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: #a5adba; font-size: 12px; background: #fafbfe; }
.asset-image-placeholder svg { width: 26px; height: 26px; }
.page-footer { display: flex; justify-content: space-between; color: #8a8b90; font-size: 10px; padding: 2px 0 10px; gap: 15px; }
.page-footer .dot { width: 4px; height: 4px; margin-right: 5px; }
.toolbar { padding: 11px 18px; border-bottom: 1px solid var(--line); display: flex; gap: 10px; align-items: center; flex-wrap: wrap; flex-shrink: 0; }
.search-field { position: relative; flex: 1; min-width: 180px; max-width: 340px; }
.search-field svg { position: absolute; top: 10px; left: 11px; color: #82838a; width: 16px; }
.search-field input { width: 100%; padding-left: 35px; }
input, select, textarea { border: 1px solid #e2e2e0; border-radius: 6px; padding: 9px 11px; background: white; color: #3c4046; font-size: 12px;
  min-height: 36px; }
input::placeholder, textarea::placeholder { color: #8a8b90; }
/* 浏览器自动填充会强塞浅蓝底且普通 background 覆盖不掉，用 inset 阴影盖回白底，并固定文字/光标颜色 */
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active,
select:-webkit-autofill, textarea:-webkit-autofill {
  -webkit-text-fill-color: #3c4046; caret-color: #3c4046; box-shadow: 0 0 0 1000px white inset; -webkit-box-shadow: 0 0 0 1000px white inset; }
textarea { resize: vertical; min-height: 85px; }
select { max-width: 100%; }
.pagination { display: flex; justify-content: space-between; align-items: center; padding: 10px 18px; border-top: 1px solid var(--line);
  font-size: 11px; color: var(--muted); flex-shrink: 0; }
.pagination button { padding: 5px 9px; border: 1px solid var(--line); border-radius: 5px; background: white; }
.pagination button.current { background: var(--blue); color: white; }
.empty { text-align: center; padding: 48px 20px; color: #82838a; font-size: 12px; }
.empty svg { width: 30px; height: 30px; margin-bottom: 12px; color: #b0b1b5; }
.empty strong { display: block; color: #5a5e66; margin-bottom: 8px; }
.notice { padding: 12px 16px; border: 1px solid #dde2ea; background: #f2f4f7; color: #5a6a85; font-size: 12px; line-height: 1.8; border-radius: 9px;
  margin-bottom: 20px; }
.notice.warning { background: #fff8ed; border-color: #f2e6d1; color: #b68b47; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.field { display: flex; flex-direction: column; gap: 7px; font-size: 12px; color: #5a5e66; }
.field.full { grid-column: 1/-1; }
.field label { font-size: 12px; }
.field input, .field select, .field textarea { width: 100%; }
.form-error { font-size: 12px; color: var(--red); margin-top: 14px; line-height: 1.7; }
.form-error:empty { display: none; }
dialog { border: 1px solid var(--line); border-radius: 16px; padding: 0; width: min(580px, calc(100vw - 32px)); max-height: 88vh; color: var(--ink);
  box-shadow: 0 12px 40px rgba(20, 24, 35, .18); }
dialog::backdrop { background: #131a26b0; }
.modal-header { display: flex; justify-content: space-between; align-items: center; padding: 22px 25px; border-bottom: 1px solid var(--line);
  position: sticky; top: 0; background: white; z-index: 1; }
.modal-body { padding: 24px 25px; }
.modal-footer { display: flex; justify-content: flex-end; gap: 9px; padding: 18px 25px; border-top: 1px solid var(--line); background: #fafaf8; }
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 14px 0; font-size: 12px; }
.detail-grid dt { color: var(--muted); font-size: 11px; margin-bottom: 3px; }
.detail-grid dd { margin: 0; overflow-wrap: anywhere; }
.asset-picker { max-height: 210px; overflow-y: auto; border: 1px solid var(--line); border-radius: 8px; }
.asset-option { display: flex; gap: 10px; align-items: center; padding: 11px; border-bottom: 1px solid var(--line); font-size: 12px; }
.asset-option input { width: 16px; min-height: auto; }
.asset-option small { color: var(--muted); display: block; margin-top: 4px; }
#toasts { position: fixed; bottom: 25px; right: 25px; z-index: 200; display: grid; gap: 8px; max-width: calc(100vw - 40px); }
.toast { background: #22262b; color: white; box-shadow: 0 4px 14px rgba(20, 24, 35, .14); padding: 13px 14px 13px 18px; border-radius: 9px; font-size: 12px;
  animation: enter 0.2s ease; display: flex; align-items: center; gap: 10px; }
.toast-msg { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.toast-close { flex-shrink: 0; padding: 2px; color: #ffffffa8; display: inline-flex; }
.toast-close:hover { color: #fff; }
.toast-close svg { width: 14px; height: 14px; }
.toast.error { background: #b75160; }
@keyframes enter {
  from { transform: translateY(8px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.mobile-menu { display: none; }
.login { min-height: 100vh; display: grid; grid-template-columns: 1.04fr 1fr; background: white; }
.login-art { background: #f3f4f6; display: flex; flex-direction: column; padding: 42px 55px; position: relative; overflow: hidden; }
.login-art .brand { padding: 0; }
/* 顶部一行：主页同款校徽组合标（白色版压成深色）与实验室品牌并排，避免横版标独占一列显得又宽又扁 */
.login-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.login-top .brand { padding: 0; }
.login-school-logo { height: 30px; width: auto; filter: brightness(0); opacity: .78; display: block; }
.login-copy { margin: auto 0 0; position: relative; z-index: 1; }
.login-copy h1 { font-size: 38px; line-height: 1.5; letter-spacing: -1.5px; }
.login-copy p { font-size: 13px; color: var(--muted); line-height: 2; margin-top: 17px; }
.mecha { --mk-plate: #3f454d; --mk-plate2: #2e333a; --mk-deep: #1b1e23; --mk-track: #c9ccd1; --mk-antenna: #8a9099;
  --mk-acc: #e0a24a; --mk-blade: #e8eaee; --mk-face: #f4f5f7; --mk-face2: #d8dadd; --mk-visor: #22262b;
  --mk-hill: #d3d6da; --mk-facet: #c6cacf; --mk-ridge: #a9aeb6; --mk-far: #dde0e4; --mk-far2: #e3e5e8; --mk-snow: #fdfdfe;
  --mk-rock: #c6c9ce; --mk-rock-hi: #dcdfe3; --mk-trail: #cdd1d6; --mk-flake: #fbfbfc; --mk-flake-edge: #c9cdd2;
  display: block; width: 100%; max-width: 360px; margin: 26px auto 10px; padding: 0; border: 0; background: none; }
.mecha svg { width: 100%; height: auto; display: block; }
.mk-plate { fill: var(--mk-plate); }
.mk-plate2 { fill: var(--mk-plate2); }
.mk-deep { fill: var(--mk-deep); }
.mk-acc { fill: var(--mk-acc); }
.mk-blade { fill: var(--mk-blade); stroke: var(--mk-deep); stroke-width: 1.1; stroke-linejoin: round; }
.mk-s-acc { fill: none; stroke: var(--mk-acc); }
.mk-s-face { fill: none; stroke: var(--mk-face); }
.mk-hill { fill: var(--mk-hill); }
.mk-facet { fill: var(--mk-facet); }
.mk-snow { fill: var(--mk-snow); }
.mk-far, .mk-far2, .mk-ridge { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.mk-far { stroke: var(--mk-far); stroke-width: 2.5; }
.mk-far2 { stroke: var(--mk-far2); stroke-width: 2; }
.mk-ridge { stroke: var(--mk-ridge); stroke-width: 2; }
.mk-trail-path { fill: none; stroke: var(--mk-trail); stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; opacity: .95; }
.mk-rock { fill: var(--mk-rock); }
.mk-hi { fill: none; stroke: var(--mk-rock-hi); stroke-width: 1.5; stroke-linecap: round; }
.mk-track { fill: var(--mk-track); }
.mk-flake { fill: var(--mk-flake); stroke: var(--mk-flake-edge); stroke-width: .6; transform-box: view-box; }
.h-face { fill: var(--mk-face); stroke: var(--mk-deep); stroke-width: .9; stroke-linejoin: round; }
.h-face2 { fill: var(--mk-face2); }
.h-visor { fill: var(--mk-visor); }
.h-acc { fill: var(--mk-acc); }
.h-s-acc { fill: none; stroke: var(--mk-acc); }
.h-s-face { fill: none; stroke: var(--mk-face); }
.h-s-visor { fill: none; stroke: var(--mk-visor); }
.h-s-antenna { fill: none; stroke: var(--mk-antenna); }
.mk-cut-a, .mk-cut-b { opacity: 0; }
.mk-word { font-family: inherit; font-size: 42px; font-weight: 700; fill: var(--mk-deep); letter-spacing: 2px; }
.mk-cutline { fill: none; stroke: #ffffff; stroke-width: 3.2; stroke-linecap: round; opacity: 0; }
@media (prefers-reduced-motion: no-preference) {
  .mk-body { animation: mkClimbBob .92s linear infinite; }
  .mk-leg-b { transform-box: view-box; transform-origin: 150px 130px; animation: mkClimbLeg .92s linear infinite; }
  .mk-shin-b { transform-box: view-box; transform-origin: 150px 153px; animation: mkClimbShin .92s linear infinite; }
  .mk-leg-f { transform-box: view-box; transform-origin: 170px 130px; animation: mkClimbLeg .92s linear infinite -.46s; }
  .mk-shin-f { transform-box: view-box; transform-origin: 170px 153px; animation: mkClimbShin .92s linear infinite -.46s; }
  .mk-arm-l { transform-box: view-box; transform-origin: 138px 98px; animation: mkClimbArmL .92s linear infinite; }
  .mk-fore-l { transform-box: view-box; transform-origin: 138px 119px; animation: mkClimbForeL .92s linear infinite; }
  .mk-arm-r { transform-box: view-box; transform-origin: 182px 98px; animation: mkClimbArmR .92s linear infinite; }
  .mk-fore-r { transform-box: view-box; transform-origin: 182px 119px; animation: mkClimbForeR .92s linear infinite; }
  .mk-sword { transform-box: view-box; transform-origin: 182.5px 137px; }
  .mk-core { animation: mkCore 1.4s ease-in-out infinite; }
  .mk-glint { animation: mkGlint 3.4s linear infinite; }
  .mk-track { animation: mkClimbStreak 2.2s linear infinite; }
  .mk-track.s2 { animation-delay: -.75s; }
  .mk-track.s3 { animation-delay: -1.5s; }
  .mk-flake { animation: mkFall 6.5s linear infinite; }
  .mk-flake.b { animation-name: mkFallB; }
  .slashing .mk-arm-r { animation: mkSlashArm .7s cubic-bezier(.3, .7, .4, 1) both; }
  .slashing .mk-fore-r { animation: mkSlashFore .7s cubic-bezier(.3, .7, .4, 1) both; }
  .slashing .mk-sword { animation: mkSlashSword .7s cubic-bezier(.3, .7, .4, 1) both; }
  .slashing .mk-glint { animation: none; }
  .slashing .mk-cut-a { animation: mkCutA .7s linear both; }
  .slashing .mk-cut-b { animation: mkCutB .7s linear both; }
  .slashing .mk-cutline { animation: mkCutline .7s linear both; }
}
@keyframes mkClimbLeg { 0% { transform: rotate(11deg); } 50% { transform: rotate(-11deg); } 100% { transform: rotate(11deg); } }
@keyframes mkClimbShin { 0% { transform: rotate(6deg); } 25% { transform: rotate(56deg); } 50% { transform: rotate(2deg); } 75% { transform: rotate(20deg); } 100% { transform: rotate(6deg); } }
@keyframes mkClimbBob { 0%, 50%, 100% { transform: translateY(0); } 25%, 75% { transform: translateY(-7px); } }
@keyframes mkClimbArmL { 0% { transform: rotate(-40deg); } 40% { transform: rotate(-98deg); } 70% { transform: rotate(-60deg); } 100% { transform: rotate(-40deg); } }
@keyframes mkClimbForeL { 0% { transform: rotate(-14deg); } 40% { transform: rotate(-8deg); } 70% { transform: rotate(-36deg); } 100% { transform: rotate(-14deg); } }
@keyframes mkClimbArmR { 0% { transform: rotate(2deg); } 50% { transform: rotate(-3deg); } 100% { transform: rotate(2deg); } }
@keyframes mkClimbForeR { 0% { transform: rotate(-2deg); } 50% { transform: rotate(-6deg); } 100% { transform: rotate(-2deg); } }
@keyframes mkClimbStreak { 0% { transform: translateX(44px); opacity: 0; } 18% { opacity: .8; } 72% { opacity: .8; } 100% { transform: translateX(-92px); opacity: 0; } }
@keyframes mkFall { 0% { transform: translate(0, -34px); opacity: 0; } 16% { opacity: .9; } 76% { opacity: .9; } 100% { transform: translate(7px, 165px); opacity: 0; } }
@keyframes mkFallB { 0% { transform: translate(0, -34px); opacity: 0; } 16% { opacity: .9; } 76% { opacity: .9; } 100% { transform: translate(-7px, 165px); opacity: 0; } }
@keyframes mkGlint { 0%, 70% { transform: translate(0, 0); opacity: 0; } 76% { opacity: 1; }
  90% { transform: translate(22px, -47px); opacity: 0; } 100% { opacity: 0; } }
@keyframes mkCore { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes mkSlashArm { 0%, 16% { transform: rotate(0); } 26% { transform: rotate(-40deg); } 34% { transform: rotate(35deg); }
  42% { transform: rotate(30deg); } 68%, 100% { transform: rotate(0); } }
@keyframes mkSlashFore { 0%, 16% { transform: rotate(0); } 26% { transform: rotate(-10deg); } 34% { transform: rotate(5deg); }
  68%, 100% { transform: rotate(0); } }
@keyframes mkSlashSword { 0%, 16% { transform: rotate(0); } 26% { transform: rotate(30deg); } 34% { transform: rotate(55deg); }
  42% { transform: rotate(60deg); } 68%, 100% { transform: rotate(0); } }
@keyframes mkCutA { 0%, 4% { opacity: 0; transform: translate(0, 0); } 8% { opacity: 1; transform: translate(0, 0); }
  32% { opacity: 1; transform: translate(0, 0); } 62%, 100% { opacity: 0; transform: translate(18px, -28px); } }
@keyframes mkCutB { 0%, 4% { opacity: 0; transform: translate(0, 0); } 8% { opacity: 1; transform: translate(0, 0); }
  32% { opacity: 1; transform: translate(0, 0); } 62%, 100% { opacity: 0; transform: translate(-18px, 28px); } }
@keyframes mkCutline { 0%, 30% { opacity: 0; } 35% { opacity: 1; } 50%, 100% { opacity: 0; } }
/* 机甲下方的题词：与机甲同宽居中，紧贴其下，读作机甲的注脚而非独立引文 */
.login-quote { max-width: 360px; margin: 0 auto 20px; text-align: center; }
.login-quote p { font-size: 12px; line-height: 1.85; color: #5a5e66; }
.login-quote cite { display: block; margin-top: 6px; font-size: 10px; font-style: normal; letter-spacing: .4px; color: #9a9ba0; }
.login-art-footer { font-size: 10px; color: var(--muted); margin-top: auto; }
.login-form-wrap { display: grid; place-items: center; padding: 45px; }
.login-form { width: 100%; max-width: 370px; }
.login-form h1 { font-size: 27px; }
.login-form > p { color: var(--muted); font-size: 12px; margin: 12px 0 32px; }
.login-form .field { margin-bottom: 19px; }
.login-form .btn.primary { width: 100%; margin-top: 5px; }
.test-accounts { margin-top: 32px; padding: 18px; border: 1px solid var(--line); background: #fafaf8; border-radius: 11px; }
.test-accounts > p { font-size: 11px; color: var(--muted); margin-bottom: 12px; }
.account-buttons { display: flex; gap: 7px; }
.account-buttons button { flex: 1; border: 1px solid #e0e0de; padding: 10px 4px; border-radius: 6px; background: white; font-size: 11px; }
.account-buttons button:hover { color: var(--blue); border-color: var(--blue); }
.test-accounts small { font-size: 10px; color: var(--muted); display: block; margin-top: 12px; }
.login-caption { font-size: 10px; line-height: 1.8; color: #8a8b90; margin-top: 21px; }
.profile-panel { padding: 14px 16px; }
.profile-panel .avatar { width: 54px; height: 54px; font-size: 20px; }
.progress-track { height: 5px; background: #ececea; border-radius: 3px; overflow: hidden; margin-top: 10px; }
.progress-track span { display: block; background: #3f5e8f; height: 100%; border-radius: 3px; }
.model-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.model-summary > div { padding: 12px 14px; background: white; border: 1px solid var(--line); border-radius: 10px; font-size: 11px; }
.model-summary b { font-size: 16px; display: block; margin: 6px 0 4px; }
.privacy-note { font-size: 11px; line-height: 1.8; color: var(--muted); margin-top: 18px; }
.overlay { display: none; }
.full-log { padding: 14px 20px 8px; }
.full-log .activity-item { padding-bottom: 14px; font-size: 12px; }
.controls-wrap { display: flex; gap: 9px; flex-wrap: wrap; }
.loading { padding: 100px 20px; text-align: center; color: var(--muted); }
@media (min-width: 1550px) {
  .member-grid { gap: 12px; }
  .member-card { padding: 13px; }
  .utilization { padding: 12px 24px 16px; }
  .donut { width: 150px; height: 150px; }
  td { padding-top: 12px; padding-bottom: 12px; }
}
@media (max-width: 1180px) {
  .sidebar { width: 205px; padding-left: 12px; padding-right: 12px; }
  .main { margin-left: 205px; }
  .content { padding: 20px 24px 16px; }
  .topbar { padding: 0 23px; }
  .grid-main { grid-template-columns: minmax(0, 1.6fr) minmax(270px, 1fr); gap: 16px; }
  .stats { gap: 12px; }
  .stat { padding: 13px; }
  .member-grid { grid-template-columns: repeat(2, 1fr); }
  .member-grid .member-card:nth-child(n + 5) { display: none; }
  .utilization { gap: 16px; }
  .donut { width: 125px; height: 125px; }
  .chart-legend { min-width: 85px; }
  .legend { gap: 7px; }
}
@media (max-width: 960px) {
  .grid-main { grid-template-columns: minmax(0, 1fr); }
  .grid-main.grid-fill { overflow-y: auto; }
  .grid-side { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  .grid-side .panel:last-child { grid-column: 1/-1; }
  .member-grid { grid-template-columns: repeat(3, 1fr); }
  .member-grid .member-card:nth-child(n + 5) { display: block; }
  .stats, .model-summary { grid-template-columns: repeat(2, 1fr); }
  .mode { display: none; }
  .login-art { padding: 35px; }
  .login-copy h1 { font-size: 30px; }
  .mecha { max-width: 330px; margin: 26px auto 10px; }
  .login-quote { max-width: 330px; }
  .login-form-wrap { padding: 30px; }
}
@media (max-width: 700px) {
  .sidebar { transform: translateX(-100%); transition: transform 0.2s; width: 232px; }
  .sidebar.open { transform: translateX(0); }
  .overlay.open { display: block; position: fixed; inset: 0; background: #14181f4a; z-index: 25; }
  .main { margin-left: 0; }
  .topbar { height: 65px; padding: 0 17px; }
  .mobile-menu { display: inline-flex; }
  .breadcrumb { font-size: 11px; gap: 6px; }
  .breadcrumb .home-label { display: none; }
  .top-actions { gap: 8px; }
  .top-actions > .divider, .profile-name { display: none; }
  .content { padding: 23px 16px; }
  .page-heading { align-items: flex-start; gap: 12px; margin-bottom: 20px; }
  .page-heading h1 { font-size: 23px; }
  .page-heading p { font-size: 11px; line-height: 1.8; margin-top: 7px; }
  .page-heading .controls-wrap { flex-direction: column; }
  .page-heading .btn { font-size: 11px; padding: 8px 10px; min-height: 33px; }
  .eyebrow { font-size: 10px; }
  .stats { gap: 10px; margin-bottom: 16px; }
  .stat { padding: 14px; }
  .stat-value { font-size: 28px; margin-top: 8px; }
  .stat-foot { font-size: 10px; gap: 5px; }
  .stat-top { font-size: 11px; }
  .stat-icon { width: 28px; height: 28px; }
  .stat-icon svg { width: 16px; }
  .grid-main { gap: 0; }
  .grid-side { display: block; }
  .panel { margin-bottom: 16px; }
  .panel-head { padding: 18px 16px; }
  .panel-head h2 { font-size: 14px; }
  .member-grid { grid-template-columns: repeat(2, 1fr); padding: 0 16px 16px; gap: 10px; }
  .member-card { padding: 12px 10px; }
  .legend { display: none; }
  .panel-foot { padding: 11px 16px; }
  .page-footer { font-size: 10px; line-height: 1.7; }
  .page-footer span:last-child { display: none; }
  .form-grid { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
  .modal-body { padding: 20px; }
  .modal-header { padding: 17px 20px; }
  .modal-footer { padding: 15px 20px; }
  .toolbar { padding: 14px; gap: 8px; }
  .toolbar select { flex: 1; min-width: 100px; }
  .search-field { max-width: none; flex-basis: 100%; }
  .login { grid-template-columns: 1fr; }
  .login-art { display: none; }
  .login-form-wrap { padding: 36px 25px; }
  .login-form:before { content: '具身智能实验室 / 管理平台'; display: block; font-size: 14px; color: var(--blue); margin-bottom: 40px; font-weight: 600; }
  .utilization { justify-content: space-evenly; padding: 10px 20px 22px; }
  .donut { width: 145px; height: 145px; }
  .chart-legend { min-width: 115px; }
  .model-summary { gap: 10px; }
  .detail-grid { gap: 15px; }
  .profile-panel { padding: 20px; }
  .notice { font-size: 11px; }
  .panel-head .controls-wrap { gap: 5px; }
  .pagination { padding: 14px; font-size: 10px; }
  .login-form > p { line-height: 1.8; }
}
@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
.mini-tag { flex-shrink: 0; white-space: nowrap; }
.stat-foot { flex-wrap: wrap; row-gap: 5px; }
.stat-foot > span { white-space: nowrap; }
.competition-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; padding: 0 22px 20px; }
.competition-brief { display: flex; align-items: center; gap: 12px; text-align: left; padding: 13px; border-radius: 9px; min-width: 0; }
.competition-brief:hover { background: #f6f7f9; }
.competition-brief strong { font-size: 12px; line-height: 1.6; }
.competition-brief small { font-size: 10px; line-height: 1.7; }
.competition-brief .badge { display: none; }
.contest-date { background: #edf0f4; border-radius: 9px; width: 46px; height: 52px; flex-shrink: 0; display: flex; align-items: center;
  justify-content: center; flex-direction: column; color: var(--blue-600); }
.contest-date b { font-size: 22px; line-height: 1.2; }
.contest-date small { font-size: 10px; }
.competition-cards { padding: 14px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; grid-auto-rows: min-content; align-content: start; }
.contest-card { border: 1px solid var(--line); padding: 14px 16px; border-radius: 12px; min-width: 0; }
.contest-category { color: var(--muted); font-size: 10px; display: flex; align-items: center; gap: 6px; }
.contest-category svg { width: 16px; height: 16px; }
.contest-card h2 { margin: 12px 0 7px; font-size: 16px; }
.contest-summary { font-size: 11px; line-height: 1.8; color: var(--muted); min-height: 20px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.contest-meta { display: grid; gap: 8px; margin: 12px 0; }
.contest-meta > div { display: flex; gap: 10px; align-items: flex-start; color: var(--muted); }
.contest-meta svg { width: 17px; height: 17px; }
.contest-meta span { font-size: 10px; }
.contest-meta strong { font-size: 11px; color: #4a4e55; display: block; margin-top: 4px; font-weight: 500; line-height: 1.6; }
.contest-next { padding: 8px 10px; background: #f4f4f2; border-radius: 6px; font-size: 10px; color: #71757c; margin-bottom: 12px; display: flex; gap: 8px;
  align-items: center; }
.contest-next .dot { flex-shrink: 0; }
.contest-card > .row:last-child { gap: 5px; }
.contest-card > .row:last-child > span { font-size: 10px; line-height: 1.6; }
.contest-timeline { margin-left: 6px; }
.stage-item { position: relative; border-left: 1px solid #e0e0de; padding: 0 0 23px 26px; margin-left: 5px; }
.stage-item:last-child { border-color: transparent; padding-bottom: 5px; }
.stage-number { position: absolute; left: -12px; top: 0; width: 23px; height: 23px; background: #edf0f4; color: #4c6796; border: 3px solid white;
  border-radius: 50%; font-size: 10px; display: grid; place-items: center; }
.stage-item.past .stage-number { background: #e9f5ef; color: #61a58b; }
.stage-item strong { font-size: 12px; font-weight: 600; }
.stage-item small { font-size: 10px; color: #8a8b90; }
.stage-item time { display: block; font-size: 10px; color: var(--muted); margin: 7px 0; }
.stage-item p { font-size: 11px; line-height: 1.8; color: var(--muted); }
.contest-requirements { background: #f4f4f2; border: 1px solid var(--line); padding: 17px; border-radius: 10px; font-size: 12px; color: #5a5e66;
  line-height: 2; overflow-wrap: anywhere; }
.stage-form-row { border: 1px solid var(--line); border-radius: 9px; padding: 13px; margin-top: 10px; background: #fafaf8; }
.stage-form-row > .row { margin-bottom: 10px; }
.stage-form-row label { display: grid; gap: 8px; }
.stage-form-row .form-grid { gap: 12px; }
.stage-form-row .icon-btn svg { width: 15px; height: 15px; }
@media (max-width: 1180px) {
  .competition-overview { grid-template-columns: 1fr; }
  .competition-brief .badge { display: inline-flex; }
  .competition-cards { gap: 14px; padding: 16px; }
  .contest-card { padding: 17px; }
}
@media (max-width: 760px) {
  .competition-cards { grid-template-columns: 1fr; }
  .competition-overview { padding: 0 10px 15px; }
  .contest-card h2 { font-size: 17px; }
  .competition-brief strong { font-size: 11px; }
  .contest-card > .row:last-child { flex-wrap: wrap; }
}
.grid-main > div { min-width: 0; }
.form-section-heading { display: flex; align-items: center; gap: 9px; margin: 3px 0 17px; }
.form-grid + .form-section-heading { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line); }
.form-section-heading > span { font-size: 10px; font-weight: 600; color: #4c6796; background: #edf0f4; border-radius: 5px; padding: 4px 6px; }
.form-section-heading h3 { font-size: 13px; }
.form-section-heading ~ .form-grid + .form-grid { margin-top: 17px; }
.password-help { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 13px; color: var(--muted);
  font-size: 10px; }
.check-label { display: flex; align-items: center; gap: 6px; font-size: 11px; color: #6b7078; cursor: pointer; }
.check-label input { min-height: 0; width: 14px; height: 14px; accent-color: var(--blue); }
.account-success { text-align: center; padding: 7px 0 21px; }
.success-mark { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: #e9f8f0; color: #32a77c;
  margin: 0 auto 18px; }
.success-mark svg { width: 27px; height: 27px; }
.account-success h2 { font-size: 18px; }
.account-success p { font-size: 12px; color: var(--muted); margin-top: 10px; }
.account-result { background: #f4f4f2; border: 1px solid var(--line); border-radius: 10px; padding: 0 18px; }
.account-result dd { font-size: 12px; font-weight: 500; line-height: 1.7; }
.member-status-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.member-status-tile { display: flex; gap: 10px; align-items: center; padding: 9px 12px; border: 1px solid var(--line); background: white;
  border-radius: 12px; text-align: left; transition: border-color 0.15s; }
.member-status-tile:hover, .member-status-tile.selected { border-color: #b8c1d2; }
.member-status-tile.selected { box-shadow: 0 0 0 2px #243e7008; }
.member-status-tile > span:nth-child(2) { flex: 1; }
.member-status-tile small { display: block; color: var(--muted); font-size: 11px; margin-bottom: 3px; }
.member-status-tile b { font-size: 17px; font-weight: 600; line-height: 1; }
.member-status-tile i { font-style: normal; font-size: 10px; font-weight: 400; color: var(--muted); margin-left: 6px; }
.member-status-tile > svg { width: 14px; color: #b0b1b5; }
.modal-body .form-grid label { line-height: 1.5; }
dialog[open] { animation: enter 0.16s ease; }
.sidebar { overflow: hidden; }
.sidebar-bottom { flex-shrink: 0; }
@media (max-width: 1050px) {
  .member-status-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .member-status-summary { gap: 10px; }
  .member-status-tile { padding: 14px; gap: 9px; }
  .member-status-tile > svg { display: none; }
  .password-help { align-items: flex-start; flex-direction: column; }
  .account-success h2 { font-size: 16px; }
  .sidebar { height: 100dvh; }
  .form-section-heading { margin-bottom: 14px; }
}

/* ── 任务看板 ── */
.task-board { display: flex; flex-direction: column; gap: 12px; padding: 14px 16px; }
.task-board-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; flex: 1; min-height: 0; }
.view-tabs { display: inline-flex; gap: 4px; background: var(--canvas); border: 1px solid var(--line); border-radius: 10px; padding: 4px; align-self: flex-start; }
.tab-panel { display: flex; flex-direction: column; min-height: 0; }
.tab-panel > .panel-head { flex-shrink: 0; }
.tab-panel .view-tabs { align-self: stretch; padding: 0 18px 10px; border-bottom: 1px solid var(--line); margin-bottom: 0; border-radius: 0; background: none; border-left: 0; border-right: 0; border-top: 0; }
.tab-body { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
.tab-body > .panel { margin-bottom: 0; flex: 1; min-height: 0; display: flex; flex-direction: column; }
.tab-body > .panel > .chart-body { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.tab-body > .panel > .chart-body > .ach-grid { flex: 1; min-height: 0; }
.tab-body > .lb-podium { flex-shrink: 0; }
.tab-body > .panel > .lb-list, .tab-body > .panel > .rule-list { flex: 1; min-height: 0; overflow-y: auto; }
.tab-body > .panel > .full-log { flex: 1; min-height: 0; overflow-y: auto; }
.tab-body > .panel > .table-wrap { flex: 1; min-height: 0; overflow-y: auto; }
.tab-body > .panel > .pagination { flex-shrink: 0; }
.grid-main.grid-fill { flex: 1; min-height: 0; }
.grid-main.grid-fill > div { min-height: 0; display: flex; flex-direction: column; }
.grid-main.grid-fill > div > .panel { flex: 1; min-height: 0; margin-bottom: 12px; display: flex; flex-direction: column; overflow-y: auto; }
.grid-main.grid-fill > div > .panel > .panel-head, .grid-main.grid-fill > div > .panel > .panel-foot { flex-shrink: 0; }
.grid-main.grid-fill > div > .tab-panel { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.grid-main.grid-fill > div > .panel:last-child { margin-bottom: 0; }
.grid-main.grid-fill .tab-panel { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.grid-main.grid-fill > div > .panel > .table-wrap, .grid-main.grid-fill > div > .panel > .member-grid { flex: 1; min-height: 0; overflow-y: auto; }
.page-fit > .tab-panel { flex: 1; min-height: 0; display: flex; flex-direction: column; }
/* 成员详情页：面板按内容自适应高度（修复 .panel overflow:hidden + flex 等分导致的静默裁切），
   高度不够时整列滚动（可见），任何视口都不再切内容 */
#tab-body-member-detail { overflow-y: auto; overflow-x: hidden; }
#tab-body-member-detail > .panel { flex: 1 0 auto; }
#tab-body-member-detail > .panel > .chart-body { flex: 0 0 auto; overflow: visible; }
/* 数据概览：任务趋势 + 积分并排（省一屏高度），到场热力整行 */
#tab-body-member-detail > .chart-duo { flex: 1 0 auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
#tab-body-member-detail > .chart-duo > .panel { margin-bottom: 0; }
/* 行高锁死为容器高：右列档案再长也只在自身内部滚动，不把左列一起撑出滚动条 */
.grid-main.grid-fill.member-fill { grid-template-rows: minmax(0, 1fr); }
@media (max-width: 900px) { #tab-body-member-detail > .chart-duo { grid-template-columns: 1fr; } }
.page-fit > .panel.nav-admin-panel { flex: 0 1 auto; max-height: 40%; display: flex; flex-direction: column; }
.nav-admin-panel .nav-admin { flex: 1; min-height: 0; overflow-y: auto; }
.vt { padding: 7px 16px; font-size: 12px; font-weight: 600; color: var(--muted); border-radius: 6px; transition: 0.15s; }
.vt:hover { color: var(--ink); }
.vt.active { background: #fff; color: var(--blue); box-shadow: 0 1px 5px rgba(31, 63, 160, 0.1); }
.task-col { display: flex; flex-direction: column; min-height: 0; }
.task-col-head { display: flex; align-items: center; justify-content: space-between; padding: 0 4px 8px; border-bottom: 2px solid var(--line); margin-bottom: 8px; flex-shrink: 0; }
.task-col-head strong { font-size: 13px; font-weight: 650; }
.task-col-head small { font-size: 11px; color: var(--muted); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.task-col-body { display: flex; flex-direction: column; gap: 8px; overflow-y: auto; overflow-x: hidden; }
.task-col-more { flex-shrink: 0; margin-top: 8px; padding: 6px; border: 1px dashed var(--line); border-radius: 8px; font-size: 11px; color: var(--muted); width: 100%; text-align: center; }
.task-col-more:hover { color: var(--blue); border-color: #c3cad8; }
.task-col[data-status='todo'] .task-col-head strong { color: var(--muted); }
.task-col[data-status='doing'] .task-col-head strong { color: var(--blue); }
.task-col[data-status='submitted'] .task-col-head strong { color: var(--amber); }
.task-col[data-status='done'] .task-col-head strong { color: var(--green); }
.task-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 9px 11px; cursor: pointer; transition: box-shadow 0.15s, transform 0.15s; text-align: left; display: block; }
.task-card:hover { box-shadow: 0 1px 3px rgba(20, 24, 35, .07); border-color: #c3cad8; }
.task-card h4 { font-size: 13px; font-weight: 600; margin: 6px 0 3px; line-height: 1.35; }
.task-card p { font-size: 11px; }
.task-card-group { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; font-size: 10px; color: var(--blue); background: var(--blue-soft); padding: 3px 8px; border-radius: 5px; }
.task-card-foot { display: flex; gap: 4px; margin-top: 7px; padding-top: 7px; border-top: 1px dashed var(--line); }

/* 任务的按成员 / 按小组视图 */
.member-task-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
.member-task-card, .group-task-card { position: relative; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; text-align: left; transition: 0.15s; }
.member-task-card:hover, .group-task-card:hover { border-color: #c3cad8; box-shadow: 0 1px 3px rgba(20, 24, 35, .06); transform: translateY(-2px); }
.member-task-card.active, .group-task-card.active { border-color: var(--blue); background: #f2f4f7; }
.member-task-card .avatar { width: 34px; height: 34px; }
.member-task-card strong, .group-task-card strong { font-size: 13px; font-weight: 600; }
.member-task-card small, .group-task-card small { display: block; font-size: 10px; color: var(--muted); margin-top: 3px; }
.group-task-card .group-avatar { width: 34px; height: 34px; border-radius: 9px; background: #e7ebf1; color: #3e5a8c; display: grid; place-items: center; }
.count-chip { margin-left: auto; min-width: 22px; height: 22px; border-radius: 11px; background: var(--blue); color: #fff; font-size: 11px; display: grid; place-items: center; font-variant-numeric: tabular-nums; }
.sub-view { margin-top: 18px; border-top: 1px dashed var(--line); padding-top: 14px; }
.sub-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.sub-head strong { font-size: 13px; }
.sub-head small { font-size: 11px; color: var(--muted); }
.sub-head .text-btn { margin-left: auto; }
.member-task-list { display: flex; flex-direction: column; gap: 8px; }
/* 成员详情「任务」列表：行内容与面板标题左右对齐（18px），状态徽章与「查看」靠右（此前贴边 + 右侧大片死白） */
#tab-body-member-detail > .panel > .member-task-list { padding: 0 18px 4px; }
#tab-body-member-detail > .panel > .member-task-list .todo > .row { margin-left: auto; }

/* 成员详情页：图表与热力 */
.chart-body { padding: 6px 2px 2px; }
.mini-bars { display: flex; align-items: flex-end; gap: 6px; height: 96px; padding: 4px 0 0; }
.mb-col { flex: 1; min-width: 24px; height: 100%; display: flex; flex-direction: column; align-items: center; }
/* 柱高百分比需要一个有确定高度的包含块：mb-bar-wrap 撑满去掉标签后的空间 */
.mb-bar-wrap { width: 100%; flex: 1; min-height: 0; display: flex; align-items: flex-end; justify-content: center; }
.mb-bar { width: 60%; max-width: 26px; border-radius: 5px 5px 0 0; background: var(--blue-600); position: relative; min-height: 3px; transition: height 0.35s; }
.mb-done { position: absolute; bottom: 0; left: 0; right: 0; display: block; background: var(--green); }
.mb-col > span { font-size: 10px; color: var(--muted); flex-shrink: 0; padding-top: 6px; }
.heatmap-wrap { display: flex; flex-direction: column; gap: 6px; padding-top: 4px; }
.heat-months { display: grid; gap: 4px; font-size: 10px; color: #8a8b90; }
.heat-months b { font-weight: 500; white-space: nowrap; }
.heat-grid { display: grid; gap: 4px; align-items: start; }
.heat-wd { display: grid; grid-template-rows: repeat(7, 16px); gap: 3px; font-size: 10px; color: var(--muted); }
.heat-wd span { display: flex; align-items: center; justify-content: flex-end; padding-right: 2px; }
.heatmap { display: grid; gap: 4px; }
.heat-week { display: grid; grid-template-rows: repeat(7, 16px); gap: 3px; }
.heat-cell { border-radius: 3px; background: #ededeb; display: grid; place-items: center; font-size: 10px; color: transparent; overflow: hidden; }
.heat-cell.off { visibility: hidden; }
.heat-cell.on1 { background: #cfe7da; color: #2a7d5c; }
.heat-cell.on2 { background: #7fc5a4; color: #fff; }
.heat-cell.on3 { background: var(--green); color: #fff; }
.heat-cell:hover { outline: 1px solid var(--blue); }
.score-chip { font-size: 11px; color: var(--amber); letter-spacing: 1px; }
.empty.small { min-height: 60px; padding: 16px 14px; }
.empty.small svg { width: 20px; height: 20px; margin-bottom: 6px; }
/* 任务查询 / 审核表单 */
.query-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin-top: 14px; }
.query-result { margin-top: 14px; }
.query-form .field { min-width: 0; }
/* 截止区间含两个日期输入，横跨两列才不会把右列挤出面板 */
.query-form > .field:last-child { grid-column: span 2; }
.query-form > .field:last-child .row > input { flex: 1; min-width: 0; }
/* 任务看板的成员/小组/查询子视图在面板内滚动，避免内容被面板底边截断 */
.panel.task-board > .sub-view { flex: 1; min-height: 0; overflow-y: auto; }
.review-box { margin-top: 14px; border: 1px solid var(--line); background: var(--canvas); border-radius: 10px; padding: 12px 14px; }
.review-box label { font-size: 11px; color: var(--muted); display: block; margin-bottom: 6px; }
.score-picker .star.on { color: var(--amber); transform: scale(1.2); }
/* 任务详情媒体墙：图片网格 + 视频内嵌直播 */
.task-detail-page { gap: 10px; }
.media-wall { display: flex; flex-direction: column; min-height: 0; }
.media-scroll { display: flex; flex-direction: column; gap: 10px; overflow-y: auto; min-height: 0; max-height: 42vh; padding: 14px 16px; }
.media-videos { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.media-video { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #000; }
.media-video video { width: 100%; height: 140px; display: block; background: #000; object-fit: contain; }
.media-video small { display: block; padding: 6px 9px; background: #fff; font-size: 11px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-imgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 8px; }
.media-img { aspect-ratio: 1/1; border: 1px solid var(--line); border-radius: 9px; background-size: cover; background-position: center; cursor: zoom-in; }
.media-img:hover { outline: 2px solid var(--blue); outline-offset: -1px; }
.media-others { display: flex; flex-wrap: wrap; gap: 8px; }
.media-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 30px 16px; color: var(--muted); border: 1px dashed var(--line); border-radius: 10px; }
.media-empty svg { width: 26px; height: 26px; }
.lightbox img { max-width: 100%; max-height: 70vh; border-radius: 10px; display: block; margin: 0 auto; }
@media (max-width: 900px) { .task-board-cols { grid-template-columns: 1fr; } }

/* 积分中心：排行榜 + 规则 */
.page-actions { display: flex; margin-bottom: 14px; }
.lb-podium { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.lb-top { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 12px 10px; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; transition: 0.15s; }
.lb-top.first { border-color: #f0d58a; box-shadow: 0 6px 20px rgba(200, 150, 40, 0.12); }
.lb-top .avatar { width: 40px; height: 40px; font-size: 14px; }
/* 排行榜前三：数字阶梯章（金银铜三档，替代 emoji 奖牌） */
.lb-medal { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; border: 1px solid var(--line); color: var(--muted); }
.lb-medal.m1 { color: var(--amber); border-color: #e3ca94; background: #fff7e6; }
.lb-medal.m2 { color: #6b7078; border-color: #d5d5d2; background: #f4f4f2; }
.lb-medal.m3 { color: #b07a1f; border-color: #e7d9c4; background: #faf5ec; }
.lb-top strong { font-size: 13px; }
.lb-top b { font-size: 20px; color: var(--amber); font-variant-numeric: tabular-nums; }
.lb-top i { font-style: normal; font-size: 11px; color: var(--muted); }
.lb-list { padding: 0 18px 10px; }
.lb-row { display: flex; align-items: center; gap: 12px; padding: 6px 4px; border-bottom: 1px dashed var(--line); font-size: 13px; }
.lb-rank { width: 22px; height: 22px; border-radius: 6px; background: var(--canvas); display: grid; place-items: center; font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; }
.lb-pts { margin-left: auto; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--amber); }
.lb-pts i { font-style: normal; font-weight: 400; font-size: 10px; color: var(--muted); }
.rule-list { padding: 4px 20px 18px; }
.rule-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 2px; border-bottom: 1px dashed var(--line); }
.rule-row .mono { font-size: 10px; }
.trend-bars { height: 90px; gap: 2px; }
.trend-bars .mb-bar { background: var(--amber); min-height: 0; }
/* 30 天趋势柱极细，柱顶数字会互相重叠溢出；数值保留在悬浮提示里 */
.trend-bars .mb-bar::before { content: none; }
.score-picker { display: inline-flex; align-items: center; gap: 4px; background: #fff7e8; border: 1px solid #f0d58a; border-radius: 10px; padding: 6px 10px; }
.star { font-size: 18px; color: #d8b45a; transition: transform 0.12s; padding: 0 2px; line-height: 1; }
.star:hover { transform: scale(1.25); color: var(--amber); }
@media (max-width: 700px) { .lb-podium { grid-template-columns: 1fr; } }

/* 邮件通知页 */
.rule-editor { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; background: #fbfbf9; }
.rule-editor small { display: block; margin-top: 3px; }
.rule-editor .check-label { white-space: nowrap; }
.rule-editor .er-body { font-size: 12px; min-height: 44px; }
.rule-editor .form-grid { gap: 8px; margin-top: 8px; }
.rule-editor .form-grid > .field { gap: 4px; min-width: 0; }
.rule-editor input { min-height: 30px; padding: 6px 9px; }

/* 任务详情页 */
.cd-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; color: var(--blue-600); background: var(--blue-soft); padding: 3px 8px; border-radius: 20px; font-weight: 600; white-space: nowrap; }
.cd-badge svg { width: 11px; height: 11px; }
.cd-badge.hot { color: var(--red-400); background: #fdefeb; animation: cd-pulse 1.6s ease-in-out infinite; }
.cd-badge.urgent { color: var(--amber); background: #fff5e0; }
@keyframes cd-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.55; } }
.task-detail-head { padding: 16px 18px; }
.task-detail-head h1 { line-height: 1.35; }
.task-desc { margin-top: 12px; font-size: 13px; line-height: 1.9; color: #45484f; background: var(--canvas); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; white-space: pre-wrap; }
.task-detail-actions { display: flex; gap: 8px; margin-top: 16px; }
.task-detail-head + .detail-grid { margin-top: 18px; }
.panel-body { padding: 4px 18px 14px; }
.note-text { font-size: 13px; line-height: 1.9; color: #45484f; white-space: pre-wrap; }
.att-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.att-card { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; transition: 0.15s; display: flex; flex-direction: column; }
.att-card:hover { border-color: #c3cad8; box-shadow: 0 1px 3px rgba(20, 24, 35, .06); }
.att-thumb { aspect-ratio: 4/3; background-size: cover; background-position: center; background-color: var(--canvas); }
.att-card video { width: 100%; aspect-ratio: 16/9; background: #15171a; }
.att-card small { padding: 8px 10px; font-size: 10px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.att-card.att-file { align-items: center; gap: 4px; padding: 16px 10px; color: var(--blue); }
.att-card.att-file small { color: var(--ink); width: 100%; text-align: center; }
.att-card.att-file svg { width: 22px; height: 22px; }

/* ── 打卡 ── */
.checkin-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; padding: 12px; grid-auto-rows: min-content; align-content: start; }
.checkin-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); margin: 0; display: flex; flex-direction: column; overflow: hidden; min-height: 0; }
.checkin-photo { flex-shrink: 0; width: 100%; height: 96px; background: var(--blue-soft); display: flex; align-items: center; justify-content: center; background-size: cover; background-position: center; color: var(--blue); }
.checkin-photo svg { width: 28px; height: 28px; }
.checkin-card figcaption { flex-shrink: 0; padding: 8px 10px; display: flex; flex-direction: column; gap: 1px; }
.checkin-card figcaption strong { font-size: 12px; font-weight: 600; }
.checkin-card figcaption small { font-size: 10px; color: var(--muted); }
.gps-status { display: flex; align-items: center; gap: 8px; padding: 10px 14px; background: var(--canvas); border-radius: 10px; border: 1px solid var(--line); font-size: 12px; color: var(--muted); }
.gps-status.ok { color: var(--green); border-color: #c8ead8; background: #f4fbf7; }
.gps-status.err { color: var(--red); border-color: #f2d2d6; background: #fdf4f5; }
/* 实验室签到二维码：全屏投屏展示（管理角色打开后放在实验室屏幕上，到点自动换码） */
dialog.qr-board { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: #fff; }
dialog.qr-board::backdrop { background: rgba(20, 24, 35, 0.5); }
.qr-board-inner { height: 100%; display: flex; flex-direction: column; padding: 26px 34px 30px; }
.qr-board-head { flex-shrink: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.qr-board-head h2 { font-size: 22px; letter-spacing: -0.5px; }
.qr-board-head p { margin-top: 8px; max-width: 640px; font-size: 12px; line-height: 1.8; }
.qr-board-body { flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; }
.qr-holder { display: grid; place-items: center; padding: 16px; background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.qr-holder img { display: block; width: min(48vh, 400px); height: auto; }
.qr-code-text { text-align: center; }
.qr-code-text .mono { display: block; font-size: clamp(24px, 3.6vw, 40px); font-weight: 700; letter-spacing: 8px; color: var(--ink); }
.qr-code-text small { display: block; margin-top: 8px; font-size: 12px; color: var(--muted); }

/* 智能体记忆与待确认操作 */
.agent-memory { border-top: 1px solid var(--line); padding: 12px 14px; }
.agent-memory header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; font-size: 12px; }
.agent-memory-list { display: flex; flex-wrap: wrap; gap: 6px; }
.memory-chip { display: inline-flex; align-items: center; gap: 4px; background: var(--blue-soft); color: var(--blue); border-radius: 20px; padding: 3px 6px 3px 10px; font-size: 11px; max-width: 100%; }
.memory-chip .icon-btn { width: 16px; height: 16px; color: var(--muted); }
.agent-pending { display: flex; align-items: center; gap: 10px; padding: 10px 18px; background: #fff7e8; border-bottom: 1px solid #f0d58a; font-size: 12px; }
.agent-pending > svg { color: var(--amber); flex-shrink: 0; }
.agent-pending div:nth-child(2) { flex: 1; min-width: 0; }
.agent-pending strong { display: block; font-size: 12px; }
.agent-pending small { color: var(--muted); }

/* ── 智能体 ── */
.agent-shell { display: grid; grid-template-columns: 240px 1fr; height: auto; min-height: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.page-fit > .agent-shell { flex: 1; min-height: 0; }
.agent-sidebar { border-right: 1px solid var(--line); display: flex; flex-direction: column; background: #fafaf8; }
.agent-sidebar-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--line); font-size: 13px; }
.agent-sidebar-head div { display: flex; align-items: center; gap: 8px; font-weight: 650; }
.agent-conv-list { flex: 1; overflow-y: auto; padding: 8px; display: flex; flex-direction: column; gap: 4px; }
.agent-conv-item { display: block; width: 100%; text-align: left; padding: 10px 12px; border-radius: 10px; transition: background 0.12s; }
.agent-conv-item:hover { background: #eef0f3; }
.agent-conv-item.active { background: var(--blue-soft); }
.agent-conv-item strong { display: block; font-size: 13px; font-weight: 600; line-height: 1.3; margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agent-conv-item small { display: block; font-size: 11px; color: var(--muted); }
.agent-main { display: flex; flex-direction: column; min-width: 0; }
.agent-chat-head { padding: 14px 20px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.agent-chat-head strong { font-size: 14px; font-weight: 600; }
.agent-messages { flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 16px; }
.agent-bubble { max-width: 80%; padding: 12px 16px; border-radius: 14px; line-height: 1.7; font-size: 13px; }
.agent-bubble.user { align-self: flex-end; background: var(--blue); color: #fff; border-bottom-right-radius: 4px; }
.agent-bubble.user .agent-bubble-head { justify-content: flex-end; }
.agent-bubble.assistant { align-self: flex-start; background: #f2f4f7; color: var(--ink); border-bottom-left-radius: 4px; border: 1px solid #dfe3e9; }
.agent-bubble-head { display: flex; align-items: center; gap: 6px; font-size: 11px; margin-bottom: 6px; opacity: 0.75; }
.agent-bubble-head svg { width: 14px; height: 14px; }
.agent-bubble-body { word-break: break-word; }
.agent-pre { background: #1d2026; color: #e2e8f0; padding: 12px 14px; border-radius: 8px; font-size: 12px; line-height: 1.5; overflow-x: auto; margin: 8px 0; }
.agent-inline { background: rgba(0, 0, 0, 0.08); padding: 1px 5px; border-radius: 4px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.agent-input { display: flex; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--line); }
.agent-input textarea { flex: 1; resize: none; border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; font-size: 13px; min-height: 42px; max-height: 160px; background: #fafaf8; }
.agent-welcome { text-align: center; padding: 40px 20px; color: var(--muted); }
.agent-welcome svg { width: 40px; height: 40px; color: var(--blue); margin-bottom: 12px; }
.agent-welcome h3 { font-size: 16px; color: var(--ink); margin-bottom: 8px; font-weight: 600; }
.agent-welcome p { font-size: 13px; margin-bottom: 8px; }
.agent-welcome ul { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 12px; }
@media (max-width: 768px) {
  .agent-shell { grid-template-columns: 1fr; height: auto; }
  .agent-sidebar { border-right: 0; border-bottom: 1px solid var(--line); max-height: 180px; }
  .agent-conv-list { flex-direction: row; overflow-x: auto; overflow-y: hidden; }
  .agent-conv-item { flex-shrink: 0; min-width: 180px; }
}

/* 界面动效（克制：位移≤24px，时长≤0.6s，单次不循环） */
.anim-target { opacity: 0; transform: translateY(24px); }
.anim-target.in { opacity: 1; transform: none; transition: opacity 0.5s ease, transform 0.5s ease; }
@media (prefers-reduced-motion: reduce) {
  .anim-target { opacity: 1; transform: none; transition: none; }
}

/* 动态导航配置（权限矩阵页内） */
.nav-admin { padding: 4px 20px 10px; display: flex; flex-direction: column; gap: 6px; }
.nav-admin-head { display: grid; grid-template-columns: 110px 1.2fr 1.2fr 70px 70px 110px; gap: 10px; padding: 8px 20px; font-size: 11px; color: var(--muted); }
.nav-row { display: grid; grid-template-columns: 110px 1.2fr 1.2fr 70px 70px 110px; gap: 10px; align-items: center; padding: 6px 0; border-bottom: 1px dashed var(--line); }
.nav-row input { width: 100%; padding: 6px 8px; font-size: 12px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.nav-id { font-size: 11px; color: var(--muted); }
.nav-param { font-size: 10px; color: var(--muted); }
@media (max-width: 900px) {
  .nav-admin-head, .nav-row { grid-template-columns: 90px 1fr 1fr; }
  .nav-row .check-label, .nav-row .row { grid-column: span 1; }
}

/* 实时动态时间线 */
.news-timeline { display: flex; flex-direction: column; gap: 12px; }
.news-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 14px; }
.news-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.news-card h3 { font-size: 15px; font-weight: 650; line-height: 1.5; }
.news-card h3 a { color: var(--blue); text-decoration: none; }
.news-card h3 a:hover { text-decoration: underline; }
.news-summary { margin-top: 8px; line-height: 1.8; }
.news-card time { display: block; margin-top: 10px; }

/* 权限矩阵：单一表格 + 分组折叠，行列严格对齐（旧版矩阵块的存活规则已并入下方，死规则已删） */
.perm-matrix { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 0; }
.perm-matrix th, .perm-matrix td { border-left: 1px solid var(--line, #ededeb); border-bottom: 1px solid var(--line, #ededeb); padding: 5px 8px; vertical-align: middle; }
.perm-matrix th:first-child, .perm-matrix td:first-child { border-left: 0; width: 210px; }
.perm-matrix thead th { background: #f4f4f2; text-align: center; white-space: nowrap; padding: 6px 8px; font-size: 13px; position: sticky; top: 0; z-index: 1; }
.perm-col-name { text-align: left; font-size: 12.5px; font-weight: 600; color: #33363c; }
.perm-col-role { font-size: 12.5px; font-weight: 600; color: #33363c; }
.perm-col-role-name { display: block; }
.perm-col-actions { display: inline-flex; align-items: center; justify-content: center; gap: 2px; margin-top: 3px; }
.perm-col-actions .btn { font-size: 11px; padding: 0 8px; line-height: 18px; }
.perm-col-icon { width: 18px; height: 18px; display: grid; place-items: center; }
.perm-super-tag { font-style: normal; font-size: 10px; padding: 1px 6px; border-radius: 999px; background: #edeff2; color: var(--blue-600); font-weight: 500; }
.perm-matrix input[type=checkbox] { accent-color: var(--blue-600); width: 14px; height: 14px; cursor: pointer; }
.perm-point { white-space: nowrap; line-height: 1.2; }
.perm-point > span { font-size: 12.5px; color: #33363c; }
.perm-point .mono { display: block; font-size: 10.5px; color: #8a8b90; font-weight: 400; }
.perm-cell { text-align: center; }
.perm-super { color: #8a8b90; }
.perm-note { margin: 10px 0 14px; line-height: 1.7; }

.perm-g-head-cell { background: #fafaf8; border-left: 0 !important; }
.perm-g-head { display: flex; align-items: center; gap: 8px; width: 100%; padding: 7px 8px 7px 12px; cursor: pointer; box-sizing: border-box; }
.perm-g-head:hover { background: rgba(84, 124, 226, .05); }
.perm-g-icon { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: #e7ebf1; color: #3e5a8c; flex-shrink: 0; }
.perm-g-icon svg { width: 14px; height: 14px; }
.perm-g-name { font-weight: 600; font-size: 13px; color: #2b2e34; }
.perm-g-meta { margin-left: auto; font-size: 11.5px; color: #82838a; white-space: nowrap; }
.perm-g-chev { display: grid; place-items: center; width: 18px; height: 18px; color: var(--muted); flex-shrink: 0; transition: transform .18s ease; }
.perm-g-chev svg { width: 14px; height: 14px; }
.perm-g-check { margin: 4px 8px 4px 0; font-size: 11.5px; padding: 2px 10px; border-radius: 999px; border: 1px solid #e0e0de; background: #fff; color: var(--blue-600); cursor: pointer; line-height: 16px; white-space: nowrap; }
.perm-g-check:hover { border-color: var(--blue-600); background: rgba(84, 124, 226, .06); }
.perm-g-body:not(.collapsed) .perm-g-chev { transform: rotate(-90deg); }
.perm-g-body.collapsed .perm-g-detail { display: none; }
.perm-matrix .perm-g-detail:hover td { background: #f4f4f2; }

/* ── P0 系统模块：公告 / 小组 / 登录日志 / 密码 ── */
.ann-list { display: grid; gap: 10px; align-content: start; }
/* 数据导出按钮组：与面板标题同缩进（原为无样式，按钮贴着面板左边框且互相紧贴） */
.export-grid { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 18px 18px; }
.ann-card { padding: 14px 18px; }
.ann-card.unread { border-left: 3px solid var(--blue); }
.ann-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.ann-head h3 { font-size: 15px; }
.ann-pin { font-size: 10px; color: var(--blue); background: var(--blue-soft); padding: 2px 7px; border-radius: 5px; white-space: nowrap; }
.ann-body { font-size: 13px; line-height: 1.9; color: #45484f; white-space: pre-wrap; }
.ann-foot { margin-top: 14px; display: flex; gap: 8px; }
.group-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 12px; }
.group-card { padding: 14px 16px; }
.group-avatar { width: 38px; height: 38px; border-radius: 10px; background: #e7ebf1; color: #3e5a8c; display: grid; place-items: center; }
.group-card h3 { font-size: 15px; }
.group-members { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0; }
.member-chip { font-size: 11px; background: #edeff3; color: #4a4e55; padding: 4px 10px; border-radius: 999px; }
.group-actions { display: flex; gap: 8px; }
.temp-password { font-size: 24px; font-weight: 700; letter-spacing: 1px; color: var(--blue); text-align: center; padding: 18px; background: #f4f5f8; border-radius: 10px; margin: 14px 0; }

/* ── 主页管理 ── */
.hp-list { padding: 10px 18px 14px; display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 0; overflow-y: auto; }
.hp-row { display: grid; grid-template-columns: 140px 96px 1fr; gap: 10px; align-items: center; }
.hp-row .hp-key { font-size: 11px; color: var(--muted); }
.hp-row .hp-label { font-size: 11px; color: #a0a0a0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hp-row .hp-val { width: 100%; padding: 6px 10px; font-size: 12px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.hp-row .hp-val:focus { outline: none; border-color: var(--blue); }
.hp-gallery { padding: 14px 18px 16px; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; align-content: start; flex: 1; min-height: 0; overflow-y: auto; }
.hp-img-card { border: 1px solid var(--line); border-radius: var(--radius); padding: 10px; display: flex; flex-direction: column; gap: 8px; background: #fff; position: relative; }
/* 预览盒 = 官网容器：比例/裁切/焦点/缩放全部按该位的 spec 走，线上长什么样这里就长什么样 */
.hp-thumb-wrap { position: relative; display: block; overflow: hidden; aspect-ratio: var(--hp-ar, 4 / 3); border-radius: 6px; background: #f3f3f1; border: 1px solid var(--line); }
.hp-thumb { width: 100%; height: 100%; object-fit: var(--hp-fit, cover); object-position: var(--hp-focus-x, 50%) var(--hp-focus-y, 50%); display: block; transform: scale(var(--hp-zoom, 1)); transform-origin: center; }
.hp-thumb-empty { display: grid; place-items: center; width: 100%; height: 100%; padding: 8px; font-size: 10.5px; line-height: 1.5; color: #a0a0a0; text-align: center; }
.hp-video-badge { position: absolute; top: 8px; left: 8px; z-index: 2; font-size: 10px; color: #fff; background: rgba(20, 24, 35, .72); border-radius: 5px; padding: 2px 7px; }
.hp-spec { display: flex; justify-content: space-between; gap: 8px; font-size: 10.5px; color: var(--muted); }
.hp-spec .hp-see.warn { color: #b2761a; }
.hp-frame { display: flex; flex-direction: column; gap: 6px; border-top: 1px dashed var(--line); padding-top: 7px; }
.hp-frame-row { display: flex; align-items: center; gap: 8px; }
.hp-frame-label { flex-shrink: 0; }
.hp-fit-switch { display: inline-flex; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.hp-fit-switch button { border: 0; background: #fff; font-size: 11px; padding: 3px 10px; cursor: pointer; color: #6b6f78; font-family: inherit; }
.hp-fit-switch button.active { background: #eef2fa; color: var(--blue); font-weight: 600; }
.hp-focus-grid { display: grid; grid-template-columns: repeat(3, 18px); gap: 3px; }
.hp-focus-grid button { position: relative; width: 18px; height: 18px; padding: 0; border: 1px solid var(--line); border-radius: 4px; background: #fff; cursor: pointer; }
.hp-focus-grid button.active { border-color: var(--blue); background: var(--blue); }
.hp-focus-grid button.active::after { content: ''; position: absolute; inset: 5px; border-radius: 50%; background: #fff; }
.hp-frame-row input[type="range"] { flex: 1; min-width: 0; accent-color: var(--blue); height: 16px; }
.hp-zoom-val { font-size: 10px; color: var(--muted); width: 34px; text-align: right; }
.hp-img-meta { display: flex; flex-direction: column; gap: 2px; }
.hp-img-meta .mono { font-size: 11px; color: #43474f; }
.hp-alt { width: 100%; padding: 5px 8px; font-size: 11px; border: 1px solid var(--line); border-radius: 6px; background: #fff; box-sizing: border-box; }
.hp-img-btns { margin-top: auto; }

/* 图片 tab：左侧配图列表 + 右侧常驻官网实时预览 */
.hp-split { display: flex; flex: 1; min-height: 0; gap: 12px; }
.hp-split .hp-gallery { flex: 1; min-width: 0; padding-right: 6px; }
.hp-preview-pane { width: 400px; flex-shrink: 0; display: flex; flex-direction: column; gap: 8px; padding: 14px 18px 16px 0; min-height: 0; }
.hp-preview-off { width: auto; padding-right: 0; align-items: flex-start; }
.hp-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.hp-preview-frame { flex: 1; min-height: 0; width: 100%; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.hp-preview-tip { margin: 0; line-height: 1.6; }

/* 作品集 tab：可增删/排序的列表 */
.hp-works-head { padding: 0 18px 10px; }
.hp-works { padding: 0 18px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 0; overflow-y: auto; }
.hp-work { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto auto; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; background: #fff; }
.hp-work-thumb { width: 96px; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 6px; background: #f3f3f1; border: 1px solid var(--line); display: grid; place-items: center; font-size: 10px; line-height: 1.4; color: #a0a0a0; text-align: center; }
.hp-work-fields { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.hp-work-fields .hp-val { width: 100%; }
.hp-work-show { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.hp-work-ops { display: flex; gap: 4px; }

/* 团队成员：老师 / 学生两小节，行内可改姓名角色、换头像、选配色 */
.hp-members { padding: 0 18px 16px; display: flex; flex-direction: column; gap: 18px; flex: 1; min-height: 0; overflow-y: auto; }
.hp-mem-sec-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.hp-mem-sec-head h3 { font-size: 14px; font-weight: 600; }
.hp-member { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto auto; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; background: #fff; }
.hp-mem-avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; background: #f3f3f1; border: 1px solid var(--line); flex-shrink: 0; }
.hp-mem-letter { display: grid; place-items: center; font-size: 20px; font-weight: 700; color: #fff; border: 0; }
.hp-mem-fields { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.hp-mem-line { display: flex; gap: 6px; }
.hp-mem-line .hp-val { flex: 1; min-width: 0; }
/* 个人介绍：多行文本用 textarea，可纵向拉伸 */
.hp-bio { width: 100%; min-height: 46px; padding: 6px 10px; font-size: 12px; font-family: inherit; line-height: 1.6; color: inherit; border: 1px solid var(--line); border-radius: 6px; background: #fff; resize: vertical; }
.hp-bio:focus { outline: none; border-color: var(--blue); }
.hp-mem-colors { display: flex; gap: 5px; }
.hp-color-dot { width: 20px; height: 20px; border-radius: 50%; border: 2px solid transparent; padding: 0; cursor: pointer; box-shadow: 0 0 0 1px var(--line); }
.hp-color-dot.active { border-color: #fff; box-shadow: 0 0 0 2px var(--accent, #4D7DFF); }

/* 报名材料 tab：沿用作品集行骨架，缩略图位改放文件类型徽标 */
.hp-doc-type { width: 96px; aspect-ratio: 4 / 3; display: grid; place-items: center; border-radius: 6px; background: #f3f3f1; border: 1px solid var(--line); font-size: 15px; font-weight: 700; letter-spacing: .06em; color: #6b7280; }

/* 上传即裁剪：取景框比例 = 该位目标比例，导出即目标比例 */
.hp-crop { display: flex; flex-direction: column; gap: 10px; }
.hp-crop-stage { position: relative; width: 100%; max-width: 440px; margin: 0 auto; overflow: hidden; background: #111; border-radius: 10px; cursor: grab; touch-action: none; user-select: none; }
.hp-crop-stage.dragging { cursor: grabbing; }
.hp-crop-stage img { position: absolute; left: 0; top: 0; max-width: none; max-height: none; display: block; }
.hp-crop-grid { position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(to right, rgba(255,255,255,.32) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,255,255,.32) 1px, transparent 1px); background-size: 33.333% 33.333%; }
.hp-crop-ctl { display: flex; align-items: center; gap: 8px; }
.hp-crop-ctl input[type="range"] { flex: 1; min-width: 0; accent-color: var(--blue); }
.hp-crop-tip { margin: 0; }


/* ── 技能关卡 ── */
.skill-map { background:#fff; border:1px solid var(--line); border-radius:11px; padding:14px 16px; }
.sm-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.sm-row { display:flex; align-items:center; gap:14px; margin-bottom:10px; }
.sm-chain { width:76px; flex-shrink:0; font-size:12.5px; font-weight:600; color:#33363c; }
.sm-chain small { display:block; font-size:10.5px; color:#8a8b90; font-weight:400; }
.sm-track { flex:1; position:relative; display:flex; align-items:center; gap:8px; }
.sm-bar { position:absolute; left:0; top:50%; height:4px; transform:translateY(-50%); background:var(--blue-600); border-radius:2px; opacity:.35; z-index:0; }
.sm-node { width:30px; height:30px; border-radius:50%; border:1.5px solid #c9cdd6; background:#fff; display:grid; place-items:center; position:relative; z-index:1; color:#8a8b90; cursor:pointer; }
.sm-node svg { width:14px; height:14px; }
.sm-node.ok { border-color:var(--green); background:var(--green-bg); color:var(--green); }
.sm-node.wait { border-color:var(--orange); background:#fff6e6; color:var(--orange); }
.sm-node.lock { opacity:.45; cursor:default; }
.level-grid { flex:1; min-height:0; overflow-y:auto; display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:12px; align-content:start; padding:2px 0 14px; }
.level-card { text-align:left; background:#fff; border:1px solid var(--line); border-radius:11px; padding:13px 15px; cursor:pointer; transition:box-shadow .15s ease,border-color .15s ease; }
.level-card:hover { border-color:var(--blue-600); box-shadow:0 4px 14px rgba(31,63,160,.07); }
.level-card.lock { opacity:.55; }
.level-card h4 { font-size:15px; margin:8px 0 4px; color:var(--ink); }
.level-card p { margin:0 0 10px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.lc-top { display:flex; justify-content:space-between; align-items:center; }
.lc-top .mono { font-size:10.5px; color:#8a8b90; }
.lc-meta { display:flex; align-items:center; gap:8px; }
.lv-detail { display:flex; flex-direction:column; gap:8px; max-height:64vh; overflow-y:auto; }
.lv-sec { margin-top:6px; padding-top:8px; border-top:1px solid var(--line); }
.lv-sec .sub-head { display:flex; justify-content:space-between; align-items:center; }
/* 关卡详情「题目要求」：库里存的是带换行的纯文本，pre-line 保留分段 */
.lv-brief { white-space:pre-line; margin-top:8px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:#f8f9fb; font-size:13px; line-height:1.75; color:#4a4d55; }
.wall-box { border:1px solid var(--line); border-radius:8px; padding:9px 11px; margin-top:8px; }
.wall-box.pending { border-color:#e5c68a; background:#fffdf6; }
.wall-box.rejected { border-color:#ecc; background:#fff7f7; }
.wall-media { display:flex; gap:8px; margin-top:7px; flex-wrap:wrap; }
/* 关卡附件：非图片非视频（Keil 工程 zip / pdf）此前完全不渲染，这里给可点的下载条目 */
.lv-file-chip { display:inline-flex; align-items:center; gap:6px; max-width:220px; padding:6px 10px; margin-top:7px; border:1px solid var(--line); border-radius:8px; background:#fff; color:#3d4046; font-size:12px; text-decoration:none; }
.lv-file-chip svg { width:14px; height:14px; flex:none; color:#6b6d73; }
.lv-file-chip span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lv-file-chip:hover { border-color:#b9c2d4; }
/* 关卡作品里的视频：给足可操作尺寸。原来只设 height:64px，手机竖屏视频
   （720×1280）会被压成 36px 宽，播放/进度条根本点不到；contain 保证竖屏不变形。 */
.wall-media video.lv-video { width: 240px; height: 160px; flex: none; border-radius: 8px; background: #000; object-fit: contain; }
@media (max-width: 560px) { .wall-media video.lv-video { width: 100%; height: auto; max-height: 220px; } }
.go { font-weight:600; }
.go-badge { background:var(--green-bg); color:var(--green); }
.lv-task-thumbs { display:flex; gap:6px; margin-top:6px; }
.task-media-gallery .media-scroll { display:flex; gap:10px; flex-wrap:wrap; padding:0 18px 16px; }

/* ── 技能关卡：流程画布（可拖拽/连线的节点图） ── */
.chain-meta { display:flex; justify-content:space-between; align-items:baseline; max-width:1080px; margin:2px auto 0; padding:0 6px; }
.chain-meta .large { font-size:15px; font-weight:700; color:var(--ink); }
.level-map-wrap { flex:1; min-height:0; overflow:hidden; display:flex; flex-direction:column; padding:8px 0 0; }
.lv-flow { flex:1; min-height:0; display:flex; flex-direction:column; }
.lv-flow-tools { display:flex; gap:8px; justify-content:flex-end; padding:0 4px 8px; }
.lv-flow-hint { font-size:11.5px; color:#6b6d73; background:#f6f6f4; border:1px dashed #d8d8d4; border-radius:8px; padding:5px 10px; margin-bottom:8px; }
.lv-flow-canvas { position:relative; flex:1; min-height:0; overflow:auto; background:#fbfbfa; background-image:radial-gradient(circle,#ececea 1px,transparent 1px); background-size:22px 22px; border:1px solid var(--line); border-radius:12px; box-shadow:inset 0 1px 6px rgba(20,24,35,.03); touch-action:none; }
/* 连线层：必须覆盖全局 svg{width:20px} 图标规则，否则整层被压成 20×20 看不见 */
.lv-flow-edges { position:absolute; left:0; top:0; pointer-events:none; z-index:1; width:auto; height:auto; }
.lv-flow-nodes { position:relative; z-index:2; width:100%; height:100%; }
.lv-flow-node { position:absolute; width:150px; height:76px; background:#fff; border:1.5px solid #c9ced9; border-radius:12px; box-shadow:0 2px 8px rgba(31,63,160,.07); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; cursor:pointer; transition:box-shadow .12s ease; text-align:center; padding:0 8px; }
.lv-flow-node:hover { box-shadow:0 6px 16px rgba(31,63,160,.13); }
.lv-flow-node.done { border-color:var(--green); background:#eefaf4; }
.lv-flow-node.pending { border-color:var(--orange); background:#fffaf0; }
.lv-flow-node.lock { background:#f3f4f6; opacity:.82; cursor:default; }
.lv-flow-node .n-cap { font-size:12.5px; font-weight:700; color:#2b2e34; line-height:1.25; max-width:132px; }
.lv-flow-node .n-sub { font-size:10.5px; letter-spacing:1px; color:#8a8b90; }
.lv-flow-node.done .n-sub { color:var(--green); }
.lv-flow-node.pending .n-sub { color:var(--orange); }
.lv-flow-node .chp { position:absolute; left:8px; top:8px; width:9px; height:9px; border-radius:50%; border:1.5px solid #fff; box-shadow:0 1px 2px rgba(0,0,0,.15); }

/* 四边圆点：＋ 新增 / − 断开；可拖动连线 */
.lv-port { position:absolute; width:17px; height:17px; border-radius:50%; background:#fff; border:1.5px solid var(--blue-600); color:var(--blue-600); display:grid; place-items:center; font-size:13px; font-weight:700; line-height:1; z-index:3; cursor:grab; box-shadow:0 1px 3px rgba(31,63,160,.2); user-select:none; }
.lv-port:hover { transform:scale(1.18); }
.lv-port:active { cursor:grabbing; }
.lv-port.add { border-color:var(--blue-600); background:#f0f4fb; }
.lv-port.minus { border-color:var(--orange); background:#fff6e6; color:var(--orange); }
.lv-flow-node .lv-port.lv-portL { left:-9px; top:50%; margin-top:-8px; }
.lv-flow-node .lv-port.lv-portR { right:-9px; top:50%; margin-top:-8px; }
.lv-flow-node .lv-port.lv-portT { top:-9px; left:50%; margin-left:-8px; }
.lv-flow-node .lv-port.lv-portB { bottom:-9px; left:50%; margin-left:-8px; }
.lv-flow-node.edit { cursor:grab; }
.lv-flow-node.edit:active { cursor:grabbing; }
.lv-nextdot { position:absolute; right:8px; top:8px; width:8px; height:8px; border-radius:50%; background:var(--blue-600); box-shadow:0 0 0 2px rgba(59,92,147,.18); }
.lv-flow-node.done .lv-nextdot { background:var(--green); }
.chp-基础 { background:var(--green); }
.chp-进阶 { background:var(--blue-600); }
.chp-大师 { background:var(--orange); }
@media (prefers-reduced-motion: reduce) { .lv-flow-node, .lv-port { transition:none; } }

/* ── 成长档案（水平/标章/技能线/通过记录）── */
.rank-chip { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:600; color:var(--blue); background:#eef1f7; border:1px solid #d8deeb; border-radius:999px; padding:2px 10px; vertical-align:middle; }
.ach-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; min-height:0; overflow-y:auto; padding:2px 2px 8px; }
.ach-panel { background:#fff; border:1px solid var(--line); border-radius:11px; }
.ach-panel .panel-head { padding:8px 12px 0; flex-shrink:0; }
.ach-panel .panel-head h2 { font-size:14px; }
.ach-panel .chart-body { flex:1; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
.ach-body { padding:6px 12px 8px; }
.rank-chip.in-head { margin-left:10px; }
/* 档位表达：一/二/三档（替代星级符号，克制的描边样） */
.score-chip.grade-0 { color:#9a9ba0; font-weight:400; }
.score-chip.grade-1 { color:var(--muted); }
.score-chip.grade-2 { color:var(--blue-600); border-color:#b7c4dd; }
.score-chip.grade-3 { color:#b07a1f; border-color:#e3ca94; }
.exp-line { display:flex; align-items:center; gap:8px; }
.exp-pct { font-size:12px; font-weight:700; color:var(--blue); }
.exp-track { flex:1; height:7px; border-radius:4px; background:#eef0f4; overflow:hidden; }
.exp-track span { display:block; height:100%; border-radius:4px; background:linear-gradient(90deg,var(--blue-600),#5f7fb8); }
.exp-line small { white-space:nowrap; }
.job-sum { display:flex; gap:10px; margin-top:10px; }
.job-sum span { flex:1; text-align:center; border:1px solid var(--line); border-radius:9px; padding:8px 4px; background:#fafaf8; }
.job-sum b { display:block; font-size:18px; color:var(--ink); }
.job-sum small { font-size:10.5px; color:var(--muted); }
.bdg-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(86px,1fr)); gap:6px; }
.bdg-tile { display:flex; flex-direction:column; align-items:center; gap:4px; border:1px solid var(--line); border-radius:9px; padding:7px 4px 5px; background:#fafaf8; cursor:default; }
.bdg-tile svg { width:20px; height:20px; color:#b9bec7; }
.bdg-tile i { font-style:normal; font-size:10.5px; color:var(--muted); text-align:center; line-height:1.2; }
.bdg-tile.earned { border-color:#cfe3d8; background:#f0faf4; }
.bdg-tile.earned svg { color:var(--green); }
.bdg-tile.earned i { color:#1b6f52; font-weight:600; }
.bdg-tile.tier3.earned { border-color:#e8d3a8; background:#fff7e6; }
.bdg-tile.tier3.earned svg { color:var(--amber); }
.bdg-tile.tier3.earned i { color:#8a5f14; }
.skill-row { display:flex; align-items:center; gap:8px; padding:3px 0; }
.skill-row + .skill-row { border-top:1px dashed var(--line); }
.skill-name { width:62px; flex-shrink:0; font-size:12px; font-weight:600; color:#33363c; }
.skill-track { flex:1; height:6px; border-radius:3px; background:#eef0f4; overflow:hidden; }
.skill-track span { display:block; height:100%; border-radius:3px; background:var(--green); }
.skill-row small { white-space:nowrap; }
.rec-list { display:flex; flex-direction:column; gap:2px; }
.rec-item { display:flex; align-items:center; gap:8px; padding:4px 0; }
.rec-item + .rec-item { border-top:1px dashed var(--line); }
.rec-item .score-chip { min-width:38px; text-align:left; }
.rec-item div { flex:1; min-width:0; }
.rec-item small.muted { flex-shrink:0; }
.rec-item small.muted:last-child { font-size:10.5px; color:#9a9ba0; }

/* ============================ 可视化座位（SEATS） ============================ */
/* 两列硬隔离：左列只放地图、右列是控制栏（图例 / 聊天 / 地图编辑工具）。
   两种模式只换右列内容，地图列永远不动；侧栏刻意收窄，空间优先给地图。 */
/* ⚠ 选择器必须写成 `.page-fit > .panel.seat-panel`（3 个类）：
   项目里已有 `.page-fit > .panel{display:flex;flex-direction:column}`（2 个类），
   只写 `.seat-panel` 会因优先级不足被它覆盖成纵向两行 ——
   那样地图在上、侧栏在下，地图高度被压到几百像素、缩放掉到 0.44，看起来就是「地图特别小」。 */
.page-fit > .panel.seat-panel {
  --seat-side-w: 320px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--seat-side-w);
  gap: 12px;
  padding: 0;
  overflow: hidden;
}
/* 地图卡片里只有地图（图例与工具都在右列），因此地图能用满整张卡片的高度 */
.seat-stage {
  min-width: 0; min-height: 0; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  padding: 10px 12px;
  /* 底色比图面深一档，让白色图面「浮」起来，不再是同色调糊成一片 */
  background: #e9e8e2; border: 1px solid #dedcd4; border-radius: var(--radius);
  box-shadow: inset 0 1px 3px rgba(20,24,35,.05);
}
.seat-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: 11px; color: var(--muted); }
.seat-pill { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: 10.5px; color: var(--text); }
.seat-pill b { color: var(--ink); }
.seat-hint-inline { flex-basis: 100%; font-size: 10.5px; color: var(--muted); margin-top: 2px; }
.seat-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); flex-shrink: 0; }
.seat-dot.on { background: var(--green); }
/* 尺寸框 = 缩放后的地图；配合左上角缩放原点，视觉盒与之完全重合，绝不外溢 */
.seat-fit { position: relative; flex-shrink: 0; max-width: 100%; max-height: 100%; overflow: hidden; }

.seat-room {
  position: relative; display: grid; background: #f7f6f3;
  border: 1px solid var(--line); border-radius: var(--radius);
  /* 盒子必须等于网格的自然尺寸：它是块级元素，默认会被父容器拉伸到尺寸框的宽度，
     那样网格轨道（894）会溢出卡片盒子（769）→ 卡片底色只盖住一部分，
     最后两列格子飘在卡片外面。max-content 让盒子始终等于内容尺寸。 */
  width: max-content; height: max-content;
  transform-origin: top left;
  box-shadow: 0 1px 3px rgba(20,24,35,.06);
}
.seat-cell { position: relative; border-radius: 7px; padding: 0; border: 0; background: transparent; }
.seat-cell.k-w { background: #fcfbf8; border: 1px solid #e8e6e0; cursor: pointer; transition: box-shadow .15s, background .15s; }
.seat-cell.k-w:hover { box-shadow: 0 0 0 2px var(--blue); z-index: 6; }
.seat-cell.k-f { background: #f7f6f3; border: 1px solid #efeeea; cursor: pointer; }
.seat-cell.k-f:hover { box-shadow: 0 0 0 2px var(--blue) inset; background: #f2f4f7; }
.seat-cell.k-x { background: #5d6269; border-radius: 4px; }
.seat-cell.k-s { background: #faf2e2; border: 1px solid #ecdcb9; }
.seat-cell.k-s::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 30px; height: 2px; border-radius: 1px; background: #e0cfa8; box-shadow: 0 -5px 0 #e0cfa8, 0 5px 0 #e0cfa8; }
.seat-cell.k-t { background: #e8e8e3; border: 1px solid #deded8; }
.seat-cell.k-t span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 10px; letter-spacing: 3px; color: #a4a49f; }
.seat-cell.k-d { background: #fff; border: 1px solid var(--line); }
.seat-cell.k-d span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 10px; letter-spacing: 1px; color: #b4b4af; }
.seat-cell.occ { background: #fff; }
.seat-ring { position: absolute; inset: 2px; border-radius: 6px; border: 1.5px solid var(--seat-st); opacity: .6; pointer-events: none; }
.seat-desk-ph { position: absolute; left: 19px; top: 20px; width: 26px; height: 22px; border: 1px dashed #e4e3dd; border-radius: 8px; pointer-events: none; }
.seat-scene { position: absolute; left: 0; right: 0; bottom: 1px; display: flex; justify-content: center; pointer-events: none; }
.seat-scene svg { width: 58px; height: 44px; display: block; }
.seat-name { position: absolute; left: 50%; top: 1px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 3px; max-width: 56px; padding: 0 5px; height: 15px; border-radius: 999px; background: #fff; border: 1px solid var(--line); font-size: 10px; color: var(--ink); white-space: nowrap; pointer-events: none; }
.seat-name b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
.seat-name i { width: 5px; height: 5px; border-radius: 50%; flex-shrink: 0; }
.seat-name.mine { background: var(--blue); border-color: var(--blue); color: #fff; }
.seat-name.mine i { background: #fff !important; opacity: .85; }
.seat-bubble { position: absolute; left: 50%; bottom: calc(100% + 6px); transform: translateX(-50%); z-index: 9; max-width: 168px; padding: 3px 9px; border: 1px solid var(--blue); border-radius: 9px; background: #fff; font-size: 10px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: 0 4px 14px rgba(20,24,35,.13); cursor: pointer; }
.seat-bubble::after { content: ""; position: absolute; left: 50%; bottom: -5px; margin-left: -4.5px; width: 9px; height: 9px; background: #fff; border-right: 1px solid var(--blue); border-bottom: 1px solid var(--blue); transform: rotate(45deg); }
.seat-room.hl .seat-cell.free { background: #eef2f8; box-shadow: 0 0 0 1.5px var(--blue) inset; }
.seat-walk { position: absolute; inset: 0; z-index: 12; pointer-events: none; }
/* 格子层与小人分成两层：.seat-grid 用 display:contents 继续参与外层网格布局，
   小人单独一层才能对 transform 做过渡 —— 别人挪位是「滑过去」，而不是整层重画后闪现。 */
.seat-grid { display: contents; }
/* z-index 7：要高过格子 hover 的 6，否则鼠标划过时格子的白底会把小人盖住 */
.seat-people { position: absolute; inset: 0; z-index: 7; pointer-events: none; }
.seat-person { position: absolute; left: 0; top: 0; width: 64px; height: 64px; pointer-events: auto; cursor: pointer; transition: transform .32s cubic-bezier(.4, 0, .2, 1); }
.seat-person.hop { transition: none; }
.seat-person.hidden { opacity: 0; }
.seat-person:hover .seat-name { border-color: var(--blue); }

/* ───────── 座位状态动画 ─────────
   每一档动作都对应该状态的含义：调试=猛敲键盘、开会=站着比划、休息=闭眼靠椅背。
   全部只动 transform / opacity（走合成层，不触发布局），且起点用 --fig-delay 按成员错相 ——
   否则整屋人会整齐划一地敲键盘，既假又吵。 */
.seat-fig [class^="p-"], .seat-fig [class*=" p-"] { transform-box: fill-box; }
.seat-fig .p-head { transform-origin: center 72%; }
.seat-fig .p-torso { transform-origin: center bottom; }
.seat-fig .p-arm-l, .seat-fig .p-arm-r { transform-origin: 50% 8%; }
.seat-fig .p-hand-l, .seat-fig .p-hand-r { transform-origin: center; }
.seat-fig .p-screen-alert { opacity: 0; }
.seat-fig .p-eye-shut { opacity: 0; }
/* 注意：错相必须写在每条 animation 简写里 —— 简写会把 animation-delay 重置为 0，
   单独写一条 animation-delay 规则会被它覆盖（踩过一次：整屋人同步敲键盘）。 */

/* 工作中：小幅交替敲键盘 + 偶尔看屏幕 */
@keyframes seat-work-l { 0%,100% { transform: translateY(0) } 42% { transform: translateY(-1.8px) } }
@keyframes seat-work-r { 0%,100% { transform: translateY(-1.8px) } 58% { transform: translateY(0) } }
@keyframes seat-work-head { 0%,72%,100% { transform: rotate(0) } 80%,90% { transform: rotate(-3deg) } }
@keyframes seat-work-fx { 0%,100% { opacity: .1 } 50% { opacity: .26 } }
.st-work .p-hand-l { animation: seat-work-l 1.15s cubic-bezier(.4,0,.6,1) var(--fig-delay, 0s) infinite; }
.st-work .p-hand-r { animation: seat-work-r 1.15s cubic-bezier(.4,0,.6,1) var(--fig-delay, 0s) infinite; }
.st-work .p-head { animation: seat-work-head 5.5s ease-in-out var(--fig-delay, 0s) infinite; }
.st-work .p-screen-alert { fill: #3f6ea8; animation: seat-work-fx 2.6s ease-in-out var(--fig-delay, 0s) infinite; }

/* 调试中：高速交替敲击 + 点头 + 报错闪屏 */
@keyframes seat-dbg-l { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-2.8px) } }
@keyframes seat-dbg-r { 0%,100% { transform: translateY(-2.8px) } 50% { transform: translateY(0) } }
@keyframes seat-dbg-nod { 0%,100% { transform: rotate(0) translateY(0) } 50% { transform: rotate(-2.2deg) translateY(.7px) } }
@keyframes seat-dbg-alert { 0%,100% { opacity: 0 } 45%,60% { opacity: .85 } }
.st-debug .p-hand-l { animation: seat-dbg-l .3s steps(2, end) var(--fig-delay, 0s) infinite; }
.st-debug .p-hand-r { animation: seat-dbg-r .3s steps(2, end) var(--fig-delay, 0s) infinite; }
.st-debug .p-head { animation: seat-dbg-nod .6s ease-in-out var(--fig-delay, 0s) infinite; }
.st-debug .p-screen-alert { fill: #b8453a; animation: seat-dbg-alert 1.1s ease-in-out var(--fig-delay, 0s) infinite; }

/* 开会中：站起来讲解，右手抬起比划 + 缓慢扫视。
   坐姿的手臂画在身体下层，抬臂会被身体遮住 —— 所以坐姿改用「手抬到胸前比划」来表达。 */
@keyframes seat-mtg-arm { 0%,100% { transform: rotate(0) } 30%,55% { transform: rotate(42deg) } }
@keyframes seat-mtg-arm-seat { 0%,100% { transform: rotate(0) } 30%,55% { transform: rotate(26deg) } }
@keyframes seat-mtg-hand { 0%,100% { transform: translate(0,0) } 28%,55% { transform: translate(-7px,-11px) } }
@keyframes seat-mtg-head { 0%,100% { transform: rotate(0) } 25% { transform: rotate(-7deg) } 70% { transform: rotate(6deg) } }
.st-meeting.pose-stand .p-arm-r { animation: seat-mtg-arm 1.9s ease-in-out var(--fig-delay, 0s) infinite; }
.st-meeting.pose-seat .p-arm-r { animation: seat-mtg-arm-seat 1.9s ease-in-out var(--fig-delay, 0s) infinite; }
.st-meeting.pose-seat .p-hand-r { animation: seat-mtg-hand 1.9s ease-in-out var(--fig-delay, 0s) infinite; }
.st-meeting .p-head { animation: seat-mtg-head 5s ease-in-out var(--fig-delay, 0s) infinite; }

/* 休息中：闭眼、靠椅背、屏幕压暗 */
@keyframes seat-rest-torso { 0%,100% { transform: rotate(0) translateY(0) } 50% { transform: rotate(-1.6deg) translateY(.5px) } }
@keyframes seat-rest-head { 0%,100% { transform: rotate(-4deg) } 50% { transform: rotate(-6.5deg) translateY(.6px) } }
@keyframes seat-rest-dim { 0%,100% { opacity: .2 } 50% { opacity: .36 } }
.st-rest .p-torso { animation: seat-rest-torso 3.6s ease-in-out var(--fig-delay, 0s) infinite; }
.st-rest .p-head { animation: seat-rest-head 3.6s ease-in-out var(--fig-delay, 0s) infinite; }
.st-rest .p-eye { opacity: 0; }
.st-rest .p-eye-shut { opacity: 1; }
.st-rest .p-screen-alert { fill: #1b1d21; animation: seat-rest-dim 4.2s ease-in-out var(--fig-delay, 0s) infinite; }

/* 实验室外：位子空着，只剩待机呼吸灯与轻晃的椅子 */
@keyframes seat-out-idle { 0%,100% { opacity: .07 } 50% { opacity: .2 } }
@keyframes seat-out-chair { 0%,100% { transform: rotate(0) } 50% { transform: rotate(-.6deg) } }
.st-out .p-screen-alert { fill: #2f4a6b; animation: seat-out-idle 3.4s ease-in-out var(--fig-delay, 0s) infinite; }
.st-out .p-chair { animation: seat-out-chair 6s ease-in-out var(--fig-delay, 0s) infinite; }

/* 自定义 / 通道上站着的人：只有呼吸与轻微摆头 */
@keyframes seat-cus-breathe { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-.6px) } }
@keyframes seat-cus-head { 0%,100% { transform: rotate(0) } 30% { transform: rotate(-2.4deg) } 65% { transform: rotate(2deg) } }
.st-custom .p-torso, .st-stand .p-torso { animation: seat-cus-breathe 3.8s ease-in-out var(--fig-delay, 0s) infinite; }
.st-custom .p-head, .st-stand .p-head { animation: seat-cus-head 6s ease-in-out var(--fig-delay, 0s) infinite; }

/* 头像（聊天列表）与形象编辑器预览不挂状态：几十个一起动既吵又费 */
.seat-chat .seat-mav .seat-fig *, .seat-char-prev .seat-fig * { animation: none !important; }

@media (prefers-reduced-motion: reduce) {
  .seat-fig * { animation: none !important; }
  .seat-fig .p-screen-alert, .seat-fig .p-eye-shut { opacity: 0; }
  .st-rest .p-eye { opacity: 1; }
}
.seat-walker { position: absolute; left: 0; top: 0; width: 64px; height: 64px; padding-bottom: 1px; display: flex; align-items: flex-end; justify-content: center; transition: transform .3s cubic-bezier(.4,0,.2,1); }
.seat-walker svg { width: 58px; height: 44px; display: block; }

/* 地图编辑 */
.seat-paint { cursor: crosshair; }
.seat-paint:hover { box-shadow: 0 0 0 2px var(--blue); z-index: 6; }
.seat-paint-t { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 10px; color: #8a8b90; letter-spacing: .5px; }
.seat-paint-o { position: absolute; left: 50%; bottom: 3px; transform: translateX(-50%); font-size: 10px; color: var(--blue); background: #fff; border-radius: 999px; padding: 0 4px; border: 1px solid var(--line); }
.seat-brushes { display: flex; flex-wrap: wrap; gap: 6px; }
.seat-brush { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: 12px; color: var(--muted); cursor: pointer; }
.seat-brush:hover { border-color: var(--blue); color: var(--blue); }
.seat-brush.active { background: var(--blue); border-color: var(--blue); color: #fff; }
.seat-brush i { width: 12px; height: 12px; border-radius: 3px; border: 1px solid var(--line); display: inline-block; }
.seat-brush i.k-w { background: #fff; } .seat-brush i.k-f { background: #f7f6f3; }
.seat-brush i.k-s { background: #faf2e2; } .seat-brush i.k-t { background: #e8e8e3; }
.seat-brush i.k-d { background: #fff; } .seat-brush i.k-x { background: #5d6269; }
.seat-hint { margin-top: 7px; font-size: 11px; color: var(--muted); }
.seat-edit-body { flex: 1; min-height: 0; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.seat-size { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); }
.seat-size b { color: var(--ink); }
.seat-size button { width: 26px; height: 26px; border: 1px solid var(--line); border-radius: 7px; background: #fff; cursor: pointer; color: var(--muted); }
.seat-size button:hover { border-color: var(--blue); color: var(--blue); }
.seat-stat { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 0; }
.seat-stat div { display: flex; justify-content: space-between; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.seat-stat dt { font-size: 11px; color: var(--muted); }
.seat-stat dd { margin: 0; font-size: 12px; color: var(--ink); font-weight: 600; }
.seat-edit-note { font-size: 11px; line-height: 1.8; color: var(--muted); }

/* 右侧控制栏：竖向堆叠「图例条 + 聊天面板」（编辑态则是「笔刷工具面板」） */
.seat-side { display: flex; flex-direction: column; gap: 12px; min-width: 0; min-height: 0; }
.seat-side > * { min-width: 0; min-height: 0; }
.seat-tools {
  flex-shrink: 0; padding: 10px 12px;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
}
.seat-chat {
  flex: 1; min-height: 0; overflow: hidden;
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
}
.seat-chat-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 18px; border-bottom: 1px solid var(--line); flex-shrink: 0; }
.seat-chat-head strong { display: block; font-size: 14px; }
.seat-chat-head small { display: block; font-size: 10.5px; color: var(--muted); margin-top: 3px; }
.seat-chat-count { font-size: 11px; color: var(--muted); background: var(--blue-soft); border-radius: 999px; padding: 3px 10px; flex-shrink: 0; }
.seat-chat-list { flex: 1; min-height: 0; overflow-y: auto; padding: 16px 18px; display: flex; flex-direction: column; gap: 14px; }
.seat-chat-hint { font-size: 12.5px; color: var(--muted); text-align: center; padding: 22px 0; }
.seat-more { align-self: center; padding: 5px 14px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: 11.5px; color: var(--muted); cursor: pointer; }
.seat-more:hover { border-color: var(--blue); color: var(--blue); }
.seat-msg { display: flex; gap: 10px; align-items: flex-start; }
.seat-mav { width: 38px; height: 33px; flex-shrink: 0; padding: 0; border: 1px solid var(--line); border-radius: 9px; background: var(--blue-soft); cursor: pointer; overflow: hidden; }
.seat-mav:hover { border-color: var(--blue); }
.seat-mav svg { width: 100%; height: 100%; display: block; }
.seat-msg-body { min-width: 0; flex: 1; }
.seat-msg-meta { display: flex; align-items: center; gap: 7px; font-size: 11px; color: var(--muted); margin-bottom: 4px; }
.seat-msg-name { padding: 0; border: 0; background: none; font-size: 12.5px; font-weight: 600; color: var(--ink); cursor: pointer; }
.seat-msg-name:hover { color: var(--blue); text-decoration: underline; }
.seat-msg-meta time { margin-left: auto; }
.seat-me-tag { font-style: normal; font-size: 10px; padding: 0 6px; height: 15px; line-height: 15px; border-radius: 999px; background: var(--blue); color: #fff; }
.seat-msg-text { font-size: 13px; line-height: 1.65; word-break: break-word; background: #f7f7f5; border: 1px solid var(--line); border-radius: 10px; padding: 9px 12px; }
.seat-msg.mine .seat-msg-text { background: var(--blue-soft); border-color: #dbe3f0; }
.seat-del { width: 20px; height: 20px; flex-shrink: 0; padding: 0; border: 0; background: none; color: #c8c8c4; cursor: pointer; }
.seat-del:hover { color: var(--red); }
.seat-del svg { width: 14px; height: 14px; }
.seat-chat-foot { border-top: 1px solid var(--line); padding: 12px 18px 14px; flex-shrink: 0; background: #fcfcfa; display: flex; flex-wrap: wrap; gap: 9px; align-items: center; }
.seat-chat-foot input[type=text] { flex: 1; min-width: 0; padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; }
.seat-chat-foot input:focus { outline: none; border-color: var(--blue); }
.seat-bub-opt { flex-basis: 100%; display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--muted); cursor: pointer; }
.seat-bub-opt input { width: 14px; height: 14px; accent-color: var(--blue); margin: 0; }

/* 本人 / 他人面板 */
.seat-self { display: flex; gap: 16px; align-items: flex-start; }
.seat-self-av { width: 112px; height: 96px; flex-shrink: 0; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 7px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--blue-soft); }
.seat-self-av svg { width: 100px; height: 76px; }
.seat-self strong { font-size: 15px; }
.seat-self-st { display: inline-flex; align-items: center; gap: 7px; margin-top: 9px; padding: 4px 11px; border: 1px solid var(--line); border-radius: 999px; font-size: 12px; background: #f7f8f6; }
.seat-self-st i { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.seat-self-tx { margin-top: 8px; font-size: 12px; line-height: 1.6; color: var(--muted); word-break: break-word; }
.seat-self-pos { margin-top: 10px; font-size: 11px; color: var(--muted); }
.seat-menu { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 16px; }
.seat-menu-btn { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 9px; background: #fff; text-align: left; cursor: pointer; }
.seat-menu-btn:hover { border-color: var(--blue); background: #fbfcfe; }
.seat-menu-btn b { font-size: 13px; }
.seat-menu-btn small { font-size: 11px; color: var(--muted); line-height: 1.5; }

/* 状态选择与形象编辑器 */
.seat-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.seat-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: 12px; color: var(--muted); cursor: pointer; }
.seat-chip:hover { border-color: var(--blue); color: var(--blue); }
.seat-chip.active { background: var(--blue); border-color: var(--blue); color: #fff; }
.seat-chip i { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.seat-char { display: flex; gap: 16px; }
.seat-char-prev { width: 112px; height: 104px; flex-shrink: 0; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 7px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--blue-soft); }
.seat-char-prev svg { width: 104px; height: 79px; }
.seat-char-parts { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.seat-part label { display: block; font-size: 11px; color: var(--muted); margin-bottom: 5px; }
.seat-opts { display: flex; flex-wrap: wrap; gap: 6px; }
.seat-opt { min-height: 28px; padding: 0 10px; border: 1px solid var(--line); border-radius: 7px; background: #fff; font-size: 11px; color: var(--muted); cursor: pointer; }
.seat-opt:hover { border-color: var(--blue); }
.seat-opt.active { border-color: var(--blue); background: var(--blue-soft); box-shadow: 0 0 0 1px var(--blue) inset; color: var(--blue); }
.seat-swatch { width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 50%; cursor: pointer; padding: 0; }
.seat-swatch.active { box-shadow: 0 0 0 2px var(--blue); }

@media (prefers-reduced-motion: reduce) {
  .seat-cell { transition: none; }
  .seat-walker { transition: none; }
}
@media (max-width: 1680px) {
  .page-fit > .panel.seat-panel { --seat-side-w: 300px; }
}
@media (max-width: 1280px) {
  .page-fit > .panel.seat-panel { --seat-side-w: 280px; }
}

/* ── 纳新考核（自助注册 / 我的考核 / 考核管理 / 首次引导）── */
.register-entry { margin-top: 14px; font-size: 12.5px; color: #8992a4; text-align: center; }
.register-entry .text-btn { color: var(--green); font-weight: 600; }
.register-wrap { min-height: 100vh; display: grid; place-items: center; padding: 32px 20px; background: #f6f5f2; }
.register-card { width: 100%; max-width: 780px; background: #fff; border: 1px solid #e7e5e0; border-radius: 14px; padding: 34px 38px 28px; }
.register-card h1 { margin: 6px 0 8px; font-size: 24px; }
.register-card > p.muted { margin: 0 0 22px; font-size: 13px; line-height: 1.75; }
.register-note { margin: 18px 0 0; font-size: 11.5px; color: #9aa0ab; }

.countdown { text-align: center; padding: 8px 0 12px; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 38px; font-weight: 700; letter-spacing: 1px; color: var(--ink); font-variant-numeric: tabular-nums; }
.countdown.urgent { color: #d2833c; }
.countdown.idle { font-size: 19px; font-weight: 600; color: #6b7280; letter-spacing: .5px; padding: 24px 0; }
.recruit-progress { margin-top: 4px; }
.recruit-progress-head { display: flex; justify-content: space-between; font-size: 12.5px; color: #6b7280; margin-bottom: 8px; }
.recruit-bar { height: 6px; border-radius: 999px; background: #ecebe7; overflow: hidden; }
.recruit-bar i { display: block; height: 100%; background: var(--green); border-radius: 999px; transition: width .3s ease; }
.recruit-progress small { display: block; margin-top: 9px; }
.recruit-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.recruit-step { display: flex; align-items: center; justify-content: center; gap: 5px; background: #fbfbf9; border: 1px solid #ecebe7; border-radius: 8px; padding: 7px 8px; font-size: 12px; color: #6b7280; white-space: nowrap; }
.recruit-step.active { border-color: #e0a24a; background: #fdf7ee; color: #b8791f; font-weight: 600; }
.recruit-step.done { border-color: #bfe3d4; color: var(--green); }
.recruit-step svg { width: 13px; height: 13px; }
.recruit-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 0 18px 16px; }
.recruit-link { display: flex; align-items: center; justify-content: center; gap: 6px; background: #fff; border: 1px solid var(--line); border-radius: 9px; padding: 10px 8px; cursor: pointer; transition: border-color .14s; white-space: nowrap; }
.recruit-link:hover { border-color: var(--green); }
.recruit-link svg { width: 14px; height: 14px; color: var(--green); flex: none; }
.recruit-link strong { font-size: 12.5px; font-weight: 500; }
.recruit-notes { margin-top: 18px; padding-top: 14px; border-top: 1px dashed var(--line); font-size: 12.5px; color: #6b7280; }
.recruit-notes strong { display: block; color: #4a4e55; margin-bottom: 7px; }
.recruit-notes ul { margin: 0; padding-left: 17px; line-height: 1.85; }
.recruit-opinion { margin: 14px 0 0; padding: 11px 13px; background: #f7f7f5; border-radius: 8px; font-size: 12.5px; color: #4b5563; }
.recruit-urgent { color: #d2833c; font-weight: 600; }
.onb-body p { margin: 0 0 14px; font-size: 13px; line-height: 1.8; color: #4b5563; }
.onb-tips { margin: 0; padding-left: 18px; font-size: 12.5px; color: #6b7280; line-height: 1.9; }
.onb-dots { display: flex; gap: 6px; margin-top: 18px; }
.onb-dot { width: 6px; height: 6px; border-radius: 50%; background: #dcdbd6; transition: width .2s; }
.onb-dot.on { background: var(--green); width: 18px; border-radius: 999px; }
@media (max-width: 1080px) {
  .recruit-steps, .recruit-links { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .recruit-bar i, .recruit-link, .onb-dot { transition: none; }
}

/* 座位页对考核人员的「仅供参观」提示 */
.visit-note { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.visit-note b { color: #c07a2e; }

/* 考核排行榜：复用平台既有的 lb-podium / lb-list，只补「本人」高亮 */
.lb-top.is-me { border-color: #bfe3d4; }
.lb-row.is-me { background: #f4fbf8; border-radius: 8px; }

/* 通过墙的截图缩略图：.wall-media 是 flex 容器，.media-img 只有 aspect-ratio
   没有宽度时会被压成 0×0，缩略图看不见也点不到 —— 这里补上明确尺寸 */
.wall-media .media-img { width: 72px; height: 56px; }