/* 看板接入层：弹窗/骨架/空态/对局选中态 —— 视觉令牌与 shared.css 同一组变量
   「晨雾纸面 / 夜航甲板」：mono 空态、shimmer 骨架、靛蓝水洗选中态 */
.lh-empty {
  display: flex; align-items: center; justify-content: center;
  padding: 32px 16px; color: rgb(var(--t-ink-2) / .8);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px; letter-spacing: .04em;
}
.lh-skel {
  display: inline-block; height: 12px; border-radius: 4px;
  position: relative; overflow: hidden;
  background: rgb(var(--t-contrast) / .06);
}
.lh-skel::after {
  content: ""; position: absolute; inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgb(var(--t-card) / .85), transparent);
  animation: lhShimmer 1.6s linear infinite;
}
:root[data-theme="dark"] .lh-skel::after {
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .06), transparent);
}
@keyframes lhShimmer { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
#lhModal.show, #lhModal.is-open, #lhModal.is-closing { display: flex; }
#lhToast.err { border-color: rgb(var(--t-down) / .5); color: rgb(var(--t-down)); }
.lh-clickable { cursor: pointer; }
.lh-truncate-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.match-item.is-active {
  background-color: rgb(var(--t-primary-wash)) !important;
  border-color: rgb(var(--t-primary) / .45) !important;
  box-shadow: var(--shadow-1) !important;
}
/* 胜负不明：中性灰，不走失败红（编译后的 Tailwind 没有 on-surface-variant/10） */
.win-unknown-wash { background-color: rgb(var(--t-ink-2) / .10); }
.win-unknown-bar { border-color: rgb(var(--t-ink-2)); }
.win-unknown-dot { background-color: rgb(var(--t-ink-2)); }
.lh-scroll { overflow-y: auto; }
.lh-scroll::-webkit-scrollbar { width: 4px; }

/* ============================================================
 * 字体栈：系统 UI + 中文黑体；等宽数字走 ui-monospace
 * ============================================================ */
body,
.font-body-lg,
.font-body-md,
.font-display-lg,
.font-headline-lg,
.font-headline-md {
  /* 不把未加载的 Geist 放第一位：部分 iOS/WebKit 会因此落到衬线体，汉字被挤成竖排 */
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
    "Noto Sans SC", "Microsoft YaHei UI", sans-serif;
}
.font-display-lg,
.font-headline-lg,
.font-headline-md { letter-spacing: -0.02em; }
.font-label-caps,
.font-label-sm {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.font-label-caps { letter-spacing: 0.1em; }
.font-label-sm { letter-spacing: 0.02em; }

/* 弹窗遮罩：深墨 45% + blur(6px)；卡片 shadow-3 */
#lhModal {
  background: var(--modal-mask);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
@media (prefers-reduced-transparency: reduce) {
  #lhModal { -webkit-backdrop-filter: none; backdrop-filter: none; }
}
/* 二级界面滚动：弹窗高度锁在视口内，正文区域负责滚动 */
#lhModal > div { max-height: 90vh; box-shadow: var(--shadow-3); }
#lhModalBody { flex: 1 1 auto; min-height: 0; scrollbar-gutter: stable; }
@media (max-width: 768px) {
  #lhModal > div { max-height: 85vh; }
}

/* 顶栏动作：桌面显示文字，窄屏改成图标以免挤爆标题 */
.header-icon-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.header-btn-icon { display: none; }
.mobile-fabs { display: none; }
.is-hidden { display: none !important; }
button.search-suggest-item[aria-selected="true"] {
  background: rgb(var(--t-primary) / .12);
}
.hall-splash-blur { filter: blur(32px) saturate(1.15); transform: scale(1.45); opacity: .5; }
.hall-splash-wash {
  background: radial-gradient(circle at 30% 60%, rgb(var(--t-up) / .14), transparent 40%),
    radial-gradient(circle at 70% 30%, rgb(var(--t-primary) / .16), transparent 45%),
    radial-gradient(circle at 50% 80%, rgb(var(--t-teal) / .10), transparent 50%);
}
.chart-box { width: 100%; height: 320px; }
/* 撞车矩阵：绘图区按成员数收成正方形，卡片里水平居中，不再拉满整行 */
.pool-overlap-box {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 180px;
  width: 100%;
}
.pool-overlap-chart {
  max-width: 100%;
  box-sizing: border-box;
}
.hit-44 { min-width: 44px; min-height: 44px; }
/* 名场面类型芯片：点击会改 class，高度不能跟着掉 */
#hallTypeFilters [data-hall-filter] {
  min-width: 44px;
  min-height: 44px;
  box-sizing: border-box;
}
.header-more-wrap { display: none; }
:root { --collect-status-h: 0px; }
.collect-status-bar {
  position: relative; z-index: 39;
  margin-top: 56px;
  padding: 8px 12px; font-size: 14px;
  background: rgb(var(--t-down) / .12); color: rgb(var(--t-down));
  border-bottom: 1px solid rgb(var(--t-down) / .3);
}
@media (min-width: 768px) {
  .collect-status-bar { margin-top: 64px; margin-left: 15rem; }
}
/* 状态条在文档流里顶开正文；不再用固定 40px 占位 */
body.has-collect-status main {
  padding-top: 0 !important;
}
@media (min-width: 768px) {
  body.has-collect-status main { padding-top: 0 !important; }
}
@media (max-width: 767px) {
  #duoFilterBtn,
  [data-hall-view],
  [data-hall-filter],
  #hallDateBtn,
  #hallDateClear {
    min-width: 44px;
    min-height: 44px;
    box-sizing: border-box;
  }
}
.matches-split { min-height: 0; }
.matches-head { padding-bottom: 8px; }
/* 桌面：页头贴卡片，剩余视口交给主从栏，避免 12rem 估高在标题下留出一条空白 */
@media (min-width: 1024px) {
  body[data-page="matches"] main {
    height: 100vh;
    padding-bottom: 12px !important;
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }
  body[data-page="matches"] .matches-page {
    flex: 1 1 auto;
    min-height: 0;
    gap: 8px;
    padding-top: 8px;
  }
  body[data-page="matches"] .matches-split {
    flex: 1 1 auto;
    min-height: 0;
  }
  body[data-page="matches"] .matches-split > section {
    height: 100%;
    max-height: 100%;
  }
  /* 采集状态条占文档流时不要锁 100vh，否则内容会被顶栏+状态条裁掉 */
  body.has-collect-status[data-page="matches"] main {
    height: auto;
    overflow: visible;
    display: block;
  }
  body.has-collect-status[data-page="matches"] .matches-page {
    flex: none;
  }
  body.has-collect-status[data-page="matches"] .matches-split > section {
    height: auto;
    max-height: none;
  }
}
/* md 桌面：侧栏已出现，顶栏只剩 calc(100%-15rem)；动作改图标、藏同步文案与视角名，避免挤掉退出登录 */
@media (min-width: 768px) and (max-width: 1199px) {
  #syncStatusChip { display: none !important; }
  .header-btn-icon { display: block; }
  .header-btn-label { display: none; }
  #logoutBtn .header-btn-label { display: inline; }
  #viewerSwitchLabel,
  .viewer-switch-caret { display: none; }
  #globalSearchWrap {
    flex: 0 1 8rem !important;
    min-width: 44px !important;
    max-width: 8rem;
  }
  #globalSearch { width: 100% !important; }
}
@media (min-width: 1200px) {
  .header-btn-icon { display: none; }
  .header-btn-label { display: inline; }
}

