@use "normalize";
@use "utility";
@use "typography";
@use "transitions";

* {
  box-sizing: border-box;
}

body {
  @include txt-i('body');

  font-family: var(--body-font-family, "Onest", sans-serif);
  color: $clr-black;
  background-color: $clr-grey-100;
}

html body .os-small-theme {
  --os-size: 6px;
  --os-handle-bg: #{$clr-cyan-500};
  --os-handle-bg-hover: #{$clr-cyan-400};
  --os-handle-bg-active: #{$clr-cyan-600};
  --os-handle-border-radius: 2px;
  --os-padding-axis: 12px 4px;
  --os-padding-perpendicular: 12px 0;
}