/*
 * Пользовательская часть: профили, список пользователей, формы, вкладки.
 * Те же стили применяются к форуму и комментариям (forum.css) — всё сидит на классе .ep_ui,
 * который main.tpl.php ставит на <article> контроллеров users, forum, comments, auth, messages.
 *
 * Панель тёмная, как у героев и новостей; в светлой теме — белая карточка.
 * Цвета берутся из переменных --u-*, для светлой темы они переопределены ниже.
 * Селекторы начинаются с #body, чтобы перебить styles.css контроллеров (он подключается позже).
 */

#body article.ep_ui {
    --u-ink:        #fff;
    --u-body:       #d5def0;
    --u-link:       #8ab8ff;
    --u-field:      rgba(7, 16, 36, .6);
    --u-field-line: rgba(126, 162, 230, .3);
    --u-muted:      rgba(213, 222, 240, .68);
    --u-line:       rgba(126, 162, 230, .2);
    --u-soft:       rgba(255, 255, 255, .05);
    --u-soft-2:     rgba(255, 255, 255, .1);
    --u-accent:     var(--ep-accent);
    --u-accent-hi:  var(--ep-accent-hi);

    border: 1px solid var(--ep-line);
    background: linear-gradient(180deg, rgba(16, 33, 66, .88) 0%, rgba(10, 22, 46, .9) 100%);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    color: var(--u-body);
}
:root[data-theme="light"] #body article.ep_ui {
    --u-ink:        #0f2246;
    --u-body:       #334155;
    --u-link:       #1d4ed8;
    --u-field:      #fff;
    --u-field-line: #c9d6ec;
    --u-muted:      #64748b;
    --u-line:       #dbe4f3;
    --u-soft:       #f1f5fb;
    --u-soft-2:     #e3ebf8;

    border-color: var(--ep-line);
    background: var(--ep-panel-bg);
    box-shadow: var(--ep-panel-shadow);
}

#body article.ep_ui h1,
#body article.ep_ui h2,
#body article.ep_ui h3,
#body article.ep_ui h4 { color: var(--u-ink); font-family: var(--ep-font); }
#body article.ep_ui h1 { font-weight: 700; }
#body article.ep_ui h1 span,
#body article.ep_ui h1 a { color: var(--u-muted); }
#body article.ep_ui h1 a:hover { color: var(--u-ink); }

:where(#body article.ep_ui) a { color: var(--u-link); text-decoration: none; }
:where(#body article.ep_ui) a:hover { color: var(--u-ink); text-decoration: underline; }
#body article.ep_ui a.ajaxlink { border-bottom-color: var(--u-muted); }
#body article.ep_ui p, #body article.ep_ui li { color: inherit; }
#body article.ep_ui blockquote {
    border-left-color: var(--u-accent);
    border-radius: 0 8px 8px 0;
    background: var(--u-soft);
    color: var(--u-body);
}
#body article.ep_ui pre,
#body article.ep_ui code { border-color: var(--u-line); border-radius: 8px; background: var(--u-soft); box-shadow: none; color: var(--u-body); }
#body article.ep_ui hr { border: 0; border-top: 1px solid var(--u-line); }

/* Формы ==================================================================== */

#body article.ep_ui form fieldset {
    margin: 0 0 18px;
    padding: 18px 20px 20px;
    border: 1px solid var(--u-line);
    border-radius: 10px;
    background: var(--u-soft);
}
#body article.ep_ui form fieldset legend {
    padding: 4px 12px;
    border-radius: 999px;
    background: var(--u-accent);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .02em;
}
#body article.ep_ui form fieldset.highlight { background: var(--u-soft-2); }

#body article.ep_ui form .field { margin-bottom: 14px; }
#body article.ep_ui form .field:last-child { margin-bottom: 0; }
#body article.ep_ui form .field > label,
#body article.ep_ui form .field > .title,
#body article.ep_ui form .label {
    padding: 0 0 5px;
    color: var(--u-body);
    font-size: 13px;
    font-weight: 500;
}
#body article.ep_ui form .hint { margin-top: 4px; color: var(--u-muted); font-size: 12px; }
#body article.ep_ui form .field_error .error_text { color: #f87171; }

