/* Sets global design token for those using this independently */
:root {
  --k-font-family-sans: "SkattaSansUI-demo", "SkattaSansUI-fallback", system-ui, sans-serif;
}

/* Custom fallback font based on a local font
   See: https://arielsalminen.com/2025/optimizing-webfont-performance/ */
@font-face {
  font-family: SkattaSansUI-fallback;
  size-adjust: 102%;
  ascent-override: 90%;
  src: local("system-ui");
}

/* Rest of the imports */
@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-Regular.woff2") format("woff2"),
    url("SkattaSansUI_TT-Regular.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-RegularItalic.woff2") format("woff2"),
    url("SkattaSansUI_TT-RegularItalic.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-Medium.woff2") format("woff2"),
    url("SkattaSansUI_TT-Medium.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-MediumItalic.woff2") format("woff2"),
    url("SkattaSansUI_TT-MediumItalic.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-Bold.woff2") format("woff2"),
    url("SkattaSansUI_TT-Bold.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-Black.woff2") format("woff2"),
    url("SkattaSansUI_TT-Black.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 700;
  font-stretch: condensed;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-BoldNarrow.woff2") format("woff2"),
    url("SkattaSansUI_TT-BoldNarrow.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 900;
  font-stretch: condensed;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-BlackNarrow.woff2") format("woff2"),
    url("SkattaSansUI_TT-BlackNarrow.woff") format("woff");
}