/* v139 modular CSS. Shared rules stay in style.css; page-specific rules are loaded conditionally. */
/* ===== Local Inter webfont =====
   Font binaries are installed once on the server by tools/install_inter_font.sh.
   Runtime page loads stay fully local: no Google Fonts, CDN or third-party font requests. */
@font-face{font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../fonts/inter/InterVariable.woff2") format("woff2");}
@font-face{font-family: "Inter";
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url("../fonts/inter/InterVariable-Italic.woff2") format("woff2");}
:root{--bg: var(--bg-primary);
    /* Pixel-matched dark UI */
    --bg-primary: #131a24;
    --bg-secondary: #141b25;
    --bg-tertiary: #1a2130;
    --text-primary: #ffffff;
    --text-secondary: #b0b0b0;
    --text-muted: #808080;
    --border-color: #22375c;
    /* More blue (single tone) for active state */
    --accent-blue: #4483e2;
    --accent-blue-hover: #3b74c9;
    --accent-green: #4483e2;
    --accent-yellow: #ffc107;
    --sidebar-width: 330px;
    --top-bar-height: 64px;
    /* Centered app layout like on the reference screenshot */
    --layout-max: 1400px;
    --layout-padding: 56px;
    --radius: 8px;

    /* Unified interaction tokens */
    --ease: cubic-bezier(.2,.8,.2,1);
    --t-fast: 140ms;
    --t-med: 220ms;
    --focus-ring: 0 0 0 3px rgba(68, 131, 226, 0.35);

    /* Project-wide scrollbar palette */
    --scrollbar-track: #131a24;
    --scrollbar-thumb: #22375c;
    --scrollbar-thumb-hover: #2d4b7d;
    --scrollbar-thumb-active: #365e9e;
    --shadow-sm: 0 8px 18px rgba(0,0,0,0.28);
    --shadow-md: 0 18px 50px rgba(0,0,0,0.45);}
/*
  Native form controls (select / date etc.) in dark UI.
  Some browsers ignore <option> styling unless color-scheme is set.
*/
html{color-scheme: dark;}
*{margin: 0;
    padding: 0;
    box-sizing: border-box;}
/* ===== Project-wide scrollbar =====
   One consistent scrollbar for the page, sidebar, modals, dropdowns and
   every other scrollable container. Firefox uses scrollbar-*; Chromium,
   Edge and Safari use the ::-webkit-scrollbar pseudo-elements below. */
html,
*{scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);}
*::-webkit-scrollbar{width: 10px;
    height: 10px;}
*::-webkit-scrollbar-track{background: var(--scrollbar-track);}
*::-webkit-scrollbar-thumb{background: var(--scrollbar-thumb);
    border: 2px solid var(--scrollbar-track);
    border-radius: 6px;
    background-clip: padding-box;}
*::-webkit-scrollbar-thumb:hover{background: var(--scrollbar-thumb-hover);
    border: 2px solid var(--scrollbar-track);
    background-clip: padding-box;}
*::-webkit-scrollbar-thumb:active{background: var(--scrollbar-thumb-active);
    border: 2px solid var(--scrollbar-track);
    background-clip: padding-box;}
*::-webkit-scrollbar-corner{background: var(--scrollbar-track);}
body{font-family: "Inter", sans-serif;
    background-color: var(--bg);
    color: var(--text-primary);
    line-height: 1.6;
    overflow-x: hidden;}
/* ===== Unified interactions (buttons, links, controls) ===== */
button,
input,
select,
textarea{font-family: inherit;}
a,
button,
[role="button"],
input,
select,
textarea{-webkit-tap-highlight-color: transparent;}
:where(a, button, [role="button"], input, select, textarea):focus-visible{outline: none;
    box-shadow: var(--focus-ring);}
:where(a, button, [role="button"]){transition: background-color var(--t-med) var(--ease),
                border-color var(--t-med) var(--ease),
                color var(--t-med) var(--ease),
                box-shadow var(--t-med) var(--ease),
                transform var(--t-fast) var(--ease),
                filter var(--t-med) var(--ease);}
:where(input, select, textarea){transition: background-color var(--t-med) var(--ease),
                border-color var(--t-med) var(--ease),
                box-shadow var(--t-med) var(--ease);}
/* Consistent disabled state */
:where(button, .btn-primary, .btn-secondary, .btn-danger, .btn-success):disabled,
:where(button, .btn-primary, .btn-secondary, .btn-danger, .btn-success)[aria-disabled="true"]{opacity: 0.6;
    cursor: not-allowed;
    filter: grayscale(0.1);}
/* Верхняя панель */
.top-bar{position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--top-bar-height);
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
    z-index: 200;}
.top-bar-content{display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
    /* Align the brand with the left edge of the desktop sidebar while keeping
       the whole header centered with the main layout. */
    max-width: var(--layout-max);
    margin: 0 auto;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: var(--layout-padding);}
.logo-top{display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0.5px;
    color: var(--text-primary);
    text-transform: uppercase;
    line-height: 1;}
.logo-top__mark{width: 38px;
    height: 38px;
    object-fit: contain;
    display: block;
    flex: 0 0 auto;
    filter: brightness(0) invert(1);}
.logo-top__text{display: inline-block;
    line-height: 1;}
.user-profile{position: relative;
    display: flex;
    align-items: center;
    gap: 10px;}
.user-profile-trigger{display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
    transition: background-color 0.2s ease;}
.user-profile-trigger:hover{background-color: var(--bg-tertiary);}
.user-avatar{width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent-blue), var(--accent-green));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 12px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.12);}
.user-avatar img{width:100%;
    height:100%;
    object-fit:cover;
    display:block;}
.user-name{font-size: 14px;
    color: var(--text-primary);}
.role-pill{display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.10);
    color: var(--text-primary);
    font-size: 12px;
    font-weight: 600;
    line-height: 24px;
    white-space: nowrap;}
.role-pill--removable{position: relative;
    padding-right: 30px;}
.role-pill__text{display: inline-block;
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;}
.role-pill__remove{position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.18);
    background: rgba(0,0,0,0.18);
    color: var(--text-primary);
    font-size: 14px;
    line-height: 16px;
    padding: 0;
    cursor: pointer;}
.role-pill__remove:hover{background: rgba(0,0,0,0.30);}
.admin-chip{display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.10);
    font-size: 12px;
    font-weight: 600;}
.admin-chip-remove{width: 18px;
    height: 18px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.18);
    background: rgba(0,0,0,0.18);
    color: var(--text-primary);
    font-size: 14px;
    line-height: 16px;
    padding: 0;
    cursor: pointer;}
.admin-chip-remove:hover{background: rgba(0,0,0,0.30);}
/* Top-bar roles: primary role + "+N" with tooltip */
.topbar-roles{display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: 8px;}
.role-pill--topbar{height: 22px;
    line-height: 22px;
    padding: 0 10px;
    font-size: 12px;}
.role-pill--more{position: relative;
    cursor: default;
    user-select: none;}
.topbar-roles-popover{display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 180px;
    max-width: 260px;
    background: var(--bg-secondary);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 12px;
    padding: 10px;
    box-shadow: 0 18px 50px rgba(0,0,0,0.45);
    z-index: 1000;}
.role-pill--more:hover .topbar-roles-popover,
.role-pill--more:focus .topbar-roles-popover{display: block;}
.topbar-role-item{display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 8px;
    border-radius: 10px;}
.topbar-role-item:hover{background: rgba(255,255,255,0.06);}
.topbar-role-dot{width: 10px;
    height: 10px;
    border-radius: 999px;
    background: var(--role-color, rgba(255,255,255,0.25));
    box-shadow: 0 0 0 3px rgba(255,255,255,0.05);}
.topbar-role-name{font-size: 12px;
    color: var(--text-primary);
    line-height: 1.2;}
.dropdown-arrow{display: none;}
.user-profile.active .dropdown-arrow{transform: rotate(180deg);}
/* Выпадающее меню пользователя */
.user-dropdown-menu{display: none;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 240px;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    z-index: 300;
    overflow: hidden;
    animation: dropdownFadeIn 0.2s ease;}
.user-profile.active .user-dropdown-menu{display: block;}
@keyframes dropdownFadeIn{from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }}
.dropdown-header{padding: 16px;
    background-color: var(--bg-tertiary);}
.dropdown-user-info{display: flex;
    align-items: center;
    gap: 12px;}
.dropdown-avatar{width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: var(--accent-blue);
    border: 2px solid var(--border-color);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 800;
    color: #ffffff;
    text-transform: uppercase;}
.dropdown-avatar img{width:100%;
    height:100%;
    object-fit:cover;
    display:block;}
.dropdown-user-name{font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 2px;}
.dropdown-user-email{font-size: 12px;
    color: var(--text-secondary);}
.dropdown-divider{height: 1px;
    background-color: var(--border-color);
    margin: 4px 0;}
.dropdown-item{display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    color: var(--text-primary);
    text-decoration: none;
    font-size: 14px;
    transition: background-color 0.2s ease;
    cursor: pointer;
    border: none;
    background: none;
    width: 100%;
    text-align: left;}
.dropdown-item:hover{background-color: var(--bg-tertiary);}
.dropdown-item svg{flex-shrink: 0;
    width: 16px;
    height: 16px;
    color: var(--text-secondary);}
.dropdown-item:hover svg{color: var(--text-primary);}
.dropdown-item-danger{color: #ff6b6b;}
.dropdown-item-danger:hover{background-color: rgba(255, 107, 107, 0.1);
    color: #ff5252;}
.btn-apply-top{padding: 8px 16px;
    background-color: var(--accent-blue);
    color: var(--text-primary);
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;}
.btn-apply-top:hover{background-color: var(--accent-blue-hover);}
/* Основной контейнер */
.main-wrapper{display: flex;
    justify-content: center;
    margin-top: var(--top-bar-height);
    min-height: calc(100vh - var(--top-bar-height));}
/* Centers sidebar + content block as a single unit */
.layout-container{width: 100%;
    max-width: var(--layout-max);
    display: flex;}
/* Боковая панель */
.sidebar{width: var(--sidebar-width);
    background-color: var(--bg-primary);
    border-right: none;
    position: sticky;
    top: var(--top-bar-height);
    height: calc(100vh - var(--top-bar-height));
    /* Modern browsers: avoid visual clipping caused by dynamic browser UI */
    height: calc(100dvh - var(--top-bar-height));
    /* Скролл нужен именно меню, а не всей панели (иначе на некоторых экранах тянет блоки) */
    overflow: hidden;
    z-index: 100;

    /* Important: the sidebar is a flex column so the scroll area (sidebar-nav)
       fits exactly into the available height without being clipped by padding. */
    display: flex;
    flex-direction: column;}
/* Decorative fades were perceived as "clipping" on long menus (notably on the Apply page). */
.sidebar::before,
.sidebar::after{display: none;}
/* Soft edge fade so the menu doesn't look like it "cuts off" */
.sidebar::after{content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 42px;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(0,0,0,0), var(--bg-primary));}
.sidebar::before{content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 22px;
    pointer-events: none;
    background: linear-gradient(to top, rgba(0,0,0,0), var(--bg-primary));}
.sidebar-nav{padding: 18px 0;
    /* Take remaining sidebar height (prevents bottom clipping on some screens) */
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    /* extra breathing room so last items don't sit under the fade */
    padding-bottom: 64px;}
.nav-section{margin-bottom: 28px;}
.nav-section-header{display:flex;
    align-items:center;
    justify-content: space-between;
    padding: 0 20px;
    margin-bottom: 12px;}
.nav-section-title{font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.9px;
    color: var(--text-secondary);
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 6px;}
.nav-list{list-style: none;
    padding: 0;
    margin: 0;}
.nav-item{margin-bottom: 2px;}
.nav-link{display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    margin: 0 18px;
    border-radius: var(--radius);
    color: var(--text-primary);
    text-decoration: none;
    font-size: 14px;
    transition: background-color 0.2s ease;
    position: relative;
    width: calc(100% - 36px); /* full row minus horizontal margins */
    box-sizing: border-box;

    /* Prevent horizontal scrolling in sidebar due to long titles */
    overflow-wrap: anywhere;
    word-break: break-word;}
/* Keep folder chevrons aligned to the right edge consistently */
.nav-link .folder-toggle{margin-left: auto;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;}
/* Title area takes remaining space and can wrap */
.nav-link span:not(.nav-ico):not(.folder-toggle){min-width: 0;
    flex: 1 1 auto;
    white-space: normal;}
/* Recent pages */
.nav-recent-dot{width: 6px;
    height: 6px;
    border-radius: 999px;
    background: var(--accent-blue, #2d5bff);
    display: inline-block;
    flex: 0 0 6px;
    opacity: 0.9;}
.nav-recent-title{min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;}
.nav-link:hover{background-color: var(--bg-tertiary);}
.nav-link.active{background-color: var(--accent-blue);
    color: var(--text-primary);}
.nav-link--apply span:last-child{text-transform: uppercase;
    letter-spacing: .055em;
    font-weight: 750;
    font-size: 12px;}
.nav-link--apply .nav-ico--apply{color:#9cc3ff;}
.nav-link--apply{border:1px solid rgba(68,131,226,.52);
    background:linear-gradient(90deg,rgba(68,131,226,.22),rgba(68,131,226,.10));
    box-shadow:0 8px 24px rgba(32,86,166,.14);}
.nav-link--apply:hover{border-color:rgba(106,166,255,.78);
    background:linear-gradient(90deg,rgba(68,131,226,.30),rgba(68,131,226,.14));
    box-shadow:0 10px 28px rgba(32,86,166,.20);}
.nav-link--apply.active{border-color:#6ba6ff;
    background:#22375c !important;
    box-shadow:0 10px 30px rgba(32,86,166,.22);}
/* Nav icon: fixed column to prevent "crazy" left offsets */
.nav-ico{flex: 0 0 20px;
    width: 20px;
    min-width: 20px;
    max-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    box-sizing: border-box;
    flex-shrink: 0;}
.nav-ico--apply,
.nav-ico--square{flex: 0 0 20px;
    width: 20px;
    min-width: 20px;
    max-width: 20px;
    height: 20px;
    padding: 0;}
.nav-ico svg,
.nav-ico img{width: 16px;
    height: 16px;
    display: block;}
/* Page icons in navigation (DB value can be Font Awesome class or svg:<id>) */
.nav-page-icon,
.nav-page-icon-svg{flex: 0 0 20px;
    width: 20px;
    min-width: 20px;
    max-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    opacity: 0.9;
    font-size: 14px;}
.nav-page-icon-svg{color: currentColor;}
.nav-page-icon-svg svg{width: 16px;
    height: 16px;
    display: block;}
/* v2026-08-27.66 — default document icon uses Lucide FileText. */
.page-icon.lucide-file-text{flex:0 0 20px;
    width:16px;
    min-width:16px;
    height:16px;
    margin-right:14px;
    display:block;
    color:currentColor;
    opacity:.9;}
/* Folder view (list of pages) */
.pages-list{display: flex;
    flex-direction: column;
    gap: 8px;}
/* Admin Groups: page access picker (readable, grouped by categories) */
/* Categories go vertically (not columns). Pages inside a topic are in a 2-column grid. */
.group-pages-grid{display: flex;
    flex-direction: column;
    gap: 12px;}
.group-cat-card{border: 1px solid var(--border-color);
    border-radius: 12px;
    background: rgba(255,255,255,0.02);
    padding: 10px;}
.group-cat-title{font-weight: 700;
    font-size: 14px;
    color: var(--text-primary);
    margin-bottom: 8px;}
.group-topic-block{margin-bottom: 10px;}
.group-topic-block:last-child{margin-bottom: 0;}
.group-topic-title{font-size: 13px;
    color: var(--text-secondary);
    margin: 6px 0 6px 0;
    padding-left: 2px;}
.group-topic-pages{display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;}
@media (max-width: 860px){
.group-topic-pages{grid-template-columns: 1fr;}
}
.group-page-item{display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid var(--border-color);
    background: rgba(255,255,255,0.01);
    cursor: pointer;
    user-select: none;}
.group-page-item:hover{background: rgba(255,255,255,0.04);}
.group-page-item input[type="checkbox"]{transform: translateY(1px);}
.group-page-title{min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;}
.pages-list-item{display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: transparent;
    color: var(--text);
    text-decoration: none;}
.pages-list-item:hover{background: var(--bg-secondary);}
.pages-list-meta{margin-bottom: 10px;
    color: var(--text-muted);
    font-size: 13px;}
.pages-list-item .pages-list-title{flex: 1;}
.pages-list-item .pages-list-arrow{opacity: 0.65;}
.nav-ico--square svg{opacity: 0.95;}
.nav-link svg:first-child{flex-shrink: 0;
    width: 16px;
    height: 16px;}
.nav-link .category-icon{flex-shrink: 0;
    width: 16px;
    min-width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    opacity: 0.95;}
.nav-link--level3 .category-icon{margin-right: 8px;}
.nav-link span:not(.nav-ico){flex: 0 0 auto;
    min-width: 0;}
.nav-item-expandable .expand-icon{margin-left: auto;
    width: 12px;
    height: 12px;}
/* Folder (topic) collapsing */
.nav-item-expandable .folder-toggle{margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 6px;
    color: var(--text-secondary);}
.nav-item-expandable .folder-toggle:hover{background: rgba(255,255,255,0.06);
    color: var(--text-primary);}
.nav-item.folder-collapsed > .nav-sublist{display: none;}
.nav-item.folder-collapsed .expand-icon{transform: rotate(-90deg);}
.nav-item-expandable .expand-icon{transition: transform 0.16s ease;}
/* nesting paddings for pages inside folders */
.nav-link--level2{padding-left: 48px; color: var(--text-secondary); font-size: 13px;}
.nav-link--level2:hover{color: var(--text-primary);}
.nav-link--level3{padding-left: 64px; color: var(--text-secondary); font-size: 13px;}
.nav-link--level3:hover{color: var(--text-primary);}
.nav-sublist{list-style: none;
    padding-left: 20px;
    margin-top: 4px;}
.nav-sublist .nav-link{padding-left: 48px;
    color: var(--text-secondary);
    font-size: 13px;}
.nav-sublist .nav-link:hover{color: var(--text-primary);}
/* Active nested page: keep the selected item dark blue and its title white. */
.nav-link--level2.active,
.nav-sublist .nav-link--level2.active{background-color: #22375c;
    color: var(--text-primary);}
.nav-link--level2.active span,
.nav-sublist .nav-link--level2.active span{color: inherit;}
/* Основной контент */
.main-content{flex: 1;
    margin-left: 0;
    background-color: var(--bg-primary);
    min-height: calc(100vh - var(--top-bar-height));
    padding: 48px 56px;}
.content-page{max-width: 980px;
    width: 100%;
    margin: 16px auto 24px;
    padding: 18px;
    background: var(--bg-primary); /* same color as the application background */
    border: none;
    border-radius: 0; /* no card look */
    box-shadow: none;
    overflow-wrap: anywhere;}
/* Limit readable text width like on the reference screenshot */
.content-section{max-width: 760px;}
.page-header{margin-bottom: 40px;}
.page-title{font-size: 32px;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--text-primary);}
.page-title-large{font-size: 32px;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--text-primary);
    line-height: 1.2;}
.page-meta{margin-top: 8px;
    font-size: 12px;
    color: var(--text-muted);
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;}
.page-meta strong{color: var(--text-primary); font-weight: 600;}
.page-author-link{color:inherit; text-decoration:none; border-radius:4px;}
.page-author-link:hover strong{text-decoration:underline;}
.page-author-link:focus-visible{outline:2px solid #22375c; outline-offset:2px;}
.page-meta-sep{opacity: 0.55;}
.page-footer-meta{display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--border-color);
    color: var(--text-muted);
    font-size: 13px;}
.page-footer-meta strong{color: var(--text-primary); font-weight: 600;}
.page-breadcrumb{display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    color: var(--text-primary);
    font-weight: 500;}
/* Breadcrumbs (иерархия) */
.breadcrumbs{display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    font-size: 13px;
    color: var(--text-muted);
    margin-bottom: 6px;}
.breadcrumbs__link{color: var(--accent-blue);
    text-decoration: none;
    font-weight: 600;
    letter-spacing: 0.2px;}
.breadcrumbs__link:hover{text-decoration: underline;}
.breadcrumbs__sep{opacity: 0.6;}
.breadcrumbs__current{color: var(--text-primary);
    font-weight: 600;}
/* Кнопка "Назад" внизу страницы */
.page-backbar{margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid var(--border-color);
    display:flex;
    justify-content:flex-start;}
.page-backbar .btn-secondary{display:inline-flex;
    align-items:center;
    gap:8px;}
.page-breadcrumb h1{margin: 0;}
.page-breadcrumb svg{width: 16px;
    height: 16px;}
/* Breadcrumbs: используем .breadcrumbs */
.content-section{margin-bottom: 40px;}
.content-section h2{font-size: 36px;
    font-weight: 700;
    margin-bottom: 20px;
    color: var(--text-primary);}
.content-section p{font-size: 16px;
    line-height: 1.65;
    color: var(--text-primary);
    margin-bottom: 16px;}
.concept-list{list-style: none;
    padding-left: 0;
    margin-top: 20px;}
.concept-list li{font-size: 16px;
    line-height: 1.8;
    color: var(--text-primary);
    margin-bottom: 16px;
    padding-left: 24px;
    position: relative;}
.concept-list li::before{content: "•";
    position: absolute;
    left: 0;
    color: var(--text-primary);
    font-size: 20px;}
.concept-list strong{font-weight: 600;}
/* Сетка фич */
.features-grid{display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 48px;}
.feature-card{background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 24px;}
.feature-icon{width: 48px;
    height: 48px;
    margin-bottom: 16px;
    color: var(--accent-blue);}
.feature-card h3{font-size: 20px;
    font-weight: 600;
    margin-bottom: 12px;
    color: var(--text-primary);}
.feature-card p{font-size: 14px;
    line-height: 1.6;
    color: var(--text-secondary);}
/* Шаги */
.steps-section{margin-bottom: 48px;}
.steps-section h2{font-size: 28px;
    font-weight: 600;
    margin-bottom: 24px;
    color: var(--text-primary);}
.steps-list{list-style: none;
    counter-reset: step-counter;
    padding-left: 0;}
.steps-list li{counter-increment: step-counter;
    margin-bottom: 24px;
    padding-left: 48px;
    position: relative;}
.steps-list li::before{content: counter(step-counter);
    position: absolute;
    left: 0;
    top: 0;
    width: 32px;
    height: 32px;
    background-color: var(--accent-blue);
    color: var(--text-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 16px;}
.steps-list strong{display: block;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 8px;
    color: var(--text-primary);}
.steps-list p{font-size: 14px;
    line-height: 1.6;
    color: var(--text-secondary);}
/* Форма заявки */
.btn-submit-apply{width: 100%;
    padding: 16px;
    background-color: var(--accent-green);
    color: var(--text-primary);
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
    margin-top: 8px;}
.btn-submit-apply:hover{background-color: #45a049;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(76, 175, 80, 0.3);}
.btn-submit-apply svg{width: 20px;
    height: 20px;}
/* Модальные окна */
.modal{display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 1000;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(4px);}
.modal.active{display: flex;}
.modal-content{background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 32px;
    width: 90%;
    max-width: 420px;
    position: relative;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
    animation: modalSlideIn 0.3s ease;}
/* === Profile edit modal (upload + crop) === */
#profileEditModalContent.modal-content-wide{max-width: 860px;}
/* Visually consistent layout: banner full width, avatar left, bio right */
/* Profile edit (v2): banner full width; avatar left; actions right; about below avatar */
.sr-only{position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;}
.modal-actions--sticky{margin-top: 10px;
    display:flex;
    justify-content:flex-end;}
@media (max-width: 840px){
#profileEditModalContent.modal-content-wide{max-width: 520px;}
}
/* Admin member info card */
.info-card{border: 1px solid var(--border-color);
    background: var(--bg-secondary);
    border-radius: 10px;
    padding: 12px;}
.info-card__title{font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 10px;}
.info-grid{display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;}
.info-item{padding: 10px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: var(--bg-tertiary);}
.info-label{font-size: 12px;
    color: var(--text-muted);}
.info-value{font-weight: 600;
    margin-top: 4px;
    word-break: break-word;}
.activity-list{border: 1px solid var(--border-color);
    border-radius: 10px;
    background: var(--bg-tertiary);
    max-height: 160px;
    overflow:auto;
    padding: 8px;}
.activity-row{display:flex;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 6px;
    border-bottom: 1px solid var(--border-color);
    font-size: 13px;}
.activity-row:last-child{border-bottom:none;}
.activity-path{flex: 1;
    overflow:hidden;
    text-overflow: ellipsis;
    white-space: nowrap;}
.activity-time{color: var(--text-muted);
    white-space: nowrap;}
@media (max-width: 640px){
.info-grid{grid-template-columns: 1fr;}
}
@keyframes modalSlideIn{from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }}
.modal-close{position: absolute;
    top: 16px;
    right: 16px;
    background: none;
    border: none;
    font-size: 28px;
    color: var(--text-secondary);
    cursor: pointer;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    transition: all 0.2s ease;}
.modal-close:hover{background-color: var(--bg-tertiary);
    color: var(--text-primary);}
.modal-content h2{font-size: 24px;
    font-weight: 600;
    margin-bottom: 24px;
    color: var(--text-primary);}
/* Two-column layouts inside specific admin modals (folder/group editors) */
.modal-form-2col{display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin-bottom: 18px;}
.modal-card{border: 1px solid var(--border-color);
    border-radius: 12px;
    background: rgba(255,255,255,0.02);
    padding: 14px;}
/* Wide card inside 2-column modal grid (spans both columns) */
.modal-card-wide{grid-column: 1 / -1;}
/* ============================================
   PROFILE PAGE (refreshed)
   ============================================ */
.role-pill--add{min-height: 36px;
    padding: 0 14px;
    font-weight: 700;}
/* Inline checkbox label (keeps checkbox next to text) */
.inline-check{display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;}
/* Color picker + editable text value */
@media (max-width: 860px){
.modal-form-2col{grid-template-columns: 1fr;}
}
.form-group{margin-bottom: 20px;}
.form-group label{display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);}
.form-group input{width: 100%;
    padding: 12px 14px;
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: var(--text-primary);
    font-size: 14px;
    outline: none;
    transition: all 0.2s ease;}
.form-group input:focus{border-color: var(--accent-blue);
    background-color: var(--bg-primary);}
.form-group input::placeholder{color: var(--text-muted);}
.btn-submit{width: 100%;
    padding: 12px;
    background-color: var(--accent-blue);
    color: var(--text-primary);
    border: none;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-top: 8px;}
.btn-submit:hover{background-color: var(--accent-blue-hover);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(74, 158, 255, 0.3);}
.btn-submit:active{transform: translateY(0);}
.form-switch{text-align: center;
    margin-top: 20px;
    font-size: 14px;
    color: var(--text-secondary);}
.form-switch a{color: var(--accent-blue);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;}
.form-switch a:hover{color: var(--accent-blue-hover);
    text-decoration: underline;}
/* Уведомления */
.notification{position: fixed;
    top: auto;
    bottom: 20px;
    right: 20px;
    padding: 16px 24px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    z-index: 1001;
    animation: slideInRight 0.3s ease;
    max-width: 400px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);}
.notification-success{/* Informational / success toasts in MIRC are blue */
    background-color: var(--accent-blue);
    color: var(--text-primary);}
.notification-error{background-color: #f44336;
    color: var(--text-primary);}
@keyframes slideInRight{from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }}
/* Адаптивность */
@media (max-width: 768px){
.sidebar{position: fixed;
        left: 0;
        transform: translateX(-100%);
        transition: transform 0.3s ease;}
.sidebar.open{transform: translateX(0);}
.main-content{margin-left: 0;
        padding: 24px 20px;}
.features-grid{grid-template-columns: 1fr;}
.page-title-large{font-size: 32px;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--text-primary);
    line-height: 1.2;}
}
/* ============================================
   СТРАНИЦА УПРАВЛЕНИЯ КОНТЕНТОМ
   ============================================ */
.admin-pages-container{padding: 24px;}
.admin-pages-toolbar{margin-bottom: 24px;
    display: flex;
    gap: 12px;}
/* Unified button baseline */
.btn-primary{display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background-color: var(--accent-blue);
    color: var(--text-primary);
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;}
.btn-primary:hover{background-color: var(--accent-blue-hover);}
.btn-primary svg{width: 16px;
    height: 16px;}
.admin-pages-tree{background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 20px;
    min-height: 400px;}
/* Drag & drop for admin pages tree */
.tree-draggable-page{cursor: grab;}
.tree-draggable-page.tree-dragging{opacity: 0.6; cursor: grabbing;}
.tree-drop-topic.tree-drop-over{outline: 2px dashed var(--accent-blue);
    outline-offset: 2px;}
.tree-loading{text-align: center;
    padding: 40px;
    color: var(--text-secondary);}
.tree-item{margin-bottom: 8px;}
.tree-item-header{display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background-color: var(--bg-tertiary);
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;}
.tree-item-header:hover{background-color: var(--bg-primary);}
.tree-item-header.expanded{background-color: var(--bg-primary);}
.tree-item-icon{width: 20px;
    height: 20px;
    color: var(--text-secondary);
    transition: transform 0.2s ease;}
.tree-item-header.expanded .tree-item-icon{transform: rotate(90deg);}
.tree-item-name{flex: 1;
    font-weight: 500;
    color: var(--text-primary);}
.tree-item-actions{display: flex;
    gap: 4px;
    opacity: 0;
    transition: opacity 0.2s ease;}
.tree-item-header:hover .tree-item-actions{opacity: 1;}
.tree-btn{width: 28px;
    height: 28px;
    padding: 0;
    background: none;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-secondary);
    transition: all 0.2s ease;}
.tree-btn:hover{background-color: var(--bg-tertiary);
    color: var(--text-primary);}
.tree-btn svg{width: 14px;
    height: 14px;}
.tree-btn-danger:hover{background-color: rgba(255, 107, 107, 0.1);
    color: #ff6b6b;}
.tree-item-children{margin-left: 32px;
    margin-top: 8px;
    padding-left: 16px;
    border-left: 2px solid var(--border-color);}
.tree-item-protected{opacity: 0.7;}
.tree-item-protected .tree-item-name::after{content: " (защищено)";
    font-size: 12px;
    color: var(--text-muted);
    font-weight: normal;}
.modal-content-large{max-width: 1100px;
    width: 92vw;}
.tree-empty{text-align: center;
    padding: 40px;
    color: var(--text-secondary);}
.form-group textarea{width: 100%;
    padding: 12px 14px;
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: var(--text-primary);
    font-size: 14px;
    font-family: inherit;
    outline: none;
    transition: all 0.2s ease;
    resize: vertical;}
.form-group textarea:focus{border-color: var(--accent-blue);
    background-color: var(--bg-primary);}
.form-group select{width: 100%;
    padding: 12px 14px;
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: var(--text-primary);
    font-size: 14px;
    outline: none;
    transition: all 0.2s ease;
    cursor: pointer;}
.form-group select:focus{border-color: var(--accent-blue);
    background-color: var(--bg-primary);}
/* ============================================
   MARKDOWN РЕДАКТОР
   ============================================ */
.markdown-editor{border: 1px solid var(--border-color);
    border-radius: 6px;
    overflow: hidden;
    background-color: var(--bg-tertiary);}
.markdown-toolbar{display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px 12px;
    background-color: var(--bg-secondary);
    border-bottom: 1px solid var(--border-color);
    flex-wrap: wrap;}
.markdown-btn{padding: 6px 10px;
    background: none;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    color: var(--text-primary);
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s ease;}
.markdown-btn:hover{background-color: var(--bg-tertiary);
    border-color: var(--accent-blue);}
.markdown-tabs{margin-left: auto;
    display: flex;
    gap: 4px;}
.markdown-tab{padding: 6px 12px;
    background: none;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    color: var(--text-secondary);
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s ease;}
.markdown-tab.active{background-color: var(--accent-blue);
    color: var(--text-primary);
    border-color: var(--accent-blue);}
.markdown-tab:hover:not(.active){background-color: var(--bg-tertiary);
    color: var(--text-primary);}
.markdown-editor textarea{border: none;
    border-radius: 0;
    background-color: var(--bg-primary);
    font-family: inherit;
    resize: vertical;}
.markdown-preview{padding: 16px;
    min-height: 300px;
    background-color: var(--bg-primary);
    color: var(--text-primary);
    line-height: 1.6;
    overflow-y: auto;
    max-height: 500px;}
.markdown-preview h1,
.markdown-preview h2,
.markdown-preview h3,
.markdown-preview h4,
.markdown-preview h5,
.markdown-preview h6{margin-top: 24px;
    margin-bottom: 12px;
    font-weight: 600;
    color: var(--text-primary);}
.markdown-preview h1{font-size: 2em;}
.markdown-preview h2{font-size: 1.5em;}
.markdown-preview h3{font-size: 1.25em;}
.markdown-preview p{margin-bottom: 12px;}
.markdown-preview ul,
.markdown-preview ol{margin-bottom: 12px;
    padding-left: 24px;}
.markdown-preview li{margin-bottom: 4px;}
.markdown-preview code{background-color: var(--bg-tertiary);
    padding: 2px 6px;
    border-radius: 3px;
    font-family: inherit;
    font-size: 0.9em;}
.markdown-preview pre{background-color: var(--bg-tertiary);
    padding: 12px;
    border-radius: 6px;
    overflow-x: auto;
    margin-bottom: 12px;}
.markdown-preview pre code{background: none;
    padding: 0;}
.markdown-preview a{color: var(--accent-blue);
    text-decoration: none;}
.markdown-preview a:hover{text-decoration: underline;}
.markdown-preview img{max-width: 100%;
    height: auto;
    border-radius: 6px;
    margin: 12px 0;}
.markdown-preview blockquote{border-left: 4px solid var(--accent-blue);
    padding-left: 16px;
    margin: 12px 0;
    color: var(--text-secondary);
    font-style: italic;}
.markdown-preview table{width: 100%;
    border-collapse: collapse;
    margin: 12px 0;}
.markdown-preview table th,
.markdown-preview table td{padding: 8px 12px;
    border: 1px solid var(--border-color);
    text-align: left;}
.markdown-preview table th{background-color: var(--bg-tertiary);
    font-weight: 600;}
/* ============================================
   СТРАНИЦА УПРАВЛЕНИЯ УЧАСТНИКАМИ
   ============================================ */
.admin-members-container{padding: 24px;}
.admin-members-toolbar{display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    flex-wrap: wrap;}
.search-box{position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;}
.search-input{width: 100%;
    padding: 10px 40px 10px 14px;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: var(--text-primary);
    font-size: 14px;
    outline: none;
    transition: all 0.2s ease;}
.search-input:focus{border-color: var(--accent-blue);
    background-color: var(--bg-primary);}
.search-icon{position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-muted);
    pointer-events: none;}
.toolbar-actions{display: flex;
    gap: 8px;}
.btn-secondary{display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;}
.btn-secondary:hover{background-color: var(--bg-primary);
    border-color: var(--accent-blue);}
.btn-secondary svg{width: 16px;
    height: 16px;}
.members-table-container{background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;}
.members-table{width: 100%;
    border-collapse: collapse;
    table-layout: fixed;}
.members-table thead{background-color: var(--bg-tertiary);}
.members-table th{padding: 12px 16px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-secondary);
    border-bottom: 2px solid var(--border-color);}
.members-table td{padding: 12px 16px;
    border-bottom: 1px solid var(--border-color);
    color: var(--text-primary);
    font-size: 14px;}
.members-table tbody tr:hover{background-color: var(--bg-tertiary);}
.members-table tbody tr:last-child td{border-bottom: none;}
.member-name-cell{display: flex;
    align-items: center;
    gap: 10px;}
/* Роли (группы) в списке участников: слева от аватара */
.member-role-badges{display: flex;
    align-items: center;
    gap: 6px;
    margin-right: 2px;}
.role-badge{display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 12px;
    line-height: 24px;
    font-weight: 600;
    color: var(--text-primary);
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.18);
    white-space: nowrap;}
.role-badge--more{color: var(--text-muted);
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.12);}
.member-avatar-small{width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent-blue), var(--accent-green));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 12px;
    font-weight: 600;
    flex-shrink: 0;}
.table-actions{display: flex;
    gap: 4px;}
.btn-icon{width: 32px;
    height: 32px;
    padding: 0;
    background: none;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-secondary);
    transition: all 0.2s ease;}
.btn-icon:hover{background-color: var(--bg-tertiary);
    color: var(--text-primary);}
.btn-icon svg{width: 16px;
    height: 16px;}
