:root {
  --css-dimensions-border-radius: 7px;
  --css-dimensions-border-radius-circle: 50px;
  --css-dimensions-item-avatar-border-radius: 7px;
  --css-dimensions-button-widest: 256px;
  --css-dimensions-webview-height: 800px;
  --css-dimensions-webview-padding-top: 64px;
  --css-dimensions-webview-padding-bottom: 128px;
  --css-dimensions-webview-width: 360px;
  --css-dimensions-webview-padding-left: 20px;
  --css-dimensions-webview-padding-right: 20px;
  --css-dimensions-textarea-min-height: 176px;
  --css-dimensions-drawer-max-height: 640px;
  --css-dimensions-sections-space-between: 32px;
  --css-dimensions-buttons-space-beetwen: 16px;

  --css-gap-4: 4px;
  --css-gap-8: 8px;
  --css-gap-16: clamp(16px, calc(16px + 0.1dvw), 20px);
  --css-gap-24: clamp(24px, calc(24px + 0.4dvw), 28px);
  --css-gap-32: clamp(32px, calc(32px + 0.5dvw), 40px);
  --css-gap-64: clamp(64px, calc(64px + 0.6dvw), 72px);
  --css-gap-128: clamp(128px, calc(128px + 0.7dvw), 136px);

  --css-fs-base: 62.5%;
  --css-lh-base: 1.625;
  --css-fs-scale: 0.625;

  --css-fs-xxl: 5rem;
  --css-lh-xxl: 1.2;

  --css-fs-xl: 3rem;
  --css-lh-xl: normal;

  --css-fs-l: 2rem;
  --css-lh-l: normal;

  --css-fs-m: 1.6rem;
  --css-lh-m: normal;

  --css-fs-s: 1.4rem;
  --css-lh-s: 16px;

  --css-fs-xs: 1.2rem;
  --css-lh-xs: 16px;
}

/* Color values and theme aliases are generated from design-tokens/colors.json. */
body {
  --css-box-shadow: 0px 6px 24px 0px var(--color-background-card), 0px 0px 0px 1px var(--color-background-card);
  --css-box-shadow-hover: 0px 6px 24px 0px var(--color-background-card-interactive), 0px 0px 0px 1px var(--color-background-card-interactive);
}
