/* Tema KAPITAL Platforme — tokeni i sloj preko Bootstrap-a.

   Zivi u Shared (PLAN §4.1: "layout, znacke, tema, pomocnici"), pa je ista za Web danas i za Web.Client sutra.
   Ucitava se POSLE bootstrap.min.css: ne menja Bootstrap, nego mu zadaje promenljive i doteruje komponente, tako da
   postojece stranice (btn, form-control, alert, badge, table) dobijaju izgled bez izmene markupa.

   Boje su odluka od 20.09.2026: tamna #33424F i narandzasta #FF6800 / #FF8E40.
   ⚠️ Belo slovo na #FF6800 ima kontrast 2.9:1, a #33424F na njoj 3.6:1 — oba ispod 4.5:1. Zato je slovo na narandzastom
   dugmetu --kp-orange-ink (5.0:1), a narandzasta kao TEKST na beloj podlozi je zatamnjena (--kp-orange-text, 5.2:1).
   Ko menja ove dve vrednosti, neka prvo izmeri kontrast. */

:root {
    /* brend */
    --kp-dark: #33424F;
    --kp-dark-2: #26323C;
    --kp-dark-line: #465764;
    --kp-on-dark: #D3DAE0;
    --kp-on-dark-muted: #AEBBC6;
    --kp-orange: #FF6800;
    --kp-orange-2: #FF8E40;
    --kp-orange-ink: #1F2A33;
    --kp-orange-text: #B84A00;
    --kp-orange-text-hover: #8F3900;
    --kp-orange-tint: #FFF3EA;

    /* podloga i tekst */
    --kp-bg: #F3F5F8;
    --kp-surface: #FFFFFF;
    --kp-surface-2: #F7F9FB;
    --kp-line: #DBE1E8;
    --kp-line-strong: #C3CCD6;
    --kp-line-soft: #EDF0F4;
    --kp-ink: #18232F;
    --kp-ink-2: #455468;
    --kp-ink-3: #5B6B80;

    /* stanja — uvek par podloga + tekst; ista boja znaci isto u svakom modulu */
    --kp-ok-bg: #E3F3EA;
    --kp-ok-fg: #0F6B3C;
    --kp-ok-line: #B5DEC6;
    --kp-warn-bg: #FBEFD5;
    --kp-warn-fg: #8A5300;
    --kp-warn-ink: #5E3A00;
    --kp-warn-line: #E8CF94;
    --kp-danger-bg: #FBE6E3;
    --kp-danger-fg: #A3271F;
    --kp-danger-ink: #6E1711;
    --kp-danger-line: #F0C4BE;
    --kp-danger-solid: #B5362D;
    --kp-info-bg: #E4EDF9;
    --kp-info-fg: #1D4F91;
    --kp-info-line: #BCD0EC;
    --kp-neutral-bg: #E9EDF2;
    --kp-neutral-fg: #455468;

    /* interno — sve sto klijent ne sme da vidi; ne koristi se ni za sta drugo */
    --kp-internal-bg: #FFF9E6;
    --kp-internal-line: #C9A23A;
    --kp-internal-fg: #6B4E00;
    --kp-internal-ink: #3D2D00;

    /* slova i mere */
    --kp-font: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
    --kp-font-mono: "IBM Plex Mono", Consolas, "Cascadia Mono", ui-monospace, monospace;
    --kp-font-serif: "IBM Plex Serif", Georgia, serif;
    --kp-radius-chip: 4px;
    --kp-radius: 6px;
    --kp-radius-card: 8px;
    --kp-focus: 0 0 0 3px rgba(255, 104, 0, 0.3);

    /* Bootstrap promenljive */
    --bs-body-font-family: var(--kp-font);
    --bs-body-font-size: 0.875rem;
    --bs-body-line-height: 1.45;
    --bs-body-color: var(--kp-ink);
    --bs-body-color-rgb: 24, 35, 47;
    --bs-body-bg: var(--kp-bg);
    --bs-secondary-color: var(--kp-ink-3);
    --bs-font-monospace: var(--kp-font-mono);
    --bs-link-color: var(--kp-orange-text);
    --bs-link-color-rgb: 184, 74, 0;
    --bs-link-hover-color: var(--kp-orange-text-hover);
    --bs-link-hover-color-rgb: 143, 57, 0;
    --bs-border-color: var(--kp-line);
    --bs-border-radius: var(--kp-radius);
    --bs-border-radius-sm: var(--kp-radius);
    --bs-code-color: var(--kp-ink);
    --bs-heading-color: var(--kp-ink);
}

