@font-face {
    font-family: "Inter";
    src: url("../../fonts/vendor/inter/4.0/InterVariable.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "JetBrains Mono";
    src: url("../../fonts/vendor/jetbrains-mono/2.304/JetBrainsMono-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "JetBrains Mono";
    src: url("../../fonts/vendor/jetbrains-mono/2.304/JetBrainsMono-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    color-scheme: light;
}

:root[data-theme="dark"] {
    color-scheme: dark;
}

html {
    font-family: var(--am-font-family-sans);
    background-color: var(--am-color-background);
}

body {
    margin: 0;
    background-color: var(--am-color-background);
    color: var(--am-color-text);
    font-family: var(--am-font-family-sans);
    font-size: var(--am-font-size-body);
    line-height: var(--am-line-height-normal);
    overflow-wrap: break-word;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--am-color-text);
    font-weight: var(--am-font-weight-semibold);
    line-height: var(--am-line-height-tight);
}

h1 {
    font-size: var(--am-font-size-page-title);
}

h2 {
    font-size: var(--am-font-size-section-title);
}

h3 {
    font-size: var(--am-font-size-card-title);
}

a {
    color: var(--am-color-primary-strong);
}

code,
pre,
kbd {
    font-family: var(--am-font-family-mono);
    font-size: var(--am-font-size-interface);
    font-variant-ligatures: none;
}

:focus-visible {
    outline: var(--am-size-focus-ring) solid var(--am-color-focus-ring);
    outline-offset: var(--am-space-1);
}

.am-icon {
    width: var(--am-size-icon);
    height: var(--am-size-icon);
    fill: currentColor;
    flex-shrink: 0;
}

.am-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.am-color-mode-switch {
    display: inline-flex;
    gap: var(--am-space-1);
}

.am-color-mode-switch button[aria-checked="true"] {
    background-color: var(--am-color-primary-soft);
    border-color: var(--am-color-primary);
    color: var(--am-color-primary-strong);
}

[x-cloak] {
    display: none !important;
}

.am-field-label {
    display: block;
    margin-bottom: var(--am-space-1);
    font-weight: var(--am-font-weight-medium);
}

.am-text-page-title {
    font-size: var(--am-font-size-page-title);
    font-weight: var(--am-font-weight-semibold);
}

.am-text-section-title {
    font-size: var(--am-font-size-section-title);
    font-weight: var(--am-font-weight-semibold);
}

.am-text-card-title {
    font-size: var(--am-font-size-card-title);
    font-weight: var(--am-font-weight-semibold);
}

.am-text-body {
    font-size: var(--am-font-size-body);
    font-weight: var(--am-font-weight-regular);
}

.am-text-interface {
    font-size: var(--am-font-size-interface);
    font-weight: var(--am-font-weight-regular);
}

.am-text-table-header {
    font-size: var(--am-font-size-meta);
    font-weight: var(--am-font-weight-semibold);
}

.am-text-meta {
    font-size: var(--am-font-size-meta);
    font-weight: var(--am-font-weight-medium);
}