@import url("tokens.css");
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600&display=swap");

:root {
    --bg: #f4f1ea;
    --card: #fff;
    --text: #1f2430;
    --muted: #5c6578;
    --line: #d9d3c7;
    --accent: #2c5f4a;
    --danger: #9b2c2c;
}

* { box-sizing: border-box; }

/* Полоса прокрутки как на макете: серая «таблетка» 12px, без дорожки.
   В Chromium размер и скругление задаёт webkit. В Firefox своих псевдоэлементов нет,
   поэтому цвет и тонкая ширина — только там, и не на всех элементах: иначе Firefox
   меняет вид кнопок. */
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #b7b9be;
    border-radius: 999px;
}

::-webkit-scrollbar-button,
::-webkit-scrollbar-button:single-button {
    display: none;
    width: 0;
    height: 0;
    background: transparent;
}

@supports (-moz-appearance: none) {
    html,
    .side-nav,
    .roles-modal .catalog-modal__box {
        scrollbar-width: thin;
        scrollbar-color: #b7b9be #f2f9ff;
    }
}

body {
    margin: 0;
    font-family: "Segoe UI", Tahoma, sans-serif;
    background: var(--bg);
    color: var(--text);
}

body.is-loading {
    cursor: progress;
}

body.is-loading::after {
    content: "";
    position: fixed;
    z-index: 80;
    top: 0;
    left: 0;
    height: 3px;
    width: 35%;
    background: #4285f4;
    animation: pf-load 0.8s ease-in-out infinite;
}

@keyframes pf-load {
    0% { transform: translateX(-120%); }
    100% { transform: translateX(320%); }
}

/* Оболочка кабинета и экран «Команда» (Figma 124:18724) — цвета дублируются
   hex-ом, чтобы страница не ломалась, если tokens.css не подгрузился. */
body.app-shell,
body:has(.team-page) {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #f2f9ff;
    color: #000;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
}

.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: clamp(12px, 1.5vw, 24px);
    min-height: 100px;
    height: 100px;
    padding: 12px clamp(16px, 2.5vw, 40px);
    background: #f2f9ff;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
    border-bottom: 0;
    flex-shrink: 0;
}

.topbar-start {
    display: flex;
    align-items: center;
    gap: clamp(12px, 2vw, 40px);
    flex: 1 1 0;
    min-width: 200px;
    height: 56px;
}

.topbar-user {
    display: flex;
    align-items: center;
    gap: clamp(10px, 1.2vw, 20px);
    min-width: 0;
    flex: 1 1 auto;
}

.user-name {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.04em;
    color: #000;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.main-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(8px, 1.1vw, 20px);
    flex: 0 1 780px;
    flex-wrap: nowrap;
    min-width: 0;
}

.nav-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: clamp(8px, 1vw, 20px);
    flex: 0 1 220px;
    max-width: 220px;
    min-width: min-content;
    height: 56px;
    padding: 12px 2px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #f2f9ff;
    color: #000;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
    box-sizing: border-box;
}

.nav-pill--wide {
    flex: 0 1 300px;
    max-width: 300px;
}

.nav-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    color: #000;
}

.nav-icon img,
.nav-icon svg {
    display: block;
    max-width: 24px;
    max-height: 24px;
}

.nav-label { position: relative; }

a.nav-pill:hover {
    box-shadow:
        7px 7px 8px rgba(0, 0, 0, 0.06),
        -7px -7px 8px rgba(255, 255, 255, 0.68);
}

.nav-pill.active {
    background: var(--ds-gradient-brand);
    border-color: transparent;
    color: #000;
}

.nav-pill.disabled { cursor: default; }

.topbar-end {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 1 1 0;
    min-width: 160px;
}

.topbar-end .chrome-menu {
    min-width: 0;
    max-width: 100%;
}

.chrome-menu { position: relative; }

.chrome-menu--burger { flex-shrink: 0; }

.chrome-menu summary {
    list-style: none;
    cursor: pointer;
}

.chrome-menu summary::-webkit-details-marker { display: none; }
.chrome-menu summary::marker { content: ""; }

.avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    padding: 3px;
    border: 3px solid #5e58c6;
    border-radius: 100px;
    background: #fff;
    color: #000;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-weight: 600;
    font-size: 32px;
    letter-spacing: 0.04em;
    line-height: 1;
    flex-shrink: 0;
    box-sizing: border-box;
    overflow: hidden;
}

.avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}

.burger-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    box-sizing: border-box;
    flex-shrink: 0;
}

.burger-btn img { display: block; }

.role-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 220px;
    height: 40px;
    padding: 12px clamp(8px, 1.2vw, 20px);
    border: 0;
    border-radius: 8px;
    background: var(--ds-gradient-brand-cool);
    color: #000;
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-align: center;
    white-space: nowrap;
    box-sizing: border-box;
    max-width: 100%;
    min-width: min-content;
}

.burger-dropdown,
.role-dropdown {
    position: absolute;
    z-index: 30;
    background: #f2f9ff;
    border-radius: 8px;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.26);
}

.burger-dropdown {
    top: calc(100% + 12px);
    left: auto;
    right: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 340px;
    padding: 20px;
    box-sizing: border-box;
}

.role-dropdown {
    top: calc(100% + 8px);
    right: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 220px;
    padding: 12px;
    box-sizing: border-box;
}

.drop-item {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 300px;
    height: 56px;
    padding: 10px 20px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    box-sizing: border-box;
}

.drop-item--btn {
    width: 100%;
    font-family: inherit;
    text-align: left;
    cursor: pointer;
}

.drop-logout { margin: 0; }

.drop-ico,
.drop-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.drop-brand {
    width: 22px;
    height: 22px;
    border: 1.18px solid #5e58c6;
    border-radius: 500px;
}

.drop-ico img,
.drop-brand img { display: block; }

.drop-ico--exit img {
    transform: rotate(-90deg) scaleY(-1);
}

.drop-line {
    display: block;
    width: 100%;
    height: 0;
    border-top: 2px solid #000;
}

.role-option {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 40px;
    padding: 10px 20px;
    border: 1px solid #eaedf3;
    border-radius: 8px;
    background: transparent;
    color: #000;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.04em;
    box-sizing: border-box;
    text-decoration: none;
}

a.role-option { cursor: pointer; }

a.role-option:hover { background: #fff; }

.wrap { max-width: 960px; margin: 32px auto; padding: 0 16px; }

.app-shell .wrap { flex: 1; }

body.app-shell .wrap { padding-bottom: 40px; }

body:has(.team-page) .wrap,
body:has(.manager-desk) .wrap,
body:has(.ws-page) .wrap,
.wrap--fluid {
    max-width: none;
    width: 100%;
    margin: 0;
    padding: 52px 40px 40px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    flex: 1;
}

.card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 24px;
}

.card.narrow { max-width: 420px; margin: 48px auto; }

.card.install-card { max-width: 520px; }