/* ---- osnova ---- */

html, body {
    font-family: var(--kp-font);
    font-variant-numeric: tabular-nums;
}

a {
    text-decoration: none;
}

    a:hover {
        text-decoration: underline;
    }

h1 {
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    margin-bottom: 1rem;
}

    h1:focus {
        outline: none;
    }

h2, .h4, .h5 {
    font-size: 1rem;
    font-weight: 600;
}

h3, .h6 {
    font-size: 0.875rem;
    font-weight: 600;
}

.lead {
    font-size: 1rem;
    font-weight: 400;
    color: var(--kp-ink-2);
}

code, .font-monospace {
    font-family: var(--kp-font-mono) !important;
    font-size: 0.92em;
}

/* Bootstrap podebljanom daje "bolder" (700), a u repou su tezine do 600 — 700 bi pregledac lazirao. */
b, strong {
    font-weight: 600;
}

dl.row > dt {
    font-weight: 400;
    color: var(--kp-ink-3);
}

summary {
    font-weight: 500;
    cursor: pointer;
}

/* ---- dugmad: jedno primarno po ekranu, i ono je narandzasto ---- */

.btn {
    --bs-btn-font-size: 0.844rem;
    --bs-btn-font-weight: 500;
    --bs-btn-border-radius: var(--kp-radius);
    --bs-btn-padding-x: 0.875rem;
    --bs-btn-padding-y: 0.4rem;
    --bs-btn-focus-shadow-rgb: 255, 104, 0;
}

.btn-sm {
    --bs-btn-font-size: 0.78rem;
    --bs-btn-padding-x: 0.625rem;
    --bs-btn-padding-y: 0.22rem;
}

.btn-primary {
    --bs-btn-color: var(--kp-orange-ink);
    --bs-btn-bg: var(--kp-orange);
    --bs-btn-border-color: var(--kp-orange);
    --bs-btn-hover-color: var(--kp-orange-ink);
    --bs-btn-hover-bg: var(--kp-orange-2);
    --bs-btn-hover-border-color: var(--kp-orange-2);
    --bs-btn-active-color: var(--kp-orange-ink);
    --bs-btn-active-bg: var(--kp-orange-2);
    --bs-btn-active-border-color: var(--kp-orange-2);
    --bs-btn-disabled-color: var(--kp-ink-3);
    --bs-btn-disabled-bg: var(--kp-neutral-bg);
    --bs-btn-disabled-border-color: var(--kp-line);
}

.btn-outline-secondary, .btn-outline-dark, .btn-outline-primary, .btn-secondary {
    --bs-btn-color: var(--kp-ink);
    --bs-btn-bg: var(--kp-surface);
    --bs-btn-border-color: var(--kp-line-strong);
    --bs-btn-hover-color: var(--kp-ink);
    --bs-btn-hover-bg: var(--kp-surface-2);
    --bs-btn-hover-border-color: var(--kp-ink-3);
    --bs-btn-active-color: var(--kp-ink);
    --bs-btn-active-bg: var(--kp-neutral-bg);
    --bs-btn-active-border-color: var(--kp-ink-3);
    --bs-btn-disabled-color: var(--kp-ink-3);
    --bs-btn-disabled-bg: var(--kp-neutral-bg);
    --bs-btn-disabled-border-color: var(--kp-line);
}

.btn-danger {
    --bs-btn-color: #FFFFFF;
    --bs-btn-bg: var(--kp-danger-solid);
    --bs-btn-border-color: var(--kp-danger-solid);
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: var(--kp-danger-fg);
    --bs-btn-hover-border-color: var(--kp-danger-fg);
    --bs-btn-active-bg: var(--kp-danger-fg);
    --bs-btn-active-border-color: var(--kp-danger-fg);
    --bs-btn-disabled-bg: var(--kp-danger-solid);
    --bs-btn-disabled-border-color: var(--kp-danger-solid);
}

