/* @import "./media.css";
@import "./theme.light.css"; */

/* @media (--OSdark) {
  :where(html) {
    color-scheme: dark; */

    /* --link: var(--indigo-3);
    --link-visited: var(--purple-3);

    --text-1: var(--gray-1);
    --text-2: var(--gray-4);

    --surface-1: var(--gray-9);
    --surface-2: var(--gray-8);
    --surface-3: var(--gray-7);
    --surface-4: var(--gray-6);

    --scrollthumb-color: var(--gray-6); */
  /* }
} */
/* --body-bg: linear-gradient(to bottom right, rgba(52, 166, 156, .20) 0%, 9.288299083709717%, rgba(56, 156, 156, .20) 18.576598167419434%, 24.849215149879456%, rgba(57, 145, 157, .20) 31.121832132339478%, 33.71531963348389%, rgba(58, 141, 159, .20) 36.308807134628296%, 47.16525971889496%, rgba(61, 124, 159, .20) 58.02171230316162%, 60.55488586425781%, rgba(62, 120, 158, .20) 63.088059425354004%, 71.04945778846741%, rgba(65, 104, 159, .20) 79.01085615158081%, 80.69963753223419%, rgba(67, 102, 160, .20) 82.38841891288757%, 85.58504283428192%, rgba(67, 95, 160, .20) 88.78166675567627%, 94.39083337783813%, rgba(70, 83, 161, .20) 100%); */
:where(body) {
  /* background */
  --body-bg: color-mix(in hsl, var(--teal-1), var(--grey-1) 60%);
  
  /* text */
  font-family: var(--font-sans);
  color: var(--body-text-color);
  accent-color: var(--accent);
  
  background-color: var(--body-bg);
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;

  height: 100%;
  margin: 0px;
  
  overflow: hidden;
  overscroll-behavior-block: none;

  --heading-text-size-h1: 32px;
  --heading-text-size-h2: 24px;
  --heading-text-size-h3: 22px;
  --heading-text-size-h4: 20px;
  --heading-text-size-h5: 18px;
  --heading-text-size-h6: 16px;

  --label-text-size-m: var(--sl-input-label-font-size-medium, 1rem);
  --label-text-size-s: var(--sl-input-label-font-size-small, .875rem);
  --label-text-color: var(--sl-input-label-color);

  @media (max-width: 800px) {
    --heading-text-size-h1: 24px;
    --heading-text-size-h2: 22px;
    --heading-text-size-h3: 20px;
    --heading-text-size-h4: 18px;
    --heading-text-size-h5: 16px;
    --heading-text-size-h6: 14px;
  }
}