/* 消息中心（Figma 1364:22540 / 编辑态 1452:13603）。
   左右 gutter 与个人中心 hub 同源（--hg-page-gutter），内容区封顶 1664。 */
.hg-profile-msg{
  box-sizing:border-box;
  max-width:calc(1664px + 2 * var(--hg-page-gutter));
  margin:0 auto;
  padding:20px var(--hg-page-gutter) 48px
}
.hg-profile-msg__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-top:8px
}
.hg-profile-msg__titles h1{
  margin:0;color:#fff;font-size:26px;font-weight:600;line-height:39px;letter-spacing:-.04px
}
.hg-profile-msg__titles p{
  margin:3px 0 0;color:rgba(255,255,255,.6);font-size:14px;line-height:20px
}
.hg-profile-msg__actions{
  display:flex;align-items:center;gap:20px;flex-shrink:0;padding-top:6px
}
.hg-profile-msg__count{color:rgba(255,255,255,.5);font-size:14px;line-height:20px}
button.hg-profile-msg__edit{
  -webkit-appearance:none;appearance:none;
  box-sizing:border-box;
  width:88px;height:40px;padding:0;border:0;border-radius:100px;
  background:#ffd21c;background-color:#ffd21c;background-image:none;
  color:#0d0d0d;font-size:14px;font-weight:500;line-height:1;cursor:pointer
}
.hg-profile-msg.is-editing button.hg-profile-msg__edit{
  background:rgba(255,210,28,.1);background-color:rgba(255,210,28,.1);color:#ffd21c
}
.hg-msg-toolbar{
  box-sizing:border-box;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  min-height:72px;margin-top:16px;padding:0 24px;
  border:1px solid #33312c;border-radius:12px;background:#141412;
  box-shadow:0 8px 12px rgba(0,0,0,.5)
}
.hg-msg-toolbar[hidden]{display:none}
.hg-msg-toolbar__left{display:flex;align-items:center;gap:16px;min-width:0}
.hg-msg-toolbar__all{
  display:inline-flex;align-items:center;gap:16px;padding:0;border:0;background:none;
  color:#ebebe6;font-size:14px;font-weight:500;line-height:1;cursor:pointer
}
.hg-msg-toolbar__all .hg-msg-check{display:block}
.hg-msg-toolbar__all.is-on .hg-msg-check__off{display:none}
.hg-msg-toolbar__all.is-on .hg-msg-check__on{display:block}
.hg-msg-toolbar__divider{width:1px;height:16px;background:rgba(255,255,255,.12);flex-shrink:0}
.hg-msg-toolbar__picked{color:#8f8f8a;font-size:14px;line-height:1;white-space:nowrap}
.hg-msg-toolbar__delete{
  -webkit-appearance:none;appearance:none;
  box-sizing:border-box;min-width:76px;height:36px;padding:8px 24px;
  border:1px solid #ff3838;border-radius:20px;
  background:rgba(255,56,56,.05);color:#ff3838;
  font-size:14px;font-weight:500;line-height:1;cursor:pointer
}
.hg-msg-toolbar__delete:disabled{opacity:.4;cursor:default}
.hg-msg-list{display:flex;flex-direction:column;gap:15px;margin-top:15px}
.hg-profile-msg.is-editing .hg-msg-list{gap:16px;margin-top:16px}
.hg-msg-list__empty{padding:48px 0;color:#888;text-align:center}
.hg-msg-card{
  display:flex;align-items:center;gap:20px;
  box-sizing:border-box;min-height:114px;padding:17px;
  border:1px solid rgba(255,255,255,.06);border-radius:14px;background:#161616
}
.hg-profile-msg.is-editing .hg-msg-card{
  gap:15px;padding:16px;border-color:rgba(255,255,255,.1)
}
.hg-msg-card[data-href]{cursor:pointer}
.hg-profile-msg.is-editing .hg-msg-card{cursor:default}
.hg-msg-card__body{min-width:0;flex:1}
.hg-msg-card__tag{
  margin:0;color:#ffd21c;font-size:12px;font-weight:600;line-height:16.5px;letter-spacing:.06px
}
.hg-msg-card__body h3{
  margin:8px 0 0;color:#fff;font-size:16px;font-weight:600;line-height:22px;letter-spacing:-.3px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap
}
.hg-msg-card__content{
  margin:8px 0 0;color:rgba(255,255,255,.45);font-size:14px;line-height:21px;letter-spacing:-.08px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap
}
.hg-msg-card__time{
  flex-shrink:0;color:rgba(255,255,255,.4);font-size:13px;font-weight:500;line-height:20px;white-space:nowrap
}
.hg-msg-check{
  position:relative;display:none;flex-shrink:0;width:18px;height:18px;padding:0;
  border:0;background:none;cursor:pointer;overflow:clip
}
.hg-profile-msg.is-editing .hg-msg-card .hg-msg-check{display:block}
.hg-msg-check img{display:block;width:18px;height:18px}
.hg-msg-check__on{display:none}
.hg-msg-card.is-selected .hg-msg-check__off{display:none}
.hg-msg-card.is-selected .hg-msg-check__on{display:block}
@media (max-width:900px){
  .hg-profile-msg{padding:16px var(--hg-page-gutter) 32px}
  .hg-profile-msg__head{align-items:flex-start;gap:12px}
  .hg-profile-msg__titles h1{font-size:22px;line-height:32px}
  .hg-profile-msg__titles p{font-size:13px}
  .hg-profile-msg__actions{gap:8px;padding-top:2px}
  .hg-profile-msg__count{display:none}
  button.hg-profile-msg__edit{width:70px;height:34px;font-size:13px}
  .hg-msg-toolbar{min-height:52px;margin-top:16px;padding:0 12px;gap:10px}
  .hg-msg-toolbar__left{gap:8px;flex-wrap:wrap}
  .hg-msg-toolbar__all{gap:8px;font-size:13px}
  .hg-msg-toolbar__picked{font-size:13px}
  .hg-msg-toolbar__delete{min-width:64px;height:32px;padding:6px 14px;font-size:13px}
  .hg-msg-list{gap:12px;margin-top:12px}
  .hg-msg-card{
    display:grid;grid-template-columns:1fr;grid-template-rows:auto auto;
    min-height:0;padding:16px;gap:8px;align-items:start
  }
  .hg-profile-msg.is-editing .hg-msg-card{
    grid-template-columns:24px 1fr;column-gap:10px
  }
  .hg-profile-msg.is-editing .hg-msg-card .hg-msg-check{
    grid-row:1 / span 2;grid-column:1;align-self:center;width:24px;height:24px
  }
  .hg-profile-msg.is-editing .hg-msg-card__body,
  .hg-profile-msg.is-editing .hg-msg-card__time{grid-column:2}
  /* 禅道 44650：这条规则原来漏了 .hg-msg-card 限定。
     工具条「全选本页」里的勾选框和消息卡片里的用的是同一个 .hg-msg-check 类，
     所以它把工具条那枚图标也一起放大成 24px，但外层 span 在移动端并没有跟着变大
     （上面第 120 行那条放大 span 的规则是限定了 .hg-msg-card 的），仍是 18×18 且 overflow:clip。
     叠加 common.css 的全局 img{max-width:100%}，图片宽被压回 18、高仍是 24；
     SVG 的 viewBox 是 0 0 18 18，按默认 xMidYMid meet 在 18×24 里垂直居中，上下各空 3px，
     底边落在 y=21 处、被 18px 的裁剪框切掉 —— 就是截图里那个缺了底边的方框。
     补上 .hg-msg-card 限定即可：卡片内仍是 24px（触控目标），工具条回到与 PC 一致的 18px。 */
  .hg-profile-msg.is-editing .hg-msg-card .hg-msg-check img{width:24px;height:24px}
  .hg-msg-card__body{min-width:0}
  .hg-msg-card__body h3{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .hg-msg-card__content{
    white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical
  }
  .hg-msg-card__time{margin:0}
}
