/**
 * App rail — unified sidebar: Surface/Primary (Light white · Dark gray/900), как правый context rail.
 * brand | icons (80px) | menu (240px). Без glass/blur. Flush к левому краю экрана.
 * Контент (.gc-app-main) — Surface/Page через --gc-app-content-bg; разделитель — Border/Subtle.
 */



@media (min-width: 992px) {

    body:has(.gc-app-rail) {

        --gc-body-pad-top: 0px;

        --layout-context-rail-sticky-top: 0px;

        padding-top: 0 !important;

        background: var(--gc-app-content-bg);

    }



    /* Только текстовое меню (без icon rail) — напр. гость на /dev/inertia */

    body:has(.gc-app-rail--menu-only) {

        --layout-app-rail-width: var(--layout-app-rail-menu-width);

        --layout-app-rail-chrome-width: var(--layout-app-rail-menu-width);

    }



    .gc-app-body:has(> .gc-app-rail) {

        margin-left: var(--layout-app-rail-chrome-width);

    }



    .gc-app-body:has(> .gc-app-rail) > .gc-app-main {

        flex: 1 1 auto;

        min-width: 0;

        --gc-app-main-inset-x: var(--layout-app-rail-main-inset-x);

        padding-inline: var(--gc-app-main-inset-x);

        box-sizing: border-box;

        background: var(--gc-app-content-bg);

    }

    /* Как .gc-app-main: chrome offset + тот же main-inset (без inner-контейнера).
       width не трогаем — auto + margin-left сам укладывается в viewport. */
    /* Legacy: футер вне .gc-app-main (старый shell). Внутри main — inset уже на колонке. */
    body:has(.gc-app-rail) .gc-app-shell > .gc-site-footer {

        margin-left: var(--layout-app-rail-chrome-width);

        padding-inline: var(--layout-app-rail-main-inset-x);

        box-sizing: border-box;

    }



    .gc-app-rail {

        --gc-app-rail-icon-size: calc(var(--space-8) + var(--space-4));

        --gc-app-rail-item-padding: calc(var(--space-2) + var(--space-1));

        --gc-app-rail-stack-height: 100vh;

        --gc-app-rail-stack-height: 100dvh;

        position: fixed;

        top: 0;

        left: 0;

        bottom: 0;

        z-index: 1025;

        width: var(--layout-app-rail-chrome-width);

        box-sizing: border-box;

        padding: 0;

        background: transparent;

        border: 0;

        overflow: visible;

        pointer-events: none;

        display: flex;

        flex-direction: column;

        align-items: flex-start;

    }



    .gc-app-rail__stack {

        pointer-events: auto;

        display: flex;

        flex-direction: column;

        gap: 0;

        width: var(--layout-app-rail-width);

        height: var(--gc-app-rail-stack-height);

        max-height: none;

        flex: 0 0 auto;

        box-sizing: border-box;

        color: var(--text-primary);

        background: var(--gc-app-rail-surface, var(--surface-primary));

        border: 0;

        border-right: 1px solid var(--gc-app-rail-divider, var(--border-subtle));

        border-radius: 0;

        overflow: visible;

    }



    .gc-app-rail__module {

        background: transparent;

        border: none;

        border-radius: 0;

        box-sizing: border-box;

        overflow: hidden;

    }



    .gc-app-rail__module--menu,

    .gc-app-rail__module--icons {

        overflow: visible;

    }



    .gc-app-rail__module--brand {

        /* Inset справа = (высота − border − колокольчик) / 2 — как сверху/снизу при align center */
        --gc-app-rail-brand-end-inset: calc(
            (var(--layout-app-chrome-header-height) - 1px - var(--gc-dropdown-icon-toggle-size)) / 2
        );

        flex: 0 0 auto;

        display: flex;

        align-items: center;

        justify-content: space-between;

        gap: var(--space-2);

        /* Одна высота с .gc-three-col-subheader */
        box-sizing: border-box;

        height: var(--layout-app-chrome-header-height);

        min-height: var(--layout-app-chrome-header-height);

        /* left: space/4 под лого; right: = вертикальный зазор до колокольчика */
        padding: 0 var(--gc-app-rail-brand-end-inset) 0 var(--space-4);

        border-bottom: 1px solid var(--gc-app-rail-divider, var(--border-subtle));

    }



    .gc-app-rail__body {

        flex: 1 1 auto;

        min-height: 0;

        display: flex;

        gap: 0;

        align-items: stretch;

    }



    .gc-app-rail__module--icons {

        flex: 0 0 var(--layout-app-rail-icon-width);

        width: var(--layout-app-rail-icon-width);

        min-height: 0;

        display: flex;

        flex-direction: column;

        align-items: center;

        gap: var(--space-4);

        padding: var(--space-4);

        overflow: visible;

        border-right: 1px solid var(--gc-app-rail-divider, var(--border-subtle));

    }



    .gc-app-rail__icon-rail-main {

        display: flex;

        flex-direction: column;

        align-items: center;

        gap: var(--space-4);

        flex: 1 1 auto;

        min-height: 0;

        width: 100%;

        overflow: visible;

        overscroll-behavior: auto;

        scrollbar-width: none;

        -ms-overflow-style: none;

    }



    .gc-app-rail-icon-rail-divider {

        width: 100%;

        height: 0;

        margin: 0;

        padding: 0;

        border: 0;

        border-top: 1px solid var(--gc-app-rail-divider, var(--border-subtle));

        flex-shrink: 0;

    }



    .gc-app-rail__icon-rail-main[data-gc-scroll-pass="0"] {

        overflow-x: hidden;

        overflow-y: auto;

        padding-inline: var(--space-1);

        box-sizing: border-box;

    }



    .gc-app-rail__icon-rail-footer {

        flex: 0 0 auto;

        display: flex;

        justify-content: center;

        width: 100%;

    }



    .gc-app-rail-icon-rail-appearance__toggle.gc-dropdown-toggle {

        gap: 0;

        padding: 0;

        background: transparent;

        border: none;

        border-radius: var(--radius-full);

        font-weight: inherit;

    }



    .gc-app-rail-icon-rail-appearance__toggle.gc-dropdown-toggle:hover,

    .gc-app-rail-icon-rail-appearance__toggle.gc-dropdown-toggle[aria-expanded="true"] {

        background: transparent;

        border-color: transparent;

    }



    .gc-app-rail-icon-rail-appearance__toggle .gc-app-rail-icon-link__placeholder {

        background: transparent;

        color: var(--text-secondary);

    }



    .gc-app-rail-icon-rail-appearance__toggle:hover .gc-app-rail-icon-link__placeholder {

        background: var(--gc-interactive-hover-bg);

    }



    .gc-app-rail-icon-rail-appearance__toggle[aria-expanded="true"] {

        box-shadow: 0 0 0 2px var(--border-default);

    }



    .gc-app-rail__module--menu {

        flex: 1 1 auto;

        min-width: 0;

        width: var(--layout-app-rail-menu-width);

        max-width: var(--layout-app-rail-menu-width);

        display: flex;

        flex-direction: column;

        min-height: 0;

        overflow: hidden;

    }



    .gc-app-rail__brand {

        flex: 1 1 auto;

        min-width: 0;

        display: block;

        text-decoration: none;

        color: inherit;

        line-height: 0;

    }



    .gc-app-rail__logo {

        width: auto;

        height: var(--layout-app-rail-logo-height);

        max-width: 100%;

    }



    .gc-app-rail__module--brand .gc-app-desktop-notifications {

        flex: 0 0 auto;

        display: flex;

        align-items: center;

    }



    .gc-app-rail__menu {

        flex: 1 1 auto;

        min-height: 0;

        display: flex;

        flex-direction: column;

        gap: var(--space-3);

        padding: var(--gc-app-rail-item-padding);

        box-sizing: border-box;

        overflow: visible;

        overscroll-behavior: auto;

        scrollbar-width: none;

        -ms-overflow-style: none;

    }



    .gc-app-rail__menu-footer {

        flex: 0 0 auto;

        margin-top: auto;

        padding: var(--space-2) var(--gc-app-rail-item-padding) var(--gc-app-rail-item-padding);

        border-top: 1px solid var(--gc-app-rail-divider, var(--border-subtle));

        box-sizing: border-box;

    }



    .gc-app-rail__menu[data-gc-scroll-pass="0"] {

        overflow-x: hidden;

        overflow-y: auto;

    }



    .gc-app-rail__icon-rail-main::-webkit-scrollbar,

    .gc-app-rail__menu::-webkit-scrollbar {

        display: none;

    }



    .gc-app-rail__section {

        display: flex;

        flex-direction: column;

        gap: var(--space-1);

        min-width: 0;

    }



    .gc-app-rail__section-label {

        margin: 0;

        padding: var(--space-1) var(--space-2);

        font-size: var(--font-size-13);

        font-weight: 500;

        line-height: calc(var(--font-size-13) + var(--space-1));

        color: var(--text-secondary);

    }



    .gc-app-rail__section-items {

        display: flex;

        flex-direction: column;

        gap: var(--space-1);

    }



    .gc-app-rail-icon-link-wrap {

        position: relative;

        display: flex;

        flex-shrink: 0;

    }



    .gc-app-rail-icon-link {

        position: relative;

        display: flex;

        align-items: center;

        justify-content: center;

        width: var(--gc-app-rail-icon-size);

        height: var(--gc-app-rail-icon-size);

        box-sizing: border-box;

        border-radius: var(--radius-full);

        overflow: hidden;

        flex-shrink: 0;

        text-decoration: none;

        border: 2px solid transparent;

        transition: box-shadow var(--transition-fast) var(--ease-in-out);

    }



    .gc-app-rail-icon-link.active {

        border-color: transparent;

        box-shadow: 0 0 0 2px var(--border-default);

    }



    .gc-app-rail-icon-link__avatar,
    .gc-app-rail-icon-link :is(.gc-list-avatar, .gc-list-avatar-fallback) {

        width: 100%;

        height: 100%;

        --gc-list-media-size: var(--gc-app-rail-icon-size);

        flex-shrink: 0;

    }



    .gc-app-rail-icon-link__avatar {

        object-fit: cover;

        display: block;

    }



    .gc-app-rail-icon-link__placeholder {

        width: 100%;

        height: 100%;

        display: flex;

        align-items: center;

        justify-content: center;

        background: var(--surface-control);

        color: var(--text-secondary);

    }



    .gc-app-rail-icon-link__placeholder i {

        font-size: var(--font-size-20);

        line-height: 1;

        color: var(--text-primary);

    }



    .gc-app-rail-menu-item {

        display: flex;

        align-items: center;

        gap: var(--space-2);

        min-height: calc(var(--gc-app-rail-item-padding) * 2 + var(--font-size-15));

        padding: var(--gc-app-rail-item-padding);

        border-radius: var(--radius-12);

        color: var(--text-primary);

        text-decoration: none;

        font-size: var(--font-size-15);

        font-weight: 500;

        line-height: calc(var(--font-size-15) + var(--space-1));

        border: 1px solid transparent;

        box-sizing: border-box;

        transition: background var(--transition-fast) var(--ease-in-out);

    }



    .gc-app-rail-menu-item i {

        flex-shrink: 0;

        width: var(--space-4);

        min-width: var(--space-4);

        text-align: center;

        font-size: var(--font-size-15);

        line-height: 1;

        color: inherit;

    }



    .gc-app-rail-menu-item > span:not(.gc-badge):not([class*="gc-badge-"]):not(.gc-list-meta) {

        flex: 1 1 0;

        min-width: 0;

        white-space: nowrap;

        overflow: hidden;

        text-overflow: ellipsis;

    }



    /* Счётчик / meta справа: без растягивания по ширине строки */

    .gc-app-rail-menu-item .gc-badge-counter,
    .gc-app-rail-menu-item .gc-badge-secondary,
    .gc-app-rail-menu-item > .gc-list-meta {

        flex: 0 0 auto;

        width: auto;

        max-width: max-content;

        margin-left: auto;

        align-self: center;

    }

    .gc-app-rail-menu-item .gc-badge-counter,
    .gc-app-rail-menu-item .gc-badge-secondary {

        min-width: calc(1.25rem + var(--space-2));

    }



    /* Hover = Interaction/Row-hover; active = Surface/Subtle — чип на Primary */

    .gc-app-rail-menu-item:hover:not(.active),

    .gc-app-rail-menu-item:focus-visible:not(.active) {

        background: var(--surface-interaction-row-hover);

        color: var(--text-primary);

    }



    .gc-app-rail-menu-item.active,

    .gc-app-rail-menu-item.active:hover,

    .gc-app-rail-menu-item.active:focus-visible {

        background: var(--surface-subtle);

        color: var(--text-primary);

        box-shadow: none;

    }



    .gc-app-rail-profile-subject .gc-list-avatar,

    .gc-app-rail-profile-subject .gc-list-avatar-fallback {

        --gc-list-media-size: var(--space-8);

        flex-shrink: 0;

    }



    .gc-app-rail-profile-subject__body {

        display: flex;

        flex-direction: column;

        gap: var(--space-1);

        flex: 1 1 0;

        min-width: 0;

    }



    .gc-app-rail-profile-subject__name {

        overflow: hidden;

        text-overflow: ellipsis;

        white-space: nowrap;

        font-size: var(--font-size-15);

        font-weight: 500;

        line-height: calc(var(--font-size-15) + var(--space-1));

        color: var(--text-primary);

    }



    .gc-app-rail-profile-subject__meta {

        overflow: hidden;

        text-overflow: ellipsis;

        white-space: nowrap;

        font-size: var(--font-size-13);

        font-weight: 400;

        line-height: calc(var(--font-size-13) + var(--space-1));

        color: var(--text-secondary);

    }



    .gc-app-rail-menu-item--disabled {

        opacity: 0.55;

        cursor: not-allowed;

        pointer-events: none;

    }



    .gc-app-rail-menu-item--disabled.active {

        background: var(--surface-subtle);

        box-shadow: none;

        opacity: 1;

    }



    /* Ряд пункта + trailing-сегмент («+» / «⋯»): общий контейнер */

    .gc-app-rail-menu-item-group {

        position: relative;

        width: 100%;

        min-width: 0;

        border-radius: var(--radius-12);

    }



    /*
     * Сегмент trailing-action («+» / «⋯») в ряду:
     * — grid: колонка квадрата всегда зарезервирована
     * — общий radius ряда + overflow:hidden → hover не вылезает наружу
     */
    .gc-app-rail-menu-item-group--create {
        --gc-app-rail-row-size: calc(
            var(--gc-app-rail-item-padding) * 2
            + var(--font-size-15)
            + var(--space-1)
        );
        display: grid;
        grid-template-columns: minmax(0, 1fr) var(--gc-app-rail-row-size);
        align-items: stretch;
        width: 100%;
        min-width: 0;
        min-height: var(--gc-app-rail-row-size);
        border-radius: var(--radius-12);
        overflow: hidden;
    }

    .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create {
        min-width: 0;
        min-height: var(--gc-app-rail-row-size);
        height: 100%;
        border: 0;
        border-radius: 0;
        background: transparent;
    }

    .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create:hover,
    .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create:focus-visible,
    .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create.active,
    .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create.active:hover,
    .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create.active:focus-visible {
        background: transparent;
    }

    .gc-app-rail-menu-item-group--create:hover,
    .gc-app-rail-menu-item-group--create:focus-within {
        background: var(--surface-interaction-row-hover);
    }

    .gc-app-rail-menu-item-group--create.is-active,
    .gc-app-rail-menu-item-group--create.is-active:hover,
    .gc-app-rail-menu-item-group--create.is-active:focus-within {
        background: var(--surface-subtle);
    }

    .gc-app-rail-menu-item-create-segment {
        display: flex;
        align-items: stretch;
        justify-content: stretch;
        box-sizing: border-box;
        width: var(--gc-app-rail-row-size);
        height: var(--gc-app-rail-row-size);
        border-left: 1px solid transparent;
        border-radius: 0;
        opacity: 0;
        pointer-events: none;
        transition: opacity var(--transition-fast) var(--ease-out);
    }

    .gc-app-rail-menu-item-group--create:hover .gc-app-rail-menu-item-create-segment,
    .gc-app-rail-menu-item-group--create:focus-within .gc-app-rail-menu-item-create-segment,
    .gc-app-rail-menu-item-group--create.is-active .gc-app-rail-menu-item-create-segment {
        opacity: 1;
        pointer-events: auto;
    }

    /* Разделитель только при hover/focus на невыделенном ряду — у is-active линии нет */
    .gc-app-rail-menu-item-group--create:hover:not(.is-active) .gc-app-rail-menu-item-create-segment,
    .gc-app-rail-menu-item-group--create:focus-within:not(.is-active) .gc-app-rail-menu-item-create-segment {
        border-left-color: var(--border-subtle);
    }

    .gc-app-rail-item-create {
        display: flex;
        width: 100%;
        height: 100%;
    }

    .gc-app-rail-menu-item-create-segment > .gc-app-rail-item-create.gc-dropdown {
        display: flex;
        width: 100%;
        height: 100%;
    }

    .gc-app-rail-item-create__toggle,
    .gc-app-rail-item-create > .gc-app-rail-item-create__toggle.gc-dropdown-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        width: var(--gc-app-rail-row-size);
        height: var(--gc-app-rail-row-size);
        min-width: var(--gc-app-rail-row-size);
        min-height: var(--gc-app-rail-row-size);
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: inherit;
        font-size: inherit;
        font-weight: inherit;
        letter-spacing: normal;
        line-height: 1;
        text-decoration: none;
        box-shadow: none;
        cursor: pointer;
        appearance: none;
        -webkit-appearance: none;
        transition: background-color var(--transition-fast) var(--ease-out);
    }

    .gc-app-rail-item-create__toggle::after,
    .gc-app-rail-item-create > .gc-app-rail-item-create__toggle.gc-dropdown-toggle::after {
        display: none;
    }

    .gc-app-rail-item-create__toggle i {
        font-size: var(--font-size-16);
        line-height: 1;
    }

    .gc-app-rail-item-create__toggle:hover,
    .gc-app-rail-item-create__toggle:focus-visible,
    .gc-app-rail-item-create__toggle[aria-expanded="true"],
    .gc-app-rail-item-create > .gc-app-rail-item-create__toggle.gc-dropdown-toggle:hover,
    .gc-app-rail-item-create > .gc-app-rail-item-create__toggle.gc-dropdown-toggle:focus-visible,
    .gc-app-rail-item-create > .gc-app-rail-item-create__toggle.gc-dropdown-toggle[aria-expanded="true"] {
        background: color-mix(in srgb, var(--text-primary) 10%, transparent);
        border-radius: 0;
        box-shadow: none;
        outline: none;
    }


    /* Figma 1514:12225 — вложенный список организаторов под пунктом «Организаторы» */

    .gc-app-rail-menu-item-stack {

        display: flex;

        flex-direction: column;

        align-items: stretch;

        width: 100%;

        min-width: 0;

        border-radius: var(--radius-12);

    }



    .gc-app-rail-menu-item-stack--interactive {

        text-decoration: none;

        color: var(--text-primary);

        border: 1px solid transparent;

        box-sizing: border-box;

        transition: background var(--transition-fast) var(--ease-in-out);

    }



    .gc-app-rail-menu-item-stack--interactive:hover:not(.active),

    .gc-app-rail-menu-item-stack--interactive:focus-visible:not(.active) {

        background: var(--surface-interaction-row-hover);

        color: var(--text-primary);

    }



    .gc-app-rail-menu-item-stack--interactive.active,

    .gc-app-rail-menu-item-stack--interactive.active:hover,

    .gc-app-rail-menu-item-stack--interactive.active:focus-visible {

        background: var(--surface-subtle);

        color: var(--text-primary);

    }



    .gc-app-rail-menu-item-head {

        display: flex;

        align-items: center;

        gap: var(--space-2);

        min-height: calc(var(--gc-app-rail-item-padding) * 2 + var(--font-size-15));

        padding: var(--gc-app-rail-item-padding);

        padding-bottom: 0;

        font-size: var(--font-size-15);

        font-weight: 500;

        line-height: calc(var(--font-size-15) + var(--space-1));

    }



    .gc-app-rail-menu-item-head i {

        flex-shrink: 0;

        width: var(--space-4);

        min-width: var(--space-4);

        text-align: center;

        font-size: var(--font-size-15);

        line-height: 1;

        color: inherit;

    }



    .gc-app-rail-menu-item-head > span:not(.gc-badge):not([class*="gc-badge-"]):not(.gc-list-meta) {

        flex: 1 1 0;

        min-width: 0;

        white-space: nowrap;

        overflow: hidden;

        text-overflow: ellipsis;

    }



    .gc-app-rail-menu-item-head .gc-badge-counter,
    .gc-app-rail-menu-item-head .gc-badge-secondary,
    .gc-app-rail-menu-item-head > .gc-list-meta {

        flex: 0 0 auto;

        width: auto;

        max-width: max-content;

        margin-left: auto;

        align-self: center;

    }

    .gc-app-rail-menu-item-head .gc-badge-counter,
    .gc-app-rail-menu-item-head .gc-badge-secondary {

        min-width: calc(1.25rem + var(--space-2));

    }



    .gc-app-rail-menu-item-nested {

        display: flex;

        flex-direction: column;

        align-items: stretch;

        gap: var(--space-2);

        padding: var(--space-2) var(--space-3) var(--space-3);

    }



    .gc-app-rail-menu-item-nested-row {

        display: flex;

        align-items: center;

        gap: var(--space-2);

        min-width: 0;

    }



    .gc-app-rail-menu-item-nested-label {

        flex: 1 1 0;

        min-width: 0;

        overflow: hidden;

        text-overflow: ellipsis;

        white-space: nowrap;

        font-size: var(--type-ui-caption-size);

        font-weight: 400;

        line-height: var(--type-ui-caption-line-height);

        color: var(--text-secondary);

    }



    .gc-app-rail-menu-item-nested-row .gc-list-avatar,

    .gc-app-rail-menu-item-nested-row .gc-list-avatar-fallback {

        --gc-list-media-size: var(--space-6);

        flex-shrink: 0;

    }



    /* Theme-aware rail: Surface/Primary + hover/active чипы на белом chrome */

    .gc-app-rail__stack {
        --gc-app-rail-surface: var(--surface-primary);
        /* Hover — Interaction/Row-hover; active — Subtle (на Primary чип виден) */
        --gc-app-rail-item-hover-bg: var(--surface-interaction-row-hover);
        --gc-app-rail-item-active-bg: var(--surface-subtle);
        --gc-app-rail-item-panel-bg: var(--surface-subtle);
        --gc-app-rail-icon-bg: var(--surface-subtle);
        --gc-app-rail-icon-hover-bg: var(--surface-interaction-control-hover);
        --gc-app-rail-icon-border: var(--border-subtle);
        --gc-app-rail-divider: var(--border-subtle);
        --gc-app-rail-active-ring: var(--border-default);
    }



    .gc-app-rail__stack .notifications-bell--chrome {

        color: var(--text-primary);

    }



    .gc-app-rail__stack .notifications-bell--chrome:hover,

    .gc-app-rail__stack .notifications-bell--chrome:focus-visible,

    .gc-app-rail__stack .gc-app-desktop-notifications:has(.notifications-dropdown.show) .notifications-bell--chrome {

        background-color: var(--gc-app-rail-item-hover-bg);

        color: var(--text-primary);

    }



    .gc-app-rail__stack .notifications-bell--chrome:focus-visible {

        box-shadow:

            0 0 0 2px var(--gc-app-rail-surface),

            0 0 0 4px rgba(var(--accent-link-rgb), 0.4);

    }



    .gc-app-rail__stack .notifications-bell-dot {

        box-shadow: 0 0 0 2px var(--gc-app-rail-surface);

    }



    .gc-app-rail__stack .gc-app-rail__section-label,

    .gc-app-rail__stack .gc-app-rail-profile-subject__meta,

    .gc-app-rail__stack .gc-app-rail-menu-item-nested-label {

        color: var(--text-secondary);

    }



    .gc-app-rail__stack .gc-app-rail-profile-subject__name,

    .gc-app-rail__stack .gc-app-rail-menu-item,

    .gc-app-rail__stack .gc-app-rail-menu-item-stack--interactive,

    .gc-app-rail__stack .gc-app-rail-menu-item-head {

        color: var(--text-primary);

    }



    .gc-app-rail__stack .gc-app-rail-icon-link__placeholder {

        background: var(--gc-app-rail-icon-bg);

        color: var(--text-secondary);

    }



    .gc-app-rail__stack .gc-app-rail-icon-link__placeholder i {

        color: var(--text-primary);

    }



    .gc-app-rail__stack .gc-app-rail-icon-link__placeholder:hover,

    .gc-app-rail__stack .gc-app-rail-icon-rail-appearance__toggle:hover .gc-app-rail-icon-link__placeholder {

        background-color: var(--gc-app-rail-icon-hover-bg);

        color: var(--text-primary);

    }



    .gc-app-rail__stack .gc-app-rail-icon-link.active,

    .gc-app-rail__stack .gc-app-rail-icon-rail-appearance__toggle[aria-expanded="true"] {

        box-shadow: 0 0 0 2px var(--gc-app-rail-active-ring);

    }



    .gc-app-rail__stack .gc-app-rail-menu-item:hover:not(.active),

    .gc-app-rail__stack .gc-app-rail-menu-item:focus-visible:not(.active),

    .gc-app-rail__stack .gc-app-rail-menu-item-stack--interactive:hover:not(.active),

    .gc-app-rail__stack .gc-app-rail-menu-item-stack--interactive:focus-visible:not(.active) {

        background: var(--gc-app-rail-item-hover-bg);

        color: var(--text-primary);

    }



    .gc-app-rail__stack .gc-app-rail-menu-item.active,

    .gc-app-rail__stack .gc-app-rail-menu-item.active:hover,

    .gc-app-rail__stack .gc-app-rail-menu-item.active:focus-visible,

    .gc-app-rail__stack .gc-app-rail-menu-item-stack--interactive.active,

    .gc-app-rail__stack .gc-app-rail-menu-item-stack--interactive.active:hover,

    .gc-app-rail__stack .gc-app-rail-menu-item-stack--interactive.active:focus-visible,

    .gc-app-rail__stack .gc-app-rail-menu-item--disabled.active {

        background: var(--gc-app-rail-item-active-bg);

        color: var(--text-primary);

    }



    .gc-app-rail__stack .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create,
    .gc-app-rail__stack .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create.active,
    .gc-app-rail__stack .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create:hover,
    .gc-app-rail__stack .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create:focus-visible,
    .gc-app-rail__stack .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create.active:hover,
    .gc-app-rail__stack .gc-app-rail-menu-item-group--create > .gc-app-rail-menu-item--with-create.active:focus-visible {
        background: transparent;
        color: var(--text-primary);
    }

    .gc-app-rail__stack .gc-app-rail-menu-item-group--create:hover,
    .gc-app-rail__stack .gc-app-rail-menu-item-group--create:focus-within {
        background: var(--gc-app-rail-item-hover-bg);
    }

    .gc-app-rail__stack .gc-app-rail-menu-item-group--create.is-active,
    .gc-app-rail__stack .gc-app-rail-menu-item-group--create.is-active:hover,
    .gc-app-rail__stack .gc-app-rail-menu-item-group--create.is-active:focus-within {
        background: var(--gc-app-rail-item-active-bg);
    }

    .gc-app-rail__stack .gc-app-rail-menu-item-group--create:hover:not(.is-active) .gc-app-rail-menu-item-create-segment,
    .gc-app-rail__stack .gc-app-rail-menu-item-group--create:focus-within:not(.is-active) .gc-app-rail-menu-item-create-segment {
        border-left-color: var(--gc-app-rail-divider);
    }

    .gc-app-rail__stack .gc-app-rail-item-create__toggle,
    .gc-app-rail__stack .gc-app-rail-item-create > .gc-app-rail-item-create__toggle.gc-dropdown-toggle {
        color: var(--text-primary);
        background: transparent;
    }

    .gc-app-rail__stack .gc-app-rail-item-create__toggle:hover,
    .gc-app-rail__stack .gc-app-rail-item-create__toggle:focus-visible,
    .gc-app-rail__stack .gc-app-rail-item-create__toggle[aria-expanded="true"],
    .gc-app-rail__stack .gc-app-rail-item-create > .gc-app-rail-item-create__toggle.gc-dropdown-toggle:hover,
    .gc-app-rail__stack .gc-app-rail-item-create > .gc-app-rail-item-create__toggle.gc-dropdown-toggle:focus-visible,
    .gc-app-rail__stack .gc-app-rail-item-create > .gc-app-rail-item-create__toggle.gc-dropdown-toggle[aria-expanded="true"] {
        background: var(--surface-interaction-overlay-hover);
        color: var(--text-primary);
    }

}