.btn-outline-danger {
    --bs-btn-color: var(--kp-danger-fg);
    --bs-btn-bg: var(--kp-surface);
    --bs-btn-border-color: var(--kp-line-strong);
    --bs-btn-hover-color: var(--kp-danger-fg);
    --bs-btn-hover-bg: var(--kp-danger-bg);
    --bs-btn-hover-border-color: var(--kp-danger-line);
    --bs-btn-active-color: var(--kp-danger-fg);
    --bs-btn-active-bg: var(--kp-danger-bg);
    --bs-btn-active-border-color: var(--kp-danger-line);
    --bs-btn-disabled-color: var(--kp-ink-3);
    --bs-btn-disabled-border-color: var(--kp-line);
}

.btn-link {
    --bs-btn-color: var(--kp-ink-2);
    --bs-btn-hover-color: var(--kp-ink);
    --bs-btn-active-color: var(--kp-ink);
    --bs-btn-font-weight: 400;
    text-decoration: none;
}

/* ---- polja: oznaka iznad, pomoc ispod, greska kao recenica ---- */

.form-label {
    font-size: 0.8125rem;
    font-weight: 500;
    margin-bottom: 0.3rem;
}

.form-control, .form-select {
    font-size: 0.844rem;
    min-height: 2.25rem;
    color: var(--kp-ink);
    /* Bootstrap polju daje boju tela stranice; telo je ovde sivo, a polje mora ostati belo */
    background-color: var(--kp-surface);
    border-color: var(--kp-line-strong);
    border-radius: var(--kp-radius);
}

.form-select-sm {
    min-height: 1.75rem;
    font-size: 0.78rem;
}

    .form-control:focus, .form-select:focus, .form-check-input:focus {
        border-color: var(--kp-dark);
        box-shadow: var(--kp-focus);
    }

.btn:focus-visible {
    box-shadow: var(--kp-focus);
}

.form-text {
    font-size: 0.75rem;
    color: var(--kp-ink-3);
}

.form-check-input {
    border-color: var(--kp-ink-3);
}

    /* kvacica je tamna, ne bela: bela na narandzastoj je 2.9:1 */
    .form-check-input:checked {
        background-color: var(--kp-orange);
        border-color: var(--kp-orange);
    }

        .form-check-input:checked[type=checkbox] {
            --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%231F2A33' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
        }

.valid.modified:not([type=checkbox]) {
    outline: 1px solid var(--kp-ok-fg);
}

.invalid {
    outline: 1px solid var(--kp-danger-solid);
}

.validation-message {
    font-size: 0.75rem;
    color: var(--kp-danger-fg);
}

/* ---- nalaz: sistem sam kaze sta nije u redu i sta da se uradi ---- */

.alert {
    --bs-alert-padding-x: 0.875rem;
    --bs-alert-padding-y: 0.75rem;
    --bs-alert-border-radius: var(--kp-radius-card);
    font-size: 0.8125rem;
}

    .alert strong {
        font-weight: 600;
    }

    .alert a {
        color: inherit;
        font-weight: 500;
        text-decoration: underline;
    }

.alert-warning {
    --bs-alert-bg: var(--kp-warn-bg);
    --bs-alert-border-color: var(--kp-warn-line);
    --bs-alert-color: var(--kp-warn-ink);
}

.alert-danger {
    --bs-alert-bg: var(--kp-danger-bg);
    --bs-alert-border-color: var(--kp-danger-line);
    --bs-alert-color: var(--kp-danger-ink);
}

.alert-success {
    --bs-alert-bg: var(--kp-ok-bg);
    --bs-alert-border-color: var(--kp-ok-line);
    --bs-alert-color: #0B4F2C;
}

.alert-info {
    --bs-alert-bg: var(--kp-info-bg);
    --bs-alert-border-color: var(--kp-info-line);
    --bs-alert-color: #163C6E;
}