/* 移动端悬浮底栏：为主内容区留出空间（12px 外边距 + 64px 栏高） */
@media (max-width: 767px) {
  /* overflow-x:hidden 在 body 上会裁掉 position:fixed 的右下按钮 */
  body { overflow-x: visible !important; }
  main { overflow-x: hidden; max-width: 100%; padding-bottom: 6rem !important; }
  .site-header {
    height: 56px !important;
    padding: 0 10px !important;
    gap: 6px;
    /* 不能 overflow:hidden：聚焦展开的搜索框与建议列表都锚在顶栏盒上，会被裁掉 */
    flex-wrap: nowrap;
    justify-content: flex-start !important;
  }
  .header-actions {
    /* 动作组靠右：flex-start 下否则会在右侧留出一段死区 */
    margin-left: auto;
    flex: none;
  }
  /* 顶栏已能放下图标；FAB 仅作窄屏备份，默认仍隐藏以免叠在底栏上 */
  .mobile-fabs {
    display: none !important;
    gap: 8px;
    position: fixed;
    right: 12px;
    bottom: calc(88px + env(safe-area-inset-bottom, 0px));
    z-index: 45;
  }
  .mobile-fabs .header-icon-btn {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    border-radius: 999px !important;
    box-shadow: var(--shadow-2);
  }
  main { padding-top: 56px !important; }
  .site-title {
    white-space: nowrap !important;
    flex: none !important;
    line-height: 1.2;
  }
  /* 搜索收成 36px 图标，聚焦时铺满顶栏；展开态锚在顶栏盒上（glass-frost 的
     backdrop-filter 使 fixed 相对顶栏定位），不能锚 36px 的 wrap——会冲出左边缘 */
  #globalSearchWrap {
    flex: none !important;
    width: 44px;
    min-width: 44px !important;
    max-width: 44px;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow: visible;
  }
  #globalSearch {
    width: 44px !important;
    min-width: 0 !important;
    max-width: 44px;
    min-height: 44px;
    padding-left: 44px !important;
    padding-right: 0 !important;
    color: transparent;
  }
  #globalSearch:focus {
    position: fixed;
    top: 8px;
    left: 10px;
    right: 10px;
    width: auto !important;
    max-width: none;
    color: inherit;
    z-index: 60;
    padding-left: 12px !important;
    padding-right: 12px !important;
    background: rgb(var(--t-surface-dim));
  }
  /* 展开后收起态的放大镜会被输入框盖住，直接藏掉 */
  #globalSearchWrap:focus-within > .lh-icon { display: none; }
  /* 建议列表同样锚顶栏盒：w-full 只有 36px，且默认 static 定位下会被顶栏裁 */
  #searchSuggest {
    position: fixed;
    top: 54px;
    left: 10px;
    right: 10px;
    width: auto;
  }
  /* 更多菜单不挂在带 backdrop-filter 的顶栏里：fixed + 实底，正文不会透进菜单字 */
  #headerMoreMenu {
    position: fixed;
    z-index: 60;
    background: rgb(var(--t-card));
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .header-actions { gap: 4px !important; }
  .header-extra-actions { display: none !important; }
  .header-more-wrap { display: block; }
  .header-more-btn,
  .header-icon-btn,
  #themeToggle,
  .viewer-switch-btn,
  #headerMoreBtn {
    min-width: 44px !important;
    min-height: 44px !important;
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    letter-spacing: 0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  #headerMoreBtn { width: auto !important; padding: 0 10px !important; font-size: 14px; }
  .header-btn-icon { display: block; }
  .header-btn-label { display: none; }
  .viewer-switch-caret { display: none; }
  .font-label-caps { letter-spacing: 0.04em; }
  /* 热力图：列宽均分，不再把卡片撑出屏幕 */
  #heatGrid.grid {
    width: 100%;
    grid-auto-columns: minmax(0, 1fr);
  }
  #heatGrid .heat-cell { min-width: 0; }
  #matchDetail, #matchList { min-width: 0; max-width: 100%; }
  .rec-card { align-items: flex-start; }
  .rec-value, .rec-sub { white-space: normal; overflow-wrap: anywhere; }
  .kpi-card .font-label-sm, #heroMeta { word-break: break-word; }
  body[data-page="duo"] .lh-table { table-layout: fixed; width: 100%; }
  body[data-page="duo"] .lh-table th:nth-child(1),
  body[data-page="duo"] .lh-table td:nth-child(1) { width: 48%; }
  body[data-page="duo"] .lh-table th:nth-child(3),
  body[data-page="duo"] .lh-table td:nth-child(3) { width: 40px; }
}