.btn-icon-danger:hover{background-color: rgba(255, 107, 107, 0.1);
    color: #ff6b6b;}
.pagination{display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 24px;
    flex-wrap: wrap;}
.pagination-btn{min-width: 36px;
    height: 36px;
    padding: 0 12px;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: var(--text-primary);
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;}
.pagination-btn:hover:not(:disabled){background-color: var(--bg-tertiary);
    border-color: var(--accent-blue);}
.pagination-btn.active{background-color: var(--accent-blue);
    border-color: var(--accent-blue);
    color: white;}
.pagination-btn:disabled{opacity: 0.5;
    cursor: not-allowed;}
.pagination-dots{padding: 0 8px;
    color: var(--text-muted);}
.modal-actions{display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 24px;}
.btn-danger{padding: 10px 20px;
    background-color: #f44336;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;}
.btn-danger:hover{background-color: #d32f2f;}
/* ============================================
   СТРАНИЦА ПАНЕЛИ АДМИНИСТРАТОРА
   ============================================ */
.admin-panel-container{padding: 24px;}
.admin-panel-toolbar{display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    flex-wrap: wrap;}
.status-filters{display: flex;
    gap: 8px;
    flex-wrap: wrap;}
.filter-btn{padding: 8px 16px;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: var(--text-primary);
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;}
.filter-btn:hover{background-color: var(--bg-tertiary);
    border-color: var(--accent-blue);}
.filter-btn.active{background-color: var(--accent-blue);
    border-color: var(--accent-blue);
    color: white;}
.applications-list{display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 16px;}
.application-card{background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 20px;
    cursor: pointer;
    transition: all 0.2s ease;}
.application-card:hover{border-color: var(--accent-blue);
    box-shadow: 0 4px 12px rgba(74, 158, 255, 0.1);
    transform: translateY(-2px);}
.application-card-header{display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;}
.application-card-user{display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;}
.application-card-avatar{width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent-blue), var(--accent-green));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 14px;
    font-weight: 600;
    flex-shrink: 0;}
.application-card-name{font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 2px;}
.application-card-id{display: inline-block;
    margin-left: 8px;
    font-size: 12px;
    font-weight: 500;
    color: var(--text-secondary);}
.application-card-email{font-size: 12px;
    color: var(--text-secondary);}
.application-card-status{flex-shrink: 0;}
.status-badge{padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;}
.status-badge.status-pending{background-color: rgba(255, 193, 7, 0.2);
    color: #ffc107;}
.status-badge.status-reviewed{background-color: rgba(74, 158, 255, 0.2);
    color: var(--accent-blue);}
.status-badge.status-accepted{background-color: rgba(76, 175, 80, 0.2);
    color: var(--accent-green);}
.status-badge.status-rejected{background-color: rgba(244, 67, 54, 0.2);
    color: #f44336;}
.status-badge.status-archived{border-color: rgba(148, 163, 184, 0.35);
    background: rgba(148, 163, 184, 0.10);
    color: #cbd5e1;}
.application-archive-note{flex: 1 1 100%;
    padding: 10px 12px;
    border: 1px solid rgba(148, 163, 184, 0.28);
    border-radius: 10px;
    color: #b8c0cc;
    background: rgba(148, 163, 184, 0.06);
    font-size: 13px;
    line-height: 1.45;}
.status-badge.status-deleted{background-color: rgba(160, 160, 160, 0.2);
    color: #a0a0a0;}
.application-card-preview{margin-bottom: 16px;
    padding: 12px;
    background-color: var(--bg-tertiary);
    border-radius: 6px;}
.preview-question{font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.5;}
.preview-question strong{color: var(--text-primary);}
.application-card-footer{display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);}
.application-card-date{display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--text-muted);}
.application-card-date svg{width: 14px;
    height: 14px;}
.btn-view{padding: 6px 12px;
    background-color: var(--accent-blue);
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s ease;}
.btn-view:hover{background-color: var(--accent-blue-hover);}
.loading-message,
.empty-message,
.error-message{text-align: center;
    padding: 60px 20px;
    color: var(--text-muted);
    font-size: 16px;}
.error-message{color: #f44336;}
/* Модальное окно просмотра заявки */
.application-view{max-height: 70vh;
    overflow-y: auto;}
.application-header{display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 2px solid var(--border-color);}
.application-user-info{display: flex;
    align-items: center;
    gap: 16px;}
.application-avatar{width: 60px;
    height: 60px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent-blue), var(--accent-green));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 20px;
    font-weight: 600;
    flex-shrink: 0;}
.application-user-name{font-size: 18px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px;}
.application-user-email{font-size: 14px;
    color: var(--text-secondary);
    margin-bottom: 4px;}
.application-date{font-size: 12px;
    color: var(--text-muted);}
.application-status-badge{padding: 8px 16px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;}
.application-questions{margin-bottom: 24px;}
.application-question{margin-bottom: 24px;
    padding: 16px;
    background-color: var(--bg-secondary);
    border-radius: 8px;
    border-left: 4px solid var(--accent-blue);}
.application-question h3{font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 12px;}
.application-answer{font-size: 14px;
    color: var(--text-secondary);
    line-height: 1.6;
    white-space: pre-wrap;}
.application-actions{display: flex;
    gap: 12px;
    flex-wrap: wrap;
    padding-top: 20px;
    border-top: 2px solid var(--border-color);}
.btn-success{display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background-color: var(--accent-green);
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;}
.btn-success:hover{background-color: #45a049;}
.btn-success svg{width: 16px;
    height: 16px;}
/* ============================================
   RESPONSIVE + SCROLL FIXES (v26)
   ============================================ */
/* Allow long modals (editor/member info) to scroll inside viewport */
.modal-content{max-height: calc(100vh - 120px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;}
/* Admin pages tree can grow large: keep it scrollable */
.admin-pages-tree{max-height: calc(100vh - var(--top-bar-height) - 180px);
    overflow: auto;
    -webkit-overflow-scrolling: touch;}
/* Tables should not break layout on small screens */
.members-table-container{overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;}
.members-table{min-width: 860px;}
/* Sidebar navigation should always be scrollable on smaller heights */
.sidebar-nav{overscroll-behavior: contain;}
/* Medium screens: reduce paddings */
@media (max-width: 1024px){
.top-bar-inner{padding: 0 24px;}
.main-content{padding: 36px 28px;}
}
/* Small screens: tighten top bar + buttons */
@media (max-width: 480px){
.top-bar-inner{padding: 0 14px;}
.logo-top{gap: 8px;
        font-size: 18px;}
.logo-top__mark{width: 28px;
        height: 28px;}
.btn-apply-top{padding: 8px 12px;
        font-size: 12px;}
.user-name{max-width: 120px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;}
.admin-pages-toolbar{flex-wrap: wrap;}
}
/* ===== FIX: границы страницы + перенос длинного текста ===== */
.breadcrumbs,
.page-title,
.page-title-large,
.page-meta,
.card,
.pages-list-item,
.pages-list-title,
.members-table th,
.members-table td{overflow-wrap: anywhere;
    word-break: break-word;
    white-space: normal;}
.members-table th,
.members-table td{min-width: 0;}
/* ===== Application form fields ===== */
.form-grid{display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;}
.hint{margin-top: 6px; font-size: 12px; color: var(--text-muted);}
.btn-secondary{display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 16px;
    border-radius: 14px;
    border: 1px solid var(--border-color);
    background: var(--bg-tertiary);
    color: var(--text-primary);
    font-weight: 600;
    cursor: pointer;}
.btn-secondary:hover{filter: brightness(1.03);}
@media (max-width: 720px){
.form-grid{grid-template-columns: 1fr;}
}
/* ===== Admin Applications: announce box ===== */
.admin-announce{margin:0 0 16px;padding:16px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);}
.admin-announce__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px;}
.admin-announce__title{font-weight:900;letter-spacing:.08em;text-transform:uppercase;font-size:12px;color:rgba(255,255,255,.88);}
.admin-announce__sub{font-size:13px;color:rgba(255,255,255,.68);margin-top:4px;}
.admin-announce__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end;}
.admin-announce__note{grid-column:1 / -1;}
.admin-announce__actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
.admin-announce__status{margin-top:10px;font-size:13px;color:rgba(255,255,255,.72);}
@media (max-width:720px){
.admin-announce__grid{grid-template-columns:1fr;}
.admin-announce__actions{justify-content:stretch;}
.admin-announce__actions .btn-primary,.admin-announce__actions .btn-secondary{flex:1;}
}
/* simple switch */
.switch{position:relative;display:inline-block;width:44px;height:26px;}
.switch input{opacity:0;width:0;height:0;}
.switch__slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18);transition:.2s;border-radius:999px;}
.switch__slider:before{position:absolute;content:"";height:20px;width:20px;left:3px;top:2px;background:rgba(255,255,255,.92);transition:.2s;border-radius:50%;}
.switch input:checked + .switch__slider{background:rgba(0,91,255,.65);border-color:rgba(0,91,255,.75);}
.switch input:checked + .switch__slider:before{transform:translateX(18px);}
/* ===== Site footer ===== */
.site-footer{margin-top:24px;border-top:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.18)}
/* v123: footer uses the exact same centered grid as sidebar + main content. */
.site-footer__inner{width:100%;max-width:var(--layout-max);margin:0 auto;padding:14px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.site-footer__links{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
@media (max-width:768px){
.site-footer__inner{padding:14px 18px;}
}
.site-footer__link{color:rgba(255,255,255,.82);text-decoration:none}
.site-footer__link:hover{color:#fff;text-decoration:underline}
.site-footer__sep{opacity:.45}
.site-footer__copy{opacity:.55;font-size:13px}
/* Registration policy agreement */
.form-policy{display:flex;align-items:flex-start;gap:10px;margin-top:12px;font-size:13px;line-height:1.35;color:rgba(255,255,255,.8)}
.form-policy input{margin-top:2px;accent-color:#4ea1ff}
.form-policy a{color:#9fd0ff;text-decoration:none}
.form-policy a:hover{text-decoration:underline}
/* ===== Inline styles moved from pages/apply.php ===== */
/* ===== Apply wizard (scoped). Keeps global theme intact ===== */
.field-meta{display:flex;justify-content:space-between;gap:12px;margin-top:6px;font-size:12px;color:rgba(255,255,255,.55);font-weight:700;}
.field-meta__left{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.field-meta__right{white-space:nowrap;color:rgba(255,255,255,.75);}
/* buttons weight */
.btn-submit-apply, .apply-btn{font-weight:600;}
/* submit button gold */
.btn-submit-apply--gold{background:linear-gradient(180deg, rgba(255,214,102,.98), rgba(214,169,55,.98));border-color:rgba(255,214,102,.35);color:#141b25;}
.btn-submit-apply--gold:hover{filter:brightness(1.03);}
/* agreement */
/* force checkbox square even if some global styles affect nested elements */
/* status card */
/* simple status text (instead of card) */
/* Статус (например, "Заявка одобрена") внутри карточки приёма заявок */
/* Keep existing submit button size for Next as well */
/* Guest notice (no overlap) */
#applyStep1 .btn-submit-apply{width:100%;justify-content:center;}
/* Шаги: сдержанный вид (done = зелёный + галочка, next = белый, todo = серый) */
.steps-list li{margin-bottom: 18px;}
.steps-list li::before{background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.18);
    color: #d9d9d9;}
.steps-list li.is-done::before{content: "✓";
    background: rgba(58, 210, 111, .12);
    border-color: rgba(58, 210, 111, .55);
    color: var(--accent-green);
    font-family: inherit;}
.steps-list li.is-done strong,
.steps-list li.is-done p{color: var(--accent-green);}
.steps-list li.is-next strong{color:#ffffff;}
.steps-list li.is-next p{color: var(--text-secondary);}
.steps-list li.is-todo strong{color: rgba(217,217,217,.6);}
.steps-list li.is-todo p{color: rgba(217,217,217,.45);}
/* --- Fix: wider edit member modal on desktop --- */
#editMemberModal .modal-content{max-width: 980px;
    width: 92vw;}
/* Ensure Inter in the whole member edit card (including buttons) */
#editMemberModal,
#editMemberModal *{font-family: "Inter", sans-serif;}
#editMemberModal button,
#editMemberModal .btn-submit,
#editMemberModal .btn-secondary,
#editMemberModal .btn-danger{font-family: inherit;}
@media (min-width: 900px){
#editMemberModal .modal-content{padding: 28px 32px;}
/* Info cards: 2 columns on desktop */
#editMemberModal .info-grid{display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 12px;
        margin-bottom: 14px;}
}
/* On small screens keep single column */
@media (max-width: 899px){
#editMemberModal .info-grid{display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
        margin-bottom: 14px;}
}
/* --- Consistent content offsets from sidebar --- */
.content-page,
.dashboard-content,
.page-header,
.table-container,
.chart-card,
.card,
.stats-grid,
.dashboard-grid{box-sizing: border-box;
    width: 100%;}
/* Prevent elements from adding unexpected horizontal offsets */
.content-page > *:first-child{margin-top: 0;}
/* --- Applications review modal: cleaner layout --- */
#viewApplicationModal .modal-content-large{max-height: 88vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;}
#viewApplicationModal .application-view{flex: 1;
    overflow: auto;
    padding-right: 6px; /* makes scrollbar not overlap content */}
#viewApplicationModal .application-header{display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 16px;}
#viewApplicationModal .application-user-info{display: flex;
    gap: 14px;
    align-items: center;}
#viewApplicationModal .application-questions{display: grid;
    grid-template-columns: 1fr;
    gap: 12px;}
@media (min-width: 960px){
#viewApplicationModal .application-questions{grid-template-columns: 1fr 1fr;
        gap: 14px;}
#viewApplicationModal .application-questions .application-section{grid-column: 1 / -1;}
}
#viewApplicationModal .application-section{margin-top: 6px;
    padding: 10px 12px;
    border: 1px solid var(--border-color);
    background: var(--bg-secondary);
    border-radius: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    opacity: .9;}
#viewApplicationModal .application-question{border: 1px solid var(--border-color);
    background: var(--bg-secondary);
    border-radius: 10px;
    padding: 12px 14px;}
#viewApplicationModal .application-question h3{font-size: 12px;
    margin: 0 0 6px 0;
    opacity: .7;
    text-transform: uppercase;
    letter-spacing: .06em;}
#viewApplicationModal .application-answer{font-size: 14px;
    line-height: 1.35;
    word-break: break-word;}
#viewApplicationModal #viewApplicationModal .application-actions .btn{min-width: 140px;}
/* --- Application page layout --- */
/* --- Member modal: groups & toggles alignment --- */
#editMemberModal .member-modal-meta{display:flex;
    align-items:center;
    gap:10px;
    margin: 6px 0 18px;}
#editMemberModal .member-primary-group{display:inline-flex;
    align-items:center;
    padding:6px 10px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.18);
    font-weight:700;
    font-size:12px;
    color:#fff;}
#editMemberModal .member-more-groups{position:relative;
    display:inline-flex;
    align-items:center;}
#editMemberModal .member-more-groups__count{display:inline-flex;
    align-items:center;
    justify-content:center;
    height:26px;
    padding:0 10px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: var(--text);
    font-weight:700;
    cursor:default;}
#editMemberModal .member-more-groups__popover{display:none;
    position:absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 220px;
    max-width: 320px;
    padding: 10px 10px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(20,20,20,.95);
    box-shadow: 0 18px 40px rgba(0,0,0,.35);
    z-index: 40;}
#editMemberModal .member-more-groups:hover .member-more-groups__popover{display:block;}
#editMemberModal .group-pop-item{display:flex;
    align-items:center;
    gap:10px;
    padding:6px 6px;
    border-radius:10px;}
#editMemberModal .group-pop-item:hover{background: rgba(255,255,255,.06);}
#editMemberModal .group-dot{width:10px;height:10px;border-radius:50%;
    background: rgba(255,255,255,.18);
    flex: 0 0 auto;}
#editMemberModal .group-check{display:flex;
    align-items:center;
    gap:10px;
    padding: 8px 10px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    cursor:pointer;
    user-select:none;}
#editMemberModal .group-check:hover{background: rgba(255,255,255,.05);}
#editMemberModal .group-check__name{flex:1;
    text-align:left;}
/* Member modal group picker */
#editMemberModal .group-picker{width: 100%;
    max-width: none;
    position: relative;}
#editMemberModal .group-picker__header{display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom: 8px;}
#editMemberModal .group-picker__title{font-size: 13px;
    color: var(--text-muted);}
#editMemberModal .group-picker__add{width: 34px;
    height: 34px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.05);
    color: var(--text-primary);
    cursor: pointer;
    font-family: "Inter", sans-serif;
    font-size: 18px;
    line-height: 1;}
#editMemberModal .group-picker__add:hover{background: rgba(255,255,255,.08);}
#editMemberModal .group-picker__list{display:grid;
    grid-template-columns: 1fr; /* one role per row */
    gap: 8px;}
#editMemberModal .group-picker__empty{grid-column: 1 / -1;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    color: var(--text-muted);
    font-size: 14px;}
@media (max-width: 720px){
#editMemberModal .group-picker__list{grid-template-columns: 1fr;}
}
#editMemberModal .group-pill{display:flex;
    align-items:center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    border-left: 4px solid rgba(255,255,255,.14);}
#editMemberModal .group-pill[data-role-color]{border-left-color: var(--role-color);
    border-color: color-mix(in srgb, var(--role-color) 45%, rgba(255,255,255,.12));
    background: color-mix(in srgb, var(--role-color) 14%, rgba(255,255,255,.03));}
#editMemberModal .group-pill__check{width: 18px;
    height: 18px;
    border-radius: 6px;
    display:flex;
    align-items:center;
    justify-content:center;
    background: rgba(46, 204, 113, .16);
    color: #2ECC71;
    font-size: 12px;
    flex: 0 0 auto;}
#editMemberModal .group-pill[data-role-color] .group-pill__check{background: color-mix(in srgb, var(--role-color) 18%, transparent);
    color: var(--role-color);}
#editMemberModal .group-check[data-role-color]{border-color: color-mix(in srgb, var(--role-color) 45%, rgba(255,255,255,.12));
    background: color-mix(in srgb, var(--role-color) 10%, rgba(255,255,255,.03));}
#editMemberModal .group-pill__name{flex:1;
    text-align:left;
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.25;
    word-break: break-word;}
#editMemberModal .group-pill__remove{width: 32px;
    height: 32px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.05);
    color: var(--text-primary);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    font-family: "Inter", sans-serif;}
#editMemberModal .group-pill__remove:hover{background: rgba(255,255,255,.08);}
#editMemberModal .group-picker__popover{position:absolute;
    right: 0;
    top: 0;
    transform: translateY(42px);
    width: 320px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(20, 22, 28, .98);
    box-shadow: 0 16px 50px rgba(0,0,0,.55);
    padding: 12px;
    z-index: 10;}
#editMemberModal .group-picker__pop-title{font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;}
#editMemberModal .group-picker__select{width: 100%;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.04);
    color: var(--text-primary);
    font-family: "Inter", sans-serif;
    outline: none;}
/* Group picker popover: simple grid list (same UX as qualifications) */
#editMemberModal .group-picker__grid{display:grid;
    grid-template-columns: 1fr; /* one role per row */
    gap: 8px;
    max-height: 320px;
    overflow:auto;}
#editMemberModal .group-check{display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    cursor:pointer;
    user-select:none;
    text-align:left;
    color: var(--text-primary);}
#editMemberModal .group-check:hover{background: rgba(255,255,255,.06);}
#editMemberModal .group-check__name{flex:1; word-break: break-word;}
@media (max-width: 720px){
#editMemberModal .group-picker__grid{grid-template-columns: 1fr;}
}
/* Member modal qualification picker (UI only) */
#editMemberModal .qual-picker{width: 100%;
    max-width: none;
    position: relative;}
#editMemberModal .qual-picker__header{display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom: 8px;}
#editMemberModal .qual-picker__title{font-size: 13px;
    color: var(--text-muted);}
#editMemberModal .qual-picker__add{width: 34px;
    height: 34px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.05);
    color: var(--text-primary);
    cursor: pointer;
    font-family: "Inter", sans-serif;
    font-size: 18px;
    line-height: 1;}
#editMemberModal .qual-picker__add:hover{background: rgba(255,255,255,.08);}
#editMemberModal .qual-picker__list{display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;}
#editMemberModal .qual-picker__empty{grid-column: 1 / -1;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    color: var(--text-muted);
    font-size: 14px;}
@media (max-width: 720px){
#editMemberModal .qual-picker__list{grid-template-columns: 1fr;}
}
#editMemberModal .qual-pill{display:flex;
    align-items:center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);}
#editMemberModal .qual-pill__check{width: 18px;
    height: 18px;
    border-radius: 6px;
    display:flex;
    align-items:center;
    justify-content:center;
    background: rgba(52, 152, 219, .16);
    color: #3498DB;
    font-size: 12px;
    flex: 0 0 auto;}
#editMemberModal .qual-pill__name{flex:1;
    text-align:left;
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.25;
    word-break: break-word;}
#editMemberModal .qual-pill__remove{width: 32px;
    height: 32px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.05);
    color: var(--text-primary);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    font-family: "Inter", sans-serif;}
#editMemberModal .qual-pill__remove:hover{background: rgba(255,255,255,.08);}
#editMemberModal .qual-picker__popover{position:absolute;
    right: 0;
    top: 0;
    transform: translateY(42px);
    width: 380px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(20, 22, 28, .98);
    box-shadow: 0 16px 50px rgba(0,0,0,.55);
    padding: 12px;
    z-index: 10;}
#editMemberModal .qual-picker__pop-title{font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;}
#editMemberModal .qual-picker__section{margin-bottom: 12px;}
#editMemberModal .qual-picker__section-title{font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 6px;}
#editMemberModal .qual-picker__grid{display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;}
#editMemberModal .qual-check{display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    cursor:pointer;
    user-select:none;
    text-align:left;
    color: var(--text-primary);}
#editMemberModal .qual-check:hover{background: rgba(255,255,255,.06);}
#editMemberModal .qual-check__name{flex:1;}
#editMemberModal .qual-picker__pop-actions{display:flex;
    justify-content:flex-end;
    gap: 8px;
    margin-top: 8px;}
#editMemberModal .qual-picker__pop-empty{color: var(--text-muted);
    padding: 10px 8px;}
#pageModal .group-picker__pop-title{font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;}
#pageModal .group-picker__search{margin-bottom: 10px;}
#pageModal .group-picker__search-input{width: 100%;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.04);
    color: var(--text-primary);
    font-family: "Inter", sans-serif;
    outline: none;}
#pageModal .group-picker__search-input::placeholder{color: rgba(255,255,255,.45);}
#pageModal .group-picker__search-input:focus{border-color: rgba(255,255,255,.22);
    background: rgba(255,255,255,.06);}
#pageModal .group-picker__select{width: 100%;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.04);
    color: var(--text-primary);
    font-family: "Inter", sans-serif;
    outline: none;}
#pageModal .group-picker__grid{display:grid;
    grid-template-columns: 1fr; /* one role per row */
    gap: 8px;
    max-height: 320px;
    overflow:auto;}
#pageModal .group-check{display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    cursor:pointer;
    user-select:none;
    text-align:left;
    color: var(--text-primary);}
#pageModal .group-check:hover{background: rgba(255,255,255,.06);}
#pageModal .group-check__name{flex:1; word-break: break-word;}
@media (max-width: 720px){
#pageModal .group-picker__grid{grid-template-columns: 1fr;}
}
/* Fix native dropdown list (options) background in dark UI */
#pageModal .group-picker__select option,
#pageModal .group-picker__select optgroup{background-color: var(--bg-primary);
    color: var(--text-primary);}
/* Same fix for member editor group picker */
#editMemberModal .group-picker__select option,
#editMemberModal .group-picker__select optgroup{background-color: var(--bg-primary);
    color: var(--text-primary);}
/* Admin filters: keep native selects, but match dark dropdown list */
select.form-input option,
select.form-input optgroup,
.toolbar-filters select option,
.toolbar-filters select optgroup{background-color: var(--bg-primary);
    color: var(--text-primary);}
#editMemberModal .group-picker__pop-actions{display:flex;
    justify-content:flex-end;
    gap: 10px;
    margin-top: 12px;}
#editMemberModal .group-picker__pop-empty{color: var(--text-muted);
    font-size: 14px;}
/* Page access groups (admin pages modal) */
#pageModal .group-picker{width: 100%;
    max-width: none;
    position: relative;}
#pageModal .group-picker__header{display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom: 8px;}
#pageModal .group-picker__title{font-size: 13px;
    color: var(--text-muted);}
#pageModal .group-picker__add{width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.05);
    color: var(--text-primary);
    cursor: pointer;
    font-family: "Inter", sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    display:flex;
    align-items:center;
    justify-content:center;
    transition: background .15s ease, border-color .15s ease, transform .05s ease;}
#pageModal .group-picker__add:hover{background: rgba(255,255,255,.08);
    border-color: rgba(255,255,255,.20);}
#pageModal .group-picker__add:active{transform: translateY(1px);}
#pageModal .group-picker__add:active{transform: translateY(1px);}
#pageModal .group-picker__search{margin-bottom: 10px;}
#pageModal .group-picker__search-input{width: 100%;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.04);
    color: var(--text-primary);
    font-family: "Inter", sans-serif;
    outline: none;}
#pageModal .group-picker__search-input:focus{border-color: rgba(255,255,255,.22);
    background: rgba(255,255,255,.06);}
#pageModal .group-picker__list{display:grid;
    grid-template-columns: 1fr; /* one role per row */
    gap: 8px;}
#pageModal .group-picker__empty{grid-column: 1 / -1;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    color: var(--text-muted);
    font-size: 14px;}
@media (max-width: 720px){
#pageModal .group-picker__list{grid-template-columns: 1fr;}
}
#pageModal .group-pill{display:flex;
    align-items:center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    border-left: 4px solid rgba(255,255,255,.14);}
#pageModal .group-pill[data-role-color]{border-left-color: var(--role-color);
    border-color: color-mix(in srgb, var(--role-color) 45%, rgba(255,255,255,.12));
    background: color-mix(in srgb, var(--role-color) 14%, rgba(255,255,255,.03));}
#pageModal .group-pill__check{width: 18px;
    height: 18px;
    border-radius: 6px;
    display:flex;
    align-items:center;
    justify-content:center;
    background: rgba(46, 204, 113, .16);
    color: #2ECC71;
    font-size: 12px;
    flex: 0 0 auto;}
#pageModal .group-pill[data-role-color] .group-pill__check{background: color-mix(in srgb, var(--role-color) 18%, transparent);
    color: var(--role-color);}
#pageModal .group-check[data-role-color]{border-color: color-mix(in srgb, var(--role-color) 45%, rgba(255,255,255,.12));
    background: color-mix(in srgb, var(--role-color) 10%, rgba(255,255,255,.03));}
/* Same group-picker UI for category/topic modals */
#categoryModal .group-picker__list,
#topicModal .group-picker__list{display:grid; grid-template-columns: 1fr; gap: 8px;}
#categoryModal .group-picker__grid{display:grid; grid-template-columns: 1fr; gap: 8px; max-height: 320px; overflow:auto;}
#topicModal .group-picker__grid{display:grid; grid-template-columns: 1fr 1fr; gap: 8px; max-height: 320px; overflow:auto;}
@media (max-width: 860px){
#topicModal .group-picker__grid{grid-template-columns: 1fr;}
}
#categoryModal .group-pill,
#topicModal .group-pill{display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:12px; border:1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.03); border-left: 4px solid rgba(255,255,255,.14);}
#categoryModal .group-pill[data-role-color],
#topicModal .group-pill[data-role-color]{border-left-color: var(--role-color);
    border-color: color-mix(in srgb, var(--role-color) 45%, rgba(255,255,255,.12));
    background: color-mix(in srgb, var(--role-color) 14%, rgba(255,255,255,.03));}
#categoryModal .group-pill[data-role-color] .group-pill__check,
#topicModal .group-pill[data-role-color] .group-pill__check{background: color-mix(in srgb, var(--role-color) 18%, transparent); color: var(--role-color);}
#categoryModal .group-check,
#topicModal .group-check{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-radius:12px; border:1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.03); cursor:pointer; user-select:none; text-align:left; color: var(--text-primary);}
#categoryModal .group-check:hover,
#topicModal .group-check:hover{background: rgba(255,255,255,.06);}
#categoryModal .group-check[data-role-color],
#topicModal .group-check[data-role-color]{border-color: color-mix(in srgb, var(--role-color) 45%, rgba(255,255,255,.12)); background: color-mix(in srgb, var(--role-color) 10%, rgba(255,255,255,.03));}
#pageModal .group-pill__name{flex:1;
    text-align:left;
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.25;
    word-break: break-word;}
#pageModal .group-pill__remove{width: 32px;
    height: 32px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.05);
    color: var(--text-primary);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    font-family: "Inter", sans-serif;}
#pageModal .group-pill__remove:hover{background: rgba(255,255,255,.08);}
#pageModal .group-picker__popover{position:absolute;
    right: 0;
    top: 0;
    transform: translateY(42px);
    width: 320px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(20, 22, 28, .98);
    box-shadow: 0 16px 50px rgba(0,0,0,.55);
    padding: 12px;
    z-index: 10;}
#pageModal .group-picker__pop-title{font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;}
#pageModal .group-picker__select{width: 100%;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.04);
    color: var(--text-primary);
    font-family: "Inter", sans-serif;
    outline: none;}
#pageModal .group-picker__pop-actions{display:flex;
    justify-content:flex-end;
    gap: 10px;
    margin-top: 12px;}
#pageModal .group-picker__pop-empty{color: var(--text-muted);
    font-size: 14px;}
#editMemberModal .member-toggles{display:flex;
    flex-direction:column;
    gap:10px;
    max-width: 560px;}
#editMemberModal .form-group.member-toggle{margin: 0;}
#editMemberModal .form-group.member-toggle .member-toggle-row{display:grid;
    grid-template-columns: 1fr auto;
    align-items:center;
    gap:14px;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    margin: 0;
    cursor: pointer;}
#editMemberModal .form-group.member-toggle .member-toggle-text{display:flex;
    flex-direction:column;
    gap: 4px;
    text-align:left;
    min-width: 0;}
#editMemberModal .form-group.member-toggle .member-toggle-title{font-weight: 600;
    color: var(--text);}
#editMemberModal .form-group.member-toggle .member-toggle-desc{font-size: 13px;
    line-height: 1.35;
    color: var(--text-muted);}
#editMemberModal .form-group.member-toggle input[type="checkbox"]{justify-self: end;
    transform: scale(1.15);
    cursor: pointer;}
/* --- Member modal: profile and layout grids --- */
#editMemberModal .member-profile-card{border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.03);
    padding: 14px;}
#editMemberModal .member-profile-card__title{font-weight: 700;
    font-size: 14px;
    color: var(--text);
    margin-bottom: 10px;}
#editMemberModal .member-profile-link{font-size: 12px;
    font-weight: 600;
    color: var(--accent-blue);
    text-decoration: none;
    padding: 6px 10px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.04);}
#editMemberModal .member-profile-link:hover{background: rgba(255,255,255,.07);}
#editMemberModal .member-profile-grid{display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;}
#editMemberModal .member-profile-grid .form-group label{margin-bottom: 8px;}
#editMemberModal .input-with-actions{position: relative;}
#editMemberModal .input-with-actions input{padding-right: 56px; /* space for 1 icon button */}
#editMemberModal .input-with-actions.input-with-actions--double input{padding-right: 150px; /* space for eye + reset */}
#editMemberModal .input-with-actions .input-actions{position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    gap: 8px;}
#editMemberModal .input-action-btn{display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    min-width: 34px;
    padding: 0;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.04);
    color: var(--text);
    cursor: pointer;
    text-decoration: none;}
#editMemberModal .input-action-btn:hover{background: rgba(255,255,255,.06);}
#editMemberModal .input-action-btn svg{width: 18px;
    height: 18px;
    fill: currentColor;
    opacity: .9;}
#editMemberModal .input-action-btn--text{min-width: auto;
    padding: 0 10px;
    font-weight: 600;
    font-size: 13px;}
#editMemberModal .input-action-btn.is-disabled,
#editMemberModal .input-action-btn[aria-disabled="true"]{opacity: .55;
    pointer-events: none;}
#editMemberModal .member-help{font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.3;}
#editMemberModal .member-app-link,
#editMemberModal .member-reset-btn{display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 14px;
    border-radius: 10px;}
#editMemberModal .member-app-link.is-disabled{opacity: .55;
    pointer-events: none;}
#editMemberModal .member-ranks-grid{display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;}
@media (max-width: 900px){
#editMemberModal .member-ranks-grid{grid-template-columns: 1fr;}
}
#editMemberModal .member-flags-grid{display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;}
@media (max-width: 820px){
#editMemberModal .member-profile-grid,
    #editMemberModal .member-flags-grid{grid-template-columns: 1fr;}
}
/* --- Mobile nav bottom sheet on MIRC --- */
.mobile-nav-sheet{position: fixed;
    left: 0; right: 0; bottom: 0;
    background: rgba(20,20,20,.98);
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 -18px 40px rgba(0,0,0,.45);
    transform: translateY(110%);
    transition: transform .22s ease;
    z-index: 9999;
    max-height: 78vh;
    overflow: auto;
    padding: 14px 14px 22px;}
.mobile-nav-sheet.active{transform: translateY(0);}
.mobile-nav-sheet__head{display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 10px;
    padding: 4px 4px 10px;}
.mobile-nav-sheet__title{font-weight: 900;
    letter-spacing: .06em;}
.mobile-nav-sheet__close{border: none;
    background: transparent;
    color: var(--text);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    padding: 6px 10px;}
.mobile-nav-overlay{position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
    z-index: 9998;}
.mobile-nav-overlay.active{opacity: 1;
    pointer-events: auto;}
@media (min-width: 769px){
.mobile-nav-sheet, .mobile-nav-overlay{display:none !important;}
}
/* Application comments (chat) */
.application-comments{border:1px solid var(--border-color);border-radius:14px;padding:12px 12px 10px;margin:10px 0 14px;background:rgba(255,255,255,.02);}
.application-comments__title{font-weight:800;margin-bottom:8px;color:var(--text-secondary);}
.application-comments__list{display:flex;flex-direction:column;gap:8px;max-height:180px;overflow:auto;padding-right:6px;margin-bottom:10px;}
.application-comments__msg{border:1px solid var(--border-color);border-radius:12px;padding:8px 10px;background:rgba(255,255,255,.03);}
.application-comments__meta{font-size:12px;color:var(--text-muted);margin-bottom:4px;}
.application-comments__text{white-space:pre-wrap;}
.application-comments__form{display:flex;gap:10px;align-items:flex-end;}
.application-comments__form textarea{flex:1;min-height:42px;max-height:120px;resize:vertical;}
.application-meta{margin-top:10px;font-size:13px;color:var(--text-muted);}
.application-meta strong{color:var(--text-secondary);}
/* Application modal actions (non-sticky) */
.application-actions{display:flex;
    gap:12px;
    flex-wrap:wrap;
    padding-top:20px;
    border-top:2px solid var(--border-color);
    justify-content:flex-end;}
.app-action-btn{display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 12px;
    border-radius:12px;
    border:1px solid transparent;
    font-weight:800;
    font-family: "Inter", sans-serif;
    cursor:pointer;
    line-height:1;}
