/* On-Screen Keyboard demo app — measured on win2k-pro_window_on-screen-keyboard.png (client origin (3, 22)). */
.osk { position: relative; flex: 1; }
.osk > .osk__menu { position: absolute; left: 0; top: -1px; right: 0; }
.osk > .osk__keys { position: absolute; left: 0; right: 0; top: 19px; bottom: 0; background: var(--color-osk-background); }   /* allow: the on-screen keyboard: a one-off control */
.osk__key {   /* allow: the on-screen keyboard: a one-off control */
  position: absolute;
  margin: 0;
  border: 0;
  padding: 0;
  /* The key colour on two overlapping strips: each corner pixel is left out (no anti-aliased clipping). */
  --key: var(--color-control-face);
  background: linear-gradient(var(--key), var(--key)) 1px 0 / calc(100% - 2px) 100% no-repeat, linear-gradient(var(--key), var(--key)) 0 1px / 100% calc(100% - 2px) no-repeat;
  color: var(--sys-btn-text);
  font: var(--font-dialog);
  letter-spacing: 1px;
  text-shadow: 1px 0 0 currentColor;   /* GDI's synthesized bold */
  white-space: pre;
  outline: none;
  cursor: inherit;
}
.osk__key--mod { --key: var(--sys-btn-shadow); color: var(--color-control-face); }   /* allow: the on-screen keyboard: a one-off control */
.osk__key > span { position: absolute; line-height: 13px; }
.osk__key--img > img { position: absolute; left: 0; top: 0; }
.osk__key:active { filter: invert(1); }   /* pressed: osk inverts the key (knowledge) */   /* allow: the on-screen keyboard: a one-off control */