#body article.ep_ui .input,
#body article.ep_ui .textarea,
#body article.ep_ui .date-input,
#body article.ep_ui select,
#body article.ep_ui input[type=text],
#body article.ep_ui input[type=password],
#body article.ep_ui input[type=email],
#body article.ep_ui textarea {
    box-sizing: border-box;
    border: 1px solid var(--u-field-line);
    border-radius: 8px;
    background: var(--u-field);
    box-shadow: none;
    color: var(--u-body);
    font-family: inherit;
    font-size: 14px;
    transition: border-color .15s, box-shadow .15s;
}
#body article.ep_ui .input,
#body article.ep_ui .date-input,
#body article.ep_ui select { height: 38px; padding: 0 12px; }
#body article.ep_ui .textarea,
#body article.ep_ui textarea { padding: 10px 12px; line-height: 1.5; }
#body article.ep_ui .textarea { height: 200px; }
#body article.ep_ui .input::placeholder,
#body article.ep_ui textarea::placeholder { color: var(--u-muted); }
#body article.ep_ui .input:focus,
#body article.ep_ui .textarea:focus,
#body article.ep_ui .date-input:focus,
#body article.ep_ui select:focus,
#body article.ep_ui textarea:focus {
    border-color: var(--ep-sky);
    outline: none;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, .22);
}
#body article.ep_ui select option { background: var(--u-field); color: var(--u-body); }
#body article.ep_ui form .field_error .input,
#body article.ep_ui form .field_error .textarea,
#body article.ep_ui form .field_error select,
#body article.ep_ui form input.error,
#body article.ep_ui form textarea.error { border-color: #ef4444; }

#body article.ep_ui .city-input {
    height: 38px;
    padding: 0;
    border: 1px solid var(--u-field-line);
    border-radius: 8px;
    background: var(--u-field);
    overflow: hidden;
    color: var(--u-body);
    line-height: 36px;
}
#body article.ep_ui .city-input span { padding: 0 12px; }
#body article.ep_ui .city-input a,
#body article.ep_ui .input_link_block {
    display: inline-block;
    height: 38px;
    padding: 0 14px;
    border-radius: 0;
    background: var(--u-soft-2);
    color: var(--u-body);
    line-height: 38px;
    text-decoration: none;
}
#body article.ep_ui .city-input a:hover,
#body article.ep_ui .input_link_block:hover { background: var(--u-accent); color: #fff; }

#body article.ep_ui .button,
#body article.ep_ui input[type=submit],
#body article.ep_ui input[type=button] {
    height: 38px;
    padding: 0 18px;
    border: 0;
    border-radius: 8px;
    background: var(--u-accent);
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: background .15s;
}
#body article.ep_ui .button:hover,
#body article.ep_ui input[type=submit]:hover,
#body article.ep_ui input[type=button]:hover { background: var(--u-accent-hi); color: #fff; text-decoration: none; }
#body article.ep_ui .button-cancel,
#body article.ep_ui form .button[name="cancel"],
#body article.ep_ui .button-preview { background: var(--u-soft-2); color: var(--u-body); }
#body article.ep_ui .button-cancel:hover,
#body article.ep_ui form .button[name="cancel"]:hover,
#body article.ep_ui .button-preview:hover { background: var(--u-line); color: var(--u-ink); }
#body article.ep_ui input.button.delete_profile { background: #dc2626; }
#body article.ep_ui input.button.delete_profile:hover { background: #b91c1c; }

/* Вкладки ================================================================== */