.app-action-btn svg{width:16px;height:16px;display:block;}
.app-action-accept{background: rgba(76,175,80,.24);
    border-color: rgba(76,175,80,.45);
    color: #eaffea;}
.app-action-reject{background: rgba(244,67,54,.22);
    border-color: rgba(244,67,54,.45);
    color: #ffecec;}
.app-action-review{background: rgba(255,193,7,.18);
    border-color: rgba(255,193,7,.42);
    color: #fff3cd;}
.app-action-delete{background: rgba(180,180,180,.10);
    border-color: rgba(180,180,180,.28);
    color: #f2f2f2;}
.app-action-btn:disabled{opacity:.55;cursor:not-allowed;}
/* Application comments (chat) */
.application-comments{border:1px solid var(--border-color);
    border-radius:14px;
    padding:12px 12px 10px;
    margin:10px 0 14px;
    background: rgba(255,255,255,.02);}
.application-comments__title{font-weight:900;
    margin-bottom:8px;
    color: var(--text-secondary);
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing:.06em;}
/* Home page (Main) — minimal dark UI, no gradients/animations */
.how-item__icon{width:28px;height:28px;
    display:flex;align-items:center;justify-content:center;
    color: rgba(255,255,255,.65);}
.how-item__icon svg{width:24px;height:24px;display:block;}
.how-item__text{color: rgba(255,255,255,.90); line-height:1.35;}
.join-steps{list-style:none; padding:0; margin:0;}
.join-step{display:flex;
    align-items:center;
    gap:12px;
    padding:12px 0;
    border-bottom:1px solid rgba(255,255,255,.06);}
.join-step:last-child{border-bottom:none;}
.join-step__icon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;}
.join-step.is-done{color:#2ECC71;}
.join-step.is-current{color:#fff;}
.join-step.is-next{color:#6B7280;}
.join-step.is-done .join-step__icon::before{content:"✔";}
.join-step.is-current .join-step__icon::before{content:"●";}
.join-step.is-next .join-step__icon::before{content:"○";}
.stats-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px;}
.stat-card{border:1px solid var(--border-color);
    border-radius:14px;
    padding:14px 14px 12px;
    background: rgba(255,255,255,.02);}
.stat-card__value{font-size:28px; font-weight:900; line-height:1; margin-bottom:6px;}
.stat-card__label{font-size:12px; color: var(--text-secondary);}
.events-list{list-style:none; padding:0; margin:0;}
.events-item{display:flex; align-items:flex-start; gap:10px; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.06);}
.events-item:last-child{border-bottom:none;}
.events-item__icon{width:18px; text-align:center;}
.events-item__text{color: rgba(255,255,255,.90);}
.events-item__meta{margin-left:auto; padding-left:12px; color: var(--text-secondary); font-size:12px; white-space:nowrap;}
.status-card{border:1px solid var(--border-color);
    border-radius:14px;
    padding:14px;
    background: rgba(255,255,255,.02);}
.status-card__row{display:flex; gap:10px; justify-content:space-between; padding:6px 0;}
.status-card__label{color: var(--text-secondary);}
.status-card__value{color: rgba(255,255,255,.92); font-weight:800;}
.status-actions__btn{display:inline-flex;
    align-items:center;
    justify-content:center;
    width:100%;
    padding:10px 12px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.95);
    font-weight:900;}
.status-actions__btn:hover{background: rgba(255,255,255,.08);}
.status-actions__btn--secondary{background: rgba(255,255,255,.03);}
.final-cta{border:1px solid var(--border-color);
    border-radius:14px;
    padding:16px;
    background: rgba(255,255,255,.02);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;}
.final-cta__text{color: rgba(255,255,255,.90); line-height:1.45;}
.final-cta__btn{display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:12px 16px;
    border-radius:10px;
    background:#2ECC71;
    color:#131a24;
    font-weight:900;
    border:1px solid rgba(0,0,0,.18);
    white-space:nowrap;}
.final-cta__btn:hover{filter:brightness(.94);}
@media (max-width: 980px){
.stats-grid{grid-template-columns:1fr;}
.final-cta{flex-direction:column; align-items:stretch;}
}
/* ============================================
   MOBILE AUDIT (v61)
   Goal: make ALL pages usable on small screens without changing logic.
   Only CSS overrides.
   ============================================ */
/* Admin toolbars (members / groups): search + actions should stack and fill width */
@media (max-width: 720px){
.admin-members-container{padding: 16px;}
.admin-members-toolbar{flex-direction: column;
        align-items: stretch;
        gap: 12px;}
.search-box{min-width: 0;
        max-width: none;
        width: 100%;}
.toolbar-actions{width: 100%;}
.toolbar-actions .btn-primary,
    .toolbar-actions .btn-secondary{flex: 1 1 auto;
        justify-content: center;}
}
/* Admin applications filters: prevent overflow from min-width inline styles */
@media (max-width: 720px){
#applicationsRoleFilter{min-width: 0 !important;
        width: 100% !important;}
}
/* Admin dashboard inline 12-col grid must collapse on mobile */
@media (max-width: 720px){
/* Grid container is inline-styled; override with !important */
.content-page .grid{grid-template-columns: 1fr !important;}
.content-page .grid > .card{grid-column: span 12 !important;}
}
/* Tables: ensure any table wrapper can scroll on narrow screens */
@media (max-width: 720px){
.table-container{overflow-x: auto;
        -webkit-overflow-scrolling: touch;}
.table-container table{min-width: 640px;}
}
/* Modals: fit viewport on very small screens */
@media (max-width: 480px){
.modal-content,
    .modal-content-large{width: calc(100vw - 28px);
        max-width: calc(100vw - 28px);
        padding: 16px;}
.modal-close{top: 10px;
        right: 10px;}
}
.application-comments__list{display:flex;
    flex-direction:column;
    gap:8px;
    max-height:180px;
    overflow:auto;
    padding-right:6px;
    margin-bottom:10px;}
.application-comments__msg{border:1px solid var(--border-color);
    border-radius:12px;
    padding:10px 10px;
    background: rgba(255,255,255,.02);}
.application-comments__meta{display:flex;gap:8px;align-items:baseline;margin-bottom:4px;color:var(--text-muted);font-size:12px;}
.application-comments__name{font-weight:800;color:var(--text-secondary);}
.application-comments__text{white-space:pre-wrap;}
.application-comments__composer{display:flex;gap:10px;align-items:flex-end;}
.application-comments__input{flex: 1;
    min-height: 96px;
    resize: vertical;
    line-height: 1.35;
    width: 100%;
    padding: 12px 14px;
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: var(--text-primary);
    font-size: 14px;
    font-family: inherit;
    outline: none;
    transition: all 0.2s ease;}
.application-comments__input:focus{border-color: var(--accent-blue);
    background-color: var(--bg-primary);}
.application-comments__input::placeholder{color: var(--text-muted);}
.application-meta{margin-top:12px;color:var(--text-muted);font-size:12px;}
/* === Global links style (yellow + no underline + icon) === */
a{color:#f5c542;
  text-decoration:none;}
a:hover{text-decoration:none;
  opacity:.9;}
/* Removed automatic decorative link icons: they break UI consistency and icon rendering. */
/* ==========================================================
   PROJECT-WIDE UI CONSISTENCY PASS (2026-08)
   Final overrides for shared components used across pages.
   ========================================================== */
:root{--surface-1: #141b25;
    --surface-2: #1a2130;
    --surface-3: #22375c;
    --border-soft: rgba(68,131,226,.16);
    --border-strong: rgba(68,131,226,.28);
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 18px;
    --control-h: 42px;}
/* Shared typography/helpers that were used in markup but not defined globally. */
.text-muted{color: var(--text-muted) !important;}
.page-subtitle{margin-top: 6px;
    color: var(--text-muted);
    font-size: 13px;
    line-height: 1.45;}
.section-eyebrow{font-size: 12px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
    color: rgba(255,255,255,.84);}
.section-subtext{margin-top: 6px;
    color: var(--text-muted);
    font-size: 13px;
    line-height: 1.45;}
.form-hint,
.hint{margin-top: 6px;
    color: var(--text-muted);
    font-size: 12px;
    line-height: 1.45;}
.form-label{display:block;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 650;
    color: var(--text-primary);}
/* Content geometry */
.content-page{max-width: 1180px;
    padding: 18px 20px 28px;}
.content-page--wide{max-width: 1240px;}
.page-header{margin-bottom: 24px;}
.page-header--with-actions{display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;}
.page-actions{display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;}
.page-title,
.page-title-large{margin:0;
    font-size: clamp(26px, 3vw, 34px);
    line-height:1.15;
    letter-spacing:-.02em;
    text-transform:none;}
/* A real base card. Several pages already used .card with no base visual rules. */
.card{border: 1px solid var(--border-soft);
    border-radius: var(--radius-lg);
    background: rgba(255,255,255,.025);
    box-shadow: 0 10px 28px rgba(0,0,0,.12);}
.card__title,
.card-title{color:var(--text-primary);
    font-size:18px;
    line-height:1.25;
    font-weight:750;}
.card__text{margin-top:8px;
    color:var(--text-muted);
    line-height:1.55;}
.card__actions{display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:18px;}
.card-header{display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:14px;}
/* Shared buttons */
.btn,
.btn-primary,
.btn-secondary,
.btn-danger,
.btn-success,
.btn-view,
.btn-submit,
.filter-btn,
.apply-btn,
.btn-submit-apply{min-height: var(--control-h);
    box-sizing:border-box;
    border-radius:10px;
    padding:10px 15px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    font-family:inherit;
    font-size:14px;
    font-weight:650;
    line-height:1.15;
    text-decoration:none;
    cursor:pointer;}
.btn-primary,
.btn-submit{background:var(--accent-blue);
    border:1px solid transparent;
    color:#fff;}
.btn-primary:hover,
.btn-submit:hover{background:var(--accent-blue-hover);
    box-shadow:0 8px 20px rgba(45,63,143,.20);}
.btn-secondary{background:rgba(255,255,255,.045);
    border:1px solid var(--border-soft);
    color:var(--text-primary);}
.btn-secondary:hover{background:rgba(255,255,255,.075);
    border-color:var(--border-strong);}
.btn-danger{background:rgba(244,67,54,.15);
    border:1px solid rgba(244,67,54,.34);
    color:#ffd8d5;}
.btn-danger:hover{background:rgba(244,67,54,.23);
    border-color:rgba(244,67,54,.48);}
.btn-icon{border-radius:9px;}
/* Shared form controls, including standalone .form-input selects used on profile/admin pages. */
.form-input,
.form-select,
.search-input,
.form-group input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.form-group textarea,
.form-group select,
.profile-admin-inline select,
.profile-admin-ranks select{width:100%;
    min-height:var(--control-h);
    padding:10px 12px;
    border:1px solid var(--border-soft);
    border-radius:10px;
    background-color:rgba(255,255,255,.035);
    color:var(--text-primary);
    font-family:inherit;
    font-size:14px;
    line-height:1.35;
    outline:none;}
.form-input:focus,
.form-select:focus,
.search-input:focus,
.form-group input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]):focus,
.form-group textarea:focus,
.form-group select:focus,
.profile-admin-inline select:focus,
.profile-admin-ranks select:focus{border-color:rgba(78,108,225,.85);
    background-color:rgba(255,255,255,.05);
    box-shadow:var(--focus-ring);}
.form-input::placeholder,
.search-input::placeholder,
.form-group input::placeholder,
.form-group textarea::placeholder{color:#727272;}
select.form-input,
select.form-select,
.form-group select,
.profile-admin-inline select,
.profile-admin-ranks select{appearance:none;
    -webkit-appearance:none;
    padding-right:36px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23999999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 11px center;
    background-size:16px;}
select.form-input option,
select.form-select option,
.form-group select option,
.profile-admin-inline select option,
.profile-admin-ranks select option{background:#1a2130;
    color:#fff;}
textarea.form-input,
.form-group textarea{min-height:110px;
    resize:vertical;}
input[type="file"]{max-width:100%;
    color:var(--text-secondary);}
input[type="file"]::file-selector-button{min-height:36px;
    margin-right:10px;
    padding:8px 12px;
    border:1px solid var(--border-soft);
    border-radius:9px;
    background:rgba(255,255,255,.05);
    color:var(--text-primary);
    font-family:inherit;
    cursor:pointer;}
input[type="file"]::file-selector-button:hover{background:rgba(255,255,255,.08);}
/* Native checkbox/radio alignment */
input[type="checkbox"],
input[type="radio"]{accent-color:var(--accent-blue);}
.form-group{min-width:0;}
.form-group label{line-height:1.35;}
/* Admin toolbars */
.admin-pages-container,
.admin-members-container,
.admin-panel-container{padding:0;}
.admin-pages-toolbar,
.admin-members-toolbar,
.admin-panel-toolbar{padding:14px;
    margin-bottom:16px;
    border:1px solid var(--border-soft);
    border-radius:var(--radius-md);
    background:rgba(255,255,255,.02);}
.admin-pages-toolbar{flex-wrap:wrap;}
.toolbar-filters{display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;}
.toolbar-filters .form-input{min-width:220px;}
/* Tables */
.members-table-container{border-radius:var(--radius-md);
    border-color:var(--border-soft);
    overflow:auto;
    -webkit-overflow-scrolling:touch;}
.members-table{min-width:760px;}
.members-table thead{background:rgba(255,255,255,.035);}
.members-table th{padding:13px 14px;
    border-bottom:1px solid var(--border-soft);
    color:#919191;
    font-size:11px;
    font-weight:750;
    letter-spacing:.055em;}
.members-table td{padding:13px 14px;
    border-bottom:1px solid rgba(255,255,255,.055);
    vertical-align:middle;}
.members-table tbody tr:hover{background:rgba(255,255,255,.025);}
.table-actions{justify-content:flex-end;}
/* Empty/loading states */
.loading-message,
.tree-loading,
.ui-empty-state{display:flex;
    align-items:center;
    justify-content:center;
    min-height:120px;
    padding:24px;
    color:var(--text-muted);
    text-align:center;}
.admin-pages-tree{border-radius:var(--radius-md);
    border-color:var(--border-soft);
    background:rgba(255,255,255,.015);}
.tree-item-header{border-radius:10px;
    border-color:var(--border-soft);
    background:rgba(255,255,255,.025);}
/* Modals */
.modal{padding:20px;
    background:rgba(0,0,0,.72);
    backdrop-filter:blur(8px);}
.modal-content,
.modal-content-large{width:min(92vw, 720px);
    max-height:calc(100vh - 40px);
    overflow:auto;
    border-radius:18px;
    padding:26px;
    border-color:var(--border-soft);
    background:var(--bg-secondary);
    box-shadow:0 24px 70px rgba(0,0,0,.5);}
.modal-content-large{max-width:960px;}
.modal-content--confirm{max-width:520px;}
.modal-content h2{margin:0 44px 18px 0;
    font-size:22px;
    line-height:1.25;}
.modal-description{color:var(--text-secondary);
    font-size:14px;
    line-height:1.55;}
.modal-close{top:14px;
    right:14px;
    width:36px;
    height:36px;
    border-radius:10px;
    font-size:25px;}
.modal-actions{padding-top:18px;
    margin-top:20px;
    border-top:1px solid rgba(255,255,255,.06);}
.modal-card{border-radius:14px;
    border-color:var(--border-soft);
    background:rgba(255,255,255,.02);}
/* Page content */
.content-section{line-height:1.7;}
.markdown-content h2,
.content-section h2{margin-top:28px;
    margin-bottom:10px;}
.markdown-content h3,
.content-section h3{margin-top:22px;
    margin-bottom:8px;}
.markdown-content p,
.content-section p{margin-bottom:12px;}
.empty-page-card{max-width:720px;
    padding:22px;}
/* Dashboard */
.dashboard-card{padding:18px;}
.dashboard-card + .dashboard-card{margin-top:16px;}
.dashboard-card__head,
.dashboard-card__subhead{display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;}
.dashboard-card__subhead{color:var(--text-secondary);
    font-size:12px;
    font-weight:650;}
.dashboard-stats-grid{display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    gap:12px;
    margin-top:16px;}
.dashboard-stat-card,
.dashboard-chart-card,
.dashboard-dept-card{border:1px solid rgba(255,255,255,.065);
    border-radius:14px;
    background:rgba(0,0,0,.12);}
.dashboard-stat-card{grid-column:span 3;
    padding:14px;}
.dashboard-stat-card__label{color:var(--text-muted);
    font-size:12px;
    line-height:1.35;}
.dashboard-stat-card__value{margin-top:6px;
    font-size:28px;
    font-weight:800;
    line-height:1;}
.dashboard-stat-pair{display:flex;
    gap:9px;
    align-items:baseline;
    margin-top:6px;
    font-size:23px;
    font-weight:800;}
.dashboard-stat-pair__sep{color:var(--text-muted);
    font-weight:500;}
.dashboard-chart-card{grid-column:span 8;
    padding:14px;}
.dashboard-dept-card{grid-column:span 4;
    padding:14px;}
.dashboard-chart-wrap{margin-top:12px;
    min-height:140px;}
.dashboard-chart-wrap canvas{display:block;
    width:100%;
    max-width:100%;}
.dashboard-dept-list{display:flex;
    flex-direction:column;
    gap:10px;
    margin-top:12px;}
.dashboard-dept-row{display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
    align-items:center;}
.dashboard-dept-row__main{min-width:0;}
.dashboard-dept-row__name{overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:rgba(255,255,255,.86);
    font-size:13px;}
.dashboard-dept-row__bar{height:6px;
    margin-top:5px;
    overflow:hidden;
    border-radius:999px;
    background:rgba(255,255,255,.09);}
.dashboard-dept-row__fill{height:100%;
    border-radius:inherit;
    background:rgba(255,255,255,.72);}
.dashboard-dept-row__value{color:rgba(255,255,255,.88);
    font-size:13px;
    font-weight:800;}
.dashboard-danger-card{margin-top:16px;}
.dashboard-danger-copy{max-width:900px;}
.dashboard-danger-actions{display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
    margin-top:14px;}
.dashboard-danger-status{margin-left:auto;
    font-size:13px;}
/* Admin hub */
.admin-hub-card{padding:18px;}
.admin-hub-grid{display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:14px;}
.admin-hub-link{display:flex;
    flex-direction:column;
    gap:5px;
    min-height:92px;
    padding:16px;
    border:1px solid var(--border-soft);
    border-radius:14px;
    background:rgba(255,255,255,.025);
    color:var(--text-primary);
    text-decoration:none;}
.admin-hub-link:hover{opacity:1;
    background:rgba(255,255,255,.05);
    border-color:var(--border-strong);
    transform:translateY(-1px);}
.admin-hub-link--primary{border-color:rgba(54,80,178,.55);
    background:rgba(45,63,143,.16);}
.admin-hub-link strong{font-size:15px;
    line-height:1.25;}
.admin-hub-link span{color:var(--text-muted);
    font-size:12px;
    line-height:1.4;}
/* Profile final normalization: standalone selects/buttons now match the rest of the site. */
/* Applications/cards */
.application-card,
.admin-announce,
.apply-announce,
.apply-status,
.status-card,
.stat-card,
.feature-card,
.how-item,
.final-cta{border-color:var(--border-soft);}
.filter-btn{min-height:38px;
    padding:8px 13px;
    border-radius:9px;}
.filter-btn.active{border-color:var(--accent-blue);
    background:var(--accent-blue);}
/* Pagination */
.pagination-btn{min-width:38px;
    height:38px;
    border-radius:9px;
    border-color:var(--border-soft);}
/* Correct the old global link pseudo selector: never attach decorative icons automatically. */
a[href]::after{content:none;}
@media (max-width: 980px){
.content-page{padding-left:16px;
        padding-right:16px;}
.dashboard-stat-card{grid-column:span 6;}
.dashboard-chart-card,
    .dashboard-dept-card{grid-column:span 12;}
}
@media (max-width: 720px){
.page-header--with-actions{align-items:stretch;
        flex-direction:column;}
.page-actions{width:100%;}
.page-actions > .btn-primary,
    .page-actions > .btn-secondary{flex:1 1 auto;}
.admin-hub-grid{grid-template-columns:1fr;}
.dashboard-stats-grid{grid-template-columns:1fr;}
.dashboard-stat-card,
    .dashboard-chart-card,
    .dashboard-dept-card{grid-column:auto;}
.dashboard-danger-actions{align-items:stretch;
        flex-direction:column;}
.dashboard-danger-actions > button{width:100%;}
.dashboard-danger-status{margin-left:0;}
.toolbar-filters,
    .toolbar-filters .form-input{width:100%;
        min-width:0;}
.modal{padding:12px;}
.modal-content,
    .modal-content-large{width:100%;
        max-width:100%;
        max-height:calc(100vh - 24px);
        padding:20px 16px;
        border-radius:16px;}
.modal-actions{align-items:stretch;
        flex-direction:column-reverse;}
.modal-actions > button,
    .modal-actions > a{width:100%;}
}
@media (max-width: 480px){
.content-page{margin-top:8px;
        padding-left:12px;
        padding-right:12px;}
.page-title,
    .page-title-large{font-size:25px;}
.admin-pages-toolbar,
    .admin-members-toolbar,
    .admin-panel-toolbar{padding:10px;}
.btn,
    .btn-primary,
    .btn-secondary,
    .btn-danger,
    .btn-success,
    .btn-view,
    .btn-submit{min-height:40px;}
}
/* Small reusable layout helpers introduced during final cleanup. */
.form-group--flush{margin:0 !important;}
.form-group--compact-top{margin-top:10px;}
.member-profile-card--spaced{margin-bottom:14px;}
.member-profile-card__title--row{display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;}
.member-section-block{margin-top:14px;}
.member-section-label{display:block;
    margin-bottom:8px;
    font-size:13px;
    font-weight:650;}
.info-card--spaced{margin-top:14px;}
.member-info-details{padding:0;overflow:hidden;}
.member-info-details__summary{min-height:44px;
    padding:12px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    cursor:pointer;
    list-style:none;
    color:var(--text-muted);
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    user-select:none;}
.member-info-details__summary::-webkit-details-marker{display:none;}
.member-info-details__summary:hover{color:var(--text-primary);background:rgba(255,255,255,.025);}
.member-info-details__summary svg{flex:0 0 auto;transition:transform .16s ease;}
.member-info-details[open] .member-info-details__summary svg{transform:rotate(180deg);}
.member-info-details__body{padding:0 12px 12px;}
.info-card__title--spaced{margin-top:14px;}
.modal-warning{margin-top:8px;
    color:var(--text-muted);
    font-size:13px;}
.secret-question{min-height:var(--control-h);
    padding:10px 12px;
    border:1px solid var(--border-soft);
    border-radius:10px;
    background:rgba(255,255,255,.035);
    color:var(--text-primary);
    font-weight:750;}
.status-actions--spaced{margin-top:10px;}
.policy-meta{margin-top:0;
    color:var(--text-muted);}
.policy-foot{margin-bottom:0;
    color:var(--text-muted);}
.markdown-preview-empty{padding:20px;
    color:var(--text-muted);
    text-align:center;}
.page-title--after-breadcrumbs{margin-top:10px;}
.toolbar-filter-select{min-width:240px;}
.ui-inline-state{padding:4px 0;
    color:var(--text-muted);
    font-size:13px;
    line-height:1.4;}
.ui-inline-state--error{color:#ff8f87;}
.tree-empty-state{padding:8px 10px;
    color:var(--text-muted);
    font-size:12px;}
.table-state-cell{padding:36px 20px !important;
    text-align:center !important;
    color:var(--text-muted) !important;}
.table-state-cell--error{color:#ff8f87 !important;}
.status-inline-success{color:#4caf50;
    font-weight:700;}
/* Unified toast notifications (previously each admin module hard-coded its own box). */
.notification{position:fixed;
    top:20px;
    right:20px;
    z-index:10000;
    width:min(400px, calc(100vw - 40px));
    padding:13px 16px;
    border:1px solid var(--border-soft);
    border-radius:12px;
    background:#1a2130;
    color:#fff;
    box-shadow:0 16px 42px rgba(0,0,0,.38);
    font-size:13px;
    font-weight:650;
    line-height:1.45;
    animation:slideInRight .24s var(--ease);}
.notification-success{border-color:rgba(76,175,80,.38);
    background:linear-gradient(180deg, rgba(76,175,80,.18), rgba(41,41,41,.98));}
.notification-error{border-color:rgba(244,67,54,.42);
    background:linear-gradient(180deg, rgba(244,67,54,.18), rgba(41,41,41,.98));}
.notification-warning{border-color:rgba(255,193,7,.38);
    background:linear-gradient(180deg, rgba(255,193,7,.13), rgba(41,41,41,.98));}
.notification.is-leaving{animation:slideOutRight .24s var(--ease) forwards;}
@media (max-width:720px){
.toolbar-filter-select{min-width:0;
        width:100%;}
.notification{top:12px;
        right:12px;
        width:calc(100vw - 24px);}
}
.ui-dash{opacity:.6;}
.tree-item-icon--muted{opacity:.5;}
.join-step__text{min-width:0;}
.status-actions{display:flex; flex-direction:column; gap:8px;}
.modal-form{width:100%;}
.member-qualifications,
.member-ranks{min-width:0;}
.activity-meta{color:var(--text-muted); font-size:12px;}
.mobile-nav-sheet__body{min-width:0;}
.group-cat-body{min-width:0;}
@keyframes slideOutRight{from{ transform:translateX(0); opacity:1; }
    to{ transform:translateX(110%); opacity:0; }}
/* =========================================================
   UI regression hotfix — toast / profile editor / role picker
   ========================================================= */
/* A previous toast override set top but left the old bottom value alive.
   With position:fixed + auto height that stretches the toast vertically. */
.notification{top: calc(var(--top-bar-height) + 12px);
    right: 20px;
    bottom: auto;
    left: auto;
    width: min(400px, calc(100vw - 40px));
    height: auto;
    min-height: 0;
    max-height: min(45vh, 280px);
    overflow: auto;
    display: block;
    padding: 13px 16px;}
/* Profile editor: keep the dialog inside the viewport and never allow
   crop widgets/native inputs to force horizontal scrolling. */
#profileEditModal{overflow: hidden;}
#profileEditModalContent.modal-content-wide{width: min(94vw, 920px);
    max-width: 920px;
    max-height: calc(100dvh - 40px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;}
#profileEditModalContent .modal-form,
#profileEditModalContent .profile-edit-layout,
#profileEditModalContent .profile-media-card,
#profileEditModalContent .profile-crop-row,
#profileEditModalContent .profile-crop-controls,
#profileEditModalContent .profile-actions-grid,
#profileEditModalContent label{min-width: 0;
    max-width: 100%;}
/* Banner uses preview + controls side by side when there is enough room. */
/* The avatar card itself is only ~360px wide; keeping a second 260px
   column beside a square 220px cropper was the overflow source. */
/* Role picker should read like a compact popover, not a floating empty box. */
@media (max-width: 900px){
#profileEditModalContent.modal-content-wide{width: min(94vw, 640px);
        max-width: 640px;}
}
@media (max-width: 720px){
.notification{top: calc(var(--top-bar-height) + 8px);
        right: 12px;
        bottom: auto;
        width: calc(100vw - 24px);
        max-height: 35vh;}
#profileEditModalContent.modal-content-wide{width: 100%;
        max-width: 100%;
        max-height: calc(100dvh - 24px);
        padding: 20px 16px;}
}
/* Custom localised file picker for the profile editor. */
/* Profile role picker: avoid native empty/white dropdown artifacts and show a clear state. */
/* =========================================================
   PROFILE HEADER GEOMETRY — final cleanup
   Keep the header flat and aligned; no floating dark panel.
   ========================================================= */
/* The role picker becomes part of the document flow instead of overlaying stats. */
/* PROFILE HEADER HOTFIX: keep avatar fully below the banner */
/* =========================================================
   GROUP PERMISSIONS PICKER
   ========================================================= */
.group-permissions-count,
.group-permission-count-badge{display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:5px 10px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.09);
    background:rgba(255,255,255,.04);
    color:var(--text-secondary);
    font-size:12px;
    font-weight:700;
    white-space:nowrap;}
.group-permission-section{border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.02);
    border-radius:16px;
    padding:12px;
    min-width:0;}
.group-permission-section-head{display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:10px;}
.group-permission-section-head>div:first-child{display:flex;align-items:center;gap:8px;min-width:0;}
.group-permission-section-title{font-size:13px;font-weight:800;color:var(--text-primary);}
.group-permission-section-count{font-size:11px;color:var(--text-muted);}
.group-permission-section-toggle{border:0;
    background:transparent;
    color:var(--accent-blue);
    font:inherit;
    font-size:11px;
    font-weight:700;
    cursor:pointer;
    padding:4px 0;
    white-space:nowrap;}
.group-permission-items{display:flex;flex-direction:column;gap:7px;}
.group-permission-item{display:grid;
    grid-template-columns:18px minmax(0,1fr);
    gap:10px;
    align-items:flex-start;
    padding:10px;
    border-radius:12px;
    border:1px solid transparent;
    cursor:pointer;
    transition:background .16s ease,border-color .16s ease;}
.group-permission-item:hover{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.07);}
.group-permission-item:has(input:checked){background:rgba(65,104,255,.08);border-color:rgba(65,104,255,.25);}
.group-permission-checkbox{margin:2px 0 0;width:16px;height:16px;accent-color:var(--accent-blue);}
.group-permission-copy{display:flex;flex-direction:column;gap:3px;min-width:0;}
.group-permission-label{font-size:13px;font-weight:700;color:var(--text-primary);}
.group-permission-desc{font-size:11px;line-height:1.4;color:var(--text-muted);}
.group-permission-key{font-size:10px;color:rgba(255,255,255,.35);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere;}
/* Real profile images in admin member/application lists */
.member-avatar-small,
.application-card-avatar,
.application-avatar{overflow:hidden;}
.member-avatar-small img,
.application-card-avatar img,
.application-avatar img{width:100%;
    height:100%;
    display:block;
    object-fit:cover;}
/* =========================================================
   FAQ
   ========================================================= */
.faq-intro{max-width:760px;
    color:var(--text-secondary);
    line-height:1.65;
    margin:0 0 24px;}
.faq-section{margin-top:28px;}
.faq-section:first-of-type{margin-top:0;}
.faq-section-head{margin-bottom:12px;}
.faq-section-title{margin:0;font-size:20px;font-weight:800;color:var(--text-primary);}
.faq-section-desc{margin-top:5px;font-size:13px;color:var(--text-muted);}
.faq-list{display:flex;flex-direction:column;gap:9px;}
.faq-item{border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.025);
    border-radius:16px;
    overflow:hidden;}
.faq-item[open]{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.12);}
.faq-question{list-style:none;
    cursor:pointer;
    position:relative;
    padding:15px 46px 15px 16px;
    font-size:14px;
    font-weight:750;
    color:var(--text-primary);
    user-select:none;}
.faq-question::-webkit-details-marker{display:none;}
.faq-question::after{content:"+";
    position:absolute;
    right:16px;
    top:50%;
    transform:translateY(-50%);
    width:24px;
    height:24px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    background:rgba(255,255,255,.05);
    color:var(--text-secondary);
    font-size:18px;
    line-height:1;}
.faq-item[open]>.faq-question::after{content:"−";}
.faq-answer{padding:0 16px 16px;
    color:var(--text-secondary);
    line-height:1.65;
    font-size:14px;}
.faq-answer p{margin:0 0 10px;}
.faq-answer p:last-child{margin-bottom:0;}
.faq-answer ul{margin:8px 0 0;padding-left:20px;}
.faq-answer li+li{margin-top:5px;}
.faq-answer a{color:var(--accent-blue);text-decoration:none;}
.faq-answer a:hover{text-decoration:underline;}
/* =========================================================
   GROUP MANAGEMENT POLISH
   ========================================================= */
.refresh-groups-btn{display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:38px;
    padding:8px 13px;}
.refresh-groups-btn svg{flex:0 0 auto;}
/* Custom checkbox used by group permissions / page access. */
.group-permission-item,
.group-page-item,
.group-default-toggle{position:relative;}
.group-permission-item > input[type="checkbox"],
.group-page-item > input[type="checkbox"],
.group-default-toggle > input[type="checkbox"]{position:absolute;
    opacity:0;
    pointer-events:none;
    width:1px;
    height:1px;}
.ui-checkmark{width:20px;
    height:20px;
    flex:0 0 20px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:6px;
    border:1px solid rgba(255,255,255,.18);
    background:rgba(255,255,255,.035);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
    transition:border-color .16s ease, background .16s ease, box-shadow .16s ease;}
.group-permission-item:hover .ui-checkmark,
.group-page-item:hover .ui-checkmark,
.group-default-toggle:hover .ui-checkmark{border-color:rgba(96,145,255,.72);
    background:rgba(77,103,255,.08);}
.group-permission-item > input[type="checkbox"]:focus-visible + .ui-checkmark,
.group-page-item > input[type="checkbox"]:focus-visible + .ui-checkmark,
.group-default-toggle > input[type="checkbox"]:focus-visible + .ui-checkmark{outline:2px solid rgba(74,158,255,.55);
    outline-offset:2px;}
.group-permission-item > input[type="checkbox"]:checked + .ui-checkmark,
.group-page-item > input[type="checkbox"]:checked + .ui-checkmark,
.group-default-toggle > input[type="checkbox"]:checked + .ui-checkmark{background:var(--accent-blue, #3467d6);
    border-color:var(--accent-blue, #3467d6);}
.group-permission-item > input[type="checkbox"]:checked + .ui-checkmark::after,
.group-page-item > input[type="checkbox"]:checked + .ui-checkmark::after,
.group-default-toggle > input[type="checkbox"]:checked + .ui-checkmark::after{content:"";
    width:6px;
    height:10px;
    border-right:2px solid #fff;
    border-bottom:2px solid #fff;
    transform:translateY(-1px) rotate(45deg);}
.group-permission-item > input[type="checkbox"]:disabled + .ui-checkmark{opacity:.48;}
.group-permission-section{border:1px solid rgba(255,255,255,.075);
    border-radius:16px;
    overflow:hidden;
    background:rgba(255,255,255,.018);}
.group-permission-section-head{padding:12px 14px;
    background:rgba(255,255,255,.025);
    border-bottom:1px solid rgba(255,255,255,.06);}
.group-permission-section-title{font-weight:800;}
.group-permission-section-count{margin-top:3px;color:var(--text-muted);font-size:12px;}
.group-permission-section-toggle{border:1px solid rgba(255,255,255,.11);
    background:rgba(255,255,255,.035);
    color:var(--text-primary);
    border-radius:9px;
    padding:7px 10px;
    cursor:pointer;
    font-weight:700;}
.group-permission-section-toggle:hover{background:rgba(255,255,255,.07);}
.group-permission-items{display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    padding:10px;}
.group-permission-item{display:grid;
    grid-template-columns:20px minmax(0,1fr);
    align-items:start;
    gap:10px;
    padding:11px 12px;
    border:1px solid rgba(255,255,255,.065);
    border-radius:12px;
    background:rgba(255,255,255,.02);
    cursor:pointer;}
.group-permission-item:hover{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.11);}
.group-permission-copy{min-width:0;display:flex;flex-direction:column;gap:3px;}
.group-permission-label{font-size:13px;font-weight:800;line-height:1.3;}
.group-permission-desc{font-size:12px;color:var(--text-muted);line-height:1.35;}
.group-permission-key{font-size:11px;color:rgba(255,255,255,.42);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere;}
.group-pages-grid{gap:10px;}
.group-cat-card{border:1px solid rgba(255,255,255,.075);
    border-radius:15px;
    background:rgba(255,255,255,.018);
    overflow:hidden;}
.group-cat-title{padding:11px 13px;
    background:rgba(255,255,255,.025);
    border-bottom:1px solid rgba(255,255,255,.06);
    font-weight:800;}
.group-cat-body{padding:10px;}
.group-topic-block + .group-topic-block{margin-top:10px;}
.group-topic-title{font-size:12px;font-weight:800;color:var(--text-muted);margin:0 0 7px;}
.group-topic-pages{display:grid;gap:6px;}
.group-page-item{display:grid;
    grid-template-columns:20px minmax(0,1fr);
    align-items:center;
    gap:9px;
    min-height:40px;
    padding:8px 10px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:10px;
    background:rgba(255,255,255,.018);
    cursor:pointer;}
.group-page-item:hover{background:rgba(255,255,255,.04);}
.group-page-title{min-width:0;line-height:1.3;}
/* Page/category/topic group access: one consistent non-floating picker. */
#categoryModal .pages-list,
#topicModal .pages-list,
#pageModal .pages-list{padding:0;
    border:0;
    background:transparent;}
#categoryModal .group-picker,
#topicModal .group-picker,
#pageModal .group-picker{display:block;
    padding:12px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:14px;
    background:rgba(255,255,255,.022);}
#categoryModal .group-picker__header,
#topicModal .group-picker__header,
#pageModal .group-picker__header{display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:10px;}
#categoryModal .group-picker__title,
#topicModal .group-picker__title,
#pageModal .group-picker__title{font-size:13px;
    font-weight:800;
    color:var(--text-primary);}
#categoryModal .group-picker__add,
#topicModal .group-picker__add,
#pageModal .group-picker__add{width:auto !important;
    height:34px !important;
    min-width:0 !important;
    padding:0 11px !important;
    border-radius:9px !important;
    border:1px solid rgba(255,255,255,.11) !important;
    background:rgba(255,255,255,.035) !important;
    color:var(--text-primary) !important;
    font-size:12px !important;
    font-weight:800 !important;
    white-space:nowrap;}
#categoryModal .group-picker__add:hover,
#topicModal .group-picker__add:hover,
#pageModal .group-picker__add:hover{background:rgba(255,255,255,.07) !important;}
#categoryModal .group-picker__list,
#topicModal .group-picker__list,
#pageModal .group-picker__list{display:flex !important;
    flex-wrap:wrap;
    gap:7px !important;
    min-height:38px;
    max-height:none !important;
    overflow:visible !important;}
#categoryModal .group-picker__empty,
#topicModal .group-picker__empty,
#pageModal .group-picker__empty{width:100%;
    padding:10px 11px;
    border:1px dashed rgba(255,255,255,.09);
    border-radius:10px;
    color:var(--text-muted);
    font-size:12px;}
#categoryModal .group-pill,
#topicModal .group-pill,
#pageModal .group-pill{display:inline-flex !important;
    width:auto !important;
    align-items:center;
    gap:7px;
    min-height:32px;
    padding:5px 8px 5px 7px !important;
    border-radius:999px !important;
    border:1px solid rgba(255,255,255,.10) !important;
    border-left:1px solid rgba(255,255,255,.10) !important;
    background:rgba(255,255,255,.035) !important;}
#categoryModal .group-pill__check,
#topicModal .group-pill__check,
#pageModal .group-pill__check{width:18px;height:18px;flex:0 0 18px;border-radius:50%;}
#categoryModal .group-pill__remove,
#topicModal .group-pill__remove,
#pageModal .group-pill__remove{position:static !important;
    transform:none !important;
    width:20px !important;
    height:20px !important;
    margin-left:1px;}
#categoryModal .group-picker__popover,
#topicModal .group-picker__popover,
#pageModal .group-picker__popover{position:static !important;
    width:100% !important;
    max-width:none !important;
    margin-top:10px !important;
    padding:10px !important;
    border:1px solid rgba(255,255,255,.085) !important;
    border-radius:12px !important;
    background:rgba(0,0,0,.14) !important;
    box-shadow:none !important;}
#categoryModal .group-picker__grid,
#topicModal .group-picker__grid,
#pageModal .group-picker__grid{display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px !important;
    max-height:260px;
    overflow:auto;}
#categoryModal .group-check,
#topicModal .group-check,
#pageModal .group-check{min-height:38px;
    padding:8px 10px !important;
    border-radius:10px !important;
    background:rgba(255,255,255,.025) !important;
    border:1px solid rgba(255,255,255,.07) !important;
    font-size:12px;}
#categoryModal .group-check:hover,
#topicModal .group-check:hover,
#pageModal .group-check:hover{background:rgba(255,255,255,.055) !important;}
@media (max-width:760px){
.group-permission-items{grid-template-columns:1fr;}
#categoryModal .group-picker__grid,
    #topicModal .group-picker__grid,
    #pageModal .group-picker__grid{grid-template-columns:1fr !important;}
#categoryModal .group-picker__header,
    #topicModal .group-picker__header,
    #pageModal .group-picker__header{align-items:stretch;flex-direction:column;}
}
/* Service fields from member profile lists */
#editMemberModal .member-ranks-grid--service{grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;}
#editMemberModal .member-ranks-grid--service .form-group{min-width:0;}
#editMemberModal .member-ranks-grid--service select{width:100%;}
@media (max-width:820px){
#editMemberModal .member-ranks-grid--service{grid-template-columns:1fr;}
}
#categoryModal .group-picker__search,
#topicModal .group-picker__search,
#pageModal .group-picker__search{margin:8px 0;}
#categoryModal .group-picker__search-input,
#topicModal .group-picker__search-input,
#pageModal .group-picker__search-input{width:100%;
    min-height:38px;
    padding:8px 11px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:10px;
    background:rgba(255,255,255,.025);
    color:var(--text-primary);
    outline:none;}
#categoryModal .group-picker__search-input:focus,
#topicModal .group-picker__search-input:focus,
#pageModal .group-picker__search-input:focus{border-color:rgba(74,158,255,.62);
    box-shadow:0 0 0 3px rgba(74,158,255,.10);}
#categoryModal .group-picker__pop-actions,
#topicModal .group-picker__pop-actions,
#pageModal .group-picker__pop-actions{display:flex;
    justify-content:flex-end;
    margin-top:9px;}
/* =========================================================
   GROUP PERMISSIONS — card selection, no checkboxes
   ========================================================= */
#groupModal .modal-content-large{width:min(96vw, 1320px);
    max-width:1320px;}
#groupModal .group-permission-items{display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;}
#groupModal .group-permission-item{appearance:none;
    -webkit-appearance:none;
    width:100%;
    min-height:96px;
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    gap:11px;
    align-items:start;
    padding:13px 14px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:14px;
    background:rgba(255,255,255,.022);
    color:var(--text-primary);
    font:inherit;
    text-align:left;
    cursor:pointer;
    transition:background .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease;}
#groupModal .group-permission-item:hover:not(:disabled){background:rgba(255,255,255,.045);
    border-color:rgba(255,255,255,.14);
    transform:translateY(-1px);}
