/* Status bar — msctls_statusbar32 (INVENTORY T8; SPEC.md §4.20), measured on Volume Control (simple) and Task
   Manager (three parts, size grip). <div class="w2k-statusbar" [data-grip]><div class="w2k-statusbar__panel"
   style="width:96px">Processes: 19</div>…</div>; the last panel takes the rest. */
.w2k-statusbar {
  position: relative;
  display: flex;
  flex: none;
  gap: var(--metric-statusbar-panel-gap);
  box-sizing: border-box;
  height: var(--metric-statusbar-height);
  padding-top: calc(var(--metric-statusbar-height) - var(--metric-statusbar-panel-height));
  background: var(--color-surface);
  color: var(--sys-btn-text);
  font: var(--font-status);
}
.w2k-statusbar__panel {
  position: relative;
  flex: none;
  box-sizing: border-box;
  height: var(--metric-statusbar-panel-height);
  padding: var(--metric-statusbar-text-top) var(--metric-statusbar-text-left) 0;
  box-shadow: var(--edge-sunken-outer);
  overflow: hidden;
  white-space: pre;
  text-overflow: clip;
}
.w2k-statusbar__panel:last-of-type { flex: 1; }
/* A pane whose indicator is off (data-off — CAPS, NUM… in HyperTerminal): its text in GrayText. */
.w2k-statusbar__panel:where([data-off]) { color: var(--sys-gray-text); }
/* MFC's status bar (data-style="mfc" — CStatusBar: WordPad, Phone Dialer; measured): 18px, the panes 2px down and 16px
   tall, their text 1px down; the first pane stretches unframed (SBPS_STRETCH | SBPS_NOBORDERS). */
.w2k-statusbar:where([data-style="mfc"]) { height: 18px; padding-top: 2px; }
:where(.w2k-statusbar[data-style="mfc"]) > .w2k-statusbar__panel { height: 16px; padding-top: 1px; }
:where(.w2k-statusbar[data-style="mfc"]) > .w2k-statusbar__panel:first-child { flex: 1; box-shadow: none; }
.w2k-statusbar__panel > img { position: absolute; left: var(--metric-statusbar-text-left); top: 1px; width: 16px; height: 16px; }
.w2k-statusbar__panel > img + span { margin-left: 18px; }
/* Size grip: a 13×13 ButtonFace square at the corner (it cuts the last panel's edge) with the Marlett grip drawn
   in a 16×16 cell ending 1px inside the corner (measured). */
.w2k-statusbar__grip {
  position: absolute;
  right: 0;
  bottom: 0;
  width: var(--metric-statusbar-grip);
  height: var(--metric-statusbar-grip);
  background: var(--color-surface);
  cursor: var(--cursor-diagonal-resize-1, nwse-resize);
}
.w2k-statusbar__grip::before, .w2k-statusbar__grip::after {
  position: absolute;
  left: calc(var(--metric-statusbar-grip) - 1px - var(--metric-scrollbar-size) + var(--metric-sizegrip-glyph-left));
  top: calc(var(--metric-statusbar-grip) - 1px - var(--metric-scrollbar-size) + var(--metric-sizegrip-glyph-top));
  font: var(--font-glyph-grip);
  white-space: pre;
}
.w2k-statusbar__grip::before { content: "o"; color: var(--sys-btn-hilight); }
.w2k-statusbar__grip::after { content: "p"; color: var(--sys-btn-shadow); }