#body article.ep_ui .tabs-menu { margin-bottom: 20px; }
#body article.ep_ui .tabs-menu > ul {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
    padding: 0;
    border: 0;
}
#body article.ep_ui .tabs-menu .tabbed li { float: none; margin: 0; background: none; }
#body article.ep_ui .tabs-menu .tabbed li a {
    display: block;
    padding: 7px 16px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: var(--u-soft);
    color: var(--u-body);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: background .15s, border-color .15s, color .15s;
}
#body article.ep_ui .tabs-menu .tabbed li a:hover { background: var(--u-soft-2); color: var(--u-ink); }
#body article.ep_ui .tabs-menu .tabbed li.active a,
#body article.ep_ui .tabs-menu .tabbed li.active a:hover {
    border-color: color-mix(in srgb, var(--ep-sky) 60%, transparent);
    background: color-mix(in srgb, var(--ep-accent) 28%, transparent);
    color: var(--u-ink);
}
#body article.ep_ui .tabs-menu li a .counter {
    padding: 1px 7px;
    border-radius: 999px;
    background: var(--u-soft-2);
    color: var(--u-body);
    font-size: 12px;
}
#body article.ep_ui .tabs-menu li.folder > ul {
    border: 1px solid var(--u-line);
    border-radius: 8px;
    background: var(--ep-bg-2);
    box-shadow: var(--ep-shadow);
}
#body article.ep_ui .tabs-menu li.folder > ul li a { color: var(--u-body); }
#body article.ep_ui .tabs-menu li.folder > ul li a:hover { background: var(--u-soft-2); }

/* Подразделы, фильтры, сортировка ========================================== */

#body article.ep_ui .content_datasets ul,
#body article.ep_ui .content_list_filter ul { margin: 0 0 14px; padding: 0; }
#body article.ep_ui .content_datasets ul li { display: inline-block; margin: 0 4px 4px 0; }
#body article.ep_ui .content_datasets ul li > a,
#body article.ep_ui .content_datasets ul li > div {
    display: block;
    padding: 5px 12px;
    border-radius: 999px;
    background: var(--u-soft-2);
    color: var(--u-body);
    font-size: 13px;
    text-decoration: none;
}
#body article.ep_ui .content_datasets ul li > a:hover { background: var(--u-line); color: var(--u-ink); }
#body article.ep_ui .content_datasets ul li.active > div,
#body article.ep_ui .content_datasets ul li.active > a { background: var(--u-accent); color: #fff; }

#body article.ep_ui .filter-panel {
    margin-bottom: 14px;
    border: 1px solid var(--u-line);
    border-radius: 10px;
    background: var(--u-soft);
    color: var(--u-body);
}
#body article.ep_ui .filter-panel .title,
#body article.ep_ui .filter-panel label { color: var(--u-body); }

#body article.ep_ui .pagebar { margin-top: 16px; }
#body article.ep_ui .pagebar a,
#body article.ep_ui .pagebar .pagebar_page,
#body article.ep_ui .pagebar span {
    display: inline-block;
    min-width: 32px;
    margin: 0 2px 4px 0;
    padding: 6px 10px;
    border: 0;
    border-radius: 8px;
    background: var(--u-soft-2);
    box-sizing: border-box;
    color: var(--u-body);
    text-align: center;
    text-decoration: none;
}
#body article.ep_ui .pagebar a:hover { background: var(--u-line); color: var(--u-ink); }
#body article.ep_ui .pagebar .pagebar_current,
#body article.ep_ui .pagebar span.current { background: var(--u-accent); color: #fff; }

#body article.ep_ui .striped-list .item,
#body article.ep_ui .striped-list .odd {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border: 0;
    border-bottom: 1px solid var(--u-line);
    border-radius: 8px;
    background: none;
    transition: background .15s;
}
#body article.ep_ui .striped-list .item:last-child { border-bottom: 0; }
#body article.ep_ui .striped-list .item:hover { background: var(--u-soft); }

/* Список пользователей */
#body #users_profiles_list .position { min-width: 22px; color: var(--u-muted); font-weight: 500; text-align: center; }
#body #users_profiles_list .icon { flex: 0 0 auto; }
#body #users_profiles_list .icon img { display: block; border-radius: 50%; }
#body #users_profiles_list .title { flex: 1 1 auto; min-width: 0; }
#body #users_profiles_list .title > a { color: var(--u-ink); font-weight: 500; }
#body #users_profiles_list .title > a:hover { color: var(--ep-sky); }
#body #users_profiles_list .field { color: var(--u-muted); }
#body #users_profiles_list .actions { flex: 0 0 auto; color: var(--u-muted); font-size: 13px; }
#body #users_profiles_list .actions .positive { color: #4ade80; }
#body #users_profiles_list .actions .negative { color: #f87171; }
:root[data-theme="light"] #users_profiles_list .actions .positive { color: #16a34a; }
:root[data-theme="light"] #users_profiles_list .actions .negative { color: #dc2626; }

/* Профиль ================================================================== */

