/* 测试页「晋级地图」(promo-map.js) */
.pm { max-width: 1480px; }
.pm-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; }
.pm-title { margin: 0; font-size: 18px; color: var(--ink); }
.pm-sub { color: var(--muted); font-size: 12.5px; }
.pm-only { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; color: var(--ink-2); cursor: pointer; }
.pm-only:has(input:disabled) { color: var(--faint); cursor: default; }
.pm-note { margin: 4px 0 10px; color: var(--muted); font-size: 12px; }
.pm-empty { color: var(--muted); padding: 24px 0; }

.pm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 8px; align-items: start; }
.pm-card { background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px 7px; }
.pm-card.is-star { border-color: var(--warn); box-shadow: 0 0 0 1px var(--warn) inset; }
.pm-card.is-tail { background: var(--surface); }
.pm-card header { display: flex; align-items: baseline; gap: 4px; margin-bottom: 3px; }
.pm-card h2 { margin: 0; font-size: 14px; color: var(--ink); }
.pm-meta { margin-left: auto; color: var(--muted); font-size: 11.5px; white-space: nowrap; }
.pm-star { border: 0; background: none; padding: 0 2px; font-size: 15px; line-height: 1; color: var(--faint); cursor: pointer; }
.pm-star[aria-pressed="true"] { color: var(--warn); }
.pm-star:focus-visible { outline: 2px solid var(--teal); border-radius: 3px; }

.pm-tier { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 4px; padding: 3px 0; border-top: 1px dashed var(--line-2); }
.pm-tier:first-of-type { border-top: 0; }
.pm-label { font-size: 11px; line-height: 20px; color: var(--muted); white-space: nowrap; }
.pm-tier.is-high .pm-label { color: var(--up); font-weight: 600; }
.pm-stks { display: flex; flex-wrap: wrap; gap: 3px; }
.pm-stk { display: inline-flex; align-items: baseline; gap: 2px; padding: 1px 5px; border: 1px solid var(--line-2); border-radius: 4px;
  background: var(--card); font-size: 12px; line-height: 17px; color: var(--ink); cursor: default; }
.pm-stk b { font-weight: 500; }
.pm-tier.is-high .pm-stk b { font-weight: 700; }
.pm-stk small { color: var(--faint); font-size: 10px; }
.pm-stk.is-recent { background: var(--teal-bg); border-color: var(--teal-bg); }
.pm-reason { font-style: normal; color: var(--muted); font-size: 10.5px; margin-left: 2px; }
.pm-form { font-style: normal; font-size: 10px; line-height: 14px; padding: 0 3px; border-radius: 3px; margin-right: 1px; }
.pm-form.is-yizi { background: var(--up); color: #fff; }
.pm-form.is-tzi { background: var(--warn-bg); color: var(--warn); border: 1px solid var(--warn); }

@media (max-width: 640px) {
  .pm-grid { grid-template-columns: minmax(0, 1fr); }

}

/* 盘中实况 */
.pm-live { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 6px 0 2px; font-size: 12.5px; color: var(--ink-2); }
.pm-live-state { display: inline-flex; align-items: center; gap: 4px; }
.pm-live-state::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--faint); }
.pm-live-state.is-on::before { background: var(--up); animation: pm-blink 1.6s ease-in-out infinite; }
.pm-live-count b { font-weight: 600; color: var(--ink); }
.pm-live-count .pm-c-sealed { color: var(--up); }
.pm-alert { border: 1px solid var(--line); background: var(--card); color: var(--ink-2); border-radius: 5px; padding: 1px 8px; font-size: 12px; cursor: pointer; }
.pm-alert[aria-pressed="true"] { border-color: var(--up); color: var(--up); background: var(--up-bg); }
.pm-alert:focus-visible { outline: 2px solid var(--teal); }
.pm-live-tip { color: var(--warn); font-size: 11.5px; }
.pm-feed { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 3px 12px; font-size: 12px; color: var(--ink-2); }
.pm-feed time { color: var(--faint); margin-right: 4px; font-variant-numeric: tabular-nums; }
.pm-feed b { color: var(--up); font-weight: 600; }
.pm-feed li.is-broken b { color: var(--warn); }
.pm-feed span { color: var(--muted); margin-left: 3px; font-size: 11px; }
.pm-hit { display: block; font-style: normal; color: var(--up); font-weight: 600; line-height: 12px; }
.pm-card-hit { margin-left: 6px; font-size: 11.5px; color: var(--up); font-weight: 600; white-space: nowrap; }
.pm-stk .pm-pct { color: var(--muted); font-variant-numeric: tabular-nums; }
.pm-stk.is-sealed { background: var(--up); border-color: var(--up); color: #fff; }
.pm-stk.is-sealed small, .pm-stk.is-sealed .pm-reason { color: rgba(255, 255, 255, .85); }
.pm-stk.is-sealed .pm-form.is-yizi { background: #fff; color: var(--up); }
.pm-stk.is-broken { border-color: var(--warn); box-shadow: 0 0 0 1px var(--warn) inset; }
.pm-stk.is-broken .pm-pct { color: var(--warn); }
.pm-stk.is-near { background: var(--up-bg); border-color: var(--up); }
.pm-stk.is-near .pm-pct { color: var(--up); }
.pm-stk.is-dt .pm-pct, .pm-stk.is-dt b { color: var(--down); }
.pm-stk.is-flash { animation: pm-flash 1s ease-in-out 3; }
@keyframes pm-blink { 50% { opacity: .3; } }
@keyframes pm-flash { 50% { box-shadow: 0 0 0 3px var(--warn); } }
@media (prefers-reduced-motion: reduce) { .pm-stk.is-flash, .pm-live-state.is-on::before { animation: none; } }
.pm-kinds { display: inline-flex; align-items: center; gap: 2px 8px; flex-wrap: wrap; color: var(--muted); font-size: 12px; }
.pm-kinds label { display: inline-flex; align-items: center; gap: 2px; color: var(--ink-2); cursor: pointer; }
.pm-feed li.is-near b { color: var(--ink); }