/* BLACK MANAGER — общая шапка и фирменные переменные (классы bm-*) */
:root { --bm-bg:#000000; --bm-fg:#f4f4f5; --bm-dim:#9a9aa3; --bm-mute:#5f5f68; --bm-line:rgba(255,255,255,0.09); --bm-acc:#c6ff3d; --bm-acc2:#d8ff7d; --bm-vk:#0077ff; --bm-nav-h:72px; }
body.bm-lock { overflow:hidden; }

.bm-nav { position:sticky; top:0; z-index:200; background:rgba(5,5,5,0.86); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); border-bottom:1px solid var(--bm-line); }
.bm-nav-in > * { min-width:0; }
.bm-nav-in { position:relative; max-width:1500px; margin:0 auto; height:var(--bm-nav-h); padding:0 clamp(16px, 4vw, 56px); display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:24px; }
.bm-logo { font-family:'Space Mono','JetBrains Mono',ui-monospace,monospace; font-weight:700; font-size:15px; letter-spacing:0.16em; text-transform:uppercase; color:var(--bm-fg); text-decoration:none; white-space:nowrap; }
.bm-logo i { font-style:normal; color:var(--bm-mute); margin:0 1px; }

.bm-links { display:flex; justify-content:center; gap:clamp(14px, 2vw, 40px); min-width:0; }
.bm-links a { font-family:'Inter',system-ui,sans-serif; font-size:13px; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; color:var(--bm-dim); text-decoration:none; padding:8px 0; border-bottom:1px solid transparent; transition:color .2s, border-color .2s; white-space:nowrap; }
.bm-links a:hover { color:var(--bm-fg); }
.bm-links a.active { color:var(--bm-fg); border-bottom-color:var(--bm-acc); }

.bm-right { display:flex; align-items:center; gap:12px; justify-content:flex-end; }
.bm-btn { display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 18px; border-radius:4px; font-family:'Inter',system-ui,sans-serif; font-size:13px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; text-decoration:none; cursor:pointer; transition:all .2s; white-space:nowrap; }
.bm-btn-in { color:var(--bm-fg); border:1px solid rgba(255,255,255,0.28); background:rgba(255,255,255,0.03); }
.bm-btn-in:hover { border-color:var(--bm-vk); background:rgba(0,119,255,0.14); }
.bm-btn-out { color:#f87171; border:1px solid rgba(248,113,113,0.5); background:rgba(248,113,113,0.06); }
.bm-btn-out:hover { background:rgba(248,113,113,0.16); }
.bm-user { display:inline-flex; align-items:center; gap:10px; text-decoration:none; color:var(--bm-dim); }
.bm-user img, .bm-user-fb { width:34px; height:34px; border-radius:50%; object-fit:cover; flex:none; border:1px solid var(--bm-line); }
.bm-user-fb { display:inline-flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; color:var(--bm-acc2); background:rgba(198,255,61,0.2); }
.bm-id { font-family:'Space Mono','JetBrains Mono',ui-monospace,monospace; font-size:12px; letter-spacing:0.06em; color:var(--bm-mute); }
.bm-user:hover .bm-id { color:var(--bm-fg); }

.bm-burger { display:none; width:42px; height:40px; border:1px solid var(--bm-line); border-radius:4px; background:rgba(255,255,255,0.03); cursor:pointer; padding:0; flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.bm-burger span { display:block; width:18px; height:2px; background:var(--bm-fg); transition:transform .25s, opacity .2s; }
.bm-nav.open .bm-burger span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.bm-nav.open .bm-burger span:nth-child(2) { opacity:0; }
.bm-nav.open .bm-burger span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

@media (max-width:1180px) {
    .bm-nav-in { grid-template-columns:1fr auto; }
    .bm-burger { display:inline-flex; }
    .bm-links { position:fixed; left:0; right:0; top:var(--bm-nav-h); bottom:0; flex-direction:column; justify-content:flex-start; gap:0; padding:12px clamp(16px,4vw,56px) 40px; background:rgba(5,5,5,0.97); overflow-y:auto; transform:translateY(-8px); opacity:0; visibility:hidden; transition:opacity .2s, transform .2s, visibility .2s; }
    .bm-nav.open .bm-links { opacity:1; visibility:visible; transform:none; }
    .bm-links a { font-size:16px; padding:18px 0; border-bottom:1px solid var(--bm-line); }
    .bm-links a.active { border-bottom-color:var(--bm-acc); }
}
@media (max-width:560px) {
    .bm-nav-in { gap:10px; }
    .bm-logo { font-size:13px; letter-spacing:0.1em; }
    .bm-id { display:none; }
    .bm-btn { height:38px; padding:0 14px; font-size:12px; }
}
@media (max-width:380px) { .bm-logo { font-size:12px; letter-spacing:0.06em; } .bm-btn-out { padding:0 10px; } }
