/* Global UI: fonts, tokens, #UI / #RA / #RAD / #RP shell, shared overlays & forms */

html, body {
    margin: 0; padding: 0; width: 100%; height: 100%;
    overflow: hidden;
    font-family: sans-serif; font-size: 16px; line-height: 1.2;
    color: #979797; background-color: #505050;
}

* {
    background-clip: padding-box;
    box-sizing: border-box;
}

#DATA {
    display: none !important;
}

/* Баннер смены релизной версии — fixed по центру сверху */
#IFM_version_reload {
    position: fixed;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 12000;
    max-width: min(520px, calc(100vw - 24px));
    padding: 14px 20px;
    border-radius: 10px;
    background: #c54031;
    color: #fff;
    font-family: 'Jost', sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
    text-align: center;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
    pointer-events: none;
}

#IFM_version_reload[hidden] {
    display: none !important;
}

#IFM_version_reload-count {
    font-variant-numeric: tabular-nums;
}

/* Плашка обновления Android-клиента — полоса сверху во всю ширину */
#IFM_android_update {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 12100;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 12px 12px;
    background: #2a2a2a;
    color: #eee;
    font-family: 'Jost', sans-serif;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
    border-bottom: 1px solid #3d3d3d;
}

#IFM_android_update[hidden] {
    display: none !important;
}

#IFM_android_update .ifm_au-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    max-width: 100%;
}

#IFM_android_update .ifm_au-main {
    flex: 1 1 auto;
    min-width: 0;
}

#IFM_android_update .ifm_au-msg {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    color: #f0f0f0;
    margin: 0 0 10px;
}

#IFM_android_update .ifm_au-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

#IFM_android_update .ifm_au-btn {
    appearance: none;
    border: 0;
    border-radius: 8px;
    padding: 9px 14px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    color: #fff;
    background: #2e7d32;
}

#IFM_android_update .ifm_au-btn:active {
    filter: brightness(1.08);
}

#IFM_android_update .ifm_au-btn[disabled] {
    opacity: 0.55;
    pointer-events: none;
}

#IFM_android_update .ifm_au-close {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    margin: -4px -4px 0 0;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #bdbdbd;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

#IFM_android_update .ifm_au-close:active {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

#IFM_android_update .ifm_au-bar {
    height: 8px;
    border-radius: 999px;
    background: #404040;
    overflow: hidden;
}

#IFM_android_update .ifm_au-bar-fill {
    height: 100%;
    width: 0%;
    border-radius: inherit;
    background: #43a047;
    transition: width 0.15s linear;
}

#IFM_android_update .ifm_au-bar-fill.is-indeterminate {
    width: 40% !important;
    transition: none;
    animation: ifm_au_bar_slide 1.1s ease-in-out infinite;
}

@keyframes ifm_au_bar_slide {
    0% {
        transform: translateX(-120%);
    }
    100% {
        transform: translateX(280%);
    }
}

#IFM_android_update .ifm_au-panel[hidden] {
    display: none !important;
}

@font-face {
    font-family: 'Jost';
    src: url('../font/Jost-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Jost';
    src: url('../font/Jost-Italic-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'RobotoMono';
    src: url('../font/RobotoMono-VariableFont_wght') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

:root {
    --font-ui: 'Jost', sans-serif;
    --font-mono: 'RobotoMono', sans-serif;
    --color-ui-bg: #3d3d3d;
    --color-ui-text: #a1a1a1;
    --color-panel-bg: #2e2e2e;
    --color-null-element-bg: #343434;
    --color-null-element-bg-opacity: #343434f0;
    --color-null-element-border: #4a4a4a;
    --color-null-element-text: #bcbcbc;
    --color-list-bg: #d9d9d91c;
    --color-btn-bg: #3a3a3a;
    --color-btn-text: #cfcfcf;
    --color-btn-border: #555;
    --color-btn-hover-bg: #4a4a4a;
    --color-btn-hover-border: #9c9c9c;
    --color-btn-active-bg: #616161;
    --color-btn-active-text: #fff;
    --color-link: #a39bf1;
    --color-link-hover: #b2abfd;
    --color-accent: #5d5cb5;
    --color-switch-on-thumb: #7a79c5;
    --color-switch-on-track: rgb(56 55 85);
    --color-switch-on-border: rgb(93 92 165);
    --color-lpd-active-border: #a4a3ff;
    --color-lpd-hover-border: #ffffff59;
    --btn-icon-hover-scale: 1.05;
    --btn-icon-active-scale: 1.0;
    --scrollbar-size: 8px;
    --scrollbar-track: transparent;
    --scrollbar-thumb: var(--color-null-element-border);
    --scrollbar-thumb-hover: var(--color-btn-hover-border);
}

@media (hover: none), (pointer: coarse) {
    :root {
        --btn-icon-hover-scale: 1;
        --scrollbar-thumb-hover: var(--scrollbar-thumb);
    }
}

/* Скроллбары: Firefox + Chromium/Safari/Edge (WebKit) */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

*::-webkit-scrollbar {
    width: var(--scrollbar-size);
    height: var(--scrollbar-size);
}

*::-webkit-scrollbar-track {
    background: var(--scrollbar-track);
}

*::-webkit-scrollbar-thumb {
    background-color: var(--scrollbar-thumb);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

*::-webkit-scrollbar-thumb:hover {
    background-color: var(--scrollbar-thumb-hover);
}

*::-webkit-scrollbar-corner {
    background: transparent;
}

/* Базовая типографика контента */
#UI h1, #UI h2, #UI h3, #UI h4, #UI h5, #UI h6 {
    margin: 0.6em 0 0.35em;
    font-family: var(--font-ui);
    font-weight: 600;
    line-height: 1.25;
    color: var(--color-null-element-text);
}

#UI h1 { font-size: 1.75em; }

#UI h2 { font-size: 1.45em; }

#UI h3 { font-size: 1.2em; }

#UI h4 { font-size: 1.05em; }

#UI h5 { font-size: 0.95em; font-weight: 500; }

#UI h6 { font-size: 0.85em; font-weight: 500; opacity: 0.9; }

#UI p {
    margin: 0 0 0.75em;
    line-height: 1.45;
}

#UI a {
    color: var(--color-link);
    text-underline-offset: 2px;
}

#UI a:hover {
    color: var(--color-link-hover);
}

#UI strong, #UI b {
    font-weight: 650;
    color: var(--color-null-element-text);
}

#UI em, #UI i {
    font-style: italic;
}

#UI small {
    font-size: 85%;
    opacity: 0.85;
}

#UI ul, #UI ol {
    margin: 0 0 0.75em;
    padding-left: 1.35em;
    line-height: 1.45;
}

#UI li {
    margin: 0.2em 0;
}

#UI hr {
    margin: 1em 0;
    border: 0;
    border-top: 1px solid var(--color-null-element-border);
}

#UI blockquote {
    margin: 0.75em 0;
    padding: 0.35em 0 0.35em 0.9em;
    border-left: 3px solid var(--color-null-element-border);
    color: var(--color-ui-text);
    opacity: 0.9;
}

#UI blockquote p:last-child {
    margin-bottom: 0;
}

#UI code, #UI kbd, #UI samp {
    font-family: var(--font-mono);
    font-size: 0.9em;
    padding: 0.1em 0.35em;
    border-radius: 3px;
    background: var(--color-null-element-bg);
    border: 1px solid var(--color-null-element-border);
    color: var(--color-null-element-text);
    user-select: text;
}

#UI pre {
    margin: 0.75em 0;
    padding: 0.75em 0.9em;
    overflow: auto;
    font-family: var(--font-mono);
    font-size: 0.85em;
    line-height: 1.4;
    border-radius: 4px;
    background: var(--color-panel-bg);
    border: 1px solid var(--color-null-element-border);
    color: var(--color-null-element-text);
    user-select: text;
}

#UI pre code {
    padding: 0;
    border: 0;
    background: transparent;
    font-size: inherit;
    border-radius: 0;
}

#UI mark {
    background: #5a5340;
    color: var(--color-null-element-text);
    padding: 0 0.2em;
    border-radius: 2px;
}

#UI {

    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    background-color: var(--color-ui-bg);
    color: var(--color-ui-text);
    font-family: var(--font-ui);
    user-select: none;
}

#dev_tools {
    position: fixed;
    left: 16px;
    bottom: 16px;
    z-index: 100000;
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 8px;
    pointer-events: auto;
}

#dev_tools[hidden] {
    display: none !important;
}

#page_selector {
    position: relative;
    width: 44px;
    height: 44px;
    border-radius: 100%;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-image: url('../../ico/bt/more-vert.svg');
    background-repeat: no-repeat;
    background-position: center;
    --btn-icon-size: 56%;
    background-size: var(--btn-icon-size);
    box-sizing: border-box;
    cursor: pointer;
    transition: background-size 0.06s ease;
}

/* Dev: переключатель Go API (prod domain ↔ IP ↔ local). */
#dev_api_toggle {
    position: relative;
    width: 44px;
    height: 44px;
    border-radius: 100%;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-image: url('../../ico/bt/code.svg');
    background-repeat: no-repeat;
    background-position: center;
    --btn-icon-size: 52%;
    background-size: var(--btn-icon-size);
    box-sizing: border-box;
    cursor: pointer;
    transition: background-size 0.06s ease, border-color 0.12s ease, background-color 0.12s ease;
}

#dev_api_toggle[data-mode="ip"] {
    border-color: #5a8fc9;
    background-color: rgba(60, 110, 180, 0.28);
}

#dev_api_toggle[data-mode="local"] {
    border-color: #c9a05a;
    background-color: rgba(180, 130, 60, 0.28);
}

/* Dev: однократный тест API + WS (лог в console). */
#dev_conn_test {
    position: relative;
    width: 44px;
    height: 44px;
    border-radius: 100%;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-image: url('../../ico/bt/wifi.svg');
    background-repeat: no-repeat;
    background-position: center;
    --btn-icon-size: 52%;
    background-size: var(--btn-icon-size);
    box-sizing: border-box;
    cursor: pointer;
    transition: background-size 0.06s ease, opacity 0.12s ease;
}

#dev_conn_test[data-busy="1"] {
    opacity: 0.55;
    pointer-events: none;
}

#page_selector_content {
    display: none;
    position: absolute;
    bottom: calc(100% + 8px);
    left: 0;
    min-width: 600px;
    max-width: min(360px, calc(100vw - 32px));
    max-height: min(360px, 50vh);
    overflow-x: hidden;
    overflow-y: auto;
    padding: 12px;
    box-sizing: border-box;
    background-color: var(--color-null-element-bg);
    border: 1px solid var(--color-null-element-border);
    border-radius: 12px;
    box-shadow: 0 0px 30px 2px rgba(0, 0, 0, 0.35);
    cursor: default;
    flex-wrap: wrap;
    gap: 6px;
}

#page_selector[open="1"] #page_selector_content {
    display: flex;
}

#page_selector .page_selector-btn {
    flex: 0 0 calc((100% - 12px) / 3);
    width: calc((100% - 12px) / 3);
    margin: 0;
    padding: 6px 4px;
    border: 1px solid var(--color-btn-border);
    border-radius: 6px;
    background: var(--color-btn-bg);
    color: var(--color-btn-text);
    font: inherit;
    font-size: 80%;
    line-height: 1.25;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    box-sizing: border-box;
}

#page_selector .page_selector-btn:hover {
    background: var(--color-btn-hover-bg);
    border-color: var(--color-btn-hover-border);
}

#page_selector .page_selector-btn.is-active {
    border-color: var(--color-btn-hover-border);
    background: var(--color-btn-active-bg);
    color: var(--color-btn-active-text);
}

#page_selector .page_selector-btn.needs-auth {
    border-color: #8a6a3a;
    color: #d4b37a;
}

#page_selector .page_selector-btn.needs-auth:hover {
    border-color: #b8924a;
    color: #e8c98a;
}

#page_selector .page_selector-btn.needs-auth.is-active {
    border-color: #c9a05a;
    background: rgba(180, 130, 60, 0.25);
    color: #f0d9a0;
}

.section-fullscreen {
    display: grid;
    grid-template-columns: minmax(0, 120px) minmax(0, 1fr);
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    height: auto;
    overflow: hidden;
    box-sizing: border-box;
}

/* Guest-страницы: одна колонка — иначе при display:none у #LP/#LA контент
   попадает в узкий первый трек (120px/70px) и сжимается. */
.section-fullscreen.layout-guest {
    grid-template-columns: minmax(0, 1fr);
}

.section-fullscreen.layout-guest #LP {
    display: none;
}

#RP {
    display: grid;
    grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
    color: var(--color-ui-text);
    background-color: var(--color-null-element-bg);
    margin: 20px 20px 20px 0;
    border-radius: 20px;
    overflow: hidden;
}

/* Оверлеи аватара / текстового статуса / скачивания */
#IFM_avatar_edit,
#IFM_text_status,
#IFM_download {
    position: fixed;
    inset: 0;
    z-index: 50000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: #0f0f0fb3;
    backdrop-filter: blur(4px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
}

#IFM_qr_auth,
#IFM_qr_scan {
    position: fixed;
    inset: 0;
    z-index: 50020;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: #0f0f0fb3;
    backdrop-filter: blur(4px);
    overflow: hidden;
    box-sizing: border-box;
}

#IFM_avatar_edit[hidden],
#IFM_text_status[hidden],
#IFM_download[hidden],
#IFM_qr_auth[hidden],
#IFM_qr_scan[hidden] {
    display: none !important;
}

.IFM_panel {
    width: 100%;
    max-width: 520px;
    margin: 0;
    padding: 22px;
    background: var(--color-null-element-bg-opacity);
    background: #343434f2;
    box-shadow: 0 0 20px #1a1a1a;
    border-radius: 10px;
    color: var(--color-null-element-text);
    backdrop-filter: blur(8px);
}

.IFM_panel:focus {
    outline: none;
}

.IFM_panel-title {
    margin: 0 0 16px;
    font-size: 110%;
    font-weight: bold;
}

.IFM_avatar_edit-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 16px;
}

.IFM_avatar_edit-side {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.IFM_avatar_edit-preview {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-panel-bg);
    background-image: url('../../ico/bt/avatar.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 55%;
}

.IFM_avatar_edit-preview[have_img="1"] {
    background-size: cover;
}

.IFM_avatar_edit-upload {
    width: 100%;
    min-height: 160px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px dashed var(--color-null-element-border);
    border-radius: 10px;
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.IFM_avatar_edit-upload[hidden] {
    display: none !important;
}

.IFM_avatar_edit-upload-icon {
    width: 36px;
    height: 36px;
    background: url('../../ico/bt/add.svg') center / contain no-repeat;
}

.IFM_panel-actions {
    display: flex;
    gap: 8px;
    margin-top: 16px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.IFM_upload_progress {
    margin-top: 16px;
    padding: 12px;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.IFM_upload_progress[hidden] {
    display: none !important;
}

.IFM_upload_progress-label {
    margin-bottom: 8px;
    font-size: 90%;
}

.IFM_upload_progress-track {
    height: 8px;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.12);
    overflow: hidden;
}

.IFM_upload_progress-bar {
    height: 100%;
    width: 0%;
    background: var(--color-lpd-active-border);
    transition: width 0.1s linear;
}

.IFM_upload_progress-pct {
    margin-top: 6px;
    font-size: 85%;
    opacity: 0.85;
}

.IFM_upload_progress-error {
    margin-top: 8px;
    color: #ffb4b4;
    font-size: 90%;
}

.IFM_text_status-field {
    width: 100%;
    min-height: 90px;
    margin: 0 0 8px;
    padding: 10px;
    box-sizing: border-box;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: var(--color-panel-bg);
    color: inherit;
    font: inherit;
    resize: vertical;
}

.IFM_text_status-count {
    margin: 0 0 14px;
    font-size: 80%;
    opacity: 0.6;
    text-align: right;
}

.IFM_text_status-history {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0 0 14px;
}

.IFM_text_status-history[hidden] {
    display: none !important;
}

.IFM_text_status-history-item {
    display: block;
    width: 100%;
    text-align: left;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 90%;
    cursor: pointer;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.IFM_text_status-history-item:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: var(--color-btn-hover-border);
}

#RA {
    min-width: 0;
    min-height: 0;
    height: 100%;
    overflow: hidden;
    position: relative;
    z-index: 0;
}

#RAD {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    width: 100%;
    height: calc(100% - var(--rau-chrome-height, 52px));
    min-height: 0;
    overflow: hidden;
    gap: 0px;
    position: relative;
    z-index: 1;
}

.channel_kind_tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 14px;
}

