/* ── war：戰情室標題列、五個分區、錢區的四格合計、範例資料提示 ── */
.sample-banner{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-4);align-items:baseline;background:var(--warn-bg);color:var(--warn-ink);border:1.5px solid var(--warn);
  border-radius:var(--r-md);padding:var(--sp-4) var(--sp-6);font-size:var(--fs-sm);margin-bottom:var(--sp-6)}
.sample-banner b{font-weight:900;flex:0 0 auto}
.sample-banner span{color:var(--ink-2)}
.demo-tag{display:inline-block;background:var(--warn-bg);color:var(--warn-ink);border:1px solid var(--warn);border-radius:4px;
  padding:0 var(--sp-2);font-size:var(--fs-cap);font-weight:700;line-height:var(--lh-tight);vertical-align:1px;margin-left:var(--sp-2);white-space:nowrap}

.wrhead{display:flex;align-items:center;gap:var(--sp-3) var(--sp-5);flex-wrap:wrap;margin-bottom:var(--sp-5)}
.wrhead h1{margin:0;font-size:var(--fs-2xl);font-weight:900;letter-spacing:-.01em;line-height:var(--lh-tight)}
.wrhead .as{font-size:var(--fs-cap);color:var(--ink-3)}
.wr-tools{margin-left:auto;display:flex;gap:var(--sp-3)}
.wr-tools:empty{display:none}
.wrsec{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);margin-bottom:var(--sp-6);overflow:hidden}
.wrsec>h2{margin:0;font-size:var(--fs-sm);font-weight:800;letter-spacing:.06em;color:var(--ink-2);padding:var(--sp-5) var(--sp-7) var(--sp-4);
  display:flex;align-items:baseline;gap:var(--sp-1) var(--sp-4);flex-wrap:wrap;line-height:var(--lh-tight)}
.wrsec>h2 .why{font-weight:500;letter-spacing:0;font-size:var(--fs-cap);color:var(--ink-3)}
.wrsec>h2 .cnt{margin-left:auto;font-size:var(--fs-body);font-weight:800;color:var(--ink-2)}
.wrsec.hot{border-color:var(--you);border-width:1.5px}
.wrsec.hot>h2{color:var(--you)}
.wrsec.red{border-color:var(--bad)}
.wrsec.red>h2{color:var(--bad-ink)}
.wrempty{padding:var(--sp-1) var(--sp-7) var(--sp-6);font-size:var(--fs-sm);color:var(--ink-3)}
/* 一張卡一整列：卡片右邊放得下三個框（卡片內部怎麼分欄看 card.css） */
.secgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-5);padding:0 var(--sp-5) var(--sp-5)}
@media (max-width:420px){.secgrid{padding:0 var(--sp-3) var(--sp-3)}}

.mstrip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border-top:1px solid var(--line-2)}
@media (min-width:760px){.mstrip{grid-template-columns:repeat(4,minmax(0,1fr))}}
.mcell{background:var(--surface);padding:var(--sp-4) var(--sp-7)}
.mcell .k{display:block;margin:0 0 var(--sp-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--fs-cap);color:var(--ink-3);font-weight:700;letter-spacing:.02em}
.mcell .v{font-size:var(--fs-xl);font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:var(--lh-tight)}
.mcell .v small{font-size:var(--fs-cap);font-weight:500;color:var(--ink-3);margin-left:3px}
.mcell .v.up{color:var(--ok-ink)} .mcell .v.down{color:var(--bad-ink)}

.mcell .tbdnote{display:block;font-size:var(--fs-cap);color:var(--warn-ink);font-weight:700;line-height:var(--lh-tight);margin-top:2px}
.stage>.demo-tag:first-child,.stage>.todo-tag:first-child{margin-left:0}