.bar { position: fixed; top: 0; right: 0; left: 0; z-index: 100; display: flex; align-items: center; justify-content: flex-end; padding: 8px 24px; background: rgba(10, 10, 15, 0.85); backdrop-filter: blur(8px); border-bottom: 1px solid var(--color-border-input-bar); } .userSection { display: flex; align-items: center; gap: 10px; } .avatar { width: 28px; height: 28px; border-radius: 50%; background: var(--color-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 600; } .username { color: var(--color-text-primary); font-size: 13px; font-weight: 500; } .quota { color: var(--color-text-secondary); font-size: 12px; padding: 2px 8px; background: rgba(255, 255, 255, 0.04); border-radius: 4px; } .actions { display: flex; align-items: center; gap: 8px; margin-left: 16px; } .adminBtn { padding: 4px 12px; background: transparent; border: 1px solid var(--color-border-input-bar); border-radius: 6px; color: var(--color-primary); font-size: 12px; cursor: pointer; transition: background 0.2s; } .adminBtn:hover { background: var(--color-bg-hover); } .logoutBtn { padding: 4px 12px; background: transparent; border: 1px solid var(--color-border-input-bar); border-radius: 6px; color: var(--color-text-secondary); font-size: 12px; cursor: pointer; transition: background 0.2s; } .logoutBtn:hover { background: var(--color-bg-hover); } .profileBtn { padding: 4px 12px; background: transparent; border: 1px solid var(--color-border-input-bar); border-radius: 6px; color: var(--color-text-secondary); font-size: 12px; cursor: pointer; transition: background 0.2s; } .profileBtn:hover { background: var(--color-bg-hover); color: var(--color-primary); }