.channel_kind_tabs[hidden] {
    display: none !important;
}

.channel_kind_tab {
    padding: 10px 12px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: transparent;
    color: var(--color-ui-text);
    font: inherit;
    cursor: pointer;
}

.channel_kind_tab.is-active {
    background: var(--color-null-element-bg);
    border-color: var(--color-btn-hover-border);
}

.channel_kind_tab:disabled {
    cursor: default;
    opacity: 0.85;
}

.channel_edit_form .auth_form-field textarea,
.channel_edit_form .ifm_form-field textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--color-null-element-border);
    background: var(--color-null-element-bg);
    color: var(--color-ui-text);
    border-radius: 8px;
    padding: 8px 10px;
    font: inherit;
}

.channel_icon_row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.channel_icon_preview.lac_item-icon {
    width: 36px;
    height: 36px;
    min-width: 36px;
    background-size: 18px 18px;
}

.channel_icon_preview.lac_item-icon.has-emoji .lac_item-icon-emoji {
    width: 24px;
    height: 24px;
}

.channel_icon_picker {
    margin-top: 12px;
    max-height: 220px;
    overflow: auto;
    border: 1px solid var(--color-null-element-border);
    border-radius: 10px;
    padding: 8px;
    background: rgba(0, 0, 0, 0.16);
}

.channel_setting_block {
    margin: 12px 0 16px;
    padding: 12px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.12);
}

.channel_setting_block-title {
    font-weight: 600;
    margin-bottom: 10px;
}

.channel_slowmode_row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.channel_slowmode_sec {
    display: flex;
    align-items: center;
    gap: 6px;
}

.channel_slowmode_sec input[type="number"] {
    width: 72px;
    box-sizing: border-box;
    border: 1px solid var(--color-null-element-border);
    background: var(--color-null-element-bg);
    color: var(--color-ui-text);
    border-radius: 8px;
    padding: 6px 8px;
    font: inherit;
}

.channel_setting_hint {
    margin: 10px 0 15px;
    font-size: 85%;
    opacity: 0.7;
    line-height: 1.4;
}

.ifm_switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--color-ui-text);
    font: inherit;
    cursor: pointer;
}

.ifm_switch:disabled,
.ifm_switch[data-locked="1"] {
    cursor: default;
    opacity: 0.75;
}

.ifm_switch-track {
    position: relative;
    width: 44px;
    height: 24px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid var(--color-null-element-border);
    box-sizing: border-box;
    transition: background 0.15s ease;
}

.ifm_switch-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #cfcfcf;
    transition: transform 0.15s ease, background 0.15s ease;
}

.ifm_switch[data-on="1"] .ifm_switch-track {
    background: var(--color-switch-on-track);
    border-color: var(--color-switch-on-border);
}

.ifm_switch[data-on="1"] .ifm_switch-thumb {
    transform: translateX(20px);
    background: var(--color-switch-on-thumb);
}

.ifm_switch-label {
    min-width: 2.5em;
    font-size: 85%;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.ifm_switch_row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    margin: 0 0 12px;
    box-sizing: border-box;
}

.ifm_switch_row-label {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    font-size: 90%;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.ifm_switch_row .ifm_switch {
    flex: 0 0 auto;
    margin: 0;
}

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

.ifm_radio_options {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 12px;
}

label.ifm_radio_option,
.ifm_form-field.ifm_radio_option {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--color-null-element-border, rgba(255, 255, 255, 0.12));
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.04);
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    flex-direction: row !important;
}

label.ifm_radio_option:hover:not(:has(input:disabled)),
.ifm_form-field.ifm_radio_option:hover:not(:has(input:disabled)) {
    background: rgba(255, 255, 255, 0.07);
}

label.ifm_radio_option:has(input[type="radio"]:checked),
.ifm_form-field.ifm_radio_option:has(input[type="radio"]:checked) {
    border-color: var(--color-accent, #6aa3ff);
    box-shadow: inset 0 0 0 1px rgba(106, 163, 255, 0.35);
}

label.ifm_radio_option::before,
.ifm_form-field.ifm_radio_option::before {
    content: '';
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.45);
    box-sizing: border-box;
    background: transparent;
}

label.ifm_radio_option:has(input[type="radio"]:checked)::before,
.ifm_form-field.ifm_radio_option:has(input[type="radio"]:checked)::before {
    border-color: var(--color-accent, #6aa3ff);
    background: radial-gradient(circle at center, var(--color-accent, #6aa3ff) 0 4px, transparent 4px);
}

label.ifm_radio_option input[type="radio"],
.ifm_form-field.ifm_radio_option input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    pointer-events: none;
}

label.ifm_radio_option > span,
.ifm_form-field.ifm_radio_option > span {
    flex: 1 1 auto;
    min-width: 0;
    line-height: 1.35;
}

.channel_snap_slider {
    width: 100%;
}

.channel_snap_slider input[type="range"] {
    width: 100%;
    margin: 0 0 8px;
    accent-color: var(--color-accent);
    cursor: pointer;
}

.channel_snap_labels {
    display: flex;
    justify-content: space-between;
    gap: 4px;
    font-size: 75%;
    opacity: 0.75;
}

.channel_snap_unit {
    margin-top: 4px;
    font-size: 75%;
    opacity: 0.55;
    text-align: right;
}

.channel_setting_check {
    margin-bottom: 10px;
}

.project_edit_form .auth_form-field textarea,
.project_edit_form .auth_form-field select,
.project_edit_form .ifm_form-field textarea,
.project_edit_form .ifm_form-field select {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--color-null-element-border);
    background: var(--color-null-element-bg);
    color: var(--color-ui-text);
    border-radius: 8px;
    padding: 8px 10px;
    font: inherit;
}

.project_edit_check {
    flex-direction: row !important;
    align-items: center;
    gap: 8px;
}

.project_edit_form .ifm_switch_row {
    margin-bottom: 10px;
}

.news_edit_form .ifm_form-field textarea {
    width: 100%;
    min-height: 88px;
    margin: 0;
    padding: 8px 12px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background-color: var(--color-null-element-bg);
    color: var(--color-null-element-text);
    font: inherit;
    font-size: 14px;
    outline: none;
    resize: vertical;
    box-sizing: border-box;
}

.news_edit_form .ifm_form-field textarea:focus {
    border-color: var(--color-btn-hover-border);
}

.news_edit_check {
    flex-direction: row !important;
    align-items: center;
    gap: 8px;
}

.news_edit_check input[type="checkbox"] {
    width: auto !important;
    height: auto;
    margin: 0;
}

.news_edit_tags-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 8px;
    margin-bottom: 8px;
}

.news_edit_tag_chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    padding: 4px 8px 4px 10px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 999px;
    background: transparent;
    box-sizing: border-box;
}

.news_edit_tag_chip-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.news_edit_tag_chip-remove {
    flex: 0 0 auto;
    margin: 0;
    padding: 0 2px;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    line-height: 1;
    opacity: 0.65;
    cursor: pointer;
}

.news_edit_tag_chip-remove:hover {
    opacity: 1;
}

.news_edit_tags-add {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.news_edit_tags-add input[type="text"] {
    flex: 1 1 140px;
    min-width: 0;
}

.news_edit_avatar-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 6px;
}

.news_edit_avatar-preview {
    flex: 0 0 auto;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-sizing: border-box;
}

.news_edit_avatar-preview[have_img="1"] .news_edit_avatar-letter {
    display: none;
}

.news_edit_avatar-letter {
    font-size: 140%;
    font-weight: 700;
    opacity: 0.7;
}

.news_edit_avatar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.news_edit_bg-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 6px;
}

.news_edit_bg-preview {
    flex: 0 0 auto;
    width: 72px;
    height: 48px;
    border-radius: 8px;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.news_edit_bg-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.project_edit_logo {
    margin: 0 0 18px;
}

.project_edit_logo-label {
    margin: 0 0 8px;
    font-size: 90%;
    opacity: 0.85;
}

.project_edit_logo-row {
    display: flex;
    align-items: center;
    gap: 14px;
}

.project_edit_logo-preview {
    position: relative;
    flex: 0 0 auto;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
}

.project_edit_logo-letter {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 140%;
    font-weight: 600;
    opacity: 0.85;
    pointer-events: none;
}

.project_edit_logo-preview[have_img="1"] .project_edit_logo-letter {
    display: none;
}

.project_edit_logo-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.project_edit_logo .IFM_upload_progress {
    margin-top: 10px;
}

.project_edit_join_bg-preview {
    position: relative;
    flex: 0 0 auto;
    width: 140px;
    height: 80px;
    border-radius: 10px;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
}

#project_join {
    min-height: 100%;
    position: relative;
    z-index: 1;
}

.project_join-stage {
    display: flex;
    justify-content: center;
    min-height: min(70vh, 640px);
}

.project_join-col {
    flex: 0 1 420px;
    min-width: 0;
}

.project_join-col--right {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 20px;
}

.project_join-card {
    width: min(100%, 380px);
    color: var(--color-ui-text);
}

.project_join-head {
    display: flex;
    gap: 14px;
    align-items: center;
    margin-bottom: 18px;
}

.project_join-meta {
    color: #fff;
}

.project_join-logo {
    position: relative;
    width: 64px;
    height: 64px;
    flex: 0 0 64px;
    border-radius: 14px;
    background: var(--color-null-element-bg) center / cover no-repeat;
    border: 1px solid var(--color-null-element-border);
    overflow: hidden;
}

.project_join-logo-letter {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    font-weight: 700;
    opacity: 0.8;
}

.project_join-name {
    font-size: 120%;
    font-weight: 700;
    line-height: 1.25;
}

.project_join-descr {
    margin-top: 4px;
    font-size: 90%;
    opacity: 0.8;
    line-height: 1.35;
    white-space: pre-wrap;
    word-break: break-word;
}

.project_join-body .auth_form,
.project_join-body .ifm_form {
    background: transparent;
    box-shadow: none;
    padding: 0;
    max-width: none;
}

@media (max-width: 720px) {
    .project_join-col--right {
        flex-basis: 100%;
    }
}

.user_settings_form .user_settings_section {
    margin: 0 0 18px;
}

.user_settings_form.ifm_form {
    max-width: 920px;
    padding: 16px 15px;
}

.user_settings_general_split {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: flex-start;
}

.user_settings_general_preview {
    flex: 0 0 300px;
    width: 300px;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.user_settings_general_fields {
    flex: 1 1 280px;
    min-width: 0;
}

.user_settings_card_preview {
    width: 100%;
    pointer-events: none;
    user-select: none;
}

.user_settings_card_preview #IFM_user_card_preview {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    z-index: 0;
    box-shadow: none;
}

.user_settings_card_preview .user_card-profile_links {
    pointer-events: none;
}

.user_settings_profile_links {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 4px;
}

.user_settings_profile_link_item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 92%;
}

.user_settings_profile_link_name {
    min-width: 0;
    word-break: break-word;
}

.user_card-profile_links.user_card-row {
    display: block;
    width: 100%;
    margin: 0 0 8px;
    padding: 4px 10px 10px;
    box-sizing: border-box;
}

.user_card-profile_links .lau_project_news_list {
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    gap: 8px;
    width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.user_card-profile_links .lau_project_news_item {
    width: 100%;
    pointer-events: auto;
    cursor: pointer;
}

.user_settings_card_bg_row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.user_card_bg_picker_grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
    max-height: min(50vh, 360px);
    overflow-y: auto;
    margin: 10px 0 4px;
}

.user_card_bg_picker_item {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 8px;
    border: 1px solid var(--color-null-element-border, #444);
    border-radius: 10px;
    background: transparent;
    color: inherit;
    cursor: pointer;
    text-align: left;
    font: inherit;
}

.user_card_bg_picker_item.is-active {
    border-color: var(--color-btn-hover-border, #7aa2ff);
    box-shadow: 0 0 0 1px var(--color-btn-hover-border, #7aa2ff);
}

.user_card_bg_picker_preview {
    display: block;
    width: 100%;
    aspect-ratio: 14 / 5;
    min-height: 52px;
    max-height: 110px;
    border-radius: 8px;
    border: 1px solid var(--color-null-element-border, #444);
    background-color: var(--color-panel-bg, #222);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    box-sizing: border-box;
}

.user_card_bg_picker_preview--none {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-null-element-bg, #1a1a1a);
    background-image: none;
    color: var(--color-ui-text, #ccc);
}

.user_card_bg_picker_none-icon {
    display: block;
    width: min(72%, 88px);
    height: auto;
    opacity: 0.72;
}

.user_card_bg_picker_name {
    font-size: 90%;
    line-height: 1.25;
    word-break: break-word;
}

.user_card_bg_picker_status {
    font-size: 92%;
    opacity: 0.75;
    margin-top: 6px;
}

.user_settings_card_bg_row input[type="color"] {
    width: 48px;
    height: 36px;
    padding: 0;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: transparent;
    cursor: pointer;
}

.user_settings_form .user_settings_about .ifm_form-field textarea {
    width: 100%;
    min-height: 72px;
    box-sizing: border-box;
    border: 1px solid var(--color-null-element-border);
    background: var(--color-null-element-bg);
    color: var(--color-ui-text);
    border-radius: 8px;
    padding: 8px 10px;
    font: inherit;
    outline: none;
    resize: vertical;
}

.user_settings_form .user_settings_about .ifm_form-field textarea:focus {
    border-color: var(--color-btn-hover-border);
}

.user_settings_form .user_settings_section-title {
    margin: 0 0 10px;
    font-size: 95%;
    font-weight: 600;
    opacity: 0.9;
}

.user_settings_xp-ratio {
    margin: 0 0 10px;
    font-variant-numeric: tabular-nums;
    opacity: 0.9;
}

.user_settings_xp-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.user_settings_xp-badge.usr_lvl {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    flex: 0 0 40px;
}

.user_settings_xp-bar {
    flex: 1 1 auto;
    height: 10px;
    min-width: 0;
    overflow: hidden;
    border-radius: 6px;
    background: var(--color-list-bg, rgba(255, 255, 255, 0.08));
}

.user_settings_xp-bar-fill {
    height: 100%;
    width: 0;
    border-radius: 6px;
    background: var(--color-lpd-active-border, #6aa8ff);
}

.user_settings_gifts-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.user_settings_gift {
    display: flex;
    align-items: center;
    gap: 12px;
}

.user_settings_gift-img {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 8px;
    background: var(--color-panel-bg) center / cover no-repeat;
}

.user_settings_gift-meta {
    min-width: 0;
}

.user_settings_gift-caption {
    font-size: 90%;
}

.user_settings_gift-date {
    font-size: 80%;
    opacity: 0.7;
}

.user_settings_gifts-empty {
    opacity: 0.7;
}

.user_settings_form .user_settings_desktop_launch {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 24px;
    margin: 0 0 8px;
}

.user_settings_form .user_settings_desktop_launch .auth_form-field,
.user_settings_form .user_settings_desktop_launch .ifm_form-field {
    flex: 1 1 240px;
    margin: 0;
}

.user_settings_form .user_settings_cat[hidden] {
    display: none !important;
}

.user_settings_lac {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    padding: 8px 15px;
    box-sizing: border-box;
}

.user_settings_lac_list {
    display: flex;
    flex-direction: column;
    gap: 4px;
    overflow-y: auto;
    min-height: 0;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--color-null-element-border);
}

.user_settings_lac_item {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    padding: 8px 10px;
    border-radius: 8px;
    cursor: pointer;
    min-width: 0;
}

.user_settings_lac_item:hover,
.user_settings_lac_item.is-active {
    background: rgba(255, 255, 255, 0.06);
}

.user_settings_lac_item.is-active {
    font-weight: 600;
}

.user_settings_lac_logout {
    margin-top: 10px;
    padding-top: 12px;
}

#IFM_user_settings {
    position: fixed;
    inset: 0;
    z-index: 50000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: #0f0f0fb3;
    backdrop-filter: blur(4px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
}

#IFM_user_settings[hidden],
#IFM_project_settings[hidden],
#IFM_news_settings[hidden],
#IFM_project_roles[hidden],
#IFM_news_roles[hidden] {
    display: none !important;
}

.IFM_settings-modal,
#IFM_user_settings {
    position: fixed;
    inset: 0;
    z-index: 50000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: #0f0f0fb3;
    backdrop-filter: blur(4px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
}

.IFM_user_settings-panel {
    width: min(1040px, 100%);
    height: min(88vh, 860px);
    max-height: calc(100dvh - 48px);
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: var(--color-null-element-bg-opacity);
    background: #343434f2;
    box-shadow: 0 0 20px #1a1a1a;
    border-radius: 12px;
    color: var(--color-null-element-text);
    backdrop-filter: blur(8px);
}

.IFM_user_settings-head {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    padding: 12px 14px;
    border-bottom: 1px solid var(--color-null-element-border);
}

.IFM_user_settings-head-title {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 110%;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.IFM_user_settings-back,
.IFM_user_settings-close {
    appearance: none;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
    padding: 6px 8px;
    border-radius: 8px;
    flex: 0 0 auto;
}

.IFM_user_settings-back:hover,
.IFM_user_settings-close:hover {
    background: rgba(255, 255, 255, 0.08);
}

.IFM_user_settings-close {
    font-size: 150%;
    line-height: 1;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.IFM_user_settings-close::before {
    content: "×";
}

.IFM_user_settings-layout {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
}

#user_settings_lac_nav {
    flex: 0 0 240px;
    width: 240px;
    min-height: 0;
    border-right: 1px solid var(--color-null-element-border);
    overflow: hidden;
}

#user_settings_lac_nav .user_settings_lac {
    height: 100%;
    padding: 10px 12px;
}

.IFM_user_settings-body-wrap {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
}

#user_settings_body .user_settings_form.ifm_form {
    max-width: none;
    padding: 16px 18px 24px;
}

#user_settings_body .user_settings_form .ifm_form-title {
    display: none;
}

.IFM_settings-modal-panel {
    width: min(720px, 100%);
    height: min(88vh, 860px);
    max-height: calc(100dvh - 48px);
}

#IFM_project_settings .IFM_settings-modal-panel {
    width: min(720px, 100%);
}

#IFM_project_roles {
    z-index: 50010;
}

#IFM_news_roles {
    z-index: 50020;
}