#body #user_profile { padding-top: 6px; }
#body #user_profile_title { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; line-height: normal; }
#body #user_profile_title .avatar img { box-shadow: 0 0 0 2px var(--u-line); }
#body #user_profile_title .name { flex: 1 1 auto; min-width: 0; }
#body #user_profile_title .name h1 { margin: 0; font-size: 26px; line-height: 1.2; }
#body #user_profile_title .name h1 > sup { margin-left: 8px; color: var(--u-muted); font-size: 12px; font-weight: 400; vertical-align: middle; }
#body #user_profile_title .name h1 > sup .online { color: #4ade80; }
#body #user_profile_title .name a { color: var(--u-ink); }
#body #user_profile_title .status { margin-top: 4px; }
#body #user_profile_title .status .text { color: var(--u-muted); }
#body #user_profile_title .status .reply { padding-left: 0; background: none; }
#body #user_profile_title .is_locked { color: #f87171; }

/* Рейтинг и репутация: две компактные плашки справа от ника */
#body #user_profile_title { gap: 16px; }
#body #user_profile_rates, #body #user_profile_ratings { float: none; display: block; margin: 0; }
#body #user_profile_title #user_profile_ratings { order: 2; }
#body #user_profile_title #user_profile_rates { order: 3; }
#body #user_profile_rates .block, #body #user_profile_ratings .block {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2px 8px;
    min-width: 92px;
    padding: 8px 16px 7px;
    border: 1px solid var(--u-line);
    border-radius: 12px;
    background: var(--u-soft);
    box-sizing: border-box;
    color: var(--u-ink);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
}
#body #user_profile_ratings .block {
    border-color: color-mix(in srgb, var(--ep-sky) 55%, transparent);
    background: color-mix(in srgb, var(--ep-accent) 22%, transparent);
}
#body .block .user_ratings_hint {
    flex: 0 0 100%;
    color: var(--u-muted);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .06em;
    opacity: 1;
    text-align: center;
    text-transform: uppercase;
}
#body #user_profile_ratings .positive { color: inherit; }
#body #user_profile_rates .thumb { margin: 0; opacity: .55; }
#body #user_profile_rates .thumb:hover { opacity: 1; }
#body #user_profile_rates .positive { color: #4ade80; }
#body #user_profile_rates .negative { color: #f87171; }

#body #user_status_widget { margin: 0 0 16px; padding: 0; background: none; }
#body #user_status_widget .input { height: 40px; }

#body #user_profile #left_column .block {
    margin-right: 20px;
    padding: 12px;
    border: 1px solid var(--u-line);
    border-bottom: 0;
    background: var(--u-soft);
}
#body #user_profile #left_column .block:first-child { border-radius: 10px 10px 0 0; }
#body #user_profile #left_column .block:last-child { border-bottom: 1px solid var(--u-line); border-radius: 0 0 10px 10px; }
#body #user_profile #left_column .block:only-child { border-radius: 10px; }
#body #user_profile #avatar img { max-width: 100%; height: auto; border-radius: 8px; }
#body #user_profile .block .details li { color: var(--u-muted); line-height: 1.7; }
#body #user_profile .block .details strong,
#body #user_profile .block .block-title { color: var(--u-body); font-weight: 500; }
#body #user_profile .block .details .online { color: #4ade80; }
#body #user_profile .block .content_counts li { border-bottom-color: var(--u-line); }
#body #user_profile .block .content_counts a { color: var(--u-body); border-radius: 6px; }
#body #user_profile .block .content_counts a:hover { background: var(--u-soft-2); color: var(--u-ink); text-decoration: none; }
#body #user_profile .block .content_counts a .counter { color: var(--u-ink); font-weight: 500; }

/* Анкета: заголовок раздела — плашка, а не тонкая линия с серым текстом */
#body #user_profile #information .fieldset_title {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 4px 0 14px;
    border: 0;
    overflow: visible;
}
#body #user_profile #information .fieldset_title::after { content: ""; flex: 1 1 auto; height: 1px; background: var(--u-line); }
#body #user_profile #information .fieldset_title h3 {
    float: none;
    margin: 0;
    padding: 4px 14px;
    border-radius: 999px;
    background: var(--u-accent);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .02em;
}
#body #user_profile #information .fieldset_title:first-child { margin-top: 0; }
#body #user_profile #information .fieldset .field { margin: 0 0 8px; }
#body #user_profile #information .fieldset .field .title { color: var(--u-muted); font-weight: 500; }
#body #user_profile #information .fieldset .field .value { color: var(--u-body); }