.alert-secondary {
    --bs-alert-bg: var(--kp-neutral-bg);
    --bs-alert-border-color: var(--kp-line);
    --bs-alert-color: var(--kp-ink-2);
}

/* ---- znacke stanja: tekst + tacka, nikad samo boja ---- */

.badge, .kp-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    min-height: 1.375rem;
    padding: 0.15rem 0.5rem;
    border-radius: var(--kp-radius-chip);
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.25;
    white-space: normal;
    text-align: left;
    vertical-align: middle;
    background-color: var(--kp-neutral-bg);
    color: var(--kp-neutral-fg);
}

    .badge::before, .kp-chip::before {
        content: "";
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: currentColor;
        flex-shrink: 0;
    }

    /* dugme unutar znacke (npr. "×" uz ulogu) nasledjuje boju znacke */
    .badge .btn-link, .badge .btn-link.text-white {
        color: inherit !important;
        line-height: 1;
    }

.text-bg-success, .kp-chip--ok {
    background-color: var(--kp-ok-bg) !important;
    color: var(--kp-ok-fg) !important;
}

.text-bg-warning, .kp-chip--warn {
    background-color: var(--kp-warn-bg) !important;
    color: var(--kp-warn-fg) !important;
}

.text-bg-danger, .kp-chip--danger {
    background-color: var(--kp-danger-bg) !important;
    color: var(--kp-danger-fg) !important;
}

.text-bg-info, .kp-chip--info {
    background-color: var(--kp-info-bg) !important;
    color: var(--kp-info-fg) !important;
}

.text-bg-secondary, .text-bg-light, .kp-chip--neutral {
    background-color: var(--kp-neutral-bg) !important;
    color: var(--kp-neutral-fg) !important;
}

.badge.border {
    border-color: var(--kp-line) !important;
}

/* "u toku" — jedina puna znacka, da se ne pomesa sa plavom za "novo" */
.text-bg-primary, .text-bg-dark, .kp-chip--active {
    background-color: var(--kp-dark) !important;
    color: #FFFFFF !important;
}

/* ---- tabela kao kartica ---- */

.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--kp-ink);
    --bs-table-border-color: var(--kp-line-soft);
    font-size: 0.8125rem;
    background: var(--kp-surface);
    border: 1px solid var(--kp-line);
    border-radius: var(--kp-radius-card);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
}

    .table > :not(caption) > * > * {
        padding: 0.65rem 0.875rem;
    }

    .table > thead > tr > th {
        font-size: 0.75rem;
        font-weight: 500;
        color: var(--kp-ink-2);
        background: var(--kp-surface-2);
        border-bottom-color: var(--kp-line);
        white-space: nowrap;
    }

    .table > tbody > tr:last-child > * {
        border-bottom-width: 0;
    }

    .table > tbody > tr:hover > * {
        background: var(--kp-surface-2);
    }

.card {
    --bs-card-border-color: var(--kp-line);
    --bs-card-border-radius: var(--kp-radius-card);
    --bs-card-inner-border-radius: calc(var(--kp-radius-card) - 1px);
    --bs-card-cap-bg: var(--kp-surface-2);
    --bs-card-bg: var(--kp-surface);
}

.card-header {
    font-size: 0.875rem;
    font-weight: 600;
}

/* ---- obrasci sa platna ---- */

/* zaglavlje strane: naslov levo, jedna glavna radnja desno */
.kp-page-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

    .kp-page-head h1 {
        margin-bottom: 0;
    }

/* veza nazad iznad naslova */
.kp-back {
    display: inline-block;
    margin-bottom: 0.5rem;
    font-size: 0.8125rem;
    color: var(--kp-ink-3);
}

/* odeljak kao kartica */
.kp-card {
    background: var(--kp-surface);
    border: 1px solid var(--kp-line);
    border-radius: var(--kp-radius-card);
    padding: 1rem 1.125rem;
}