#IFM_project_roles .IFM_project_roles-panel,
#IFM_news_roles .IFM_news_roles-panel {
    width: min(1180px, 100%);
}

.IFM_settings-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 16px 18px 20px;
}

.IFM_settings-modal-body .ifm_form-title {
    display: none;
}

.IFM_settings-modal-footer {
    flex: 0 0 auto;
    padding: 12px 14px;
    border-top: 1px solid var(--color-null-element-border);
}

.IFM_settings-modal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.IFM_settings-modal-actions .ifm_form-submit,
.IFM_settings-modal-actions .ifm_form-link-btn,
.IFM_settings-modal-actions .project_edit_delete {
    flex: 1 1 auto;
    min-width: 120px;
}

.IFM_settings-modal-actions .project_edit_delete[hidden],
.IFM_settings-modal-actions .ifm_form-link-btn[hidden] {
    display: none !important;
}

.IFM_project_roles-layout,
.IFM_news_roles-layout {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
}

#IFM_project_roles_nav,
#IFM_news_roles_nav {
    flex: 0 0 220px;
    width: 220px;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 8px 10px;
    border-right: 1px solid var(--color-null-element-border);
    box-sizing: border-box;
}

#IFM_project_roles_nav .project_roles_lac,
#IFM_news_roles_nav .project_roles_lac {
    height: auto;
    min-height: 0;
}

#IFM_project_roles_form,
#IFM_news_roles_form {
    flex: 1 1 42%;
    min-width: 0;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    border-right: 1px solid var(--color-null-element-border);
}

#IFM_project_roles_form .ifm_form-field input,
#IFM_project_roles_form .ifm_form-field textarea,
#IFM_news_roles_form .ifm_form-field input {
    pointer-events: auto;
}

#IFM_project_roles .IFM_project_roles-panel,
#IFM_news_roles .IFM_news_roles-panel {
    pointer-events: auto;
}

#IFM_project_roles_members,
#IFM_news_roles_members {
    flex: 0 0 300px;
    width: 300px;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 12px 14px;
    box-sizing: border-box;
}

#form_project_roles[data-news-mode="1"] .news_roles_perm_row {
    margin: 12px 0;
}

#form_project_roles[data-news-mode="1"] .news_roles_perm_role {
    font-weight: 600;
    margin-bottom: 12px;
}

.news_roles_perm_row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.news_roles_perm_hint {
    margin-top: 10px;
}

.user_settings_form .user_settings_2fa .ifm_select[data-name="twofa_type"][data-disabled="1"] {
    opacity: 0.55;
}

.user_settings_form .user_settings_logout {
    margin-top: 8px;
}

.user_settings_subsec {
    margin: 0 0 16px;
    padding: 12px 0 4px;
    border-top: 1px solid var(--color-null-element-border);
}

.user_settings_subsec-title {
    margin: 0 0 10px;
    font-size: 90%;
    font-weight: 600;
}

.user_settings_range {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0 0 12px;
}

.user_settings_range-label {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    font-size: 90%;
}

.user_settings_range input[type="range"] {
    width: 100%;
    accent-color: var(--color-accent);
}

.user_settings_snap {
    margin: 0 0 12px;
}

.user_settings_snap-title {
    margin: 0 0 6px;
    font-size: 90%;
}

.user_settings_devices .ifm_switch {
    margin: 0 0 12px;
    width: 100%;
}

.user_settings_devices .ifm_switch_row .ifm_switch {
    width: auto;
    margin: 0;
}

.user_settings_dm .ifm_switch {
    margin: 4px 0 0;
    width: 100%;
}

.user_settings_dm .ifm_switch_row .ifm_switch {
    width: auto;
    margin: 0;
}

.user_settings_hotkey_row_ptt {
    margin-top: 16px;
}

.user_settings_hotkeys_enable {
    margin-top: 16px;
}

.user_settings_hotkey_rows {
    margin-top: 10px;
    max-width: 100%;
    box-sizing: border-box;
}

.user_settings_hotkey_rows[data-disabled="1"] {
    opacity: 0.25;
}

.user_settings_form .user_settings_hotkey_row.ifm_form-field {
    display: block;
    max-width: 100%;
    margin: 0 0 12px;
    box-sizing: border-box;
}

.user_settings_hotkey_row-label {
    display: block;
    margin: 0 0 6px;
    font-size: 90%;
    line-height: 1.35;
}

.user_settings_hotkey_row-ctrl {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.user_settings_hotkey_rows .user_settings_hotkey_capture,
.user_settings_hotkey_row_ptt .user_settings_hotkey_capture {
    width: 100%;
    min-width: 0;
    min-height: 40px;
    margin: 0;
    padding: 8px 12px;
    box-sizing: border-box;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: var(--color-null-element-bg);
    color: var(--color-null-element-text);
    font: inherit;
    font-size: 14px;
    line-height: 1.25;
    text-align: left;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.user_settings_hotkey_rows .user_settings_hotkey_capture:hover,
.user_settings_hotkey_row_ptt .user_settings_hotkey_capture:hover {
    border-color: var(--color-btn-hover-border);
}

.user_settings_hotkey_rows .user_settings_hotkey_capture:focus,
.user_settings_hotkey_row_ptt .user_settings_hotkey_capture:focus {
    outline: 2px solid rgba(40, 120, 200, 0.35);
    outline-offset: 1px;
    border-color: var(--color-btn-hover-border);
}

.user_settings_hotkey_rows .user_settings_hotkey_reset,
.user_settings_hotkey_row_ptt .user_settings_hotkey_reset,
.user_settings_mic_ptt_row .user_settings_hotkey_reset,
.user_settings_mic_ptt_row .user_settings_mic_ptt_go_hotkeys {
    align-self: stretch;
    max-width: 9.5em;
    margin-top: 0;
    padding: 8px 10px;
    white-space: normal;
    line-height: 1.2;
    text-align: center;
}

.user_settings_mic_input_mode {
    display: grid;
    gap: 10px;
    margin: 0 0 14px;
}

.user_settings_hotkey_radios {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 12px;
}

.user_settings_mic_input_mode.ifm_radio_options {
    margin-bottom: 12px;
}

.ifm_radio_option.user_settings_mic_ptt_row {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: center;
    column-gap: 10px;
    row-gap: 10px;
}

.ifm_radio_option.user_settings_mic_ptt_row::before {
    grid-column: 1;
    grid-row: 1;
    justify-self: center;
}

.ifm_radio_option.user_settings_mic_ptt_row > input[type="radio"] {
    grid-column: 1;
    grid-row: 1;
    justify-self: center;
}

.ifm_radio_option.user_settings_mic_ptt_row > span[data-lab] {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
}

.ifm_radio_option.user_settings_mic_ptt_row > .user_settings_mic_ptt_ctrl,
.ifm_radio_option.user_settings_mic_ptt_row > .user_settings_hotkey_row-ctrl {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    max-width: 100%;
    margin: 0;
    box-sizing: border-box;
    grid-template-columns: minmax(0, 1fr) auto auto;
}

.user_settings_sessions-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.user_settings_sessions-main {
    flex: 1 1 auto;
    min-width: 0;
}

.user_settings_sessions-icon {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    margin-top: 2px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.92;
}

.user_settings_sessions-icon--android {
    background-image: url('../../ico/bt/android.svg');
}

.user_settings_sessions-icon--ios {
    background-image: url('../../ico/bt/phone-iphone.svg');
}

.user_settings_sessions-icon--desktop {
    background-image: url('../../ico/bt/desktop-windows.svg');
}

.user_settings_sessions-icon--terminal {
    background-image: url('../../ico/bt/terminal.svg');
}

.user_settings_sessions-icon--web {
    background-image: url('../../ico/bt/public.svg');
}

.user_settings_sessions-icon--default {
    background-image: url('../../ico/bt/wifi.svg');
}

.user_settings_points-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.user_settings_points-icon {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    margin-top: 1px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.92;
}

.user_settings_points-icon--gift {
    background-image: url('../../ico/bt/gift.svg');
}

.user_settings_points-icon--default {
    background-image: url('../../ico/bt/table-chart.svg');
}

.user_settings_points-body {
    padding-top: 3px;
    flex: 1 1 auto;
    min-width: 0;
}

.user_settings_hotkey_display {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 40px;
    margin: 0;
    padding: 8px 12px;
    box-sizing: border-box;
    border: 1px dashed var(--color-null-element-border);
    border-radius: 8px;
    background: transparent;
    color: var(--color-null-element-text);
    font: inherit;
    font-size: 14px;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.ifm_select {
    position: relative;
    margin: 0 0 12px;
}

.ifm_select-label {
    margin: 0 0 6px;
    font-size: 90%;
}

.ifm_select-btn {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: var(--color-panel-bg);
    color: var(--color-ui-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
    box-sizing: border-box;
}

.ifm_select-btn:hover {
    border-color: var(--color-btn-hover-border);
}

.ifm_select[data-disabled="1"] {
    opacity: 0.55;
    pointer-events: none;
}

.ifm_select-btn:disabled {
    cursor: default;
    opacity: 1;
}

.ifm_select-list {
    position: absolute;
    z-index: 20;
    left: 0;
    right: 0;
    top: calc(100% + 4px);
    max-height: 220px;
    margin: 0;
    padding: 6px 0;
    list-style: none;
    overflow-y: auto;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: var(--color-null-element-bg);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.ifm_select-list[hidden] {
    display: none !important;
}

.ifm_select-list.ifm_select-list--floating {
    left: auto;
    right: auto;
    min-width: 120px;
    z-index: 50030;
}

.ifm_select-list li {
    padding: 8px 12px;
    cursor: pointer;
}

.ifm_select-list li:hover,
.ifm_select-list li[aria-selected="true"] {
    background: rgba(255, 255, 255, 0.08);
}

/* Voice stage — только личный звонок в RADL (проектный аудио: main-rad-call.css) */
#RADL_call_stage #voice_stage {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    padding: 0 15px;
}

#RADL_call_stage #voice_stage .voice_stage-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
    flex: 0 0 auto;
    max-height: 34%;
    overflow-y: auto;
}

#RADL_call_stage #voice_stage .voice_stage-tiles.is-stage-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
}

#RADL_call_stage #voice_stage .voice_stage-tiles .rad_call-stage-empty {
    color: rgba(255, 255, 255, 0.58);
    font-size: 14px;
    line-height: 1.45;
    text-align: center;
    padding: 16px 20px;
    pointer-events: none;
    user-select: none;
}

#RADL_call_stage #voice_stage .voice_stage-tile {
    position: relative;
    aspect-ratio: 1 / 1;
    border: 1px solid var(--color-null-element-border);
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.28);
    overflow: hidden;
    cursor: default;
}

#RADL_call_stage #voice_stage .voice_stage-tile.has-video {
    cursor: pointer;
}

#RADL_call_stage #voice_stage .voice_stage-tile-quality {
    position: absolute;
    top: 6px;
    left: 6px;
    z-index: 5;
    max-width: calc(100% - 12px);
    padding: 2px 6px;
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.62);
    color: #f2f2f2;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    pointer-events: none;
    box-sizing: border-box;
}

#RADL_call_stage #voice_stage .voice_stage-tile-quality[hidden] {
    display: none !important;
}

#RADL_call_stage #voice_stage .voice_stage-tile video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #000;
}

#RADL_call_stage #voice_stage .voice_stage-tile-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
    color: #cfcfcf;
    font-size: 85%;
    font-weight: 600;
}

#RADL_call_stage #voice_stage .voice_stage-tile-placeholder[hidden] {
    display: none !important;
}

#RADL_call_stage #voice_stage .voice_stage-tile-name {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    padding: 8px 10px;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.72));
    color: #fff;
    font-size: 85%;
    font-weight: 600;
}

#RADL_call_stage #voice_stage .voice_stage-main {
    position: relative;
    flex: 1 1 auto;
    min-height: 180px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 14px;
    background: rgba(0, 0, 0, 0.35);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

#RADL_call_stage #voice_stage .voice_stage-main-empty {
    opacity: 0.7;
    text-align: center;
    padding: 16px;
}

#RADL_call_stage #voice_stage .voice_stage-main-video {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #000;
}

#RADL_call_stage #voice_stage .voice_stage-fs-btn {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 3;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.55);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

#RADL_call_stage #voice_stage .voice_stage-fs-btn:hover {
    background: rgba(0, 0, 0, 0.72);
    border-color: rgba(255, 255, 255, 0.4);
}

#RADL_call_stage #voice_stage .voice_stage-fs-btn-icon {
    display: block;
    width: 22px;
    height: 22px;
    background: url('../../ico/bt/fullscreen.svg') center / contain no-repeat;
}

#RADL_call_stage #voice_stage .voice_stage-fs-btn.is-fullscreen .voice_stage-fs-btn-icon {
    background-image: url('../../ico/bt/fullscreen-exit.svg');
}

/* Fullscreen: кнопка НЕ поверх video — иначе Edge/Chromium дают шлейф кадров. */
#RADL_call_stage #voice_stage .voice_stage-main:fullscreen,
#RADL_call_stage #voice_stage .voice_stage-main:-webkit-full-screen {
    width: 100%;
    height: 100%;
    border-radius: 0;
    border: none;
    background: #000;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    box-sizing: border-box;
}

#RADL_call_stage #voice_stage .voice_stage-main:fullscreen .voice_stage-main-empty,
#RADL_call_stage #voice_stage .voice_stage-main:-webkit-full-screen .voice_stage-main-empty {
    display: none !important;
}