#body #users_karma_log_list .date { color: var(--u-muted); }
#body #users_karma_log_list .positive { border-color: #22c55e; }
#body #users_karma_log_list .negative { border-color: #ef4444; }

/* Вход и регистрация ======================================================= */

#body article.ep_c_auth form { max-width: 560px; }

@media (max-width: 640px) {
    #user_profile_title { flex-wrap: wrap; }
    #user_profile_title .avatar { display: block; }
    #user_profile #left_column .block { margin-right: 0; }
    #body article.ep_ui .tabs-menu .tabbed li a { padding: 8px 10px; }
}

/* Загрузка файлов и счётчик символов в формах */
#body article.ep_ui .qq-upload-button {
    height: 38px;
    padding: 0 18px;
    border: 1px solid var(--u-field-line);
    border-radius: 8px;
    background: var(--u-soft-2);
    color: var(--u-body);
    font-weight: 500;
    line-height: 36px;
    box-sizing: border-box;
}
#body article.ep_ui .qq-upload-button:hover,
#body article.ep_ui .qq-upload-button-hover { background: var(--u-accent); border-color: var(--u-accent); color: #fff; }
#body article.ep_ui .symbols_count { color: var(--u-muted); font-size: 12px; }
#body article.ep_ui .symbols_num { padding: 1px 7px; border-radius: 999px; background: var(--u-soft-2); color: var(--u-body); }
#body article.ep_ui .widget_image_single .block,
#body article.ep_ui .widget_image_single .preview { border-color: var(--u-line); background: var(--u-soft); }
#body article.ep_ui .qq-upload-button { text-shadow: none; }

/* Вкладки профиля ========================================================== */

/* Точка «онлайн/не в сети» у аватаров: обводка в цвет панели, а не белая */
#body article.ep_ui .peer_online:after,
#body article.ep_ui .peer_no_online:after { border-color: var(--ep-bg-2); }
#body article.ep_ui .peer_no_online:after { background-color: #64748b; }
#body article.ep_ui .peer_online:after { background-color: #22c55e; }

/* Заглушка аватара (светло-серый силуэт) на тёмной панели — приглушённая */
#body article.ep_ui img[src*="/default/avatar"] { filter: brightness(.42) saturate(.6); }
:root[data-theme="light"] #body article.ep_ui img[src*="/default/avatar"] { filter: none; }

/* Лента: таймлайн — линия слева, дни — плашки, события — карточки */
#body article.ep_ui .activity-list { padding-left: 26px; }
#body article.ep_ui .activity-list::before { left: 7px; z-index: 0; background: var(--u-line); }
#body article.ep_ui .activity-list h3 {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 18px 0 10px -26px;
    padding: 4px 14px 4px 6px;
    border-radius: 999px;
    background: var(--u-soft-2);
    color: var(--u-ink);
    font-size: 13px;
    font-weight: 700;
}
#body article.ep_ui .activity-list h3:first-child { margin-top: 0; }
#body article.ep_ui .activity-list h3 .octicon { margin: 0; padding: 2px; border-radius: 50%; background: var(--u-accent); color: #fff; }
#body article.ep_ui .activity-list .item {
    position: relative;
    margin: 0 0 8px;
    padding: 12px 14px;
    border: 1px solid var(--u-line);
    border-radius: 12px;
    background: var(--u-soft);
    align-items: flex-start;
}
#body article.ep_ui .activity-list .item::before {
    content: "";
    position: absolute;
    top: 22px;
    left: -24px;
    width: 8px;
    height: 8px;
    border: 2px solid var(--ep-bg-2);
    border-radius: 50%;
    background: var(--ep-sky);
}
#body article.ep_ui .activity-list .item:hover { background: var(--u-soft-2); }
#body article.ep_ui .activity-list .item .icon img { border-radius: 50%; }
#body article.ep_ui .activity-list .item .title-multiline { flex: 1 1 auto; min-width: 0; color: var(--u-body); line-height: 1.5; }
#body article.ep_ui .activity-list .item a.author { color: var(--u-ink); font-weight: 700; }
#body article.ep_ui .activity-list .item a.author:hover { color: var(--ep-sky); }
#body article.ep_ui .activity-list .item .details { margin-top: 2px; font-size: 12px; }
#body article.ep_ui .activity-list .item .details .date { color: var(--u-muted); }
#body article.ep_ui .activity-list .item .details .reply a { color: var(--u-link); }
#body article.ep_ui .activity-list .item .images .image img { border-radius: 8px; }