/* 窄屏点选对局后 scrollIntoView：详情顶部让开 64px 固定顶栏 + 12px 呼吸位 */
#matchDetail { scroll-margin-top: 76px; }

/* 对局列表卡片：hover 弹簧位移 + 选中态左侧指示条弹入 */
.match-item {
  transition: transform 300ms var(--ease-spring, cubic-bezier(.34, 1.56, .64, 1)),
              background-color 180ms var(--ease-snap, ease),
              border-color 180ms var(--ease-snap, ease),
              box-shadow 200ms var(--ease-paper, ease);
}
@media (hover: hover) and (pointer: fine) {
  .match-item:hover { transform: translateX(3px); }
  .match-item:active { transform: translateX(3px) scale(.99); }
  .squad-hide-btn { opacity: 0; }
  tr.group:hover .squad-hide-btn { opacity: 1; }
}
.match-item::before {
  content: "";
  position: absolute;
  left: 0; top: 50%;
  width: 3px; height: 0;
  border-radius: 3px;
  background: rgb(var(--t-primary));
  transform: translateY(-50%);
  opacity: 0;
  transition: height 320ms var(--ease-spring, cubic-bezier(.34, 1.56, .64, 1)), opacity 180ms ease;
}
.match-item.is-active::before { height: 62%; opacity: 1; }