#RADL_call_stage #voice_stage .voice_stage-main:fullscreen .voice_stage-main-video,
#RADL_call_stage #voice_stage .voice_stage-main:-webkit-full-screen .voice_stage-main-video {
    position: relative;
    flex: 1 1 auto;
    width: 100%;
    height: auto;
    min-height: 0;
    object-fit: contain;
    background: #000;
}

#RADL_call_stage #voice_stage .voice_stage-main:fullscreen .voice_stage-fs-btn,
#RADL_call_stage #voice_stage .voice_stage-main:-webkit-full-screen .voice_stage-fs-btn {
    position: static;
    flex: 0 0 auto;
    align-self: flex-end;
    margin: 10px 12px 12px;
    background: #1a1a1a;
    border-color: #3a3a3a;
}

#RADL_call_stage #voice_stage .voice_stage-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex: 0 0 auto;
}

#RADL_call_stage #voice_stage .voice_stage-action {
    flex: 1 1 110px;
    min-width: 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 10px 8px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
    color: var(--color-ui-text);
    font: inherit;
    font-size: 80%;
    cursor: pointer;
}

#RADL_call_stage #voice_stage .voice_stage-action:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.08);
}

#RADL_call_stage #voice_stage .voice_stage-action:disabled,
#RADL_call_stage #voice_stage .voice_stage-action.is-stub {
    opacity: 0.45;
    cursor: default;
}

#RADL_call_stage #voice_stage .voice_stage-action.is-active {
    border-color: var(--color-accent, #6aa3ff);
}

#RADL_call_stage #voice_stage .voice_stage-action-icon {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.12) center / 60% no-repeat;
}

#IFM_screen_pick {
    position: fixed;
    inset: 0;
    z-index: 10040;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.55);
}

#IFM_screen_pick[hidden] {
    display: none !important;
}

#IFM_session_takeover {
    position: fixed;
    inset: 0;
    z-index: 12200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(0, 0, 0, 0.6);
}

#IFM_session_takeover[hidden] {
    display: none !important;
}

#IFM_session_takeover .IFM_panel {
    max-width: 420px;
    width: 100%;
}

#IFM_session_takeover .IFM_panel-body {
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.45;
    color: #ddd;
    white-space: pre-wrap;
}

#IFM_session_takeover .IFM_panel-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 14px;
}

#RADL_call_stage #voice_stage .voice_stage-tile.is-speaking,
#voice_call.rad_call .voice_stage-tile.is-speaking,
#voice_call_secondary .voice_stage-tile.is-speaking,
#RADL_call_other .voice_stage-tile.is-speaking,
.rad_call-tiles--secondary .voice_stage-tile.is-speaking {
    border-color: rgba(80, 200, 120, 0.95);
    box-shadow: inset 0 0 0 2px rgba(80, 200, 120, 0.85);
}

#RADL_call_stage #voice_stage .voice_stage-tile.is-focused,
#voice_call.rad_call .voice_stage-tile.is-focused,
#voice_call_secondary .voice_stage-tile.is-focused,
#RADL_call_other .voice_stage-tile.is-focused {
    box-shadow: inset 0 0 0 2px rgba(120, 170, 255, 0.9);
}

#RADL_call_stage #voice_stage .voice_stage-tile.is-speaking.is-focused,
#voice_call.rad_call .voice_stage-tile.is-speaking.is-focused,
#voice_call_secondary .voice_stage-tile.is-speaking.is-focused,
#RADL_call_other .voice_stage-tile.is-speaking.is-focused {
    box-shadow: inset 0 0 0 2px rgba(80, 200, 120, 0.95), 0 0 0 1px rgba(120, 170, 255, 0.5);
}

#IFM_screen_pick .IFM_panel-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
}

#IFM_screen_pick .IFM_panel-actions button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

#IFM_screen_share_bar {
    position: fixed;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    z-index: 10030;
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: calc(100vw - 24px);
    padding: 10px 12px 10px 14px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 12px;
    background: rgba(28, 28, 28, 0.94);
    color: var(--color-null-element-text);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
    box-sizing: border-box;
}

#IFM_screen_share_bar[hidden] {
    display: none !important;
}

.IFM_screen_share_bar-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #e05555;
    flex: 0 0 auto;
}

.IFM_screen_share_bar-text {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 90%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.IFM_screen_share_bar-stop {
    flex: 0 0 auto;
    padding: 6px 12px;
    border: 1px solid var(--color-btn-border);
    border-radius: 8px;
    background: var(--color-btn-bg);
    color: var(--color-btn-text);
    font: inherit;
    font-size: 85%;
    cursor: pointer;
}

.IFM_screen_share_bar-stop:hover {
    background: var(--color-btn-hover-bg);
    border-color: var(--color-btn-hover-border);
}


.projects_search-tile {
    cursor: pointer;
}

.project_edit_actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 20px;
}

.project_edit_actions .auth_form-submit,
.project_edit_actions .auth_form-link-btn,
.project_edit_actions .ifm_form-submit,
.project_edit_actions .ifm_form-link-btn,
.project_edit_actions .project_edit_delete {
    margin: 0;
}

/* Нижняя панель действий редактирования — всегда у низа #RADL */
#RADL_edit_actions,
.radl_edit_actions {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 6;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    box-sizing: border-box;
    background: #313131;
    border-top: 1px solid var(--color-null-element-border);
}

#RADL[data-edit-bar="1"] #RADL_content {
    padding-bottom: 72px;
}

.radl_edit_back {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--color-null-element-border);
    border-radius: 10px;
    background-color: var(--color-null-element-bg);
    background-image: url('../../ico/bt/arrow-back-triangle.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 42%;
    cursor: pointer;
    box-sizing: border-box;
}

.radl_edit_back:hover {
    border-color: var(--color-btn-hover-border, #5a5a5a);
    background-size: 46%;
}

.radl_edit_actions-main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.radl_edit_actions-main .auth_form-submit,
.radl_edit_actions-main .auth_form-link-btn,
.radl_edit_actions-main .ifm_form-submit,
.radl_edit_actions-main .ifm_form-link-btn,
.radl_edit_actions-main .project_edit_delete,
.radl_edit_actions-main .user_settings_logout {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    margin: 0;
}

.radl_edit_actions-main .project_edit_delete[hidden],
.radl_edit_actions-main .auth_form-link-btn[hidden],
.radl_edit_actions-main .ifm_form-link-btn[hidden] {
    display: none !important;
}

.project_edit_delete {
    border-color: rgba(180, 70, 70, 0.55);
    color: #e08080;
    cursor: pointer;
}

.project_edit_delete:hover {
    border-color: rgba(200, 90, 90, 0.85);
    background: rgba(140, 40, 40, 0.22);
    color: #f0a0a0;
}

#IFM_project_delete {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
    box-sizing: border-box;
}

#IFM_news_delete {
    position: fixed;
    inset: 0;
    z-index: 60000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
    box-sizing: border-box;
}

#IFM_project_delete[hidden],
#IFM_news_delete[hidden] {
    display: none !important;
}

#IFM_project_delete .IFM_panel,
#IFM_news_delete .IFM_panel {
    width: min(420px, 100%);
}

#IFM_project_delete-text,
#IFM_news_delete-text {
    margin: 0 0 16px;
    line-height: 1.45;
    opacity: 0.9;
}

#IFM_project_delete .IFM_panel-actions,
#IFM_news_delete .IFM_panel-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

#IFM_project_delete-confirm,
#IFM_news_delete-confirm {
    border-color: rgba(180, 70, 70, 0.55);
    color: #e08080;
}

#IFM_project_role_delete {
    position: fixed;
    inset: 0;
    z-index: 51000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
    box-sizing: border-box;
}

#IFM_project_role_delete[hidden] {
    display: none !important;
}

#IFM_project_role_delete .IFM_panel {
    width: min(420px, 100%);
}

#IFM_project_role_delete-text {
    margin: 0 0 16px;
    line-height: 1.45;
    opacity: 0.9;
}

#IFM_project_role_delete .IFM_panel-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

#IFM_project_role_delete-confirm {
    border-color: rgba(180, 70, 70, 0.55);
    color: #e08080;
}

#form_project_roles .project_roles_form_actions {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--color-null-element-border, #444);
}

#form_project_roles .project_roles_form_actions .project_edit_delete {
    margin: 0;
}

#form_project_roles[data-is-default="1"] .project_roles_form_actions,
#form_project_roles .project_roles_form_actions .project_edit_delete[hidden] {
    display: none !important;
}

#IFM_project_delete-confirm:hover,
#IFM_news_delete-confirm:hover {
    border-color: rgba(200, 90, 90, 0.85);
    background: rgba(140, 40, 40, 0.22);
    color: #f0a0a0;
}

#IFM_notify_mode_picker,
#IFM_share_target {
    position: fixed;
    inset: 0;
    z-index: 50001;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: #0f0f0fb3;
    backdrop-filter: blur(4px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
}

#IFM_notify_mode_picker[hidden],
#IFM_voice_layout[hidden],
#IFM_share_target[hidden] {
    display: none !important;
}

#IFM_voice_layout {
    position: fixed;
    inset: 0;
    z-index: 100000000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0.55);
}

#IFM_voice_layout .IFM_panel {
    width: min(480px, 100%);
    max-width: 520px;
    max-height: min(90vh, 720px);
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
}

#IFM_voice_layout .IFM_voice_layout-head {
    margin: 0;
}

#IFM_voice_layout .IFM_voice_layout-heading {
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
}

#IFM_voice_layout .IFM_voice_layout-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 12px 14px 16px;
    -webkit-overflow-scrolling: touch;
}

#IFM_voice_layout .IFM_voice_layout-section {
    margin-bottom: 18px;
}

#IFM_voice_layout .IFM_voice_layout-section:last-child {
    margin-bottom: 0;
}

#IFM_voice_layout .IFM_voice_layout-section-title {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    opacity: 0.85;
}

#IFM_voice_layout .IFM_voice_layout-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#IFM_voice_layout .IFM_voice_layout-option {
    display: block;
    width: 100%;
    text-align: left;
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid var(--color-null-element-border);
    background: rgba(255, 255, 255, 0.04);
    color: inherit;
    font: inherit;
    line-height: 1.35;
    cursor: pointer;
    box-sizing: border-box;
}

#IFM_voice_layout .IFM_voice_layout-option:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.07);
}

#IFM_voice_layout .IFM_voice_layout-option.is-active {
    border-color: var(--color-accent, #6aa3ff);
    background: rgba(106, 163, 255, 0.12);
}

#IFM_voice_layout .IFM_voice_layout-option:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

#IFM_voice_layout .IFM_voice_layout-hint {
    margin: 8px 0 0;
    font-size: 12px;
    opacity: 0.65;
    line-height: 1.35;
}

#IFM_twofa_settings[hidden] {
    display: none !important;
}

#IFM_twofa_settings {
    position: fixed;
    inset: 0;
    z-index: 60000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    box-sizing: border-box;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
}

#IFM_twofa_settings .IFM_panel {
    width: min(440px, 100%);
    max-width: 480px;
}

.IFM_twofa_settings-section-title {
    margin: 12px 0 8px;
    font-size: 13px;
    font-weight: 600;
    opacity: 0.9;
}

.IFM_twofa_settings-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.IFM_twofa_settings-option {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid var(--color-null-element-border, rgba(255, 255, 255, 0.12));
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.04);
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.IFM_twofa_settings-option::before {
    content: '';
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.45);
    box-sizing: border-box;
    background: transparent;
}

.IFM_twofa_settings-option.is-active::before {
    border-color: var(--color-accent, #6aa3ff);
    background: radial-gradient(circle at center, var(--color-accent, #6aa3ff) 0 4px, transparent 4px);
}

.IFM_twofa_settings-option:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.07);
}

.IFM_twofa_settings-option.is-active {
    border-color: var(--color-accent, #6aa3ff);
    box-shadow: inset 0 0 0 1px rgba(106, 163, 255, 0.35);
}

.auth_form-2fa-hint,
.auth_form-2fa-attempts {
    margin: 0 0 10px;
    font-size: 90%;
    line-height: 1.35;
    opacity: 0.92;
}

.auth_form-2fa-attempts {
    color: #ffb4a2;
}

#auth_login_2fa_resend {
    margin-top: 4px;
}

#auth_login_2fa_resend:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

#IFM_notify_mode_picker .IFM_panel,
#IFM_share_target .IFM_panel {
    width: min(440px, 100%);
    max-width: 520px;
    margin: auto;
}

#IFM_notify_mode_picker .IFM_panel {
    display: flex;
    flex-direction: column;
    max-height: min(90vh, 640px);
    padding: 0;
    overflow: hidden;
}

#IFM_notify_mode_picker .IFM_notify_mode_picker-head {
    margin: 0;
}

#IFM_notify_mode_picker .IFM_notify_mode_picker-heading {
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
}

#IFM_notify_mode_picker .IFM_notify_mode_picker-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 12px 14px 14px;
    -webkit-overflow-scrolling: touch;
}

#IFM_share_target .IFM_panel-title {
    margin-bottom: 12px;
}

#IFM_logout_confirm {
    position: fixed;
    inset: 0;
    z-index: 100000000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
    box-sizing: border-box;
}

#IFM_logout_confirm[hidden] {
    display: none !important;
}

#IFM_logout_confirm .IFM_panel {
    width: min(420px, 100%);
}

#IFM_logout_confirm-text {
    margin: 0 0 16px;
    line-height: 1.45;
    opacity: 0.9;
}

#IFM_logout_confirm .IFM_panel-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

#IFM_logout_confirm-ok {
    border-color: rgba(180, 70, 70, 0.55);
    color: #e08080;
}

#IFM_logout_confirm-ok:hover {
    border-color: rgba(200, 90, 90, 0.85);
    background: rgba(140, 40, 40, 0.22);
    color: #f0a0a0;
}

#IFM_email_change_request,
#IFM_email_change_result,
#IFM_password_change_request,
#IFM_password_change_result,
#IFM_twofa_change_result,
#IFM_delete_account {
    position: fixed;
    inset: 0;
    z-index: 60000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
    box-sizing: border-box;
}

#IFM_email_change_request[hidden],
#IFM_email_change_result[hidden],
#IFM_password_change_request[hidden],
#IFM_password_change_result[hidden],
#IFM_twofa_change_result[hidden],
#IFM_delete_account[hidden] {
    display: none !important;
}

#IFM_email_change_request .IFM_panel,
#IFM_email_change_result .IFM_panel,
#IFM_password_change_request .IFM_panel,
#IFM_password_change_result .IFM_panel,
#IFM_twofa_change_result .IFM_panel,
#IFM_delete_account .IFM_panel {
    width: min(440px, 100%);
}

#IFM_email_change_request .IFM_panel-actions,
#IFM_email_change_result .IFM_panel-actions,
#IFM_password_change_request .IFM_panel-actions,
#IFM_password_change_result .IFM_panel-actions,
#IFM_twofa_change_result .IFM_panel-actions,
#IFM_delete_account .IFM_panel-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

#IFM_delete_account-confirm {
    border-color: rgba(180, 70, 70, 0.55);
    color: #e08080;
}

#IFM_group_delete {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
    box-sizing: border-box;
}

#IFM_group_delete[hidden] {
    display: none !important;
}

#IFM_group_delete .IFM_panel {
    width: min(420px, 100%);
}

#IFM_group_delete-text {
    margin: 0 0 12px;
    line-height: 1.45;
    opacity: 0.9;
}

#IFM_group_delete .IFM_group_delete-channels {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0 0 16px;
    cursor: pointer;
    line-height: 1.35;
}

#IFM_group_delete .IFM_panel-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

#IFM_group_delete-confirm {
    border-color: rgba(180, 70, 70, 0.55);
    color: #e08080;
}

#IFM_group_delete-confirm:hover {
    border-color: rgba(200, 90, 90, 0.85);
    background: rgba(140, 40, 40, 0.22);
    color: #f0a0a0;
}

#IFM_unsaved_edit {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
    box-sizing: border-box;
}