/* Баланс */
#body article.ep_ui .balance-info { margin-bottom: 12px; }
#body article.ep_ui .balance-info h3 {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    height: auto;
    margin: 0;
    padding: 12px 18px;
    border: 1px solid var(--u-line);
    border-radius: 12px;
    background: var(--u-soft);
    color: var(--u-muted);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
}
#body article.ep_ui .balance-info h3 span { margin: 0; color: var(--u-ink); font-size: 20px; font-weight: 700; }
#body article.ep_ui .balance-info.balance h3 span { padding-left: 24px; background-size: 16px; }
#body article.ep_ui .balance-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; }
#body article.ep_ui .balance-actions a {
    margin: 0;
    padding: 7px 14px 7px 34px;
    border-radius: 8px;
    background-color: var(--u-soft-2);
    background-position: 12px center;
    color: var(--u-body);
    font-size: 13px;
    text-decoration: none;
}
#body article.ep_ui .balance-actions a:hover { background-color: var(--u-line); color: var(--u-ink); }
#body article.ep_ui .billing-history h3,
#body article.ep_ui .billing-history h4 { margin: 0 0 10px; font-size: 16px; }
#body article.ep_ui table.billing-log { width: 100%; border-collapse: separate; border-spacing: 0 4px; }
#body article.ep_ui table.billing-log thead td { padding: 4px 12px; color: var(--u-muted); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
#body article.ep_ui table.billing-log tbody td { padding: 10px 12px; border: 0; background: var(--u-soft); color: var(--u-body); }
#body article.ep_ui table.billing-log tbody td:first-child { border-radius: 8px 0 0 8px; }
#body article.ep_ui table.billing-log tbody td:last-child { border-radius: 0 8px 8px 0; }
#body article.ep_ui .striped-list .item > div { float: none; margin-right: 0; }
#body article.ep_ui .striped-list .item > .actions { margin-left: auto; }
#body article.ep_ui .activity-list .item .images { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
#body article.ep_ui .activity-list .item .images .image { float: none; margin: 0; max-width: 160px; border-radius: 8px; }
#body article.ep_ui .activity-list .item .images .image img { max-height: 160px; object-fit: cover; }
#body article.ep_ui .activity-list .item .images .image.more { background: var(--u-soft-2); }

/* «Ещё» во вкладках: выпадающий список, а не пилюли */
#body article.ep_ui .tabs-menu li.folder { position: relative; }
#body article.ep_ui .tabs-menu li.folder > ul {
    top: 100%;
    left: 0;
    min-width: 180px;
    margin: 6px 0 0;
    padding: 6px;
    border: 1px solid var(--u-line);
    border-radius: 10px;
    background: var(--ep-bg-2);
    box-shadow: var(--ep-shadow);
}
#body article.ep_ui .tabs-menu li.folder > ul::before { content: ""; position: absolute; top: -8px; left: 0; right: 0; height: 8px; }
#body article.ep_ui .tabs-menu li.folder > ul li a {
    padding: 8px 12px;
    border: 0;
    border-radius: 6px;
    background: none;
    white-space: nowrap;
}
#body article.ep_ui .tabs-menu li.folder > ul li a span { padding: 0; }
#body article.ep_ui .tabs-menu li.folder > ul li a:hover { background: var(--u-soft-2); color: var(--u-ink); }
#body article.ep_ui .striped-list .item > .actions { order: 9; }
#body article.ep_ui .activity-list .item .title-multiline { padding-left: 0; }
#body article.ep_ui .activity-list .item .actions .delete { opacity: .5; }
#body article.ep_ui .activity-list .item:hover .actions .delete { opacity: 1; }