/* 突袭配装页（weekly.html）——颜色全部走 style.css 的主题变量 */
body[data-page="weekly"] { padding: 18px 22px 60px; }
.wk-page { max-width: 1300px; margin: 0 auto; }

.wk-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 8px; }
.wk-title-wrap h1 { margin: 0; font-size: 26px; font-weight: 800; letter-spacing: .5px; color: var(--text); }
.wk-title-wrap p { margin: 6px 0 0; font-size: 12px; color: var(--text-muted); letter-spacing: .3px; }
.wk-title-wrap p b { color: var(--accent); font-weight: 600; }
.wk-tools { display: flex; align-items: center; gap: 8px; flex: none; }
.wk-status { display: inline-flex; align-items: center; gap: 7px; font-size: 11.5px; color: var(--text-dim); padding-right: 3px; white-space: nowrap; }
.wk-status i { width: 5px; height: 5px; border-radius: 50%; background: #34d399; box-shadow: 0 0 7px rgba(52,211,153,.55); }
.wk-tool { height: 31px; padding: 0 13px; border-radius: 5px; border: 1px solid var(--border-sub);
  background: var(--bg-input); color: var(--text-sub); font-size: 12.5px; cursor: pointer; font-family: inherit;
  display: inline-flex; align-items: center; gap: 6px; text-decoration: none; white-space: nowrap; }
.wk-tool:hover { border-color: var(--border-light); color: var(--text); }
.wk-tool svg { width: 14px; height: 14px; opacity: .8; }
.wk-hint { font-size: 11px; color: var(--text-dim); margin: 2px 2px 12px; letter-spacing: .2px; }
.wk-hint b { color: var(--text-muted); font-weight: 500; }

.wk-day { border: 1px solid var(--border-main); border-radius: 7px; background: var(--bg-panel); margin-bottom: 9px; overflow: hidden; }
.wk-day.open { border-color: rgba(var(--accent-rgb), .38); box-shadow: 0 6px 24px rgba(0,0,0,.22); }
.wk-day-head { height: 66px; display: flex; align-items: center; gap: 12px; padding: 0 16px 0 12px; cursor: pointer; user-select: none; }
.wk-day-head:hover { background: rgba(255,255,255,.022); }
.wk-chev { width: 13px; height: 13px; color: var(--text-dim); transition: transform .16s ease; flex: none; }
.wk-day.open .wk-chev { transform: rotate(90deg); color: var(--accent); }
.wk-boss-thumb { width: 46px; height: 56px; flex: none; border-radius: 5px; overflow: hidden; border: 1px solid var(--border-sub);
  background: var(--bg-inset) center top / cover no-repeat; position: relative; }
.wk-boss-thumb span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: 9px; letter-spacing: 1px; color: var(--text-dim); }
.wk-day.today .wk-boss-thumb { border-color: rgba(var(--accent-rgb), .65); box-shadow: 0 0 12px rgba(var(--accent-rgb), .12); }
.wk-day-name { font-size: 16px; font-weight: 700; color: var(--text); letter-spacing: .4px; white-space: nowrap; }
.wk-day.today .wk-day-name { color: var(--accent); }
.wk-day-pill { font-size: 10.5px; color: var(--accent-2); background: color-mix(in srgb, var(--accent-2) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent-2) 28%, transparent); border-radius: 3px; padding: 1px 6px; letter-spacing: .4px; white-space: nowrap; }
.wk-day.today .wk-day-pill { color: #141008; background: var(--accent); border-color: var(--accent); font-weight: 700; }
.wk-today-chip { font-size: 10px; color: #1a1608; background: var(--accent); border-radius: 3px; padding: 2px 5px; font-weight: 700; letter-spacing: .4px; }
.wk-next-chip { font-size: 10px; color: var(--text-dim); border: 1px dashed var(--border-sub); border-radius: 3px; padding: 1px 5px; letter-spacing: .4px; white-space: nowrap; }
.wk-attr { font-size: 11.5px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wk-attr .chip { display: inline-block; font-size: 10.5px; padding: 2px 7px; border-radius: 3px;
  border: 1px solid var(--border-main); color: var(--text-sub); background: rgba(255,255,255,.015); }
.wk-day-count { margin-left: auto; font-size: 11px; color: var(--text-dim); font-variant-numeric: tabular-nums; flex: none; }
.wk-day-count em { font-style: normal; color: var(--accent); }

.wk-day-body { display: none; padding: 0 12px 12px; }
.wk-day.open .wk-day-body { display: block; }
.wk-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }

.wk-team { min-height: 158px; border: 1px solid var(--border-main); border-radius: 6px;
  background: linear-gradient(180deg, rgba(255,255,255,.022), rgba(255,255,255,0) 42%), var(--bg-inset);
  padding: 10px 11px 9px; display: flex; flex-direction: column; }
.wk-team:hover { border-color: var(--border-light); }
.wk-team-top { display: flex; align-items: flex-start; gap: 8px; }
.wk-team-no { font-size: 11px; font-weight: 700; letter-spacing: .8px; color: var(--accent); padding-top: 1px; flex: none; }
.wk-team-title { font-size: 13px; color: var(--text); font-weight: 600; line-height: 17px; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wk-team-sub { font-size: 10.5px; color: var(--text-dim); line-height: 14px; margin-top: 1px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wk-team-actions { margin-left: auto; display: flex; gap: 3px; flex: none; }
.wk-icon-btn { width: 22px; height: 22px; border-radius: 4px; border: 1px solid transparent; background: transparent;
  color: var(--text-dim); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
.wk-icon-btn:hover { color: var(--text); background: rgba(255,255,255,.05); border-color: var(--border-sub); }
.wk-icon-btn svg { width: 13px; height: 13px; }

.wk-heroes { display: flex; gap: 5px; margin-top: 9px; }
.wk-hero { flex: 1 1 0; min-width: 0; text-align: center; }
.wk-ava { position: relative; width: 100%; aspect-ratio: 1 / 1; border-radius: 4px; overflow: hidden;
  background-size: cover, 112% 112%; background-position: center, center; background-color: #0b0b0e;
  border: 1px solid var(--border-sub); }
.wk-elem { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; opacity: .85; }
.wk-hero-name { font-size: 10px; line-height: 13px; color: var(--text-muted); margin-top: 3px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wk-no-hero { font-size: 11px; color: var(--text-dim); padding: 14px 0; }

.wk-meta { margin-top: auto; padding-top: 7px; border-top: 1px solid var(--border-main); display: flex; align-items: center; gap: 8px; }
.wk-pets { display: flex; gap: 3px; flex: none; }
.wk-pet { width: 19px; height: 19px; border-radius: 50%; background-size: cover; background-position: center;
  border: 1px solid var(--border-sub); }
.wk-pet.none { border-style: dashed; background: var(--bg-input); }
.wk-steps { font-size: 10.5px; color: var(--text-muted); display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.wk-steps svg { width: 11px; height: 11px; opacity: .6; }
.wk-warn { font-size: 10px; color: #f0b81e; white-space: nowrap; }
.wk-detail-btn { margin-left: auto; height: 23px; padding: 0 9px; font-size: 11px; border-radius: 4px;
  border: 1px solid rgba(var(--accent-rgb), .42); background: rgba(var(--accent-rgb), .06);
  color: var(--accent); cursor: pointer; font-family: inherit; letter-spacing: .3px; flex: none; }
.wk-detail-btn:hover { background: rgba(var(--accent-rgb), .14); }
.wk-empty-teams { grid-column: 1 / -1; border: 1px dashed var(--border-main); border-radius: 6px;
  padding: 26px; text-align: center; color: var(--text-dim); font-size: 12px; }

.wk-empty-page { border: 1px dashed var(--border-main); border-radius: 8px; background: var(--bg-panel);
  padding: 54px 24px; text-align: center; }
.wk-empty-page h2 { margin: 0 0 8px; font-size: 17px; color: var(--text); }
.wk-empty-page p { margin: 0 auto 16px; max-width: 600px; font-size: 12.5px; line-height: 1.8; color: var(--text-muted); }
.wk-empty-page a { color: var(--accent); }

/* ===== 详细弹层 ===== */
.wk-modal { position: fixed; inset: 0; background: rgba(4,4,6,.72); backdrop-filter: blur(3px);
  display: none; align-items: center; justify-content: center; z-index: 80; padding: 24px; box-sizing: border-box; }
.wk-modal.show { display: flex; }
.wk-modal-panel { width: min(1320px, 96vw); height: min(880px, 92vh); background: var(--bg-base);
  border: 1px solid var(--border-sub); border-radius: 9px; box-shadow: 0 30px 90px rgba(0,0,0,.65);
  display: flex; flex-direction: column; overflow: hidden; }
.wk-modal-head { min-height: 48px; flex: none; display: flex; align-items: center; gap: 10px; padding: 6px 12px 6px 16px;
  border-bottom: 1px solid var(--border-main); background: var(--bg-panel); flex-wrap: wrap; }
.wk-m-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 7px rgba(var(--accent-rgb), .6); }
.wk-m-title { font-size: 14px; font-weight: 700; color: var(--text); letter-spacing: .4px; }
.wk-m-sub { font-size: 11.5px; color: var(--text-muted); }
.wk-m-actions { margin-left: auto; display: flex; gap: 7px; align-items: center; }
.wk-m-actions .wk-tool { height: 28px; font-size: 11.5px; padding: 0 10px; }
.wk-m-close { width: 26px; height: 26px; margin-left: 3px; border-radius: 4px; border: 1px solid transparent;
  background: transparent; color: var(--text-muted); font-size: 15px; cursor: pointer; font-family: inherit; }
.wk-m-close:hover { color: var(--text); background: rgba(255,255,255,.06); }
.wk-modal-body { flex: 1; min-height: 0; background: var(--bg-base); }
.wk-modal-body iframe { width: 100%; height: 100%; border: 0; display: block; background: var(--bg-base); }

.wk-toast { position: fixed; left: 50%; top: 18px; transform: translateX(-50%) translateY(-8px);
  background: var(--bg-panel); border: 1px solid var(--accent); color: var(--text); padding: 8px 18px;
  border-radius: 6px; font-size: 12.5px; z-index: 99; opacity: 0; pointer-events: none;
  transition: all .2s ease; box-shadow: 0 8px 28px rgba(0,0,0,.5); white-space: nowrap; }
.wk-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

@media (max-width: 1120px) { .wk-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px) {
  body[data-page="weekly"] { padding: 14px 12px 40px; }
  .wk-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wk-top { align-items: flex-start; flex-direction: column; gap: 10px; }
  .wk-day-head { height: auto; min-height: 62px; flex-wrap: wrap; padding: 8px 12px; gap: 8px; }
  .wk-attr { width: 100%; order: 6; }
  .wk-day-count { margin-left: auto; }
}
@media (max-width: 560px) {
  .wk-grid { grid-template-columns: 1fr; }
  .wk-status { display: none; }
  .wk-modal { padding: 8px; }
  .wk-modal-panel { width: 100%; height: 92vh; }
  .wk-m-actions .wk-tool { padding: 0 8px; }
}