#IFM_unsaved_edit[hidden] {
    display: none !important;
}

#IFM_unsaved_edit .IFM_panel {
    width: min(420px, 100%);
}

#IFM_unsaved_edit-text {
    margin: 0 0 16px;
    line-height: 1.45;
    opacity: 0.9;
}

#IFM_unsaved_edit .IFM_panel-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.project_edit_roles_block.is-disabled,
.project_edit_emoji_block.is-disabled,
.project_edit_sticker_block.is-disabled,
.project_edit_news_block.is-disabled {
    opacity: 0.45;
    pointer-events: none;
    cursor: default;
    user-select: none;
}

.project_edit_news_list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 12px;
}

.project_edit_news_item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgb(255 255 255 / 4%);
    border: 1px solid rgb(255 255 255 / 8%);
}

.project_edit_news_avatar {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgb(80 80 90 / 55%) center / cover no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.project_edit_news_letter {
    font-size: 14px;
    font-weight: 600;
    opacity: 0.85;
}

.project_edit_news_name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 95%;
}

.project_edit_news_unlink {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    opacity: 0.65;
}

.project_edit_news_unlink:hover {
    opacity: 1;
    background: rgb(180 70 70 / 18%);
    color: #e08080;
}

#IFM_project_news_link,
#IFM_project_news_unlink,
#IFM_user_profile_link,
#IFM_user_card_bg_picker,
#IFM_user_card_remove_friend,
#IFM_user_card_kick_confirm,
#IFM_user_card_ban,
.market_buy_modal {
    position: fixed;
    inset: 0;
    z-index: 55000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
    box-sizing: border-box;
}

#IFM_project_news_link[hidden],
#IFM_project_news_unlink[hidden],
#IFM_user_profile_link[hidden],
#IFM_user_card_bg_picker[hidden],
#IFM_user_card_remove_friend[hidden],
#IFM_user_card_kick_confirm[hidden],
#IFM_user_card_ban[hidden],
.market_buy_modal[hidden] {
    display: none !important;
}

#IFM_project_news_link .IFM_panel,
#IFM_project_news_unlink .IFM_panel,
#IFM_user_profile_link .IFM_panel,
#IFM_user_card_remove_friend .IFM_panel,
#IFM_user_card_kick_confirm .IFM_panel,
#IFM_user_card_ban .IFM_panel {
    width: min(440px, 100%);
}

#IFM_user_card_ban .IFM_panel-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

#IFM_user_card_ban .IFM_user_card_ban-lead {
    margin: 0 0 12px;
    line-height: 1.4;
}

#IFM_user_card_ban .IFM_user_card_ban-forever,
#IFM_user_card_ban .IFM_user_card_ban-days {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    font-size: 90%;
}

#IFM_user_card_ban .IFM_user_card_ban-days input {
    width: 72px;
    padding: 6px 8px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: var(--color-panel-bg);
    color: var(--color-ui-text);
    font: inherit;
}

#IFM_project_news_link-error {
    margin: 12px 0 0;
    color: #e07070;
    font-size: 93%;
    line-height: 1.45;
}

#IFM_project_news_link-error[hidden],
#IFM_user_profile_link-error[hidden] {
    display: none !important;
}

#IFM_user_profile_link-error {
    margin: 12px 0 0;
    color: #e07070;
    font-size: 93%;
    line-height: 1.45;
}

.market_buy_dialog {
    width: min(460px, 100%);
    max-height: min(92vh, 720px);
    overflow: auto;
    background: var(--color-null-element-bg, #1c1c1c);
    border: 1px solid var(--color-null-element-border, #444);
    border-radius: 12px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    color: var(--color-ui-text, inherit);
    box-sizing: border-box;
    box-shadow: 0 0 20px #1a1a1a;
}

.project_edit_emoji_counts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin: 0 0 12px;
    font-size: 90%;
    opacity: 0.9;
}

#IFM_emoji_manage,
#IFM_sticker_manage {
    position: fixed;
    inset: 0;
    z-index: 50100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
    box-sizing: border-box;
}

#IFM_emoji_manage[hidden],
#IFM_sticker_manage[hidden] {
    display: none !important;
}

#IFM_emoji_manage .IFM_panel,
#IFM_sticker_manage .IFM_panel {
    width: min(520px, 100%);
    max-height: min(86vh, 720px);
    overflow-x: hidden;
    overflow-y: auto;
}

.emoji_manage_upload {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 12px;
}

.emoji_manage_pending {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 12px;
}

.emoji_manage_pending-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.emoji_manage_pending-label {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 85%;
    opacity: 0.9;
}

.emoji_manage_pending-preview {
    width: 40px;
    height: 40px;
    object-fit: contain;
    flex: 0 0 auto;
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.2);
}

.emoji_manage_pending-tag {
    flex: 1 1 auto;
    min-width: 0;
    height: 34px;
    padding: 0 10px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: var(--color-null-element-bg);
    color: var(--color-ui-text);
    font: inherit;
    box-sizing: border-box;
}

.emoji_manage_pending-remove {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 6px;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
}

.emoji_manage_err {
    margin: 0 0 10px;
    color: #e08080;
    font-size: 90%;
}

.emoji_manage_err.is-ok {
    color: #7ecf9a;
}

.emoji_manage_section-title {
    margin: 14px 0 8px;
    font-weight: 600;
    font-size: 90%;
}

.emoji_manage_grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 8px;
}

.emoji_manage_item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 8px 4px 6px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.12);
    box-sizing: border-box;
    min-width: 0;
}

.emoji_manage_item.is-disabled {
    opacity: 0.45;
}

.emoji_manage_item img {
    width: 32px;
    height: 32px;
    object-fit: contain;
}

#IFM_sticker_manage .emoji_manage_grid {
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
}

#IFM_sticker_manage .emoji_manage_item img {
    width: 72px;
    height: 72px;
}

#IFM_sticker_manage .emoji_manage_pending-preview {
    width: 64px;
    height: 64px;
}

.emoji_manage_item-code {
    font-size: 70%;
    opacity: 0.7;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.emoji_manage_item-toggle,
.sticker_manage_item-toggle {
    margin-top: 2px;
    padding: 2px 6px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.06);
    color: inherit;
    cursor: pointer;
    font: inherit;
    font-size: 70%;
    line-height: 1.2;
    width: 100%;
    box-sizing: border-box;
}

.emoji_manage_item-toggle[data-enabled="0"],
.sticker_manage_item-toggle[data-enabled="0"] {
    opacity: 0.75;
}

.emoji_manage_item-del {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 20px;
    height: 20px;
    padding: 0;
    border: none;
    border-radius: 4px;
    background: rgba(140, 40, 40, 0.55);
    color: #f0c0c0;
    cursor: pointer;
    font-size: 12px;
    line-height: 20px;
}

.emoji_manage_empty {
    grid-column: 1 / -1;
    font-size: 90%;
    opacity: 0.55;
    padding: 4px 0;
}

.IFM_media_manage-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 12px;
}

.IFM_media_manage-head .IFM_media_manage-head-title {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#IFM_emoji_manage .IFM_media_manage-head .IFM_user_settings-close,
#IFM_sticker_manage .IFM_media_manage-head .IFM_user_settings-close {
    flex: 0 0 auto;
}

#IFM_invite_friends {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
}

#IFM_invite_friends[hidden] {
    display: none !important;
}

#IFM_project_join_requests,
#IFM_project_join_requests_confirm {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
}

#IFM_project_join_requests[hidden],
#IFM_project_join_requests_confirm[hidden] {
    display: none !important;
}

#IFM_project_join_requests-list {
    max-height: 320px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 12px 0;
}

#IFM_project_join_requests-list .lac_empty {
    padding: 16px 8px;
    text-align: center;
    font-size: 90%;
    opacity: 0.65;
}

#IFM_project_join_requests .IFM_panel-actions,
#IFM_project_join_requests_confirm .IFM_panel-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

#IFM_project_join_requests #IFM_project_join_requests-error {
    margin-top: 0;
}

#IFM_project_join_requests-accept_all:disabled {
    opacity: 0.55;
    cursor: default;
    pointer-events: none;
}

#IFM_lpd_create {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(2px);
}

#IFM_lpd_create[hidden] {
    display: none !important;
}

.IFM_lpd_create-card {
    width: min(420px, 92vw);
    padding: 20px;
    border-radius: 14px;
    background: var(--color-null-element-bg);
    border: 1px solid var(--color-null-element-border);
}

.IFM_lpd_create-title {
    font-size: 110%;
    font-weight: 600;
    margin-bottom: 14px;
}

.IFM_lpd_create-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 14px;
}

.IFM_lpd_create-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 16px 10px;
    border-radius: 12px;
    border: 1px solid var(--color-null-element-border);
    background: transparent;
    color: inherit;
    cursor: pointer;
    transition: border-color 0.12s ease, background-color 0.12s ease;
}

.IFM_lpd_create-tile:hover:not(:disabled):not(.is-disabled) {
    border-color: var(--color-btn-hover-border);
    background: rgba(255, 255, 255, 0.04);
}

.IFM_lpd_create-tile:active:not(:disabled):not(.is-disabled) {
    border-color: var(--color-btn-hover-border);
    background: rgba(255, 255, 255, 0.07);
}

.IFM_lpd_create-tile.is-disabled,
.IFM_lpd_create-tile:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.IFM_lpd_create-ico {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--color-list-bg) center/55% no-repeat;
}

.IFM_lpd_create-ico--project {
    background-image: url('../../ico/bt/people.svg');
}

.IFM_lpd_create-ico--news {
    background-image: url('../../ico/bt/article.svg');
}

#IFM_lpd_create-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 38px;
    margin: 4px 0 0;
    padding: 8px 14px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: transparent;
    color: var(--color-null-element-text);
    font: inherit;
    font-size: 95%;
    cursor: pointer;
    box-sizing: border-box;
}

#IFM_lpd_create-close:hover {
    border-color: var(--color-btn-hover-border);
    background: rgba(255, 255, 255, 0.04);
}

#IFM_lpd_create-close:active {
    opacity: 0.85;
}

.feed_banner {
    margin: 0 0 16px;
    padding: 12px 14px;
    border-radius: 10px;
    background: var(--color-null-element-bg);
    border: 1px solid var(--color-null-element-border);
    cursor: pointer;
    font-size: 95%;
}

.feed_banner[data-mode="end"] {
    background: transparent;
    border-color: transparent;
    cursor: default;
    opacity: 0.65;
    text-align: center;
}

.feed_banner[data-mode="newer"] {
    border-color: var(--color-btn-hover-border);
}

#feed_page {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 20px 20px 40px;
}

.feed_list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.feed_post {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 14px;
    background: var(--color-panel-bg);
    box-sizing: border-box;
}

.feed_post-source {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 12px;
    align-self: stretch;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 600;
    padding: 0;
    margin: 0;
    cursor: pointer;
    text-align: left;
}

.feed_post-source:hover .feed_post-name {
    text-decoration: underline;
    color: var(--color-link-hover);
}

.feed_post-avatar {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.feed_post-avatar[have_img="0"] {
    background-image: none;
}

.feed_post-avatar-letter {
    font-size: 90%;
    font-weight: 700;
    opacity: 0.75;
}

.feed_post-name {
    flex: 1 1 auto;
    min-width: 0;
    line-height: 1.25;
    color: var(--color-null-element-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.feed_post-time {
    flex: 0 0 auto;
    margin-left: auto;
    font-size: 85%;
    font-weight: 500;
    opacity: 0.6;
}

.feed_post-body {
    margin: 0;
    padding: 0 2px;
    color: var(--color-ui-text);
    opacity: 0.95;
    line-height: 1.55;
    white-space: pre-wrap;
    word-break: break-word;
}

.feed_post-attachments {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
}

.feed_post-attachments .chat_msg-att {
    max-width: 100%;
}

.feed_post-reactions {
    margin-top: 2px;
}

#IFM_news_react_subscribe {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 45%);
    backdrop-filter: blur(4px);
    box-sizing: border-box;
}

#IFM_news_react_subscribe[hidden] {
    display: none !important;
}

.IFM_news_react_subscribe-card {
    position: relative;
    width: min(420px, 100%);
    margin: 0;
    padding: 22px;
    background: #505050;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
    color: var(--color-null-element-text);
    box-sizing: border-box;
}

.IFM_news_react_subscribe-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 8px;
    background-color: transparent;
    background-image: url('../../ico/bt/close.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 52%;
    cursor: pointer;
}

.IFM_news_react_subscribe-close:hover {
    border-color: var(--color-null-element-border);
    background-color: rgba(255, 255, 255, 0.06);
}

.IFM_news_react_subscribe-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding-right: 36px;
}

.IFM_news_react_subscribe-avatar {
    flex: 0 0 auto;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: 1px solid var(--color-null-element-border);
    background-color: var(--color-null-element-bg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-size: 120%;
    font-weight: 700;
    opacity: 0.9;
}

.IFM_news_react_subscribe-avatar[have_img="0"] {
    background-image: none;
}

.IFM_news_react_subscribe-meta {
    flex: 1 1 auto;
    min-width: 0;
}

.IFM_news_react_subscribe-name {
    font-size: 110%;
    font-weight: 700;
    line-height: 1.3;
    word-break: break-word;
}

.IFM_news_react_subscribe-descr {
    margin-top: 6px;
    font-size: 90%;
    line-height: 1.45;
    opacity: 0.8;
    white-space: pre-wrap;
    word-break: break-word;
}

.IFM_news_react_subscribe-descr[hidden] {
    display: none !important;
}

.IFM_news_react_subscribe-msg {
    margin: 16px 0 0;
    line-height: 1.5;
    opacity: 0.92;
}

.IFM_news_react_subscribe-bt {
    display: block;
    width: 100%;
    margin-top: 18px;
}

@media (max-width: 600px) {
    .feed_post {
        padding: 14px 12px;
    }

    .feed_post-time {
        width: 100%;
        margin-left: 54px;
        margin-top: -6px;
    }
}

.hub_search-section {
    margin: 0;
    padding: 14px 0 16px;
    box-sizing: border-box;
}

#hub_search-sections {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding-bottom: 24px;
}

.hub_search-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 20px;
    padding: 0 18px 5px;
    border-radius: 15px;
    background: var(--color-panel-bg, #313131);
}

.hub_search-section-title {
    margin: 0;
    font-size: 105%;
    font-weight: 700;
    color: var(--color-null-element-text);
    letter-spacing: 0.01em;
}

.hub_search-section-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 64px;
    padding: 16px 12px;
    border-radius: 10px;
    background: var(--color-list-bg);
    border: 1px dashed var(--color-null-element-border);
    color: var(--color-ui-text);
    opacity: 0.85;
    font-size: 95%;
    text-align: center;
    box-sizing: border-box;
}

.hub_search-see_all {
    border: 0;
    background: transparent;
    color: var(--color-link);
    opacity: 1;
    cursor: pointer;
    text-decoration: none;
    font: inherit;
    font-size: 90%;
    font-weight: 600;
    flex: 0 0 auto;
}

.hub_search-see_all:hover {
    color: var(--color-link-hover);
    text-decoration: underline;
}

#hub_search-sections .hub_search-grid {
    max-width: 100%;
}

#hub_search-sections .hub_search-row.search_result-item {
    width: 100%;
    color: inherit;
    text-align: left;
    background: var(--color-panel-bg);
}

#hub_search-sections .projects_search-tile.hub_search-row {
    cursor: pointer;
}

#hub_search-sections .users_search-list {
    max-width: none;
}

#hub_search-sections .users_search-row.hub_search-row {
    cursor: pointer;
    font: inherit;
}

.hub_search-news-list.search_results {
    max-width: none;
    width: 100%;
}

#hub_search-sections .hub_search-news-row.hub_search-row {
    cursor: pointer;
    font: inherit;
}

#hub_search-sections .news_search-tile.hub_search-row {
    cursor: pointer;
}

/* Хаб «Всё»: до 20 плиток в ряд с обрезкой и затенением справа (десктоп). */
.hub_search-strip-wrap {
    position: relative;
    width: 100%;
}

