/* ============================================================================================================================
 * WINDOWS 98 FINISH — a paint-only layer, loaded LAST (see docs/VIRUS-VISUAL-REFIT.md).
 *
 * RULE: nothing in this file may change the size, position, stacking, opening, closing or behaviour of any window or popup, nor the
 * layout of anything that lives inside them. Only paint is touched: box-shadow, background, colour, text-shadow, cursor, scrollbars and
 * absolutely positioned decorations. Padding is used ONLY on <img> icons together with box-sizing:border-box so the icon BOX stays the same
 * and only the drawn pixels snap to an integer multiple (16 / 32 / 48) of the 16x16 source. tests/virus-geometry.test.ts enforces the rule
 * against a golden capture of every window and popup at six widths.
 * ========================================================================================================================== */

:root {
  /* the real Windows 98 greys (face #c0c0c0, light #dfdfdf, shadow #808080, dark #0a0a0a) */
  --ui-face: #c0c0c0;
  --ui-hi: #dfdfdf;
  --ui-shadow: #808080;
  --ui-dark: #0a0a0a;
  /* window / menu frame: outer light grey + inner white on top-left, black + dark grey on bottom-right */
  --bevel-win: inset -1px -1px #0a0a0a, inset 1px 1px #dfdfdf, inset -2px -2px #808080, inset 2px 2px #fff;
  /* pressed push button: the sunken edge is black outside, grey inside (a field is the opposite: --bevel-in) */
  --bevel-press: inset -1px -1px #fff, inset 1px 1px #0a0a0a, inset -2px -2px #dfdfdf, inset 2px 2px #808080;
  --bevel-thin-in: inset 1px 1px #808080, inset -1px -1px #fff;
  --dither: repeating-conic-gradient(#c0c0c0 0 25%, #fff 0 50%) 0 0 / 2px 2px;
  --cur-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='18' viewBox='0 0 12 18' shape-rendering='crispEdges'%3E%3Crect x='0' y='0' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='1' width='2' height='1' fill='%23000000'/%3E%3Crect x='0' y='2' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='2' width='1' height='1' fill='%23ffffff'/%3E%3Crect x='2' y='2' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='3' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='3' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='3' y='3' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='4' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='4' width='3' height='1' fill='%23ffffff'/%3E%3Crect x='4' y='4' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='5' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='5' width='4' height='1' fill='%23ffffff'/%3E%3Crect x='5' y='5' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='6' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='6' width='5' height='1' fill='%23ffffff'/%3E%3Crect x='6' y='6' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='7' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='7' width='6' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='7' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='8' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='8' width='7' height='1' fill='%23ffffff'/%3E%3Crect x='8' y='8' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='9' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='9' width='8' height='1' fill='%23ffffff'/%3E%3Crect x='9' y='9' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='10' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='10' width='9' height='1' fill='%23ffffff'/%3E%3Crect x='10' y='10' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='11' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='11' width='5' height='1' fill='%23ffffff'/%3E%3Crect x='6' y='11' width='6' height='1' fill='%23000000'/%3E%3Crect x='0' y='12' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='12' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='3' y='12' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='12' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='6' y='12' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='13' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='13' width='1' height='1' fill='%23ffffff'/%3E%3Crect x='2' y='13' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='13' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='13' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='13' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='14' width='2' height='1' fill='%23000000'/%3E%3Crect x='4' y='14' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='14' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='14' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='15' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='15' width='1' height='1' fill='%23000000'/%3E%3Crect x='6' y='15' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='8' y='15' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='16' width='1' height='1' fill='%23000000'/%3E%3Crect x='6' y='16' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='8' y='16' width='1' height='1' fill='%23000000'/%3E%3Crect x='6' y='17' width='2' height='1' fill='%23000000'/%3E%3C/svg%3E");
  --cur-hand: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='17' viewBox='0 0 15 17' shape-rendering='crispEdges'%3E%3Crect x='5' y='0' width='2' height='1' fill='%23000000'/%3E%3Crect x='4' y='1' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='1' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='1' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='2' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='2' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='2' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='3' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='3' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='3' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='4' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='4' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='4' width='3' height='1' fill='%23000000'/%3E%3Crect x='4' y='5' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='5' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='5' width='1' height='1' fill='%23000000'/%3E%3Crect x='8' y='5' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='10' y='5' width='3' height='1' fill='%23000000'/%3E%3Crect x='1' y='6' width='2' height='1' fill='%23000000'/%3E%3Crect x='4' y='6' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='6' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='6' width='1' height='1' fill='%23000000'/%3E%3Crect x='8' y='6' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='10' y='6' width='1' height='1' fill='%23000000'/%3E%3Crect x='11' y='6' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='13' y='6' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='7' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='7' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='3' y='7' width='2' height='1' fill='%23000000'/%3E%3Crect x='5' y='7' width='6' height='1' fill='%23ffffff'/%3E%3Crect x='11' y='7' width='1' height='1' fill='%23000000'/%3E%3Crect x='12' y='7' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='14' y='7' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='8' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='8' width='3' height='1' fill='%23ffffff'/%3E%3Crect x='4' y='8' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='8' width='9' height='1' fill='%23ffffff'/%3E%3Crect x='14' y='8' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='9' width='1' height='1' fill='%23000000'/%3E%3Crect x='2' y='9' width='12' height='1' fill='%23ffffff'/%3E%3Crect x='14' y='9' width='1' height='1' fill='%23000000'/%3E%3Crect x='2' y='10' width='1' height='1' fill='%23000000'/%3E%3Crect x='3' y='10' width='11' height='1' fill='%23ffffff'/%3E%3Crect x='14' y='10' width='1' height='1' fill='%23000000'/%3E%3Crect x='2' y='11' width='1' height='1' fill='%23000000'/%3E%3Crect x='3' y='11' width='11' height='1' fill='%23ffffff'/%3E%3Crect x='14' y='11' width='1' height='1' fill='%23000000'/%3E%3Crect x='3' y='12' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='12' width='9' height='1' fill='%23ffffff'/%3E%3Crect x='13' y='12' width='1' height='1' fill='%23000000'/%3E%3Crect x='3' y='13' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='13' width='9' height='1' fill='%23ffffff'/%3E%3Crect x='13' y='13' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='14' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='14' width='7' height='1' fill='%23ffffff'/%3E%3Crect x='12' y='14' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='15' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='15' width='7' height='1' fill='%23ffffff'/%3E%3Crect x='12' y='15' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='16' width='9' height='1' fill='%23000000'/%3E%3C/svg%3E");
  --cur-wait: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='15' viewBox='0 0 13 15' shape-rendering='crispEdges'%3E%3Crect x='0' y='0' width='13' height='1' fill='%23000000'/%3E%3Crect x='0' y='1' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='1' width='11' height='1' fill='%23ffffff'/%3E%3Crect x='12' y='1' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='2' width='1' height='1' fill='%23000000'/%3E%3Crect x='2' y='2' width='9' height='1' fill='%23ffffff'/%3E%3Crect x='11' y='2' width='1' height='1' fill='%23000000'/%3E%3Crect x='2' y='3' width='1' height='1' fill='%23000000'/%3E%3Crect x='3' y='3' width='7' height='1' fill='%23ffffff'/%3E%3Crect x='10' y='3' width='1' height='1' fill='%23000000'/%3E%3Crect x='3' y='4' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='4' width='5' height='1' fill='%23ffffff'/%3E%3Crect x='9' y='4' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='5' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='5' width='3' height='1' fill='%23ffffff'/%3E%3Crect x='8' y='5' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='6' width='1' height='1' fill='%23000000'/%3E%3Crect x='6' y='6' width='1' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='6' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='7' width='1' height='1' fill='%23000000'/%3E%3Crect x='6' y='7' width='1' height='1' fill='%23ffffff'/%3E%3Crect x='7' y='7' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='8' width='1' height='1' fill='%23000000'/%3E%3Crect x='5' y='8' width='3' height='1' fill='%23ffffff'/%3E%3Crect x='8' y='8' width='1' height='1' fill='%23000000'/%3E%3Crect x='3' y='9' width='1' height='1' fill='%23000000'/%3E%3Crect x='4' y='9' width='1' height='1' fill='%23ffffff'/%3E%3Crect x='5' y='9' width='3' height='1' fill='%23000000'/%3E%3Crect x='8' y='9' width='1' height='1' fill='%23ffffff'/%3E%3Crect x='9' y='9' width='1' height='1' fill='%23000000'/%3E%3Crect x='2' y='10' width='1' height='1' fill='%23000000'/%3E%3Crect x='3' y='10' width='1' height='1' fill='%23ffffff'/%3E%3Crect x='4' y='10' width='5' height='1' fill='%23000000'/%3E%3Crect x='9' y='10' width='1' height='1' fill='%23ffffff'/%3E%3Crect x='10' y='10' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='11' width='1' height='1' fill='%23000000'/%3E%3Crect x='2' y='11' width='1' height='1' fill='%23ffffff'/%3E%3Crect x='3' y='11' width='7' height='1' fill='%23000000'/%3E%3Crect x='10' y='11' width='1' height='1' fill='%23ffffff'/%3E%3Crect x='11' y='11' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='12' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='12' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='3' y='12' width='7' height='1' fill='%23000000'/%3E%3Crect x='10' y='12' width='2' height='1' fill='%23ffffff'/%3E%3Crect x='12' y='12' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='13' width='1' height='1' fill='%23000000'/%3E%3Crect x='1' y='13' width='11' height='1' fill='%23ffffff'/%3E%3Crect x='12' y='13' width='1' height='1' fill='%23000000'/%3E%3Crect x='0' y='14' width='13' height='1' fill='%23000000'/%3E%3C/svg%3E");
}

/* ---------- selection, like the system highlight ---------- */
::selection { background: var(--title-a); color: #fff; }
.screen ::selection, .screen::selection { background: var(--phosphor); color: #000; }

/* ---------- frames: windows, popups, monitor gadget, menus, page windows ---------- */
.win { box-shadow: var(--bevel-win), 6px 8px 0 rgba(0, 0, 0, .35); }
.hud { box-shadow: var(--bevel-win), 6px 8px 0 rgba(0, 0, 0, .3); }
.startmenu { box-shadow: var(--bevel-win), 4px 4px 0 rgba(0, 0, 0, .35); }
.sec-win { box-shadow: var(--bevel-win), 10px 12px 0 rgba(0, 0, 0, .55); }
.pagenav { box-shadow: var(--bevel-win), 0 4px 0 rgba(0, 0, 0, .4); }

/* ---------- title bars ---------- */
.win:not(.active):not(.popup) .win-title { background: linear-gradient(90deg, #808080, #c0c0c0); color: #d8d8d8; }
.win-title h2 { text-shadow: none; }

/* ---------- push buttons: authentic pressed edge, no hover tint (a real Win98 button does not react to hover) ---------- */
.btn { background: var(--ui-face); }
.btn:hover { background: var(--ui-face); }
.btn:active, .btn[aria-pressed="true"], .btn.pressed { box-shadow: var(--bevel-press); background: var(--ui-face); }
.btn-feed { background: color-mix(in srgb, var(--accent) 55%, var(--ui-face)); }
.btn-feed:hover { background: color-mix(in srgb, var(--accent) 70%, var(--ui-face)); }
.btn:disabled, .btn[aria-disabled="true"] { color: #808080; text-shadow: 1px 1px 0 #fff; }
.btn:disabled:active, .btn[aria-disabled="true"]:active { box-shadow: var(--bevel-out); }
.btn-feed:active { box-shadow: var(--bevel-press); }
/* the window currently on top is the pressed, dithered button of the task bar */
.task[aria-pressed="true"] { background: var(--dither); box-shadow: var(--bevel-press); }

/* ---------- window controls: crisp pixel glyphs (same 24x22 / 34x30 boxes as before) ---------- */
.wc::before, .wc::after { display: none; }
.wc { background-color: var(--ui-face); background-repeat: no-repeat; background-position: 0 0; background-size: 24px 22px; }
.wc:active { background-position: 1px 1px; }
.wc-min { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='22' viewBox='0 0 24 22' shape-rendering='crispEdges'%3E%3Crect x='9' y='14' width='6' height='2' fill='%230a0a0a'/%3E%3C/svg%3E"); }
.wc-max { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='22' viewBox='0 0 24 22' shape-rendering='crispEdges'%3E%3Crect x='7' y='5' width='9' height='2' fill='%230a0a0a'/%3E%3Crect x='7' y='7' width='1' height='7' fill='%230a0a0a'/%3E%3Crect x='15' y='7' width='1' height='7' fill='%230a0a0a'/%3E%3Crect x='7' y='13' width='9' height='1' fill='%230a0a0a'/%3E%3C/svg%3E"); }
.wc-close { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='22' viewBox='0 0 24 22' shape-rendering='crispEdges'%3E%3Crect x='8' y='7' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='9' y='7' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='14' y='7' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='15' y='7' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='9' y='8' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='10' y='8' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='13' y='8' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='14' y='8' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='10' y='9' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='11' y='9' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='12' y='9' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='13' y='9' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='11' y='10' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='12' y='10' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='10' y='11' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='11' y='11' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='12' y='11' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='13' y='11' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='9' y='12' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='10' y='12' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='13' y='12' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='14' y='12' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='8' y='13' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='9' y='13' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='14' y='13' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='15' y='13' width='1' height='1' fill='%230a0a0a'/%3E%3C/svg%3E"); }
@media (max-width: 699px) {
  .wc { background-size: 34px 30px; }
  .wc:active { background-position: 2px 2px; }
  .wc-min { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='30' viewBox='0 0 34 30' shape-rendering='crispEdges'%3E%3Crect x='11' y='19' width='12' height='4' fill='%230a0a0a'/%3E%3C/svg%3E"); }
  .wc-max { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='30' viewBox='0 0 34 30' shape-rendering='crispEdges'%3E%3Crect x='8' y='6' width='18' height='4' fill='%230a0a0a'/%3E%3Crect x='8' y='10' width='2' height='14' fill='%230a0a0a'/%3E%3Crect x='24' y='10' width='2' height='14' fill='%230a0a0a'/%3E%3Crect x='8' y='22' width='18' height='2' fill='%230a0a0a'/%3E%3C/svg%3E"); }
  .wc-close { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='30' viewBox='0 0 34 30' shape-rendering='crispEdges'%3E%3Crect x='9' y='8' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='11' y='8' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='21' y='8' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='23' y='8' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='11' y='10' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='13' y='10' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='19' y='10' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='21' y='10' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='13' y='12' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='15' y='12' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='17' y='12' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='19' y='12' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='15' y='14' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='17' y='14' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='13' y='16' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='15' y='16' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='17' y='16' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='19' y='16' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='11' y='18' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='13' y='18' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='19' y='18' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='21' y='18' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='9' y='20' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='11' y='20' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='21' y='20' width='2' height='2' fill='%230a0a0a'/%3E%3Crect x='23' y='20' width='2' height='2' fill='%230a0a0a'/%3E%3C/svg%3E"); }
}

/* ---------- task bar, start button, notification area ---------- */
.taskbar { background: var(--ui-face); box-shadow: inset 0 1px #dfdfdf, inset 0 2px #fff; }
.start-btn { position: relative; }
/* the two etched grips that separate the Start button from the task area (they sit in the existing 4px gap: nothing moves) */
.start-btn::after { content: ''; position: absolute; right: -5px; top: 1px; bottom: 1px; width: 3px; box-shadow: inset 1px 0 #808080, inset -1px 0 #fff; pointer-events: none; }
.tray { box-shadow: var(--bevel-thin-in); }
.tray-btn:hover { background: none; }
.sm-sep { box-shadow: inset 0 1px #808080, inset 0 -1px #fff; }

/* ---------- Start menu: 32px icons (2x), row height unchanged (2 + 32 + 2 = 36) ---------- */
.sm-item { padding-top: 2px; padding-bottom: 2px; }
.sm-item img { width: 32px; height: 32px; }

/* ---------- integer-scale icons: the box keeps its size, the drawn pixels snap to 16 / 32 / 48 ---------- */
.btn img, .win-title img, .hud-title img, .tray-btn img, .tk-link img, .sec-win > .win-title img { box-sizing: border-box; }
.btn img { padding: 2px; }
.win-title img, .hud-title img, .tray-btn img { padding: 1px; }
.start-btn img { box-sizing: border-box; padding: 3px; }
.sec-win > .win-title img, .tk-link img { padding: 3px; }
.q-list img { box-sizing: border-box; padding: 4px; }
.icon img { box-sizing: border-box; padding: 4px; }
.ex-item img { box-sizing: border-box; padding: 2px; }
.task img { padding: 0; } /* already 16px: undo the generic .btn img padding */
.task img, .popup-icon, .q-head img, .food img, .how img { box-sizing: border-box; }
@media (max-width: 699px) {
  .icon img { padding: 1px; }
  .how img { padding: 4px; }
}

/* ---------- progress bars: legible text on any stripe colour (hard 1px outline, pixel style) ---------- */
.meter > span { text-shadow: -1px -1px 0 #fff, 0 -1px 0 #fff, 1px -1px 0 #fff, -1px 0 0 #fff, 1px 0 0 #fff, -1px 1px 0 #fff, 0 1px 0 #fff, 1px 1px 0 #fff; }

/* ---------- Mutation Lab: equal-height cards, readable CURRENT badge ---------- */
.lab-grid > li { display: flex; }
.lab-card { flex: 1; align-content: start; }
.lab-card.current .lc-state { background: var(--accent); color: #000; padding: 0 6px; }
.lab-card.locked .lc-state { color: #ff7a7a; }

/* ---------- corruption map legend: each swatch stays with its word ---------- */
.legend > span { white-space: nowrap; }

/* ---------- classic pointers on desktop pointing devices ---------- */
@media (pointer: fine) {
  html { cursor: var(--cur-arrow) 0 0, default; }
  button, a[href], [role="button"], summary, label, select, .icon, .ex-item, .sm-item, .lab-card, .virus-hit, .tray-btn, .scroll-cue, .boot { cursor: var(--cur-hand) 5 0, pointer; }
  button:disabled, [aria-disabled="true"], .tk-link.is-soon { cursor: var(--cur-arrow) 0 0, default; }
  .desktop .win-title { cursor: var(--cur-arrow) 0 0, default; }
  .desktop.mutating, .desktop.mutating * { cursor: var(--cur-wait) 6 7, wait !important; }
}

/* ---------- Windows 98 scroll bars on engines that allow it (inside windows and lists only; the page scroll bar is left alone) ---------- */
/* (standard scrollbar-color would disable the ::-webkit-scrollbar styling in Chromium, so it is offered to Firefox only) */
@supports not selector(::-webkit-scrollbar) { .win-body, .log-list, .q-list, .sm-items, .ex-list { scrollbar-color: #808080 #e4e4e4; } }
.win-body::-webkit-scrollbar, .log-list::-webkit-scrollbar, .q-list::-webkit-scrollbar, .sm-items::-webkit-scrollbar, .ex-list::-webkit-scrollbar { width: 16px; height: 16px; }
.win-body::-webkit-scrollbar-track, .log-list::-webkit-scrollbar-track, .q-list::-webkit-scrollbar-track, .sm-items::-webkit-scrollbar-track, .ex-list::-webkit-scrollbar-track { background: var(--dither); }
.win-body::-webkit-scrollbar-thumb, .log-list::-webkit-scrollbar-thumb, .q-list::-webkit-scrollbar-thumb, .sm-items::-webkit-scrollbar-thumb, .ex-list::-webkit-scrollbar-thumb { background: #c0c0c0; box-shadow: var(--bevel-out); }
.win-body::-webkit-scrollbar-corner, .log-list::-webkit-scrollbar-corner, .q-list::-webkit-scrollbar-corner, .sm-items::-webkit-scrollbar-corner, .ex-list::-webkit-scrollbar-corner { background: #c0c0c0; }
.win-body::-webkit-scrollbar-button:single-button, .log-list::-webkit-scrollbar-button:single-button, .q-list::-webkit-scrollbar-button:single-button, .sm-items::-webkit-scrollbar-button:single-button, .ex-list::-webkit-scrollbar-button:single-button {
  display: block; width: 16px; height: 16px; background-color: #c0c0c0; box-shadow: var(--bevel-out); background-repeat: no-repeat; background-position: center;
}
.win-body::-webkit-scrollbar-button:single-button:vertical:decrement, .log-list::-webkit-scrollbar-button:single-button:vertical:decrement, .q-list::-webkit-scrollbar-button:single-button:vertical:decrement, .sm-items::-webkit-scrollbar-button:single-button:vertical:decrement, .ex-list::-webkit-scrollbar-button:single-button:vertical:decrement { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' shape-rendering='crispEdges'%3E%3Crect x='7' y='6' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='6' y='7' width='3' height='1' fill='%230a0a0a'/%3E%3Crect x='5' y='8' width='5' height='1' fill='%230a0a0a'/%3E%3Crect x='4' y='9' width='7' height='1' fill='%230a0a0a'/%3E%3C/svg%3E"); }
.win-body::-webkit-scrollbar-button:single-button:vertical:increment, .log-list::-webkit-scrollbar-button:single-button:vertical:increment, .q-list::-webkit-scrollbar-button:single-button:vertical:increment, .sm-items::-webkit-scrollbar-button:single-button:vertical:increment, .ex-list::-webkit-scrollbar-button:single-button:vertical:increment { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' shape-rendering='crispEdges'%3E%3Crect x='4' y='6' width='7' height='1' fill='%230a0a0a'/%3E%3Crect x='5' y='7' width='5' height='1' fill='%230a0a0a'/%3E%3Crect x='6' y='8' width='3' height='1' fill='%230a0a0a'/%3E%3Crect x='7' y='9' width='1' height='1' fill='%230a0a0a'/%3E%3C/svg%3E"); }
.win-body::-webkit-scrollbar-button:single-button:horizontal:decrement, .log-list::-webkit-scrollbar-button:single-button:horizontal:decrement, .q-list::-webkit-scrollbar-button:single-button:horizontal:decrement, .sm-items::-webkit-scrollbar-button:single-button:horizontal:decrement, .ex-list::-webkit-scrollbar-button:single-button:horizontal:decrement { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' shape-rendering='crispEdges'%3E%3Crect x='8' y='4' width='1' height='7' fill='%230a0a0a'/%3E%3Crect x='7' y='5' width='1' height='5' fill='%230a0a0a'/%3E%3Crect x='6' y='6' width='1' height='3' fill='%230a0a0a'/%3E%3Crect x='5' y='7' width='1' height='1' fill='%230a0a0a'/%3E%3C/svg%3E"); }
.win-body::-webkit-scrollbar-button:single-button:horizontal:increment, .log-list::-webkit-scrollbar-button:single-button:horizontal:increment, .q-list::-webkit-scrollbar-button:single-button:horizontal:increment, .sm-items::-webkit-scrollbar-button:single-button:horizontal:increment, .ex-list::-webkit-scrollbar-button:single-button:horizontal:increment { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' shape-rendering='crispEdges'%3E%3Crect x='9' y='7' width='1' height='1' fill='%230a0a0a'/%3E%3Crect x='8' y='6' width='1' height='3' fill='%230a0a0a'/%3E%3Crect x='7' y='5' width='1' height='5' fill='%230a0a0a'/%3E%3Crect x='6' y='4' width='1' height='7' fill='%230a0a0a'/%3E%3C/svg%3E"); }