#groupModal .group-permission-item:focus-visible{outline:none;
    border-color:rgba(74,126,255,.72);
    box-shadow:0 0 0 3px rgba(74,126,255,.17);}
#groupModal .group-permission-item.is-selected{background:linear-gradient(180deg,rgba(61,105,255,.17),rgba(61,105,255,.09));
    border-color:rgba(78,122,255,.48);
    box-shadow:inset 0 0 0 1px rgba(78,122,255,.08);}
#groupModal .group-permission-item:disabled{cursor:default;
    opacity:.68;}
#groupModal .group-permission-state{width:30px;
    height:30px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.10);
    background:rgba(255,255,255,.035);
    color:var(--text-muted);
    font-size:16px;
    font-weight:900;
    line-height:1;}
#groupModal .group-permission-item.is-selected .group-permission-state{background:var(--accent-blue);
    border-color:var(--accent-blue);
    color:#fff;}
#groupModal .group-permission-copy{padding-top:1px;}
#groupModal .group-permission-label{font-size:14px;
    line-height:1.28;}
#groupModal .group-permission-desc{font-size:12px;
    line-height:1.45;}
#groupModal .group-permission-key{margin-top:2px;
    font-size:10px;}
@media (max-width:1100px){
#groupModal .group-permission-items{grid-template-columns:1fr;}
}
@media (max-width:820px){
#groupModal .modal-content-large{width:calc(100vw - 20px);}
}
/* Applications: wider review workspace */
#viewApplicationModal .modal-content.modal-content-large{width: min(96vw, 1520px) !important;
    max-width: 1520px !important;
    max-height: 94vh !important;
    padding: 24px 26px !important;}
#viewApplicationModal .application-view{padding-right: 10px;}
@media (min-width: 1180px){
#viewApplicationModal .application-questions{grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;}
}
@media (max-width: 760px){
#viewApplicationModal .modal-content.modal-content-large{width: calc(100vw - 20px) !important;
        padding: 18px 16px !important;}
}
/* Unified refresh action used across admin lists */
.refresh-action-btn{display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:40px;
    padding:9px 14px;
    white-space:nowrap;}
.refresh-action-btn svg{flex:0 0 auto;
    opacity:.9;
    transition:transform .22s ease, opacity .22s ease;}
.refresh-action-btn:hover svg{transform:rotate(18deg);
    opacity:1;}
.refresh-action-btn:active svg{transform:rotate(42deg);}
/* Clear closed-state message on the public application page */
/* ============================================
   POLICY / COOKIE TABLE
   ============================================ */
.policy-content{max-width: 1000px;}
.policy-content > p,
.policy-content > ul,
.policy-content > ol{max-width: 860px;}
.policy-cookie-table-wrap{width: 100%;
    margin: 18px 0 20px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 14px;
    background: rgba(255,255,255,.025);
    box-shadow: 0 10px 30px rgba(0,0,0,.12);}
.policy-cookie-table{width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    margin: 0;
    font-size: 14px;
    line-height: 1.5;}
.policy-cookie-table__category{width: 20%;}
.policy-cookie-table__purpose{width: 31%;}
.policy-cookie-table__example{width: 22%;}
.policy-cookie-table__retention{width: 27%;}
.policy-cookie-table th,
.policy-cookie-table td{padding: 15px 16px;
    text-align: left;
    vertical-align: top;
    border: 0;
    overflow-wrap: break-word;
    word-break: normal;
    hyphens: none;}
.policy-cookie-table thead th{color: var(--text-primary);
    background: rgba(255,255,255,.055);
    border-bottom: 1px solid rgba(255,255,255,.10);
    font-size: 12px;
    font-weight: 750;
    line-height: 1.3;
    letter-spacing: .025em;
    text-transform: uppercase;}
.policy-cookie-table thead th + th,
.policy-cookie-table tbody td + td{border-left: 1px solid rgba(255,255,255,.075);}
.policy-cookie-table tbody tr + tr td{border-top: 1px solid rgba(255,255,255,.075);}
.policy-cookie-table tbody tr{transition: background-color .15s ease;}
.policy-cookie-table tbody tr:hover{background: rgba(255,255,255,.025);}
.policy-cookie-table tbody td{color: var(--text-secondary);}
.policy-cookie-table tbody td:first-child,
.policy-cookie-table tbody td strong{color: var(--text-primary);}
.policy-cookie-example{display: inline-block;
    padding: 4px 8px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 7px;
    background: rgba(255,255,255,.035);
    color: var(--text-primary);
    font-size: 13px;
    line-height: 1.35;}
@media (max-width: 760px){
.policy-content{max-width: 100%;}
.policy-cookie-table-wrap{overflow: visible;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;}
.policy-cookie-table,
    .policy-cookie-table tbody,
    .policy-cookie-table tr,
    .policy-cookie-table td{display: block;
        width: 100%;}
.policy-cookie-table colgroup,
    .policy-cookie-table thead{display: none;}
.policy-cookie-table tbody{display: grid;
        gap: 12px;}
.policy-cookie-table tbody tr{overflow: hidden;
        border: 1px solid rgba(255,255,255,.10);
        border-radius: 12px;
        background: rgba(255,255,255,.025);}
.policy-cookie-table tbody tr + tr td,
    .policy-cookie-table tbody td + td{border-left: 0;
        border-top: 1px solid rgba(255,255,255,.07);}
.policy-cookie-table td{display: grid;
        grid-template-columns: minmax(112px, 36%) 1fr;
        gap: 12px;
        padding: 12px 14px;}
.policy-cookie-table td::before{content: attr(data-label);
        color: var(--text-muted);
        font-size: 11px;
        font-weight: 750;
        line-height: 1.4;
        letter-spacing: .025em;
        text-transform: uppercase;}
}
@media (max-width: 430px){
.policy-cookie-table td{grid-template-columns: 1fr;
        gap: 5px;}
}
/* ========================================================================== */
/* MIRC TESTING SYSTEM                                                        */
/* ========================================================================== */
/* Header notifications */
.notification-center{position: relative;
    margin-left: auto;
    margin-right: 6px;}
.notification-toggle{position: relative;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 10px;
    background: rgba(255,255,255,.025);
    color: var(--text-secondary);
    cursor: pointer;}
.notification-toggle:hover,
.notification-toggle:focus-visible{background: rgba(255,255,255,.055);
    color: var(--text-primary);
    border-color: rgba(255,255,255,.14);}
.notification-badge{position: absolute;
    top: -5px;
    right: -6px;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--bg-tertiary);
    border-radius: 999px;
    background: #b94747;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;}
.notification-drawer-shell{position: fixed;
    inset: 0;
    z-index: 760;}
.notification-drawer-backdrop{position: absolute;
    inset: 0;
    border: 0;
    background: rgba(3, 8, 15, .54);
    opacity: 0;
    transition: opacity .2s ease;
    cursor: default;}
.notification-drawer{position: absolute;
    top: 0;
    right: 0;
    width: min(420px, 100vw);
    height: 100vh;
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, #101a28 0%, #0d1725 100%);
    border-left: 1px solid rgba(255,255,255,.08);
    box-shadow: -18px 0 42px rgba(0,0,0,.34);
    transform: translateX(100%);
    transition: transform .22s ease;}
.notification-drawer-shell.is-open .notification-drawer{transform: translateX(0);}
.notification-drawer-shell.is-open .notification-drawer-backdrop{opacity: 1;}
body.notification-drawer-open{overflow: hidden;}
.notification-drawer__head{display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    padding:16px 16px 14px;
    border-bottom:1px solid rgba(255,255,255,.08);}