.hub_search-strip-more {
    position: absolute;
    top: 50%;
    right: 6px;
    z-index: 3;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--color-null-element-border);
    border-radius: 10px;
    background-color: var(--color-panel-bg);
    background-image: url('../../ico/bt/arrow-back-triangle.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px 14px;
    transform: translateY(-50%) rotate(180deg);
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.22);
    box-sizing: border-box;
}

.hub_search-strip-more:hover {
    border-color: var(--color-btn-hover-border);
}

.hub_search-strip-more[hidden] {
    display: none !important;
}

/* Популярное на search: горизонтальная лента до 600px; ниже — список (main-radl.css). */
@media (min-width: 601px) {
    html[page_type="search"] #hub_search-sections .hub_search-strip-wrap.has-strip-more .hub_search-strip > .search_results {
        padding-right: 44px;
        box-sizing: border-box;
    }

    html[page_type="search"] #hub_search-sections .hub_search-strip {
        position: relative;
        overflow: hidden;
    }

    html[page_type="search"] #hub_search-sections .hub_search-strip > .search_results {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 12px;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 2px;
        scrollbar-width: none;
        -ms-overflow-style: none;
        grid-template-columns: none;
    }

    html[page_type="search"] #hub_search-sections .hub_search-strip > .search_results::-webkit-scrollbar {
        display: none;
    }

    html[page_type="search"] #hub_search-sections .hub_search-strip > .search_results > .search_result-item {
        flex: 0 0 min(100%, 380px);
        width: min(100%, 380px);
        max-width: 380px;
        min-width: 0;
    }

    html[page_type="search"] #hub_search-sections .hub_search-strip-wrap.has-strip-more .hub_search-strip::after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 72px;
        pointer-events: none;
        z-index: 2;
        background: linear-gradient(to right, rgba(0, 0, 0, 0), var(--color-null-element-bg));
    }
}

#LAC_list.LAC_list--news_tags {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: hidden;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

#LAC_list.LAC_list--news_tags #LAU_news_project_list {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    flex: 0 0 auto;
    box-sizing: border-box;
}

#LAC_list.LAC_list--news_tags .lac_news_tags_wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.lac_tag {
    border: 1px solid var(--color-null-element-border);
    background: transparent;
    color: inherit;
    border-radius: 999px;
    padding: 6px 12px;
    cursor: pointer;
    opacity: 0.8;
}

.lac_tag.is-active {
    opacity: 1;
    border-color: var(--color-lpd-active-border, #8d87fb);
    background: rgba(141, 135, 251, 0.18);
    color: var(--color-lpd-active-border, #8d87fb);
}

.feed_radr-tag.is-active {
    border-color: var(--color-lpd-active-border, #8d87fb);
    background: rgba(141, 135, 251, 0.18);
    color: var(--color-lpd-active-border, #8d87fb);
}

/* Карточка пользователя (read-only), стиль как user_panel-status_menu */
#IFM_user_card,
#IFM_user_card_preview {
    position: fixed;
    z-index: 90;
    width: min(300px, 78vw);
    padding: 0;
    box-sizing: border-box;
    background-color: var(--color-null-element-bg-opacity);
    backdrop-filter: blur(8px);
    border: 1px solid var(--color-null-element-border);
    border-radius: 12px;
    box-shadow: 0 0 30px 2px rgba(0, 0, 0, 0.35);
    cursor: default;
    overflow: hidden;
}

/* Меню «⋯» портируется в body — overflow карточки можно оставить hidden. */
#IFM_user_card.is-more-open {
    overflow: hidden;
}

#IFM_user_card[hidden] {
    display: none !important;
}

#IFM_user_card > :not(.user_card_header),
#IFM_user_card_preview > :not(.user_card_header) {
    padding-left: 12px;
    padding-right: 12px;
}

#IFM_user_card > .user_card-grid,
#IFM_user_card_preview > .user_card-grid {
    padding-top: 0;
}

#IFM_user_card > .user_card-row:last-child,
#IFM_user_card_preview > .user_card-row:last-child {
    padding-bottom: 12px;
    margin-bottom: 0;
}

.user_card_header {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    min-height: 100px;
    margin-bottom: 0;
    z-index: 0;
    padding: 8px 10px;
    box-sizing: border-box;
    background-color: var(--user-card-header-bg, transparent);
    border-bottom: 1px solid var(--color-null-element-border);
}

.user_card_header-actions {
    position: relative;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
}

.user_card_header-decorate {
    position: relative;
    display: inline-flex;
    align-items: center;
    max-width: 100%;
}

.user_card_header-decorate-label {
    position: absolute;
    right: calc(100% + 6px);
    top: 50%;
    transform: translate(8px, -50%);
    white-space: nowrap;
    font-size: 85%;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.16s ease, transform 0.16s ease;
}

.user_card_header-decorate:hover .user_card_header-decorate-label,
.user_card_header-decorate:focus-within .user_card_header-decorate-label {
    opacity: 0.95;
    transform: translate(0, -50%);
}

.user_card_header-decorate-btn,
.user_card_header-edit,
.user_card_header-more {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--color-null-element-border);
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.22);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 56%;
    color: var(--color-ui-text);
    cursor: pointer;
    box-sizing: border-box;
}

.user_card_header-decorate-btn {
    background-image: url('../../ico/bt/sparkle.svg');
}

.user_card_header-edit {
    background-image: url('../../ico/bt/edit.svg');
}

.user_card_header-more {
    background-image: url('../../ico/bt/more-vert.svg');
}

.user_card_header-decorate-btn:hover,
.user_card_header-edit:hover,
.user_card_header-more:hover {
    border-color: var(--color-btn-hover-border);
    background-size: 62%;
}

.user_card_header-edit[hidden],
.user_card_header-more[hidden] {
    display: none !important;
}

.user_card_header-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 180px;
    padding: 6px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 10px;
    background: var(--color-null-element-bg);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
    z-index: 40;
    box-sizing: border-box;
    pointer-events: auto;
}

/* Портированное меню (body) — выше карточки и text_status. */
#IFM_user_card_more_menu.is-ported,
body > .user_card_header-menu.is-ported {
    position: fixed !important;
    right: auto;
    z-index: 100000 !important;
    pointer-events: auto !important;
}

.user_card_header-more_wrap {
    display: flex;
    position: relative;
    z-index: 40;
}

.user_card_header-menu[hidden] {
    display: none !important;
}

.user_card_header-menu-item {
    display: block;
    width: 100%;
    margin: 0;
    padding: 8px 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 90%;
    text-align: left;
    cursor: pointer;
    box-sizing: border-box;
}

.user_card_header-menu-item:hover {
    background: rgba(255, 255, 255, 0.08);
}

#IFM_user_card:not([data-self="1"]) .user_card_header-decorate,
#IFM_user_card:not([data-self="1"]) .user_card_header-edit {
    display: none;
}

#IFM_user_card .user_card-friend,
#IFM_user_card .user_card-kick,
#IFM_user_card .user_card-ban {
    display: none !important;
}

.user_card-grid {
    display: grid;
    grid-template-columns: 72px 1fr;
    gap: 10px;
    align-items: stretch;
    margin-bottom: 10px;
    z-index: 1;
    position: relative;
}

.user_card-avatar {
    position: relative;
    z-index: 2;
    width: 72px;
    height: 72px;
    margin-top: -50px;
    border: 5px solid var(--color-null-element-bg);
    border-radius: 50%;
    background: var(--color-panel-bg);
    box-sizing: border-box;
}

.user_card-avatar.is-editable {
    cursor: pointer;
}

.user_card-avatar.is-viewable {
    cursor: zoom-in;
}

.user_card-avatar-img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-image: url('../../ico/bt/avatar.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.user_card-avatar .avatar-change-hint {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: none;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(12, 12, 14, 0.58);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1;
    opacity: 0;
    transition: opacity 0.15s ease;
    pointer-events: none;
}

.user_card-avatar.is-editable .avatar-change-hint {
    display: flex;
}

.user_card-avatar.is-editable:hover .avatar-change-hint,
.user_card-avatar.is-editable:focus-visible .avatar-change-hint {
    opacity: 1;
}

.user_card-avatar .usr_lvl {
    top: -28px;
}

.user_card-online_status {
    opacity: 0.75;
    font-size: 85%;
}

#IFM_user_card_online_picker {
    display: none;
    position: fixed;
    min-width: 180px;
    padding: 8px;
    background-color: var(--color-null-element-bg);
    border: 1px solid var(--color-null-element-border);
    border-radius: 12px;
    box-shadow: 0 0 30px 2px rgba(0, 0, 0, 0.35);
    z-index: 12060;
    box-sizing: border-box;
}

#IFM_user_card_online_picker[open="1"] {
    display: block;
}

#IFM_user_card_online_picker[hidden] {
    display: none !important;
}

.user_card-about {
    align-items: flex-start;
    opacity: 0.82;
    font-size: 90%;
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.35;
}

.user_card-about[hidden] {
    display: none !important;
}

.user_card-text_status {
    display: flex;
    align-items: flex-start;
    min-height: 72px;
    margin: -50px 0 0 0;
    padding: 10px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 10px;
    background-color: var(--color-null-element-bg);
    color: var(--color-null-element-text);
    font: inherit;
    text-align: left;
    box-sizing: border-box;
    overflow: auto;
    word-break: break-word;
}

.user_card-text_status.is-editable {
    cursor: pointer;
}

.user_card-text_status[hidden] {
    display: none !important;
}

.user_card-text_status[data-empty="1"] {
    color: color-mix(in srgb, var(--color-null-element-text) 45%, transparent);
}

.user_card-row {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin: 0 0 6px;
    padding: 8px 10px;
    border: 0;
    border-radius: 0px;
    background: transparent;
    color: var(--color-null-element-text);
    font: inherit;
    text-align: left;
    box-sizing: border-box;
}

.user_card-row[hidden],
.user_card-kick[hidden],
.user_card-ban[hidden],
.user_card-dm[hidden],
.user_card-friend[hidden] {
    display: none !important;
}

button.user_card-row {
    cursor: pointer;
}

button.user_card-row:hover {
    background: var(--color-list-bg);
}

button.user_card-row.is-static,
button.user_card-row:disabled {
    cursor: default;
    opacity: 0.85;
}

button.user_card-row.is-static:hover,
button.user_card-row:disabled:hover {
    background: transparent;
}

.user_card-display_name {
    font-weight: bold;
    font-size: 120%;
    margin-bottom: 0;
    padding-bottom: 0;
}

.user_card-login-at {
    display: none;
}

.user_card-role {
    opacity: 0.75;
    font-size: 90%;
    margin-bottom: 0;
}

.user_card-roles {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 4px 0 0;
}

.user_card-role_chip {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 6px;
    font-size: 85%;
    color: #ffffff9c;
    border: 0;
    border-left: 3px solid var(--role-color, #7f7f7f);
    background: transparent;
    overflow: hidden;
    box-sizing: border-box;
}

.user_card-role_chip-bg {
    position: absolute;
    inset: 0;
    background: var(--role-color, #7f7f7f);
    opacity: 0.22;
    pointer-events: none;
    border-radius: inherit;
    z-index: 0;
}

.user_card-role_chip > :not(.user_card-role_chip-bg) {
    position: relative;
    z-index: 1;
}

.user_card-role_emoji {
    line-height: 1;
}

.project_roles_lac {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 15px;
    box-sizing: border-box;
    height: 100%;
    overflow: auto;
}

.project_roles_lac_list {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
}

.project_roles_lac_item {
    text-align: left;
    font: inherit;
    cursor: pointer;
    max-width: 100%;
}

.project_roles_lac_item:not(#project_roles_create) {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 10px 8px 12px;
    border-radius: 8px;
    font-size: 90%;
    color: #ffffff9c;
    border: 1px solid transparent;
    border-left: 4px solid var(--role-color, #7f7f7f);
    background: transparent;
    overflow: hidden;
    box-sizing: border-box;
}

.project_roles_lac_item.is-draggable {
    cursor: grab;
}

.project_roles_lac_item.is-dragging {
    opacity: 0.45;
    cursor: grabbing;
}

.project_roles_lac_item.is-drag-over {
    border-top-color: rgba(255, 255, 255, 0.45);
}

.project_roles_group_members_wrap {
    margin: 4px 0 10px;
}

.project_roles_lac_item-bg {
    position: absolute;
    inset: 0;
    background: var(--role-color, #7f7f7f);
    opacity: 0.16;
    pointer-events: none;
    border-radius: inherit;
    z-index: 0;
}

.project_roles_lac_item > :not(.project_roles_lac_item-bg) {
    position: relative;
    z-index: 1;
}

.project_roles_lac_emoji {
    line-height: 1;
    flex: 0 0 auto;
}

#project_roles_create {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: auto;
    max-width: 100%;
    padding: 8px 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

#project_roles_create:hover {
    background: rgba(255, 255, 255, 0.08);
}

.project_roles_lac_item:not(#project_roles_create):hover {
    border-color: rgba(255, 255, 255, 0.12);
}

.project_roles_lac_item:not(#project_roles_create).is-selected {
    border-color: rgba(255, 255, 255, 0.22);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.project_roles_lac_item:not(#project_roles_create).is-selected .project_roles_lac_item-bg {
    opacity: 0.24;
}

.project_roles_lac_name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #ffffff9c;
    font-weight: 500;
}

.project_roles_lac_count {
    flex: 0 0 auto;
    min-width: 1.4em;
    padding: 1px 6px;
    border-radius: 999px;
    font-size: 80%;
    line-height: 1.4;
    text-align: center;
    color: #ffffff9c;
    background: rgba(255, 255, 255, 0.08);
}

.project_roles_perms_grid {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 12px 0;
}

.project_roles_perm_row {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 12px;
    min-height: 32px;
}

.project_roles_perm_label {
    min-width: 0;
    line-height: 1.3;
}

.project_roles_perm_control {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.ifm_tri_switch {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
}

.ifm_tri_switch-track {
    position: relative;
    width: 56px;
    height: 24px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid var(--color-null-element-border);
    box-sizing: border-box;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.ifm_tri_switch-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #cfcfcf;
    transition: transform 0.15s ease, background 0.15s ease;
}

.ifm_tri_switch[data-state="deny"] .ifm_tri_switch-track {
    background: color-mix(in srgb, #ed4245 35%, rgba(255, 255, 255, 0.12));
    border-color: color-mix(in srgb, #ed4245 55%, var(--color-null-element-border));
}

.ifm_tri_switch[data-state="deny"] .ifm_tri_switch-thumb {
    transform: translateX(0);
    background: #ed4245;
}

.ifm_tri_switch[data-state="inherit"] .ifm_tri_switch-thumb {
    transform: translateX(16px);
    background: #cfcfcf;
}

.ifm_tri_switch[data-state="allow"] .ifm_tri_switch-track {
    background: var(--color-switch-on-track);
    border-color: var(--color-switch-on-border);
}

.ifm_tri_switch[data-state="allow"] .ifm_tri_switch-thumb {
    transform: translateX(32px);
    background: var(--color-switch-on-thumb);
}

.project_edit_roles_list,
.channel_edit_roles_list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 6px;
    margin: 8px 0;
}

.project_roles_members_title {
    font-weight: 600;
    margin: 8px 0 10px;
}

.project_roles_members_add {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin-bottom: 10px;
}

.project_roles_members_add-field {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
}

.project_roles_members_add input {
    width: 100%;
    box-sizing: border-box;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid var(--color-null-element-border);
    background: var(--color-null-element-bg);
    color: var(--color-null-element-text);
    font: inherit;
}

.project_roles_members_suggest {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 4px);
    z-index: 40;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 6px;
    border-radius: 8px;
    border: 1px solid var(--color-null-element-border);
    background: var(--color-panel-bg);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
    max-height: 260px;
    overflow: auto;
}

.project_roles_members_suggest[hidden] {
    display: none !important;
}

.project_roles_members_suggest_item {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    box-sizing: border-box;
}

.project_roles_members_suggest_item:hover,
.project_roles_members_suggest_item:focus-visible {
    background: rgba(255, 255, 255, 0.06);
    outline: none;
}

.project_roles_members_suggest_item .user_item {
    pointer-events: none;
}

.project_roles_members_list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

#project_roles_members_list .user_item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 4px;
    border-radius: 8px;
    min-width: 0;
    cursor: pointer;
}

#project_roles_members_list .user_item:hover,
#project_roles_members_list .user_item.is-card-open {
    background: rgba(255, 255, 255, 0.06);
}

#project_roles_members_list .user_item-body {
    flex: 1 1 auto;
    min-width: 0;
}

#project_roles_members_list .project_roles_member_remove {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background-color: transparent;
    background-image: url('../../ico/bt/close.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 55%;
    cursor: pointer;
    opacity: 0.65;
}

#project_roles_members_list .project_roles_member_remove:hover {
    opacity: 1;
    background-color: rgba(255, 255, 255, 0.08);
}

