/* The page: reset, type by role, what may be selected, focus, icons. */
* {
  box-sizing: border-box;
}
html,
body,
#root {
  height: 100%;
  margin: 0;
}
body {
  background: var(--canvas);
  color: var(--text);
  font:
    var(--fw-text) var(--fs-text) / 1.4 -apple-system,
    BlinkMacSystemFont,
    "SF Pro Text",
    "Segoe UI",
    Roboto,
    system-ui,
    sans-serif;
  -webkit-font-smoothing: antialiased;
}
p {
  margin: 0;
}
/* icons (icons.js): 16 px, 2 px strokes on whole pixels; never scaled */
.i {
  display: block;
  width: 16px;
  height: 16px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.label {
  color: var(--label);
}
/* text selection: none in the interface (titles, labels, buttons, menus), only in what is typed and in data someone
   may want to copy (sizes, prices, times, dates, measurements, file facts, error messages) */
body {
  -webkit-user-select: none;
  user-select: none;
}
input,
textarea,
[contenteditable],
.data,
.facts dd,
.row-value,
.option-value,
.option-detail,
.foot-out,
.view-shown,
.sec-aside,
.error-box,
.queue-error,
.queue-facts,
.toast > span {
  -webkit-user-select: text;
  user-select: text;
}
:is(.dropdown-menu, .menu, button, .btn, label.row) :is(.data, .option-value, .option-detail, .row-value) {
  -webkit-user-select: none;
  user-select: none;
}
.row.slider,
.row.slider * {
  -webkit-user-select: none;
  user-select: none;
} /* a drag that leaves the thumb never selects */
.data {
  color: var(--text);
  font-weight: var(--fw-text);
  font-variant-numeric: tabular-nums;
}
.warn {
  color: var(--warn);
}
.error {
  color: var(--error);
}
.spacer {
  flex: 1;
}
button,
select,
input,
textarea {
  font: inherit;
  color: inherit;
}
:is(:focus-visible, .is-focus) {
  outline: 2px solid var(--accent-hover);
  outline-offset: 1px;
}