/* tajna se prikazuje jednom */
.kp-tajna {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 0.875rem 1rem;
    margin-bottom: 1rem;
    background: var(--kp-surface);
    border: 1px solid var(--kp-ink);
    border-radius: var(--kp-radius-card);
    font-size: 0.8125rem;
}

    /* ⚠️ Samo vrednost tajne je blok — ne svaki <code>: rec `ApiKey` u recenici je ranije postajala crna traka preko cele
       sirine i lomila recenicu u tri reda (pregled ekrana, 21.09.2026.). */
    .kp-tajna__vrednost {
        display: block;
        padding: 0.55rem 0.75rem;
        border-radius: var(--kp-radius);
        background: var(--kp-dark);
        color: #FFFFFF;
        font-size: 0.875rem;
        overflow-wrap: anywhere;
        user-select: all;
    }

    .kp-tajna__red {
        display: flex;
        align-items: stretch;
        gap: 0.5rem;
    }

        .kp-tajna__red .kp-tajna__vrednost {
            flex: 1;
        }

/* potvrda u mestu — bez iskacuceg prozora, posledica napisana */
.kp-potvrda {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.625rem;
    padding: 0.625rem 0.875rem;
    background: #FDF3F1;
    border: 1px solid var(--kp-danger-line);
    border-radius: var(--kp-radius-card);
    font-size: 0.8125rem;
}

/* interno — isprekidan okvir i zuta podloga; ⚠️ ni za sta drugo (MODULI §C.3) */
.kp-interno {
    padding: 0.75rem 1rem;
    background: var(--kp-internal-bg);
    border: 1px dashed var(--kp-internal-line);
    border-radius: var(--kp-radius-card);
    color: var(--kp-internal-ink);
}

.kp-interno__oznaka {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--kp-internal-fg);
}

/* ---- znak ---- */

.kp-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    color: var(--kp-dark);
    text-decoration: none;
}

    .kp-brand:hover {
        text-decoration: none;
    }

    .kp-brand svg {
        display: block;
        flex-shrink: 0;
    }

.kp-brand__bg {
    fill: var(--kp-dark);
}

.kp-brand__stavka {
    fill: #FFFFFF;
}

.kp-brand__zbir {
    fill: var(--kp-orange);
}

.kp-brand--na-tamnom {
    color: #FFFFFF;
}

    .kp-brand--na-tamnom .kp-brand__bg {
        fill: var(--kp-dark-2);
    }

/* ---- slova: IBM Plex, iz repoa ----

   Platforma sve drzi kod sebe: fontovi se sluze iz Shared/wwwroot/fonts, bez CDN-a i bez poziva trecoj strani da bi se
   prikazala prijava. Licenca je SIL OFL 1.1 (fonts/OFL.txt) — bez troska, sme da se isporucuje uz aplikaciju (O-13).
   Podskupovi: latin, latin-ext (c, c, s, z, dj) i cyrillic (sr-Cyrl); unicode-range cini da pregledac povuce samo onaj koji
   stranici treba. Tezine su samo one koje tema koristi — nova tezina u temi trazi i nov fajl ovde (ThemeRuleTests). */

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/ibm-plex-sans-cyrillic-400-normal.woff2") format("woff2");
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/ibm-plex-sans-latin-ext-400-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("fonts/ibm-plex-sans-cyrillic-500-normal.woff2") format("woff2");
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("fonts/ibm-plex-sans-latin-ext-500-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("fonts/ibm-plex-sans-latin-500-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("fonts/ibm-plex-sans-cyrillic-600-normal.woff2") format("woff2");
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("fonts/ibm-plex-sans-latin-ext-600-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("fonts/ibm-plex-sans-latin-600-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: "IBM Plex Mono";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/ibm-plex-mono-cyrillic-400-normal.woff2") format("woff2");
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: "IBM Plex Mono";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/ibm-plex-mono-latin-ext-400-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "IBM Plex Mono";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: "IBM Plex Mono";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("fonts/ibm-plex-mono-cyrillic-500-normal.woff2") format("woff2");
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: "IBM Plex Mono";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("fonts/ibm-plex-mono-latin-ext-500-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "IBM Plex Mono";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: "IBM Plex Serif";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/ibm-plex-serif-cyrillic-400-normal.woff2") format("woff2");
    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
    font-family: "IBM Plex Serif";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/ibm-plex-serif-latin-ext-400-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "IBM Plex Serif";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("fonts/ibm-plex-serif-latin-400-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}