.install-block {
    margin: 20px 0 8px;
    padding: 0;
    border: 0;
    border-top: 1px solid var(--line, #d9d3c7);
}

.install-block legend {
    padding: 12px 0 0;
    font-size: 1.05rem;
    font-weight: 600;
}

.install-block p {
    margin: 8px 0 0;
    color: var(--muted, #5c6578);
    font-size: 0.9rem;
}

.card h1 { margin-top: 0; font-size: 1.4rem; }

.card button {
    background: var(--accent);
    color: #fff;
    border: 0;
    border-radius: 4px;
    padding: 8px 14px;
    cursor: pointer;
}

label { display: block; margin: 12px 0; font-size: 0.9rem; }

input {
    display: block;
    width: 100%;
    margin-top: 4px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 4px;
}

.error { color: var(--danger); }

.todo { color: var(--muted); }

/* Экран «2. Пользователи», Figma node 124:18724 */
.team-page {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    width: 100%;
}

.team-page__head {
    padding-bottom: 40px;
    border-bottom: 2px solid #eaedf3;
}

.team-page__head h1 {
    margin: 0;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 32px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    color: #000;
}

.member-grid {
    display: grid;
    grid-template-columns: repeat(4, 380px);
    gap: 20px;
    margin-top: 48px;
    justify-content: start;
}

.member-card {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 380px;
    height: 64px;
    padding: 12px 20px;
    background: #fff;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    box-sizing: border-box;
}

.member-card:hover {
    box-shadow:
        7px 7px 8px rgba(0, 0, 0, 0.06),
        -7px -7px 8px rgba(255, 255, 255, 0.68);
}

.member-card__text {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.member-card__name,
.member-card__role {
    margin: 0;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 22px;
    letter-spacing: 0.04em;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.member-card__name {
    font-weight: 600;
    color: #000;
}

.member-card__role {
    font-weight: 400;
    color: #a1a1a1;
}

.team-page__actions {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-top: auto;
    padding-top: 40px;
}

.btn-add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    height: 64px;
    padding: 20px;
    border: 0;
    border-radius: 8px;
    background: #000;
    color: #fff;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
    box-sizing: border-box;
    flex-shrink: 0;
    appearance: none;
    -webkit-appearance: none;
}

.btn-add:hover {
    box-shadow:
        7px 7px 8px rgba(0, 0, 0, 0.06),
        -7px -7px 8px rgba(255, 255, 255, 0.68);
}

.btn-add--wide { width: 360px; }

.btn-add__icon {
    position: relative;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    overflow: visible;
}

.btn-add__icon img {
    position: absolute;
    top: 0;
    left: -1px;
    width: 33px;
    height: 32px;
    display: block;
}

@media (max-width: 1680px) {
    .member-grid { grid-template-columns: repeat(auto-fill, 380px); }
}

@media (max-width: 900px) {
    .topbar { height: auto; min-height: 0; padding: 12px 20px; flex-wrap: wrap; }
    .main-nav { flex: 1 1 auto; flex-wrap: wrap; justify-content: flex-start; min-width: 0; }
    .topbar-start,
    .topbar-end { flex: 1 1 auto; min-width: 0; }
    body:has(.team-page) .wrap,
    body:has(.manager-desk) .wrap,
    body:has(.ws-page) .wrap,
    .wrap--fluid { padding: 32px 20px 24px; }
    .site-footer { padding: 24px 20px; }
    .member-grid {
        grid-template-columns: 1fr;
        margin-top: 24px;
    }
    .member-card { width: 100%; }
    .team-page__actions { flex-direction: column-reverse; align-items: stretch; }
    .btn-add,
    .btn-add--wide { width: 100%; }
}

body:has(.catalog-page) .wrap,
body:has(.admin-desk) .wrap {
    max-width: none;
    width: 100%;
    margin: 0;
    padding: 32px 40px 40px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    flex: 1;
}

body:has(.catalog-hub) .wrap {
    padding-top: 52px;
}

.catalog-page,
.admin-desk {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}

.catalog-hub { gap: 40px; }

.catalog-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: max-content;
    height: 44px;
    padding: 0 16px 0 12px;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    background: #f2f9ff;
    color: #000;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.catalog-back::before { content: "‹"; font-size: 22px; line-height: 1; }

.catalog-page__head h1,
.admin-block__head h2 {
    margin: 0;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: #000;
}
.catalog-page__head h1 { font-size: 32px; line-height: 1.15; }
.catalog-page__head--actions {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.catalog-head-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.catalog-head-actions--inline { margin-top: 8px; }
.catalog-lead { margin: 0; font-size: 18px; color: #000; }

.catalog-flash {
    margin: 0;
    padding: 12px 16px;
    border-radius: 8px;
    background: #fff;
    border: 2px solid #a5cd39;
    color: #000;
}
.catalog-flash--error { border-color: #ed3d22; }

.toast-stack {
    position: fixed;
    z-index: 70;
    left: 24px;
    bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: min(360px, calc(100vw - 48px));
    pointer-events: none;
}

.toast {
    pointer-events: auto;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0;
    padding: 12px 10px 12px 16px;
    border: 2px solid #a5cd39;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    color: #000;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 15px;
    line-height: 1.35;
}

.toast--error { border-color: #ed3d22; }

.toast p {
    margin: 0;
    flex: 1;
    padding-top: 4px;
}

.toast__close {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #000;
    font: 22px/1 "Roboto", "Segoe UI", Tahoma, sans-serif;
    cursor: pointer;
}

.toast__close:hover { background: #f2f9ff; }

.catalog-section {
    background: #deeaff;
    border-radius: 12px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.catalog-section__title {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0;
}
.catalog-section__title h2 {
    margin: 0;
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.catalog-section__icon {
    display: inline-flex;
    width: 64px;
    height: 64px;
    align-items: center;
    justify-content: center;
    background: #eaedf3;
    border-radius: 8px;
    flex-shrink: 0;
}

.catalog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}
.catalog-tile {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    min-height: 166px;
    padding: 20px;
    background: #f2f9ff;
    border: 2px solid #deeaff;
    border-radius: 8px;
    text-decoration: none;
    color: #000;
    box-sizing: border-box;
}
.catalog-tile:hover {
    box-shadow:
        7px 7px 8px rgba(0, 0, 0, 0.06),
        -7px -7px 8px rgba(255, 255, 255, 0.68);
}
.catalog-tile__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    flex-shrink: 0;
    background: #deeaff;
    border-radius: 8px;
    color: #4285f4;
    font-size: 32px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.catalog-tile__body { display: flex; flex: 1; flex-direction: column; gap: 12px; min-width: 0; }
.catalog-tile__name {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
}
.catalog-tile__text {
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.15;
    color: #000;
}
.catalog-tile__ok {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    width: 52px;
    height: 30px;
    margin-left: auto;
    flex-shrink: 0;
    color: #b7b9be;
}
.catalog-tile__ok--filled { color: #4285f4; }
.catalog-icon-btn--idle {
    background: #eaedf3;
    color: #b7b9be;
    cursor: default;
}
.catalog-icon-btn--idle svg path { stroke: #b7b9be; }

.catalog-empty { display: grid; gap: 20px; }
.catalog-empty--split { grid-template-columns: 1fr 1fr; }
.catalog-empty--upload { gap: 40px; align-items: stretch; }
.catalog-empty--single { justify-items: center; }
.catalog-empty--single .catalog-empty__card { max-width: 720px; width: 100%; }
.catalog-empty__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
    padding: 40px 32px;
    background: #f2f9ff;
    border-radius: 8px;
}
.catalog-empty__card--lead {
    justify-content: space-between;
    gap: 40px;
    padding: 20px;
    background: #deeaff;
}
.catalog-empty__lead {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: 100%;
}
.catalog-empty__card--lead .catalog-empty__icon {
    background: #eaedf3;
    border-radius: 11.25px;
}
.catalog-empty__card--lead .catalog-empty__title {
    font-size: 25px;
    line-height: 1.15;
}
.catalog-empty__card--lead .catalog-empty__hint {
    max-width: none;
    font-size: 20px;
    letter-spacing: 0.04em;
    line-height: 1.15;
}
.catalog-empty__card--lead .btn-add {
    width: 320px;
    font-size: 16px;
    letter-spacing: 0.04em;
}
.catalog-empty__icon {
    display: inline-flex;
    width: 64px;
    height: 64px;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 8px;
}
.catalog-empty__title {
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.catalog-empty__hint {
    margin: 0;
    font-size: 18px;
    font-weight: 400;
    color: #000;
    max-width: 520px;
}

.catalog-file-chip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: min(100%, 420px);
    padding: 10px 12px;
    background: #fff;
    border-radius: 8px;
    text-decoration: none;
    color: #000;
    font-size: 16px;
}

.catalog-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.catalog-entity-wrap {
    position: relative;
}
.catalog-entity-wrap .catalog-icon-btn {
    position: absolute;
    top: 8px;
    right: 8px;
}
.catalog-entity-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 280px;
    min-height: 140px;
    padding: 20px;
    background: #fff;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    text-decoration: none;
    color: #000;
    box-sizing: border-box;
}
.catalog-entity-card:hover,
.catalog-entity-card.is-active {
    box-shadow:
        7px 7px 8px rgba(0, 0, 0, 0.06),
        -7px -7px 8px rgba(255, 255, 255, 0.68);
}
.catalog-entity-card--logo { align-items: center; justify-content: center; text-align: center; }
.catalog-entity-card__logo { max-width: 140px; max-height: 48px; object-fit: contain; }
.catalog-entity-card__num {
    font-size: 18px;
    font-weight: 600;
    color: #4285f4;
}
.tax-people {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 28px;
}
.tax-person {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 340px;
    height: 188px;
    padding: 20px;
    background: #fff;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    color: #000;
    text-decoration: none;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-align: center;
    box-sizing: border-box;
}
.tax-person:hover {
    box-shadow:
        7px 7px 8px rgba(0, 0, 0, 0.06),
        -7px -7px 8px rgba(255, 255, 255, 0.68);
}
.tax-blocks {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 28px;
}
.tax-block {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 24px;
    background: #eaedf3;
    border-radius: 8px;
}
.tax-block__head,
.tax-block__row {
    display: grid;
    gap: 20px;
    align-items: center;
}
.tax-block--text .tax-block__head,
.tax-block--text .tax-block__row {
    grid-template-columns: 60px minmax(180px, 512px) minmax(180px, 1fr) auto;
}
.tax-block--rates .tax-block__head,
.tax-block--rates .tax-block__row {
    grid-template-columns: 60px minmax(180px, 1fr) minmax(160px, 1fr) auto;
}
.tax-block__actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}
.tax-block .company-icon--idle { background: #f2f9ff; }
.tax-block .catalog-icon-btn { padding: 0; }
.tax-cell--input { padding: 0 20px; }
.tax-cell input {
    width: 100%;
    height: 100%;
    min-height: 47px;
    border: 0;
    background: transparent;
    font: inherit;
    letter-spacing: inherit;
    color: inherit;
    outline: none;
}
.tax-cell--placeholder { color: #9aa3b5; }
.tax-block--text .tax-add-link { justify-self: center; }
.tax-block__head {
    min-height: 64px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.tax-block__label {
    display: inline-flex;
    align-items: center;
    gap: 16px;
}
.tax-block__label img { width: 32px; height: 32px; }
.tax-cell {
    display: flex;
    align-items: center;
    min-height: 63px;
    padding: 8px 20px;
    background: #fff;
    border-radius: 8px;
    font-size: 18px;
    letter-spacing: 0.04em;
    box-sizing: border-box;
}
.tax-cell--num { justify-content: center; padding: 8px; }
.tax-cell--action { justify-content: center; }
.tax-add-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-decoration: none;
}
.tax-block__add { display: flex; justify-content: center; }
.catalog-entity-card__name { font-size: 18px; font-weight: 600; letter-spacing: 0.04em; }
.catalog-entity-card__text { font-size: 14px; color: #a1a1a1; }

.catalog-sheets {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.catalog-sheet {
    display: flex;
    flex-direction: column;
    gap: 40px;
    min-height: 192px;
    padding: 20px;
    background: #f2f9ff;
    border: 2px solid #deeaff;
    border-radius: 8px;
    text-decoration: none;
    color: #000;
    box-sizing: border-box;
}
.catalog-sheet:hover,
.catalog-sheet:active,
.catalog-sheet:focus-visible {
    border-color: #deeaff;
    background-image: linear-gradient(164deg, rgba(212, 155, 252, 0.3) 12.275%, rgba(139, 135, 240, 0.3) 50.686%, rgba(164, 242, 254, 0.3) 87.96%);
    outline: none;
}
.catalog-sheet__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 44px;
}
.catalog-sheet__badge {
    display: inline-flex;
    align-items: center;
    height: 44px;
    padding: 0 20px;
    background: #deeaff;
    border-radius: 8px;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    color: #4285f4;
    white-space: nowrap;
}
.catalog-sheet__ok {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    width: 52px;
    height: 30px;
    flex-shrink: 0;
    color: #b7b9be;
}
.catalog-sheet__ok--filled { color: #4285f4; }
.catalog-sheet__body {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.catalog-sheet__name {
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
}
.catalog-sheet__text {
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.15;
}

.catalog-upload-slot--narrow {
    display: flex;
    justify-content: center;
}
.catalog-upload-slot--narrow .catalog-upload-card {
    width: min(900px, 100%);
}
.catalog-upload-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    width: 100%;
    padding: 20px;
    background: #deeaff;
    border-radius: 8px;
    box-sizing: border-box;
}
.catalog-upload-card form {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    width: 100%;
    margin: 0;
}
.catalog-upload-card__lead {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: 100%;
    text-align: center;
}
.catalog-upload-card__lead h2 {
    margin: 0;
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
}
.catalog-upload-card__lead p {
    margin: 0;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.15;
}
.catalog-upload-card__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    background: #eaedf3;
    border-radius: 11px;
    text-decoration: none;
}
.catalog-upload-file {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
    min-height: 68px;
    padding: 12px;
    background: #f2f9ff;
    border-radius: 8px;
    box-sizing: border-box;
}
.catalog-upload-file__info {
    display: flex;
    align-items: center;
    gap: 20px;
    flex: 1;
    min-width: 0;
}
.catalog-upload-file__xls { flex-shrink: 0; }
.catalog-upload-file__xls[hidden] { display: none; }
.catalog-upload-file__info[hidden] { display: none; }
.catalog-upload-file__text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.catalog-upload-file__name {
    font-size: 18px;
    letter-spacing: 0.04em;
    line-height: 1.15;
}
.catalog-upload-file__meta {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #b7b9be;
    font-size: 16px;
    letter-spacing: 0.04em;
}
.catalog-upload-pick {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-left: auto;
    background: #000;
    border-radius: 8px;
    cursor: pointer;
    flex-shrink: 0;
}
.catalog-upload-pick input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.catalog-upload-card__submit {
    width: 300px;
    font-size: 16px;
    letter-spacing: 0.04em;
}
.catalog-upload-card__submit:disabled {
    opacity: 0.45;
    cursor: default;
}
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.catalog-table-wrap {
    display: flex;
    flex-direction: column;
    gap: 20px;
    background: transparent;
    border-radius: 0;
    overflow: visible;
}
.catalog-table__head,
.catalog-table__row {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    padding: 20px 24px;
    border-radius: 8px;
}
.catalog-table__main {
    display: flex;
    flex: 1;
    gap: 20px;
    align-items: flex-start;
    min-width: 0;
}
.catalog-table__col { flex: 1; min-width: 0; font-weight: 400; }
.catalog-table__head {
    background: #deeaff;
    font-weight: 600;
    font-size: 20px;
    letter-spacing: 0.04em;
    align-items: center;
}
.catalog-table__head .catalog-table__col { font-weight: 600; }
.catalog-table__row {
    background: #eaedf3;
    margin: 0;
    font-size: 20px;
    letter-spacing: 0.04em;
    line-height: 1.15;
}
.catalog-table__row--edit { background: #fff; }
form.catalog-table__row { margin: 0; }
.catalog-table__head .catalog-table__main { align-items: center; }
.catalog-table__head .catalog-table__rule { margin-top: 0; }
.catalog-table__col--num { flex: 0 0 160px; font-weight: 600; }
.catalog-table__control:focus { outline: none; }
span.catalog-icon-btn { cursor: default; }
.catalog-table__col--title { font-weight: 600; }
.catalog-table__rule {
    width: 1px;
    height: 20px;
    margin-top: 2px;
    background: #000;
    flex-shrink: 0;
}
.catalog-table__actions {
    display: flex;
    gap: 12px;
    margin-left: auto;
    flex-shrink: 0;
}
.catalog-table__head .catalog-table__actions { width: 64px; }
.catalog-table__badge {
    display: inline-flex;
    align-items: center;
    height: 46px;
    padding: 0 22px;
    border-radius: 8px;
    background: #eaedf3;
    font-weight: 600;
}
.catalog-table__control {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    font: inherit;
    letter-spacing: inherit;
    color: inherit;
    resize: vertical;
}
.catalog-table__col--title .catalog-table__control { font-weight: 600; }
textarea.catalog-table__control { min-height: 46px; }
select.catalog-table__control { height: 46px; }
.catalog-table__col--act {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex: 0 0 auto;
    margin-left: auto;
}
.catalog-chip {
    display: inline-block;
    margin: 0 8px 8px 0;
    padding: 6px 12px;
    background: #f2f9ff;
    border-radius: 8px;
    font-size: 16px;
}
.catalog-inline-add {
    display: flex;
    gap: 8px;
    margin-top: 8px;
    align-items: center;
}
.catalog-inline-add input[type="text"] {
    width: auto;
    flex: 1;
    height: 56px;
    margin: 0;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    padding: 0 16px;
    font-size: 16px;
}
.btn-add--small { height: 56px; font-size: 16px; padding: 0 16px; }
.btn-add--record {
    width: 320px;
    font-size: 16px;
}

.doc-sheet {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 8px;
}
.doc-head,
.doc-row {
    display: grid;
    grid-template-columns: 48px 20px minmax(140px, 254px) 20px minmax(160px, 280px) 20px minmax(520px, 1fr);
    align-items: center;
    column-gap: 0;
}
.doc-head {
    min-height: 109px;
    padding: 16px 24px;
    background: #deeaff;
    border-radius: 8px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.25;
}
.doc-head__docs {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    min-width: 0;
}
.doc-head__title { text-align: center; }
.doc-group {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding: 20px 88px 20px 24px;
    background: #eaedf3;
    border-radius: 8px;
}
.doc-group__edit {
    position: absolute;
    top: 20px;
    right: 12px;
}
.doc-rule {
    width: 1px;
    height: 20px;
    background: #000;
    justify-self: center;
}
.doc-num,
.doc-name,
.doc-spec {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.3;
}
.doc-slots {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr) 20px minmax(0, 1fr) 20px minmax(0, 1fr);
    align-items: center;
    min-width: 0;
}
.doc-slots--head { width: 100%; }
.doc-slots--head > span:not(.doc-rule) { text-align: center; }
.doc-slot { position: relative; min-width: 0; }
.doc-upload {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    max-width: 240px;
    height: 56px;
    margin: 0 auto;
    padding: 0 12px;
    border-radius: 8px;
    background: #000;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-decoration: none;
    box-sizing: border-box;
}
.doc-upload--done {
    background: #d8f5c8;
    color: #000;
}
.doc-field {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    height: 44px;
    padding: 0 4px 0 12px;
    background: #fff;
    border-radius: 8px;
    box-sizing: border-box;
    color: #000;
}
.doc-field__xls { width: 20px; height: 20px; flex: 0 0 auto; }
.doc-field__xls[hidden] { display: none; }
.doc-field__name {
    overflow: hidden;
    min-width: 0;
    font-size: 14px;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.doc-field__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    color: #b7b9be;
    font-size: 13px;
    letter-spacing: 0.04em;
}
.doc-field__dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #b7b9be;
    flex: 0 0 auto;
}
.doc-field__pick {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin-left: auto;
    background: #000;
    border-radius: 8px;
    flex: 0 0 auto;
    cursor: pointer;
}
.doc-field__pick input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.doc-field__info {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    flex: 1;
}
.doc-field__info[hidden] { display: none; }
.doc-drop__shade {
    position: fixed;
    inset: 0;
    z-index: 30;
    background: transparent;
}
.doc-drop {
    position: absolute;
    z-index: 31;
    top: calc(100% + 8px);
    left: 50%;
    width: min(538px, calc(100vw - 48px));
    margin: 0;
    transform: translateX(-50%);
}
.doc-drop__zone {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 20px 20px 16px;
    border: 2px solid #deeaff;
    border-radius: 12px;
    background: #f2f9ff;
    box-sizing: border-box;
    text-align: center;
}
.doc-drop__zone::before {
    content: "";
    position: absolute;
    inset: 10px;
    border: 2px dashed #c5d7f2;
    border-radius: 8px;
    pointer-events: none;
}
.doc-drop__zone.is-over { background: #fff; }
.doc-drop__cloud { position: relative; z-index: 1; }
.doc-drop__text {
    position: relative;
    z-index: 1;
    margin: 0;
    color: #000;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.25;
    cursor: pointer;
}
.doc-drop__hint {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    color: #b7b9be;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.04em;
}
.doc-drop__dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #b7b9be;
    flex: 0 0 auto;
}
.doc-drop__btn {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 240px;
    max-width: 100%;
    height: 56px;
    border: 0;
    border-radius: 8px;
    background: #000;
    color: #fff;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
}

.act-sheet .doc-group { gap: 36px; }
.act-sheet .doc-row { align-items: start; }
.act-group--form { padding-right: 176px; }
.act-form {
    display: flex;
    flex-direction: column;
    gap: 36px;
    width: 100%;
    margin: 0;
}
.act-actions {
    position: absolute;
    top: 20px;
    right: 12px;
    display: flex;
    gap: 12px;
}
.act-def { min-width: 0; }
.act-add {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    min-height: 56px;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.25;
    text-decoration: none;
}
.act-add svg { flex: 0 0 auto; }
.act-body {
    display: block;
    color: #000;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.35;
    text-decoration: none;
    white-space: pre-wrap;
}
.act-input {
    display: block;
    width: 100%;
    min-height: 56px;
    margin: 0;
    padding: 16px 20px;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.35;
    field-sizing: content;
    box-sizing: border-box;
    resize: vertical;
}
.act-input:placeholder-shown {
    height: 56px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 52px;
}

.time-add { width: 320px; font-size: 16px; }
.time-save { width: 240px; height: 56px; font-size: 16px; gap: 12px; }
.time-save svg { width: 24px; height: 24px; }
.time-modal { background: #f2f9ff; width: min(958px, calc(100% - 48px)); }
.time-modal .catalog-modal__top { position: relative; margin-bottom: 40px; justify-content: center; }
.time-modal .catalog-modal__top > .catalog-icon-btn { position: absolute; top: 0; right: 0; }
.time-modal .catalog-modal__top h2 { font-size: 20px; }
.time-modal .time-field { gap: 20px; margin-bottom: 40px; font-size: 18px; }
.time-modal .time-field input[type="text"] { height: 56px; border: 0; font-size: 18px; }
.time-modal .time-field input[name="description"] { height: 64px; }
.time-modal .catalog-modal__actions { margin-top: 0; }
.time-sheet {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: min(900px, 100%);
}
.time-head,
.time-line {
    display: grid;
    grid-template-columns: 60px 20px minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 0;
}
.time-head {
    min-height: 63px;
    padding: 16px 24px;
    background: #deeaff;
    border-radius: 8px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.time-row {
    position: relative;
    min-height: 104px;
    padding: 20px 24px;
    background: #eaedf3;
    border-radius: 8px;
    box-sizing: border-box;
}
.time-line { margin: 0; }
.time-row--form { padding-right: 24px; }
.time-actions { display: flex; gap: 12px; }
.time-value { height: 56px; }
.catalog-upload-slot { margin-top: 20px; }
.time-field {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0 0 20px;
    border: 0;
    padding: 0;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.time-field input[type="text"],
.time-field textarea {
    width: 100%;
    margin: 0;
    padding: 16px 20px;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    background: #fff;
    font: inherit;
    font-weight: 400;
    box-sizing: border-box;
}
.time-field input[type="text"] { height: 56px; padding-top: 0; padding-bottom: 0; }
.time-tags { display: flex; gap: 20px; }
.time-tag { position: relative; }
.time-tag input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.time-tag span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 200px;
    height: 56px;
    border-radius: 8px;
    background: #fff;
    border: 2px solid #deeaff;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
}
.time-tag input:checked + span {
    border-color: transparent;
    background-image: linear-gradient(164deg, rgba(212, 155, 252, 0.45) 12%, rgba(139, 135, 240, 0.35) 50%, rgba(164, 242, 254, 0.45) 88%);
}

.dir-table {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.dir-head,
.dir-row__layout {
    display: grid;
    grid-template-columns: 60px 1px minmax(0, 750px) 1px minmax(180px, 1fr);
    column-gap: 20px;
    align-items: center;
}
.dir-head {
    padding: 20px 24px;
    background: #deeaff;
    border-radius: 8px;
}
.dir-head__num,
.dir-head__label,
.dir-num,
.dir-name__text,
.dir-spec-name {
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.3;
}
.dir-head__num,
.dir-head__label { font-size: 20px; }
.dir-rule {
    width: 1px;
    height: 20px;
    background: #000;
    justify-self: center;
}
.dir-row {
    margin: 0;
    padding: 20px 24px;
    background: #eaedf3;
    border-radius: 8px;
}
.dir-row__layout {
    grid-template-columns: 60px 1px minmax(0, 750px) 1px minmax(180px, 1fr) auto;
}
.dir-num { font-size: 22px; }
.dir-row--has-specs .dir-row__layout { align-items: start; }
.dir-row--has-specs .dir-rule--short { align-self: start; margin-top: 4px; }
.dir-row--has-specs .dir-rule--specs { align-self: stretch; height: auto; min-height: 20px; }
.dir-name {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 56px;
}
.dir-row[data-mode="view"] .dir-name,
.dir-row[data-mode="edit"] .dir-name { justify-content: flex-start; }
.dir-row--has-specs .dir-name { align-items: flex-start; }
.dir-name__text { margin: 0; font-size: 20px; }
.dir-specs {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    min-width: 0;
}
.dir-specs__list {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
[data-spec-list]:not(:has(.dir-spec-field)) { display: none; }
.dir-spec-name { font-size: 20px; }
.dir-spec-field { min-width: 0; }
.dir-name .dir-input { flex: 1 1 auto; min-width: 0; }
.dir-row .dir-input {
    display: block;
    width: 100%;
    height: 56px;
    margin: 0;
    padding: 0 20px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.04em;
    color: #000;
}
.dir-row .dir-input::placeholder { color: #b7b9be; opacity: 1; }
.dir-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    min-height: 56px;
    padding: 8px 4px;
    border: 0;
    background: transparent;
    color: #000;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.dir-ghost svg { flex-shrink: 0; }
.dir-actions {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-left: 20px;
}
.dir-actions__pair { display: flex; gap: 12px; }
.dir-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: #000;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    flex-shrink: 0;
}
.dir-icon--muted,
.dir-icon:disabled {
    background: #b7b9be;
    opacity: 1;
    cursor: default;
}
.dir-ghost:focus-visible,
.dir-icon:focus-visible {
    outline: 2px solid #4285f4;
    outline-offset: 2px;
}
.dir-row[data-mode="idle"] .dir-only-view,
.dir-row[data-mode="idle"] .dir-only-edit,
.dir-row[data-mode="view"] .dir-only-idle,
.dir-row[data-mode="view"] .dir-only-edit,
.dir-row[data-mode="edit"] .dir-only-idle,
.dir-row[data-mode="edit"] .dir-only-view { display: none !important; }

.catalog-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border: 0;
    border-radius: 8px;
    background: #000;
    color: #fff;
    text-decoration: none;
    flex-shrink: 0;
    cursor: pointer;
}
.catalog-icon-btn--sm { width: 44px; height: 44px; }
.catalog-icon-btn--ghost { background: #f2f9ff; color: #000; border: 2px solid #eaedf3; }
.catalog-icon-btn:disabled {
    opacity: 1;
    background: #000;
    color: #fff;
    cursor: default;
}

.catalog-inline-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
    background: #fff;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    box-sizing: border-box;
}
.catalog-inline-card__actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.catalog-split { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.catalog-muted { padding: 20px 24px; color: #a1a1a1; }

.catalog-modal {
    position: fixed;
    inset: 0;
    z-index: 40;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.catalog-modal[hidden] { display: none; }
.catalog-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}
.catalog-modal__box {
    position: relative;
    width: min(958px, 100%);
    background: #f2f9ff;
    border-radius: 8px;
    padding: 24px;
    box-shadow: none;
    box-sizing: border-box;
}
.catalog-modal__top {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 40px;
}
.catalog-modal__top > div { width: 100%; }
.catalog-modal__top h2 {
    margin: 0;
    text-align: center;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
    width: 100%;
}
.catalog-modal__journal {
    margin: 12px 0 0;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.04em;
    color: #b7b9be;
}
.catalog-modal__top > .catalog-icon-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 56px;
    height: 56px;
}
.catalog-modal__fields { display: flex; flex-direction: column; gap: 40px; }
.catalog-field span {
    display: block;
    margin-bottom: 8px;
    font-size: 18px;
    font-weight: 600;
}
.catalog-modal .catalog-field span {
    margin-bottom: 20px;
    letter-spacing: 0.04em;
}
.catalog-field input[type="text"],
.catalog-field input[type="number"],
.catalog-field input[type="date"],
.catalog-field select,
.catalog-field textarea {
    width: 100%;
    margin: 0;
    min-height: 56px;
    padding: 12px 16px;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    font-size: 18px;
    font-family: inherit;
    background: #fff;
    box-sizing: border-box;
}
.catalog-modal .catalog-field input[type="text"],
.catalog-modal .catalog-field input[type="number"],
.catalog-modal .catalog-field input[type="date"],
.catalog-modal .catalog-field select,
.catalog-modal .catalog-field textarea {
    border: 0;
    padding: 16px 20px;
    letter-spacing: 0.04em;
}
.catalog-modal .catalog-field input::placeholder,
.catalog-modal .catalog-field textarea::placeholder {
    color: #b7b9be;
    opacity: 1;
}
.catalog-field textarea { min-height: 120px; resize: vertical; }
.catalog-upload {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: 64px;
    color: #a1a1a1;
    font-size: 18px;
}
.catalog-modal__actions { display: flex; justify-content: flex-end; margin-top: 40px; }
.catalog-modal__actions .btn-add {
    width: 240px;
    height: 56px;
    font-size: 16px;
    gap: 20px;
}

.admin-desk { gap: 20px; }
.admin-desk__row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.admin-desk__row--3 { grid-template-columns: 1.2fr 0.9fr 0.9fr; }
.admin-block {
    background: #f2f9ff;
    border-radius: 8px;
    padding: 20px;
}
.admin-block__head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
}
.admin-block__head h2 { font-size: 22px; }
.admin-block__icon {
    display: inline-flex;
    width: 64px;
    height: 64px;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 8px;
}
.admin-block__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.admin-block__grid--3 { grid-template-columns: repeat(3, 1fr); }
.admin-mini {
    display: flex;
    align-items: flex-start;
    min-height: 140px;
    padding: 22px;
    background: #fff;
    border-radius: 8px;
    text-decoration: none;
    color: #000;
}
.admin-mini.disabled { cursor: default; }
.admin-mini:not(.disabled):hover {
    box-shadow:
        7px 7px 8px rgba(0, 0, 0, 0.06),
        -7px -7px 8px rgba(255, 255, 255, 0.68);
}
.admin-mini strong {
    display: block;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
    margin-bottom: 8px;
}
.admin-mini small {
    display: block;
    font-size: 16px;
    color: #000;
    letter-spacing: 0.04em;
}

@media (max-width: 1280px) {
    .catalog-grid,
    .admin-desk__row,
    .admin-desk__row--3,
    .catalog-empty--split,
    .catalog-split,
    .admin-block__grid,
    .admin-block__grid--3,
    .manager-desk__top,
    .ws-grid { grid-template-columns: 1fr; }
    .catalog-page__head--actions { flex-direction: column; }
    .btn-add--record { width: 100%; }
    .dir-head,
    .dir-row__layout { grid-template-columns: 40px 1px minmax(0, 1fr) 1px minmax(0, 1fr); }
    .dir-row__layout { grid-template-columns: 40px 1px minmax(0, 1fr) 1px minmax(0, 1fr) auto; }
    .dir-ghost { white-space: normal; }
    .dir-actions { margin-left: 0; }
}

.site-footer {
    display: flex;
    align-items: flex-start;
    padding: 30px 40px;
    background: #f2f9ff;
    flex-shrink: 0;
}

.site-footer__brand {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-logo-row {
    display: flex;
    align-items: flex-end;
    gap: 12px;
}

.footer-logo {
    position: relative;
    display: block;
    width: 99px;
    height: 32px;
    flex-shrink: 0;
}

.footer-logo__dots {
    position: absolute;
    left: 1px;
    top: 1px;
    width: 23px;
    height: 30px;
}

.footer-logo__word {
    position: absolute;
    left: 15px;
    top: 1px;
    width: 83px;
    height: 30px;
}

.footer-logo__mark {
    position: absolute;
    left: 93.46px;
    top: 9.2px;
    width: 3.41248px;
    height: 21.6242px;
}

.footer-dev {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.04em;
    color: #000;
}

.footer-tagline {
    margin: 0;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: #000;
}

.footer-site {
    color: #4285f4;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-decoration: none;
}

.manager-desk {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
}

.manager-desk__top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 40px;
    align-items: stretch;
}

.desk-panel {
    background: #deeaff;
    border-radius: 12px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-height: 556px;
    box-sizing: border-box;
}

.desk-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.desk-panel__title {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.desk-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    background: #eaedf3;
    flex-shrink: 0;
}

.desk-icon--soft { background: #f2f9ff; }
.desk-icon--blue { background: #deeaff; border-radius: 6px; }

.desk-panel__title h2,
.desk-stat__name,
.ws-page__head h1 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: #000;
}

.desk-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding: 0 8px;
    border-radius: 100px;
    background: #000;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}

.desk-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 220px;
    height: 56px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    box-sizing: border-box;
}

.desk-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.desk-request {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    height: 92px;
    padding: 12px 20px;
    border: 2px solid #deeaff;
    border-radius: 12px;
    background: #f2f9ff;
    box-sizing: border-box;
}

.desk-request__who {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.avatar--sm {
    width: 44px;
    height: 44px;
    font-size: 16px;
    padding: 3px;
}

.desk-request__text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.desk-request__text strong {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.desk-request__text span,
.desk-stat__meta,
.desk-board p {
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.04em;
}

.desk-request__time {
    color: #a1a1a1;
    font-size: 18px;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.desk-side {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.desk-period,
.desk-stat {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    min-height: 108px;
    padding: 20px;
    border-radius: 8px;
    box-sizing: border-box;
}

.desk-period {
    background: #deeaff;
    border: 2px solid #deeaff;
}

.desk-stat {
    background: #fff;
    border: 2px solid #deeaff;
}

.desk-stat-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.desk-stat__body {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}

.desk-users {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    max-width: 443px;
    min-height: 196px;
    padding: 20px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    box-sizing: border-box;
}

.desk-users__head {
    display: flex;
    align-items: center;
    gap: 20px;
}

.desk-users__head h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.desk-users__split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.desk-chip {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    min-height: 72px;
    padding: 4px 12px;
    border: 2px solid #deeaff;
    border-radius: 6px;
    box-sizing: border-box;
}

.desk-chip span { font-size: 16px; letter-spacing: 0.04em; }
.desk-chip strong { font-size: 18px; letter-spacing: 0.04em; }
.desk-chip--ok { background: #e9f3cd; }
.desk-chip--off { background: rgba(237, 61, 34, 0.25); }

.desk-board {
    min-height: 280px;
}

.desk-board p { margin: 0; }

.ws-page {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}

.ws-page__head {
    display: flex;
    align-items: center;
    gap: 20px;
}

.ws-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.ws-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-height: 166px;
    padding: 22px;
    border-radius: 8px;
    background: #fff;
    color: #000;
    text-decoration: none;
    box-sizing: border-box;
}

.ws-card--muted { cursor: default; }

a.ws-card:hover {
    box-shadow:
        7px 7px 8px rgba(0, 0, 0, 0.06),
        -7px -7px 8px rgba(255, 255, 255, 0.68);
}

.ws-card strong {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.ws-card span {
    font-size: 16px;
    letter-spacing: 0.04em;
}

.ws-section {
    background: #f2f9ff;
    border-radius: 8px;
    padding: 24px;
}

.data-hub {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}

.data-hub__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px;
    align-items: stretch;
}

.data-hub__row--bottom {
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
}

.data-group {
    display: flex;
    flex-direction: column;
    gap: 40px;
    min-width: 0;
    padding: 20px;
    border-radius: 12px;
    background: #deeaff;
    box-sizing: border-box;
}

.data-group__head {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.data-group__head h2 {
    margin: 0;
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
    color: #000;
}

.data-group__cards {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

.data-group__cards--pair {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.data-card {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    min-height: 173px;
    height: 100%;
    padding: 20px;
    border: 2px solid #deeaff;
    border-radius: 12px;
    background: #f2f9ff;
    color: #000;
    text-decoration: none;
    box-sizing: border-box;
}

a.data-card:hover {
    box-shadow:
        7px 7px 8px rgba(0, 0, 0, 0.06),
        -7px -7px 8px rgba(255, 255, 255, 0.68);
}

.data-card__text {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.data-card__text strong {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
}

.data-card__text span {
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.15;
}

@media (max-width: 1280px) {
    .data-hub__row,
    .data-hub__row--bottom { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 720px) {
    .data-group__cards--pair { grid-template-columns: minmax(0, 1fr); }
    .data-group__head h2 { font-size: 22px; }
}

.rates-year-box { background: #f2f9ff; }
.rates-year-form { display: flex; flex-direction: column; gap: 40px; }
.rates-year-form .catalog-modal__actions { margin-top: 0; }
.rates-year-head {
    position: relative;
    padding: 0 56px;
    text-align: center;
}
.rates-year-head h2 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.rates-year-head .catalog-modal__journal { margin-top: 12px; color: #b7b9be; }
.rates-year-x { position: absolute; top: 0; right: 0; }
.rates-year-field { position: relative; }
.rates-year-label {
    display: block;
    margin: 0 0 20px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.rates-yearline {
    position: absolute;
    z-index: 5;
    top: calc(100% + 12px);
    left: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    width: max-content;
    max-width: calc(100vw - 48px);
    box-sizing: border-box;
    padding: 12px;
    background: #f2f9ff;
    border-radius: 8px;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.26);
}
.rates-yearline[hidden] { display: none; }
.rates-yearline__list {
    display: grid;
    grid-template-columns: 200px 200px;
    gap: 12px;
    width: 412px;
    max-width: 100%;
}
.rates-year {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 200px;
    height: 56px;
    padding: 10px 20px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1;
    cursor: pointer;
}
.rates-year__icon { flex-shrink: 0; }
.rates-year.is-past { background: #eaedf3; }
.rates-year.is-current {
    background: #4285f4;
    color: #fff;
    border-color: #4285f4;
}
.rates-year:disabled,
.rates-year.is-taken {
    color: #b7b9be;
    cursor: default;
}
button.rates-arrow {
    padding: 0;
    border: 0;
    cursor: pointer;
    font-family: inherit;
}
button.rates-arrow:disabled { background: #b7b9be; cursor: default; }
.rates-use-line {
    display: flex;
    align-items: center;
    gap: 20px;
}
.rates-use {
    display: inline-flex;
    align-items: center;
    gap: 20px;
    font-size: 18px;
    letter-spacing: 0.04em;
    cursor: pointer;
}
.rates-use input {
    width: 24px;
    height: 24px;
    margin: 0;
    accent-color: #4285f4;
    flex-shrink: 0;
}
.rates-period-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 56px;
    margin-left: auto;
    padding: 0 20px;
    border: 0;
    border-radius: 8px;
    background: #4285f4;
    color: #fff;
    cursor: pointer;
    font-family: inherit;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.04em;
}
.rates-period-btn [data-period-text]:empty { display: none; }
.rates-cal {
    position: absolute;
    z-index: 6;
    top: 50%;
    left: calc(50% + 140px);
    width: 460px;
    max-width: calc(100% - 48px);
    transform: translateY(-42%);
}
.rates-cal[hidden] { display: none; }
.rates-cal__box {
    position: relative;
    width: 100%;
    padding: 20px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    box-sizing: border-box;
}
.rates-cal__head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}
.rates-cal__title {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 0;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.rates-cal__week,
.rates-cal__grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
}
.rates-cal__week {
    margin-top: 20px;
    border-bottom: 1px solid #b7b9be;
}
.rates-cal__week span {
    text-align: center;
    font-size: 18px;
    color: #000;
    letter-spacing: 0.04em;
    padding: 10px 0;
}
.rates-cal__grid { margin-top: 10px; }
.rates-cal__day {
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #000;
    font-family: inherit;
    font-size: 18px;
    letter-spacing: 0.04em;
    cursor: pointer;
}
.rates-cal__day.is-out { visibility: hidden; }
.rates-cal__day.is-range { background: #deeaff; border-radius: 0; }
.rates-cal__day.is-start,
.rates-cal__day.is-end { background: #4285f4; color: #fff; }
.rates-cal__actions {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 30px;
}
.rates-cal__cancel,
.rates-cal__ok {
    width: 200px;
    height: 56px;
    padding: 0 12px;
    border-radius: 8px;
    font-family: inherit;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
}
.rates-cal__cancel {
    background: #deeaff;
    color: #000;
    border: 0;
}
.rates-cal__ok {
    background: var(--ds-gradient-brand);
    color: #000;
    border: 2px solid #deeaff;
}
.catalog-modal__box--wide { width: min(1840px, 100%); }
.catalog-modal__backdrop { display: block; }

.rates-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 56px;
}
.rates-bar__switch,
.rates-switch,
.rates-bar__period {
    display: flex;
    align-items: center;
    gap: 20px;
}
.rates-switch { position: relative; gap: 12px; }
.rates-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 8px;
    background: #000;
    color: #fff;
    text-decoration: none;
    font-size: 28px;
    line-height: 1;
}
.rates-arrow--off { background: #b7b9be; }
.rates-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 177px;
    height: 56px;
    padding: 0 16px;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    background: #fff;
    color: #000;
    text-decoration: none;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.04em;
    box-sizing: border-box;
}
.rates-chip.is-current,
.rates-chip.is-open { background: #000; color: #fff; border-color: #000; }
.rates-chip--year { min-width: 200px; }
.rates-chip--period { min-width: 321px; }
.rates-bar__period > span {
    font-size: 18px;
    letter-spacing: 0.04em;
}
.rates-chip--project { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rates-add-year,
.rates-correct,
.rates-add,
.rates-modal-btn {
    height: 56px;
    font-size: 16px;
    letter-spacing: 0.04em;
}
.rates-add-year { width: 220px; height: 56px; font-size: 16px; padding: 0 12px; }
.rates-modal-btn { height: 56px; font-size: 16px; gap: 20px; }
.rates-correct { width: 300px; }
.rates-correct.is-pressed { box-shadow: 0 0 0 3px #4285f4; }
.rates-add { width: 300px; margin: 0 auto; }
.rates-modal-btn { width: 240px; }
.rates-tools { display: flex; }
.rates-table { display: flex; flex-direction: column; gap: 20px; }
.rates-head,
.rates-line {
    display: grid;
    grid-template-columns: 60px 1px minmax(160px, 1fr) 1px minmax(180px, 1fr) 1px minmax(240px, 1.4fr) auto;
    gap: 20px;
    align-items: center;
}
.rates-head {
    min-height: 109px;
    padding: 20px 24px;
    background: #deeaff;
    border-radius: 8px;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
}
.rates-block {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px 24px;
    background: #eaedf3;
    border-radius: 8px;
}
.rates-line {
    min-height: 64px;
    font-size: 20px;
    letter-spacing: 0.04em;
    line-height: 1.15;
}
.rates-num { font-weight: 600; }
.rates-rule { width: 1px; height: 20px; background: #000; justify-self: center; }
.rates-muted { color: #b7b9be; }
.rates-current { font-weight: 400; }
.rates-actions { display: flex; gap: 12px; justify-content: flex-end; }
.rates-edit { min-width: 0; }
.rates-input {
    display: block;
    width: 100%;
    height: 64px;
    margin: 0;
    padding: 0 16px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 20px;
    letter-spacing: 0.04em;
    color: #000;
}
.rates-input--short { width: 120px; }
.rates-input--date { width: 180px; }
.rates-table--corrected .rates-head,
.rates-table--corrected .rates-line {
    grid-template-columns: 48px 1px minmax(120px, 0.9fr) 1px minmax(120px, 0.9fr) 1px minmax(520px, 2.6fr) auto;
}
.rates-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
}
.rates-metrics--head { font-weight: 600; }
.rates-tip { position: relative; cursor: help; }
.rates-tip__box {
    display: none;
    position: absolute;
    z-index: 3;
    left: 0;
    bottom: calc(100% + 8px);
    width: max-content;
    max-width: 280px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #000;
    color: #fff;
    font-size: 14px;
    letter-spacing: 0.04em;
    line-height: 1.3;
}
.rates-tip:hover .rates-tip__box,
.rates-tip:focus .rates-tip__box { display: block; }
.rates-correct-body { display: flex; flex-direction: column; gap: 16px; }
.rates-correct-label { margin: 0; font-size: 18px; font-weight: 600; letter-spacing: 0.04em; }
.rates-tags { display: flex; flex-wrap: wrap; gap: 12px; }
.rates-tag { position: relative; display: inline-flex; cursor: pointer; }
.rates-tag input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}
.rates-tag__num,
.rates-tag__name {
    display: inline-flex;
    align-items: center;
    height: 56px;
    background: #f2f9ff;
    border: 2px solid #eaedf3;
}
.rates-tag__num {
    width: 56px;
    justify-content: center;
    border-radius: 8px 0 0 8px;
    border-right: 0;
    font-weight: 600;
}
.rates-tag__name {
    padding: 0 16px;
    border-radius: 0 8px 8px 0;
    font-size: 16px;
    letter-spacing: 0.04em;
}
.rates-tag input:checked + .rates-tag__num,
.rates-tag input:checked + .rates-tag__num + .rates-tag__name {
    background: #000;
    color: #fff;
    border-color: #000;
}
.rates-choice {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    min-height: 56px;
    font-size: 18px;
    letter-spacing: 0.04em;
}
.rates-choice input[type="radio"] { width: 18px; height: 18px; margin: 0; }

@media (max-width: 1100px) {
    .rates-bar { flex-direction: column; align-items: stretch; }
    .rates-chip--period { min-width: 0; }
    .rates-use-line { flex-wrap: wrap; }
    .rates-period-btn { margin-left: 0; }
    .rates-cal { left: 24px; right: 24px; width: auto; top: auto; bottom: 24px; transform: none; }
}

input[type="text"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
textarea:focus,
select:focus {
    outline: none;
    box-shadow: none;
}

/* Группы проектов: единый сценарий группа → тип/вид → этапы → состав этапа. */
.project-catalog { gap: 40px; }
.project-catalog .catalog-page__head h1 { line-height: 1; }
.project-catalog .catalog-modal__box { background: #f2f9ff; }
.project-catalog .catalog-modal__top {
    position: relative;
    margin-bottom: 40px;
}
.project-catalog .catalog-modal__top > div { width: 100%; }
.project-catalog .catalog-modal__top > .catalog-icon-btn {
    position: absolute;
    top: 0;
    right: 0;
}
.project-catalog .catalog-modal__actions { margin-top: 40px; }
.project-catalog .catalog-modal__actions .btn-add { width: 200px; height: 56px; }
.project-catalog .catalog-field input[type="text"],
.project-catalog .catalog-field textarea { border: 0; }

.project-groups,
.project-stages,
.project-work {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.project-group,
.project-work__block {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.project-group__head,
.project-work__head {
    display: grid;
    align-items: center;
    min-height: 64px;
    padding: 0 24px;
    background: #deeaff;
    border-radius: 8px;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: .04em;
    box-sizing: border-box;
}
.project-group__head { grid-template-columns: 80px 340px 640px minmax(320px, 1fr); }
.project-group__head > span + span,
.project-work__head > span + span { border-left: 1px solid #777; padding-left: 20px; }
.project-group__body {
    position: relative;
    display: grid;
    grid-template-columns: 80px 340px 640px minmax(320px, 1fr) 140px;
    align-items: start;
    min-height: 208px;
    padding: 20px;
    padding-bottom: 104px;
    background: #eaedf3;
    border-radius: 8px;
    box-sizing: border-box;
    margin: 0;
}
.project-group__hiddens {
    display: none;
}
.project-group__number {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    align-items: center;
    min-height: 56px;
    font-size: 18px;
}
.project-group__column--group { grid-column: 2; grid-row: 1; justify-content: flex-start; }
.project-group__column--types { grid-column: 3; grid-row: 1; }
.project-group__column--kinds { grid-column: 4; grid-row: 1; }
.project-group__actions { grid-column: 5; grid-row: 1; }
.project-group__column:has(.project-inline-add) { justify-content: flex-start; }
.project-group__column,
.project-work__column {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: stretch;
    gap: 28px;
    min-width: 0;
    min-height: 168px;
    padding: 0 20px;
    border-left: 1px solid #777;
}
.project-tags {
    display: grid;
    grid-template-columns: repeat(2, minmax(120px, 1fr));
    gap: 12px;
    align-content: start;
}
.project-group__column--group .project-tags { grid-template-columns: 1fr; }
.project-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 56px;
    padding: 8px 12px;
    border-radius: 8px;
    background: #deeaff;
    color: #000;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: .04em;
    box-sizing: border-box;
}
.project-add-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    color: #000;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: .04em;
}
.project-add-link--disabled,
.project-group__stages--disabled { color: #b7b9be; pointer-events: none; }
.btn-add--disabled,
.catalog-icon-btn--disabled {
    background: #b7b9be;
    color: #fff;
    cursor: default;
    pointer-events: none;
    box-shadow: none;
}
.project-inline-add {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
    width: 100%;
    margin: 0;
}
.project-inline-add [data-inline-list] {
    display: grid;
    grid-template-columns: repeat(2, minmax(120px, 1fr));
    gap: 12px;
    width: 100%;
}
.project-inline-add .btn-add { width: min(268px, 100%); }
.project-inline-add input,
.project-tag-input {
    display: block;
    width: 100%;
    height: 56px;
    min-height: 56px;
    margin: 0;
    padding: 12px 16px;
    border: 0;
    border-radius: 8px;
    font: inherit;
    box-sizing: border-box;
    background: #fff;
}
.project-group__body--editing .project-tag,
.project-tag-input {
    background: #fff;
}
.project-group__actions {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 12px;
    align-self: start;
}
.project-group__stages {
    position: absolute;
    right: 20px;
    bottom: 20px;
    width: 320px;
}

.project-stage-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    color: #000;
    text-decoration: none;
}
.project-stage-card__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}
.project-stage-card__top-end {
    display: flex;
    align-items: center;
    gap: 16px;
}
.project-stage-card__badge {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 20px;
    border-radius: 8px;
    background: #deeaff;
    color: #4285f4;
    font-size: 20px;
    font-weight: 600;
}
.project-stage-card strong { font-size: 25px; letter-spacing: .04em; }
.project-stage-card__open {
    display: flex;
    flex-direction: column;
    gap: 12px;
    color: #000;
    text-decoration: none;
}
.project-stage-card__open > span { font-size: 20px; letter-spacing: .04em; }

.project-work__head { grid-template-columns: 340px 340px 340px minmax(420px, 1fr); }
.project-work__body {
    position: relative;
    display: grid;
    grid-template-columns: 340px 340px 340px minmax(420px, 1fr);
    min-height: 280px;
    padding: 20px 168px 20px 20px;
    background: #eaedf3;
    border-radius: 8px;
    box-sizing: border-box;
}
.project-work__body[data-mode="view"] .project-only-edit,
.project-work__body[data-mode="edit"] .project-only-view { display: none; }
.project-work__column:first-child { border-left: 0; }
.project-work__column > .project-only-edit { width: 100%; }
.project-work__column .project-tags {
    width: 100%;
    grid-template-columns: 1fr;
}
.project-work__column .project-tag,
.project-work__column .project-tag-input,
.project-work__column .project-inline-field {
    width: 100%;
}
.project-tags--two { grid-template-columns: repeat(2, minmax(160px, 1fr)); }
.project-work__column .project-tags--two { grid-template-columns: repeat(2, minmax(160px, 1fr)); }
.project-inline-field { min-width: 0; }
.project-work__actions {
    position: absolute;
    top: 20px;
    right: 20px;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 12px;
}
.project-work__actions-pair {
    display: flex;
    gap: 12px;
}

@media (max-width: 1500px) {
    .project-group__head { grid-template-columns: 60px 220px 1fr 1fr; }
    .project-group__body { grid-template-columns: 60px 220px 1fr 1fr 140px; }
    .project-work__head,
    .project-work__body { grid-template-columns: repeat(3, minmax(210px, 1fr)) minmax(300px, 1.5fr); }
}
@media (max-width: 1000px) {
    .project-group,
    .project-work__block { overflow-x: auto; }
    .project-group__head,
    .project-group__body,
    .project-work__head,
    .project-work__body { min-width: 1160px; }
}

.complexity-groups {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.complexity-row {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.complexity-row__head {
    display: grid;
    grid-template-columns: 104px 340px minmax(220px, 1fr) minmax(220px, 1fr);
    align-items: center;
    min-height: 64px;
    padding: 0 24px;
    background: #deeaff;
    border-radius: 8px;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: .04em;
    box-sizing: border-box;
}
.complexity-row__head > span + span {
    border-left: 1px solid #777;
    padding-left: 20px;
}
.complexity-row__body {
    display: grid;
    grid-template-columns: 104px 340px minmax(180px, 1fr) minmax(180px, 1fr) 140px;
    align-items: center;
    gap: 0;
    min-height: 104px;
    margin: 0;
    padding: 20px;
    background: #eaedf3;
    border-radius: 8px;
    box-sizing: border-box;
}
.complexity-row__body:has(.complexity-item),
.complexity-row__body:has(.complexity-inline) { align-items: start; }
.complexity-row__number {
    display: flex;
    align-items: center;
    min-height: 56px;
    font-size: 18px;
}
.complexity-row__group,
.complexity-row__main {
    min-width: 0;
    min-height: 56px;
    padding: 0 20px;
    border-left: 1px solid #777;
}
.complexity-row__main { grid-column: 3 / 5; }
.complexity-row__actions { grid-column: 5; }
.complexity-row__group .project-tag {
    width: 100%;
    max-width: 300px;
}
.complexity-row__main {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
}
.complexity-row__main--empty {
    align-items: center;
    justify-content: center;
}
.complexity-row__actions {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 12px;
}
.complexity-item {
    display: grid;
    grid-template-columns: minmax(180px, 280px) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    padding: 16px 20px;
    background: #deeaff;
    border-radius: 8px;
}
.complexity-item__name {
    padding-top: 16px;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: .04em;
    line-height: 1.35;
}
.complexity-item__notes {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    min-width: 0;
}
.complexity-item__notes .project-add-link,
.complexity-row__main > .project-add-link,
.complexity-inline .project-add-link { align-self: center; }
.complexity-note,
.complexity-note-input,
.complexity-inline input,
.complexity-inline textarea,
.complexity-item__notes textarea {
    width: 100%;
    margin: 0;
    padding: 12px 16px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    box-sizing: border-box;
    font: inherit;
    font-size: 16px;
    line-height: 1.4;
}
.complexity-note {
    min-height: 64px;
    background: #deeaff;
    border: 1px solid #8b929f;
}
.complexity-note-input,
.complexity-item__notes textarea,
.complexity-inline textarea {
    min-height: 86px;
    resize: vertical;
}
.complexity-inline {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
    width: 100%;
}
.complexity-inline [data-inline-list],
.complexity-item__notes [data-inline-list] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.complexity-inline input { height: 64px; }
.complexity-item__name .project-tag-input { background: #fff; }
.complexity-modal-hint {
    margin: 8px 0 0;
    color: #555;
    font-size: 15px;
}
@media (max-width: 1500px) {
    .complexity-row__head { grid-template-columns: 72px 240px minmax(180px, 1fr) minmax(180px, 1fr); }
    .complexity-row__body { grid-template-columns: 72px 240px minmax(160px, 1fr) minmax(160px, 1fr) 140px; }
}
@media (max-width: 1000px) {
    .complexity-row { overflow-x: auto; }
    .complexity-row__head,
    .complexity-row__body { min-width: 1100px; }
}

.roles-groups .catalog-head-actions .btn-add,
.roles-catalog .catalog-head-actions .btn-add,
.roles-groups .catalog-empty .btn-add {
    height: 64px;
    padding: 0 24px;
    font-size: 16px;
}
.role-sheet { position: relative; padding: 0; }
.role-sheet__open {
    display: flex;
    flex-direction: column;
    gap: 40px;
    min-height: 192px;
    padding: 20px 96px 20px 20px;
    color: inherit;
    text-decoration: none;
}
.role-sheet__edit {
    position: absolute;
    top: 20px;
    right: 20px;
}
.role-sheet .catalog-sheet__ok { margin-right: 8px; }

.transfer-catalog .btn-add { font-size: 16px; }
.transfer-catalog .catalog-modal__box {
    background: #f2f9ff;
    box-shadow: none;
}
.transfer-catalog .catalog-modal__top > .catalog-icon-btn {
    position: absolute;
    top: 0;
    right: 0;
}
.transfer-catalog .catalog-modal__journal { color: #b7b9be; margin-top: 12px; }
.transfer-catalog .catalog-field span { margin-bottom: 20px; letter-spacing: 0.04em; }
.transfer-catalog .catalog-field input[type="text"] {
    border: 0;
    min-height: 56px;
    padding: 16px 20px;
    letter-spacing: 0.04em;
}
.transfer-catalog .catalog-field input::placeholder { color: #b7b9be; }
.transfer-catalog .catalog-modal__actions { margin-top: 40px; }
.transfer-catalog .catalog-modal__actions .btn-add { width: 240px; height: 56px; }

.transfer-table {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.transfer-item { position: relative; }
.transfer-item.is-open { z-index: 6; }
.transfer-line {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 20px 24px;
    border-radius: 8px;
    box-sizing: border-box;
}
.transfer-line--head {
    align-items: center;
    background: #deeaff;
    min-height: 86px;
}
.transfer-line--row { background: #eaedf3; }
.transfer-num,
.transfer-name,
.transfer-logo,
.transfer-desc,
.transfer-site {
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
    color: #000;
}
.transfer-num { flex: 0 0 60px; width: 60px; }
.transfer-name { flex: 0 0 312px; width: 312px; }
.transfer-logo {
    flex: 0 0 320px;
    width: 320px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
}
.transfer-desc { flex: 0 0 390px; width: 390px; }
.transfer-site { flex: 1 1 200px; min-width: 160px; }
.transfer-rule {
    flex: 0 0 1px;
    width: 1px;
    height: 20px;
    margin-top: 2px;
    background: #000;
}
.transfer-line--row .transfer-rule { height: 64px; }
.transfer-actions {
    flex: 0 0 auto;
    display: flex;
    gap: 12px;
    margin-left: auto;
}
.transfer-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 56px;
    height: 46px;
    padding: 0 8px;
    border-radius: 8px;
    background: #fff;
}
.transfer-name__input,
.transfer-desc textarea,
.transfer-site input {
    width: 100%;
    margin: 0;
    border: 0;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font: inherit;
    letter-spacing: 0.04em;
    box-sizing: border-box;
}
.transfer-name__input {
    min-height: 46px;
    padding: 8px 12px;
    background: transparent;
}
.transfer-desc textarea,
.transfer-site input {
    min-height: 64px;
    padding: 16px 20px;
    font-size: 16px;
    font-weight: 400;
}
.transfer-desc textarea { min-height: 120px; resize: vertical; }
.transfer-upload,
.transfer-add,
.transfer-drop__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    height: 64px;
    padding: 0 20px;
    border-radius: 8px;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
}
.transfer-upload,
.transfer-drop__btn {
    width: 100%;
    background: #000;
    color: #fff;
}
.transfer-upload img,
.transfer-drop__btn img { flex: 0 0 auto; }
.transfer-add {
    width: auto;
    justify-content: flex-start;
    padding: 0;
    background: transparent;
    color: #000;
}
.transfer-text {
    display: block;
    color: #000;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.02em;
    line-height: 1.35;
    text-decoration: none;
}
.transfer-edit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    background: transparent;
}
.transfer-logo__frame {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 124px;
    height: 56px;
    border-radius: 8px;
    background: #fff;
}
.transfer-logo__frame img {
    max-width: 108px;
    max-height: 44px;
    object-fit: contain;
}
.transfer-drop__shade {
    position: fixed;
    inset: 0;
    z-index: 1;
    background: transparent;
}
.transfer-drop {
    position: absolute;
    z-index: 2;
    left: 478px;
    top: calc(100% - 16px);
    width: min(538px, calc(100vw - 80px));
    height: 288px;
    margin: 0;
}
.transfer-drop__zone {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    height: 100%;
    padding: 28px 16px 16px;
    border: 2px solid #deeaff;
    border-radius: 12px;
    background: #f2f9ff;
    box-sizing: border-box;
    text-align: center;
    cursor: pointer;
}
.transfer-drop__zone::before {
    content: "";
    position: absolute;
    inset: 10px;
    border: 2px dashed #c5d7f2;
    border-radius: 8px;
    pointer-events: none;
}
.transfer-drop__zone.is-over { background: #fff; }
.transfer-drop__text {
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.25;
    color: #000;
}
.transfer-drop__btn { width: 240px; height: 56px; }
.transfer-drop__hint {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #b7b9be;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.04em;
}
@media (max-width: 1400px) {
    .transfer-table { overflow-x: auto; }
    .transfer-line { min-width: 1600px; }
}

.role-table {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.role-head,
.role-card__line {
    display: grid;
    grid-template-columns: 60px 1px minmax(140px, 220px) 1px minmax(160px, 280px) 1px minmax(220px, 1.35fr) 1px minmax(180px, 1fr) auto;
    column-gap: 20px;
    align-items: start;
}
.role-head {
    align-items: center;
    padding: 20px 24px;
    background: #deeaff;
    border-radius: 8px;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.role-head__act { width: 64px; }
.role-head .role-rule {
    width: 1px;
    height: 20px;
    background: #000;
    justify-self: center;
}
.role-card {
    margin: 0;
    padding: 20px 24px;
    background: #eaedf3;
    border-radius: 8px;
}
.role-card--edit { background: #fff; }
.role-card__line--empty {
    grid-template-columns: 60px 1px minmax(0, 520px) 1px minmax(0, 1fr) 64px;
    align-items: center;
}
.role-card__line .role-rule {
    align-self: stretch;
    width: 1px;
    min-height: 20px;
    background: #000;
    justify-self: center;
}
.role-num,
.role-name {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.3;
}
.role-desc,
.role-level,
.role-funcs {
    font-size: 16px;
    letter-spacing: 0.04em;
    line-height: 1.35;
}
.role-level p,
.role-funcs p { margin: 0; }
.role-funcs {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.role-add {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-height: 64px;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-decoration: none;
}
.role-idle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    color: #b7b9be;
}
.role-card__actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.role-input {
    display: block;
    width: 100%;
    margin: 0;
    min-height: 56px;
    padding: 12px 16px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    box-sizing: border-box;
    font: inherit;
    font-size: 16px;
    letter-spacing: 0.04em;
    color: #000;
}
textarea.role-input {
    min-height: 88px;
    resize: vertical;
}
.role-input::placeholder { color: #b7b9be; }
.role-access {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}
.role-access__label {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.role-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.role-tag {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 200px;
    min-height: 56px;
    padding: 8px 12px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    box-sizing: border-box;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
    cursor: pointer;
}
.role-tag input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.role-tag:has(input:checked),
.role-tag--on {
    background: var(--ds-gradient-brand);
}
.role-tag--on { cursor: default; }
.role-tag:hover { box-shadow: var(--ds-shadow-hover); }
.role-tag--on:hover { box-shadow: none; }
.role-tag:focus-within {
    outline: 2px solid #4285f4;
    outline-offset: 2px;
}
.role-access-field {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}
.role-access-field legend {
    margin-bottom: 20px;
    padding: 0;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.roles-modal.catalog-modal {
    align-items: stretch;
    justify-content: stretch;
    padding: 0;
    overflow: hidden;
}
.roles-modal .catalog-modal__backdrop {
    position: fixed;
    background: #f2f9ff;
}
.roles-modal .catalog-modal__box {
    flex: 1 1 auto;
    align-self: stretch;
    width: 100%;
    max-width: none;
    min-height: 0;
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #f2f9ff;
    border-radius: 0;
    box-shadow: none;
    padding: 24px 40px 40px;
}
.roles-modal form {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 80px);
}
.roles-modal .catalog-modal__top {
    position: relative;
    display: block;
    margin-bottom: 40px;
    text-align: center;
}
.roles-modal .catalog-modal__top h2 {
    font-size: 22px;
    letter-spacing: 0.04em;
}
.roles-modal .catalog-modal__journal {
    margin-top: 12px;
    color: #b7b9be;
    font-size: 14px;
    letter-spacing: 0.04em;
}
.roles-modal .catalog-modal__top .catalog-icon-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 56px;
    height: 56px;
}
.roles-modal .catalog-modal__fields { gap: 40px; }
.roles-modal .catalog-field span {
    margin-bottom: 20px;
    font-size: 18px;
    letter-spacing: 0.04em;
}
.roles-modal .catalog-field input[type="text"] {
    border: 0;
    min-height: 56px;
    padding: 16px 20px;
    font-size: 18px;
    letter-spacing: 0.04em;
}
.roles-modal .catalog-field input.role-input--tall { min-height: 64px; }
.roles-modal .catalog-field input::placeholder { color: #b7b9be; }
.roles-modal .catalog-modal__actions {
    margin-top: auto;
    padding-top: 40px;
}
.roles-modal .catalog-modal__actions .btn-add {
    width: 240px;
    height: 56px;
    font-size: 16px;
}

.roles-board {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.roles-board__head,
.roles-row__line {
    display: grid;
    grid-template-columns: 48px 1px minmax(220px, 340px) 1px minmax(0, 1fr) 64px;
    column-gap: 20px;
    align-items: start;
}
.roles-board__head {
    align-items: center;
    min-height: 64px;
    padding: 20px 24px;
    border-radius: 8px;
    background: #deeaff;
    box-sizing: border-box;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.roles-board__rule {
    width: 1px;
    height: 20px;
    background: #000;
    justify-self: center;
}
.roles-row__line .roles-board__rule { align-self: stretch; height: auto; min-height: 20px; }
.roles-fill {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 86px;
    border-radius: 8px;
    background: #eaedf3;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-decoration: none;
}
.roles-row {
    padding: 20px 24px;
    border-radius: 8px;
    background: #eaedf3;
}
.roles-row__num,
.roles-row__who strong {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.3;
}
.roles-row__who {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}
.roles-row__who span {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.35;
}
.roles-row__levels {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}
.roles-level,
.roles-func {
    margin: 0;
    padding: 16px 20px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.35;
}
.roles-level { background: #deeaff; }
.roles-func {
    background: #fff;
    border: 2px solid #deeaff;
}
.roles-access {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #c5c9d2;
}
.roles-access__toggle {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    padding: 8px 16px;
    border: 0;
    border-radius: 8px;
    background: #f2f9ff;
    color: #000;
    font: inherit;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
}
.roles-access__chevron { transition: transform 0.15s ease; }
.roles-access:not(.is-open) .roles-access__chevron { transform: rotate(-90deg); }
.roles-access__panel { display: none; margin-top: 16px; }
.roles-access.is-open .roles-access__panel { display: flex; flex-direction: column; gap: 16px; }
.roles-access__panel {
    padding: 20px;
    border-radius: 8px;
    background: #f2f9ff;
}
.roles-access.is-open .roles-access__panel { display: flex; }
.roles-access__row {
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr);
    gap: 12px 24px;
    align-items: center;
}
.roles-access__name,
.roles-grants__name {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.25;
}
.roles-access__tags,
.roles-grants__row .role-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.roles-form { display: flex; flex-direction: column; gap: 28px; }
.roles-form__pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.roles-form__level { display: flex; flex-direction: column; gap: 20px; }
.roles-form__level + .roles-form__level {
    margin-top: 28px;
    padding-top: 28px;
    border-top: 1px solid #deeaff;
}
.roles-func-add {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.roles-func-add [data-functions] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}
.roles-form .role-input {
    border: 0;
    min-height: 56px;
    font-size: 18px;
}
.roles-form__add-level {
    align-self: flex-start;
    height: 64px;
    padding: 0 24px;
    font-size: 16px;
}
.roles-grants { display: flex; flex-direction: column; gap: 16px; }
.roles-grants__row {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 12px 24px;
    align-items: center;
}
.roles-modal .role-tag {
    width: 200px;
    min-height: 56px;
    height: auto;
}
.roles-access .role-tag--on { width: 200px; min-height: 56px; height: auto; }
@media (max-width: 1100px) {
    .roles-board { overflow-x: auto; }
    .roles-board__head,
    .roles-row__line { min-width: 980px; }
    .roles-form__pair,
    .roles-grants__row,
    .roles-access__row { grid-template-columns: 1fr; }
}

.companies-catalog .catalog-modal__box {
    background: #f2f9ff;
    display: flex;
    flex-direction: column;
}
.companies-catalog .catalog-modal__top {
    position: relative;
    display: block;
    margin-bottom: 0;
}
.companies-catalog .catalog-modal__top > div { width: 100%; }
.companies-catalog .catalog-modal__top h2 {
    font-size: 20px;
    letter-spacing: 0.04em;
}
.companies-catalog .catalog-modal__journal {
    margin-top: 12px;
    color: #b7b9be;
    font-size: 14px;
    letter-spacing: 0.04em;
}
.companies-catalog .catalog-modal__top .catalog-icon-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 44px;
    height: 44px;
}
.companies-catalog .catalog-modal__fields { gap: 40px; margin-top: 40px; }
.companies-catalog .catalog-field span {
    margin-bottom: 20px;
    font-size: 18px;
    letter-spacing: 0.04em;
}
.companies-catalog .catalog-field input[type="text"] {
    border: 0;
    min-height: 56px;
    padding: 16px 20px;
    font-size: 18px;
    letter-spacing: 0.04em;
}
.companies-catalog .catalog-field input::placeholder { color: #b7b9be; opacity: 1; }
.companies-catalog .catalog-field { margin: 0; }
.companies-catalog .catalog-field--logo > span { text-align: left; }
.companies-catalog .catalog-upload {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 20px;
    min-height: 64px;
    margin: 0;
    color: #b7b9be;
    font-size: 16px;
    letter-spacing: 0.04em;
}
.companies-catalog .catalog-logo-btn {
    position: relative;
    width: 64px;
    height: 64px;
    margin: 0;
    overflow: hidden;
}
.companies-catalog .catalog-logo-btn input[type="file"] {
    display: none;
}
.companies-catalog .catalog-upload [data-logo-name].is-filled { color: #000; }
.companies-catalog .catalog-modal__actions { margin-top: 40px; }
.companies-catalog .catalog-modal__actions .btn-add {
    width: 240px;
    height: 56px;
    font-size: 16px;
    gap: 20px;
}

.catalog-cards--companies { gap: 20px; }
.catalog-cards--companies .catalog-entity-card--logo {
    width: 340px;
    min-height: 179px;
    padding: 20px 28px;
    gap: 20px;
    border-color: #deeaff;
    justify-content: center;
}
.catalog-cards--companies .catalog-entity-card__logo-slot {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 56px;
}
.catalog-cards--companies .catalog-entity-card__logo {
    width: auto;
    height: auto;
    max-width: 160px;
    max-height: 56px;
}
.catalog-cards--companies .catalog-entity-card__name {
    font-size: 18px;
    line-height: 1.15;
    text-align: center;
}

.company-boards {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.company-sheet {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 24px;
    background: #deeaff;
    border-radius: 16px;
}
.company-sheet__actions {
    position: absolute;
    top: 24px;
    right: 24px;
    display: flex;
    gap: 12px;
}
.company-icon--idle {
    background: #eaedf3;
    cursor: default;
}
.company-sheet__head,
.company-sheet__row {
    display: grid;
    column-gap: 20px;
    align-items: center;
}
.company-sheet--company .company-sheet__head,
.company-sheet--company .company-sheet__row {
    grid-template-columns: 60px minmax(220px, 512px) minmax(0, 1fr);
}
.company-sheet--req .company-sheet__head,
.company-sheet--req .company-sheet__row {
    grid-template-columns: 60px minmax(0, 1fr) minmax(0, 1fr);
}
form.company-sheet { margin: 0; }
.company-sheet__head { align-items: flex-start; }
.company-col {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
}
.company-col--num { width: 60px; }
.company-col img,
.company-add img,
.company-icon--idle img { flex-shrink: 0; }
.company-rows {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.company-sheet__row { align-items: stretch; }
.company-cell {
    display: flex;
    align-items: center;
    min-width: 0;
    min-height: 64px;
    padding: 20px;
    border-radius: 8px;
    background: #eaedf3;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.15;
    box-sizing: border-box;
}
.company-cell--num {
    justify-content: center;
    padding: 20px 8px;
}
.company-cell--value,
.company-text {
    font-weight: 400;
}
.company-text { margin: 0; }
.company-cell--plain {
    background: transparent;
    padding: 0;
    justify-content: center;
}
.company-cell--text:not(.company-cell--plain) {
    background: transparent;
    padding: 0 4px;
    align-items: center;
}
.company-cell--edit { padding: 0; background: transparent; }
.company-hint { font-weight: 400; }
.company-add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    min-height: 56px;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-decoration: none;
}
.company-input {
    display: block;
    width: 100%;
    min-height: 64px;
    margin: 0;
    padding: 16px 20px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
    font-family: inherit;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.15;
    color: #000;
    box-sizing: border-box;
}
textarea.company-input { min-height: 86px; resize: vertical; }
.company-input::placeholder { color: #b7b9be; opacity: 1; }
.company-input:focus { outline: none; }

.settings-hub { gap: 40px; }
.settings-hub__group {
    width: min(587px, 100%);
    padding: 24px;
}
.settings-hub__group .data-group__head h2 {
    font-size: 20px;
    line-height: 1;
}
.settings-hub__card {
    min-height: 140px;
    height: 140px;
    align-items: flex-start;
}
.settings-hub__card .desk-icon--blue { border-radius: 6px; }

.integ-table .integ-col--num {
    flex: 0 0 60px;
    width: 60px;
    font-weight: 600;
}
.integ-table .integ-col--name { flex: 0 0 369px; width: 369px; }
.integ-table .integ-col--desc { flex: 0 0 500px; width: 500px; }
.integ-table .integ-col--site { flex: 1 1 0; min-width: 0; }
.integ-table .catalog-table__row .catalog-table__main {
    align-items: stretch;
}
.integ-table .catalog-table__row .catalog-table__col {
    display: flex;
    align-items: center;
}
.integ-table .catalog-table__row .catalog-table__rule {
    height: auto;
    min-height: 56px;
    margin-top: 0;
    align-self: stretch;
}
.integ-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 300px;
    min-height: 56px;
    padding: 12px 24px;
    border-radius: 8px;
    background: #b7b9be;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    text-align: center;
    box-sizing: border-box;
    word-break: break-word;
}
.integ-chip--link {
    text-decoration: none;
}
.integ-chip--link:hover { text-decoration: underline; }
.integ-site-add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    min-height: 56px;
    padding: 0 20px;
    color: #000;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-decoration: none;
    white-space: nowrap;
}
.integ-site-add svg { display: block; flex-shrink: 0; }
.integ-site-input {
    display: block;
    width: 100%;
    max-width: 583px;
    height: 53px;
    margin: 0;
    padding: 0 16px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    font-family: inherit;
    font-size: 18px;
    letter-spacing: 0.04em;
    color: #000;
    box-sizing: border-box;
}
.integ-site-input:focus { outline: none; }
.integ-site-input::placeholder { color: #b7b9be; }
.integ-edit img {
    display: block;
    filter: brightness(0) invert(1);
}

@media (max-width: 1400px) {
    .integ-table .integ-col--name,
    .integ-table .integ-col--desc { flex: 1 1 180px; width: auto; }
    .integ-chip { width: min(300px, 100%); }
}

@media (max-width: 900px) {
    .integ-table .catalog-table__head,
    .integ-table .catalog-table__row { flex-wrap: wrap; }
    .integ-table .catalog-table__main { flex-wrap: wrap; }
    .integ-table .integ-col--name,
    .integ-table .integ-col--desc,
    .integ-table .integ-col--site { flex: 1 1 100%; width: 100%; }
    .integ-table .catalog-table__rule { display: none; }
    .integ-site-add { white-space: normal; }
}

.client-page { gap: 20px; }
.client-form { display: flex; flex-direction: column; gap: 40px; }
.client-block {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    border-radius: 8px;
    background: #e8f2ff;
}
.client-block__title {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.client-block__title img { width: 32px; height: 32px; flex-shrink: 0; }
.client-field { display: flex; flex-direction: column; gap: 12px; position: relative; }
.client-field > span {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.client-field input[type="text"],
.client-row input[type="text"] {
    width: 100%;
    height: 64px;
    margin: 0;
    padding: 0 20px;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font: 400 18px/1.2 "Roboto", "Segoe UI", Tahoma, sans-serif;
    letter-spacing: 0.04em;
    box-sizing: border-box;
}
.client-field input::placeholder,
.client-row input::placeholder { color: #b7b9be; }
.client-form.is-locked input[type="text"] {
    background: #eaedf3;
    border-color: transparent;
    color: #000;
}
.client-muted { margin: 0; color: #b7b9be; font-size: 18px; }
.client-btn {
    width: 320px;
    max-width: 100%;
    font-size: 18px;
    text-decoration: none;
    color: #fff;
}
.client-btn img { width: 32px; height: 32px; }
button.client-btn:disabled,
.client-form.is-locked button.client-btn[type="submit"] {
    background: #eaedf3;
    color: #b7b9be;
    box-shadow: none;
    cursor: default;
}
.client-logo { position: relative; display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.client-upload-line {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}
.client-upload-line p { margin: 0; color: #000; font-size: 16px; letter-spacing: 0.02em; }
.client-drop {
    position: absolute;
    z-index: 4;
    top: 108px;
    left: 280px;
    width: 360px;
    padding: 28px 24px;
    border: 2px dashed #b7c3d6;
    border-radius: 8px;
    background: #f7fbff;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
    text-align: center;
}
.client-drop.is-over { border-color: #4285f4; }
.client-drop__lead { margin: 0 0 16px; font-size: 16px; line-height: 1.35; }
.client-drop__hint { margin: 12px 0 0; color: #a1a1a1; font-size: 14px; }
.client-drop .client-btn { width: 100%; }
.client-logo-name { margin: 0; font-size: 16px; }
.client-logo-chip {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    max-width: 400px;
    height: 64px;
    padding: 0 16px 0 8px;
    border-radius: 8px;
    background: #fff;
    font-size: 16px;
    font-weight: 600;
}
.client-logo-chip img { width: 48px; height: 48px; object-fit: contain; }
.client-logo-chip__remove {
    border: 0;
    background: transparent;
    color: #b7b9be;
    font-size: 22px;
    cursor: pointer;
}
.client-table { display: flex; flex-direction: column; gap: 8px; }
.client-table__head,
.client-row {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) 220px 220px 220px;
    align-items: center;
    column-gap: 0;
}
.client-form:not(.is-locked) .client-table__head,
.client-form:not(.is-locked) .client-row {
    grid-template-columns: 64px minmax(0, 1fr) 200px 200px 180px 40px;
}
.client-table__head {
    height: 56px;
    border-radius: 8px;
    background: #eaedf3;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.client-table__head span { padding: 0 16px; }
.client-row__num {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 64px;
    border-radius: 8px 0 0 8px;
    background: #eaedf3;
    font-weight: 600;
}
.client-row input { border-radius: 0; border-left-width: 0; }
.client-row input:last-of-type { border-radius: 0 8px 8px 0; border-right-width: 2px; }
.client-row__remove {
    width: 32px;
    height: 32px;
    margin-left: 8px;
    border: 0;
    background: transparent;
    color: #b7b9be;
    font-size: 22px;
    cursor: pointer;
}
.client-tile-row,
.client-file {
    display: flex;
    align-items: center;
    gap: 12px;
}
.client-icon-btn { width: 56px; height: 56px; }
.client-icon-btn img { width: 28px; height: 28px; }
.client-tile {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
    height: 64px;
    padding: 0 20px;
    border-radius: 8px;
    background: #eaedf3;
    color: #000;
    text-decoration: none;
    font-size: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.client-files { display: flex; flex-direction: column; gap: 12px; }
.client-files:empty { display: none; }
.client-form [hidden] { display: none !important; }
.client-form .client-file-input {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
.client-docs { display: flex; flex-direction: column; gap: 12px; }
.client-docs__label {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.client-docs__cols {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 40px;
    align-items: start;
}
.client-docs__col {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}
.client-brand { display: flex; flex-direction: column; gap: 12px; }
.client-upload-line--docs { justify-content: flex-end; }
.client-upload-line--docs .client-btn { flex-shrink: 0; }
.client-upload-line--docs p {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.client-upload-line--docs p.is-filled { font-weight: 600; }
.client-doc-slot { position: relative; }
.client-doc-slot .client-drop { top: 76px; right: 0; left: auto; }
.client-brand__row { display: flex; align-items: center; gap: 16px; }
.client-brand__row input[type="text"] { flex: 1; min-width: 0; }
.client-brand__row input.is-attached { border-color: #a5cd39; }
.client-btn--link { width: 240px; height: 56px; font-size: 16px; flex-shrink: 0; }
.client-asset-list { display: flex; flex-direction: column; gap: 20px; }
.client-asset { display: flex; align-items: center; gap: 20px; min-width: 0; }
.client-tile__icon { width: 32px; height: 40px; flex-shrink: 0; object-fit: contain; }
.client-tile__icon--link { width: 32px; height: 32px; }
.client-tile__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.client-picked {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1;
    min-width: 0;
    height: 64px;
    padding: 0 20px;
    border-radius: 8px;
    background: #fff;
    font-size: 16px;
}
.client-file--edit { display: flex; align-items: center; gap: 8px; }
.client-tags { display: flex; flex-wrap: wrap; gap: 20px; }
.client-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 56px;
    padding: 8px 16px;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    background: #fff;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.02em;
}
.client-tag button {
    border: 0;
    background: transparent;
    color: #b7b9be;
    font-size: 18px;
    cursor: pointer;
}
.client-form__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.client-form__bar-end { display: flex; align-items: center; gap: 20px; }
label.client-btn { cursor: pointer; }
label.client-btn input { display: none; }

@media (max-width: 1100px) {
    .client-table__head { display: none; }
    .client-row,
    .client-form:not(.is-locked) .client-row {
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 8px;
    }
    .client-row__num { grid-row: span 4; }
    .client-docs__cols { grid-template-columns: 1fr; }
    .client-upload-line--docs { justify-content: flex-start; }
    .client-doc-slot .client-drop { left: 0; right: auto; }
    .client-drop { left: 0; top: auto; }
    .client-form__bar { flex-direction: column-reverse; align-items: stretch; }
    .client-form__bar-end { justify-content: flex-end; }
    .client-btn { width: 100%; }
}

.user-page { gap: 20px; }
.user-profile { gap: 40px; }
.user-form { display: flex; flex-direction: column; gap: 28px; }
.user-form [hidden] { display: none !important; }
.user-form__head,
.user-profile__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}
.user-form__head h1,
.user-profile__head h1,
.user-step h2,
.user-card h2 {
    margin: 0;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: #000;
}
.user-form__head h1,
.user-profile__head h1 { font-size: 32px; line-height: 1.15; }
.user-step { display: flex; flex-direction: column; gap: 28px; }
.user-step h2,
.user-card h2 { font-size: 28px; }
.user-fields { display: flex; flex-direction: column; gap: 28px; }
.user-split { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 40px; }
.user-split--3 { grid-template-columns: 1.15fr 1.15fr 0.9fr; }
.user-line {
    display: grid;
    grid-template-columns: 168px minmax(0, 1fr);
    gap: 12px 16px;
    align-items: center;
    min-width: 0;
}
.user-line--top { align-items: start; }
.user-line--top .user-line__label { padding-top: 16px; }
.user-line__label {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.2;
}
.user-input {
    width: 100%;
    height: 64px;
    margin: 0;
    padding: 0 16px;
    border: 2px solid #eaedf3;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font: 400 18px/1.2 "Roboto", "Segoe UI", Tahoma, sans-serif;
    letter-spacing: 0.04em;
    text-align: center;
    box-sizing: border-box;
}
.user-input[readonly] {
    background: #eaedf3;
    border-color: transparent;
}
.user-input[type="file"] {
    height: auto;
    min-height: 64px;
    padding: 16px;
    text-align: left;
}
.user-input::placeholder { color: #b7b9be; }
.user-input:focus { outline: 2px solid #4285f4; outline-offset: 1px; }
.user-input--area {
    height: 120px;
    padding: 16px;
    text-align: left;
    resize: vertical;
}
.user-hint { margin: 0; color: #a1a1a1; font-size: 16px; letter-spacing: 0.04em; }
.user-pills { display: flex; flex-wrap: wrap; gap: 12px; }
.user-pills--access {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.user-pills--access .user-pill { width: 100%; max-width: none; min-height: 64px; }
.user-pills--grid .user-pill { flex: 1 1 200px; max-width: 320px; justify-content: center; text-align: center; }
.user-pill {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 64px;
    padding: 10px 20px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;
}
.user-pill input { position: absolute; opacity: 0; pointer-events: none; }
.user-pill:has(input:checked),
.user-pill.is-static {
    border-color: #deeaff;
    background: var(--ds-gradient-brand);
}
.user-pill--idle {
    border-color: transparent;
    background: #eaedf3;
}
.user-pill--idle:has(input:checked) {
    border-color: #deeaff;
    background: var(--ds-gradient-brand);
}
.user-pill--locked {
    border-color: transparent;
    background: #eaedf3;
    color: #6b7280;
    cursor: default;
    pointer-events: none;
}
.user-pill--locked:has(input:checked) {
    border-color: #deeaff;
    background: var(--ds-gradient-brand);
    color: #000;
}
.user-pill--soft {
    height: 40px;
    min-height: 40px;
    border-color: transparent;
    background: var(--ds-gradient-brand-cool);
    cursor: default;
}
.user-pill.is-static { cursor: default; }
.user-spec-group:not([hidden]) { display: contents; }
.user-spec-group .user-hint { flex: 1 1 100%; }
.user-spec-caption { margin: 0 0 8px; font-size: 16px; font-weight: 600; letter-spacing: 0.04em; }
.user-save,
.user-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: 240px;
    height: 64px;
    padding: 0 24px;
    border: 0;
    border-radius: 8px;
    background: #000;
    color: #fff;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}
.user-save {
    min-width: 220px;
    background: #fff;
    color: #000;
    border: 2px solid #eaedf3;
}
.user-save:disabled,
.user-btn:disabled {
    background: #eaedf3;
    color: #b7b9be;
    border-color: transparent;
    cursor: default;
}
.user-save svg,
.user-btn svg,
.user-btn img { flex-shrink: 0; display: block; }
.user-btn__plus { font-size: 22px; line-height: 1; }
.user-actions { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.user-actions .user-btn {
    width: 320px;
    min-width: 320px;
    height: 64px;
    gap: 20px;
    font-size: 16px;
}
.user-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 12px;
}
.user-list__item {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    min-height: 115px;
    padding: 16px 18px;
    border: 2px solid #deeaff;
    border-radius: 12px;
    background: #fff;
    color: #000;
    text-decoration: none;
}
.user-list__item:hover { background: #f2f9ff; }
.user-list__item .avatar { width: 56px; height: 56px; font-size: 22px; }
.user-list__body { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
.user-list__name { font-size: 18px; font-weight: 600; letter-spacing: 0.04em; }
.user-list__role { color: #a1a1a1; font-size: 14px; letter-spacing: 0.04em; }
.user-profile__head { align-items: center; min-height: 76px; }
.user-profile .user-btn--add {
    width: auto;
    min-width: 0;
    height: 64px;
    gap: 20px;
    padding: 0 20px;
    font-size: 22px;
}
.user-profile__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}
.user-card {
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 24px;
    border-radius: 12px;
    background: #deeaff;
}
.user-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 4px;
    background: #000;
    flex-shrink: 0;
}
.user-icon-btn img { display: block; }
.user-card__who { display: flex; gap: 40px; align-items: flex-start; }
.user-card__identity { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 40px; }
.user-card__name {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
}
.user-card__name-main {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}
.user-card__name strong {
    flex: 1;
    min-width: 0;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.04em;
}
.user-load {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 220px;
    height: 34px;
    padding: 0 12px;
    border-radius: 6px;
    background: #eaedf3;
    color: #000;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.04em;
    white-space: nowrap;
    flex-shrink: 0;
}
.user-load b { font-weight: 700; }
.user-personal-flag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 220px;
    max-width: 100%;
    margin-top: 8px;
    padding: 6px 12px;
    border-radius: 6px;
    background: rgba(237, 61, 34, 0.25);
    color: #000;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.04em;
    white-space: nowrap;
}
.user-personal-flag--ready { background: #d8efcd; }
.user-personal-flag img {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.access-list { display: flex; flex-wrap: wrap; gap: 20px; }
.access-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 20px;
    width: 380px;
    max-width: 100%;
    padding: 13px 20px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    color: #000;
    text-decoration: none;
}
.access-card:hover { background: #f2f9ff; }
.access-card__who { display: flex; align-items: center; gap: 20px; min-width: 0; }
.access-card__avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #000;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    flex-shrink: 0;
    overflow: hidden;
}
.access-card__avatar img { width: 32px; height: 32px; object-fit: cover; display: block; }
.access-card__name { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.access-card__name strong { font-size: 16px; font-weight: 600; letter-spacing: 0.04em; line-height: 1; }
.access-card__name span { color: #b7b9be; font-size: 16px; letter-spacing: 0.04em; }
.access-panel {
    display: flex;
    flex-direction: column;
    border-radius: 16px;
    background: #deeaff;
}
.access-issue { gap: 80px; padding: 20px 24px; }
.access-history { gap: 40px; padding: 24px; }
.access-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 80px;
    align-items: end;
}
.access-field { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.access-field > span { font-size: 20px; font-weight: 600; letter-spacing: 0.04em; }
.access-field input {
    height: 63px;
    padding: 0 20px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font-size: 20px;
    letter-spacing: 0.04em;
}
.access-field input::placeholder { color: #b7b9be; }
.access-password { display: flex; align-items: center; gap: 20px; }
.access-password input { width: auto; flex: 1 1 auto; min-width: 0; }
.access-generate {
    flex: 0 0 320px;
    width: 320px;
    height: 64px;
    border: 0;
    border-radius: 8px;
    background: #eaedf3;
    color: #b7b9be;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    cursor: pointer;
}
.access-saved {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.access-saved img { transform: scaleY(-1); }
.access-foot { display: flex; flex-direction: column; align-items: center; gap: 20px; }
.access-foot .access-saved { align-self: flex-start; }
.access-actions { display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; width: 100%; }
.access-actions .user-btn { width: 320px; min-width: 320px; font-size: 16px; gap: 20px; }
.access-actions .user-btn:disabled img { filter: brightness(0) invert(72%); }
.access-actions .user-btn:not(:disabled) img.access-icon--save { filter: brightness(0) invert(1); }
.access-block { margin: 0; }
.access-block__btn { background: #eaedf3; color: #000; }
.access-history__head { display: flex; align-items: center; gap: 20px; }
.access-history__head h2 { margin: 0; font-size: 25px; font-weight: 600; letter-spacing: 0.04em; }
.access-log { display: flex; flex-direction: column; gap: 20px; }
.access-log__head,
.access-log__main {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
}
.access-log__head {
    height: 64px;
    padding: 0 24px;
    border-radius: 12px 12px 0 0;
    background: #eaedf3;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.access-log__rows { display: flex; flex-direction: column; gap: 20px; }
.access-log__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 24px;
    border-radius: 8px;
    background: #eaedf3;
    letter-spacing: 0.04em;
}
.access-log__when { flex: 0 0 200px; width: 200px; font-size: 20px; color: #a1a1a1; font-weight: 400; }
.access-log__head .access-log__when { color: #000; font-weight: 600; }
.access-log__login { flex: 0 0 330px; width: 330px; font-size: 20px; color: #000; font-weight: 400; }
.access-log__head .access-log__login { font-weight: 600; }
.access-log__pass { flex: 0 0 250px; width: 250px; font-size: 22px; letter-spacing: 0.04em; font-weight: 400; }
.access-log__head .access-log__pass { font-size: 20px; font-weight: 600; }
.access-log__action { flex: 0 0 240px; width: 240px; }
.access-log__rule {
    display: flex;
    flex: 0 0 0;
    width: 0;
    height: 20px;
    align-items: center;
    justify-content: center;
}
.access-log__rule img { display: block; transform: rotate(90deg); }
.access-log__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex: 0 0 auto;
    width: auto;
    min-width: 220px;
    height: 56px;
    padding: 6px 12px;
    border-radius: 6px;
    background: #d8efcd;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
}
.access-log__pill img { display: block; flex-shrink: 0; }
.access-log__send,
.access-log__send-icon { display: block; flex: 0 0 32px; }
.access-log__send {
    width: 32px;
    height: 26px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}
.access-log__send:disabled { cursor: default; }
.access-log__send:disabled img { filter: brightness(0) invert(72%); }
.user-contacts { display: flex; flex-direction: column; gap: 30px; }
.user-contacts p {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0;
    color: #4285f4;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.04em;
}
.user-contacts img { display: block; flex-shrink: 0; }
.user-fact__label {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: #000;
    font-size: 16px;
    letter-spacing: 0.04em;
}
.user-fact__label svg { flex-shrink: 0; }
.user-card__about {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-height: 0;
}
.user-card__about > span,
.user-card__label {
    display: block;
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.user-card__roles > div,
.user-card > div:has(.user-card__label) { display: flex; flex-direction: column; gap: 20px; }
.user-about-row {
    flex: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    min-height: 96px;
}
.user-about {
    display: flex;
    align-items: flex-start;
    flex: 1;
    min-height: 96px;
    height: 100%;
    padding: 20px;
    border-radius: 8px;
    background: #eaedf3;
    box-sizing: border-box;
}
.user-about p { margin: 0; color: #000; font-size: 20px; font-weight: 400; letter-spacing: 0.04em; }
.user-about.is-filled { background: #fff; }
.user-card__roles {
    display: flex;
    align-items: flex-start;
    gap: 80px;
}
.user-card__roles > .user-icon-btn { margin-left: auto; }
.user-card__roles > div:first-child,
.user-card__roles > div:nth-child(2) { min-width: 220px; }
.user-profile .user-pill--soft {
    width: 220px;
    max-width: none;
    height: 40px;
    min-height: 40px;
    padding: 0 20px;
    border: 0;
    font-size: 16px;
    font-weight: 400;
    background: linear-gradient(153.47deg, rgba(212, 155, 252, 0.3) 12.28%, rgba(139, 135, 240, 0.3) 50.69%, rgba(164, 242, 254, 0.3) 87.96%);
}
.user-profile .user-pills--access {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.user-profile .user-pills--access .user-pill {
    flex: 0 0 200px;
    width: 200px;
    max-width: 200px;
    height: 56px;
    min-height: 56px;
    padding: 12px;
    border: 2px solid #deeaff;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    background: var(--ds-gradient-brand);
}
.user-avatar { position: relative; width: 114px; height: 111px; flex-shrink: 0; margin: 0; }
.user-card__avatar {
    display: block;
    width: 100px;
    height: 100px;
}
.user-card__photo {
    display: block;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
}
.user-avatar__plus {
    position: absolute;
    left: 68px;
    top: 65px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: #000;
    color: #fff;
    font-size: 26px;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1;
    cursor: pointer;
}
.user-avatar__plus input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
.user-section-head {
    display: flex;
    align-items: center;
    gap: 16px;
}
.user-section-head h2 { flex: 1; font-size: 20px; font-weight: 600; }
.user-section-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    background: #f2f9ff;
    flex-shrink: 0;
}
.user-section-icon img { display: block; }
.user-personal__block,
.user-personal__split > .user-personal__block {
    padding: 20px;
    border-radius: 8px;
    background: #fff;
}
.user-personal__block h3 {
    margin: 0 0 16px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.user-personal__block .user-fact + .user-fact { margin-top: 16px; }
.user-fact p:last-child { margin: 8px 0 0; font-size: 16px; letter-spacing: 0.04em; }
.user-bank {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
}
.user-personal__split {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.8fr);
    gap: 16px;
}
.user-legal { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.user-toggles { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.user-toggles li,
.user-toggles--form label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    letter-spacing: 0.04em;
}
.user-toggles--form label { cursor: pointer; }
.user-toggles--form { margin-bottom: 8px; }
.user-toggles--form input { position: absolute; opacity: 0; pointer-events: none; }
.user-switch {
    position: relative;
    width: 40px;
    height: 20px;
    border-radius: 20px;
    background: #eaedf3;
    flex-shrink: 0;
}
.user-switch::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.user-switch.is-on,
.user-toggles--form label:has(input:checked) .user-switch { background: #a5cd39; }
.user-switch.is-on::after,
.user-toggles--form label:has(input:checked) .user-switch::after { left: 22px; }
.user-legal__extra { display: flex; flex-wrap: wrap; gap: 24px; }
.user-download {
    display: flex;
    flex-direction: column;
    gap: 6px;
    color: #000;
    text-decoration: none;
    font-size: 16px;
    letter-spacing: 0.04em;
}
.user-download strong { color: #4285f4; font-weight: 600; }
.user-security { margin: 0 0 10px; font-size: 16px; letter-spacing: 0.04em; }
.user-security span { display: inline-block; min-width: 90px; }
.user-link { color: #000; font-size: 16px; font-weight: 600; letter-spacing: 0.04em; }
.user-form [data-legal-panel] { display: flex; flex-direction: column; gap: 16px; }
.user-form [data-legal-panel][hidden] { display: none; }
.user-spec-table { display: flex; flex-direction: column; gap: 12px; }
.user-spec-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 72px;
    padding: 12px 20px;
    border: 2px solid #deeaff;
    border-radius: 12px;
    background: #f2f9ff;
    box-sizing: border-box;
}
.user-spec-row > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.user-spec-row strong,
.user-spec-row span { display: block; letter-spacing: 0.04em; color: #000; font-size: 18px; }
.user-spec-row strong { font-weight: 600; }
.user-spec-row span { font-weight: 400; }
.user-spec-row .user-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 220px;
    height: 56px;
    padding: 0 12px;
    border-radius: 6px;
    background: #eaedf3;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}
.user-modal {
    position: fixed;
    inset: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(526px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    margin: 0;
    padding: 24px;
    border: 0;
    border-radius: 12px;
    background: #f2f9ff;
    text-align: center;
    box-shadow: none;
    overflow: auto;
}
.user-modal::backdrop { background: rgba(0, 0, 0, 0.35); }
.user-modal__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}
.user-modal__copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    max-width: 478px;
}
.user-modal h2 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.2;
}
.user-modal p {
    margin: 0;
    font-size: 18px;
    line-height: 1.35;
    letter-spacing: 0.04em;
}
.user-modal__close {
    position: absolute;
    top: 24px;
    right: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 8px;
    background: #000;
    color: #fff;
    cursor: pointer;
}
.user-modal__close img { display: block; }
.user-modal .user-btn {
    width: 300px;
    min-width: 300px;
    height: 56px;
    gap: 20px;
    font-size: 16px;
}
.user-modal .user-btn--users {
    width: 240px;
    min-width: 240px;
}
.user-modal .user-btn--users img {
    width: 24px;
    height: 24px;
    filter: brightness(0) invert(1);
}
.personal-form {
    display: flex;
    flex-direction: column;
    gap: 28px;
}
.personal-form [hidden] { display: none !important; }
.personal-form h1,
.personal-security h2 {
    margin: 0;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: #000;
}
.personal-form h1 { font-size: 32px; line-height: 1.2; }
.personal-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px 24px;
}
.personal-field,
.personal-choice {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 12px 16px;
    align-items: center;
    min-width: 0;
}
.personal-field--created { max-width: 980px; }
.personal-field > span:first-child,
.personal-choice > span {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.2;
}
.personal-input {
    width: 100%;
    height: 63px;
    margin: 0;
    padding: 0 20px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font: 400 18px/1.2 "Roboto", "Segoe UI", Tahoma, sans-serif;
    letter-spacing: 0.04em;
    text-align: left;
    box-sizing: border-box;
}
.personal-input::placeholder { color: #b7b9be; font-size: 16px; }
.personal-input:focus { outline: 2px solid #4285f4; outline-offset: 1px; }
.personal-input--muted { background: #eaedf3; }
.personal-date { position: relative; display: block; min-width: 0; }
.personal-date img {
    position: absolute;
    left: 16px;
    top: 50%;
    width: 24px;
    height: 24px;
    transform: translateY(-50%);
    pointer-events: none;
}
.personal-date .personal-input { position: relative; padding-left: 52px; }
.personal-date .personal-input::-webkit-calendar-picker-indicator {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}
.personal-choice__options { display: flex; flex-wrap: wrap; gap: 20px; }
.personal-status {
    width: auto;
    min-width: 320px;
    height: 64px;
    padding: 12px 20px;
    white-space: nowrap;
}
.personal-extra { display: flex; flex-direction: column; gap: 28px; }
.personal-upload {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 20px;
    min-height: 64px;
    cursor: pointer;
}
.personal-upload input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}
.personal-upload__name {
    color: #b7b9be;
    font-size: 22px;
    letter-spacing: 0.04em;
    line-height: 1.2;
}
.personal-upload__name.is-filled { color: #000; }
.personal-upload__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    background: #000;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.06);
    flex-shrink: 0;
}
.personal-upload__btn img { width: 32px; height: 32px; display: block; }
.personal-rule { width: 100%; height: 0; margin: 4px 0; border: 0; border-top: 2px solid #d5dbe6; }
.personal-security { display: flex; flex-direction: column; gap: 20px; max-width: 760px; }
.personal-security h2 { font-size: 20px; }
.user-profile .user-toggles { gap: 20px; }
.user-profile .user-toggles li { font-size: 20px; gap: 10px; }
.user-personal__block:has(.user-legal),
.user-personal__block--security { background: #f2f9ff; }
.user-personal > .user-personal__block--security { width: min(400px, 100%); }
.user-legal--ip {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px 32px;
    width: 100%;
}
.user-extract { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.user-legal .user-fact .user-legal__value { margin: 16px 0 0; font-size: 20px; letter-spacing: 0.04em; }
.user-download {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    color: #000;
    font-size: 20px;
    letter-spacing: 0.04em;
    text-decoration: none;
}
.user-download span { text-decoration: underline; }
.user-download img { width: 23px; height: 26px; display: block; filter: brightness(0); }
.user-download strong { color: inherit; font-weight: 400; }
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

@media (max-width: 1100px) {
    .user-split,
    .user-split--3,
    .user-profile__grid,
    .user-card__roles,
    .user-pills--access,
    .user-bank,
    .user-personal__split,
    .user-list { grid-template-columns: 1fr; }
    .access-fields { grid-template-columns: 1fr; }
    .access-password { flex-wrap: wrap; }
    .access-log { overflow-x: auto; }
    .access-generate,
    .access-actions .user-btn,
    .access-card { width: 100%; flex-basis: auto; }
    .user-card__roles { flex-wrap: wrap; gap: 24px; }
    .user-card__name,
    .user-card__name-main { flex-wrap: wrap; gap: 16px; }
    .user-load,
    .user-personal-flag,
    .user-profile .user-pill--soft,
    .user-spec-row .user-badge { width: auto; min-width: 160px; }
    .user-line { grid-template-columns: 1fr; }
    .user-line--top .user-line__label { padding-top: 0; }
    .user-actions,
    .user-form__head,
    .user-profile__head { flex-direction: column; align-items: stretch; }
    .user-btn,
    .user-save,
    .user-actions .user-btn { width: 100%; min-width: 0; }
    .personal-grid,
    .personal-field,
    .personal-choice { grid-template-columns: 1fr; }
    .personal-status,
    .personal-field--created,
    .personal-security { width: 100%; max-width: none; }
    .user-legal--ip { justify-content: flex-start; }
}

/* Вход в личный кабинет — Figma 6:17 и экраны справа (код, телефон, логин). */
body:has(.auth-page) {
    min-height: 100vh;
    background: #f2f9ff;
    color: #000;
    font-family: "Roboto", "Segoe UI", Tahoma, sans-serif;
}

body:has(.auth-page) .wrap {
    max-width: none;
    width: 100%;
    margin: 0;
    padding: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.auth-page {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
    background: #f2f9ff;
    color: #000;
}

.auth-page [hidden] { display: none !important; }

.auth-main {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 128px;
    width: 100%;
    padding: 40px 80px 40px;
    box-sizing: border-box;
}

.auth-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: min(351px, 100%);
}

.auth-logo-row {
    display: flex;
    align-items: flex-end;
    gap: 12px;
}

.auth-logo {
    position: relative;
    width: 172px;
    height: 56px;
    flex: 0 0 172px;
}

.auth-logo img {
    position: absolute;
    display: block;
}

.auth-logo__mark { left: 1.75px; top: 1.16px; }
.auth-logo__word { left: 26.37px; top: 1.06px; }
.auth-logo__reg { left: 162.37px; top: 16.1px; }

.auth-dev {
    font-size: 10px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.4px;
    color: #000;
}

.auth-tagline {
    margin: 0;
    width: 100%;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.04em;
    color: #000;
}

.auth-card {
    width: min(652px, 100%);
}

.auth-stack,
.auth-head,
.auth-form,
.auth-code-copy,
.auth-alt {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
}

.auth-stack { gap: 40px; align-items: center; }
.auth-head { gap: 40px; align-items: center; }
.auth-form { gap: 20px; }
.auth-code-copy { gap: 20px; align-items: center; }
.auth-alt { gap: 40px; align-items: center; }

.auth-page h1 {
    margin: 0;
    font-size: 32px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.04em;
    text-align: center;
    color: #000;
}

.auth-tabs {
    display: flex;
    gap: 12px;
    width: 100%;
}

.auth-tab {
    flex: 1 1 0;
    min-width: 0;
    height: 64px;
    padding: 12px 20px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    color: #000;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.04em;
    cursor: pointer;
}

.auth-tab.is-active {
    background:
        linear-gradient(270deg, rgba(94, 88, 198, .3) 0%, rgba(194, 72, 183, .3) 49.52%, rgba(247, 121, 73, .3) 100%),
        #fff;
}

.auth-page .auth-field {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    height: 64px;
    margin: 0;
    padding: 0 20px;
    box-sizing: border-box;
    background: #fff;
    border: 2px solid transparent;
    border-radius: 8px;
    font-size: 22px;
}

.auth-page .auth-field.is-invalid { border-color: #ed3d22; }

.auth-page .auth-field input {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: #000;
    font-family: inherit;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.04em;
}

.auth-page .auth-field input::placeholder {
    color: #b7b9be;
    opacity: 1;
}

.auth-page .auth-field input:focus { outline: none; }

.auth-icon-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.auth-submit,
.auth-yandex {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    width: 100%;
    height: 64px;
    margin: 0;
    padding: 12px 20px;
    border: 0;
    border-radius: 8px;
    background: #000;
    color: #fff;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.04em;
    cursor: pointer;
}

.auth-hint,
.auth-note,
.auth-resend,
.auth-error {
    margin: 0;
    text-align: center;
}

.auth-hint {
    color: #b7b9be;
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.04em;
}

.auth-note {
    color: #000;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.04em;
}

.auth-note--strong { font-weight: 600; }

.auth-resend {
    color: #000;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.04em;
}

.auth-error {
    color: #ed3d22;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: 0.04em;
}

.auth-tab:focus-visible,
.auth-submit:focus-visible,
.auth-yandex:focus-visible,
.auth-icon-btn:focus-visible,
.auth-footer a:focus-visible {
    outline: 2px solid #4285f4;
    outline-offset: 2px;
}

.auth-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 118px;
    height: 118px;
    background: #deeaff;
}

.auth-footer a {
    color: #4285f4;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.04em;
    text-decoration: none;
}

@media (max-width: 760px) {
    .auth-main { padding: 32px 16px 24px; gap: 64px; }
    .auth-tab { padding: 12px 8px; font-size: 14px; }
    .auth-page h1 { font-size: 26px; }
}

/* Рабочий стол пользователя: левое меню и блоки экрана */
.user-frame {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    min-height: 100vh;
    padding: 40px;
    box-sizing: border-box;
    background: #f2f9ff;
}

.side {
    position: sticky;
    top: 40px;
    align-self: flex-start;
    display: flex;
    flex-direction: column;
    gap: 80px;
    width: 356px;
    flex: 0 0 356px;
    max-height: calc(100vh - 80px);
    padding: 0 16px 8px 0;
    border-right: 1px solid #b7b9be;
    box-sizing: border-box;
    overflow: auto;
}

.side-main {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 320px;
}

.side-user {
    display: flex;
    align-items: center;
    gap: 20px;
    min-height: 48px;
}

.side .avatar {
    width: 48px;
    height: 48px;
    font-size: 25px;
}

.side-user .user-name {
    font-weight: 600;
    line-height: 1;
}

.side-nav {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 320px;
}

.side-section {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.side-caption {
    margin: 0;
    color: #b7b9be;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
}

.side-rule {
    display: block;
    width: 100%;
    height: 0;
    border-top: 1px solid #b7b9be;
}

.side-section__items {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.side-link {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 10px 12px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #f2f9ff;
    color: #000;
    text-decoration: none;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    text-align: left;
    box-sizing: border-box;
    cursor: pointer;
    appearance: none;
}

.side-link .nav-icon {
    display: inline-flex;
    flex: 0 0 24px;
    color: #000;
}

.side-link .nav-icon img,
.side-link .nav-icon svg { display: block; }

.side-link.is-active { background: #fff; }

.side-link--static { cursor: default; }

.side-role { width: 100%; }

.side-role > summary { list-style: none; }
.side-role > summary::-webkit-details-marker { display: none; }

.side-role__list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
}

.side-role__caption,
.side-role__option {
    display: flex;
    align-items: center;
    min-height: 36px;
    border-radius: 8px;
    box-sizing: border-box;
    font-size: 16px;
    letter-spacing: 0.04em;
    line-height: 1.2;
}

.side-role__caption {
    gap: 8px;
    padding: 8px 12px 8px 36px;
    background: #fff;
    font-weight: 600;
}

.side-role__caption .side-chevron {
    margin-top: 0;
    transform: rotate(135deg);
}

.side-role__option {
    padding: 8px 12px 8px 48px;
    color: #000;
    text-decoration: none;
    font-weight: 400;
}

.side-role__option.is-active,
.side-role__option:hover { background: #fff; }

.side-role-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
}

.side-role-links:not(:has(a:not([hidden]))) { display: none; }

.side-fold { width: 100%; }

.side-fold > summary {
    list-style: none;
    cursor: pointer;
}

.side-fold > summary::-webkit-details-marker { display: none; }

.side-fold > summary.side-link { width: 100%; }

.side-fold__mark {
    width: 8px;
    height: 8px;
    margin-left: auto;
    border-top: 1.6px solid currentColor;
    border-right: 1.6px solid currentColor;
    transform: rotate(45deg);
    flex: 0 0 auto;
}

.side-fold[open] > summary > .side-fold__mark { transform: rotate(135deg); }

.side-fold__list {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 4px;
}

.side-fold > summary .side-chevron { transform: rotate(45deg); }

.side-fold[open] > summary .side-chevron { transform: rotate(135deg); }

.side-sublink--stage { padding-left: 36px; }

.side-sublink--work { padding-left: 52px; }

.side-sublink.is-active { background: #fff; }

.side-sublink {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-height: 36px;
    padding: 8px 12px 8px 20px;
    border-radius: 8px;
    color: #000;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.25;
}

.side-sublink:hover { background: #fff; }

.side-chevron {
    flex: 0 0 8px;
    width: 8px;
    height: 8px;
    margin-top: 4px;
    border-top: 1.6px solid #000;
    border-right: 1.6px solid #000;
    transform: rotate(-45deg);
}

.side-brand {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 320px;
    color: #000;
}

.side-brand__row {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    font-size: 14px;
    letter-spacing: 0.04em;
}

.side-brand p {
    margin: 0;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.04em;
}

.side-brand a {
    color: #4285f4;
    font-size: 14px;
    letter-spacing: 0.04em;
    text-decoration: none;
}

.user-column {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

body.user-shell .wrap,
body.user-shell .wrap--fluid {
    max-width: none;
    width: 100%;
    margin: 0;
    padding: 0 0 24px;
}

.user-desk {
    display: flex;
    flex-direction: column;
    gap: 28px;
    width: 100%;
}

.user-desk__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.user-desk__head h1 {
    margin: 0;
    font-size: 32px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.2;
}

.user-periods {
    display: flex;
    gap: 12px;
    flex-shrink: 0;
}

.user-period {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 220px;
    height: 34px;
    padding: 6px 12px;
    border: 0;
    border-radius: 6px;
    background: #eaedf3;
    color: #000;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.02em;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
}

.user-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.user-actions__add {
    display: flex;
    gap: 20px;
}

.user-desk .user-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: 0;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    box-sizing: border-box;
}

.user-desk .user-btn--doc {
    width: 360px;
    height: 64px;
    padding: 12px 20px;
    border: 2px solid #deeaff;
    background: #f2f9ff;
    color: #000;
    font-size: 16px;
}

.user-desk .user-btn--create {
    width: 320px;
    height: 64px;
    padding: 20px;
    gap: 20px;
    border: 0;
    background: #000;
    color: #fff;
    font-size: 16px;
}

.user-desk .user-btn--slim {
    width: 220px;
    height: 44px;
    padding: 12px 20px;
    gap: 8px;
    border: 2px solid #deeaff;
    background: #f2f9ff;
    color: #000;
    font-size: 14px;
}

.user-btn__chevron {
    width: 7px;
    height: 7px;
    border-top: 1.6px solid currentColor;
    border-right: 1.6px solid currentColor;
    transform: rotate(45deg);
    flex: 0 0 auto;
}

.user-desk .user-btn--doc:hover,
.user-desk .user-btn--slim:hover {
    box-shadow:
        7px 7px 8px rgba(0, 0, 0, 0.06),
        -7px -7px 8px rgba(255, 255, 255, 0.68);
}

.user-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px;
}

.user-panel {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
    padding: 24px;
    border-radius: 12px;
    background: #deeaff;
    box-sizing: border-box;
}

.user-panel__head,
.user-panel__title {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.user-panel__head { justify-content: space-between; }

.user-panel__title h2 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.user-desk .user-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.user-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 112px;
    padding: 16px 20px;
    border: 2px solid #deeaff;
    border-radius: 12px;
    background: #f2f9ff;
    color: inherit;
    text-decoration: none;
    box-sizing: border-box;
}

.user-row__main {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    min-width: 0;
}

.user-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 8px;
    background: #fff;
    color: #000;
    flex-shrink: 0;
}

.user-ico img { display: block; max-width: 24px; max-height: 24px; }

.user-row__text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.user-row__text strong {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.user-row__text span,
.user-lead,
.user-card span {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.04em;
    color: #000;
}

.user-row__meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    flex-shrink: 0;
}

.user-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 220px;
    height: 34px;
    padding: 6px 12px;
    border-radius: 6px;
    background: #eaedf3;
    color: #000;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.02em;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
}

.user-mark--hot { background: rgba(237, 61, 34, 0.25); }
.user-mark--warn,
.user-mark--info { background: rgba(245, 141, 33, 0.25); }
.user-mark--ok { background: #d8efcd; }

.user-row__meta time {
    color: #a1a1a1;
    font-size: 14px;
    letter-spacing: 0.04em;
}

.user-priority {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    color: #000;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.user-priority::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #b7b9be;
    flex: 0 0 auto;
}

.user-priority--mid::before { background: #4285f4; }
.user-priority--low::before { background: #a5cd39; }
.user-priority--high::before { background: #f58d21; }
.user-priority--critical::before { background: #ed3d22; }

.user-projects,
.user-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.user-projects { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.user-project,
.user-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 180px;
    padding: 22px;
    border: 2px solid #deeaff;
    border-radius: 12px;
    background: #f2f9ff;
    color: inherit;
    text-decoration: none;
    box-sizing: border-box;
}

.user-project strong,
.user-card strong {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.35;
}

.user-project__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.user-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.user-status::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #b7b9be;
}

.user-status--work::before { background: #a5cd39; }
.user-status--pause::before { background: #f77949; }
.user-status--cancel::before { background: #ed3d22; }
.user-status--new::before { background: #4285f4; }

.user-date {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 200px;
    height: 56px;
    padding: 0 16px;
    border: 0;
    border-radius: 8px;
    background: #4285f4;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    box-sizing: border-box;
}

.user-date--work { background: #f58d21; }
.user-date--cancel { background: #ed3d22; }

.user-ico--hot { background: #ed3d22; color: #fff; }
.user-ico--info { background: #4285f4; color: #fff; }
.user-ico--warn { background: #f58d21; color: #fff; }
.user-ico--ok { background: #8fce6a; color: #fff; }

.user-progress__label {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 16px;
    letter-spacing: 0.04em;
}

.user-progress__bar {
    display: block;
    height: 6px;
    margin-top: 8px;
    border-radius: 99px;
    background: #fff;
    overflow: hidden;
}

.user-progress__bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #4285f4;
}

.user-lead { margin: 0; }

.user-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }

@media (max-width: 1100px) {
    .user-frame { flex-direction: column; }
    .side {
        position: static;
        width: 100%;
        flex-basis: auto;
        max-height: none;
        border-right: 0;
        border-bottom: 1px solid #b7b9be;
    }
    .user-split,
    .user-projects,
    .user-cards { grid-template-columns: 1fr; }
    .user-actions,
    .user-actions__add,
    .user-desk__head { flex-wrap: wrap; }
    .user-desk .user-btn,
    .user-desk .user-btn--doc,
    .user-desk .user-btn--create,
    .user-period { width: 100%; }
}

.sys-catalog .catalog-page__head h1 { max-width: 1180px; }
.sys-table { display: flex; flex-direction: column; gap: 12px; }
.sys-item { position: relative; }
.sys-row { width: 100%; align-items: center; }
.sys-table .catalog-table__col--num { flex-basis: 56px; }
.sys-col--name { flex: 0 0 240px; }
.sys-col--icon {
    flex: 0 0 240px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.sys-ghost {
    display: flex;
    align-items: center;
    gap: 8px;
}
.sys-ghost--center { justify-content: center; }
.sys-ghost.is-filled .sys-ghost__plus,
.sys-ghost:focus-within .sys-ghost__plus { display: none; }
.sys-ghost__plus {
    font-size: 22px;
    font-weight: 600;
    line-height: 1;
}
.sys-input {
    width: 100%;
    border: 0;
    background: transparent;
    font: inherit;
    letter-spacing: inherit;
    color: inherit;
    padding: 0;
    resize: vertical;
}
.sys-input:focus { outline: none; }
.sys-input--area { min-height: 48px; }
.sys-upload {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 44px;
    padding: 0 16px;
    border: 0;
    border-radius: 8px;
    background: #000;
    color: #fff;
    font: inherit;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-decoration: none;
    cursor: pointer;
}
.sys-upload img { width: 18px; height: 18px; }
.sys-icon-preview {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}
.sys-icon-preview img { max-width: 32px; max-height: 32px; }
.sys-drop { margin: 4px 0 8px 320px; width: min(360px, 100%); }
.sys-drop__zone {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 24px 20px;
    background: #fff;
    border: 2px dashed #deeaff;
    border-radius: 12px;
    text-align: center;
    cursor: pointer;
}
.sys-drop__zone.is-over { background: #f2f9ff; }
.sys-drop__file {
    display: none !important;
    width: 0;
    height: 0;
    padding: 0;
    border: 0;
    margin: 0;
}
.sys-drop__zone p { margin: 0; }
.sys-drop__hint { color: #b7b9be; font-size: 14px; }
.sys-related {
    margin: 0 0 8px;
    padding: 16px 20px 20px;
    background: #f4f6f8;
    border-radius: 8px;
}
.sys-related summary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    padding: 8px 14px;
    border-radius: 8px;
    background: #fff;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
    list-style: none;
}
.sys-related summary::-webkit-details-marker { display: none; }
.sys-related__body { margin-top: 16px; }
.sys-related__label {
    margin: 0 0 8px;
    color: #8b8f97;
    font-size: 14px;
}
.sys-related__line {
    display: grid;
    grid-template-columns: minmax(180px, 280px) 1fr;
    gap: 20px;
    margin-top: 12px;
    padding: 16px;
    background: #fff;
    border-radius: 8px;
}
.sys-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.sys-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 8px 14px;
    border-radius: 8px;
    background: #f3e4fb;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-align: center;
}
.sys-chip--section { background: #ead7f8; }
.sys-chip--stage { background: #ffe4d2; }
.sys-bind { width: min(1180px, calc(100vw - 80px)); }
.sys-bind__label { margin: 28px 0 12px; font-weight: 600; }
.sys-bind__grid { display: flex; flex-wrap: wrap; gap: 12px; }
.sys-bind__chip { position: relative; margin: 0; }
.sys-bind__chip input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.sys-bind__chip span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 140px;
    min-height: 56px;
    padding: 8px 16px;
    border: 2px solid #deeaff;
    border-radius: 8px;
    background: #fff;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
}
.sys-bind__chip input:checked + span {
    border-color: #4285f4;
    background: #f2f9ff;
}
.sys-bind__chip input:focus-visible + span { outline: 2px solid #4285f4; }
.sys-bind .btn-add:disabled {
    background: #eaedf3;
    color: #b7b9be;
    cursor: default;
}