/* 主视角切换器：右上角第三人称视角选择 */
.viewer-switch-btn {
  background: rgb(var(--t-contrast) / .04);
  min-width: 0;
  max-width: 36px;
  justify-content: center;
}
@media (min-width: 768px) {
  .viewer-switch-btn { min-width: 148px; max-width: none; }
}
.viewer-switch-caret {
  width: 0; height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  opacity: .7;
  transition: transform .32s var(--ease-spring, cubic-bezier(.34, 1.56, .64, 1));
}
.viewer-switch-wrap.open .viewer-switch-caret { transform: rotate(180deg); }
/* 视角菜单走 .t-dropdown；搜索建议仍用 menuPop */
#viewerSwitchMenu:not(.t-dropdown):not(.hidden) { animation: menuPop 320ms var(--ease-spring, cubic-bezier(.34, 1.56, .64, 1)) both; transform-origin: top right; }
@keyframes menuPop {
  0% { opacity: 0; transform: translateY(-6px) scale(.92); }
  60% { opacity: 1; transform: translateY(1px) scale(1.015); }
  100% { opacity: 1; transform: none; }
}
/* 搜索建议浮层：同样的弹性展开 */
#searchSuggest:not(.hidden) { animation: menuPop 280ms var(--ease-spring, cubic-bezier(.34, 1.56, .64, 1)) both; transform-origin: top left; }
#searchSuggest button { transition: background-color .16s ease, transform .24s var(--ease-spring, cubic-bezier(.34, 1.56, .64, 1)); }
#searchSuggest button:active { transform: scale(.98); }
.viewer-option {
  width: 100%;
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 12px;
  text-align: left;
  color: rgb(var(--t-ink)); /* 曾写成未定义的 --t-ink-1，整条声明失效 */
  transition: background-color .16s ease;
}
.viewer-option:hover { background: rgb(var(--t-contrast) / .06); }
.viewer-option.active {
  background: rgb(var(--t-primary-wash));
  color: rgb(var(--t-primary));
}
.viewer-option-id { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.viewer-option-meta { font-size: 10px; color: rgb(var(--t-ink-2) / .75); white-space: nowrap; }
.viewer-option.active .viewer-option-meta { color: rgb(var(--t-primary) / .8); }
.viewer-option-empty { padding: 12px; font-size: 12px; color: rgb(var(--t-ink-2) / .8); }

/* 名场面：页面内年月日选择，不走系统 type=date */
.hall-date-panel {
  position: fixed;
  z-index: 60;
  width: 292px;
  max-width: calc(100vw - 24px);
  padding: 12px;
  background: rgb(var(--t-card));
  border: 1px solid rgb(var(--t-line));
  border-radius: 12px;
  box-shadow: var(--shadow-2);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-sizing: border-box;
}
.hall-date-panel.is-open,
.hall-date-panel.is-closing { display: block; }
.hall-date-panel.hidden:not(.is-closing) { display: none !important; }
.hall-date-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 2px;
}
.hall-date-grid.is-months,
.hall-date-grid.is-years {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}
.hall-date-dows span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 24px;
  font-size: 10px;
  letter-spacing: 0.04em;
  color: rgb(var(--t-ink-2));
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.hall-date-cell {
  min-height: 36px;
  min-width: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: rgb(var(--t-ink));
  display: flex;
  align-items: center;
  justify-content: center;
  font-variant-numeric: tabular-nums;
  font-size: 13px;
  padding: 0;
}
.hall-date-cell:disabled { opacity: 0; pointer-events: none; }
.hall-date-cell.is-today { box-shadow: inset 0 0 0 1px rgb(var(--t-primary) / .45); }
.hall-date-cell.is-selected {
  background: rgb(var(--t-primary));
  color: rgb(var(--on-primary));
  box-shadow: none;
}
.hall-date-grid.is-months .hall-date-cell,
.hall-date-grid.is-years .hall-date-cell { min-height: 44px; }
@media (hover: hover) and (pointer: fine) {
  .hall-date-cell:not(:disabled):not(.is-selected):hover {
    background: rgb(var(--t-primary-wash));
  }
}

@media (max-width: 640px) {
  .viewer-switch-btn { min-width: 0; padding-left: 8px; padding-right: 8px; }
  #viewerSwitchLabel { display: none; }
  #viewerSwitchMenu { right: 0; width: 240px; }
}