.project_roles_members_empty {
    opacity: 0.6;
    padding: 12px 2px;
}

.user_card-kick,
.user_card-ban {
    margin-top: 8px;
    width: 100%;
    justify-content: flex-start;
    border: 0;
    background: transparent;
    color: var(--color-ui-text);
    font: inherit;
    cursor: pointer;
    opacity: 0.9;
    padding: 8px 4px;
    border-radius: 8px;
}

.user_card-kick:hover,
.user_card-ban:hover {
    background: rgba(255, 255, 255, 0.06);
    opacity: 1;
}

.user_card-ban {
    margin-top: 0;
}

.user_card-kick_overlay,
.user_card-ban_overlay,
.user_card-friend_overlay {
    position: absolute;
    inset: 0;
    z-index: 50;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
    box-sizing: border-box;
    border-radius: 12px;
    background: var(--color-null-element-bg);
}

.user_card-kick_overlay[hidden],
.user_card-ban_overlay[hidden],
.user_card-friend_overlay[hidden] {
    display: none !important;
}

.user_card-friend_overlay.is-viewport-overlay {
    position: fixed;
    inset: 0;
    z-index: 12050;
    border-radius: 0;
    background: rgba(0, 0, 0, 0.52);
    justify-content: center;
    align-items: center;
    max-width: none;
}

.user_card-friend_overlay.is-viewport-overlay .user_card-friend_overlay-title {
    max-width: 320px;
    text-align: center;
}

.user_card-friend_overlay.is-viewport-overlay .user_card-friend_overlay-actions {
    width: 100%;
    max-width: 320px;
}

.user_card-kick_overlay-title,
.user_card-ban_overlay-title,
.user_card-friend_overlay-title {
    font-weight: 600;
    line-height: 1.35;
}

.user_card-ban_personal,
.user_card-ban_forever,
.user_card-ban_days_wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 90%;
}

.user_card-ban_days_wrap input {
    width: 72px;
    padding: 6px 8px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: var(--color-panel-bg);
    color: var(--color-ui-text);
    font: inherit;
}

.user_card-kick_overlay-actions,
.user_card-ban_overlay-actions,
.user_card-friend_overlay-actions {
    display: flex;
    gap: 8px;
    margin-top: auto;
}

.user_card-kick_confirm,
.user_card-kick_cancel,
.user_card-ban_confirm,
.user_card-ban_cancel,
.user_card-friend_confirm,
.user_card-friend_cancel {
    flex: 1 1 auto;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid var(--color-null-element-border);
    font: inherit;
    cursor: pointer;
}

.user_card-kick_confirm,
.user_card-ban_confirm,
.user_card-friend_confirm {
    background: var(--color-null-element-border);
    color: var(--color-ui-text);
}

.user_card-kick_cancel,
.user_card-ban_cancel,
.user_card-friend_cancel {
    background: transparent;
    color: var(--color-ui-text);
}

#IFM_invite_friends-list {
    max-height: 320px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 12px 0;
}

.invite_friend_row {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    text-align: left;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid var(--color-null-element-border);
    background: var(--color-null-element-bg);
    color: var(--color-ui-text);
    cursor: pointer;
    box-sizing: border-box;
}

.invite_friend_row:has(.invite_friend_check:checked) {
    border-color: var(--color-null-element-text);
}

.invite_friend_check {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin: 0;
    cursor: pointer;
}

.invite_friend_row-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#IFM_invite_friends-send:disabled {
    opacity: 0.55;
    cursor: default;
}

#IFM_invite_friends-error {
    margin: 0 0 8px;
}

.project_invite_item-logo {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.project_invite_item-letter {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-weight: 600;
    opacity: 0.75;
}

/* ——— Panel forms (ifm_form) + auth forms (auth_form) ——— */
.auth_form,
.ifm_form {
    position: relative;
    width: 100%;
    max-width: 420px;
    margin: 0px auto;
    padding: 16px 15px;
    color: var(--color-null-element-text);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    margin: auto auto;
    box-sizing: border-box;
}

.auth_form-loading,
.ifm_form-loading {
    position: absolute;
    inset: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(55 55 55 / 84%);
    border-radius: 8px;
    color: var(--color-null-element-text);
    font-size: 120%;
    letter-spacing: 0.02em;
    user-select: none;
    backdrop-filter: blur(2px);
}

.auth_form-loading[hidden],
.ifm_form-loading[hidden] {
    display: none !important;
}

.auth_form.is-busy .auth_form-submit,
.auth_form.is-busy button[type="submit"],
.ifm_form.is-busy .ifm_form-submit,
.ifm_form.is-busy .auth_form-submit,
.ifm_form.is-busy button[type="submit"] {
    opacity: 0.55;
    cursor: wait;
    pointer-events: none;
}

.auth_form-logo,
.ifm_form-logo {
    flex: 0 0 auto;
    display: block;
    width: 100px;
    margin: 0 auto 20px;
    background-color: var(--color-null-element-bg);
    background-image: url(../../ico/logo.svg);
    border: 3px solid #ffffff;
    background-size: 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    border-radius: 100%;
    overflow: hidden;
    cursor: pointer;
    text-decoration: none;
    transition: background-size 0.06s ease, border-color 0.12s ease;
}

.auth_form-logo:hover,
.ifm_form-logo:hover {
    border-color: var(--color-btn-hover-border);
    background-size: 105%;
}

.auth_form-logo::before,
.ifm_form-logo::before {
    content: '';
    display: block;
    padding-top: 100%;
    pointer-events: none;
}

.auth_form[data-auth-form="help"],
.ifm_form[data-panel-form="help"] {
    max-width: 560px;
    height: auto;
    justify-content: flex-start;
    margin-top: 12px;
    margin-bottom: 24px;
    user-select: text;
}

.help_article {
    text-align: left;
}

.help_article h1 {
    text-align: center;
    margin-top: 0;
}

.help_article h2 {
    margin-top: 1.4em;
}

.help_faq-item {
    margin: 0.85em 0;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: var(--color-null-element-bg);
    overflow: hidden;
}

.help_faq-item summary {
    cursor: pointer;
    list-style: none;
    padding: 0.7em 2.2em 0.7em 0.9em;
    font-weight: 550;
    color: var(--color-null-element-text);
    user-select: none;
    position: relative;
}

.help_faq-item summary::-webkit-details-marker {
    display: none;
}

.help_faq-item summary::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0.65em;
    width: 1.25em;
    height: 1.25em;
    margin-top: -0.625em;
    background-image: url('../../ico/bt/expand-more.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.7;
    transition: transform 0.15s ease;
    pointer-events: none;
}

.help_faq-item[open] summary::after {
    transform: rotate(180deg);
}

.help_faq-answer {
    padding: 0 0.9em 0.85em;
    line-height: 1.45;
    opacity: 0.9;
    color: var(--color-ui-text);
}

.help_landing_more {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 1.1em 0 0.85em;
    padding: 0.85em 0.9em 0.85em 0.95em;
    border: 1px solid rgba(167, 121, 255, 0.72);
    border-radius: 8px;
    background: rgba(139, 92, 246, 0.2);
    color: var(--color-ui-text);
    font-weight: 550;
    font-size: inherit;
    line-height: 1.35;
    text-decoration: none;
    box-sizing: border-box;
    cursor: pointer;
    transition: background 0.12s ease, border-color 0.12s ease;
}

.help_landing_more::after {
    content: '';
    flex: 0 0 auto;
    width: 1.35em;
    height: 1.35em;
    background-image: url('../../ico/bt/arrow-back-triangle.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transform: rotate(180deg);
    filter: brightness(0) invert(1);
    opacity: 0.95;
    pointer-events: none;
}

.help_landing_more:hover,
.help_landing_more:focus-visible {
    background: rgba(139, 92, 246, 0.3);
    border-color: rgba(186, 148, 255, 0.9);
    color: var(--color-ui-text);
    text-decoration: none;
}

.auth_form-title,
.ifm_form-title {
    margin: 8px 0 10px 0;
    font-size: 180%;
    font-weight: 600;
    color: var(--color-ui-text);
    text-align: center;
}

#form_user_restore_request {
    margin-top: 15px;
}

.auth_form-text,
.ifm_form-text {
    margin: 0 0 20px;
    opacity: 0.75;
    text-align: center;
}

.redirect_form-warn,
#redirect_warn {
    margin-bottom: 10px;
    text-align: center;
}

.redirect_form-url {
    display: block;
    margin: 0 0 10px;
    padding: 12px 14px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.22);
    color: var(--color-null-element-text);
    font-size: 85%;
    line-height: 1.45;
    word-break: break-all;
    overflow-wrap: anywhere;
    text-align: left;
    user-select: text;
    -webkit-user-select: text;
}

.redirect_form-url[hidden] {
    display: none !important;
}

.redirect_form-host {
    margin: 0 0 16px;
    text-align: center;
    font-size: 90%;
    opacity: 0.7;
    word-break: break-all;
}

.redirect_form-host[hidden] {
    display: none !important;
}

.auth_form-field,
.ifm_form-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0 0 12px;
    font-size: 90%;
}

.auth_form-field input,
.ifm_form-field input {
    width: 100%;
    height: 36px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background-color: var(--color-null-element-bg);
    color: var(--color-null-element-text);
    font: inherit;
    font-size: 14px;
    outline: none;
    box-sizing: border-box;
}

.auth_form-field input:focus,
.ifm_form-field input:focus {
    border-color: var(--color-btn-hover-border);
}

label.ifm_radio_option input[type="radio"],
.ifm_form-field.ifm_radio_option input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 1px !important;
    height: 1px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    pointer-events: none;
}

.ifm_radio_options > label.ifm_radio_option,
.ifm_radio_options > .ifm_form-field.ifm_radio_option {
    margin-bottom: 0;
}

.user_settings_hotkeys .ifm_switch_row {
    margin-bottom: 0;
}

.auth_form-submit,
.ifm_form-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 38px;
    margin: 20px 0px 0;
    padding: 8px 14px;
    border: 1px solid var(--color-btn-border);
    border-radius: 8px;
    background: var(--color-btn-bg);
    color: var(--color-btn-text) !important;
    font: inherit;
    font-size: 95%;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

.auth_form-submit-row {
    display: flex;
    align-items: stretch;
    gap: 8px;
    margin-top: 20px;
}

.auth_form-submit-row .auth_form-submit {
    flex: 1 1 auto;
    width: auto;
    margin-top: 0;
}

.auth_form-qr-btn {
    flex: 0 0 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    min-height: 38px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--color-btn-border);
    border-radius: 8px;
    background: var(--color-btn-bg);
    color: var(--color-btn-text);
    cursor: pointer;
    box-sizing: border-box;
}

.auth_form-qr-btn:hover {
    border-color: var(--color-btn-hover-border);
    background: var(--color-btn-hover-bg);
    color: #fff;
}

.auth_form-qr-icon {
    display: block;
}

@media (max-width: 720px) {
    .auth_form-qr-btn {
        display: none;
    }
}

/* QR-авторизация / сканер — собственные панели (структура как у download, без чужих классов) */
.IFM_qr_auth-panel,
.IFM_qr_scan-panel {
    width: 100%;
    max-width: 360px;
    padding: 0;
    margin: 0;
    overflow: hidden;
}

.IFM_qr_auth-head,
.IFM_qr_scan-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 14px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.IFM_qr_auth-title,
.IFM_qr_scan-title {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 105%;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.IFM_qr_auth-close,
.IFM_qr_scan-close {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 8px;
    background-color: transparent;
    background-image: url('../../ico/bt/close.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 52%;
    cursor: pointer;
}

.IFM_qr_auth-close:hover,
.IFM_qr_scan-close:hover {
    border-color: var(--color-null-element-border);
    background-color: rgba(255, 255, 255, 0.06);
}

.IFM_qr_auth-body,
.IFM_qr_scan-body {
    padding: 16px 14px 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.IFM_qr_auth-qr {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 220px;
    height: 220px;
    margin: 0;
    padding: 12px;
    border-radius: 10px;
    background: #fff;
    box-sizing: border-box;
    flex: 0 0 auto;
}

.IFM_qr_auth-qr-canvas {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
}

.IFM_qr_auth-qr-spinner {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: inherit;
    background: rgb(255 255 255 / 88%);
    z-index: 1;
}

.IFM_qr_auth-qr-spinner::after {
    content: '';
    width: 34px;
    height: 34px;
    border: 3px solid rgb(0 0 0 / 12%);
    border-top-color: #2f9e5f;
    border-radius: 50%;
    animation: ifm-qr-spin 0.75s linear infinite;
}

.IFM_qr_auth-qr-spinner[hidden] {
    display: none !important;
}

.IFM_qr_auth-qr.is-loading .IFM_qr_auth-qr-canvas {
    opacity: 0.15;
}

@keyframes ifm-qr-spin {
    to { transform: rotate(360deg); }
}

.IFM_qr_auth-qr svg,
.IFM_qr_auth-qr img,
.IFM_qr_auth-qr-canvas svg,
.IFM_qr_auth-qr-canvas img {
    display: block;
    width: 100%;
    height: 100%;
}

.IFM_qr_auth-hint,
.IFM_qr_scan-hint {
    margin: 0;
    width: 100%;
    text-align: center;
    font-size: 90%;
    line-height: 1.45;
    opacity: 0.9;
}

.IFM_qr_auth-status,
.IFM_qr_scan-status {
    margin: 0;
    width: 100%;
    text-align: center;
    font-size: 85%;
    line-height: 1.35;
    opacity: 0.85;
}

.IFM_qr_auth-status[hidden],
.IFM_qr_scan-status[hidden] {
    display: none !important;
}

.IFM_qr_scan-viewport {
    position: relative;
    width: 100%;
    max-width: 280px;
    aspect-ratio: 1 / 1;
    margin: 0;
    overflow: hidden;
    border-radius: 10px;
    background: #111;
    flex: 0 0 auto;
}

.IFM_qr_scan-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.IFM_qr_scan-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.auth_form-submit:hover:not(:disabled):not(.is-disabled),
.auth_form-link-btn:hover,
.ifm_form-submit:hover:not(:disabled):not(.is-disabled),
.ifm_form-link-btn:hover {
    border-color: var(--color-btn-hover-border);
    background: var(--color-btn-hover-bg);
    color: #fff !important;
}

.auth_form-submit:disabled,
.auth_form-submit.is-disabled,
.ifm_form-submit:disabled,
.ifm_form-submit.is-disabled {
    opacity: 0.45;
    cursor: default;
    pointer-events: none;
}

.auth_form-link-btn,
.ifm_form-link-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 38px;
    margin: 8px 0 0;
    padding: 8px 14px;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--color-null-element-text) !important;
    text-decoration: none;
    box-sizing: border-box;
    background: var(--color-btn-hover-bg);
}

.auth_form-actions {
    font-size: 140%;
}

.auth_form-links,
.ifm_form-links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 18px;
    margin-top: 35px;
    align-items: center;
    justify-content: center;
}

.auth_form-links a,
.ifm_form-links a {
    color: var(--color-null-element-text);
    opacity: 0.9;
    text-decoration: none;
}

.auth_form-links a:hover,
.ifm_form-links a:hover {
    opacity: 1;
    text-decoration: underline;
}