.notification-drawer__titles{display:flex;flex-direction:column;gap:2px;min-width:0;}
.notification-drawer__titles strong{font-size:14px;line-height:1.2;color:#f4f7fb;}
.notification-drawer__titles span{font-size:12px;line-height:1.35;color:#8f9cb1;}
.notification-drawer__close{width:36px;
    height:36px;
    flex:0 0 36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid #334152;
    border-radius:10px;
    background:#1a2534;
    color:#d8e3f4;
    cursor:pointer;}
.notification-drawer__close:hover,
.notification-drawer__close:focus-visible{border-color:#4483e2;
    background:#22324a;
    color:#fff;}
.notification-drawer__controls{padding:12px 16px 14px;
    border-bottom:1px solid rgba(255,255,255,.06);
    display:flex;
    flex-direction:column;
    gap:12px;}
.notification-tabs{display:flex;
    gap:8px;
    flex-wrap:wrap;}
.notification-tab{padding:8px 11px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:10px;
    background:#121c2a;
    color:#aab6c8;
    font-size:12px;
    font-weight:700;
    cursor:pointer;}
.notification-tab:hover,
.notification-tab:focus-visible{border-color:#35598b;color:#e5ecf8;}
.notification-tab.is-active{background:#22375c;border-color:#3f6bad;color:#fff;box-shadow:0 0 0 1px rgba(86,137,209,.14) inset;}
.notification-read-all{align-self:flex-start;
    padding:8px 12px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:10px;
    background:#162131;
    color:#d7e4f7;
    font-size:12px;
    font-weight:700;
    cursor:pointer;}
.notification-read-all:hover,
.notification-read-all:focus-visible{border-color:#4e78b9;background:#20314b;color:#fff;}
.notification-list{flex:1;
    min-height:0;
    overflow-y:auto;
    padding:0 0 env(safe-area-inset-bottom, 0);}
.notification-item{display:grid;
    grid-template-columns: 28px 1fr;
    gap:12px;
    padding:14px 16px;
    border-bottom:1px solid rgba(255,255,255,.055);
    color:inherit;
    text-decoration:none;}
.notification-item:hover{background:rgba(255,255,255,.035);}
.notification-item__type{width:28px;
    height:28px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.08);
    border-radius:9px;
    background:#162131;
    color:#8fb8ff;
    font-size:12px;
    font-weight:800;}
.notification-item.is-unread .notification-item__type{color:#dbe9ff;
    border-color:rgba(86,137,209,.28);
    background:#22375c;}
.notification-item__body{min-width:0;display:flex;flex-direction:column;gap:3px;}
.notification-item strong{font-size:13px;line-height:1.35;color:var(--text-primary);}
.notification-item small{font-size:12px;line-height:1.45;color:var(--text-secondary);white-space:normal;}
.notification-item time{font-size:10px;color:var(--text-muted);}
.notification-empty{padding:48px 18px;text-align:center;color:#8f9cb1;font-size:13px;}
/* Shared tests UI */
.tests-page,
.admin-tests-page,
.admin-tests-history-page{max-width:1500px;}
.tests-kicker{display:inline-block;
    margin-bottom:5px;
    color:#9ba8de;
    font-size:11px;
    font-weight:800;
    letter-spacing:.075em;
    text-transform:uppercase;}
.tests-access-state,
.tests-entry-card,
.tests-preview-card,
.tests-active-card,
.test-runner,
.tests-history-section{border:1px solid rgba(255,255,255,.085);
    border-radius:14px;
    background:rgba(255,255,255,.018);}
.tests-access-state{padding:22px 24px;
    display:flex;
    flex-direction:column;
    gap:5px;}
.tests-access-state strong{font-size:16px;}
.tests-access-state span{color:var(--text-secondary);font-size:13px;}
.tests-access-state--blocked{border-color:rgba(185,71,71,.5);background:rgba(185,71,71,.07);}
.tests-entry-card{padding:24px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:22px;}
.tests-entry-card__copy h2,
.tests-preview-card h2,
.test-runner h2,
.tests-history-section h2{font-size:20px;line-height:1.25;margin:0;}
.tests-entry-card__copy p,
.tests-preview-card > p{margin-top:7px;color:var(--text-secondary);font-size:13px;}
.tests-entry-card code,
.tests-code-chip,
.test-code-mini{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
    letter-spacing:.06em;}
.tests-code-form{display:flex;align-items:stretch;gap:8px;}
.tests-code-form input{width:190px;
    min-height:44px;
    padding:0 14px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:9px;
    background:#131a24;
    color:#fff;
    font:800 17px/1 ui-monospace,SFMono-Regular,Consolas,monospace;
    letter-spacing:.12em;
    text-transform:uppercase;}
.tests-code-form input:focus{border-color:#667bd0;}
.tests-inline-message{grid-column:1/-1;padding:10px 12px;border-radius:8px;font-size:12px;}
.tests-inline-message.is-error{background:rgba(185,71,71,.10);border:1px solid rgba(185,71,71,.42);color:#e6adad;}
.tests-inline-message.is-success{background:rgba(76,175,80,.10);border:1px solid rgba(76,175,80,.36);color:#b9dfba;}
.tests-preview-card{margin-top:16px;padding:22px 24px;}
.tests-preview-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;}
.tests-code-chip,
.test-code-mini{display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:6px 9px;
    border:1px solid rgba(113,135,228,.30);
    border-radius:8px;
    background:rgba(113,135,228,.09);
    color:#c4cdf4;
    font-size:12px;
    font-weight:800;}
.tests-preview-meta{margin-top:17px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;}
.tests-preview-meta span,
.test-runner__meta{padding:7px 10px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:8px;
    background:rgba(255,255,255,.025);
    color:var(--text-secondary);
    font-size:12px;}
.tests-preview-meta strong{color:var(--text-primary);}
.tests-preview-actions{margin-top:20px;display:flex;justify-content:flex-end;gap:8px;}
.tests-active-card{margin-top:16px;
    padding:18px 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;}
.tests-active-card h3{font-size:16px;margin:0 0 3px;}
.tests-active-card p{font-size:12px;color:var(--text-secondary);margin:0;}
.tests-active-card__side{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.test-status-badge{display:inline-flex;
    align-items:center;
    min-height:25px;
    padding:3px 8px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:999px;
    background:rgba(255,255,255,.035);
    color:var(--text-secondary);
    font-size:10px;
    font-weight:800;
    white-space:nowrap;}
.status-passed{border-color:rgba(76,175,80,.33);background:rgba(76,175,80,.09);color:#b8dcb9;}
.status-failed,.status-frozen{border-color:rgba(185,71,71,.38);background:rgba(185,71,71,.09);color:#e5b0b0;}
.status-pending_review{border-color:rgba(255,193,7,.30);background:rgba(255,193,7,.075);color:#dfce91;}
.status-in_progress{border-color:rgba(113,135,228,.35);background:rgba(113,135,228,.09);color:#c1c9ef;}
.status-cancelled{color:#969696;}
/* Runner */
.test-runner{position:relative;margin-top:18px;padding:24px;overflow:hidden;}
.test-runner__top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;}
.test-runner__timer{min-width:96px;
    padding:9px 13px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:10px;
    background:#131a24;
    text-align:center;
    font:800 20px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;
    letter-spacing:.05em;}
.test-runner__timer.is-low{border-color:rgba(185,71,71,.5);color:#e39c9c;background:rgba(185,71,71,.07);}
.test-runner__progress{height:5px;margin:19px 0 9px;border-radius:999px;background:rgba(255,255,255,.065);overflow:hidden;}
.test-runner__progress span{display:block;height:100%;width:0;border-radius:inherit;background:#6072be;transition:width .2s ease;}
.test-runner__meta{display:inline-flex;padding:4px 8px;}
.test-runner__notice{margin-top:12px;padding:10px 12px;border:1px solid rgba(185,71,71,.35);border-radius:8px;background:rgba(185,71,71,.07);color:#e3b2b2;font-size:12px;}
.test-question-card{margin-top:18px;
    padding:23px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:12px;
    background:rgba(0,0,0,.12);}
.test-question-card__head{display:flex;align-items:center;flex-wrap:wrap;gap:7px 12px;margin-bottom:14px;color:var(--text-muted);font-size:11px;}
.test-question-section{color:#aeb9e9;font-weight:700;}
.test-question-card h3{margin:0 0 18px;font-size:18px;line-height:1.5;white-space:pre-wrap;}
.test-question-image{display:block;max-width:min(720px,100%);max-height:460px;object-fit:contain;margin:0 0 18px;border:1px solid rgba(255,255,255,.09);border-radius:10px;background:#131a24;}
.test-options{display:grid;gap:9px;}
.test-options--boolean{grid-template-columns:repeat(2,minmax(0,1fr));}
.test-option{position:relative;display:flex;align-items:flex-start;gap:11px;padding:13px 14px;border:1px solid rgba(255,255,255,.09);border-radius:10px;background:rgba(255,255,255,.018);cursor:pointer;transition:border-color .16s ease,background .16s ease;}
.test-option:hover{border-color:rgba(113,135,228,.34);background:rgba(113,135,228,.045);}
.test-option input{position:absolute;opacity:0;pointer-events:none;}
.test-option__control{width:18px;height:18px;flex:0 0 18px;margin-top:2px;border:1px solid #626262;border-radius:5px;background:#1a2130;position:relative;}
.test-option input[type="radio"] + .test-option__control{border-radius:50%;}
.test-option input:checked + .test-option__control{border-color:#7386d8;background:#5365ae;}
.test-option input:checked + .test-option__control::after{content:"";position:absolute;inset:4px;border-radius:2px;background:#fff;}
.test-option input[type="radio"]:checked + .test-option__control::after{border-radius:50%;}
.test-option:has(input:checked){border-color:rgba(113,135,228,.50);background:rgba(113,135,228,.07);}
.test-option__content{display:flex;align-items:center;gap:12px;min-width:0;color:var(--text-primary);font-size:13px;line-height:1.5;}
.test-option__content img{width:92px;height:66px;object-fit:cover;border-radius:7px;border:1px solid rgba(255,255,255,.08);}
.test-answer-hint{display:block;margin-top:8px;color:var(--text-muted);font-size:11px;}
.test-text-answer{width:100%;min-height:44px;padding:11px 12px;border:1px solid rgba(255,255,255,.10);border-radius:9px;background:#131a24;color:#fff;resize:vertical;}
.test-runner__actions{margin-top:17px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.test-runner__actions-right{display:flex;align-items:center;justify-content:flex-end;gap:8px;}
.test-save-state{min-width:70px;text-align:right;color:var(--text-muted);font-size:11px;}
.test-freeze-overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(16,16,16,.88);backdrop-filter:blur(5px);}
.test-freeze-overlay__card{width:min(520px,100%);padding:25px;border:1px solid rgba(185,71,71,.45);border-radius:14px;background:#242020;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.45);}
.test-freeze-overlay__card strong{display:block;font-size:20px;margin-bottom:7px;}
.test-freeze-overlay__card p{margin:0 0 17px;color:#c8b4b4;font-size:13px;}
/* User history */
.tests-history-section{margin-top:22px;padding:22px 24px;}
.tests-section-head{margin-bottom:15px;}
.tests-history-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.tests-history-card{padding:15px 16px;border:1px solid rgba(255,255,255,.075);border-radius:10px;background:rgba(255,255,255,.017);}
.tests-history-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
.tests-history-card__top strong{font-size:13px;line-height:1.4;}
.tests-history-card__meta{margin-top:10px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--text-muted);font-size:11px;}
.tests-history-empty{padding:16px;border:1px dashed rgba(255,255,255,.10);border-radius:9px;color:var(--text-muted);font-size:12px;text-align:center;}
/* Admin tests */
.admin-tests-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;}
.admin-tests-tabs{display:flex;gap:4px;margin-bottom:16px;padding:4px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.018);width:max-content;max-width:100%;}
.admin-tests-tab{padding:9px 13px;border:0;border-radius:7px;background:transparent;color:var(--text-muted);font-size:12px;font-weight:700;cursor:pointer;}
.admin-tests-tab:hover{color:var(--text-primary);background:rgba(255,255,255,.035);}
.admin-tests-tab.is-active{background:#343a54;color:#fff;}
.admin-tests-panel{display:none;}
.admin-tests-panel.is-active{display:block;}
.admin-tests-panel-title{font-size:17px;margin:0;}
.admin-tests-filterbar{display:grid;grid-template-columns:minmax(220px,1.2fr) minmax(170px,.8fr) minmax(150px,.7fr) minmax(160px,.7fr) auto;gap:8px;margin-bottom:13px;align-items:center;}
.tests-admin-table td,.tests-results-table td{vertical-align:middle;}
.table-subtext{display:block;margin-top:3px;color:var(--text-muted);font-size:10px;}
.test-access-mode{display:block;color:var(--text-secondary);font-size:11px;margin-bottom:4px;}
.test-pending-count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 6px;border-radius:999px;background:rgba(255,193,7,.09);border:1px solid rgba(255,193,7,.25);color:#e0cd89;font-weight:800;font-size:11px;}
/* Wide editor */
#testEditorModal{padding:18px;align-items:flex-start;overflow-y:auto;}
#testEditorModal .test-editor-modal{width:min(1480px,97vw);
    max-width:1480px;
    max-height:none;
    margin:16px auto;
    overflow:visible;
    padding:26px;}
.test-editor-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin:0 42px 20px 0;}
.test-editor-heading h2{margin:0;font-size:22px;}
.test-version-hint{max-width:420px;color:var(--text-muted);font-size:11px;text-align:right;}
.test-editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.test-editor-card{padding:17px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(255,255,255,.016);min-width:0;}
.test-editor-card--wide{grid-column:1/-1;}
.test-editor-card h3,.test-builder-section h3{margin:0 0 13px;font-size:14px;}
.test-editor-fields{display:grid;grid-template-columns:1fr;gap:11px;}
.test-editor-fields.cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.test-editor-fields.cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.test-editor-fields .span-2{grid-column:span 2;}
.test-editor-fields .span-3{grid-column:1/-1;}
.test-editor-fields label,
.test-question-prompt-label,
.test-code-assign label{display:flex;flex-direction:column;gap:5px;color:var(--text-secondary);font-size:11px;font-weight:650;}
.test-editor-fields input,.test-editor-fields select,.test-editor-fields textarea,
.test-section-row input,.test-option-editor input[type="text"],
.test-question-prompt-label textarea,.test-review-final textarea{width:100%;padding:9px 10px;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:#141b25;color:#fff;font-size:12px;resize:vertical;}
.test-editor-fields small,.form-hint{color:var(--text-muted);font-size:10px;font-weight:400;}
.test-toggle-list{display:grid;gap:8px;}
.test-toggle-list label,.test-inline-toggle{display:flex!important;flex-direction:row!important;align-items:center;gap:9px!important;padding:9px 10px;border:1px solid rgba(255,255,255,.075);border-radius:8px;background:rgba(255,255,255,.015);font-size:11px;color:var(--text-secondary);cursor:pointer;}
.test-toggle-list input,.test-inline-toggle input{width:16px;height:16px;accent-color:#6072be;}
.test-code-editor{display:flex;gap:7px;}
.test-code-editor input{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
.test-code-editor button{white-space:nowrap;}
.tests-personal-code-note{padding:10px 12px;border:1px solid rgba(113,135,228,.18);border-radius:8px;background:rgba(113,135,228,.05);color:#aeb9e5;font-size:11px;}
.test-group-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;}
.test-group-picker.is-disabled{opacity:.55;pointer-events:none;}
.test-group-choice{display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:rgba(255,255,255,.015);color:var(--text-secondary);font-size:11px;cursor:pointer;}
.test-group-choice input{width:15px;height:15px;accent-color:#6072be;}
.test-group-choice.is-selected{border-color:rgba(113,135,228,.38);background:rgba(113,135,228,.07);color:#fff;}
.test-builder-section{margin-top:14px;padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(255,255,255,.012);}
.test-builder-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px;}
.test-builder-head h3{margin:0;}
.test-sections-editor{display:grid;gap:7px;}
.test-section-row{display:grid;grid-template-columns:38px minmax(0,1fr) 140px 34px;gap:7px;align-items:center;padding:7px;border:1px solid rgba(255,255,255,.07);border-radius:8px;background:rgba(255,255,255,.014);}
.test-drag-handle{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:7px;background:rgba(255,255,255,.04);color:var(--text-muted);font-size:11px;font-weight:700;}
/* Unified destructive controls inside the test builder. */
.test-builder-delete-btn{display:inline-grid;
    place-items:center;
    flex:0 0 38px;
    width:38px;
    height:38px;
    padding:0;
    border:1px solid rgba(190,73,73,.18);
    border-radius:9px;
    background:rgba(190,73,73,.045);
    color:#cf8585;
    cursor:pointer;
    transition:border-color .15s ease,background .15s ease,color .15s ease,transform .15s ease,box-shadow .15s ease;}
.test-builder-delete-btn svg{width:17px;height:17px;pointer-events:none;}
.test-builder-delete-btn:hover{border-color:rgba(190,73,73,.44);
    background:rgba(190,73,73,.11);
    color:#f0a0a0;
    box-shadow:0 0 0 3px rgba(190,73,73,.045);}
.test-builder-delete-btn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(190,73,73,.16);}
.test-builder-delete-btn:active{transform:translateY(1px);}
.test-builder-delete-btn:disabled{opacity:.42;cursor:not-allowed;transform:none;box-shadow:none;}
.test-questions-editor{display:grid;gap:12px;}
.test-question-editor-card{padding:16px;border:1px solid rgba(255,255,255,.085);border-radius:10px;background:#141b25;}
.test-question-editor-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
.test-question-editor-head strong{font-size:12px;}
.test-question-prompt-label{margin-top:11px;}
.test-question-image-editor{margin-top:9px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.test-question-image-editor img,.test-image-mini img{width:110px;height:70px;object-fit:cover;border-radius:7px;border:1px solid rgba(255,255,255,.08);}
.btn-file-mini{display:inline-flex!important;align-items:center;justify-content:center;cursor:pointer;font-size:10px!important;}
.test-answer-editor{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.065);}
.test-options-editor{display:grid;gap:7px;margin-bottom:8px;}
.test-option-editor{display:grid;grid-template-columns:115px minmax(0,1fr) auto 34px;gap:7px;align-items:center;padding:7px;border:1px solid rgba(255,255,255,.065);border-radius:8px;background:rgba(255,255,255,.012);}
.test-option-correct{display:flex;align-items:center;gap:6px;color:var(--text-secondary);font-size:10px;cursor:pointer;}
.test-image-mini{display:flex;align-items:center;gap:6px;}
.test-image-mini img{width:52px;height:38px;}
.test-manual-note{padding:10px;border:1px solid rgba(255,193,7,.17);border-radius:8px;background:rgba(255,193,7,.04);color:#c9bd8d;font-size:11px;}
.test-editor-footer{position:sticky;bottom:-1px;z-index:3;margin:18px -26px -26px;padding:14px 26px;display:flex;justify-content:flex-end;gap:8px;border-top:1px solid rgba(255,255,255,.08);background:rgba(37,37,37,.97);backdrop-filter:blur(8px);}
/* Codes */
.test-codes-modal{width:min(1050px,94vw)!important;max-width:1050px!important;}
.test-code-assign{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end;margin:14px 0;}
.test-code-assign select{min-height:170px;padding:8px;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:#141b25;color:#fff;}
/* Review */
#attemptReviewModal{padding:18px;align-items:flex-start;overflow-y:auto;}
.test-review-modal{width:min(1400px,97vw)!important;max-width:1400px!important;max-height:none!important;margin:16px auto!important;overflow:visible!important;}
.test-review-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-right:36px;}
.test-review-head h2{margin:0;font-size:21px;}
.test-review-head p{margin:4px 0 0;color:var(--text-secondary);font-size:11px;}
.test-review-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:15px 0;}
.test-review-summary span,.test-review-calc span{padding:9px 10px;border:1px solid rgba(255,255,255,.07);border-radius:8px;background:rgba(255,255,255,.017);color:var(--text-muted);font-size:10px;}
.test-review-summary strong,.test-review-calc strong{display:block;margin-top:2px;color:var(--text-primary);font-size:12px;}
.test-freeze-admin{padding:10px 12px;border:1px solid rgba(185,71,71,.34);border-radius:8px;background:rgba(185,71,71,.07);color:#dab0b0;font-size:11px;}
.test-review-toolbar{display:flex;gap:8px;margin:12px 0;}
.test-review-questions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.test-review-question{padding:14px;border:1px solid rgba(255,255,255,.075);border-radius:9px;background:rgba(255,255,255,.012);min-width:0;}
.test-review-question__head{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-bottom:8px;color:var(--text-muted);font-size:10px;}
.test-review-question h4{margin:0 0 10px;font-size:13px;line-height:1.5;white-space:pre-wrap;}
.critical-badge{padding:2px 6px;border-radius:999px;border:1px solid rgba(185,71,71,.30);background:rgba(185,71,71,.06);color:#d9a7a7;font-weight:700;}
.test-review-answer{display:grid;grid-template-columns:120px 1fr;gap:9px;padding:8px 0;border-top:1px solid rgba(255,255,255,.05);font-size:11px;}
.test-review-answer span{color:var(--text-muted);}
.test-review-answer strong{white-space:pre-wrap;overflow-wrap:anywhere;}
.test-review-answer--correct strong{color:#bad8bb;}
.test-score-field{margin-top:8px;display:flex;align-items:center;gap:7px;color:var(--text-secondary);font-size:10px;}
.test-score-field input{width:90px;padding:6px 7px;border:1px solid rgba(255,255,255,.10);border-radius:7px;background:#1a1a1a;color:#fff;}
.test-review-final{margin-top:14px;padding:16px;border:1px solid rgba(113,135,228,.20);border-radius:10px;background:rgba(113,135,228,.035);}
.test-review-final h3,.test-events h3{font-size:14px;margin:0 0 10px;}
.test-review-calc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-bottom:10px;}
.test-review-final textarea{margin-bottom:10px;}
.test-review-actions{display:flex;justify-content:flex-end;gap:8px;}
.test-events{margin-top:15px;padding-top:14px;border-top:1px solid rgba(255,255,255,.07);}
.test-event-row{display:grid;grid-template-columns:145px 145px minmax(0,1fr) 110px;gap:8px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.045);align-items:start;font-size:10px;}
.test-event-row time,.test-event-row small{color:var(--text-muted);}
.test-event-row strong{color:var(--text-secondary);}
.test-event-row span{overflow-wrap:anywhere;color:var(--text-muted);}
/* Bank */
.test-bank-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
.test-bank-card{display:flex;justify-content:space-between;gap:15px;padding:14px;border:1px solid rgba(255,255,255,.075);border-radius:9px;background:rgba(255,255,255,.014);}
.test-bank-card h3{margin:2px 0 5px;font-size:12px;line-height:1.45;}
.test-bank-card p{margin:0;color:var(--text-muted);font-size:10px;}
.test-bank-modal{width:min(1050px,94vw)!important;max-width:1050px!important;}
.test-bank-import-list{display:grid;gap:7px;max-height:65vh;overflow-y:auto;margin-top:12px;}
.test-bank-import-item{width:100%;padding:11px 12px;border:1px solid rgba(255,255,255,.075);border-radius:8px;background:rgba(255,255,255,.015);color:inherit;text-align:left;cursor:pointer;}
.test-bank-import-item:hover{border-color:rgba(113,135,228,.30);background:rgba(113,135,228,.045);}
.test-bank-import-item strong,.test-bank-import-item span{display:block;}
.test-bank-import-item strong{font-size:11px;}
.test-bank-import-item span{margin-top:3px;color:var(--text-muted);font-size:10px;}
/* History */
.admin-tests-history-page .members-table td:last-child{max-width:520px;white-space:normal;overflow-wrap:anywhere;color:var(--text-secondary);font-size:11px;}
@media (max-width:1100px){
.test-group-picker{grid-template-columns:repeat(2,minmax(0,1fr));}
.test-review-questions{grid-template-columns:1fr;}
.test-review-summary,.test-review-calc{grid-template-columns:repeat(2,minmax(0,1fr));}
.admin-tests-filterbar{grid-template-columns:repeat(2,minmax(0,1fr));}
.admin-tests-filterbar button{justify-self:start;}
}
@media (max-width:780px){
.tests-entry-card{grid-template-columns:1fr;align-items:stretch;padding:18px;}
.tests-code-form{display:grid;grid-template-columns:1fr;}
.tests-code-form input{width:100%;}
.tests-active-card{align-items:flex-start;flex-direction:column;}
.tests-active-card__side{width:100%;justify-content:space-between;}
.test-runner{padding:17px;}
.test-question-card{padding:16px;}
.test-runner__top{align-items:center;}
.test-runner__timer{min-width:82px;font-size:17px;}
.test-options--boolean{grid-template-columns:1fr;}
.test-runner__actions{align-items:stretch;flex-direction:column;}
.test-runner__actions-right{width:100%;flex-wrap:wrap;}
.test-runner__actions-right button{flex:1;}
.test-save-state{width:100%;text-align:left;}
.tests-history-grid,.test-bank-grid{grid-template-columns:1fr;}
.tests-history-card__meta{align-items:flex-start;flex-direction:column;gap:3px;}
.admin-tests-header{flex-direction:column;}
.admin-tests-tabs{width:100%;overflow-x:auto;}
.admin-tests-tab{flex:1;white-space:nowrap;}
#testEditorModal .test-editor-modal,.test-review-modal{width:100%!important;max-width:100%!important;margin:0!important;padding:18px!important;border-radius:10px!important;}
.test-editor-grid,.test-editor-fields.cols-2,.test-editor-fields.cols-3{grid-template-columns:1fr;}
.test-editor-card--wide{grid-column:auto;}
.test-editor-fields .span-2,.test-editor-fields .span-3{grid-column:auto;}
.test-editor-heading{flex-direction:column;margin-right:34px;}
.test-version-hint{text-align:left;}
.test-group-picker{grid-template-columns:1fr;}
.test-section-row{grid-template-columns:34px minmax(0,1fr) 90px 34px;}
.test-option-editor{grid-template-columns:1fr 34px;}
.test-option-correct,.test-image-mini{grid-column:1/-1;}
.test-option-editor > input{grid-column:1/-1;}
.test-editor-footer{margin:16px -18px -18px;padding:12px 18px;}
.test-review-summary,.test-review-calc{grid-template-columns:1fr 1fr;}
.test-event-row{grid-template-columns:1fr 1fr;}
.test-event-row span{grid-column:1/-1;}
.test-code-assign{grid-template-columns:1fr;}
.admin-tests-filterbar{grid-template-columns:1fr;}
.admin-tests-filterbar button{width:100%;justify-content:center;}
}
@media (max-width:480px){
.tests-preview-card__head,.test-runner__top{flex-direction:column;}
.test-runner__timer{width:100%;}
.tests-preview-actions{display:grid;grid-template-columns:1fr 1fr;}
.tests-preview-actions button{width:100%;}
.test-review-summary,.test-review-calc{grid-template-columns:1fr;}
.test-review-actions{flex-direction:column;}
.test-review-actions button{width:100%;}
.notification-panel{position:fixed;top:calc(var(--top-bar-height) + 6px);left:10px;right:10px;width:auto;}
}
/* ===== TESTS: empty states + mobile-first hardening ===== */
/* Author display rules must never override HTML's hidden state. */
.tests-active-card[hidden],
.tests-preview-card[hidden],
.test-runner[hidden],
.tests-inline-message[hidden],
.test-runner__notice[hidden],
.test-freeze-overlay[hidden],
.test-access-groups-wrap[hidden],
.tests-personal-code-note[hidden]{display:none !important;}
.tests-page,
.admin-tests-page,
.admin-tests-history-page{min-width:0;}
.tests-page * ,
.admin-tests-page *,
.admin-tests-history-page *{min-width:0;}
@media (max-width: 780px){
.tests-page .page-header,
    .admin-tests-page .page-header,
    .admin-tests-history-page .page-header{margin-bottom:16px;}
.tests-page .page-title-large,
    .admin-tests-page .page-title-large,
    .admin-tests-history-page .page-title-large{font-size:clamp(24px,7vw,32px);
        line-height:1.12;
        overflow-wrap:anywhere;}
.tests-page .page-subtitle,
    .admin-tests-page .page-subtitle,
    .admin-tests-history-page .page-subtitle{font-size:12px; line-height:1.55;}
.tests-page .breadcrumbs,
    .admin-tests-page .breadcrumbs,
    .admin-tests-history-page .breadcrumbs{max-width:100%;
        overflow-x:auto;
        scrollbar-width:none;
        white-space:nowrap;
        padding-bottom:2px;}
.tests-page .breadcrumbs::-webkit-scrollbar,
    .admin-tests-page .breadcrumbs::-webkit-scrollbar,
    .admin-tests-history-page .breadcrumbs::-webkit-scrollbar{display:none;}
.tests-access-state,
    .tests-entry-card,
    .tests-preview-card,
    .tests-active-card,
    .tests-history-section{border-radius:11px;}
.tests-entry-card,
    .tests-preview-card,
    .tests-history-section{padding:16px;}
.tests-entry-card{gap:16px;}
.tests-entry-card__copy h2,
    .tests-preview-card h2,
    .test-runner h2,
    .tests-history-section h2{font-size:18px;}
.tests-entry-card__copy p,
    .tests-preview-card > p{font-size:12px; line-height:1.55;}
.tests-code-form{width:100%; gap:9px;}
.tests-code-form input{width:100%; min-height:48px; font-size:18px; text-align:center;}
.tests-code-form button{width:100%; min-height:44px;}
.tests-active-card{padding:15px 16px; gap:14px;}
.tests-active-card > div:first-child{width:100%;}
.tests-active-card h3{overflow-wrap:anywhere;}
.tests-active-card__side{display:grid; grid-template-columns:auto minmax(130px,1fr); gap:8px;}
.tests-active-card__side button{width:100%; min-height:42px;}
.tests-preview-card__head{gap:10px;}
.tests-preview-card__head > div{width:100%;}
.tests-code-chip{align-self:flex-start;}
.tests-preview-meta{display:grid; grid-template-columns:1fr 1fr; gap:7px;}
.tests-preview-meta span{width:100%; padding:8px 9px; overflow-wrap:anywhere;}
.test-runner{padding:15px; margin-top:14px; border-radius:11px;}
.test-runner__top{gap:12px;}
.test-runner__top > div:first-child{flex:1;}
.test-runner__timer{flex:0 0 auto; min-width:88px; padding:9px 10px;}
.test-runner__progress{margin-top:15px;}
.test-runner__meta{font-size:11px;}
.test-question-card{margin-top:14px; padding:15px; border-radius:10px;}
.test-question-card h3{font-size:16px; line-height:1.5; margin-bottom:15px; overflow-wrap:anywhere;}
.test-question-card__head{gap:6px 9px;}
.test-question-image{width:100%; height:auto; max-height:55vh;}
.test-option{padding:12px; gap:10px;}
.test-option__content{font-size:12px; line-height:1.5; overflow-wrap:anywhere;}
.test-text-answer{font-size:16px;}
/* prevent iOS zoom */
.test-runner__actions{gap:8px;}
.test-runner__actions > button{width:100%; min-height:43px;}
.test-runner__actions-right{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
.test-runner__actions-right .test-save-state{grid-column:1/-1;}
.test-runner__actions-right button{min-height:43px;}
.test-freeze-overlay{position:fixed; inset:0; padding:14px; z-index:10050;}
.test-freeze-overlay__card{max-height:calc(100dvh - 28px); overflow:auto; padding:20px 16px;}
.tests-history-section{margin-top:16px;}
.tests-history-card{padding:14px;}
.tests-history-card__top{gap:8px;}
.tests-history-card__top strong{overflow-wrap:anywhere;}
/* Admin header/actions */
.admin-tests-header{gap:12px;}
.admin-tests-header > div{width:100%;}
.admin-tests-header > a.btn-secondary{width:100%; justify-content:center; min-height:42px;}
.admin-tests-tabs{display:flex;
        width:100%;
        max-width:100%;
        overflow-x:auto;
        overscroll-behavior-inline:contain;
        scroll-snap-type:x proximity;
        scrollbar-width:none;
        padding:4px;}
.admin-tests-tabs::-webkit-scrollbar{display:none;}
.admin-tests-tab{flex:0 0 auto; min-height:40px; scroll-snap-align:start;}
.admin-tests-page .admin-members-toolbar,
    .admin-tests-page .toolbar-actions,
    .admin-tests-page .test-builder-head,
    .admin-tests-history-page .admin-tests-filterbar{width:100%;}
.admin-tests-page .admin-members-toolbar{align-items:stretch; gap:10px;}
.admin-tests-page .search-box{width:100%; max-width:none;}
.admin-tests-page .toolbar-actions{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
.admin-tests-page .toolbar-actions button{width:100%; min-height:42px;}
.admin-tests-filterbar{gap:8px;}
.admin-tests-filterbar .form-control,
    .admin-tests-filterbar button{min-height:43px; font-size:16px;}
/* Tables become cards instead of requiring tiny text/horizontal scrolling. */
.admin-tests-page .members-table-container,
    .admin-tests-history-page .members-table-container{overflow:visible; border:0; background:transparent;}
.admin-tests-page .tests-admin-table,
    .admin-tests-page .tests-results-table,
    #personalCodesModal .members-table,
    .admin-tests-history-page .members-table{display:block; width:100%; min-width:0;}
.admin-tests-page .tests-admin-table thead,
    .admin-tests-page .tests-results-table thead,
    #personalCodesModal .members-table thead,
    .admin-tests-history-page .members-table thead{display:none;}
.admin-tests-page .tests-admin-table tbody,
    .admin-tests-page .tests-results-table tbody,
    #personalCodesModal .members-table tbody,
    .admin-tests-history-page .members-table tbody{display:grid; gap:10px; width:100%;}
.admin-tests-page .tests-admin-table tr,
    .admin-tests-page .tests-results-table tr,
    #personalCodesModal .members-table tr,
    .admin-tests-history-page .members-table tr{display:block;
        width:100%;
        padding:12px 13px;
        border:1px solid rgba(255,255,255,.08);
        border-radius:10px;
        background:rgba(255,255,255,.016);}
.admin-tests-page .tests-admin-table td,
    .admin-tests-page .tests-results-table td,
    #personalCodesModal .members-table td,
    .admin-tests-history-page .members-table td{display:grid;
        grid-template-columns:minmax(98px,35%) minmax(0,1fr);
        gap:9px;
        align-items:start;
        width:100%;
        max-width:none!important;
        padding:7px 0;
        border:0;
        border-bottom:1px solid rgba(255,255,255,.05);
        white-space:normal;
        overflow-wrap:anywhere;
        text-align:left;}
.admin-tests-page .tests-admin-table td:last-child,
    .admin-tests-page .tests-results-table td:last-child,
    #personalCodesModal .members-table td:last-child,
    .admin-tests-history-page .members-table td:last-child{border-bottom:0; padding-bottom:0;}
.admin-tests-page .tests-admin-table td::before,
    .admin-tests-page .tests-results-table td::before,
    #personalCodesModal .members-table td::before,
    .admin-tests-history-page .members-table td::before{color:var(--text-muted);
        font-size:10px;
        font-weight:700;
        line-height:1.4;}
.tests-admin-table td:nth-child(1)::before{content:"Тест"}
.tests-admin-table td:nth-child(2)::before{content:"Код / доступ"}
.tests-admin-table td:nth-child(3)::before{content:"Версия"}
.tests-admin-table td:nth-child(4)::before{content:"Вопросы"}
.tests-admin-table td:nth-child(5)::before{content:"Попытки"}
.tests-admin-table td:nth-child(6)::before{content:"На проверке"}
.tests-admin-table td:nth-child(7)::before{content:"Статус"}
.tests-admin-table td:nth-child(8)::before{content:"Действия"}
.tests-results-table td:nth-child(1)::before{content:"Участник"}
.tests-results-table td:nth-child(2)::before{content:"Тест"}
.tests-results-table td:nth-child(3)::before{content:"Попытка"}
.tests-results-table td:nth-child(4)::before{content:"Результат"}
.tests-results-table td:nth-child(5)::before{content:"Время"}
.tests-results-table td:nth-child(6)::before{content:"Дата"}
.tests-results-table td:nth-child(7)::before{content:"Проверяющий"}
.tests-results-table td:nth-child(8)::before{content:"Статус"}
.tests-results-table td:nth-child(9)::before{content:"Действия"}
#personalCodesModal .members-table td:nth-child(1)::before{content:"Участник"}
#personalCodesModal .members-table td:nth-child(2)::before{content:"Код"}
#personalCodesModal .members-table td:nth-child(3)::before{content:"Использован"}
#personalCodesModal .members-table td:nth-child(4)::before{content:"Статус"}
#personalCodesModal .members-table td:nth-child(5)::before{content:"Действия"}
.admin-tests-history-page .members-table td:nth-child(1)::before{content:"Дата"}
.admin-tests-history-page .members-table td:nth-child(2)::before{content:"Тест"}
.admin-tests-history-page .members-table td:nth-child(3)::before{content:"Действие"}
.admin-tests-history-page .members-table td:nth-child(4)::before{content:"Кто"}
.admin-tests-history-page .members-table td:nth-child(5)::before{content:"Детали"}
.admin-tests-page td.table-state-cell,
    #personalCodesModal td.table-state-cell,
    .admin-tests-history-page td.table-state-cell{display:block; padding:14px; border:0; text-align:center;}
.admin-tests-page td.table-state-cell::before,
    #personalCodesModal td.table-state-cell::before,
    .admin-tests-history-page td.table-state-cell::before{content:none!important;}
.admin-tests-page .table-actions,
    #personalCodesModal .table-actions{display:flex; flex-wrap:wrap; justify-content:flex-start; gap:6px;}
.admin-tests-page .table-action-btn,
    #personalCodesModal .table-action-btn{min-height:36px;}
/* Full-screen editor/reviewer on phones/tablets. */
#testEditorModal,
    #attemptReviewModal,
    #personalCodesModal,
    #bankQuestionModal,
    #bankImportModal{padding:0!important; align-items:stretch!important;}
#testEditorModal .test-editor-modal,
    #attemptReviewModal .test-review-modal,
    #personalCodesModal .test-codes-modal,
    #bankQuestionModal .test-bank-modal,
    #bankImportModal .modal-content{width:100%!important;
        max-width:100%!important;
        min-height:100dvh;
        max-height:100dvh!important;
        margin:0!important;
        padding:18px 14px 86px!important;
        border-radius:0!important;
        overflow-y:auto!important;
        overscroll-behavior:contain;}
#testEditorModal .modal-close,
    #attemptReviewModal .modal-close,
    #personalCodesModal .modal-close,
    #bankQuestionModal .modal-close,
    #bankImportModal .modal-close{position:sticky; float:right; top:0; z-index:20;}
.test-editor-heading{clear:both; margin:0 0 16px; gap:7px;}
.test-version-hint{max-width:none;}
.test-editor-card{padding:14px;}
.test-builder-section{padding:14px;}
.test-builder-head{align-items:stretch; gap:10px;}
.test-builder-head > div{flex:1;}
.test-builder-head .toolbar-actions{width:100%;}
.test-section-row{grid-template-columns:32px minmax(0,1fr) 32px;}
.test-section-row > input[type="number"]{grid-column:2/3;}
.test-question-editor-card{padding:13px;}
.test-question-editor-head{align-items:flex-start;}
.test-question-image-editor{align-items:flex-start;}
.test-question-image-editor img{width:100%; max-width:260px; height:auto; max-height:180px;}
.test-option-editor{grid-template-columns:minmax(0,1fr) 34px; padding:9px;}
.test-image-mini{grid-column:1/-1;}
.test-image-mini img{width:70px; height:50px;}
.test-option-correct{grid-column:1/-1; min-height:34px;}
.test-editor-footer{position:fixed;
        left:0;right:0;bottom:0;
        z-index:10080;
        margin:0;
        padding:10px 12px calc(10px + env(safe-area-inset-bottom));
        display:grid;
        grid-template-columns:1fr 1.3fr;
        background:rgba(30,30,30,.98);
        box-shadow:0 -8px 24px rgba(0,0,0,.28);}
.test-editor-footer button{width:100%; min-height:44px;}
.test-code-assign select{min-height:190px; font-size:16px;}
.test-review-head{margin-right:0; padding-right:34px;}
.test-review-head h2{overflow-wrap:anywhere;}
.test-review-toolbar{flex-wrap:wrap;}
.test-review-toolbar button{flex:1 1 190px; min-height:42px;}
.test-review-question{padding:13px;}
.test-review-answer{grid-template-columns:1fr; gap:3px;}
.test-score-field{flex-wrap:wrap;}
.test-score-field input{min-height:40px; font-size:16px;}
.test-event-row{padding:10px 0;}
.test-bank-card{flex-direction:column; gap:10px;}
.test-bank-card .table-actions{width:100%;}
.test-bank-card .table-actions button{flex:1;}
}
@media (max-width: 520px){
.tests-preview-meta{grid-template-columns:1fr;}
.tests-active-card__side{grid-template-columns:1fr;}
.tests-active-card__side .test-status-badge{justify-self:start;}
.tests-preview-actions{grid-template-columns:1fr;}
.test-runner__top{flex-direction:column; align-items:stretch;}
.test-runner__timer{width:100%;}
.test-option__content{flex-direction:column; align-items:flex-start; width:100%;}
.test-option__content img{width:100%; height:auto; max-height:220px; object-fit:contain;}
.test-runner__actions-right{grid-template-columns:1fr;}
.test-runner__actions-right .test-save-state{grid-column:auto;}
.tests-history-card__top{flex-direction:column;}
.tests-history-card__top .test-status-badge{align-self:flex-start;}
.admin-tests-page .toolbar-actions{grid-template-columns:1fr;}
.test-editor-footer{grid-template-columns:1fr 1fr;}
.test-review-summary,.test-review-calc{grid-template-columns:1fr;}
.test-review-actions{display:grid; grid-template-columns:1fr;}
}
/* ===== TEST EDITOR POLISH: fixed footer + clean answer controls ===== */
#testEditorModal{overflow:hidden;
    align-items:center;
    padding:16px;}
#testEditorModal .test-editor-modal{display:flex;
    flex-direction:column;
    width:min(1480px,97vw);
    max-width:1480px;
    height:min(94dvh,980px);
    max-height:calc(100dvh - 32px)!important;
    margin:0 auto;
    padding:0!important;
    overflow:hidden!important;}
#testEditorModal .test-editor-heading{flex:0 0 auto;
    margin:0;
    padding:22px 64px 18px 26px;
    border-bottom:1px solid rgba(255,255,255,.07);
    background:#222;}
#testEditorModal .modal-close{top:16px;
    right:18px;
    z-index:15;}
#testEditorForm{display:flex;
    flex:1 1 auto;
    min-height:0;
    flex-direction:column;}
#testEditorModal .test-editor-scroll{flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    padding:20px 26px 24px;
    scrollbar-gutter:stable;
    overscroll-behavior:contain;}
#testEditorModal .test-editor-scroll::-webkit-scrollbar{width:10px;}
#testEditorModal .test-editor-scroll::-webkit-scrollbar-track{background:var(--scrollbar-track);}
#testEditorModal .test-editor-scroll::-webkit-scrollbar-thumb{border:2px solid var(--scrollbar-track);
    border-radius:6px;
    background:var(--scrollbar-thumb);
    background-clip:padding-box;}
#testEditorModal .test-editor-scroll::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover);
    border:2px solid var(--scrollbar-track);
    background-clip:padding-box;}
#testEditorModal .test-editor-footer{position:relative!important;
    inset:auto!important;
    flex:0 0 auto;
    margin:0!important;
    padding:13px 26px 14px;
    display:flex;
    justify-content:flex-end;
    gap:9px;
    border-top:1px solid rgba(255,255,255,.08);
    background:rgba(31,31,31,.985);
    box-shadow:0 -10px 26px rgba(0,0,0,.20);
    backdrop-filter:blur(12px);
    z-index:12;}
#testEditorModal .test-editor-footer button{min-height:40px;}
/* Native browser checks were visually inconsistent with the editor. */
.test-toggle-list input[type="checkbox"],
.test-inline-toggle input[type="checkbox"],
.test-group-choice input[type="checkbox"]{-webkit-appearance:none;
    appearance:none;
    flex:0 0 20px;
    width:20px!important;
    height:20px!important;
    margin:0;
    border:1px solid rgba(255,255,255,.18);
    border-radius:6px;
    background:#131a24;
    background-position:center;
    background-repeat:no-repeat;
    background-size:12px 12px;
    cursor:pointer;
    transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease,transform .15s ease;}
.test-toggle-list input[type="checkbox"]:checked,
.test-inline-toggle input[type="checkbox"]:checked,
.test-group-choice input[type="checkbox"]:checked{border-color:#7187e4;
    background-color:#7187e4;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.1 8.2 6.3 11.2 12.9 4.8' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    box-shadow:0 0 0 3px rgba(113,135,228,.12);}
.test-toggle-list label:hover input[type="checkbox"],
.test-inline-toggle:hover input[type="checkbox"],
.test-group-choice:hover input[type="checkbox"]{border-color:rgba(113,135,228,.65);}
.test-toggle-list label:focus-within input[type="checkbox"],
.test-inline-toggle:focus-within input[type="checkbox"],
.test-group-choice:focus-within input[type="checkbox"]{box-shadow:0 0 0 3px rgba(113,135,228,.15);}
/* Answer option card */
.test-options-editor{gap:9px;}
.test-option-editor{display:grid;
    grid-template-columns:126px minmax(0,1fr) auto;
    gap:10px;
    align-items:center;
    padding:10px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:10px;
    background:rgba(255,255,255,.014);
    transition:border-color .15s ease,background .15s ease,box-shadow .15s ease;}
.test-option-editor:hover{border-color:rgba(255,255,255,.13);
    background:rgba(255,255,255,.022);}
.test-option-editor.is-active{border-color:rgba(113,135,228,.34);
    background:rgba(113,135,228,.045);
    box-shadow:inset 3px 0 0 rgba(113,135,228,.72);}
.test-option-correct{appearance:none;
    -webkit-appearance:none;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:8px;
    min-height:38px;
    padding:7px 10px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:8px;
    background:#141b25;
    color:var(--text-secondary);
    font-size:10px;
    font-weight:700;
    cursor:pointer;
    user-select:none;
    transition:border-color .15s ease,background .15s ease,color .15s ease,box-shadow .15s ease;}
.test-option-correct:hover{border-color:rgba(113,135,228,.35);
    color:#fff;}
.test-option-correct__mark{display:grid;
    place-items:center;
    flex:0 0 20px;
    width:20px;
    height:20px;
    border:1px solid rgba(255,255,255,.18);
    border-radius:6px;
    background:#131a24;
    color:transparent;
    transition:all .15s ease;}
.test-option-correct__mark svg{width:13px;height:13px;}
.test-option-correct.is-single .test-option-correct__mark{border-radius:50%;}
.test-option-correct.is-active{border-color:rgba(113,135,228,.45);
    background:rgba(113,135,228,.10);
    color:#fff;
    box-shadow:0 0 0 2px rgba(113,135,228,.06);}
.test-option-correct.is-active .test-option-correct__mark{border-color:#7187e4;
    background:#7187e4;
    color:#fff;
    box-shadow:0 0 0 3px rgba(113,135,228,.11);}
.test-option-main{display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:9px;
    align-items:center;
    min-width:0;}
.test-option-text{min-height:40px;
    margin:0;}
.test-option-image-preview{width:58px;
    height:40px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:7px;
    overflow:hidden;
    background:#131a24;}
.test-option-image-preview img{display:block;
    width:100%;
    height:100%;
    object-fit:cover;}
.test-option-actions{display:flex;
    align-items:center;
    gap:7px;}
.test-option-action{display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-height:38px;
    padding:0 11px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:8px;
    background:#1a2130;
    color:var(--text-secondary);
    font:inherit;
    font-size:10px;
    font-weight:700;
    white-space:nowrap;
    cursor:pointer;
    transition:border-color .15s ease,background .15s ease,color .15s ease,transform .15s ease;}
.test-option-action svg{width:17px;height:17px;flex:0 0 17px;}
.test-option-action:hover{border-color:rgba(113,135,228,.32);
    background:#22375c;
    color:#fff;}
.test-option-action:active{transform:translateY(1px);}
.test-option-action--danger{width:38px;
    padding:0;
    color:#cf8585;
    border-color:rgba(190,73,73,.18);
    background:rgba(190,73,73,.04);}
.test-option-action--danger:hover{border-color:rgba(190,73,73,.42);
    background:rgba(190,73,73,.10);
    color:#f0a0a0;}
/* The bank modal keeps a sticky footer inside its own scrolling panel. */
#bankQuestionModal .test-editor-footer{position:sticky;
    bottom:-1px;}
@media (max-width:980px){
.test-option-editor{grid-template-columns:118px minmax(0,1fr);}
.test-option-actions{grid-column:1/-1;
        justify-content:flex-end;}
}
@media (max-width:780px){
#testEditorModal{padding:0!important;
        align-items:stretch!important;}
#testEditorModal .test-editor-modal{width:100%!important;
        max-width:100%!important;
        min-height:100dvh;
        height:100dvh;
        max-height:100dvh!important;
        margin:0!important;
        padding:0!important;
        border-radius:0!important;
        overflow:hidden!important;}
#testEditorModal .test-editor-heading{padding:17px 52px 14px 14px;}
#testEditorModal .test-editor-heading h2{font-size:19px;}
#testEditorModal .test-editor-scroll{padding:14px 14px 18px;
        scrollbar-gutter:auto;}
#testEditorModal .test-editor-footer{position:relative!important;
        left:auto!important;
        right:auto!important;
        bottom:auto!important;
        grid-template-columns:1fr 1.35fr;
        display:grid;
        padding:10px 12px calc(10px + env(safe-area-inset-bottom));
        box-shadow:0 -8px 24px rgba(0,0,0,.25);}
#testEditorModal .test-editor-footer button{width:100%;
        min-height:44px;}
.test-option-editor{grid-template-columns:1fr;
        gap:8px;
        padding:10px;}
.test-option-correct{width:max-content;
        max-width:100%;
        min-height:36px;}
.test-option-main{grid-template-columns:minmax(0,1fr) auto;}
.test-option-actions{grid-column:auto;
        justify-content:flex-start;}
.test-option-action:first-child{flex:1 1 auto;}
}
@media (max-width:520px){
#testEditorModal .test-editor-footer{grid-template-columns:1fr 1fr;}
.test-option-main{grid-template-columns:1fr;}
.test-option-image-preview{width:100%;
        height:auto;
        aspect-ratio:16/7;}
.test-option-action span{display:inline;}
}
/* Multi-answer authoring: independent explicit selectors, no native checkbox/radio dependency. */
.test-multi-correct-hint{display:block;
    margin:7px 2px 10px;
    color:var(--text-secondary);
    font-size:11px;
    line-height:1.45;}
.test-option-correct[aria-pressed="true"] .test-option-correct__mark{transform:scale(1);}
.test-option-correct[aria-pressed="false"] .test-option-correct__mark{transform:scale(.98);}
/* ===== TESTS: fullscreen runner, clean admin tables, bottom toasts ===== */
/* Toasts are intentionally placed at the bottom so they do not cover page headers/actions. */
.notification{top:auto !important;
    right:20px !important;
    bottom:20px !important;
    left:auto !important;
    max-height:min(45vh,280px);}
@media (max-width:720px){
.notification{top:auto !important;right:12px !important;bottom:12px !important;left:12px !important;width:auto !important;}
}
/* Admin tests: prevent action buttons from collapsing into vertical letters. */
.tests-admin-table{min-width:1160px;table-layout:auto;}
.tests-admin-table th:last-child,.tests-admin-table td.tests-actions-cell{min-width:290px;width:290px;}
.tests-admin-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap;min-width:270px;}
.tests-admin-actions .table-action-btn{display:inline-flex;align-items:center;justify-content:center;min-width:max-content;white-space:nowrap;word-break:normal;overflow-wrap:normal;padding:7px 10px;line-height:1.2;}
.test-code-copy{appearance:none;cursor:pointer;gap:6px;border:1px solid rgba(113,135,228,.30);transition:border-color .16s ease,background .16s ease,transform .12s ease;}
.test-code-copy svg{width:14px;height:14px;flex:0 0 14px;opacity:.72;}
.test-code-copy:hover{border-color:rgba(113,135,228,.62);background:rgba(113,135,228,.15);}
.test-code-copy:active{transform:translateY(1px);}
.test-code-copy.is-copied{border-color:rgba(76,175,80,.5);background:rgba(76,175,80,.10);color:#c2e5c3;}
/* History: human-readable details instead of raw JSON. */
.admin-tests-history-page .members-table td:last-child{max-width:620px;}
.history-details-list{display:flex;flex-wrap:wrap;gap:6px;}
.history-detail{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid rgba(255,255,255,.075);border-radius:8px;background:rgba(255,255,255,.02);max-width:100%;}
.history-detail small{color:var(--text-muted);font-size:10px;white-space:nowrap;}
.history-detail strong{font-size:10px;color:var(--text-primary);font-weight:700;overflow-wrap:anywhere;}
.history-details-empty{color:var(--text-muted);font-size:11px;}
/* Timer can be hidden without affecting the server-side deadline. */
.test-runner__timer-area{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.test-timer-toggle{min-height:38px;padding:0 11px;border:1px solid rgba(255,255,255,.09);border-radius:9px;background:rgba(255,255,255,.025);color:var(--text-secondary);font-size:11px;font-weight:700;cursor:pointer;white-space:nowrap;}
.test-timer-toggle:hover{border-color:rgba(113,135,228,.32);color:var(--text-primary);background:rgba(113,135,228,.05);}
.test-timer-toggle.is-hidden-time{color:#aeb9e9;border-color:rgba(113,135,228,.26);}
.test-runner__timer[hidden]{display:none !important;}
/* During an opened attempt, the test becomes the whole application surface. */
html.test-session-active,body.test-session-active{overflow:hidden;background:var(--bg-primary);}
body.test-session-active .top-bar,
body.test-session-active .sidebar,
body.test-session-active .site-footer,
body.test-session-active .mobile-bottom-nav,
body.test-session-active .mobile-nav-sheet{display:none !important;}
body.test-session-active .main-wrapper{margin-top:0;min-height:100dvh;height:100dvh;display:block;overflow:hidden;}
body.test-session-active .layout-container{display:block;max-width:none;width:100%;height:100%;}
body.test-session-active .main-content{width:100%;height:100dvh;min-height:100dvh;padding:0;margin:0;overflow:auto;background:#171717;}
body.test-session-active .tests-page{max-width:none;width:100%;min-height:100%;margin:0;padding:0;background:transparent;}
body.test-session-active .tests-page > .page-header,
body.test-session-active .tests-entry-card,
body.test-session-active .tests-active-card,
body.test-session-active .tests-preview-card,
body.test-session-active .tests-history-section{display:none !important;}
body.test-session-active .test-runner{display:block !important;width:min(1180px,calc(100% - 48px));min-height:calc(100dvh - 48px);margin:24px auto;padding:28px;border-radius:14px;overflow:visible;box-sizing:border-box;}
body.test-session-active .test-runner__actions{position:sticky;bottom:0;z-index:10;margin:24px -28px -28px;padding:14px 28px calc(14px + env(safe-area-inset-bottom));border-top:1px solid rgba(255,255,255,.08);background:rgba(23,23,23,.96);backdrop-filter:blur(10px);}
@media (max-width:780px){
.tests-admin-table{min-width:0;}
.tests-admin-table th:last-child,.tests-admin-table td.tests-actions-cell{min-width:0;width:auto;}
.tests-admin-actions{min-width:0;justify-content:flex-start;}
.tests-admin-actions .table-action-btn{flex:1 1 120px;}
.test-runner__timer-area{width:100%;justify-content:space-between;flex-wrap:wrap;}
.test-runner__timer-area .test-runner__timer{width:auto;min-width:100px;}
body.test-session-active .main-content{padding:0 !important;}
body.test-session-active .test-runner{width:100%;min-height:100dvh;margin:0;padding:18px 14px;border:0;border-radius:0;}
body.test-session-active .test-runner__actions{margin:20px -14px -18px;padding:12px 14px calc(12px + env(safe-area-inset-bottom));}
}
/* Tests admin controls: never fall back to browser-default white buttons/inputs. */
.admin-tests-page .table-action-btn,
#personalCodesModal .table-action-btn,
.test-bank-card .table-action-btn{appearance:none;
    border:1px solid rgba(255,255,255,.10);
    border-radius:8px;
    background:rgba(255,255,255,.035);
    color:var(--text-primary);
    font-family:inherit;
    font-size:11px;
    font-weight:700;
    line-height:1.2;
    cursor:pointer;
    transition:border-color .16s ease,background .16s ease,color .16s ease;}
.admin-tests-page .table-action-btn:hover,
#personalCodesModal .table-action-btn:hover,
.test-bank-card .table-action-btn:hover{border-color:rgba(113,135,228,.36);
    background:rgba(113,135,228,.08);}
.admin-tests-page .table-action-btn.danger,
#personalCodesModal .table-action-btn.danger,
.test-bank-card .table-action-btn.danger{border-color:rgba(185,71,71,.24);
    color:#e0adad;
    background:rgba(185,71,71,.045);}
.admin-tests-page .table-action-btn.danger:hover,
#personalCodesModal .table-action-btn.danger:hover,
.test-bank-card .table-action-btn.danger:hover{border-color:rgba(185,71,71,.46);
    background:rgba(185,71,71,.10);}
.admin-tests-filterbar .form-control{width:100%;
    min-width:0;
    min-height:42px;
    padding:0 12px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:9px;
    outline:none;
    background:#141b25;
    color:var(--text-primary);
    font-family:inherit;
    font-size:12px;
    font-weight:600;
    line-height:1.2;}
.admin-tests-filterbar .form-control::placeholder{color:var(--text-muted);opacity:.8;}
.admin-tests-filterbar .form-control:focus{border-color:rgba(113,135,228,.52);box-shadow:0 0 0 3px rgba(113,135,228,.08);}
.admin-tests-filterbar select.form-control{padding-right:30px;}
.admin-tests-history-page .admin-tests-filterbar{grid-template-columns:minmax(260px,1fr) auto;
    max-width:760px;
    align-items:center;}
.admin-tests-history-page .admin-tests-filterbar #refreshTestHistoryBtn{min-height:42px;min-width:128px;justify-content:center;}
@media (max-width:780px){
.admin-tests-history-page .admin-tests-filterbar{grid-template-columns:1fr;max-width:none;}
.admin-tests-history-page .admin-tests-filterbar #refreshTestHistoryBtn{width:100%;}
}
/* ===== LAYOUT HARDENING: prevent sidebar collapse on wide test content ===== */
.layout-container{min-width:0;}
.sidebar{flex:0 0 var(--sidebar-width);
    width:var(--sidebar-width);
    min-width:var(--sidebar-width);
    max-width:var(--sidebar-width);}
.main-content{min-width:0;
    width:calc(100% - var(--sidebar-width));
    overflow-x:hidden;}
/* Sidebar labels may wrap by words, but never one character at a time. */
.nav-link{overflow-wrap:break-word;
    word-break:normal;}
.nav-link span:not(.nav-ico):not(.folder-toggle),
.nav-section-title{overflow-wrap:break-word;
    word-break:normal;}
.nav-link svg,
.nav-link .nav-ico{flex:0 0 auto;}
/* Tablet / small desktop: keep a real sidebar while giving content more room. */
@media (min-width:769px) and (max-width:1100px){
.sidebar{flex-basis:260px;
        width:260px;
        min-width:260px;
        max-width:260px;}
.main-content{width:calc(100% - 260px);
        padding:30px 22px;}
.nav-section-header{padding-left:14px;
        padding-right:14px;}
.nav-link{margin-left:12px;
        margin-right:12px;
        width:calc(100% - 24px);
        padding-left:12px;
        padding-right:12px;}
.nav-link--level2{padding-left:38px;}
.nav-link--level3{padding-left:52px;}
.content-page{min-width:0;
        padding-left:12px;
        padding-right:12px;}
.tests-page,
    .admin-tests-page,
    .admin-tests-history-page{min-width:0;
        max-width:100%;}
.tests-entry-card{grid-template-columns:1fr;
        align-items:stretch;}
.tests-code-form{width:100%;
        flex-wrap:wrap;}
.tests-code-form input{flex:1 1 180px;
        width:auto;
        min-width:0;}
}
/* Mobile sidebar stays off-canvas and must not reserve desktop width. */
@media (max-width:768px){
.sidebar{width:min(330px,86vw);
        min-width:min(330px,86vw);
        max-width:min(330px,86vw);
        flex-basis:auto;}
.main-content{width:100%;
        min-width:0;
        overflow-x:hidden;}
}
/* ===== ADMIN TESTS TABLE: compact desktop layout, no horizontal scrollbar ===== */
@media (min-width:781px){
.admin-tests-page [data-tests-panel="tests"] .members-table-container{overflow-x:hidden;}
.admin-tests-page .tests-admin-table{width:100%;
        min-width:0;
        table-layout:fixed;}
.admin-tests-page .tests-admin-table th,
    .admin-tests-page .tests-admin-table td{padding-left:8px;
        padding-right:8px;}
.admin-tests-page .tests-admin-table th:first-child,
    .admin-tests-page .tests-admin-table td:first-child{padding-left:14px;}
.admin-tests-page .tests-admin-table th:last-child,
    .admin-tests-page .tests-admin-table td:last-child{padding-right:12px;}
.admin-tests-page .tests-admin-table th:nth-child(1){width:13%;}
.admin-tests-page .tests-admin-table th:nth-child(2){width:16%;}
.admin-tests-page .tests-admin-table th:nth-child(3){width:8%;}
.admin-tests-page .tests-admin-table th:nth-child(4){width:10%;}
.admin-tests-page .tests-admin-table th:nth-child(5){width:10%;}
.admin-tests-page .tests-admin-table th:nth-child(6){width:13%;}
.admin-tests-page .tests-admin-table th:nth-child(7){width:12%;}
.admin-tests-page .tests-admin-table th:nth-child(8){width:18%;}
.admin-tests-page .tests-admin-table th:last-child,
    .admin-tests-page .tests-admin-table td.tests-actions-cell{width:auto;
        min-width:0;}
.admin-tests-page .tests-admin-table td{overflow:hidden;}
.admin-tests-page .tests-admin-table td:first-child strong,
    .admin-tests-page .tests-admin-table .table-subtext{display:block;
        max-width:100%;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;}
.admin-tests-page .tests-admin-table .test-access-mode{display:block;
        margin-bottom:5px;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;}
.admin-tests-page .tests-admin-table .test-code-copy{max-width:100%;}
.admin-tests-page .tests-admin-actions{display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:5px;
        min-width:0;
        width:100%;
        justify-content:stretch;}
.admin-tests-page .tests-admin-actions .table-action-btn{min-width:0;
        width:100%;
        padding:6px 5px;
        font-size:10px;
        line-height:1.15;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;}
}
/* Slightly tighter intermediate desktop widths while keeping the table readable. */
@media (min-width:781px) and (max-width:1100px){
.admin-tests-page .tests-admin-table th,
    .admin-tests-page .tests-admin-table td{padding-left:6px;
        padding-right:6px;}
.admin-tests-page .tests-admin-table th:first-child,
    .admin-tests-page .tests-admin-table td:first-child{padding-left:10px;}
.admin-tests-page .tests-admin-table th:last-child,
    .admin-tests-page .tests-admin-table td:last-child{padding-right:8px;}
.admin-tests-page .tests-admin-table{font-size:11px;}
.admin-tests-page .tests-admin-table th{font-size:9px;letter-spacing:.045em;}
.admin-tests-page .tests-admin-actions .table-action-btn{font-size:9px;padding:6px 3px;}
}
/* Admin pages: category/page access block matches folder editor layout. */
#categoryModal .admin-pages-access-layout,
#pageModal .admin-pages-access-layout{align-items:start;}
#categoryModal .admin-pages-access-card,
#pageModal .admin-pages-access-card,
#topicModal .modal-form-2col > .modal-card:nth-child(2){min-width:0;}
#categoryModal .admin-pages-access-card .pages-list,
#pageModal .admin-pages-access-card .pages-list{width:100%;}
#pageModal .admin-pages-content-card{min-width:0;}
#pageModal .admin-pages-content-card .markdown-editor,
#pageModal .admin-pages-content-card textarea,
#pageModal .admin-pages-content-card .markdown-preview{width:100%;
    max-width:100%;
    min-width:0;}
#pageModal .admin-pages-order-field{width:min(100%, 260px);
    margin-top:14px;}
@media (max-width:860px){
#categoryModal .modal-content-large,
    #pageModal .modal-content-large{width:min(96vw, 720px);}
#categoryModal .admin-pages-access-card,
    #pageModal .admin-pages-access-card{order:2;}
#pageModal .admin-pages-content-card{order:3;}
}
/* ===== Service data: multi-select departments ===== */
.service-multi-field{min-width:0;}
.service-multi-picker{display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;}
.service-multi-option{min-width:0;
    min-height:42px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:9px 11px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:10px;
    background:rgba(255,255,255,.025);
    color:var(--text-primary,#f4f4f4);
    font:inherit;
    text-align:left;
    cursor:pointer;
    transition:border-color .16s ease,background .16s ease,box-shadow .16s ease;}
.service-multi-option:hover{border-color:rgba(110,155,255,.42);
    background:rgba(110,155,255,.06);}
.service-multi-option input{position:absolute;
    width:1px;
    height:1px;
    opacity:0;
    pointer-events:none;}
.service-multi-check{width:19px;
    height:19px;
    flex:0 0 19px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.25);
    border-radius:6px;
    background:rgba(255,255,255,.035);}
.service-multi-check::after{content:"";
    width:8px;
    height:4px;
    border-left:2px solid #fff;
    border-bottom:2px solid #fff;
    transform:rotate(-45deg) scale(0);
    transition:transform .14s ease;}
.service-multi-option:has(input:checked),
.service-multi-option.is-selected{border-color:rgba(94,139,255,.78);
    background:rgba(73,118,255,.12);
    box-shadow:0 0 0 1px rgba(73,118,255,.08) inset;}
.service-multi-option:has(input:checked) .service-multi-check,
.service-multi-option.is-selected .service-multi-check{border-color:#5f8cff;
    background:#5f8cff;}
.service-multi-option:has(input:checked) .service-multi-check::after,
.service-multi-option.is-selected .service-multi-check::after{transform:rotate(-45deg) scale(1);}
.service-multi-label{min-width:0;
    line-height:1.3;
    overflow-wrap:normal;
    word-break:normal;}
.service-multi-picker--profile{margin-top:2px;}
@media (max-width:760px){
.service-multi-picker{grid-template-columns:1fr;}
.service-multi-option{min-height:46px;}
}
/* Test security mode selector ------------------------------------------------ */
.test-security-mode{display:grid;
    grid-template-columns:1fr;
    gap:9px;}
.test-security-mode__option{position:relative;
    display:flex;
    align-items:flex-start;
    gap:11px;
    min-width:0;
    padding:12px 13px;
    border:1px solid rgba(255,255,255,.085);
    border-radius:10px;
    background:rgba(255,255,255,.018);
    cursor:pointer;
    transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease;}
.test-security-mode__option:hover{border-color:rgba(113,135,228,.34);
    background:rgba(113,135,228,.035);}
.test-security-mode__option.is-selected{border-color:rgba(113,135,228,.58);
    background:rgba(113,135,228,.085);
    box-shadow:0 0 0 3px rgba(113,135,228,.07);}
.test-security-mode__option input[type="radio"]{-webkit-appearance:none;
    appearance:none;
    flex:0 0 20px;
    width:20px;
    height:20px;
    margin:1px 0 0;
    border:1px solid rgba(255,255,255,.2);
    border-radius:50%;
    background:#131a24;
    cursor:pointer;
    transition:border-color .15s ease,box-shadow .15s ease,background .15s ease;}
.test-security-mode__option input[type="radio"]:checked{border:6px solid #7187e4;
    background:#fff;
    box-shadow:0 0 0 3px rgba(113,135,228,.11);}
.test-security-mode__body{display:grid;gap:4px;min-width:0;}
.test-security-mode__body strong{font-size:12px;color:var(--text-primary);line-height:1.3;}
.test-security-mode__body small{font-size:10px;line-height:1.5;color:var(--text-muted);font-weight:400;}
.test-security-badge{display:inline-flex!important;
    align-items:center;
    justify-content:center;
    padding:5px 9px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.1);
    background:rgba(255,255,255,.025);
    font-size:10px;}
.test-security-badge.is-closed{border-color:rgba(225,159,56,.28);background:rgba(225,159,56,.07);color:#e5c177;}
.test-security-badge.is-open{border-color:rgba(82,183,118,.28);background:rgba(82,183,118,.07);color:#91d6a9;}
@media (max-width:700px){
.test-security-mode__option{padding:11px;}
.test-security-mode__body small{font-size:11px;}
}
/* Protected/open test mode status */
.test-runner__mode-line{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:4px;}
.test-runner-security{display:inline-flex;align-items:center;min-height:24px;padding:3px 8px;border:1px solid rgba(255,255,255,.1);border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.035em;line-height:1.2;white-space:nowrap;background:rgba(255,255,255,.035);color:#a9a9a9;}
.test-runner-security.is-closed{border-color:rgba(210,151,48,.34);background:rgba(210,151,48,.08);color:#e7c779;}
.test-runner-security.is-open{border-color:rgba(79,171,111,.3);background:rgba(79,171,111,.08);color:#9bd8ad;}
.tests-active-card .test-runner-security{margin-top:8px;}
@media (max-width:640px){
.test-runner__mode-line{gap:6px}
.test-runner-security{white-space:normal;text-align:center;}
}
/* CSP-safe dynamic presentation: raw HTML carries only validated data-* values.
   ui-security.js applies them through the CSSOM; inline style attributes remain forbidden. */
.role-pill[data-role-color]{background: var(--role-color, rgba(255,255,255,.06));
    border-color: var(--role-color, rgba(255,255,255,.10));}
.group-dot{display:inline-block;
    width:9px;
    height:9px;
    border-radius:999px;
    background:rgba(255,255,255,.25);
    flex:0 0 auto;}
.group-dot[data-role-color]{background:var(--role-color, rgba(255,255,255,.25));}
.nav-link--placeholder{cursor:default; color:var(--text-muted);}
.nav-link--placeholder:hover{color:var(--text-muted); background:transparent;}
.content-section--muted{color:var(--text-muted);}
[hidden]{display:none !important;}
#editMemberModal .member-primary-group[data-role-color]{background:var(--role-color, rgba(255,255,255,.10));
    border-color:var(--role-color, rgba(255,255,255,.18));}
/* Controlled server-error page (used before the normal application shell can render). */
.fatal-page-body{min-height: 100vh;
    margin: 0;
    padding: 24px;
    box-sizing: border-box;
    display: grid;
    place-items: center;
    background: var(--bg-primary, #131a24);
    color: var(--text-primary, #f3f4f6);}
.fatal-page-card{width: min(100%, 620px);
    box-sizing: border-box;
    padding: 28px;
    border: 1px solid var(--border-color, #3b3b3b);
    border-radius: 14px;
    background: var(--bg-secondary, #1a2130);}
.fatal-page-card h1{margin: 0 0 12px; font-size: 24px;}
.fatal-page-card p{margin: 8px 0 0; line-height: 1.55;}
.fatal-page-code{color: var(--text-secondary, #9ca3af); font-size: 13px;}
/* Member editor readability guard ------------------------------------------------
   Keep section headers and assigned-item text visible even when an older theme
   defines generic label/span colors. Scoped to the member editor only. */
#editMemberModal .form-group > label,
#editMemberModal .member-section-label,
#editMemberModal .group-picker__title,
#editMemberModal .qual-picker__title,
#editMemberModal .group-pill__name,
#editMemberModal .qual-pill__name,
#editMemberModal .group-picker__empty,
#editMemberModal .qual-picker__empty{visibility:visible !important;
    opacity:1 !important;}
#editMemberModal .form-group > label,
#editMemberModal .member-section-label,
#editMemberModal .group-pill__name,
#editMemberModal .qual-pill__name{color:var(--text-primary,#f4f4f4) !important;}
#editMemberModal .group-picker__title,
#editMemberModal .qual-picker__title,
#editMemberModal .group-picker__empty,
#editMemberModal .qual-picker__empty{color:var(--text-muted,#9ca3af) !important;}
/* Member exclusion action */
.btn-icon-warning{color: #f3b55b; border-color: rgba(243,181,91,.35);}
.btn-icon-warning:hover{background: rgba(243,181,91,.12); border-color: rgba(243,181,91,.7);}
/* Home application consolidation */
html{scroll-behavior: smooth;}
.home-application-section .apply-wrap{max-width:980px;}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto;}
}
/* Home hero visual refresh */
.logo-top{text-decoration:none; color:inherit;}
.top-bar-menu{display:none;
    width:42px; height:42px; border-radius:12px;
    border:1px solid rgba(255,255,255,.10);
    background:rgba(255,255,255,.04);
    align-items:center; justify-content:center; flex-direction:column;
    gap:4px; margin-left:12px; cursor:pointer;}
.top-bar-menu span{display:block; width:16px; height:2px; border-radius:99px;
    background:rgba(255,255,255,.88);}
@media (max-width: 768px){
.top-bar-menu{display:inline-flex; margin-left:auto;}
}
/* ============================================================
   Home hero — real Brick Rigs screenshots, restrained layout
   ============================================================ */
/* ============================================================
   Profile edit modal — restrained, production-style layout
   ============================================================ */
#profileEditModal{align-items:center;
    justify-content:center;
    padding:20px;}
@media (max-width:760px){
#profileEditModal{padding:8px;}
}
/* editMemberModal — profile link and password control cleanup */
#editMemberModal .member-profile-link{color:#e8eefc;
    background:rgba(255,255,255,.07);
    border-color:rgba(255,255,255,.16);
    font-weight:700;}
#editMemberModal .member-profile-link:hover,
#editMemberModal .member-profile-link:focus-visible{color:#ffffff;
    background:rgba(255,255,255,.11);
    border-color:rgba(255,255,255,.25);}
#editMemberModal .member-password-control{display:flex;
    flex-direction:column;
    align-items:flex-start;}
#editMemberModal .member-password-reset-btn{width:auto;
    min-width:154px;
    min-height:42px;
    margin:0;
    padding:0 16px;
    display:inline-flex;
    align-items:center;
    justify-content:center;}
#editMemberModal .member-password-hint{margin-top:8px;
    max-width:420px;
    line-height:1.45;}
#editMemberModal .member-password-once:not([hidden]){margin-top:9px;}
/* Folder/page tree drag & drop */
#pagesTree .tree-draggable-topic,
#pagesTree .tree-draggable-page{cursor:grab;}
#pagesTree .tree-draggable-topic:active,
#pagesTree .tree-draggable-page:active{cursor:grabbing;}
#pagesTree .tree-dragging{opacity:.48;}
#pagesTree .tree-drop-topic.tree-drop-over,
#pagesTree .tree-drop-category.tree-drop-over{outline:1px solid rgba(84,179,255,.72);
    outline-offset:-1px;
    background:rgba(84,179,255,.10);
    box-shadow:inset 3px 0 0 rgba(84,179,255,.82);}
/* Admin members table — keep compact identifiers from wasting horizontal space */
#membersTable th:nth-child(1),
#membersTable td:nth-child(1){width:58px;
    min-width:58px;
    max-width:58px;
    padding-left:12px;
    padding-right:8px;
    white-space:nowrap;}
#membersTable th:nth-child(4),
#membersTable td:nth-child(4){width:132px;}
#membersTable th:nth-child(5),
#membersTable td:nth-child(5){width:158px;}
#membersTable th:nth-child(6),
#membersTable td:nth-child(6){width:138px;}
/* Admin groups table — compact technical columns */
#groupsTable th:nth-child(1),
#groupsTable td:nth-child(1){width:54px;
    min-width:54px;
    max-width:54px;
    padding-left:12px;
    padding-right:8px;
    white-space:nowrap;}
#groupsTable th:nth-child(7),
#groupsTable td:nth-child(7){width:68px;
    min-width:68px;
    max-width:68px;
    padding-left:10px;
    padding-right:10px;
    text-align:center;
    white-space:nowrap;}
/* 2026-08-25 — primary project palette */
:root{--bg-primary:#131a24;
    --bg-secondary:#141b25;
    --bg-tertiary:#1a2130;
    --surface-1:#141b25;
    --surface-2:#1a2130;
    --surface-3:#22375c;
    --border-color:#22375c;
    --border-soft:rgba(68,131,226,.16);
    --border-strong:rgba(68,131,226,.28);
    --accent-blue:#4483e2;
    --accent-blue-hover:#3b74c9;
    --accent-green:#4483e2;
    --focus-ring:0 0 0 3px rgba(68,131,226,.35);}
body,
.top-bar,
.sidebar,
.main-content{background-color:var(--bg-primary);}
.modal-content,
.card,
.admin-card,
.home-section,
.apply-announce,
.apply-status,
.apply-guard__card{border-color:var(--border-color);}
/* v2026-08-25.28 — modal and application palette synchronization */
.modal{background:rgba(7,12,20,.80);}
.modal-content,
.modal-content-large{background:linear-gradient(180deg, #1a2130 0%, #141b25 100%);
    border:1px solid #22375c;
    box-shadow:0 24px 72px rgba(0,0,0,.48), 0 0 0 1px rgba(68,131,226,.04);}
.modal-content input:not([type="checkbox"]):not([type="radio"]),
.modal-content textarea,
.modal-content select,
.modal-content-large input:not([type="checkbox"]):not([type="radio"]),
.modal-content-large textarea,
.modal-content-large select{background:#131a24;
    border-color:#22375c;}
.modal-content input:focus,
.modal-content textarea:focus,
.modal-content select:focus,
.modal-content-large input:focus,
.modal-content-large textarea:focus,
.modal-content-large select:focus{border-color:#4483e2;
    box-shadow:0 0 0 3px rgba(68,131,226,.18);}
.modal-card,
.info-card,
#viewApplicationModal .application-section,
#viewApplicationModal .application-question,
#viewApplicationModal .application-comments,
#viewApplicationModal .application-comments__msg,
#editMemberModal .member-profile-card,
#groupModal .group-permission-item{background:#131a24;
    border-color:#22375c;}
#viewApplicationModal .application-header{border-color:#22375c;}
#viewApplicationModal .application-question{border-left:3px solid #4483e2;}
#viewApplicationModal .application-view{scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track);}
#viewApplicationModal .application-view::-webkit-scrollbar-track{background:var(--scrollbar-track);}
#viewApplicationModal .application-view::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);}
#viewApplicationModal .application-view::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover);}
/* Status badges must use the same class contract in cards and review modal. */
.status-badge.status-accepted,
.status-badge--accepted{border:1px solid rgba(68,131,226,.30);
    background:rgba(68,131,226,.14);
    color:#75a8f5;}
.status-badge.status-reviewed,
.status-badge--reviewed{border:1px solid rgba(68,131,226,.30);
    background:rgba(68,131,226,.12);
    color:#75a8f5;}
.status-badge.status-pending,
.status-badge--pending{border:1px solid rgba(255,193,7,.28);
    background:rgba(255,193,7,.10);
    color:#e6c762;}
.status-badge.status-rejected,
.status-badge--rejected{border:1px solid rgba(239,83,80,.28);
    background:rgba(239,83,80,.10);
    color:#ff918e;}
.status-badge.status-archived,
.status-badge--archived{border:1px solid rgba(124,150,185,.26);
    background:rgba(34,55,92,.32);
    color:#aebfd8;}
/* Completed application steps should no longer mix green outlines with blue text. */
.steps-list li.is-done::before{background:rgba(68,131,226,.12);
    border-color:rgba(68,131,226,.55);
    color:#4483e2;}
.steps-list li.is-done strong,
.steps-list li.is-done p{color:#4483e2;}
/* Account-level lock has an intentional component style instead of being a bare class. */
/* v2026-08-25.29 — restore pre-blue application text semantics */
.home-application-section .apply-form-title{color:#4caf50;}
/* Admin panel live overview */
.admin-live-grid{display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:18px;
    margin-top:18px;}
.admin-live-card{padding:20px;
    min-width:0;}
.admin-live-card__head{display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    margin-bottom:14px;}
.admin-live-card__title{margin:3px 0 0;
    font-size:18px;
    line-height:1.3;
    color:var(--text-primary);}
.admin-live-count{display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:28px;
    height:24px;
    margin-left:6px;
    padding:0 8px;
    border:1px solid rgba(68,131,226,.32);
    border-radius:999px;
    background:rgba(68,131,226,.10);
    color:#a9c9ff;
    font-size:12px;
    font-weight:750;
    vertical-align:2px;}
.admin-live-refresh{flex:0 0 auto;
    padding:8px 11px;
    font-size:12px;}
.admin-live-list{display:flex;
    flex-direction:column;
    gap:7px;
    max-height:360px;
    overflow:auto;
    scrollbar-width:thin;}
.admin-live-person{display:flex;
    align-items:center;
    gap:9px;
    min-height:42px;
    padding:9px 10px;
    border:1px solid rgba(68,131,226,.14);
    border-radius:9px;
    background:rgba(255,255,255,.025);
    color:var(--text-primary);
    text-decoration:none;}
.admin-live-person:hover{border-color:rgba(68,131,226,.34);
    background:rgba(68,131,226,.08);}
.admin-live-dot{width:9px;
    height:9px;
    flex:0 0 9px;
    border-radius:50%;
    background:#687386;
    box-shadow:0 0 0 3px rgba(104,115,134,.12);}
.admin-live-dot.is-online{background:#4caf50;
    box-shadow:0 0 0 3px rgba(76,175,80,.14);}
.admin-live-person__name{min-width:0;
    flex:1 1 auto;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:13px;
    font-weight:650;}
.admin-live-tag{color:var(--text-muted);
    font-weight:600;}
.admin-live-role,
.admin-live-state{flex:0 0 auto;
    color:var(--text-muted);
    font-size:11px;
    white-space:nowrap;}
.admin-live-role{color:#a9c9ff;}
@media (max-width:900px){
.admin-live-grid{grid-template-columns:1fr;}
}
/* Member editor: application submission lock */
#editMemberApplyBlockedGroup .member-toggle-row--danger:has(input:checked){border-color: rgba(239, 83, 80, .42);
    background: rgba(239, 83, 80, .07);}
#editMemberApplyBlockedGroup .member-toggle-row--danger:has(input:checked) .member-toggle-title{color: #ff8b88;}
/* Application prerequisite is not an account-level block */
/* Discord OAuth authentication */
.auth-discord-btn{width:100%;
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:10px 16px;
    margin:4px 0 14px;
    border:1px solid rgba(88,101,242,.68);
    border-radius:8px;
    background:#5865f2;
    color:#fff;
    text-decoration:none;
    font-size:14px;
    font-weight:700;
    transition:background .16s ease,border-color .16s ease,transform .16s ease;}
.auth-discord-btn:hover,
.auth-discord-btn:focus-visible{background:#4752c4;
    border-color:#7983f5;
    color:#fff;}
.auth-discord-btn:active{transform:translateY(1px)}
.auth-discord-btn .fab{font-size:18px}
.auth-divider{display:flex;
    align-items:center;
    gap:12px;
    margin:0 0 14px;
    color:var(--text-muted);
    font-size:12px;}
.auth-divider::before,.auth-divider::after{content:"";height:1px;flex:1;background:var(--border-soft)}
.discord-account-summary{display:flex;
    align-items:center;
    gap:12px;
    margin:4px 0 10px;
    padding:12px 14px;
    border:1px solid var(--border-soft);
    border-radius:8px;
    background:var(--surface-1);}
.discord-account-summary>.fab{font-size:24px;color:#8d97ff}
.discord-account-summary>div{display:flex;min-width:0;flex-direction:column;gap:2px}
.discord-account-summary strong{color:var(--text-primary);font-size:14px}
.discord-account-summary span{overflow:hidden;text-overflow:ellipsis;color:var(--text-secondary);font-size:12px}
.discord-register-hint{margin-bottom:14px}
.modal-close-link{text-decoration:none}
/* ============================================================
   v2026-08-25.6 — authority, notifications, mentions and search
   ============================================================ */
.authority-locked{display:inline-flex;
    align-items:center;
    min-height:28px;
    max-width:190px;
    color:var(--text-muted);
    font-size:11px;
    line-height:1.35;}
.member-row--authority-locked{opacity:.82;}
.group-authority-weight{display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:34px;
    min-height:27px;
    padding:0 8px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:8px;
    background:rgba(255,255,255,.035);
    color:var(--text-secondary);
    font-size:12px;
    font-weight:800;
    font-variant-numeric:tabular-nums;}
#groupModal .group-permission-meta{display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px 10px;
    margin-top:3px;}
#groupModal .group-permission-key{margin-top:0;}
#groupModal .group-permission-weight{font-size:10px;
    font-weight:800;
    color:rgba(255,255,255,.56);
    white-space:nowrap;}
/* Global search */
.global-search{position:relative;
    flex:1 1 400px;
    width:min(430px,36vw);
    max-width:430px;
    min-width:190px;
    margin-left:auto;
    margin-right:8px;}
.global-search__field{height:40px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:0 9px 0 12px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:10px;
    background:rgba(255,255,255,.025);
    color:var(--text-muted);
    transition:border-color .16s ease,background .16s ease,box-shadow .16s ease;}
.global-search:focus-within .global-search__field{border-color:rgba(89,135,231,.52);
    background:rgba(255,255,255,.045);
    box-shadow:0 0 0 3px rgba(89,135,231,.10);}
.global-search__field input{min-width:0;
    flex:1 1 auto;
    height:100%;
    padding:0;
    border:0;
    outline:0;
    background:transparent;
    color:var(--text-primary);
    font:inherit;
    font-size:13px;}
.global-search__field input::placeholder{color:var(--text-muted);}
.global-search__field input:focus,
.global-search__field input:focus-visible{outline:none;
    box-shadow:none;}
.global-search__field kbd{flex:0 0 auto;
    padding:3px 6px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:6px;
    background:rgba(255,255,255,.035);
    color:var(--text-muted);
    font:700 9px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;}
.global-search__panel{position:absolute;
    top:calc(100% + 9px);
    left:0;
    right:0;
    z-index:550;
    max-height:min(560px,calc(100vh - 90px));
    overflow-y:auto;
    padding:7px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:13px;
    background:#252525;
    box-shadow:0 20px 55px rgba(0,0,0,.48);}
.global-search__section + .global-search__section{margin-top:5px;padding-top:5px;border-top:1px solid rgba(255,255,255,.055);}
.global-search__section-title{padding:6px 8px 4px;
    color:var(--text-muted);
    font-size:10px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;}
.global-search__result{display:grid;
    grid-template-columns:28px minmax(0,1fr);
    gap:9px;
    align-items:center;
    padding:8px;
    border-radius:9px;
    color:inherit;
    text-decoration:none;}
.global-search__result:hover{background:rgba(255,255,255,.05);}
.global-search__result-icon{width:28px;
    height:28px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    background:rgba(78,126,229,.12);
    color:#8eaeef;
    font-size:11px;
    font-weight:900;}
.global-search__result > span:last-child{min-width:0;display:flex;flex-direction:column;gap:2px;}
.global-search__result strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-primary);font-size:12px;}
.global-search__result small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-muted);font-size:10px;}
.global-search__empty{padding:20px 12px;text-align:center;color:var(--text-muted);font-size:12px;}
/* Categorised notification centre */
.notification-center{margin-left:0;}
.notification-panel__head{flex-direction:row;
    align-items:center;
    justify-content:space-between;
    gap:12px;}
.notification-read-all{padding:5px 7px;
    border:0;
    border-radius:7px;
    background:transparent;
    color:#8eaeef;
    font:inherit;
    font-size:11px;
    font-weight:750;
    cursor:pointer;}
.notification-read-all:hover{background:rgba(89,135,231,.10);}
.notification-tabs{display:flex;
    gap:5px;
    padding:8px 9px;
    overflow-x:auto;
    border-bottom:1px solid rgba(255,255,255,.065);
    scrollbar-width:none;}
.notification-tabs::-webkit-scrollbar{display:none;}
.notification-tab{flex:0 0 auto;
    min-height:28px;
    padding:0 8px;
    border:1px solid transparent;
    border-radius:8px;
    background:transparent;
    color:var(--text-muted);
    font:inherit;
    font-size:10px;
    font-weight:750;
    cursor:pointer;}
.notification-tab:hover{color:var(--text-secondary);background:rgba(255,255,255,.035);}
.notification-tab.is-active{color:var(--text-primary);border-color:rgba(89,135,231,.24);background:rgba(89,135,231,.11);}
.notification-item{grid-template-columns:29px minmax(0,1fr);gap:10px;}
.notification-item__type{width:27px;
    height:27px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:1px;
    border-radius:8px;
    background:rgba(255,255,255,.045);
    color:var(--text-muted);
    font-size:11px;
    font-weight:900;}
.notification-item.is-unread .notification-item__type{background:rgba(89,135,231,.15);color:#9ab7f2;}
.notification-item__body{min-width:0;display:flex;flex-direction:column;gap:3px;}
.notification-item.is-unread strong::after{content:"";
    display:inline-block;
    width:6px;
    height:6px;
    margin-left:7px;
    border-radius:50%;
    vertical-align:middle;
    background:#7187e4;}
/* Mention autocomplete in page editor */
.markdown-editor--mentions{position:relative;overflow:visible;}
.mention-suggestions{position:absolute;
    z-index:650;
    left:12px;
    bottom:12px;
    width:min(390px,calc(100% - 24px));
    max-height:250px;
    overflow-y:auto;
    padding:6px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:12px;
    background:#252525;
    box-shadow:0 18px 48px rgba(0,0,0,.45);}
.mention-suggestion{width:100%;
    display:flex;
    flex-direction:column;
    gap:2px;
    padding:9px 10px;
    border:0;
    border-radius:8px;
    background:transparent;
    color:var(--text-primary);
    text-align:left;
    font:inherit;
    cursor:pointer;}
.mention-suggestion:hover,.mention-suggestion:focus-visible{outline:0;background:rgba(255,255,255,.055);}
.mention-suggestion strong{font-size:12px;}
.mention-suggestion span{font-size:10px;color:var(--text-muted);}
.markdown-content a[href*="/page/profile/"]{font-weight:750;}
@media (max-width:980px){
.global-search{width:min(320px,34vw);max-width:320px;}
.global-search__field kbd{display:none;}
}
@media (max-width:768px){
.top-bar-content{gap:6px;}
.top-bar-menu{margin-left:0;}
.global-search{flex:1 1 180px;width:auto;min-width:120px;margin-left:auto;margin-right:3px;}
.global-search__field{padding-left:9px;gap:6px;}
.global-search__field input{font-size:12px;}
.global-search__field input::placeholder{color:transparent;}
.global-search__panel{position:fixed;top:calc(var(--top-bar-height) + 8px);left:10px;right:10px;width:auto;max-height:60vh;}
}
@media (max-width:520px){
.global-search{min-width:42px;max-width:42px;flex-basis:42px;}
.global-search__field{justify-content:center;padding:0;}
.global-search__field input{position:absolute;inset:0;width:100%;opacity:0;cursor:pointer;}
.global-search:focus-within{position:fixed;z-index:620;top:7px;left:54px;right:104px;width:auto;max-width:none;}
.global-search:focus-within .global-search__field{padding:0 10px;justify-content:flex-start;background:#252525;}
.global-search:focus-within .global-search__field input{position:static;opacity:1;cursor:text;}
}
.mention-suggestion.is-active{background:rgba(89,135,231,.13);}
/* ===== Markdown selection toolbar ===== */
.markdown-editor{position:relative;overflow:visible;}
.markdown-toolbar--mode{min-height:42px;padding:7px 10px;}
.markdown-toolbar__label{font-size:12px;font-weight:700;color:var(--text-secondary);letter-spacing:.02em;}
.markdown-toolbar--mode .markdown-tabs{margin-left:auto;}
.markdown-selection-toolbar{position:absolute;
    z-index:40;
    top:50px;
    left:12px;
    max-width:calc(100% - 24px);
    display:flex;
    align-items:center;
    gap:2px;
    padding:5px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:10px;
    background:#171717;
    box-shadow:0 12px 30px rgba(0,0,0,.38);
    overflow-x:auto;
    scrollbar-width:none;}
.markdown-selection-toolbar[hidden]{display:none!important;}
.markdown-selection-toolbar::-webkit-scrollbar{display:none;}
.markdown-format-select{height:30px;
    min-width:108px;
    padding:0 28px 0 9px;
    border:0;
    border-radius:6px;
    background:#171717;
    color:#b7b7b7;
    font-size:12px;
    outline:none;
    cursor:pointer;}
.markdown-format-select:hover,.markdown-format-select:focus{background:#252525;color:#fff;}
.markdown-heading-control{position:relative;flex:0 0 auto;}
.markdown-heading-trigger{display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;}
.markdown-heading-chevron{font-size:12px;line-height:1;color:#777;transform:translateY(-1px);}
.markdown-heading-trigger[aria-expanded="true"]{background:#252525;color:#fff;}
.markdown-heading-menu{position:absolute;
    z-index:60;
    top:calc(100% + 7px);
    left:0;
    width:132px;
    padding:5px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:9px;
    background:#171717;
    box-shadow:0 12px 28px rgba(0,0,0,.42);}
.markdown-heading-menu[hidden]{display:none!important;}
.markdown-heading-menu button{width:100%;
    min-height:30px;
    padding:6px 9px;
    border:0;
    border-radius:6px;
    background:transparent;
    color:#b7b7b7;
    text-align:left;
    font:inherit;
    font-size:12px;
    cursor:pointer;}
.markdown-heading-menu button:hover,.markdown-heading-menu button:focus-visible{background:#292929;color:#fff;outline:none;}
.markdown-format-btn{width:30px;
    height:30px;
    display:inline-grid;
    place-items:center;
    flex:0 0 30px;
    border:0;
    border-radius:6px;
    background:transparent;
    color:#a7a7a7;
    font-size:13px;
    line-height:1;
    cursor:pointer;}
.markdown-format-btn:hover,.markdown-format-btn:focus-visible{background:#292929;color:#fff;outline:none;}
.markdown-format-btn--italic{font-style:italic;font-family:Georgia,serif;}
.markdown-format-btn--strike{text-decoration:line-through;}
.markdown-toolbar-sep{width:1px;height:22px;margin:0 3px;background:rgba(255,255,255,.12);flex:0 0 1px;}
/* Published Markdown lists must render as actual bullets/numbers, not raw '-' text. */
.markdown-content ul,.markdown-preview ul{list-style:disc outside!important;padding-left:26px!important;margin:10px 0 14px;}
.markdown-content ol,.markdown-preview ol{list-style:decimal outside!important;padding-left:28px!important;margin:10px 0 14px;}
.markdown-content li,.markdown-preview li{display:list-item;margin:4px 0;}
.markdown-content blockquote{margin:14px 0;padding:8px 14px;border-left:3px solid var(--accent-blue);color:var(--text-secondary);background:rgba(255,255,255,.025);}
.markdown-content pre{overflow:auto;padding:14px;border-radius:8px;background:var(--bg-tertiary);}
.markdown-content code{padding:2px 5px;border-radius:4px;background:var(--bg-tertiary);}
.markdown-content pre code{padding:0;background:transparent;}
.markdown-content s{text-decoration:line-through;}
.markdown-content hr{border:0;border-top:1px solid var(--border-color);margin:22px 0;}
.markdown-content img{max-width:100%;height:auto;border-radius:8px;display:block;margin:14px 0;}
/* ===== Sidebar active folders + compact Markdown headings ===== */
/* Folder rows use the same dark active state as selected nested pages. */
.nav-item-expandable > .nav-link.active,
.nav-item-expandable > .nav-link--level2.active{background-color: #22375c;
    color: var(--text-primary);}
/* Keep Markdown headings visually distinct without breaking the text rhythm. */
.markdown-content h1,
.markdown-preview h1{margin: 16px 0 6px;
    font-size: 24px;
    line-height: 1.24;
    font-weight: 700;}
.markdown-content h2,
.markdown-preview h2{margin: 14px 0 5px;
    font-size: 20px;
    line-height: 1.28;
    font-weight: 700;}
.markdown-content h3,
.markdown-preview h3{margin: 12px 0 4px;
    font-size: 17px;
    line-height: 1.32;
    font-weight: 650;}
.markdown-content > h1:first-child,
.markdown-content > h2:first-child,
.markdown-content > h3:first-child,
.markdown-preview > h1:first-child,
.markdown-preview > h2:first-child,
.markdown-preview > h3:first-child{margin-top: 0;}
.markdown-content h1 + p,
.markdown-content h2 + p,
.markdown-content h3 + p,
.markdown-preview h1 + p,
.markdown-preview h2 + p,
.markdown-preview h3 + p{margin-top: 0;}
/* v2026-08-25.18 — precise tree sorting */
#pagesTree .tree-draggable-category,
#pagesTree .tree-draggable-topic,
#pagesTree .tree-draggable-page{cursor: grab;}
#pagesTree .tree-draggable-category:active,
#pagesTree .tree-draggable-topic:active,
#pagesTree .tree-draggable-page:active{cursor: grabbing;}
#pagesTree .tree-item-header.tree-drop-before,
#pagesTree .tree-item-header.tree-drop-after{position: relative;}
#pagesTree .tree-item-header.tree-drop-before::before,
#pagesTree .tree-item-header.tree-drop-after::after{content: "";
    position: absolute;
    left: 8px;
    right: 8px;
    height: 3px;
    border-radius: 999px;
    background: #22375c;
    pointer-events: none;
    z-index: 5;}
#pagesTree .tree-item-header.tree-drop-before::before{top: -5px;}
#pagesTree .tree-item-header.tree-drop-after::after{bottom: -5px;}
#pagesTree .tree-item-header.tree-drop-over{outline: 2px solid #22375c;
    outline-offset: -2px;
    background: rgba(34, 55, 92, .12);
    box-shadow: none;}
/* =========================================================
   v2026-08-26.1 — rectangular group chips + compact checkbox
   ========================================================= */
#editMemberModal .group-pill,
#categoryModal .group-pill,
#topicModal .group-pill,
#pageModal .group-pill{border-radius:8px !important;
    min-height:34px;
    padding:6px 8px !important;
    gap:8px;
    border:1px solid rgba(255,255,255,.10) !important;
    border-left:3px solid rgba(148,163,184,.45) !important;
    background:rgba(255,255,255,.028) !important;
    box-shadow:none !important;}
#editMemberModal .group-pill[data-role-color],
#categoryModal .group-pill[data-role-color],
#topicModal .group-pill[data-role-color],
#pageModal .group-pill[data-role-color]{border-left-color:var(--role-color) !important;
    border-color:color-mix(in srgb,var(--role-color) 30%,rgba(255,255,255,.10)) !important;
    background:color-mix(in srgb,var(--role-color) 7%,rgba(255,255,255,.025)) !important;}
#editMemberModal .group-pill__check,
#categoryModal .group-pill__check,
#topicModal .group-pill__check,
#pageModal .group-pill__check{width:8px !important;
    height:8px !important;
    min-width:8px !important;
    flex:0 0 8px !important;
    border-radius:2px !important;
    padding:0 !important;
    font-size:0 !important;
    line-height:0 !important;
    background:#64748b !important;
    color:transparent !important;
    box-shadow:none !important;}
#editMemberModal .group-pill[data-role-color] .group-pill__check,
#categoryModal .group-pill[data-role-color] .group-pill__check,
#topicModal .group-pill[data-role-color] .group-pill__check,
#pageModal .group-pill[data-role-color] .group-pill__check{background:var(--role-color) !important;}
#editMemberModal .group-pill__remove,
#categoryModal .group-pill__remove,
#topicModal .group-pill__remove,
#pageModal .group-pill__remove{width:24px !important;
    height:24px !important;
    min-width:24px;
    border-radius:6px !important;
    border:1px solid transparent !important;
    background:transparent !important;
    color:var(--text-muted,#9ca3af) !important;
    font-size:17px !important;
    line-height:1 !important;}
#editMemberModal .group-pill__remove:hover,
#categoryModal .group-pill__remove:hover,
#topicModal .group-pill__remove:hover,
#pageModal .group-pill__remove:hover{border-color:rgba(255,255,255,.10) !important;
    background:rgba(255,255,255,.055) !important;
    color:var(--text-primary,#f3f4f6) !important;}
/* Keep custom checkboxes square and aligned with the rest of the UI. */
.ui-checkmark{width:18px !important;
    height:18px !important;
    flex:0 0 18px !important;
    border-radius:4px !important;
    border:1px solid rgba(255,255,255,.20) !important;
    background:#171d28 !important;
    box-shadow:none !important;}
.group-permission-item:hover .ui-checkmark,
.group-page-item:hover .ui-checkmark,
.group-default-toggle:hover .ui-checkmark{border-color:rgba(104,128,175,.82) !important;
    background:#1b2331 !important;}
.group-permission-item > input[type="checkbox"]:checked + .ui-checkmark,
.group-page-item > input[type="checkbox"]:checked + .ui-checkmark,
.group-default-toggle > input[type="checkbox"]:checked + .ui-checkmark{border-color:#314d7d !important;
    background:#22375c !important;}
.group-permission-item > input[type="checkbox"]:checked + .ui-checkmark::after,
.group-page-item > input[type="checkbox"]:checked + .ui-checkmark::after,
.group-default-toggle > input[type="checkbox"]:checked + .ui-checkmark::after{width:5px !important;
    height:9px !important;
    border-right:2px solid #fff !important;
    border-bottom:2px solid #fff !important;
    transform:translateY(-1px) rotate(45deg) !important;}
/* =========================================================
   v2026-08-26.3 — compact member email, group popover close,
   profile crop zoom controls
   ========================================================= */
/* Group-access popover: the close control belongs to the panel and must not
   float outside or inherit oversized generic button geometry. */
#categoryModal .group-picker__pop-actions,
#topicModal .group-picker__pop-actions,
#pageModal .group-picker__pop-actions{display:block !important;
    margin-top:10px !important;}
#categoryModal .group-picker__close,
#topicModal .group-picker__close,
#pageModal .group-picker__close{display:flex !important;
    width:100% !important;
    min-width:0 !important;
    min-height:36px !important;
    margin:0 !important;
    padding:8px 12px !important;
    border-radius:8px !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    font-size:13px !important;}
/* Members list: email stays compact until deliberately requested. */
#membersTable .members-email-col{width:1%;
    min-width:92px;
    white-space:nowrap;}
.member-email-toggle{display:inline-flex;
    align-items:center;
    justify-content:flex-start;
    gap:7px;
    max-width:190px;
    min-height:32px;
    padding:6px 9px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:7px;
    background:rgba(255,255,255,.025);
    color:var(--text-secondary);
    font:inherit;
    font-size:12px;
    line-height:1.2;
    cursor:pointer;
    transition:background .15s ease,border-color .15s ease,color .15s ease;}
.member-email-toggle:hover,
.member-email-toggle:focus-visible{background:rgba(255,255,255,.055);
    border-color:rgba(255,255,255,.16);
    color:var(--text-primary);
    outline:none;}
.member-email-toggle svg{width:15px;
    height:15px;
    flex:0 0 15px;}
.member-email-toggle__text{display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;}
.member-email-toggle.is-revealed{max-width:230px;
    color:var(--text-primary);
    border-color:rgba(68,131,226,.32);
    background:rgba(34,55,92,.32);}
/* Profile crop zoom: square-interface slider with visible position/value. */
/* =========================================================
   v2026-08-26.4 — members table column geometry
   Prevent fixed-table cells from overlapping each other.
   ========================================================= */
#membersTable{width:100%;
    min-width:1080px;
    table-layout:fixed;}
#membersTable col.members-col-id{width:76px;}
#membersTable col.members-col-name{width:auto;}
#membersTable col.members-col-email{width:150px;}
#membersTable col.members-col-birth{width:190px;}
#membersTable col.members-col-created{width:190px;}
#membersTable col.members-col-actions{width:170px;}
/* The global table rules intentionally allow wrapping, but this table uses
   horizontal scrolling instead. A cell must never paint over its neighbour. */
#membersTable th,
#membersTable td{min-width:0;
    white-space:nowrap;
    word-break:normal;
    overflow-wrap:normal;
    overflow:hidden;
    text-overflow:ellipsis;
    vertical-align:middle;}
#membersTable th{line-height:1.25;}
#membersTable .members-id-cell,
#membersTable .members-email-col,
#membersTable .members-birth-col,
#membersTable .members-created-col,
#membersTable .members-actions-col{white-space:nowrap;}
#membersTable .members-name-col{min-width:0;}
#membersTable .member-name-cell{min-width:0;
    width:100%;}
#membersTable .member-name-cell > span{min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;}
#membersTable .members-email-col{width:auto;
    min-width:0;}
#membersTable .member-email-toggle{width:118px;
    max-width:118px;
    justify-content:flex-start;
    overflow:hidden;
    box-sizing:border-box;}
#membersTable .member-email-toggle.is-revealed{width:132px;
    max-width:132px;}
#membersTable .member-email-toggle__text{min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;}
#membersTable .members-birth-col,
#membersTable .members-created-col{font-variant-numeric:tabular-nums;}
#membersTable .members-age{color:var(--text-secondary);}
#membersTable .table-actions{flex-wrap:nowrap;
    justify-content:flex-end;}
@media (max-width:1200px){
#membersTable{min-width:1040px;}
#membersTable col.members-col-name{width:300px;}
}
/* ===== v2026-08-26.5 — mobile header order + current blue mobile palette ===== */
@media (max-width:768px){
/* The navigation button belongs before the brand. Search stays on the right
       and therefore no longer competes with the menu hit-area. */
.top-bar-content{justify-content:flex-start;
        gap:8px;
        padding-left:12px;
        padding-right:12px;}
.top-bar-menu{order:0;
        flex:0 0 42px;
        margin:0;
        border-color:#22375c;
        background:#141b25;
        color:var(--text-primary);}
.top-bar-menu:hover,
    .top-bar-menu:focus-visible{border-color:#4483e2;
        background:#1a2130;}
.top-bar-menu span{background:#d9e5f7;}
.logo-top{order:1;
        flex:0 0 auto;
        margin:0;}
.global-search{order:2;
        margin-left:auto;
        margin-right:0;}
.notification-center{order:3;}
.notification-drawer{width:min(100vw, 420px);}
.notification-drawer__controls{padding:12px 14px 14px;}
.notification-item{padding:14px;}
.user-profile{order:4;}
/* Mobile navigation uses the same navy/blue surface system as desktop. */
.sidebar,
    .mobile-nav-sheet{background:#131a24 !important;
        color:var(--text-primary);}
.mobile-nav-sheet{border-color:#22375c;
        box-shadow:0 -18px 44px rgba(5,10,18,.58);}
.mobile-nav-sheet__head{margin:-14px -14px 10px;
        padding:13px 14px 12px;
        background:#141b25;
        border-bottom:1px solid #22375c;}
.mobile-nav-sheet__title{color:#f4f7fb;}
.mobile-nav-sheet__close{width:36px;
        height:36px;
        padding:0;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        border:1px solid #22375c;
        border-radius:8px;
        background:#1a2130;
        color:#d9e5f7;}
.mobile-nav-sheet__close:hover,
    .mobile-nav-sheet__close:focus-visible{border-color:#4483e2;
        background:#22375c;
        color:#fff;}
.mobile-nav-sheet .nav-section-title,
    .sidebar .nav-section-title{color:#91a8c9;}
.mobile-nav-sheet .nav-link,
    .sidebar .nav-link{color:#f4f7fb;}
.mobile-nav-sheet .nav-link:hover,
    .sidebar .nav-link:hover{background:#1a2130;}
.mobile-nav-sheet .nav-link.active,
    .mobile-nav-sheet .nav-item-expandable > .nav-link.active,
    .mobile-nav-sheet .nav-item-expandable > .nav-link--level2.active,
    .sidebar .nav-link.active,
    .sidebar .nav-item-expandable > .nav-link.active,
    .sidebar .nav-item-expandable > .nav-link--level2.active{background:#22375c !important;
        color:#fff !important;}
.mobile-nav-sheet .nav-ico,
    .mobile-nav-sheet .folder-toggle,
    .sidebar .nav-ico,
    .sidebar .folder-toggle{color:#91a8c9;}
.mobile-nav-sheet .nav-link.active .nav-ico,
    .mobile-nav-sheet .nav-link.active .folder-toggle,
    .sidebar .nav-link.active .nav-ico,
    .sidebar .nav-link.active .folder-toggle{color:#fff;}
.mobile-nav-overlay{background:rgba(5,10,18,.66);}
/* Remove the remaining old graphite mobile surfaces around navigation. */
.global-search__panel,
    .notification-panel{background:#141b25;
        border-color:#22375c;}
.global-search:focus-within .global-search__field{background:#1a2130;
        border-color:#4483e2;}
.notification-panel__head,
    .notification-tabs{border-color:#22375c;}
}
@media (max-width:520px){
/* Search expansion starts after the menu button; it may overlay the brand,
       but can no longer cover the menu control itself. */
.global-search:focus-within{left:62px;}
.global-search:focus-within .global-search__field{background:#1a2130;}
}
/* ===== v2026-08-26.8 — canonical sidebar interaction palette =====
   Standard for categories, folders, subfolders and pages:
   - normal text: white
   - selected/open row: #22375c with white text
   - hover row: #22375c with #659ff3 text
*/
.sidebar .nav-section-title,
.mobile-nav-sheet .nav-section-title{color: #ffffff !important;}
.sidebar .nav-link:not(.nav-link--placeholder),
.mobile-nav-sheet .nav-link:not(.nav-link--placeholder){color: #ffffff !important;}
.sidebar .nav-link:not(.nav-link--placeholder) span,
.mobile-nav-sheet .nav-link:not(.nav-link--placeholder) span{color: inherit;}
/* Selected pages/folders and folders that are currently expanded. */
.sidebar .nav-link.active,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link,
.mobile-nav-sheet .nav-link.active,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link{background-color: #22375c !important;
    color: #ffffff !important;}
/* Hover never changes the row background to another blue/grey shade. */
.sidebar .nav-link:not(.nav-link--placeholder):hover,
.mobile-nav-sheet .nav-link:not(.nav-link--placeholder):hover,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:hover,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:hover{background-color: #22375c !important;
    color: #659ff3 !important;}
.sidebar .nav-link:not(.nav-link--placeholder):hover .nav-ico,
.sidebar .nav-link:not(.nav-link--placeholder):hover .category-icon,
.sidebar .nav-link:not(.nav-link--placeholder):hover .nav-page-icon,
.sidebar .nav-link:not(.nav-link--placeholder):hover .nav-page-icon-svg,
.sidebar .nav-link:not(.nav-link--placeholder):hover .folder-toggle,
.mobile-nav-sheet .nav-link:not(.nav-link--placeholder):hover .nav-ico,
.mobile-nav-sheet .nav-link:not(.nav-link--placeholder):hover .category-icon,
.mobile-nav-sheet .nav-link:not(.nav-link--placeholder):hover .nav-page-icon,
.mobile-nav-sheet .nav-link:not(.nav-link--placeholder):hover .nav-page-icon-svg,
.mobile-nav-sheet .nav-link:not(.nav-link--placeholder):hover .folder-toggle{color: #659ff3 !important;}
/* Keep icons/chevrons neutral-white in selected/open rows until hovered. */
.sidebar .nav-link.active .nav-ico,
.sidebar .nav-link.active .category-icon,
.sidebar .nav-link.active .nav-page-icon,
.sidebar .nav-link.active .nav-page-icon-svg,
.sidebar .nav-link.active .folder-toggle,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link .category-icon,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link .folder-toggle,
.mobile-nav-sheet .nav-link.active .nav-ico,
.mobile-nav-sheet .nav-link.active .category-icon,
.mobile-nav-sheet .nav-link.active .nav-page-icon,
.mobile-nav-sheet .nav-link.active .nav-page-icon-svg,
.mobile-nav-sheet .nav-link.active .folder-toggle,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link .category-icon,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link .folder-toggle{color: #ffffff;}
/* ===== v2026-08-26.10 — compact registration date + delegated profile editing ===== */
#membersTable col.members-col-created{width:150px;}
#membersTable .member-registration-toggle{width:118px;
    max-width:118px;}
#membersTable .member-registration-toggle.is-revealed{width:132px;
    max-width:132px;}
/* ===== v2026-08-26.11 — reliable page editor / persistent Markdown tools ===== */
#pageModal .markdown-toolbar--mode{display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    min-height:46px;
    padding:7px 9px;
    border-bottom:1px solid rgba(255,255,255,.09);
    background:#141b25;}
#pageModal .markdown-main-tools{min-width:0;
    display:flex;
    align-items:center;
    gap:2px;
    overflow-x:auto;
    scrollbar-width:thin;}
#pageModal .markdown-main-heading{height:31px;
    min-width:112px;
    max-width:132px;
    padding:0 28px 0 9px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:6px;
    background:#182231;
    color:#fff;
    font:inherit;
    font-size:12px;
    outline:none;
    cursor:pointer;}
#pageModal .markdown-main-heading:hover,
#pageModal .markdown-main-heading:focus{border-color:#22375c;
    background:#1a2a42;}
#pageModal .markdown-main-heading option{background:#141b25;color:#fff;}
#pageModal .markdown-toolbar__meta{flex:0 0 auto;
    display:flex;
    align-items:center;
    gap:10px;}
#pageModal .markdown-draft-status{max-width:190px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#8d9bad;
    font-size:11px;}
#pageModal .markdown-draft-status[data-state="saved"],
#pageModal .markdown-draft-status[data-state="restored"]{color:#659ff3;}
#pageModal .markdown-draft-status[data-state="error"]{color:#e39090;}
#pageModal .markdown-format-btn{border-radius:6px;
    color:#c7d0dc;}
#pageModal .markdown-format-btn:hover,
#pageModal .markdown-format-btn:focus-visible{background:#22375c;
    color:#659ff3;}
#pageModal .markdown-format-btn--image{font-size:17px;}
#pageModal .markdown-selection-toolbar{border-color:rgba(101,159,243,.24);
    background:#141b25;}
#pageModal .markdown-heading-menu{background:#141b25;}
#pageModal .markdown-heading-menu button:hover,
#pageModal .markdown-heading-menu button:focus-visible{background:#22375c;color:#659ff3;}
#pageModal #pageContent.is-image-dragover{outline:2px dashed #659ff3;
    outline-offset:-6px;
    background:rgba(34,55,92,.18);}
#pageModal .markdown-image-manager{margin-top:8px;
    padding:9px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:8px;
    background:#141b25;}
#pageModal .markdown-image-manager[hidden]{display:none!important;}
#pageModal .markdown-image-manager__title{margin-bottom:7px;
    color:#8d9bad;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;}
#pageModal .markdown-image-manager__list{display:flex;
    flex-direction:column;
    gap:6px;}
#pageModal .markdown-image-item{display:grid;
    grid-template-columns:42px minmax(0,1fr) 30px 30px 30px;
    align-items:center;
    gap:6px;
    min-height:46px;
    padding:5px 6px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:7px;
    background:#18212d;}
#pageModal .markdown-image-item img{width:42px;
    height:34px;
    object-fit:cover;
    border-radius:5px;}
#pageModal .markdown-image-item__name{min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#fff;
    font-size:12px;}
#pageModal .markdown-image-item button{width:30px;
    height:30px;
    padding:0;
    border:1px solid rgba(255,255,255,.09);
    border-radius:6px;
    background:transparent;
    color:#b7c1ce;
    cursor:pointer;}
#pageModal .markdown-image-item button:hover{background:#22375c;color:#659ff3;border-color:#22375c;}
@media (max-width:900px){
#pageModal .markdown-toolbar--mode{align-items:stretch;flex-direction:column;}
#pageModal .markdown-main-tools{width:100%;padding-bottom:2px;}
#pageModal .markdown-toolbar__meta{width:100%;justify-content:space-between;}
}
/* ===== v2026-08-26.12 — group popover + Markdown selection polish ===== */
/* The access picker no longer needs a large bottom "Close" action that can
   overlap the form. Closing is a compact control in the popover header. */
#categoryModal .group-picker__pop-head,
#topicModal .group-picker__pop-head,
#pageModal .group-picker__pop-head{display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:8px;}
#categoryModal .group-picker__pop-head .group-picker__pop-title,
#topicModal .group-picker__pop-head .group-picker__pop-title,
#pageModal .group-picker__pop-head .group-picker__pop-title{margin:0;}
#categoryModal .group-picker__pop-close,
#topicModal .group-picker__pop-close,
#pageModal .group-picker__pop-close{width:28px;
    height:28px;
    flex:0 0 28px;
    display:grid;
    place-items:center;
    padding:0;
    border:1px solid rgba(255,255,255,.09);
    border-radius:6px;
    background:transparent;
    color:#9aa6b6;
    font:inherit;
    font-size:19px;
    line-height:1;
    cursor:pointer;}
#categoryModal .group-picker__pop-close:hover,
#topicModal .group-picker__pop-close:hover,
#pageModal .group-picker__pop-close:hover,
#categoryModal .group-picker__pop-close:focus-visible,
#topicModal .group-picker__pop-close:focus-visible,
#pageModal .group-picker__pop-close:focus-visible{background:#22375c;
    border-color:#22375c;
    color:#659ff3;
    outline:none;}
#categoryModal .group-picker__pop-actions,
#topicModal .group-picker__pop-actions,
#pageModal .group-picker__pop-actions{display:none!important;}
/* Inline emphasis must stay inline. It must never inherit heading-like block
   geometry or create an extra vertical gap around a bold fragment. */
.markdown-content strong,
.markdown-preview strong{display:inline!important;
    margin:0!important;
    padding:0!important;
    line-height:inherit!important;}
.markdown-content p,
.markdown-preview p{margin-top:0;
    margin-bottom:7px;}
.markdown-content p:last-child,
.markdown-preview p:last-child{margin-bottom:0;}
/* Preserve an intentional empty line from the page Markdown source. One run of
   blank source lines becomes one restrained spacer in both published content
   and the editor preview. */
.markdown-content > .markdown-spacer,
.markdown-preview > .markdown-spacer{display:block;
    width:100%;
    height:12px;
    margin:0;
    padding:0;
    pointer-events:none;}
/* JS now calculates the floating toolbar position from the textarea selection.
   Remove the old hard-coded top/left values so top-of-editor selections are not covered. */
#pageModal .markdown-selection-toolbar{top:0;
    left:0;
    max-width:calc(100% - 16px);
    will-change:top,left;}
/* ===== v2026-08-26.13 — group access picker containment ===== */
/* The group selector is an inline expandable section, not a floating popover.
   Reset every legacy positioning value so the parent border always grows with it. */
#categoryModal .group-picker,
#topicModal .group-picker,
#pageModal .group-picker{display:flex !important;
    flex-direction:column !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:hidden !important;
    box-sizing:border-box !important;}
#categoryModal .group-picker__popover,
#topicModal .group-picker__popover,
#pageModal .group-picker__popover{position:relative !important;
    inset:auto !important;
    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;
    transform:none !important;
    z-index:auto !important;
    align-self:stretch !important;
    flex:0 0 auto !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    box-sizing:border-box !important;
    margin:12px 0 0 !important;
    overflow:hidden !important;}
#categoryModal .group-picker__grid,
#topicModal .group-picker__grid,
#pageModal .group-picker__grid{width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    max-height:240px !important;
    box-sizing:border-box !important;
    overscroll-behavior:contain;}
#categoryModal .group-picker__popover[hidden],
#topicModal .group-picker__popover[hidden],
#pageModal .group-picker__popover[hidden]{display:none !important;}
/* =========================================================
   v2026-08-26.14 — profile collapse, precise sidebar active state,
   and compact members table geometry
   ========================================================= */
/* Only the actually selected navigation row is highlighted. Merely expanding
   a folder is navigation state, not selection state. */
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active),
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active){background-color:transparent !important;
    color:#ffffff !important;}
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active) .nav-ico,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active) .category-icon,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active) .nav-page-icon,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active) .nav-page-icon-svg,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active) .folder-toggle,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active) .nav-ico,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active) .category-icon,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active) .nav-page-icon,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active) .nav-page-icon-svg,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active) .folder-toggle{color:#ffffff !important;}
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover{background-color:#22375c !important;
    color:#659ff3 !important;}
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover .nav-ico,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover .category-icon,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover .nav-page-icon,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover .nav-page-icon-svg,
.sidebar .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover .folder-toggle,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover .nav-ico,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover .category-icon,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover .nav-page-icon,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover .nav-page-icon-svg,
.mobile-nav-sheet .nav-item-expandable:not(.folder-collapsed) > .nav-link:not(.active):not(.nav-link--path-active):hover .folder-toggle{color:#659ff3 !important;}
/* Interactions are intentionally collapsed on every fresh profile render. */
/* Keep the members table useful without forcing a scrollbar on ordinary
   desktop widths. The name yields space to the revealed registration date. */
#membersTable{min-width:940px !important;}
#membersTable col.members-col-id{width:68px !important;}
#membersTable col.members-col-name{width:235px !important;}
#membersTable col.members-col-email{width:128px !important;}
#membersTable col.members-col-birth{width:174px !important;}
#membersTable col.members-col-created{width:188px !important;}
#membersTable col.members-col-actions{width:147px !important;}
#membersTable .member-registration-toggle{width:118px !important;
    max-width:118px !important;}
#membersTable .member-registration-toggle.is-revealed{width:174px !important;
    max-width:174px !important;}
@media (max-width:1200px){
#membersTable{min-width:940px !important;}
#membersTable col.members-col-name{width:235px !important;}
}
/* =========================================================
   v2026-08-26.15 — active page ancestry in sidebar
   A current nested page highlights only its actual folder chain.
   Manually expanded unrelated folders stay neutral.
   ========================================================= */
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active{background-color:#22375c !important;
    color:#ffffff !important;}
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active .nav-ico,
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active .category-icon,
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active .nav-page-icon,
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active .nav-page-icon-svg,
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active .folder-toggle,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active .nav-ico,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active .category-icon,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active .nav-page-icon,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active .nav-page-icon-svg,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active .folder-toggle{color:#ffffff !important;}
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active:hover,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active:hover{background-color:#22375c !important;
    color:#659ff3 !important;}
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active:hover .nav-ico,
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active:hover .category-icon,
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active:hover .nav-page-icon,
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active:hover .nav-page-icon-svg,
.sidebar .nav-item-expandable > .nav-link.nav-link--path-active:hover .folder-toggle,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active:hover .nav-ico,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active:hover .category-icon,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active:hover .nav-page-icon,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active:hover .nav-page-icon-svg,
.mobile-nav-sheet .nav-item-expandable > .nav-link.nav-link--path-active:hover .folder-toggle{color:#659ff3 !important;}
/* Application word limits — keep the minimum attached to its own textarea. */
/* =========================================================
   v2026-08-26.19 — application auth actions + member flags
   ========================================================= */
/* Member flags use the same compact square language as the rest of the UI. */
#editMemberModal .member-flags-grid{gap:10px;}
#editMemberModal .member-flags-grid .member-toggle-row{min-height:66px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.10);
    background:#171d28;
    box-shadow:none;
    transition:border-color .16s ease, background .16s ease;}
#editMemberModal .member-flags-grid .member-toggle-row:hover{border-color:rgba(101,159,243,.40);
    background:#1a2230;}
#editMemberModal .member-flags-grid input[type="checkbox"]{-webkit-appearance:none !important;
    appearance:none !important;
    width:22px !important;
    height:22px !important;
    min-width:22px !important;
    margin:0 !important;
    padding:0 !important;
    transform:none !important;
    border-radius:5px !important;
    border:1px solid #42516a !important;
    background-color:#111823 !important;
    background-repeat:no-repeat !important;
    background-position:center !important;
    background-size:12px 12px !important;
    box-shadow:none !important;
    cursor:pointer;
    transition:border-color .16s ease, background-color .16s ease, box-shadow .16s ease;}
#editMemberModal .member-flags-grid input[type="checkbox"]:hover{border-color:#659ff3 !important;}
#editMemberModal .member-flags-grid input[type="checkbox"]:focus-visible{outline:none !important;
    border-color:#659ff3 !important;
    box-shadow:0 0 0 3px rgba(101,159,243,.14) !important;}
#editMemberModal .member-flags-grid input[type="checkbox"]:checked{border-color:#3f6098 !important;
    background-color:#22375c !important;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.2' d='m3.2 8.2 3 3.1 6.6-7'/%3E%3C/svg%3E") !important;}
#editMemberApplyBlockedGroup .member-toggle-row--danger:has(input:checked) input[type="checkbox"]{border-color:#8f4a53 !important;
    background-color:#5b2b34 !important;}
/* =========================================================
   v2026-08-26.20 — members email/date column containment
   ========================================================= */
#membersTable{min-width:940px !important;}
#membersTable col.members-col-id{width:68px !important;}
#membersTable col.members-col-name{width:210px !important;}
#membersTable col.members-col-email{width:156px !important;}
#membersTable col.members-col-birth{width:172px !important;}
#membersTable col.members-col-created{width:192px !important;}
#membersTable col.members-col-actions{width:142px !important;}
#membersTable .member-email-toggle{width:126px !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;}
#membersTable .member-email-toggle.is-revealed{width:146px !important;
    max-width:100% !important;}
#membersTable .member-registration-toggle{width:118px !important;
    max-width:100% !important;}
#membersTable .member-registration-toggle.is-revealed{width:174px !important;
    max-width:100% !important;}
#membersTable .members-email-col,
#membersTable .members-birth-col,
#membersTable .members-created-col{overflow:hidden !important;}
@media (max-width:1200px){
#membersTable{min-width:940px !important;}
#membersTable col.members-col-name{width:210px !important;}
}
/* v2026-08-26.21 — site maintenance mode */
body.maintenance-active .main-wrapper{margin-top:calc(var(--top-bar-height) + 58px);
    min-height:calc(100vh - var(--top-bar-height) - 58px);}
.maintenance-banner{position:absolute;
    top:100%;
    left:0;
    right:0;
    min-height:58px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    padding:12px 18px;
    background:linear-gradient(90deg, rgba(43,56,87,.98) 0%, rgba(28,39,60,.98) 52%, rgba(24,34,56,.98) 100%);
    border-top:1px solid rgba(136,176,241,.18);
    border-bottom:1px solid rgba(101,159,243,.34);
    color:#dbe8fb;
    font-size:13px;
    line-height:1.35;
    box-shadow:0 14px 30px rgba(0,0,0,.24);}
.maintenance-banner::before{content:"";
    position:absolute;
    inset:0 auto 0 0;
    width:4px;
    background:linear-gradient(180deg,#ffd167 0%, #e7a847 100%);}
.maintenance-banner__icon{position:absolute;
    left:18px;
    top:50%;
    transform:translateY(-50%);
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.08);
    border-radius:11px;
    background:rgba(255,255,255,.05);
    color:#ffcc73;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.03);}
.maintenance-banner__copy{display:flex;
    width:min(760px,calc(100% - 240px));
    min-width:0;
    flex-direction:column;
    gap:2px;
    align-items:center;
    text-align:center;}
.maintenance-banner__copy strong{color:#fff;font-size:14px;line-height:1.2;}
.maintenance-banner__copy span{color:#c2d1e8;font-size:12px;line-height:1.45;}
.maintenance-banner__immune{position:absolute;
    right:18px;
    top:50%;
    transform:translateY(-50%);
    padding:5px 9px;
    border:1px solid rgba(136,176,241,.26);
    border-radius:8px;
    color:#ddebff;
    background:rgba(101,159,243,.11);
    font-size:11px;
    font-weight:700;
    white-space:nowrap;}
.maintenance-page{min-height:calc(100vh - var(--top-bar-height) - 58px - 120px);
    display:grid;
    place-items:center;
    padding:42px 24px 70px;}
.maintenance-card{width:min(700px, 100%);
    padding:44px;
    border:1px solid rgba(101,159,243,.22);
    border-radius:22px;
    background:linear-gradient(180deg,rgba(26,33,48,.96) 0%,rgba(20,27,37,.98) 100%);
    box-shadow:0 24px 70px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.03);
    text-align:center;}
.maintenance-card__icon{width:78px;
    height:78px;
    margin:0 auto 18px;
    display:grid;
    place-items:center;
    border:1px solid rgba(101,159,243,.24);
    border-radius:20px;
    background:linear-gradient(180deg,rgba(20,32,52,.98) 0%,rgba(16,24,37,.98) 100%);
    color:#80b2ff;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 16px 34px rgba(0,0,0,.18);}
.maintenance-card__icon svg{width:46px;height:46px;}
.maintenance-card__eyebrow{font-size:11px;letter-spacing:.16em;font-weight:800;color:#659ff3;margin-bottom:8px;}
.maintenance-card h1{margin:0;color:#fff;font-size:32px;line-height:1.15;}
.maintenance-card p{max-width:540px;margin:16px auto 0;color:#aeb9c9;font-size:15px;line-height:1.65;}
.maintenance-card__links{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:28px;}
.maintenance-control{padding:22px;margin-top:18px;}
.maintenance-control__head{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;}
.maintenance-control__title{margin:4px 0 7px;font-size:20px;color:#fff;}
.maintenance-control__copy{max-width:720px;margin:0;color:#8f9bad;font-size:13px;line-height:1.55;}
.maintenance-control__body{margin-top:18px;padding-top:18px;border-top:1px solid rgba(101,159,243,.14);}
.maintenance-control__field{padding:14px 14px 12px;border:1px solid rgba(101,159,243,.14);border-radius:14px;background:linear-gradient(180deg,rgba(15,21,31,.78) 0%, rgba(18,25,36,.9) 100%);}
.maintenance-control__label{display:block;margin-bottom:10px;color:#dfe7f4;font-weight:700;}
.maintenance-control__message{width:100%;min-height:112px;resize:vertical;padding:14px 16px;border-radius:12px;border:1px solid rgba(101,159,243,.18);background:rgba(8,12,18,.72);color:#eef4ff;font-size:14px;line-height:1.6;box-shadow:inset 0 1px 0 rgba(255,255,255,.02);transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;}
.maintenance-control__message::placeholder{color:#7f8ea5;}
.maintenance-control__message:hover{border-color:rgba(101,159,243,.28);}
.maintenance-control__message:focus{border-color:rgba(101,159,243,.48);background:rgba(9,14,22,.9);box-shadow:0 0 0 3px rgba(101,159,243,.16);outline:none;}
.maintenance-control__meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;}
.maintenance-control__hint{font-size:12px;color:#8f9bad;line-height:1.45;}
.maintenance-control__counter{font-size:12px;color:#9fb2ce;font-weight:700;white-space:nowrap;}
.maintenance-control__foot{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px;}
.maintenance-control__status{font-size:12px;color:#8f9bad;}
.maintenance-control__status.is-error{color:#ff8e8e;}
.maintenance-control__status.is-success{color:#76d49b;}
.maintenance-switch{display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;white-space:nowrap;}
.maintenance-switch input{position:absolute;opacity:0;pointer-events:none;}
.maintenance-switch__track{width:42px;height:24px;padding:3px;border:1px solid #344158;border-radius:7px;background:#111923;transition:.18s ease;}
.maintenance-switch__thumb{display:block;width:16px;height:16px;border-radius:4px;background:#8490a2;transition:.18s ease;}
.maintenance-switch input:checked + .maintenance-switch__track{background:#22375c;border-color:#365e9e;}
.maintenance-switch input:checked + .maintenance-switch__track .maintenance-switch__thumb{transform:translateX(18px);background:#659ff3;}
.maintenance-switch input:focus-visible + .maintenance-switch__track{box-shadow:0 0 0 3px rgba(101,159,243,.22);}
.maintenance-switch__label{font-size:13px;font-weight:700;color:#d9e0ea;}
.maintenance-control.is-enabled{border-color:#7b4c45;box-shadow:inset 3px 0 0 #c36d59;}
@media (max-width:760px){
.maintenance-banner{justify-content:center;align-items:center;padding:12px 48px;overflow:hidden;}
.maintenance-banner__icon{left:12px;width:30px;height:30px;}
.maintenance-banner__copy{width:100%;min-width:0;align-items:center;text-align:center;}
.maintenance-banner__copy span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.maintenance-banner__immune{display:none;}
.maintenance-page{padding:28px 14px 50px;}
.maintenance-card{padding:30px 20px;border-radius:14px;}
.maintenance-card h1{font-size:26px;}
.maintenance-control__head{flex-direction:column;gap:16px;}
.maintenance-control__meta{align-items:flex-start;flex-direction:column;}
.maintenance-control__foot{align-items:stretch;flex-direction:column;}
.maintenance-control__foot .btn-primary{width:100%;}
}
/* =========================================================
   v2026-08-26.22 — access/application/profile polish
   ========================================================= */
/* Keep each application label visually attached to its own field. */
/* Debug page is intentionally unlinked and permission-protected. */
.debug-page__lead{margin:8px 0 0;color:var(--text-secondary);max-width:760px;line-height:1.55;}
.debug-panel{margin-top:16px;}
.debug-panel__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px;}
.debug-panel__head h2{margin:0 0 5px;font-size:18px;}
.debug-panel__head p{margin:0;color:var(--text-secondary);font-size:13px;line-height:1.45;}
.debug-badge{display:inline-flex;align-items:center;min-height:28px;padding:0 9px;border:1px solid var(--border-color);border-radius:999px;background:rgba(255,255,255,.04);color:var(--text-secondary);font-size:12px;font-weight:700;white-space:nowrap;}
.debug-issue{padding:13px 14px;border:1px solid var(--border-color);border-radius:10px;background:rgba(255,255,255,.025);}
.debug-issue__meta{display:flex;align-items:center;gap:9px;margin-bottom:8px;}
.debug-issue__meta code{color:var(--text-secondary);font-size:12px;}
.debug-issue h3{margin:0 0 6px;font-size:15px;}
.debug-issue p{margin:0;color:var(--text-secondary);font-size:13px;line-height:1.5;}
.debug-status{display:inline-flex;align-items:center;min-height:22px;padding:0 7px;border-radius:999px;font-size:11px;font-weight:800;}
.debug-status--fixed{background:rgba(46,204,113,.12);color:#78d7a5;}
.debug-status--open{background:rgba(255,181,71,.12);color:#ffc46b;}
.debug-log{margin:0;max-height:560px;overflow:auto;padding:14px;border:1px solid var(--border-color);border-radius:10px;background:#0b0e14;color:#d9e2ef;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;}
@media (max-width:680px){
.debug-panel__head{flex-direction:column}
.debug-badge{white-space:normal}
.debug-log{max-height:420px}
}
/* =========================================================
   v2026-08-26.24 — strict UI cleanup / anti-cheap pass
   ========================================================= */
/* Text links: return to the project palette instead of decorative yellow. */
a{color:#8db9ff;
    text-decoration:none;}
a:hover{color:#b6d1ff;
    text-decoration:none;
    opacity:1;}
/* Make the global visual language calmer and more consistent. */
.card,
.modal-card,
.info-card,
.profile-card,
.profile-summary-card,
.profile-media-card,
.application-card,
.admin-live-card,
.dashboard-card,
.dashboard-stat-card,
.dashboard-dept-card,
.dashboard-chart-card,
.group-cat-card,
.feature-card,
.stat-card,
.status-card,
.how-item,
.tests-history-card,
.test-editor-card,
.test-bank-card,
.test-question-editor-card,
.test-question-card,
.tests-entry-card,
.tests-active-card,
.home-hero__card,
.apply-form-section,
.steps-section,
.maintenance-card,
.maintenance-control__field{border-radius:14px;
    box-shadow:0 10px 24px rgba(0,0,0,.14);}
.card,
.modal-card,
.info-card,
.profile-card,
.profile-summary-card,
.profile-media-card,
.application-card,
.admin-live-card,
.dashboard-card,
.dashboard-stat-card,
.dashboard-dept-card,
.dashboard-chart-card,
.group-cat-card,
.feature-card,
.stat-card,
.status-card,
.how-item,
.tests-history-card,
.test-editor-card,
.test-bank-card,
.test-question-editor-card,
.test-question-card,
.tests-entry-card,
.tests-active-card,
.apply-form-section,
.steps-section,
.maintenance-card,
.maintenance-control__field{border-color:rgba(101,159,243,.14);
    background:rgba(20,27,37,.96);}
/* Buttons: flatter and less toy-like. */
.btn,
.btn-primary,
.btn-secondary,
.btn-danger,
.btn-success,
.btn-view,
.btn-submit,
.filter-btn,
.apply-btn,
.btn-submit-apply,
.home-hero__cta,
.home-hero__about,
.home-hero__ghost{border-radius:10px;
    box-shadow:none !important;
    transform:none;}
.btn-primary,
.btn-submit,
.home-hero__cta,
.btn-submit-apply{background:#3f75d6;
    border:1px solid #4d83e4;
    color:#ffffff;}
.btn-primary:hover,
.btn-submit:hover,
.home-hero__cta:hover,
.btn-submit-apply:hover{background:#4a83eb;
    border-color:#5b92f2;}
.btn-secondary,
.home-hero__about,
.home-hero__ghost{background:rgba(255,255,255,.04);
    border:1px solid rgba(101,159,243,.16);
    color:#edf3ff;}
.btn-secondary:hover,
.home-hero__about:hover,
.home-hero__ghost:hover{background:rgba(255,255,255,.065);
    border-color:rgba(101,159,243,.28);}
/* Inputs and textareas: solid, neat, without “AI template” shine. */
.form-input,
.form-select,
.search-input,
.form-group input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
.form-group textarea,
.form-group select,
.form-control,
textarea,
select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"]{border-radius:10px;
    background:#141b25;
    border-color:rgba(101,159,243,.16);
    box-shadow:none;}
.form-input:focus,
.form-select:focus,
.search-input:focus,
.form-group input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]):focus,
.form-group textarea:focus,
.form-group select:focus,
.form-control:focus,
textarea:focus,
select:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus{border-color:rgba(101,159,243,.42);
    box-shadow:0 0 0 3px rgba(101,159,243,.10);}
/* Calm icon containers. */
.maintenance-card__icon,
.apply-approved__icon,
.how-item__icon,
.feature-icon,
.profile-interactions-chevron,
.home-hero__card-label{box-shadow:none !important;}
.maintenance-card__icon,
.apply-approved__icon{border-radius:14px;
    border-color:rgba(101,159,243,.18);
    background:rgba(18,27,41,.96);}
/* Application steps and support sections: cleaner, less decorative. */
.steps-list li{margin-bottom:16px;}
.steps-list li::before{width:30px;
    height:30px;
    border-radius:10px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(101,159,243,.16);}
.steps-list li.is-done::before{background:rgba(58,210,111,.10);
    border-color:rgba(58,210,111,.28);}
/* Hero cards and chips: less showroom-template, more product-like. */
/* Remove excessively “poster-ish” accent gradients from utility blocks. */
.apply-guard__card,
.maintenance-card,
.maintenance-control__field{background:rgba(20,27,37,.97);}
/* Mobile keeps the same restrained geometry. */
@media (max-width:760px){
.card,
    .modal-card,
    .info-card,
    .profile-card,
    .profile-summary-card,
    .profile-media-card,
    .application-card,
    .admin-live-card,
    .dashboard-card,
    .dashboard-stat-card,
    .dashboard-dept-card,
    .dashboard-chart-card,
    .group-cat-card,
    .feature-card,
    .stat-card,
    .status-card,
    .how-item,
    .home-hero__card,
    .apply-form-section,
    .steps-section,
    .maintenance-card,
    .maintenance-control__field{border-radius:12px;}
}
/* =========================================================
   v2026-08-26.25 — grouped service departments
   ========================================================= */
#editMemberModal .qual-picker__popover{width:min(560px, calc(100vw - 56px));
    max-height:min(620px, calc(100vh - 160px));
    overflow:auto;}
#editMemberModal .qual-picker__section{margin:0 0 16px;
    padding-bottom:14px;
    border-bottom:1px solid rgba(101,159,243,.10);}
#editMemberModal .qual-picker__section:last-of-type{border-bottom:0;}
#editMemberModal .qual-picker__section-title{margin-bottom:8px;
    color:#aebbd0;
    font-size:11px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;}
#editMemberModal .qual-picker__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
#editMemberModal .qual-check{min-height:42px;
    padding:9px 11px;
    border-radius:9px;
    border-color:rgba(101,159,243,.13);
    background:rgba(255,255,255,.025);
    line-height:1.3;}
#editMemberModal .qual-check__name{overflow-wrap:anywhere;}
@media (max-width:680px){
#editMemberModal .qual-picker__popover{right:auto;
        left:0;
        width:min(92vw, 440px);
        max-height:62vh;}
#editMemberModal .qual-picker__grid{grid-template-columns:1fr;}
}
/* =========================================================
   v2026-08-26.26 — application section background cleanup
   ========================================================= */
/* v2026-08-26.32 — Discord nickname bot diagnostics */
.debug-bot-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:4px;}
.debug-bot-stat{min-width:0;padding:11px 12px;border:1px solid var(--border-color);border-radius:10px;background:rgba(255,255,255,.025);}
.debug-bot-stat span{display:block;margin-bottom:5px;color:var(--text-secondary);font-size:11px;line-height:1.25;}
.debug-bot-stat strong{display:block;overflow:hidden;color:var(--text-primary);font-size:14px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap;}
.debug-bot-error{margin-top:12px;padding:10px 12px;border:1px solid rgba(239,83,80,.25);border-radius:9px;background:rgba(239,83,80,.07);color:#efb5b3;font-size:12px;line-height:1.45;}
.debug-bot-events{margin-top:16px;}
.debug-bot-event{display:grid;grid-template-columns:160px 120px minmax(0,1fr);gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:12px;line-height:1.4;}
.debug-bot-event:last-child{border-bottom:0;}
.debug-bot-event>span{color:var(--text-muted);font-variant-numeric:tabular-nums;}
.debug-bot-event>strong{color:#9fbeef;font-weight:700;}
.debug-bot-event>p{margin:0;color:var(--text-secondary);overflow-wrap:anywhere;}
@media (max-width:980px){
.debug-bot-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.debug-bot-event{grid-template-columns:1fr;gap:3px;}
}
@media (max-width:520px){
.debug-bot-grid{grid-template-columns:1fr;}
}
/* =========================================================
   v2026-08-26.33 — RolePlay explainer blocks on home
   ========================================================= */
/* v2026-08-26.34 — Discord prerequisite for applications */
/* =========================================================
   v2026-08-26.36 — Markdown tables for knowledge-base pages
   ========================================================= */
.markdown-content table,
.markdown-preview table{width:100%;
    margin:18px 0 24px;
    border-collapse:separate;
    border-spacing:0;
    border:1px solid rgba(255,255,255,.12);
    border-radius:10px;
    background:#141b25;
    overflow:hidden;
    font-size:14px;
    line-height:1.5;}
.markdown-content th,
.markdown-preview th{padding:11px 12px;
    border-right:1px solid rgba(255,255,255,.12);
    border-bottom:1px solid rgba(255,255,255,.14);
    background:#1a2130;
    color:#fff;
    font-size:13px;
    font-weight:750;
    text-align:left;
    vertical-align:top;}
.markdown-content td,
.markdown-preview td{padding:12px;
    border-right:1px solid rgba(255,255,255,.10);
    border-bottom:1px solid rgba(255,255,255,.10);
    color:#d9e1ec;
    text-align:left;
    vertical-align:top;
    overflow-wrap:anywhere;}
.markdown-content th:last-child,
.markdown-content td:last-child,
.markdown-preview th:last-child,
.markdown-preview td:last-child{border-right:0;}
.markdown-content tbody tr:last-child td,
.markdown-preview tbody tr:last-child td{border-bottom:0;}
.markdown-content tbody tr:hover td,
.markdown-preview tbody tr:hover td{background:rgba(101,159,243,.035);}
@media (max-width:760px){
.markdown-content table,
    .markdown-preview table{display:block;
        overflow-x:auto;
        max-width:100%;
        border-radius:8px;
        -webkit-overflow-scrolling:touch;}
.markdown-content table thead,
    .markdown-content table tbody,
    .markdown-preview table thead,
    .markdown-preview table tbody{display:table;
        width:100%;
        min-width:680px;
        table-layout:auto;}
}
/* =========================================================
   v2026-08-26.40 — Community news
   ========================================================= */
/* v2026-08-26.48 — Media editor, newsroom preparation and live preview */
/* v2026-08-26.50 — Media submit: two-column, two-surface layout */
/* v2026-08-26.51 — simplified non-news Media editor + attachment preview */
.media-file-picker{width:100%;min-width:0;overflow:hidden;}
.media-file-picker__preview{display:flex;width:100%;min-height:220px;align-items:center;justify-content:center;overflow:hidden;border:1px dashed rgba(255,255,255,.10);border-radius:9px;background:#141b25;color:#72839a;font-size:11px;box-sizing:border-box;}
.media-file-picker__preview.has-file{border-style:solid;background:#0b1420;}
.media-file-picker__preview img,.media-file-picker__preview video{display:block;width:100%;max-width:100%;max-height:520px;object-fit:contain;background:#09111b;}
.media-file-picker__meta{margin-top:8px;padding:8px 10px;overflow:hidden;border:1px solid rgba(255,255,255,.06);border-radius:7px;background:#111b28;color:#8fa0b7;font-size:10px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap;}
.media-file-picker__actions{display:grid;grid-template-columns:minmax(0,180px) minmax(0,180px);gap:7px;margin-top:9px;}
@media (max-width:768px){
.media-file-picker__preview{min-height:160px}
.media-file-picker__actions{grid-template-columns:1fr 1fr}
}
@media (max-width:420px){
.media-file-picker__actions{grid-template-columns:1fr}
.media-file-picker__preview{min-height:135px}
}
/* v2026-08-26.52 — input surface + media title limit */
/* v2026-08-27.61 — public profile activity */
/* =========================================================
   v2026-08-27.63 — members management without horizontal scroll
   The participants table fits its content area on desktop and becomes
   stacked records on narrower viewports instead of scrolling sideways.
   ========================================================= */
#adminMembersPage .members-table-container{width:100%;
    max-width:100%;
    overflow-x:hidden !important;
    overflow-y:visible !important;}
#adminMembersPage #membersTable{width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    table-layout:fixed !important;}
#adminMembersPage #membersTable col.members-col-id{width:7% !important;}
#adminMembersPage #membersTable col.members-col-name{width:27% !important;}
#adminMembersPage #membersTable col.members-col-email{width:15% !important;}
#adminMembersPage #membersTable col.members-col-birth{width:18% !important;}
#adminMembersPage #membersTable col.members-col-created{width:18% !important;}
#adminMembersPage #membersTable col.members-col-actions{width:15% !important;}
#adminMembersPage #membersTable th,
#adminMembersPage #membersTable td{padding-left:10px;
    padding-right:10px;
    min-width:0 !important;}
#adminMembersPage #membersTable .members-birth-col,
#adminMembersPage #membersTable .members-created-col{white-space:normal !important;
    line-height:1.35;}
#adminMembersPage #membersTable .members-age{display:block;
    margin-top:2px;
    white-space:nowrap;
    font-size:11px;}
#adminMembersPage #membersTable .member-email-toggle,
#adminMembersPage #membersTable .member-email-toggle.is-revealed,
#adminMembersPage #membersTable .member-registration-toggle,
#adminMembersPage #membersTable .member-registration-toggle.is-revealed{width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding-left:8px;
    padding-right:8px;}
#adminMembersPage #membersTable .table-actions{gap:5px;
    flex-wrap:wrap;
    justify-content:flex-end;}
@media (max-width:980px){
#adminMembersPage .members-table-container{overflow:visible !important;
        border:0;
        background:transparent;}
#adminMembersPage #membersTable{display:block;
        width:100% !important;
        min-width:0 !important;}
#adminMembersPage #membersTable colgroup,
    #adminMembersPage #membersTable thead{display:none;}
#adminMembersPage #membersTable tbody{display:grid;
        width:100%;
        gap:10px;}
#adminMembersPage #membersTable tbody tr{display:grid;
        grid-template-columns:minmax(0,1fr) minmax(0,1fr);
        width:100%;
        overflow:hidden;
        border:1px solid var(--border-soft);
        border-radius:10px;
        background:var(--bg-secondary);}
#adminMembersPage #membersTable tbody tr:hover{background:var(--bg-secondary);}
#adminMembersPage #membersTable td{display:grid;
        grid-template-columns:105px minmax(0,1fr);
        align-items:center;
        gap:10px;
        width:auto !important;
        min-width:0 !important;
        padding:10px 12px;
        border:0;
        border-bottom:1px solid rgba(255,255,255,.055);
        white-space:normal !important;
        overflow:visible !important;
        text-overflow:clip !important;}
#adminMembersPage #membersTable td:nth-child(odd){border-right:1px solid rgba(255,255,255,.055);}
#adminMembersPage #membersTable td:nth-last-child(-n/**/+2){border-bottom:0;}
#adminMembersPage #membersTable td::before{color:var(--text-muted);
        font-size:10px;
        font-weight:750;
        letter-spacing:.045em;
        text-transform:uppercase;}
#adminMembersPage #membersTable td:nth-child(1)::before{content:"ID";}
#adminMembersPage #membersTable td:nth-child(2)::before{content:"Никнейм";}
#adminMembersPage #membersTable td:nth-child(3)::before{content:"Почта";}
#adminMembersPage #membersTable td:nth-child(4)::before{content:"Дата рождения";}
#adminMembersPage #membersTable td:nth-child(5)::before{content:"Регистрация";}
#adminMembersPage #membersTable td:nth-child(6)::before{content:"Действия";}
#adminMembersPage #membersTable .member-name-cell{width:100%;}
#adminMembersPage #membersTable .member-name-cell > span{white-space:normal;
        overflow-wrap:anywhere;
        text-overflow:clip;}
#adminMembersPage #membersTable .members-age{display:inline;
        margin:0;}
#adminMembersPage #membersTable .member-email-toggle,
    #adminMembersPage #membersTable .member-registration-toggle{width:max-content !important;
        max-width:100% !important;}
#adminMembersPage #membersTable .table-actions{justify-content:flex-start;}
#adminMembersPage #membersTable .table-state-cell{display:block !important;
        grid-column:1 / -1;
        padding:20px !important;
        text-align:center;
        border:0 !important;}
#adminMembersPage #membersTable .table-state-cell::before{content:none !important;}
}
@media (max-width:620px){
#adminMembersPage .admin-members-container{padding-left:0;
        padding-right:0;}
#adminMembersPage #membersTable tbody tr{grid-template-columns:1fr;}
#adminMembersPage #membersTable td,
    #adminMembersPage #membersTable td:nth-child(odd),
    #adminMembersPage #membersTable td:nth-last-child(-n/**/+2){border-right:0;
        border-bottom:1px solid rgba(255,255,255,.055);}
#adminMembersPage #membersTable td:last-child{border-bottom:0;}
}
/* v2026-08-27.74 — Lucide folder icon for categories/folders */
.category-icon.lucide-folder{width:16px;
    min-width:16px;
    height:16px;
    stroke:currentColor;
    fill:none;}
/* v81: linked Discord is displayed read-only in the application form. */
/* ===== v2026-08-28.87 — modal performance =====
   Full-screen backdrop blur caused expensive repaints in large admin dialogs.
   Keep the same dark hierarchy without GPU-heavy live blurring. */
.modal{background:rgba(5,10,17,.82) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;}
.modal-content,
.modal-content-large{animation:modalFastOpen .12s ease-out !important;
    box-shadow:0 16px 42px rgba(0,0,0,.42) !important;}
@keyframes modalFastOpen{from{opacity:.72;transform:translateY(5px);}
    to{opacity:1;transform:translateY(0);}}
/* Expensive live blur inside already-overlaid dialogs is redundant. */
.modal .test-editor-footer,
.modal .test-freeze-overlay,
.news-editor-modal__backdrop{backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;}
#testEditorModal .test-editor-footer{background:rgb(31,31,31) !important;}
/* Do not repaint animated scenery behind a dialog while the user is working. */
/* Respect reduced-motion and make modal interaction instant on constrained devices. */
@media (prefers-reduced-motion: reduce){
.modal-content,
    .modal-content-large{animation:none !important;}
}
/* v2026-08-30.100 — Media category placement + protected membership marker */
.group-pill__system{margin-left:auto;
    padding:2px 6px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:999px;
    color:#78899f;
    font-size:9px;
    font-weight:700;
    white-space:nowrap;}
/* ===== v2026-09-01.126 — gold weekly Media profile award ===== */
/* ===== v2026-08-30.107 — revisions, audit, settings, achievements, danger confirm ===== */
.page-history-link{appearance:none;
    border:0;
    padding:0;
    background:transparent;
    color:#7faeff;
    font:inherit;
    font-weight:700;
    cursor:pointer;}
.page-history-link:hover,
.page-history-link:focus-visible{color:#a7c7ff;text-decoration:underline;outline:none;}
body.revision-modal-open{overflow:hidden;}
.revision-modal[hidden]{display:none!important;}
.revision-modal{position:fixed;
    inset:0;
    z-index:1200;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;}
.revision-modal__backdrop{position:absolute;
    inset:0;
    border:0;
    background:rgba(5,9,15,.78);
    cursor:default;}
.revision-modal__dialog{position:relative;
    z-index:1;
    width:min(1180px,calc(100vw - 48px));
    height:min(820px,calc(100dvh - 48px));
    min-height:460px;
    display:grid;
    grid-template-rows:auto minmax(0,1fr);
    overflow:hidden;
    border:1px solid #22375c;
    border-radius:14px;
    background:#131a24;
    box-shadow:0 30px 90px rgba(0,0,0,.55);}
.revision-modal__header{display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:18px 20px;
    border-bottom:1px solid #22375c;
    background:#141b25;}
.revision-modal__header h2{margin:2px 0 0;font-size:20px;line-height:1.2;text-transform:uppercase;letter-spacing:.02em;}
.revision-modal__close{width:38px;height:38px;flex:0 0 38px;
    border:1px solid transparent;border-radius:10px;
    background:transparent;color:#8b9bb0;font-size:28px;line-height:1;cursor:pointer;}
.revision-modal__close:hover,.revision-modal__close:focus-visible{border-color:#22375c;background:#1a2130;color:#fff;outline:none;}
.revision-modal__body{min-height:0;
    display:grid;
    grid-template-columns:minmax(260px,330px) minmax(0,1fr);}
.revision-list{min-width:0;
    overflow:auto;
    padding:14px;
    border-right:1px solid #22375c;
    background:#111821;}
.revision-card{width:100%;
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
    margin:0 0 10px;
    padding:15px 16px;
    border:1px solid #253449;
    border-radius:12px;
    background:#182231;
    color:#f5f8fc;
    text-align:left;
    cursor:pointer;
    transition:border-color .16s ease,background .16s ease,transform .16s ease;}
.revision-card:hover{border-color:#41679d;background:#1b293b;}
.revision-card.is-current{border-color:#3768a4;}
.revision-card.is-active{border-color:#5b8cff;background:#1b2a40;box-shadow:inset 0 0 0 1px rgba(91,140,255,.18);}
.revision-card strong{font-size:14px;line-height:1.3;}
.revision-card>span:not(.revision-badge){color:#a9bbd2;font-size:12px;line-height:1.45;overflow-wrap:anywhere;}
.revision-card small{color:#7890ad;font-size:11px;}
.revision-badge{display:inline-flex;align-items:center;min-height:25px;padding:4px 10px;
    border-radius:999px;background:#193b68;color:#69a7ff;
    font-size:10px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;}
.revision-detail{min-width:0;
    min-height:0;
    overflow:auto;
    padding:18px 20px 24px;
    background:#131a24;}
.revision-detail__head{display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:24px;
    margin-bottom:18px;
    padding:0 2px 17px;
    border-bottom:1px solid #22375c;}
.revision-detail__head h3{margin:12px 0 7px;font-size:22px;line-height:1.25;}
.revision-detail__head p{margin:0;color:#9fb2ca;font-size:13px;line-height:1.55;}
.revision-detail__meta{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex:0 0 auto;color:#8ea5c2;font-size:11px;text-align:right;}
.revision-diff{overflow:hidden;
    border:1px solid #26364c;
    border-radius:11px;
    background:#101720;
    font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;}
.revision-diff__row{display:grid;
    grid-template-columns:34px 48px 48px minmax(0,1fr);
    min-height:31px;
    border-bottom:1px solid rgba(255,255,255,.035);
    color:#a9b6c8;}
.revision-diff__row:last-child{border-bottom:0;}
.revision-diff__row.is-add{background:#153f32;color:#61e8a2;}
.revision-diff__row.is-del{background:#54252d;color:#ff737d;}
.revision-diff__sign,.revision-diff__ln{display:flex;align-items:flex-start;justify-content:center;
    padding:7px 5px;
    border-right:1px solid rgba(255,255,255,.06);
    font-size:11px;line-height:1.55;user-select:none;}
.revision-diff__sign{font-weight:900;}
.revision-diff code{min-width:0;
    padding:7px 10px;
    color:inherit;
    background:transparent;
    font:inherit;
    line-height:1.55;
    white-space:pre-wrap;
    overflow-wrap:anywhere;}
.revision-empty-diff,.ui-inline-state{padding:18px;
    border:1px dashed #2b3b51;
    border-radius:10px;
    color:#8fa3bd;
    text-align:center;}
.ui-inline-state.is-error{border-color:rgba(255,104,113,.35);color:#ff9aa1;background:rgba(120,30,37,.15);}
.danger-confirm[hidden]{display:none!important;}
.danger-confirm{position:fixed;inset:0;z-index:1500;display:flex;align-items:center;justify-content:center;padding:20px;}
.danger-confirm__backdrop{position:absolute;inset:0;background:rgba(4,7,12,.8);}
.danger-confirm__dialog{position:relative;z-index:1;width:min(520px,100%);padding:22px;border:1px solid #4f2d36;border-radius:14px;background:#141b25;box-shadow:0 30px 90px rgba(0,0,0,.55);}
.danger-confirm__eyebrow{margin-bottom:8px;color:#ff7b84;font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;}
.danger-confirm__dialog h3{margin:0 0 10px;font-size:20px;}
.danger-confirm__message{margin:0 0 17px;color:#aebdd0;line-height:1.55;}
.danger-confirm__label{display:block;margin-bottom:8px;color:#d9e3f1;font-size:12px;font-weight:700;}
.danger-confirm__input{width:100%;}
.danger-confirm__actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;}
@media (max-width:980px){
.revision-modal__body{grid-template-columns:280px minmax(0,1fr);}
}
@media (max-width:720px){
.revision-modal{padding:8px;}
.revision-modal__dialog{width:calc(100vw - 16px);height:calc(100dvh - 16px);border-radius:10px;}
.revision-modal__body{grid-template-columns:1fr;grid-template-rows:minmax(165px,34%) minmax(0,1fr);}
.revision-list{border-right:0;border-bottom:1px solid #22375c;}
.revision-detail{padding:14px;}
.revision-detail__head{flex-direction:column;gap:10px;}
.revision-detail__meta{align-items:flex-start;text-align:left;}
.revision-diff__row{grid-template-columns:28px 38px 38px minmax(0,1fr);}
.revision-diff__ln{font-size:9px;}
.danger-confirm__actions{flex-direction:column-reverse;}
.danger-confirm__actions button{width:100%;}
}
.revision-diff__row.is-omit{background:#151f2c;color:#7187a4;font-style:italic;}
.revision-diff__row.is-omit code{text-align:center;}
/* ===== v116 — Media publication moderation ===== */
/* ===== v118: protected PDF attachments on content pages ===== */
.markdown-format-btn--file{width:auto;
    min-width:40px;
    padding:0 8px;
    font-size:10px;
    font-weight:800;
    letter-spacing:.35px;}
.markdown-content blockquote:has(a[href*="/api/page-file.php?file="]),
.markdown-preview blockquote:has(a[href*="/api/page-file.php?file="]){margin:16px 0;
    padding:14px 16px;
    border:1px solid var(--border-color);
    border-left:3px solid var(--accent-blue);
    border-radius:9px;
    background:rgba(255,255,255,.035);
    color:var(--text-primary);
    font-style:normal;}
.markdown-content blockquote:has(a[href*="/api/page-file.php?file="]) strong,
.markdown-preview blockquote:has(a[href*="/api/page-file.php?file="]) strong{display:inline-block;
    margin-bottom:4px;
    font-size:15px;}
.markdown-content blockquote:has(a[href*="/api/page-file.php?file="]) span,
.markdown-preview blockquote:has(a[href*="/api/page-file.php?file="]) span{color:var(--text-secondary);
    font-size:12px;}
.markdown-content blockquote:has(a[href*="/api/page-file.php?file="]) a,
.markdown-preview blockquote:has(a[href*="/api/page-file.php?file="]) a{display:inline-block;
    margin-top:9px;
    padding:6px 10px;
    border:1px solid var(--border-color);
    border-radius:7px;
    background:var(--bg-tertiary);
    text-decoration:none;
    font-size:12px;
    font-weight:600;}
/* ===== v120 — simplified Media likes and readable stats ===== */
/* ===== v121 — page proposals + sequential navigation ===== */
.page-sequential-nav{display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:12px;
    margin:18px 0 0;}
.page-sequential-nav__item{display:flex;
    min-width:0;
    flex-direction:column;
    gap:6px;
    padding:14px 16px;
    border:1px solid #263b58;
    border-radius:12px;
    background:#151e2a;
    color:#dfeaff;
    text-decoration:none;
    transition:border-color .15s ease,background .15s ease,transform .15s ease;}
.page-sequential-nav__item:hover{border-color:#466ca4;
    background:#182536;
    transform:translateY(-1px);}
.page-sequential-nav__item.is-next{text-align:right;align-items:flex-end;}
.page-sequential-nav__direction{color:#7faeff;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;}
.page-sequential-nav__item strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;}
.page-sequential-nav__spacer{min-width:0;}
.page-propose-link{color:#8db5ff;}
.page-proposal-modal__dialog{width:min(960px,calc(100vw - 32px));height:min(86dvh,820px);}
.page-proposal-form{display:flex;min-height:0;flex:1;flex-direction:column;gap:14px;padding:18px 20px;overflow:auto;}
.page-proposal-form .form-group{margin:0;}
.page-proposal-editor{width:100%;min-height:360px;resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;line-height:1.55;}
.page-proposal-form__status{min-height:20px;color:#8fa7c5;font-size:12px;}
.page-proposal-form__status .is-error{color:#ff9aa1;}
.page-proposal-form__actions{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-top:auto;padding-top:4px;}
.nav-count-badge{display:inline-flex;
    min-width:18px;
    height:18px;
    align-items:center;
    justify-content:center;
    margin-left:5px;
    padding:0 5px;
    border-radius:999px;
    background:#2d5fa7;
    color:#fff;
    font-size:10px;
    font-weight:800;
    vertical-align:middle;}
.proposal-admin-toolbar{display:flex;gap:8px;margin-bottom:12px;}
.proposal-filter{padding:8px 12px;border:1px solid #26364c;border-radius:9px;background:#151e2a;color:#9db0c8;font:inherit;font-size:12px;font-weight:750;cursor:pointer;}
.proposal-filter:hover,.proposal-filter.is-active{border-color:#456b9f;background:#1b2a3f;color:#dceaff;}
.proposal-review-workspace{display:grid;grid-template-columns:minmax(260px,340px) minmax(0,1fr);min-height:650px;border:1px solid #26364c;border-radius:14px;overflow:hidden;background:#121922;}
.proposal-review-list{display:flex;flex-direction:column;gap:8px;padding:12px;border-right:1px solid #26364c;overflow:auto;}
.proposal-review-card{display:flex;width:100%;flex-direction:column;align-items:flex-start;gap:5px;padding:12px;border:1px solid #25364d;border-radius:10px;background:#171f2b;color:#d9e6f7;text-align:left;cursor:pointer;}
.proposal-review-card:hover,.proposal-review-card.is-active{border-color:#456b9f;background:#1b2a3f;}
.proposal-review-card strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;}
.proposal-review-card span,.proposal-review-card small{color:#8399b6;font-size:11px;}
.proposal-review-card__state{display:inline-flex!important;align-items:center;padding:3px 7px;border-radius:999px;background:#273448!important;color:#c7d6e9!important;font-size:9px!important;font-weight:850;text-transform:uppercase;letter-spacing:.04em;}
.proposal-review-card__state.is-approved{background:rgba(61,166,103,.16)!important;color:#8ad7a9!important;}
.proposal-review-card__state.is-rejected{background:rgba(214,75,85,.15)!important;color:#ff9ba2!important;}
.proposal-review-card__state.is-pending{background:rgba(219,163,52,.16)!important;color:#f0cf83!important;}
.proposal-review-detail{min-width:0;padding:18px;overflow:auto;}
.proposal-review-empty{display:flex;height:100%;min-height:260px;align-items:center;justify-content:center;flex-direction:column;gap:7px;color:#8399b6;text-align:center;}
.proposal-review-empty strong{color:#dce7f5;font-size:16px;}
.proposal-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px;}
.proposal-detail-head h2{margin:4px 0 5px;color:#edf4ff;font-size:21px;}
.proposal-detail-head p{margin:0;color:#8da3c0;font-size:12px;}
.proposal-note,.proposal-conflict{display:flex;flex-direction:column;gap:5px;margin:0 0 14px;padding:12px 14px;border:1px solid #2b405e;border-radius:10px;background:#172233;color:#a9bdd6;font-size:12px;line-height:1.45;}
.proposal-note strong,.proposal-conflict strong{color:#e4edf8;}
.proposal-conflict{border-color:rgba(219,163,52,.42);background:rgba(117,82,18,.12);}
.proposal-conflict strong{color:#f0cf83;}
.proposal-diff-block{margin-top:18px;}
.proposal-diff-block h3{margin:0 0 9px;color:#dfe9f6;font-size:13px;}
.proposal-diff{max-height:440px;overflow:auto;}
.proposal-review-actions{margin-top:18px;padding-top:16px;border-top:1px solid #26364c;}
.proposal-review-actions textarea{width:100%;}
.proposal-review-actions__buttons{display:flex;justify-content:flex-end;gap:10px;margin-top:10px;}
@media (max-width:900px){
.proposal-review-workspace{grid-template-columns:1fr;grid-template-rows:minmax(180px,34vh) minmax(0,1fr);}
.proposal-review-list{border-right:0;border-bottom:1px solid #26364c;}
}
@media (max-width:720px){
.page-sequential-nav{grid-template-columns:1fr;}
.page-sequential-nav__spacer{display:none;}
.page-sequential-nav__item.is-next{text-align:left;align-items:flex-start;}
.page-proposal-modal__dialog{width:calc(100vw - 16px);height:calc(100dvh - 16px);}
.page-proposal-editor{min-height:300px;}
.page-proposal-form__actions{grid-template-columns:1fr;}
.page-proposal-form__actions span{display:none;}
.page-proposal-form__actions button{width:100%;}
.proposal-detail-head{flex-direction:column;}
.proposal-review-actions__buttons{flex-direction:column;}
.proposal-review-actions__buttons button{width:100%;}
}
/* =========================================================
   v124 — mobile audit hardening
   Keep desktop behaviour intact while making touch layouts usable.
   ========================================================= */
.tree-mobile-order{display:none;}
@media (max-width:768px){
/* Header: mobile has icons/actions, not desktop role/name labels. */
.topbar-roles,
    .user-name{display:none !important;}
.user-profile-trigger{min-width:40px;
        min-height:40px;
        padding:4px;
        justify-content:center;}
.logo-top{min-width:0;
        gap:8px;
        font-size:18px;}
.logo-top__mark{width:32px;
        height:32px;}
.notification-center{margin-right:0;}
/* Dynamic mobile browser bars must not hide the bottom of drawers/modals. */
.notification-drawer{height:100dvh;
        max-height:100dvh;
        padding-bottom:env(safe-area-inset-bottom);}
.modal-content,
    .modal-content-large{max-height:calc(100dvh - 24px);}
.page-proposal-modal__dialog{height:calc(100dvh - 16px);
        max-height:calc(100dvh - 16px);}
/* Give ordinary pages more useful width on small screens. */
.main-content{padding-left:12px;
        padding-right:12px;}
.content-page{padding-left:10px;
        padding-right:10px;}
/* Admin page tree: hover-only controls are unusable on touch. */
.admin-pages-tree{padding:10px;
        overflow-x:hidden;}
#pagesTree .tree-item-header{min-width:0;
        flex-wrap:wrap;
        gap:6px;
        padding:9px 8px;}
#pagesTree .tree-item-icon{flex:0 0 20px;}
#pagesTree .tree-item-name{min-width:0;
        flex:1 1 calc(100% - 32px);
        overflow-wrap:anywhere;
        word-break:normal;}
#pagesTree .tree-item-actions{display:flex;
        opacity:1;
        margin-left:26px;
        gap:4px;}
#pagesTree .tree-mobile-order{display:flex;
        gap:4px;}
#pagesTree .tree-item-header > .tree-btn,
    #pagesTree .tree-item-actions .tree-btn,
    #pagesTree .tree-mobile-order .tree-btn{width:36px;
        height:36px;
        min-width:36px;
        min-height:36px;
        flex:0 0 36px;}
#pagesTree .tree-mobile-order__btn:disabled{opacity:.28;
        cursor:default;}
#pagesTree .tree-item-children{margin-left:12px;
        padding-left:8px;}
/* Footer clears home indicator/notch in standalone mobile browsers. */
.site-footer__inner{padding-bottom:calc(14px + env(safe-area-inset-bottom));}
}
@media (max-width:380px){
/* Preserve all header actions even on 320/360px devices. */
.logo-top__text{display:none;}
.top-bar-content{gap:6px;
        padding-left:8px;
        padding-right:8px;}
.global-search:focus-within{left:56px;
        right:96px;}
}
@media (hover:none), (pointer:coarse){
/* Never depend on hover to expose an admin action. */
#pagesTree .tree-item-actions{opacity:1;}
}
/* v125 — password recovery */
.auth-forgot-row{display:flex;justify-content:flex-end;margin-top:7px;}
.auth-forgot-row a,.auth-reset-intro+a,.password-reset-card a{color:#8eb5ff;text-decoration:none;}
.auth-forgot-row a:hover,.password-reset-card a:hover{text-decoration:underline;color:#b8d0ff;}
.auth-reset-intro{margin:-2px 0 18px;color:var(--text-secondary,#98a8bc);font-size:13px;line-height:1.55;}
.password-reset-page{display:flex;justify-content:center;padding:34px 0 48px;}
.password-reset-card{width:min(100%,560px);padding:28px;border:1px solid var(--border-soft);border-radius:14px;background:linear-gradient(180deg,rgba(27,38,54,.98),rgba(18,27,40,.98));box-shadow:0 18px 50px rgba(0,0,0,.18);}
.password-reset-card__eyebrow{margin-bottom:8px;color:#7890ae;font-size:11px;font-weight:750;letter-spacing:.14em;text-transform:uppercase;}
.password-reset-card h1{margin:0 0 12px;color:#fff;font-size:27px;line-height:1.2;}
.password-reset-card__lead{margin:0 0 22px;color:#9aabc0;font-size:14px;line-height:1.58;}
.password-reset-form .btn-submit{width:100%;margin-top:3px;}
.password-reset-form__message{display:none;margin-top:15px;padding:11px 12px;border-radius:9px;font-size:13px;line-height:1.5;}
.password-reset-form__message.is-error,.password-reset-form__message.is-success{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.password-reset-form__message.is-error{border:1px solid rgba(238,92,92,.25);background:rgba(238,92,92,.09);color:#ffc3c3;}
.password-reset-form__message.is-success{border:1px solid rgba(74,187,124,.25);background:rgba(74,187,124,.09);color:#c4f3d8;}
.password-reset-login-btn{flex:0 0 auto;border:0;background:transparent;color:#9fc0ff;font:inherit;font-weight:750;cursor:pointer;padding:2px 0;}
.password-reset-login-btn:hover{text-decoration:underline;}
.password-reset-invalid{padding:15px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.025);}
.password-reset-invalid p{margin:0 0 15px;color:#aab7c9;font-size:14px;line-height:1.55;}
.password-reset-card__back{margin:19px 0 0;text-align:center;font-size:13px;}
@media (max-width:640px){
.password-reset-page{padding:12px 0 28px;}
.password-reset-card{padding:21px 17px;border-radius:12px;}
.password-reset-card h1{font-size:24px;}
.password-reset-form__message.is-error,.password-reset-form__message.is-success{align-items:flex-start;flex-direction:column;}
}
/* =========================================================
   v129 — compact groups table + flatter human profile layout
   ========================================================= */
#groupsTable{min-width:660px;
    width:100%;}
#groupsTable .groups-name-cell{min-width:180px;
    white-space:normal;}
#groupsTable .groups-default-label{color:#8292a8;
    font-size:11px;
    font-weight:600;
    white-space:nowrap;}
/* Owner profile editor no longer reserves an empty personal-data column. */
/* Profile: fewer nested rounded cards, more ordinary section hierarchy. */
@media (max-width:700px){
#groupsTable{min-width:620px;}
}
/* v131 — registration nickname is separate from approved profile identity. */
/* =========================================================
   v132 — groups table: give the group name the flexible space
   ========================================================= */
#groupsTable{table-layout:fixed;
    min-width:700px;}
#groupsTable th:nth-child(1),
#groupsTable td:nth-child(1){width:56px;
    min-width:56px;
    max-width:56px;}
#groupsTable th:nth-child(2),
#groupsTable td:nth-child(2){width:auto;}
#groupsTable th:nth-child(3),
#groupsTable td:nth-child(3){width:100px;
    padding-left:10px;
    padding-right:10px;
    white-space:nowrap;}
#groupsTable th:nth-child(4),
#groupsTable td:nth-child(4){width:82px;
    padding-left:10px;
    padding-right:10px;
    white-space:nowrap;}
#groupsTable th:nth-child(5),
#groupsTable td:nth-child(5){width:90px;
    padding-left:10px;
    padding-right:10px;
    white-space:nowrap;}
#groupsTable th:nth-child(6),
#groupsTable td:nth-child(6){width:84px;
    padding-left:8px;
    padding-right:8px;
    white-space:nowrap;}
#groupsTable .groups-name-cell{min-width:0;
    overflow-wrap:anywhere;}
#groupsTable td:nth-child(6) .table-actions{justify-content:center;
    flex-wrap:nowrap;}
@media (max-width:700px){
#groupsTable{min-width:700px;}
}
/* =========================================================
   v138 — sidebar application shortcut + standalone /apply landing
   ========================================================= */
/* The application shortcut stays above the scrolling navigation.
   Home itself remains in its normal Community category. */
.sidebar-apply-shortcut{
    position:sticky;
    top:0;
    z-index:12;
    display:block!important;
    flex:0 0 auto;
    min-height:64px;
    padding:14px 0 10px;
    overflow:visible;
    background:var(--bg-primary);
    border-bottom:1px solid rgba(68,131,226,.16);
}
.sidebar-apply-shortcut .nav-link{margin:0 18px;
    width:calc(100% - 36px);}
.sidebar-nav{padding-top:14px;}
.mobile-nav-sheet .sidebar-apply-shortcut{
    position:sticky;
    top:0;
    z-index:8;
    padding:8px 0 12px;
    border-bottom:1px solid rgba(68,131,226,.18);
    margin-bottom:12px;
    background:var(--bg-primary);
}
/* A small bridge replaces the old application form embedded into Home. */
/* Standalone application route intentionally drops the information-system
   sidebar and search chrome. Auth/account controls in the top bar remain. */
@keyframes apply-marquee-run{to{transform:translateX(-50%);}}
/* The real application form remains the existing tested business logic, but
   is visually flattened for this dedicated landing. */
.page-apply .home-application-section{width:100%;
    max-width:none;
    margin:0;
    padding:68px 32px 120px;
    background:#111822;
    border-top:1px solid rgba(68,131,226,.16);}
.page-apply .home-application-section .apply-wrap{width:min(1040px,100%);
    max-width:1040px;
    margin:0 auto;}
.page-apply .home-application-section .steps-section{margin:0 0 74px;
    padding:0;
    border:0;}
.page-apply .home-application-section .steps-section > h2{margin:0 0 28px;
    font-size:clamp(28px,3.4vw,44px);
    line-height:1.05;
    letter-spacing:-.035em;}
@media (max-width:680px){
.sidebar-apply-shortcut{display:block;}
.page-apply .home-application-section{padding:54px 18px 84px;}
}
@media (max-width:680px){
.mobile-nav-sheet .sidebar-apply-shortcut{display:block;}
}
/* =========================================================
   v138 — /apply: dark standalone application portal
   ========================================================= */
/* Application workflow: same mechanics, dark standalone presentation. */
.page-apply .home-application-section{width:100%;
    max-width:none;
    margin:64px 0 0;
    padding:0;
    border:0;
    background:#000;
    color:#f4f4f4;}
.page-apply .home-application-section .apply-wrap{width:100%;
    max-width:none;
    margin:0;}
/* v139: focused application progress, media captions, simplified Home. */


/* v151 — per-page proposal setting */
#pageModal .page-setting-divider{
    height:1px;
    margin:18px 0;
    background:rgba(255,255,255,.08);
}
#pageModal .page-setting-toggle{
    display:grid;
    grid-template-columns:44px minmax(0,1fr);
    gap:12px;
    align-items:start;
    margin:0;
    cursor:pointer;
    user-select:none;
}
#pageModal .page-setting-toggle > input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}
#pageModal .page-setting-toggle__control{
    position:relative;
    display:block;
    width:42px;
    height:24px;
    margin-top:1px;
    border:1px solid #344158;
    border-radius:7px;
    background:#111923;
    transition:.16s ease;
}
#pageModal .page-setting-toggle__control > span{
    position:absolute;
    top:3px;
    left:3px;
    width:16px;
    height:16px;
    border-radius:4px;
    background:#8490a2;
    transition:.16s ease;
}
#pageModal .page-setting-toggle > input:checked + .page-setting-toggle__control{
    border-color:#365e9e;
    background:#22375c;
}
#pageModal .page-setting-toggle > input:checked + .page-setting-toggle__control > span{
    transform:translateX(18px);
    background:#659ff3;
}
#pageModal .page-setting-toggle > input:focus-visible + .page-setting-toggle__control{
    box-shadow:0 0 0 3px rgba(101,159,243,.22);
}
#pageModal .page-setting-toggle__copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:5px;
}
#pageModal .page-setting-toggle__copy strong{
    color:var(--text-primary);
    font-size:13px;
    line-height:1.35;
}
#pageModal .page-setting-toggle__copy small{
    color:var(--text-muted);
    font-size:12px;
    line-height:1.45;
    font-weight:400;
}

/* v160: unified member identity display */
.member-name-stack { display: inline-flex; min-width: 0; flex-direction: column; gap: 2px; }
.member-name-primary { min-width: 0; overflow-wrap: anywhere; }
.member-name-secondary { color: var(--text-secondary, #9aa4b5); font-size: 12px; font-weight: 500; line-height: 1.25; }
.profile-approved-name__label { color: var(--text-secondary, #9aa4b5); font-weight: 500; }
/* v166 member targeted Discord sync */
.member-form-actions{display:flex;justify-content:flex-end;gap:10px;align-items:center;margin-top:18px}.member-discord-sync{margin-top:18px;padding:12px 0;border-top:1px solid var(--border-color,#29313d);border-bottom:1px solid var(--border-color,#29313d)}.member-discord-sync__summary{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-bottom:10px}.member-discord-sync__summary span{color:var(--muted-color,#929cab);font-size:13px}

/* v178 — administrator email verification in member profile */
#editMemberModal .member-email-verification{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:34px;margin-top:8px;padding:8px 10px;border:1px solid var(--border-color,#29313d);border-radius:10px;background:rgba(255,255,255,.015)}
#editMemberModal .member-email-verification__status{font-size:13px;font-weight:600;color:var(--text-muted,#929cab)}
#editMemberModal .member-email-verification.is-verified{border-color:rgba(76,175,80,.28);background:rgba(76,175,80,.055)}
#editMemberModal .member-email-verification.is-verified .member-email-verification__status{color:#7bcf86}
#editMemberModal .member-email-verification.is-unverified{border-color:rgba(255,193,7,.24);background:rgba(255,193,7,.04)}
#editMemberModal .member-email-verify-btn{flex:0 0 auto;padding:7px 10px;font-size:12px}
@media (max-width:720px){#editMemberModal .member-email-verification{align-items:stretch;flex-direction:column}.member-email-verify-btn{width:100%}}

/* ===== Rich video link previews (v182) ===== */
.video-preview-card{display:block;max-width:560px;margin:10px 0 20px;border:1px solid var(--border-color);border-radius:10px;background:var(--bg-tertiary);overflow:hidden;color:var(--text-primary);text-decoration:none;box-shadow:0 8px 22px rgba(0,0,0,.18);}
.video-preview-card:hover{border-color:var(--accent-blue);text-decoration:none;transform:translateY(-1px);box-shadow:var(--shadow-sm);}
.video-preview-card__body{display:block;padding:13px 15px 12px;}
.video-preview-card__provider{display:block;margin-bottom:4px;color:var(--text-muted);font-size:12px;font-weight:600;letter-spacing:.01em;}
.video-preview-card__title{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:15px;line-height:1.35;color:var(--text-primary);}
.video-preview-card__author{display:block;margin-top:5px;color:var(--text-secondary);font-size:12px;line-height:1.35;}
.video-preview-card__thumb{position:relative;display:block;aspect-ratio:16/9;background:#0d121a;overflow:hidden;}
.video-preview-card__thumb img{display:block;width:100%;height:100%;object-fit:cover;}
.video-preview-card__play{position:absolute;left:50%;top:50%;width:54px;height:38px;transform:translate(-50%,-50%);border-radius:10px;background:rgba(0,0,0,.76);box-shadow:0 3px 14px rgba(0,0,0,.35);}
.video-preview-card__play span{position:absolute;left:21px;top:10px;width:0;height:0;border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:15px solid #fff;}
@media (max-width:640px){.video-preview-card{max-width:100%;}.video-preview-card__body{padding:11px 12px 10px;}.video-preview-card__title{font-size:14px;}}