/* ─── Rail menu slice (Storybook / lab): базовый layout вне @992 canvas ─── */

.gc-app-rail__section {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    min-width: 0;
}

.gc-app-rail__section-label {
    margin: 0;
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-13);
    font-weight: 500;
    line-height: calc(var(--font-size-13) + var(--space-1));
    color: var(--text-secondary);
}

.gc-app-rail__section-items {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.gc-app-rail-icon-rail-divider {
    width: 100%;
    height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-top: 1px solid var(--gc-app-rail-divider, var(--border-subtle));
    flex-shrink: 0;
}

.gc-app-rail-icon-link-wrap {
    position: relative;
    display: flex;
    flex-shrink: 0;
}

.gc-app-rail-menu-item {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-height: calc(var(--gc-app-rail-item-padding, calc(var(--space-2) + var(--space-1))) * 2 + var(--font-size-15));
    padding: var(--gc-app-rail-item-padding, calc(var(--space-2) + var(--space-1)));
    border-radius: var(--radius-12);
    color: var(--text-primary);
    text-decoration: none;
    font-size: var(--font-size-15);
    font-weight: 500;
    line-height: calc(var(--font-size-15) + var(--space-1));
    border: 1px solid transparent;
    box-sizing: border-box;
    transition: background var(--transition-fast) var(--ease-in-out);
}

.gc-app-rail-menu-item i {
    flex-shrink: 0;
    width: var(--space-4);
    min-width: var(--space-4);
    text-align: center;
    font-size: var(--font-size-15);
    line-height: 1;
    color: inherit;
}

.gc-app-rail-menu-item > span:not(.gc-badge):not([class*="gc-badge-"]):not(.gc-list-meta) {
    flex: 1 1 0;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gc-app-rail-menu-item .gc-badge-counter,
.gc-app-rail-menu-item .gc-badge-secondary,
.gc-app-rail-menu-item > .gc-list-meta {
    flex: 0 0 auto;
    width: auto;
    max-width: max-content;
    margin-left: auto;
    align-self: center;
}

.gc-app-rail-menu-item .gc-badge-counter,
.gc-app-rail-menu-item .gc-badge-secondary {
    min-width: calc(1.25rem + var(--space-2));
}

.gc-app-rail-menu-item:hover:not(.active),
.gc-app-rail-menu-item:focus-visible:not(.active) {
    background: var(--surface-interaction-row-hover);
    color: var(--text-primary);
}

.gc-app-rail-menu-item.active,
.gc-app-rail-menu-item.active:hover,
.gc-app-rail-menu-item.active:focus-visible {
    background: var(--gc-app-rail-item-active-bg, var(--surface-subtle));
    color: var(--text-primary);
}