/* 个人头像 + 英雄头像并排（两个等大） */
.avatar-pair {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  vertical-align: middle;
  flex: none;
}
.avatar-pair-item {
  display: block;
  flex: none;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid rgb(var(--t-line-strong));
  background: rgb(var(--t-contrast) / .05);
}

/* 海克斯 T / 胡烂徽章 */
.hex-chip { display: inline-flex; align-items: center; gap: 3px; }
.hex-t {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 8px; letter-spacing: .04em; font-weight: 700;
  border-radius: 3px; padding: 0 3px; line-height: 1.4;
}
.hex-t-1 { color: #ef4444; background: rgba(239, 68, 68, .12); }
.hex-t-2 { color: #f97316; background: rgba(249, 115, 22, .12); }
.hex-t-3 { color: #eab308; background: rgba(234, 179, 8, .12); }
.hex-t-4 { color: #22c55e; background: rgba(34, 197, 94, .12); }
.hex-t-5 { color: #9ca3af; background: rgba(156, 163, 175, .12); }
.hex-luck-badge {
  border-radius: 4px; padding: 0 4px; font-size: 9px; line-height: 1.5;
  border: 1px solid transparent;
}
.hex-luck-tianhu { color: #f5c84c; background: rgba(245, 200, 76, .12); border-color: rgba(245, 200, 76, .35); }
.hex-luck-hu { color: #22d3ee; background: rgba(34, 211, 238, .10); border-color: rgba(34, 211, 238, .28); }
.hex-luck-ping { color: rgb(var(--t-ink-2)); background: rgb(var(--t-contrast) / .05); border-color: rgb(var(--t-contrast) / .16); }
.hex-luck-lan { color: #fb923c; background: rgba(251, 146, 60, .10); border-color: rgba(251, 146, 60, .28); }
.hex-luck-chao_lan { color: #f87171; background: rgba(248, 113, 113, .12); border-color: rgba(248, 113, 113, .35); }
.hex-luck-stale { opacity: .72; border-style: dashed; }


/* ---------- 通用自绘日历（弹窗内嵌形态，复用 hall-date-* 网格件） ---------- */
.lh-cal-inline {
  width: 100%;
  padding: 10px;
  background: rgb(var(--t-card));
  border: 1px solid rgb(var(--t-line));
  border-radius: 12px;
  box-sizing: border-box;
}
.lh-cal-inline .hall-date-grid { gap: 2px; }
.hall-date-cell { position: relative; }
.hall-date-cell.has-games::after {
  content: '';
  position: absolute;
  left: 50%; bottom: 4px;
  width: 4px; height: 4px;
  border-radius: 50%;
  transform: translateX(-50%);
  background: rgb(var(--t-accent, 99 102 241) / .9);
  background: var(--seg-a, #6366F1);
}
.hall-date-cell.is-selected.has-games::after { background: currentColor; }

/* ---------- 自绘 select（替代原生系统选项框） ---------- */
.lh-select { position: relative; }
.lh-select > select {
  position: absolute !important;
  width: 1px; height: 1px;
  opacity: 0; pointer-events: none;
  margin: 0; padding: 0; border: 0;
}
.lh-select-btn {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 100%;
  text-align: left;
  cursor: pointer;
}
.lh-select-btn .lh-select-caret {
  flex: 0 0 auto;
  transition: transform var(--duration-quick, 150ms) var(--ease-smooth-out, ease);
}
.lh-select.is-open .lh-select-caret { transform: rotate(180deg); }
.lh-select-menu {
  position: absolute;
  z-index: 80;
  top: calc(100% + 6px);
  left: 0;
  min-width: 100%;
  max-height: 260px;
  overflow-y: auto;
  padding: 4px;
  background: rgb(var(--t-card));
  border: 1px solid rgb(var(--t-line));
  border-radius: 10px;
  box-shadow: var(--shadow-2);
  box-sizing: border-box;
}
.lh-select-menu.hidden:not(.is-closing) { display: none !important; }
.lh-select-menu.is-open, .lh-select-menu.is-closing { display: block; }
.lh-select-option {
  display: block;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: rgb(var(--t-ink));
  font-size: 13px;
  text-align: left;
  cursor: pointer;
  transition: background-color .16s ease;
}
.lh-select-option:hover, .lh-select-option.is-active { background: rgb(var(--t-contrast) / .07); }
.lh-select-option[aria-selected="true"] { color: var(--seg-a, #6366F1); font-weight: 600; }
@media (prefers-reduced-motion: reduce) {
  .lh-select-btn .lh-select-caret { transition: none; }
}