.help_versions {
    list-style: none;
    margin: 20px 0 0;
    padding: 0;
    text-align: center;
    font-size: 92%;
    line-height: 1.45;
    color: var(--color-null-element-text);
    opacity: 0.88;
}

.help_versions[hidden] {
    display: none !important;
}

.help_versions li {
    margin: 0;
    padding: 2px 0;
}

.help_versions-label {
    opacity: 0.72;
}

.help_versions-value {
    font-variant-numeric: tabular-nums;
}

.help_downloads {
    margin-top: 28px;
}

.help_downloads h2 {
    margin: 0 0 14px;
    text-align: center;
}

.help_downloads-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding: 0.5em 0 0 0;
}

.help_download-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 108px;
    padding: 16px 10px 14px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: var(--color-null-element-bg);
    color: var(--color-null-element-text);
    text-decoration: none;
    text-align: center;
    box-sizing: border-box;
    font: inherit;
    cursor: pointer;
}

button.help_download-tile:hover,
a.help_download-tile:hover {
    border-color: var(--color-btn-hover-border);
    background: var(--color-btn-hover-bg);
}

.help_download-tile.is-disabled {
    opacity: 0.45;
    pointer-events: none;
    cursor: default;
}

.help_download-icon {
    width: 36px;
    height: 36px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.help_download-icon[data-icon="android"] {
    background-image: url('../../ico/bt/android.svg');
}

.help_download-icon[data-icon="phone-iphone"] {
    background-image: url('../../ico/bt/phone-iphone.svg');
}

.help_download-icon[data-icon="desktop-windows"] {
    background-image: url('../../ico/bt/desktop-windows.svg');
}

.help_download-icon[data-icon="terminal"] {
    background-image: url('../../ico/bt/terminal.svg');
}

.help_download-name {
    font-weight: 550;
    line-height: 1.2;
}

.help_download-soon {
    font-size: 80%;
    opacity: 0.85;
    line-height: 1.2;
}

/* Модалка скачивания приложения */
.IFM_download-panel {
    max-width: 400px;
    padding: 0;
    max-height: calc(100dvh - 48px);
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

.IFM_download-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 14px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.IFM_download-title {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 105%;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.IFM_download-close {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 8px;
    background-color: transparent;
    background-image: url('../../ico/bt/close.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 52%;
    cursor: pointer;
}

.IFM_download-close:hover {
    border-color: var(--color-null-element-border);
    background-color: rgba(255, 255, 255, 0.06);
}

.IFM_download-qr {
    margin: 14px 14px 0;
    padding: 10px;
    border-radius: 10px;
    background: #fff;
    box-sizing: border-box;
}

.IFM_download-qr[hidden] {
    display: none !important;
}

.IFM_download-qr svg,
.IFM_download-qr img {
    display: block;
    width: 100%;
    height: auto;
}

.IFM_download-field {
    display: flex;
    align-items: stretch;
    gap: 8px;
    margin: 12px 14px 0;
}

.IFM_download-input {
    flex: 1 1 auto;
    min-width: 0;
    height: 40px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background: var(--color-null-element-bg);
    color: var(--color-null-element-text);
    font: inherit;
    font-size: 85%;
    box-sizing: border-box;
}

.IFM_download-copy {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--color-null-element-border);
    border-radius: 8px;
    background-color: var(--color-null-element-bg);
    background-image: url('../../ico/bt/content-copy.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 48%;
    cursor: pointer;
}

.IFM_download-copy:hover,
.IFM_download-copy.is-copied {
    border-color: var(--color-btn-hover-border);
    background-color: var(--color-btn-hover-bg);
}

.IFM_download-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(100% - 28px);
    margin: 14px 14px 14px;
    padding: 12px 14px;
    border: 1px solid var(--color-btn-border);
    border-radius: 8px;
    background: var(--color-btn-bg);
    color: var(--color-btn-text);
    font: inherit;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
    cursor: pointer;
}

.IFM_download-btn:hover {
    border-color: var(--color-btn-hover-border);
    background: var(--color-btn-hover-bg);
}

.help_downloads--compact {
    margin-top: 18px;
}

.help_downloads--compact h2 {
    margin: 0 0 10px;
    font-size: 90%;
}

.help_downloads--compact .help_downloads-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
}

.help_downloads--compact .help_download-tile {
    min-height: 0;
    padding: 10px 4px 8px;
    gap: 4px;
}

.help_downloads--compact .help_download-icon {
    width: 26px;
    height: 26px;
    background-size: 22px 22px;
}

.help_downloads--compact .help_download-name {
    font-size: 72%;
    line-height: 1.2;
}

.help_downloads--compact .help_download-soon {
    display: none;
}

.auth_form-error,
.auth_form-success,
.ifm_form-error,
.ifm_form-success {
    margin: 0 0 12px;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 90%;
    line-height: 1.35;
}

.auth_form-error,
.ifm_form-error {
    border: 1px solid #7a3a3a;
    background: #4a2a2a;
    color: #f0c0c0;
    user-select: text;
}

.auth_form-success,
.ifm_form-success {
    border: 1px solid #3a6a4a;
    background: #2a4a35;
    color: #c0e8d0;
}

.auth_form-redirect {
    margin: 14px 0 0;
    text-align: center;
    font-size: 90%;
    opacity: 0.85;
}

.auth_form-redirect-sec {
    font-weight: 600;
}

.auth_form-actions,
.ifm_form-actions {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.channel_edit_form .channel_edit_actions,
.group_edit_form .group_edit_actions {
    display: none !important;
}

.auth_form-captcha {
    margin-top: 40px;
    padding-top: 12px;
    border-top: 1px solid var(--color-null-element-border);
    font-size: 80%;
    line-height: 1.4;
    opacity: 0.85;
    word-break: break-word;
    text-align: center;
}

.ifm_social_links {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin: 18px 0 6px;
}

.ifm_social_link {
    display: inline-flex;
    width: 35px;
    height: 35px;
    border-radius: 12px;
    overflow: hidden;
    flex: 0 0 auto;
    transition: transform 0.15s ease, opacity 0.15s ease;
    opacity: 0.5;
}

.ifm_social_link:hover,
.ifm_social_link:focus-visible {
    transform: translateY(-1px);
    opacity: 0.92;
}

.ifm_social_link img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.help_article .ifm_social_links {
    margin-top: 28px;
}

.auth_form-captcha-label {
    margin-right: 6px;
    opacity: 0.7;
}

.auth_form-captcha[data-captcha-status="loading"],
.auth_form-captcha[data-captcha-status="idle"] {
    color: var(--color-null-element-text);
}

.auth_form-captcha[data-captcha-status="ready"] {
    color: #8fbf9f;
}

.auth_form-captcha[data-captcha-status="missing_key"],
.auth_form-captcha[data-captcha-status="error"] {
    color: #e0a0a0;
}

/* Блокировка UI при отсутствии связи с Go-сервером:
   только тело #LA (без #LAU) и #RAD (без #RAU). */
#IFM_server_link {
    position: fixed;
    inset: 0;
    z-index: 20000;
    pointer-events: none;
    background: transparent;
}

#IFM_server_link[hidden] {
    display: none !important;
}

#IFM_server_link .IFM_server_link-pane {
    position: fixed;
    box-sizing: border-box;
    pointer-events: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: #272727c2;
    color: #a5a3f0;
    font-size: 120%;
    letter-spacing: 0.02em;
    text-align: center;
    backdrop-filter: blur(3px);
}

#IFM_server_link .IFM_server_link-pane[data-pane="la"] {
    border-bottom-left-radius: 20px;
}

#IFM_server_link .IFM_server_link-pane[data-pane="rad"] {
    border-bottom-right-radius: 20px;
}

#IFM_server_link .IFM_server_link-pane[hidden] {
    display: none !important;
}

#IFM_server_link .IFM_server_link-text {
    max-width: 28em;
    line-height: 1.4;
    margin-right: 10%;
}

#IFM_server_link[data-fullwidth="1"] .IFM_server_link-text {
    margin-right: 0;
}

/* Оверлей назначения публичного логина (поверх #UI) */
#IFM_set_login {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: #0f0f0fb3;
    backdrop-filter: blur(4px);
}

#IFM_set_login[hidden] {
    display: none !important;
}

#IFM_set_login .IFM_set_login-panel {
    width: 100%;
    max-width: 420px;
    margin: 0;
    padding: 28px 22px;
    background: #505050;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}

#IFM_set_login .IFM_set_login-success {
    display: block;
    margin: 0 0 0px;
    font-size: 110%;
    text-align: center;
}

#IFM_set_login .auth_form-field {
    margin-bottom: 10px;
}

#IFM_set_login .auth_form-text {
    margin: 0 0 18px;
    opacity: 0.85;
    font-size: 90%;
    line-height: 1.4;
}

/* Масштаб только иконки (background-size), без изменения размера кнопки */
@media (hover: hover) and (pointer: fine) {
#LPU_logo:hover,
#LPD_search:hover,
#LPD_create:hover,
#LPD_favorites:hover,
#LAUL_list_bt:hover,
#LAVR_bt_leave:hover,
#LAD_options > [id^="user_option-"]:hover,
#RAU_alerts #RAU_option-alerts:hover,
#RAU_notes #RAU_option-notes:hover,
#RAU_mentions #RAU_option-mentions:hover,
#RAU_pins #RAU_option-pin:hover,
#RAU_friend_notes #RAU_option-members:hover,
#RAU_options > [id^="RAU_option-"]:hover,
#RAU_search #RAU_option-search:hover,
#RAU_nav-search-bt:hover,
#RAU_search_overlay-close:hover,
#projects_search-bt:hover,
#projects_search-clear:hover,
#users_search-bt:hover,
#users_search-clear:hover,
#market_search-bt:hover,
#market_search-clear:hover,
#hub_search-bt:hover,
#hub_search-clear:hover,
#RADR_search-types-bt:hover,
#RADR_search-sort:hover,
#RADR_search-close:hover,
#RAU_nav-help:hover,
#RADL_inputs-upload:hover,
#RADL_inputs-emoji:hover,
#RADL_inputs-scroll_end:hover,
#RADL_inputs-send:hover,
#page_selector:hover,
#dev_api_toggle:hover,
#dev_conn_test:hover {
    background-size: calc(var(--btn-icon-size) * var(--btn-icon-hover-scale));
}
}

#LPU_logo:active,
#LPD_search:active,
#LPD_create:active,
#LAUL_list_bt:active,
#LAVR_bt_leave:active,
#LAD_options > [id^="user_option-"]:active,
#RAU_alerts #RAU_option-alerts:active,
#RAU_notes #RAU_option-notes:active,
#RAU_mentions #RAU_option-mentions:active,
#RAU_pins #RAU_option-pin:active,
#RAU_friend_notes #RAU_option-members:active,
#RAU_options > [id^="RAU_option-"]:active,
#RAU_search #RAU_option-search:active,
#RAU_nav-search-bt:active,
#RAU_search_overlay-close:active,
#projects_search-bt:active,
#projects_search-clear:active,
#users_search-bt:active,
#users_search-clear:active,
#market_search-bt:active,
#market_search-clear:active,
#hub_search-bt:active,
#hub_search-clear:active,
#RADR_search-types-bt:active,
#RADR_search-sort:active,
#RADR_search-close:active,
#RAU_nav-help:active,
#RADL_inputs-upload:active,
#RADL_inputs-emoji:active,
#RADL_inputs-scroll_end:active,
#RADL_inputs-send:active,
#page_selector:active,
#dev_api_toggle:active,
#dev_conn_test:active {
    background-size: calc(var(--btn-icon-size) * var(--btn-icon-active-scale));
}

.grecaptcha-badge {
    z-index: 300000;
    bottom: -57px !important;
    right: -253px !important;
    transition: bottom 0.2s ease, right 0.2s ease;
}

.grecaptcha-badge:hover {
    bottom: 0 !important;
    right: 0 !important;
}

#IFM_call_popup {
    position: fixed;
    inset: 0;
    z-index: 20100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: rgb(20 20 20 / 38%);
    backdrop-filter: blur(6px);
}

#IFM_call_popup[hidden] {
    display: none !important;
}

.IFM_call_popup-card {
    width: min(360px, calc(100vw - 32px));
    padding: 28px 24px 22px;
    border-radius: 16px;
    background: var(--color-panel-bg, #313131);
    border: 1px solid var(--color-null-element-border, #4a4a4a);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
    text-align: center;
    font-family: var(--font-ui, 'Jost', sans-serif);
}

.IFM_call_popup-avatar {
    width: 96px;
    height: 96px;
    margin: 0 auto 16px;
    border-radius: 50%;
    border: 2px solid var(--color-null-element-border, #4a4a4a);
    background-color: var(--color-null-element-bg, #343434);
    background-image: url('../../ico/bt/avatar.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 55%;
}

.IFM_call_popup-avatar[have_img="1"] {
    background-size: cover;
}

.IFM_call_popup-name {
    font-size: 20px;
    font-weight: 600;
    color: #eee;
    line-height: 1.3;
    word-break: break-word;
}

.IFM_call_popup-dir {
    margin-top: 6px;
    margin-bottom: 22px;
    font-size: 14px;
    color: #9a9a9a;
}

.IFM_call_popup-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#IFM_call_popup[data-dir="in"] .IFM_call_popup-out,
#IFM_call_popup[data-dir="out"] .IFM_call_popup-in {
    display: none;
}

.IFM_call_popup-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 42px;
    border: 0;
    border-radius: 10px;
    color: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

.IFM_call_popup-btn .IFM_call_popup-ico {
    width: 18px;
    height: 18px;
    background: currentColor;
    -webkit-mask: center / contain no-repeat;
    mask: center / contain no-repeat;
}

.IFM_call_popup-btn--answer {
    background: #2e7d32;
}

.IFM_call_popup-btn--answer:hover {
    background: #388e3c;
}

.IFM_call_popup-btn--video {
    background: #1565c0;
}

.IFM_call_popup-btn--video:hover {
    background: #1976d2;
}

.IFM_call_popup-btn--decline {
    background: #c62828;
}

.IFM_call_popup-btn--decline:hover {
    background: #d32f2f;
}

.IFM_call_popup-btn--answer .IFM_call_popup-ico {
    -webkit-mask-image: url('../../ico/bt/call.svg');
    mask-image: url('../../ico/bt/call.svg');
}

.IFM_call_popup-btn--video .IFM_call_popup-ico {
    -webkit-mask-image: url('../../ico/bt/videocam.svg');
    mask-image: url('../../ico/bt/videocam.svg');
}

.IFM_call_popup-btn--decline .IFM_call_popup-ico {
    -webkit-mask-image: url('../../ico/bt/call-end.svg');
    mask-image: url('../../ico/bt/call-end.svg');
}

.IFM_call_popup-toggles {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-bottom: 4px;
}

.IFM_call_popup-toggle {
    width: 48px;
    height: 48px;
    border: 1px solid var(--color-null-element-border, #4a4a4a);
    border-radius: 50%;
    background-color: #3a3a3a;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 22px;
    cursor: pointer;
}

.IFM_call_popup-toggle:hover {
    background-color: #454545;
}

.IFM_call_popup-toggle[data-call-popup="sound"][data-on="1"] {
    background-image: url('../../ico/bt/volume-up.svg');
}

.IFM_call_popup-toggle[data-call-popup="sound"][data-on="0"] {
    background-image: url('../../ico/bt/volume-off.svg');
}

.IFM_call_popup-toggle[data-call-popup="mic"][data-on="1"] {
    background-image: url('../../ico/bt/mic.svg');
}

.IFM_call_popup-toggle[data-call-popup="mic"][data-on="0"] {
    background-image: url('../../ico/bt/mic-off.svg');
}

.IFM_call_popup-toggle[data-call-popup="camera"][data-on="1"] {
    background-image: url('../../ico/bt/videocam.svg');
}

.IFM_call_popup-toggle[data-call-popup="camera"][data-on="0"] {
    background-image: url('../../ico/bt/videocam-off.svg');
}

.IFM_call_popup-toggle[data-on="0"] {
    opacity: 0.55;
}